Update README.md

README.md

@@ -5,7 +5,7 @@
 
 A lightweight, opinionated, and automatic tiling window manager for GNOME Shell 3.38.
 
-<img width="2560" height="1440" alt="Simple-Tiling" src="https://github.com/user-attachments/assets/18fcbb34-3e0e-45b8-abe1-0e752b8d970c" />
+<img width="2560" height="1440" alt="Simple-Tiling" src="https://github.com/user-attachments/assets/bb776134-57e0-4fcc-93c8-0b43b616dd11" />
 
 ## Introduction
 
@@ -21,9 +21,10 @@ This extension was built from the ground up to be stable and performant on **GNO
 * **Interactive Window Swapping:**
     * **Drag & Drop:** Swap any two windows by simply dragging one and dropping it over the other.
     * **Keyboard Shortcuts:** A full set of keyboard shortcuts allows you to swap the focused window with the master or with its nearest neighbor in any direction (left, right, up, down).
-* **Configurable Gaps:** Easily configure inner and outer gaps by editing variables directly in the `extension.js` code to achieve your desired aesthetic.
+* **Simple Settings Panel:** A simple settings panel within the gnome extension manager menu to adjust key bindings and windows gaps / margins.
 * **External Exception List:** Use a simple `exceptions.txt` file to list applications (by their `WM_CLASS`) that should be ignored by the tiling manager.
 * **Smart Pop-up Handling:** Windows on the exception list, as well as dialogs and other pop-ups, are automatically centered and kept "always on top" for a smooth workflow.
+* **Configurable Tiling Window Delays:** Easily configure the tiling window delays if you have race condition issues by editing variables directly in the `extension.js`.
 
 ## Requirements
 
