version 6: tiles are dynamically split when there is an irregular selection

Author: domferr

package.json

@@ -1,6 +1,6 @@
 {
   "name": "modernwindowmanager",
-  "version": "5.0.0",
+  "version": "6.0.0",
   "author": "Domenico Ferraro <[email protected]>",
   "private": true,
   "license": "GPL v2.0",

resources/metadata.json

@@ -11,7 +11,7 @@
     "45",
     "46"
   ],
-  "version": 5,
+  "version": 6,
   "url": "https://github.com/domferr/modernwindowmanager",
   "settings-schema": "org.gnome.shell.extensions.modernwindowmanager"
 }

src/components/editor/editorDialog.ts

@@ -19,7 +19,6 @@ export default class EditorDialog extends ModalDialog.ModalDialog {
     private readonly _layoutHeight: number = 72;
     private readonly _layoutWidth: number = 128; // 16:9 ratio. -> (16*layoutHeight) / 9 and then rounded to int
     private readonly _gapsSize: number = 3;
-    private readonly _signals: SignalHandling;
 
     private _layoutsBoxLayout: St.BoxLayout;
 
@@ -31,7 +30,7 @@ export default class EditorDialog extends ModalDialog.ModalDialog {
         legend: boolean
     }) {
         super({
-            destroyOnClose: false,
+            destroyOnClose: true,
             styleClass: 'editor-dialog',
         });
 
@@ -59,9 +58,9 @@ export default class EditorDialog extends ModalDialog.ModalDialog {
 
         if (!params.legend) {
             this._drawLayouts({ layouts: GlobalState.get().layouts, ...params });
-            this._signals.connect(GlobalState.get(), "layouts-changed", () => {
+            /*this._signals.connect(GlobalState.get(), GlobalState.SIGNAL_LAYOUTS_CHANGED, () => {
                 this._drawLayouts({ layouts: GlobalState.get().layouts, ...params });
-            });
+            });*/
         }
 
         this.addButton({
@@ -74,8 +73,6 @@ export default class EditorDialog extends ModalDialog.ModalDialog {
         });
 
         if (params.legend) this._makeLegendDialog();
-
-        this.connect("destroy", () => this._signals.disconnect());
     }
 
     private _makeLegendDialog() {
@@ -152,8 +149,8 @@ export default class EditorDialog extends ModalDialog.ModalDialog {
         legend.add_child(suggestion1);
         legend.add_child(suggestion2);
         legend.add_child(suggestion3);
-        this._signals.disconnect();
-        this.contentLayout.remove_all_children();
+        
+        this.contentLayout.destroy_all_children();
         this.contentLayout.add_child(new St.Label({
             text: "How to use the editor", 
             xAlign: Clutter.ActorAlign.CENTER, 
@@ -180,7 +177,7 @@ export default class EditorDialog extends ModalDialog.ModalDialog {
         onNewLayout: () => void
     }) {
         const gaps = Settings.get_inner_gaps(1).top > 0 ? this._gapsSize:0
-        this._layoutsBoxLayout.remove_all_children();
+        this._layoutsBoxLayout.destroy_all_children();
 
         params.layouts.forEach((lay, btnInd) => {
             const box = new St.BoxLayout({ 
@@ -195,6 +192,7 @@ export default class EditorDialog extends ModalDialog.ModalDialog {
                 deleteBtn.child = new St.Icon({ iconName: "edit-delete-symbolic", iconSize: 16 });
                 deleteBtn.connect('clicked', (self) => {
                     params.onDeleteLayout(btnInd, lay);
+                    this._drawLayouts({ ...params, layouts: GlobalState.get().layouts });
                 });
                 box.add_child(deleteBtn);
             }

src/components/editor/layoutEditor.ts

@@ -64,7 +64,6 @@ export default class LayoutEditor extends St.Widget {
     }
 
     public set layout(newLayout: Layout) {
-        debug("set layout");
         // cleanup
         this._sliders.forEach(slider => slider.destroy());
         this._sliders = [];

src/components/layout/LayoutWidget.ts

@@ -73,7 +73,7 @@ export default class LayoutWidget<TileType extends TilePreview> extends St.Widge
         containerRect: Mtk.Rectangle, 
         innerGaps: Clutter.Margin, 
         outerGaps: Clutter.Margin
-    }>) {
+    }>): boolean {
         var trigger_relayout = this._previews.length === 0;
         if (params?.innerGaps) {
             this._innerGaps = params.innerGaps.copy();
@@ -94,15 +94,21 @@ export default class LayoutWidget<TileType extends TilePreview> extends St.Widge
 
         if (!trigger_relayout) {
             debug("relayout not needed");
-            return;
+            return false;
         }
 
-        this._previews?.forEach((preview) => preview.destroy());
-        this.remove_all_children();
+        this._previews?.forEach((preview) => {
+            if (preview.get_parent() === this) {
+                this.remove_child(preview);
+            }
+            preview.destroy();
+        });
         this._previews = [];
-        if (this._containerRect.width === 0 || this._containerRect.height === 0) return;
+        if (this._containerRect.width === 0 || this._containerRect.height === 0) return true;
 
         this.draw_layout();
         this._previews.forEach((lay) => lay.open());
+
+        return true;
     }
 }

src/components/snapassist/snapAssistLayout.ts

@@ -31,7 +31,7 @@ export default class SnapAssistLayout extends LayoutWidget<SnapAssistTile> {
 
         super.relayout({
             containerRect: buildRectangle({x: 0, y: 0, width, height})
-        })
+        });
     }
 
     buildTile(parent: Clutter.Actor, rect: Mtk.Rectangle, gaps: Clutter.Margin, tile: Tile): SnapAssistTile {

src/components/snapassist/snapAssistTile.ts

@@ -12,6 +12,7 @@ const debug = logger("SnapAssistTile");
 @registerGObjectClass
 export default class SnapAssistTile extends TilePreview {
     protected _tile: Tile;
+    private _styleChangedSignalID: number | undefined;
 
     constructor(params: {
         parent?: Clutter.Actor,
@@ -42,14 +43,13 @@ export default class SnapAssistTile extends TilePreview {
         );
 
         this._applyStyle();
-        const styleChangedSignalID = St.ThemeContext.get_for_stage(global.get_stage()).connect(
-            "changed", 
+        this._styleChangedSignalID = St.ThemeContext.get_for_stage(global.get_stage()).connect(
+            "changed",
             () => { 
                 this._applyStyle(); 
             }
         );
-
-        this.connect("destroy", () => St.ThemeContext.get_for_stage(global.get_stage()).disconnect(styleChangedSignalID));
+        this.connect("destroy", () => this.onDestroy());
     }
 
     _init() {
@@ -74,4 +74,11 @@ export default class SnapAssistTile extends TilePreview {
             this.add_style_class_name("dark");
         }
     }
+
+    onDestroy(): void {
+        if (this._styleChangedSignalID) {
+            St.ThemeContext.get_for_stage(global.get_stage()).disconnect(this._styleChangedSignalID);
+            this._styleChangedSignalID = undefined;
+        }
+    }
 }

src/components/tilepreview/selectionTilePreview.ts

@@ -1,5 +1,4 @@
 import { registerGObjectClass } from "@/utils/gjs";
-import Mtk from 'gi://Mtk';
 import Clutter from 'gi://Clutter';
 import St from 'gi://St';
 import TilePreview from "./tilePreview";
@@ -40,8 +39,8 @@ export default class SelectionTilePreview extends TilePreview {
   close() {
     if (!this._showing) return;
 
-    this._rect.width = 0;
-    this._rect.height = 0;
+    this._rect.width = this.gaps.left + this.gaps.right;
+    this._rect.height = this.gaps.top + this.gaps.bottom;
     super.close();
   }
 }

src/components/tilepreview/tilePreview.ts

@@ -10,14 +10,14 @@ export const WINDOW_ANIMATION_TIME = 100;
 
 const debug = logger('tilePreview');
 
-export module TilePreview {
-  export interface ConstructorProperties 
+//export module TilePreview {
+  export interface TilePreviewConstructorProperties 
     extends St.Widget.ConstructorProperties {
         parent: Clutter.Actor;
         rect: Mtk.Rectangle;
         gaps: Clutter.Margin;
   }
-}
+//}
 
 @registerGObjectClass
 export default class TilePreview extends St.Widget {
@@ -26,7 +26,7 @@ export default class TilePreview extends St.Widget {
 
   private _gaps: Clutter.Margin;
 
-  constructor(params: Partial<TilePreview.ConstructorProperties>) {
+  constructor(params: Partial<TilePreviewConstructorProperties>) {
     super(params);
     if (params.parent) params.parent.add_child(this);
 
@@ -44,6 +44,10 @@ export default class TilePreview extends St.Widget {
     this._gaps.left = gaps.left * scalingFactor;
   }
 
+  public get gaps(): Clutter.Margin {
+    return this._gaps;
+  }
+
   _init() {
     super._init();
     this.set_style_class_name('tile-preview custom-tile-preview');