From f30d9f32c3f664fc6f5055c6bec3b59e36607fb1 Mon Sep 17 00:00:00 2001
From: Jan Blackquill <uhhadd@gmail.com>
Date: Wed, 20 Jan 2021 13:50:50 -0500
Subject: [PATCH] [applets/systemtray]: Make system tray sliding spatially
 consistent

Before this patch, the system tray always animated sliding to the left when switching between items. Now system tray items will slide according to their order on the panel. Clicking an item to the left of the active icon will cause the sliding animation to slide that direction as well, and same for the an item to the right of the active item.
---
 .../contents/ui/PlasmoidPopupsContainer.qml      | 16 +++++++++++++---
 .../package/contents/ui/SystemTrayState.qml      | 16 +++++++++++++++-
 .../package/contents/ui/items/PlasmoidItem.qml   |  2 +-
 3 files changed, 29 insertions(+), 5 deletions(-)

diff --git a/applets/systemtray/package/contents/ui/PlasmoidPopupsContainer.qml b/applets/systemtray/package/contents/ui/PlasmoidPopupsContainer.qml
index bae4c1053..48b4b89c7 100644
--- a/applets/systemtray/package/contents/ui/PlasmoidPopupsContainer.qml
+++ b/applets/systemtray/package/contents/ui/PlasmoidPopupsContainer.qml
@@ -85,15 +85,25 @@ StackView {
     }
 
     delegate: StackViewDelegate {
+        id: transitioner
         function transitionFinished(properties) {
             properties.exitItem.opacity = 1
         }
+        property bool goingLeft: {
+            const unFlipped = systemTrayState.oldVisualIndex < systemTrayState.newVisualIndex
+
+            if (Qt.application.layoutDirection == Qt.LeftToRight) {
+                return unFlipped
+            } else {
+                return !unFlipped
+            }
+        }
         replaceTransition: StackViewTransition {
             ParallelAnimation {
                 PropertyAnimation {
                     target: enterItem
                     property: "x"
-                    from: enterItem.width
+                    from: transitioner.goingLeft ? enterItem.width : -enterItem.width
                     to: 0
                     easing.type: Easing.InOutQuad
                     duration: PlasmaCore.Units.shortDuration
@@ -112,9 +122,9 @@ StackView {
                     target: exitItem
                     property: "x"
                     from: 0
-                    to: -exitItem.width
+                    to: transitioner.goingLeft ? -exitItem.width : exitItem.width
                     easing.type: Easing.InOutQuad
-                    duration: PlasmaCore.Units.shortDuration
+                    duration: units.longDuration
                 }
                 PropertyAnimation {
                     target: exitItem
diff --git a/applets/systemtray/package/contents/ui/SystemTrayState.qml b/applets/systemtray/package/contents/ui/SystemTrayState.qml
index 6134b63aa..edf9ca396 100644
--- a/applets/systemtray/package/contents/ui/SystemTrayState.qml
+++ b/applets/systemtray/package/contents/ui/SystemTrayState.qml
@@ -34,7 +34,21 @@ QtObject {
     //this is to suppress expanded state change during Plasma startup
     property bool acceptExpandedChange: false
 
-    function setActiveApplet(applet) {
+    // These properties allow us to keep track of where the expanded applet
+    // was and is on the panel, allowing PlasmoidPopupContainer.qml to animate
+    // depending on their locations.
+    property int oldVisualIndex: -1
+    property int newVisualIndex: -1
+
+    function setActiveApplet(applet, visualIndex) {
+        if (visualIndex === undefined) {
+            oldVisualIndex = -1
+            newVisualIndex = -1
+        } else {
+            oldVisualIndex = newVisualIndex
+            newVisualIndex = visualIndex
+        }
+
         const oldApplet = activeApplet
         activeApplet = applet
         if (oldApplet && oldApplet !== applet) {
diff --git a/applets/systemtray/package/contents/ui/items/PlasmoidItem.qml b/applets/systemtray/package/contents/ui/items/PlasmoidItem.qml
index b773ba51b..5592e5783 100644
--- a/applets/systemtray/package/contents/ui/items/PlasmoidItem.qml
+++ b/applets/systemtray/package/contents/ui/items/PlasmoidItem.qml
@@ -121,7 +121,7 @@ AbstractItem {
 
         function onExpandedChanged(expanded) {
             if (expanded) {
-                systemTrayState.setActiveApplet(applet)
+                systemTrayState.setActiveApplet(applet, model.row)
                 plasmoidContainer.activated()
             }
         }