@@ -57,7 +58,7 @@ Use the [GNOME Shell Extensions website](https://extensions.gnome.org/extension/
 
 #### Keyboard Shortcuts
 
-All keyboard shortcuts can be configured through the standard GNOME Settings panel:
+All keyboard shortcuts can be configured through the Settings panel of Simple Tiling (which can be found in the Gnome Extesion Application):
 1.  Open **Settings**.
 2.  Navigate to **Keyboard** -> **View and Customize Shortcuts**.
 3.  Scroll down to the **Custom Shortcuts** section at the bottom.
@@ -74,3 +75,23 @@ To prevent an application from being tiled, you can add its `WM_CLASS` to the `e
 To find an application's `WM_CLASS`, open a terminal and run the command `xprop WM_CLASS`. Your cursor will turn into a crosshair. Click on the window of the application you want to exclude. 
 
 An Example of an exceptions.txt can be found in the repo.
+
+#### Adjusting inner and/or outer Window Gaps / Margins
+
+You can adjust the window gap margins (inner gaps between windows, outer gaps horizontal as well as vertical) in the Settings panel of Simple Tiling (which can be found in the Gnome Extension Application).
+
+#### Adjusting Tiling Window Delays
+
+If you have race condition issues between mutter (Gnome WM) and the Simple Tiling extension, you can adjust the window delay settings (both for tiling windows as well as for centered application from the exceptions list) directly in the extensions.js (~/.local/share/gnome-shell/extensions/simple-tiling@domoel/extension.js). You will find the parameter at line 222 (commented). Defaults to "20" for General Tiling Window Delay and "5" for centered Apps on the Exception List.
+
+## Future Development
+
+This extension was built to solve a specific need. However, future enhancements could include:
+* Multi-monitor support.
+* Additional layout algorithms.
+* A more detailed settings panel to configure other options via a GUI.
+
+## License
+
+This project is licensed under the MIT License - see the `LICENSE` file for details.
+

extension.js

@@ -1,9 +1,11 @@
-// Simple-Tiling – GNOME Shell 3.38 (X11) - Version 1.0
-// Features: Fibonacci-Stack-Layout (50/50) · Tiling-Lock · Drag- & Keyboard-Swap
-// Pop-ups: zentriert + Always-on-Top + Exception-List
-// © 2025 domoel – MIT
+// ---------------------------------------------------- //
+// Simple-Tiling – GNOME Shell 3.38 (X11) - Version 2   //
+// © 2025 domoel – MIT                                  //
+// ---------------------------------------------------- //
 
-// Global Imports
+// ---------------------------------------------------- //
+// Global Imports                                       //
+// ---------------------------------------------------- //
 const Main = imports.ui.main;
 const Meta = imports.gi.Meta;
 const Shell = imports.gi.Shell;
@@ -17,8 +19,9 @@ const Me = ExtensionUtils.getCurrentExtension();
 const SCHEMA_NAME = 'org.gnome.shell.extensions.simple-tiling.domoel';
 const WM_SCHEMA = 'org.gnome.desktop.wm.keybindings';
 
-// InteractionHandler
-// Verwaltung aller Nutzerinteraktionen (Maus & Tastatur)
+// ---------------------------------------------------- //
+// InteractionHandler                                   //
+// ---------------------------------------------------- //
 class InteractionHandler {
     constructor(tiler) {
         this.tiler = tiler;
@@ -28,7 +31,6 @@ class InteractionHandler {
         this._savedWmShortcuts = {};
         this._grabOpIds = [];
         this._settingsChangedId = null;
-
         this._onSettingsChanged = this._onSettingsChanged.bind(this);
         this._prepareWmShortcuts();
     }
@@ -200,25 +202,26 @@ class InteractionHandler {
     }
 }
 
-
-// Tiler
-// Die Hauptklasse für die Tiling-Logik.
+// ---------------------------------------------------- //
+// Tiler                                                //
+// Main Classes for Tiling Logic                        //
+// ---------------------------------------------------- //
 class Tiler {
     constructor() {
         this.windows = [];
         this.grabbedWindow = null;
+        this._settings = ExtensionUtils.getSettings(SCHEMA_NAME);
         this.wmSettings = new Gio.Settings({ schema: WM_SCHEMA });
         this._signalIds = new Map();
         this._tileInProgress = false;
      
-        // Layout-Konfiguration
-        this._innerGap = 10;
-        this._outerGapVertical = 5;
-        this._outerGapHorizontal = 10;
+        this._innerGap = this._settings.get_int('inner-gap');
+        this._outerGapVertical = this._settings.get_int('outer-gap-vertical');
+        this._outerGapHorizontal = this._settings.get_int('outer-gap-horizontal');
 
-        // Delay-Zeiten für das Tiling und Exception Windows
-        this._tilingDelay = 20;
-        this._centeringDelay = 5;
+        // Window Delay Settings
+        this._tilingDelay = 20; // General Tiling Window Delay
+        this._centeringDelay = 5; //Delay for centered Apps on the Exception List
 
         this._exceptions = [];
         this._interactionHandler = new InteractionHandler(this);
@@ -227,6 +230,7 @@ class Tiler {
         this._onWindowRemoved = this._onWindowRemoved.bind(this);
         this._onActiveWorkspaceChanged = this._onActiveWorkspaceChanged.bind(this);
         this._onWindowMinimizedStateChanged = this._onWindowMinimizedStateChanged.bind(this);
+        this._onSettingsChanged = this._onSettingsChanged.bind(this);
     }
     
     enable() {
@@ -235,6 +239,7 @@ class Tiler {
         this._signalIds.set('workspace-changed', { object: workspaceManager, id: workspaceManager.connect('active-workspace-changed', this._onActiveWorkspaceChanged) });
         this._connectToWorkspace();
         this._interactionHandler.enable();
+        this._signalIds.set('settings-changed', { object: this._settings, id: this._settings.connect('changed', this._onSettingsChanged) });
     }
 
     disable() {
@@ -247,6 +252,13 @@ class Tiler {
         this.windows = [];
     }
     
+    _onSettingsChanged() {
+        this._innerGap = this._settings.get_int('inner-gap');
+        this._outerGapVertical = this._settings.get_int('outer-gap-vertical');
+        this._outerGapHorizontal = this._settings.get_int('outer-gap-horizontal');
+        this.queueTile();
+    }
+    
     _loadExceptions() {
         const file = Gio.file_new_for_path(Me.path + '/exceptions.txt');
         if (!file.query_exists(null)) { this._exceptions = []; return; }
@@ -424,7 +436,9 @@ class Tiler {
     }
 }
 
-// Extension Wrapper
+// ---------------------------------------------------- //
+// Extension Wrapper                                    //
+// ---------------------------------------------------- //
 class SimpleTilingExtension {
     constructor() {
         this.tiler = null;

metadata.json

@@ -2,7 +2,7 @@
   "uuid": "simple-tiling@domoel",
   "name": "Simple Tiling",
   "description": "A Simple Tiling Extension for Gnome Shell 3.38.",
-  "version": 1,
+  "version": 2,
   "shell-version": [ "3.38" ],
   "settings-schema": "org.gnome.shell.extensions.simple-tiling.domoel",
   "preferences_ui": "prefs.js",

prefs.js

@@ -1,42 +1,51 @@
-// Settings Menu for Simple-Tiling
+// ------------------------------------------------------ //
+// Extension Settings Menu for Simple Tiling - Version 2  //
+// © 2025 domoel – MIT                                    //
+// ------------------------------------------------------ //
 
+// ---------------------------------------------------- //
+// Global Imports                                       //
+// ---------------------------------------------------- //
 'use strict';
 
-const { Gtk, GObject } = imports.gi;
+const { Gtk, GObject, Gio } = imports.gi;
 const ExtensionUtils = imports.misc.extensionUtils;
 
-const COLUMN_ID = 0;       // z.B. 'swap-master-window'
-const COLUMN_DESC = 1;     // z.B. 'Master-Fenster tauschen'
-const COLUMN_KEY = 2;      // Der Key-Code (eine Zahl)
-const COLUMN_MODS = 3;     // Die Modifier-Maske (eine Zahl)
+const SCHEMA_NAME = 'org.gnome.shell.extensions.simple-tiling.domoel';
+
+// ---------------------------------------------------- //
+// Definition of Row Model                              //
+// ---------------------------------------------------- //
+const COLUMN_ID = 0;
+const COLUMN_DESC = 1;
+const COLUMN_KEY = 2;
+const COLUMN_MODS = 3;
 
 function init() {}
 
 function buildPrefsWidget() {
-    const settings = ExtensionUtils.getSettings('org.gnome.shell.extensions.simple-tiling.domoel');
+    const settings = ExtensionUtils.getSettings(SCHEMA_NAME);
     
     const prefsWidget = new Gtk.Box({
         orientation: Gtk.Orientation.VERTICAL,
-        margin: 20,
-        spacing: 12,
-        visible: true
+        margin_top: 20,
+        margin_bottom: 20,
+        margin_start: 20,
+        margin_end: 20,
+        spacing: 18,
+        visible: true,
     });
     
-    const title = new Gtk.Label({
-        label: '<b>Tastenkürzel für Simple-Tiling</b>',
-        use_markup: true,
-        halign: Gtk.Align.START,
-        visible: true
-    });
-    prefsWidget.add(title);
+    // ---------------------------------------------------- //
+    // Section for Keybindings                              //
+    // ---------------------------------------------------- //
+    const keysTitle = new Gtk.Label({ label: '<b>Tastenkürzel</b>', use_markup: true, halign: Gtk.Align.START, visible: true });
+    const keysFrame = new Gtk.Frame({ label_widget: keysTitle, shadow_type: Gtk.ShadowType.NONE, visible: true });
+    let keysBox = new Gtk.Box({ orientation: Gtk.Orientation.VERTICAL, margin: 12, spacing: 6, visible: true });
+    keysFrame.add(keysBox);
     
     let store = new Gtk.ListStore();
-    store.set_column_types([
-        GObject.TYPE_STRING, // COLUMN_ID
-        GObject.TYPE_STRING, // COLUMN_DESC
-        GObject.TYPE_INT,    // COLUMN_KEY
-        GObject.TYPE_INT,    // COLUMN_MODS
-    ]);
+    store.set_column_types([ GObject.TYPE_STRING, GObject.TYPE_STRING, GObject.TYPE_INT, GObject.TYPE_INT ]);
 
     addKeybinding(store, settings, 'swap-master-window', 'Master-Fenster tauschen');
     addKeybinding(store, settings, 'swap-left-window', 'Fenster nach links tauschen');
@@ -44,12 +53,8 @@ function buildPrefsWidget() {
     addKeybinding(store, settings, 'swap-up-window', 'Fenster nach oben tauschen');
     addKeybinding(store, settings, 'swap-down-window', 'Fenster nach unten tauschen');
     
-    let treeView = new Gtk.TreeView({
-        model: store,
-        headers_visible: false,
-        hexpand: true,
-        visible: true
-    });
+    let treeView = new Gtk.TreeView({ model: store, headers_visible: false, hexpand: true, visible: true });
+    keysBox.add(treeView);
 
     let descRenderer = new Gtk.CellRendererText();
     let descColumn = new Gtk.TreeViewColumn({ expand: true });
@@ -57,24 +62,17 @@ function buildPrefsWidget() {
     descColumn.add_attribute(descRenderer, 'text', COLUMN_DESC);
     treeView.append_column(descColumn);
 
-    let accelRenderer = new Gtk.CellRendererAccel({
-        'accel-mode': Gtk.CellRendererAccelMode.GTK,
-        'editable': true
-    });
+    let accelRenderer = new Gtk.CellRendererAccel({ 'accel-mode': Gtk.CellRendererAccelMode.GTK, 'editable': true });
     let accelColumn = new Gtk.TreeViewColumn();
     accelColumn.pack_end(accelRenderer, false);
     accelColumn.add_attribute(accelRenderer, 'accel-key', COLUMN_KEY);
     accelColumn.add_attribute(accelRenderer, 'accel-mods', COLUMN_MODS);
     treeView.append_column(accelColumn);
     
-    prefsWidget.add(treeView);
-
     accelRenderer.connect('accel-edited', (renderer, path_string, key, mods, hw_code) => {
         let [ok, iter] = store.get_iter_from_string(path_string);
         if (!ok) return;
-
         store.set(iter, [COLUMN_KEY, COLUMN_MODS], [key, mods]);
-
         let id = store.get_value(iter, COLUMN_ID);
         let accelString = Gtk.accelerator_name(key, mods);
         settings.set_strv(id, [accelString]);
@@ -83,26 +81,56 @@ function buildPrefsWidget() {
     accelRenderer.connect('accel-cleared', (renderer, path_string) => {
         let [ok, iter] = store.get_iter_from_string(path_string);
         if (!ok) return;
-
         store.set(iter, [COLUMN_KEY, COLUMN_MODS], [0, 0]);
         let id = store.get_value(iter, COLUMN_ID);
         settings.set_strv(id, []);
     });
 
+    prefsWidget.add(keysFrame);
+    
+    
+    // ---------------------------------------------------- //
+    // Section for Window Gaps                              //
+    // ---------------------------------------------------- //
+    const gapsTitle = new Gtk.Label({ label: '<b>Fensterabstände (Gaps)</b>', use_markup: true, halign: Gtk.Align.START, visible: true });
+    const gapsFrame = new Gtk.Frame({ label_widget: gapsTitle, shadow_type: Gtk.ShadowType.NONE, visible: true });
+    const gapsGrid = new Gtk.Grid({ margin: 12, column_spacing: 12, row_spacing: 12, visible: true });
+    gapsFrame.add(gapsGrid);
+
+    addSpinButtonRow(gapsGrid, settings, "Innerer Abstand (zwischen Fenstern)", "inner-gap", 0);
+    addSpinButtonRow(gapsGrid, settings, "Äußerer Abstand (horizontal)", "outer-gap-horizontal", 1);
+    addSpinButtonRow(gapsGrid, settings, "Äußerer Abstand (vertikal)", "outer-gap-vertical", 2);
+
+    prefsWidget.add(gapsFrame);
+    
     return prefsWidget;
 }
 
 function addKeybinding(model, settings, id, description) {
     let [key, mods] = [0, 0];
-    
     const strv = settings.get_strv(id);
     if (strv && strv.length > 0 && strv[0]) {
         [key, mods] = Gtk.accelerator_parse(strv[0]);
     }
-
     let iter = model.append();
     model.set(iter, 
         [COLUMN_ID, COLUMN_DESC, COLUMN_KEY, COLUMN_MODS], 
         [id, description, key, mods]
     );
 }
+
+function addSpinButtonRow(grid, settings, description, key, position) {
+    const label = new Gtk.Label({ label: description, halign: Gtk.Align.START, visible: true });
+    grid.attach(label, 0, position, 1, 1);
+
+    const adjustment = new Gtk.Adjustment({ lower: 0, upper: 50, step_increment: 1 });
+    const spinButton = new Gtk.SpinButton({
+        adjustment: adjustment,
+        climb_rate: 1,
+        digits: 0,
+        halign: Gtk.Align.END,
+        visible: true,
+    });
+    settings.bind(key, spinButton, 'value', Gio.SettingsBindFlags.DEFAULT);
+    grid.attach(spinButton, 1, position, 1, 1);
+}

schemas/org.gnome.shell.extensions.simple-tiling.domoel.gschema.xml

@@ -1,33 +1,39 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <schemalist>
-  <schema id="org.gnome.shell.extensions.simple-tiling.domoel"
-          path="/org/gnome/shell/extensions/simple-tiling-domoel/">
+  <schema id="org.gnome.shell.extensions.simple-tiling.domoel" path="/org/gnome/shell/extensions/simple-tiling-domoel/">
     
-    <!-- Master ↔ Stack -->
     <key name="swap-master-window" type="as">
-      <default>['&lt;Super&gt;Return']</default>
-      <summary>Tauscht Master-Fenster mit dem fokussierten Fenster</summary>
+      <default><![CDATA[['<Super>Return']]]></default>
+      <summary>Tauscht das fokussierte Fenster mit dem Master.</summary>
     </key>
-
-    <!-- Richtungs-Swaps -->
     <key name="swap-left-window" type="as">
-      <default>['&lt;Super&gt;Left']</default>
-      <summary>Tauscht mit linkem Nachbarfenster</summary>
+      <default><![CDATA[['<Super>Left']]]></default>
+      <summary>Tauscht das Fenster mit dem linken Nachbarn.</summary>
     </key>
-
     <key name="swap-right-window" type="as">
-      <default>['&lt;Super&gt;Right']</default>
-      <summary>Tauscht mit rechtem Nachbarfenster</summary>
+      <default><![CDATA[['<Super>Right']]]></default>
+      <summary>Tauscht das Fenster mit dem rechten Nachbarn.</summary>
     </key>
-
     <key name="swap-up-window" type="as">
-      <default>['&lt;Super&gt;Up']</default>
-      <summary>Tauscht mit oberem Nachbarfenster</summary>
+      <default><![CDATA[['<Super>Up']]]></default>
+      <summary>Tauscht das Fenster mit dem oberen Nachbarn.</summary>
+    </key>
+    <key name="swap-down-window" type="as">
+      <default><![CDATA[['<Super>Down']]]></default>
+      <summary>Tauscht das Fenster mit dem unteren Nachbarn.</summary>
     </key>
 
-    <key name="swap-down-window" type="as">
-      <default>['&lt;Super&gt;Down']</default>
-      <summary>Tauscht mit unterem Nachbarfenster</summary>
+    <key name="inner-gap" type="i">
+      <default>10</default>
+      <summary>Der Abstand zwischen den Fenstern in Pixeln.</summary>
+    </key>
+    <key name="outer-gap-vertical" type="i">
+      <default>5</default>
+      <summary>Der Abstand zum oberen und unteren Bildschirmrand.</summary>
+    </key>
+    <key name="outer-gap-horizontal" type="i">
+      <default>10</default>
+      <summary>Der Abstand zum linken und rechten Bildschirmrand.</summary>
     </key>
     
   </schema>