From fc31b43ee61898147332d3242787a365bd0fcc5f Mon Sep 17 00:00:00 2001
From: 2 * r + 2 * t <61896496+soramanew@users.noreply.github.com>
Date: Wed, 9 Jul 2025 00:03:55 +1000
Subject: internal: better ripple anim

Fade after expansion, also correctly calculate ripple size
Also fix ripples triggering on disabled buttons
---
 modules/dashboard/Tabs.qml | 37 +++++++++++++++++--------------------
 widgets/StateLayer.qml     | 39 ++++++++++++++++++++-------------------
 2 files changed, 37 insertions(+), 39 deletions(-)

diff --git a/modules/dashboard/Tabs.qml b/modules/dashboard/Tabs.qml
index b7aca5f..05f574a 100644
--- a/modules/dashboard/Tabs.qml
+++ b/modules/dashboard/Tabs.qml
@@ -119,8 +119,7 @@ Item {
                 rippleAnim.y = event.y - stateY;
 
                 const dist = (ox, oy) => ox * ox + oy * oy;
-                const stateEndY = stateY + stateWrapper.height;
-                rippleAnim.radius = Math.sqrt(Math.max(dist(0, stateY), dist(0, stateEndY), dist(width, stateY), dist(width, stateEndY)));
+                rippleAnim.radius = Math.sqrt(Math.max(dist(event.x, event.y + stateY), dist(event.x, stateWrapper.height - event.y), dist(width - event.x, event.y + stateY), dist(width - event.x, stateWrapper.height - event.y)));
 
                 rippleAnim.restart();
             }
@@ -151,25 +150,23 @@ Item {
                 PropertyAction {
                     target: ripple
                     property: "opacity"
-                    value: 0.1
+                    value: 0.08
                 }
-                ParallelAnimation {
-                    Anim {
-                        target: ripple
-                        properties: "implicitWidth,implicitHeight"
-                        from: 0
-                        to: rippleAnim.radius * 2
-                        duration: Appearance.anim.durations.large
-                        easing.bezierCurve: Appearance.anim.curves.standardDecel
-                    }
-                    Anim {
-                        target: ripple
-                        property: "opacity"
-                        to: 0
-                        duration: Appearance.anim.durations.large
-                        easing.type: Easing.BezierSpline
-                        easing.bezierCurve: Appearance.anim.curves.standardDecel
-                    }
+                Anim {
+                    target: ripple
+                    properties: "implicitWidth,implicitHeight"
+                    from: 0
+                    to: rippleAnim.radius * 2
+                    duration: Appearance.anim.durations.normal
+                    easing.bezierCurve: Appearance.anim.curves.standardDecel
+                }
+                Anim {
+                    target: ripple
+                    property: "opacity"
+                    to: 0
+                    duration: Appearance.anim.durations.normal
+                    easing.type: Easing.BezierSpline
+                    easing.bezierCurve: Appearance.anim.curves.standard
                 }
             }
 
diff --git a/widgets/StateLayer.qml b/widgets/StateLayer.qml
index 953ee61..06cdc21 100644
--- a/widgets/StateLayer.qml
+++ b/widgets/StateLayer.qml
@@ -19,11 +19,14 @@ MouseArea {
     hoverEnabled: true
 
     onPressed: event => {
+        if (disabled)
+            return;
+
         rippleAnim.x = event.x;
         rippleAnim.y = event.y;
 
         const dist = (ox, oy) => ox * ox + oy * oy;
-        rippleAnim.radius = Math.sqrt(Math.max(dist(0, 0), dist(0, width), dist(width, 0), dist(width, height)));
+        rippleAnim.radius = Math.sqrt(Math.max(dist(event.x, event.y), dist(event.x, height - event.y), dist(width - event.x, event.y), dist(width - event.x, height - event.y)));
 
         rippleAnim.restart();
     }
@@ -50,25 +53,23 @@ MouseArea {
         PropertyAction {
             target: ripple
             property: "opacity"
-            value: 0.1
+            value: 0.08
         }
-        ParallelAnimation {
-            Anim {
-                target: ripple
-                properties: "implicitWidth,implicitHeight"
-                from: 0
-                to: rippleAnim.radius * 2
-                duration: Appearance.anim.durations.large
-                easing.bezierCurve: Appearance.anim.curves.standardDecel
-            }
-            Anim {
-                target: ripple
-                property: "opacity"
-                to: 0
-                duration: Appearance.anim.durations.large
-                easing.type: Easing.BezierSpline
-                easing.bezierCurve: Appearance.anim.curves.standard
-            }
+        Anim {
+            target: ripple
+            properties: "implicitWidth,implicitHeight"
+            from: 0
+            to: rippleAnim.radius * 2
+            duration: Appearance.anim.durations.normal
+            easing.bezierCurve: Appearance.anim.curves.standardDecel
+        }
+        Anim {
+            target: ripple
+            property: "opacity"
+            to: 0
+            duration: Appearance.anim.durations.normal
+            easing.type: Easing.BezierSpline
+            easing.bezierCurve: Appearance.anim.curves.standard
         }
     }
 
-- 
cgit v1.2.3-freya