feat(wim ags overview): force consistent open anim

devices/wim/config/ags/js/overview/clients.js

@@ -94,7 +94,7 @@ const Client = (client, active, clients, box) => {
 
             child: Icon({
                 className: `window ${active}`,
-                css: `${IconStyle(client) }font-size: 10px;`,
+                css: `${IconStyle(client)} font-size: 10px;`,
                 icon: client.class,
             }),
         }),

devices/wim/config/ags/js/overview/main.js

@@ -9,15 +9,10 @@ import { Highlighter, updateCurrentWorkspace } from './current-workspace.js';
 import { updateClients } from './clients.js';
 
 
-const update = (box, highlight) => {
+
-    getWorkspaces(box);
-    updateWorkspaces(box);
-    updateClients(box);
-    updateCurrentWorkspace(box, highlight);
-};
 
 // TODO: have a 'page' for each monitor, arrows on both sides to loop through
-export default () => {
+export const Overview = () => {
     const highlighter = Highlighter();
 
     const mainBox = Box({
@@ -50,7 +45,7 @@ export default () => {
                 return;
             }
 
-            update(self, highlighter);
+            self.update();
         }]],
 
         properties: [
@@ -58,34 +53,49 @@ export default () => {
         ],
     });
 
+    mainBox.update = () => {
+        getWorkspaces(mainBox);
+        updateWorkspaces(mainBox);
+        updateClients(mainBox);
+        updateCurrentWorkspace(mainBox, highlighter);
+    };
+
+    const widget = Overlay({
+        overlays: [highlighter, mainBox],
+
+        child: Box({
+            className: 'overview',
+            css: `
+                min-height: ${mainBox.get_allocated_height()}px;
+                min-width: ${mainBox.get_allocated_width()}px;
+            `,
+        }),
+
+        // TODO: throttle his?
+        connections: [['get-child-position', (self, ch) => {
+            if (ch === mainBox) {
+                self.child.setCss(`
+                    transition: min-height 0.2s ease, min-width 0.2s ease;
+                    min-height: ${mainBox.get_allocated_height()}px;
+                    min-width: ${mainBox.get_allocated_width()}px;
+                `);
+            }
+        }]],
+    });
+
+    widget.getChild = () => mainBox;
+
+    return widget;
+};
+
+export default () => {
     const window = PopupWindow({
         name: 'overview',
         closeOnUnfocus: 'none',
-        onOpen: () => update(mainBox, highlighter),
+        onOpen: () => {
-
+            window.setChild(Overview());
-        child: Overlay({
+            window.getChild().getChild().update();
-            overlays: [highlighter, mainBox],
+        },
-
-            child: Box({
-                className: 'overview',
-                css: `
-                    min-height: ${mainBox.get_allocated_height()}px;
-                    min-width: ${mainBox.get_allocated_width()}px;
-                `,
-            }),
-
-            // TODO: throttle his?
-            connections: [['get-child-position', (self, ch) => {
-                if (ch === mainBox) {
-                    self.child.setCss(`
-                        transition: min-height 0.2s ease, min-width 0.2s ease;
-                        min-height: ${mainBox.get_allocated_height()}px;
-                        min-width: ${mainBox.get_allocated_width()}px;
-                    `);
-                }
-            }]],
-        }),
-
     });
 
     return window;