feat!: support per widget instance customization

Widget id is now used to customize multiple instances of the same widget separately.
StatusNotifier (tray app icon) doesn't have numeric id so uses -1 placeholder

The affected settings are:

- Force text/icons color cfg_forceForegroundColor.widgets
- Unified background cfg_globalSettings.unifiedBackground
- Preset overrides cfg_globalSettings.configurationOverrides.associations
- Global overrides cfg_configurationOverrides.associations

These settings are now stored as an array instead of key-value

Previously stored key-value for these options is silently ignored and should be converted manually to fit the new format

closes: #124

BREAKING CHANGE: Force text/icons, Unified background, Preset/global overrides now use id to address multiple instances of the same widget separately and should be reconfigured. Also widget ids are unique per panel so the setting needs to be recreated and mantained per panel

Author: luisbocanegra

package/contents/config/main.xml

@@ -44,12 +44,12 @@
     <entry
         name="configurationOverrides"
         type="String">
-        <default>{"overrides": {}, "associations":{}}</default>
+        <default>{"overrides": {}, "associations":[]}</default>
     </entry>
     <entry
         name="forceForegroundColor"
         type="String">
-        <default>{"widgets":{}, "reloadInterval": 250}</default>
+        <default>{"widgets":[], "reloadInterval": 250}</default>
     </entry>
   </group>
 </kcfg>

package/contents/ui/code/globals.js

@@ -154,9 +154,7 @@ const basePadding = {
   },
 }
 
-const baseUnfiedBackground = {
-  "org.kde.plasma.digitalclock": 0
-}
+const baseUnfiedBackground = []
 
 const basePanelConfig = {
   "enabled": false,
@@ -248,31 +246,12 @@ const defaultConfig = {
     "enabled": true,
     "opacity": 1.0
   },
-  "forceForegroundColor": {
-    "widgets": {
-      "com.github.antroids.application-title-bar": {
-        "method": {
-          "mask": false,
-          "multiEffect": false
-        },
-        "reload": true
-      },
-      "org.kde.plasma.appmenu": {
-        "method": {
-          "mask": false,
-          "multiEffect": false
-        },
-        "reload": true
-      }
-    },
-    "reloadInterval": 250
-  },
   "stockPanelSettings": baseStockPanelSettings,
   "configurationOverrides": {
     "overrides": {},
-    "associations": {}
+    "associations": []
   },
-  "unifiedBackground": {}
+  "unifiedBackground": []
 }
 
 const ignoredConfigs = [

package/contents/ui/code/utils.js

@@ -95,12 +95,13 @@ function findWidgets(panelLayout, panelWidgets) {
     // other situations
     if (!child.applet?.plasmoid?.pluginName) continue
     // Utils.dumpProps(child.applet.plasmoid)
+    const id = child.applet.plasmoid.id
     const name = child.applet.plasmoid.pluginName
     const title = child.applet.plasmoid.title
     const icon = child.applet.plasmoid.icon
-    if (panelWidgets.find((item) => item.name === name)) continue
+    if (panelWidgets.find((item) => item.id === id)) continue
     // console.error(name, title, icon)
-    panelWidgets.push({ "name": name, "title": title, "icon": icon, "inTray": false })
+    panelWidgets.push({ "id": id, "name": name, "title": title, "icon": icon, "inTray": false })
   }
   return panelWidgets
 }
@@ -114,25 +115,28 @@ function findWidgetsTray(grid, panelWidgets) {
         const model = item.children[j].model
         // App tray icons
         if (model.itemType === "StatusNotifier") {
-          // dumpProps(model)
+          // in contrast with applet?.plasmoid.id, Id is not actually given by plasma,
+          // but since there should be only a single instance of StatusNotifier per app,
+          // model.Id _should_ be enough for any sane implementation of tray icon
           const name = model.Id
           const title = model.ToolTipTitle !== "" ? model.ToolTipTitle : model.Title
           const icon = model.IconName
           if (panelWidgets.find((item) => item.name === name)) continue
           // console.error(name, title, icon)
-          panelWidgets.push({ "name": name, "title": title, "icon": icon, "inTray": true })
+          panelWidgets.push({ "id": -1, "name": name, "title": title, "icon": icon, "inTray": true })
         }
+        // normal plasmoids in tray
         if (model.itemType === "Plasmoid") {
           const applet = model.applet ?? null
+          const id = applet?.plasmoid.id ?? -1
           const name = applet?.plasmoid.pluginName ?? ""
           const title = applet?.plasmoid.title ?? ""
           const icon = applet?.plasmoid.icon ?? ""
-          if (panelWidgets.find((item) => item.name === name)) continue
+          if (panelWidgets.find((item) => item.id === id)) continue
           // console.error(name, title, icon)
-          panelWidgets.push({ "name": name, "title": title, "icon": icon, "inTray": true })
+          panelWidgets.push({ "id": id, "name": name, "title": title, "icon": icon, "inTray": true })
         }
       }
