[gnome-shell/gbsneto/40-stuff: 30/68] overviewControls: Use adjustment to control layout

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

commit d5de1b30713ea01022b2e202520f2b663bfeb484
Author: Georges Basile Stavracas Neto <georges stavracas gmail com>
Date:   Wed Dec 30 17:32:03 2020 -0300

    overviewControls: Use adjustment to control layout
    
    Right now, the adjustment is fixed at ControlsState.WINDOW_PICKER,
    but soon it will be propagated to ViewSelector to control the
    transitions.

 js/ui/overviewControls.js | 31 ++++++++++++++++++++++++++++---
 1 file changed, 28 insertions(+), 3 deletions(-)
---
diff --git a/js/ui/overviewControls.js b/js/ui/overviewControls.js
index dd2404d958..5a606ba977 100644
--- a/js/ui/overviewControls.js
+++ b/js/ui/overviewControls.js
@@ -12,6 +12,12 @@ var SIDE_CONTROLS_ANIMATION_TIME = Overview.ANIMATION_TIME;
 
 const DASH_HEIGHT_PERCENTAGE = 0.15;
 
+var ControlsState = {
+    HIDDEN: 0,
+    WINDOW_PICKER: 1,
+    APP_GRID: 2,
+};
+
 var DashFader = GObject.registerClass(
 class DashFader extends St.Bin {
     _init(dash) {
@@ -48,12 +54,15 @@ class DashFader extends St.Bin {
 
 var ControlsManagerLayout = GObject.registerClass(
 class ControlsManagerLayout extends Clutter.BinLayout {
-    _init(searchEntry, viewSelector, dash) {
+    _init(searchEntry, viewSelector, dash, adjustment) {
         super._init();
 
+        this._adjustment = adjustment;
         this._searchEntry = searchEntry;
         this._viewSelector = viewSelector;
         this._dash = dash;
+
+        adjustment.connect('notify::value', () => this.layout_changed());
     }
 
     vfunc_set_container(container) {
@@ -87,9 +96,18 @@ class ControlsManagerLayout extends Clutter.BinLayout {
         availableHeight -= dashHeight + spacing;
 
         // ViewSelector
+        const initialBox = new Clutter.ActorBox();
+        initialBox.set_origin(0, 0);
+        initialBox.set_size(width, height);
+
         childBox.set_origin(0, searchHeight + spacing);
         childBox.set_size(width, availableHeight);
-        this._viewSelector.allocate(childBox);
+
+        const page = this._viewSelector.getActivePage();
+        const progress = page === ViewSelector.ViewPage.SEARCH
+            ? 1 : Math.min(this._adjustment.value, 1);
+        const viewSelectorBox = initialBox.interpolate(childBox, progress);
+        this._viewSelector.allocate(viewSelectorBox);
     }
 });
 
@@ -135,6 +153,13 @@ class ControlsManager extends St.Widget {
             upper: workspaceManager.n_workspaces,
         });
 
+        this._adjustment = new St.Adjustment({
+            actor: this,
+            value: ControlsState.WINDOW_PICKER,
+            lower: ControlsState.HIDDEN,
+            upper: ControlsState.APP_GRID,
+        });
+
         this._nWorkspacesNotifyId =
             workspaceManager.connect('notify::n-workspaces',
                 this._updateAdjustment.bind(this));
@@ -147,7 +172,7 @@ class ControlsManager extends St.Widget {
         this.add_child(this.viewSelector);
 
         this.layout_manager = new ControlsManagerLayout(searchEntryBin,
-            this.viewSelector, this._dashFader);
+            this.viewSelector, this._dashFader, this._adjustment);
 
         this.connect('destroy', this._onDestroy.bind(this));
     }