[gnome-shell/gbsneto/custom-icon-positions: 23/44] appDisplay: Nudge target item towards its new position

[Georges Basile Stavracas Neto <gbsneto src gnome org>]

commit 358cba69d7602866640f9ef22265c64b9a4e65fb
Author: Georges Basile Stavracas Neto <georges stavracas gmail com>
Date:   Mon Jun 22 18:46:59 2020 -0300

    appDisplay: Nudge target item towards its new position
    
    Make the icon being hovered slightly nudge towards its final
    position, some sort of "preview" of what will happen. This
    avoids a surprising change of the grid.
    
    https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/1284

 js/ui/appDisplay.js | 38 ++++++++++++++++++++++++++++++++++++++
 1 file changed, 38 insertions(+)
---
diff --git a/js/ui/appDisplay.js b/js/ui/appDisplay.js
index c51194f098..69c2765d2b 100644
--- a/js/ui/appDisplay.js
+++ b/js/ui/appDisplay.js
@@ -571,6 +571,7 @@ class AppDisplay extends BaseAppView {
         this._lastOvershootTimeoutId = 0;
         this._delayedMoveId = 0;
         this._targetDropPosition = null;
+        this._nudgedItem = null;
 
         Main.overview.connect('hidden', () => this.goToPage(0));
 
@@ -828,6 +829,38 @@ class AppDisplay extends BaseAppView {
         this._targetDropPosition = null;
     }
 
+    _nudgeItem(item, dragLocation) {
+        if (this._nudgedItem)
+            this._removeNudge();
+
+        const params = {
+            duration: DELAYED_MOVE_TIMEOUT,
+            mode: Clutter.AnimationMode.EASE_IN_OUT_QUAD,
+        };
+
+        const rtl = this.get_text_direction() === Clutter.TextDirection.RTL;
+        const nudgeOffset = item.width / 4;
+        if (dragLocation === IconGrid.DragLocation.START_EDGE)
+            params.translation_x = nudgeOffset * (rtl ? -1 : 1);
+        else if (dragLocation === IconGrid.DragLocation.END_EDGE)
+            params.translation_x = -nudgeOffset * (rtl ? -1 : 1);
+
+        item.ease(params);
+        this._nudgedItem = item;
+    }
+
+    _removeNudge() {
+        if (!this._nudgedItem)
+            return;
+
+        this._nudgedItem.ease({
+            translation_x: 0,
+            duration: DELAYED_MOVE_TIMEOUT,
+            mode: Clutter.AnimationMode.EASE_OUT_QUAD,
+        });
+        this._nudgedItem = null;
+    }
+
     _maybeMoveItem(dragEvent) {
         const [success, x, y] =
             this._grid.transform_stage_point(dragEvent.x, dragEvent.y);
@@ -843,6 +876,7 @@ class AppDisplay extends BaseAppView {
             item === source ||
             dragLocation === IconGrid.DragLocation.ON_ICON) {
             this._removeDelayedMove();
+            this._removeNudge();
             return;
         }
 
@@ -858,10 +892,13 @@ class AppDisplay extends BaseAppView {
             this._delayedMoveId = GLib.timeout_add(GLib.PRIORITY_DEFAULT,
                 DELAYED_MOVE_TIMEOUT, () => {
                     this.moveItem(source, page, position);
+                    this._removeNudge();
                     this._targetDropPosition = null;
                     this._delayedMoveId = 0;
                     return GLib.SOURCE_REMOVE;
                 });
+
+            this._nudgeItem(item, dragLocation);
         }
     }
 
@@ -950,6 +987,7 @@ class AppDisplay extends BaseAppView {
         }
 
         this._resetOvershoot();
+        this._removeNudge();
     }
 
     _canAccept(source) {