feat: panel transparency and opacity

luisbocanegra · Sep 11, 2024 · 32ac70b · 32ac70b
1 parent 663dcea
commit 32ac70b
Show file tree

Hide file tree

Showing 2 changed files with 56 additions and 14 deletions.
diff --git a/package/contents/ui/code/utils.js b/package/contents/ui/code/utils.js
@@ -8,7 +8,7 @@ function getRandomColor() {
 
 function isBgManaged(item) {
   let managed = false
-  if (item.children) {
+  if (item?.children) {
     for (let i in item.children) {
       const child = item.children[i];
       if (!child?.luisbocanegraPanelColorizerBgManaged) continue
@@ -45,3 +45,31 @@ function findTrayExpandArrow(item) {
   }
   return null
 }
+
+
+function panelOpacity(panelElement, enabled, panelRealBgOpacity) {
+  for (let i in panelElement.children) {
+    const current = panelElement.children[i]
+
+    if (current.imagePath && current.imagePath.toString().includes("panel-background")) {
+      current.opacity = enabled ? panelRealBgOpacity : 1
+    }
+  }
+}
+
+function dumpProps(obj) {
+  console.error("@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@");
+  console.error(obj);
+  for (var k of Object.keys(obj)) {
+    const val = obj[k]
+    if (typeof val === 'function') continue
+    if (k === 'metaData') continue
+    console.log(k + "=" + val + "\n")
+  }
+}
+
+function toggleTransparency(containmentItem, enabled) {
+  containmentItem.Plasmoid.backgroundHints = enabled
+    ? PlasmaCore.Types.NoBackground
+    : PlasmaCore.Types.DefaultBackground
+}
diff --git a/package/contents/ui/main.qml b/package/contents/ui/main.qml
@@ -24,13 +24,17 @@ PlasmoidItem {
     property bool horizontal: Plasmoid.formFactor === PlasmaCore.Types.Horizontal
     property bool fixedSideMarginEnabled: true
     property int fixedSideMarginSize: 4
+    property bool isEnabled: true
+    property bool panelOriginalBgHidden: true
+    property real panelOriginalOpacity: 1
 
     property Component debugRectComponent: Rectangle {
         property bool luisbocanegraPanelColorizerBgManaged: true
         anchors.fill: parent
         color: "transparent"
         border.color: "cyan"
         border.width: 1
+        opacity: 0.3
     }
 
     fullRepresentation: RowLayout {
@@ -123,6 +127,27 @@ PlasmoidItem {
         return null
     }
 
+    property ContainmentItem containmentItem: {
+        let candidate = main.parent;
+        while (candidate) {
+            if (candidate.toString().indexOf("ContainmentItem_QML") > -1 ) {
+                return candidate;
+            }
+            candidate = candidate.parent;
+        }
+        return null
+    }
+
+    onPanelElementChanged: {
+        if(!panelElement) return
+        Utils.panelOpacity(panelElement, isEnabled, panelOriginalOpacity)
+    }
+
+    onContainmentItemChanged: {
+        if(!containmentItem) return
+        Utils.toggleTransparency(containmentItem, panelOriginalBgHidden)
+    }
+
     onPanelLayoutCountChanged: {
         if (panelLayoutCount === 0) return
         showWidgets(panelLayout)
@@ -176,19 +201,8 @@ PlasmoidItem {
         }
     }
 
-    function dumpProps(obj) {
-        console.error("@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@");
-        console.error(obj);
-        for (var k of Object.keys(obj)) {
-            const val = obj[k]
-            if (typeof val === 'function') continue
-            if (k === 'metaData') continue
-            print(k + "=" + val+"\n")
-        }
-    }
-
     function showPanelBg(panelBg) {
-        dumpProps(panelBg)
-        debugRectComponent.createObject(panelBg, {"z":-1,"opacity": 1, "color": Utils.getRandomColor()});
+        // Utils.dumpProps(panelBg)
+        debugRectComponent.createObject(panelBg, {"z":-1, "color": Utils.getRandomColor()});
     }
 }