-      // panelWidgets.add(item)
     }
   }
   // find the expand tray arrow
@@ -143,17 +147,19 @@ function findWidgetsTray(grid, panelWidgets) {
         const name = "org.kde.plasma.systemtray.expand"
         if (panelWidgets.find((item) => item.name === name)) continue
         const title = item.subText || "Show hidden icons"
-        panelWidgets.push({ "name": name, "title": title, "icon": "arrow-down", "inTray": true })
+        panelWidgets.push({ "id": -1, "name": name, "title": title, "icon": "arrow-down", "inTray": true })
       }
     }
   }
   return panelWidgets
 }
 
-function getWidgetName(item) {
+function getWidgetNameAndId(item) {
   let name = null
+  let id = -1
   if (item.applet?.plasmoid?.pluginName) {
     name = item.applet.plasmoid.pluginName
+    id = item.applet.plasmoid.id
   } else {
     for (let i in item.children) {
       if (!(item.children[i].model)) continue
@@ -163,13 +169,14 @@ function getWidgetName(item) {
       } else if (model.itemType === "Plasmoid") {
         const applet = model.applet ?? null
         name = applet?.plasmoid.pluginName ?? null
+        name = applet?.plasmoid.id ?? -1
       }
     }
   }
   // if (name) {
   //   console.error("@@@@ getWidgetName ->", name)
   // }
-  return name
+  return { name, id }
 }
 
 var themeColors = [
@@ -205,11 +212,19 @@ var themeScopes = [
   "Header"
 ]
 
-function getCustomCfg(widgetName, configurationOverrides) {
-  if (!widgetName) return null
+function getWidgetAsocIdx(id, name, config) {
+  console.log("getWidgetAsocIdx()")
+  return config.findIndex((item) => item.id == id && item.name == name)
+}
+
+function getCustomCfg(widgetName, widgetId, configurationOverrides) {
+  if (!widgetId) return null
   var custom = {}
-  if (widgetName in configurationOverrides.associations) {
-    const overrideNames = configurationOverrides.associations[widgetName]
+  configurationOverrides.associations = clearOldWidgetConfig(configurationOverrides.associations)
+  let asocIndex = getWidgetAsocIdx(widgetId, widgetName, configurationOverrides.associations)
+  if (asocIndex !== -1) {
+
+    const overrideNames = configurationOverrides.associations[asocIndex].presets
 
     for (let overrideName of overrideNames) {
       if (!(overrideName in configurationOverrides.overrides)) continue
@@ -251,10 +266,10 @@ function getEffectiveSettings(customSettings, globalSettings) {
   return effectiveSettings
 }
 
-function getItemCfg(itemType, widgetName, config, configurationOverrides) {
+function getItemCfg(itemType, widgetName, widgetId, config, configurationOverrides) {
   let output = { override: false }
-  let custom = getCustomCfg(widgetName, configurationOverrides)
-  let presetOverrides = getCustomCfg(widgetName, config.configurationOverrides)
+  let custom = getCustomCfg(widgetName, widgetId, configurationOverrides)
+  let presetOverrides = getCustomCfg(widgetName, widgetId, config.configurationOverrides)
   if (presetOverrides) {
     if (custom && custom.disabledFallback) {
       custom = getEffectiveSettings(custom, presetOverrides)
@@ -460,3 +475,19 @@ for (var id of panelIds) {
 function evaluateScript(script) {
   runCommand.run("gdbus call --session --dest org.kde.plasmashell --object-path /PlasmaShell --method org.kde.PlasmaShell.evaluateScript '" + script + "'")
 }
+
+function getForceFgWidgetConfig(id, name, config) {
+  return config.find((item) => item.id == id && item.name == name)
+}
+
+function clearOldWidgetConfig(config) {
+  if (Array.isArray(config)) {
+    return config
+  }
+  else return []
+}
+
+function getWidgetConfigIdx(id, name, config) {
+  // console.log("getWidgetConfigIdx()")
+  return config.findIndex((item) => item.id == id && item.name == name)
+}

package/contents/ui/components/WidgetCardCheck.qml

@@ -38,13 +38,23 @@ Kirigami.AbstractCard {
                     }
                 }
             }
-            TextEdit {
-                text: widget.name
-                opacity: 0.6
-                readOnly: true
-                color: Kirigami.Theme.textColor
-                selectedTextColor: Kirigami.Theme.highlightedTextColor
-                selectionColor: Kirigami.Theme.highlightColor
+            RowLayout {
+                TextEdit {
+                    text: widget.name
+                    opacity: 0.6
+                    readOnly: true
+                    color: Kirigami.Theme.textColor
+                    selectedTextColor: Kirigami.Theme.highlightedTextColor
+                    selectionColor: Kirigami.Theme.highlightColor
+                }
+                TextEdit {
+                    text: widget.id
+                    opacity: 0.6
+                    readOnly: true
+                    color: Kirigami.Theme.textColor
+                    selectedTextColor: Kirigami.Theme.highlightedTextColor
+                    selectionColor: Kirigami.Theme.highlightColor
+                }
             }
         }
         Item {

package/contents/ui/components/WidgetCardConfig.qml

@@ -6,13 +6,13 @@ import org.kde.kirigami as Kirigami
 Kirigami.AbstractCard {
     id: root
     property var widget
-    signal addOverride(widget: string, override: string, index: var)
-    signal removeOverride(widget: string, index: int)
-    signal clearOverrides(widget: string)
+    signal addOverride(override: string, index: var)
+    signal removeOverride(index: int)
+    signal clearOverrides()
     property var configOverrides: []
-    property var overrideAssociations: {}
+    property var overrideAssociations: []
     property bool showList: false
-    property var currentOverrides: overrideAssociations[widget.name] || []
+    property var currentOverrides
     property var editingIndex: 0
 
     contentItem: ColumnLayout {
@@ -45,13 +45,23 @@ Kirigami.AbstractCard {
                     }
                 }
             }
-            TextEdit {
-                text: widget.name
-                opacity: 0.6
-                readOnly: true
-                color: Kirigami.Theme.textColor
-                selectedTextColor: Kirigami.Theme.highlightedTextColor
-                selectionColor: Kirigami.Theme.highlightColor
+            RowLayout {
+                TextEdit {
+                    text: widget.name
+                    opacity: 0.6
+                    readOnly: true
+                    color: Kirigami.Theme.textColor
+                    selectedTextColor: Kirigami.Theme.highlightedTextColor
+                    selectionColor: Kirigami.Theme.highlightColor
+                }
+                TextEdit {
+                    text: widget.id
+                    opacity: 0.6
+                    readOnly: true
+                    color: Kirigami.Theme.textColor
+                    selectedTextColor: Kirigami.Theme.highlightedTextColor
+                    selectionColor: Kirigami.Theme.highlightColor
+                }
             }
         }
         Item {
@@ -76,7 +86,7 @@ Kirigami.AbstractCard {
                     Button {
                         icon.name: "edit-clear-symbolic"
                         onClicked: {
-                            removeOverride(widget.name, index)
+                            removeOverride(index)
                         }
                     }
                 }
@@ -86,7 +96,7 @@ Kirigami.AbstractCard {
                 Button {
                     icon.name: "edit-clear-all-symbolic"
                     onClicked: {
-                        clearOverrides(widget.name)
+                        clearOverrides()
                     }
                     text: "Clear"
                     visible: currentOverrides.length !== 0
@@ -124,7 +134,7 @@ Kirigami.AbstractCard {
                     text: modelData
                     onClicked: {
                         showList = false
-                        addOverride(widget.name, text, root.editingIndex)
+                        addOverride(text, root.editingIndex)
                     }
                     Rectangle {
                         color: index & 1 ? "transparent" : Kirigami.Theme.alternateBackgroundColor

package/contents/ui/components/WidgetCardUnifiedBg.qml

@@ -37,13 +37,23 @@ Kirigami.AbstractCard {
                     }
                 }
             }
-            TextEdit {
-                text: widget.name
-                opacity: 0.6
-                readOnly: true
-                color: Kirigami.Theme.textColor
-                selectedTextColor: Kirigami.Theme.highlightedTextColor
-                selectionColor: Kirigami.Theme.highlightColor
+            RowLayout {
+                TextEdit {
+                    text: widget.name
+                    opacity: 0.6
+                    readOnly: true
+                    color: Kirigami.Theme.textColor
+                    selectedTextColor: Kirigami.Theme.highlightedTextColor
+                    selectionColor: Kirigami.Theme.highlightColor
+                }
+                TextEdit {
+                    text: widget.id
+                    opacity: 0.6
+                    readOnly: true
+                    color: Kirigami.Theme.textColor
+                    selectedTextColor: Kirigami.Theme.highlightedTextColor
+                    selectionColor: Kirigami.Theme.highlightColor
+                }
             }
         }
         Item {