Extension: Port to ESM

lint/eslintrc-extension.yml

@@ -7,3 +7,8 @@ rules:
     - vars: 'local'
       varsIgnorePattern: (^unused|_$)
       argsIgnorePattern: ^(unused|_)
+  object-curly-spacing: off
+globals:
+  NTSMetadata: writable
+parserOptions:
+  sourceType: module

src/data/preferences.gresource.xml

@@ -4,7 +4,7 @@ SPDX-FileCopyrightText: 2022 Romain Vigier <contact AT romainvigier.fr>
 SPDX-License-Identifier: GPL-3.0-or-later
 -->
 <gresources>
-	<gresource prefix="/org/gnome/shell/extensions/nightthemeswitcher/preferences">
+	<gresource prefix="/org/gnome/Shell/Extensions/nightthemeswitcher/preferences">
 		<file compressed="true" preprocess="xml-stripblanks" alias="icons/scalable/actions/nightthemeswitcher-code-symbolic.svg">icons/code-symbolic.svg</file>
 		<file compressed="true" preprocess="xml-stripblanks" alias="icons/scalable/actions/nightthemeswitcher-translate-symbolic.svg">icons/translate-symbolic.svg</file>
 		<file compressed="true" preprocess="xml-stripblanks" alias="icons/scalable/apps/nightthemeswitcher-symbolic.svg">icons/nightthemeswitcher-symbolic.svg</file>

src/data/ui/ContributePage.ui

@@ -22,10 +22,6 @@ SPDX-License-Identifier: GPL-3.0-or-later
                 <property name="pixel-size">64</property>
               </object>
             </child>
-            <child>
-              <object class="GtkBox">
-                <property name="orientation">vertical</property>
-                <property name="spacing">6</property>
             <child>
               <object class="GtkLabel">
                 <property name="label">Night Theme Switcher</property>
@@ -35,15 +31,6 @@ SPDX-License-Identifier: GPL-3.0-or-later
                 </style>
               </object>
             </child>
-                <child>
-                  <object class="GtkLabel">
-                    <binding name="label">
-                      <closure type="gchararray" function="getVersionString"/>
-                    </binding>
-                  </object>
-                </child>
-              </object>
-            </child>
           </object>
         </child>
       </object>

src/debug.js

@@ -1,16 +1,12 @@
 // SPDX-FileCopyrightText: 2022 Romain Vigier <contact AT romainvigier.fr>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-const { extensionUtils } = imports.misc;
-
-const Me = extensionUtils.getCurrentExtension();
-
 /**
  * Print a message in debug builds.
  *
  * @param {string} msg Message to print.
  */
-function message(msg) {
+export function message(msg) {
-    if (Me.metadata['build-type'] === 'debug')
+    if (NTSMetadata['build-type'] === 'debug')
-        console.log(`[${Me.metadata.name}] ${msg}`);
+        console.log(`[${NTSMetadata.name}] ${msg}`);
 }

src/enums/Time.js

@@ -7,7 +7,7 @@
  * @readonly
  * @enum {string}
  */
-var Time = {
+export const Time = {
     UNKNOWN: 'unknown',
     DAY: 'day',
     NIGHT: 'night',

src/extension.js

@@ -3,40 +3,33 @@
 
 'use strict';
 
-const { Gio } = imports.gi;
+import { Extension } from 'resource:///org/gnome/shell/extensions/extension.js';
-const { extensionUtils } = imports.misc;
 
-const Me = extensionUtils.getCurrentExtension();
+import * as debug from './debug.js';
 
-const debug = Me.imports.debug;
+import { SwitcherCommands } from './modules/SwitcherCommands.js';
-
+import { SwitcherThemeCursor, SwitcherThemeGtk, SwitcherThemeIcon, SwitcherThemeShell } from './modules/SwitcherTheme.js';
-const { SwitcherCommands } = Me.imports.modules.SwitcherCommands;
+import { Timer } from './modules/Timer.js';
-const { SwitcherThemeCursor, SwitcherThemeGtk, SwitcherThemeIcon, SwitcherThemeShell } = Me.imports.modules.SwitcherTheme;
-const { Timer } = Me.imports.modules.Timer;
 
 
-class NightThemeSwitcher {
+export default class NightThemeSwitcher extends Extension {
     #modules = [];
 
-    constructor() {
-        debug.message('Initializing extension...');
-        extensionUtils.initTranslations();
-        debug.message('Extension initialized.');
-    }
-
     enable() {
+        globalThis.NTSMetadata = this.metadata;
+
         debug.message('Enabling extension...');
 
-        const timer = new Timer();
+        const timer = new Timer({ settings: this.getSettings(`${this.metadata['settings-schema']}.time`), openPrefs: this.openPrefs });
         this.#modules.push(timer);
 
         [
-            SwitcherThemeGtk,
+            new SwitcherThemeGtk({ timer, settings: this.getSettings(`${this.metadata['settings-schema']}.gtk-variants`) }),
-            SwitcherThemeIcon,
+            new SwitcherThemeIcon({ timer, settings: this.getSettings(`${this.metadata['settings-schema']}.icon-variants`) }),
-            SwitcherThemeShell,
+            new SwitcherThemeShell({ timer, settings: this.getSettings(`${this.metadata['settings-schema']}.shell-variants`) }),
-            SwitcherThemeCursor,
+            new SwitcherThemeCursor({ timer, settings: this.getSettings(`${this.metadata['settings-schema']}.cursor-variants`) }),
-            SwitcherCommands,
+            new SwitcherCommands({ timer, settings: this.getSettings(`${this.metadata['settings-schema']}.commands`) }),
-        ].forEach(SwitcherModule => this.#modules.push(new SwitcherModule({ timer })));
+        ].forEach(module => this.#modules.push(module));
 
         this.#modules.forEach(module => module.enable());
 
@@ -53,12 +46,7 @@ class NightThemeSwitcher {
         this.#modules = [];
 
         debug.message('Extension disabled.');
-    }
-}
 
-/**
+        delete globalThis.NTSMetadata;
- * Extension initialization.
+    }
- */
-function init() {
-    return new NightThemeSwitcher();
 }

src/metadata.json.in

@@ -6,7 +6,7 @@
 	"settings-schema": "@DNS@",
 	"url": "https://nightthemeswitcher.romainvigier.fr",
 	"session-modes": ["unlock-dialog", "user"],
-	"shell-version": ["44"],
+	"shell-version": ["45"],
 	"version": @VERSION@,
 	"build-type": "@BUILD_TYPE@"
 }

src/modules/Switcher.js

@@ -1,14 +1,7 @@
 // SPDX-FileCopyrightText: 2020-2022 Romain Vigier <contact AT romainvigier.fr>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-const { Gio } = imports.gi;
+import * as debug from '../debug.js';
-const { extensionUtils } = imports.misc;
-
-const Me = extensionUtils.getCurrentExtension();
-
-const debug = Me.imports.debug;
-
-const { Time } = Me.imports.enums.Time;
 
 
 /**
@@ -22,13 +15,8 @@ const { Time } = Me.imports.enums.Time;
 /**
  * The Switcher runs a callback function when the time changes.
  *
- * @param {Object} params Params object.
- * @param {string} params.name Name of the switcher.
- * @param {Timer} params.timer Timer to listen to.
- * @param {Gio.Settings} params.settings Settings with the `enabled` key.
- * @param {TimeChangedCallback} params.callback Callback function.
  */
-var Switcher = class {
+export class Switcher {
     #name;
     #timer;
     #settings;
@@ -37,6 +25,13 @@ var Switcher = class {
     #statusConnection = null;
     #timerConnection = null;
 
+    /**
+     * @param {object} params Params object.
+     * @param {string} params.name Name of the switcher.
+     * @param {Timer} params.timer Timer to listen to.
+     * @param {Gio.Settings} params.settings Settings with the `enabled` key.
+     * @param {TimeChangedCallback} params.callback Callback function.
+     */
     constructor({ name, timer, settings, callback }) {
         this.#name = name;
         this.#timer = timer;
@@ -98,4 +93,4 @@ var Switcher = class {
     #onTimeChanged() {
         this.#callback(this.#timer.time);
     }
-};
+}

src/modules/SwitcherCommands.js

@@ -1,29 +1,27 @@
 // SPDX-FileCopyrightText: 2022 Romain Vigier <contact AT romainvigier.fr>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-const { GLib } = imports.gi;
+import GLib from 'gi://GLib';
-const { extensionUtils } = imports.misc;
 
-const Me = extensionUtils.getCurrentExtension();
+import * as debug from '../debug.js';
 
-const debug = Me.imports.debug;
+import { Time } from '../enums/Time.js';
 
-const { Switcher } = Me.imports.modules.Switcher;
+import { Switcher } from './Switcher.js';
-
-const { Time } = Me.imports.enums.Time;
 
 
 /**
  * The Commands Switcher spawns commands according to the time.
- *
- * @param {Object} params Params object.
- * @param {Timer} params.timer Timer to listen to.
  */
-var SwitcherCommands = class extends Switcher {
+export class SwitcherCommands extends Switcher {
     #settings;
 
-    constructor({ timer }) {
+    /**
-        const settings = extensionUtils.getSettings(`${Me.metadata['settings-schema']}.commands`);
+     * @param {object} params Params object.
+     * @param {Timer} params.timer Timer to listen to.
+     * @param {Gio.Settings} params.settings Commands settings.
+     */
+    constructor({ timer, settings }) {
         super({
             name: 'Command',
             timer,
@@ -42,4 +40,4 @@ var SwitcherCommands = class extends Switcher {
         GLib.spawn_async(null, ['sh', '-c', command], null, GLib.SpawnFlags.SEARCH_PATH, null);
         debug.message(`Spawned ${time} command.`);
     }
-};
+}

src/modules/SwitcherTheme.js

@@ -1,18 +1,18 @@
 // SPDX-FileCopyrightText: 2020-2022 Romain Vigier <contact AT romainvigier.fr>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-const { Gio } = imports.gi;
+import Gio from 'gi://Gio';
-const { extensionUtils } = imports.misc;
+import GLib from 'gi://GLib';
-const { extensionManager } = imports.ui.main;
 
-const Me = extensionUtils.getCurrentExtension();
+import { ExtensionState } from 'resource:///org/gnome/shell/misc/extensionUtils.js';
+import { extensionManager, setThemeStylesheet, loadTheme } from 'resource:///org/gnome/shell/ui/main.js';
 
-const debug = Me.imports.debug;
+import * as debug from '../debug.js';
-const utils = Me.imports.utils;
+import * as utils from '../utils.js';
 
-const { Switcher } = Me.imports.modules.Switcher;
+import { Time } from '../enums/Time.js';
 
-const { Time } = Me.imports.enums.Time;
+import { Switcher } from './Switcher.js';
 
 
 /**
@@ -28,16 +28,8 @@ const { Time } = Me.imports.enums.Time;
  * provided settings or by running a callback function.
  *
  * It also listens to system theme changes to update the current variant setting.
- *
- * @param {Object} params Params object.
- * @param {string} params.name Name of the switcher.
- * @param {Timer} params.timer Timer to listen to.
- * @param {Gio.Settings} params.settings Settings with the `enabled`, `day` and `night` keys.
- * @param {Gio.Settings=} params.systemSettings System settings containing the theme name.
- * @param {string} params.themeKey Settings key of the theme name.
- * @param {noSettingsUpdateSystemThemeCallback} Callback function.
  */
-var SwitcherTheme = class extends Switcher {
+export class SwitcherTheme extends Switcher {
     #name;
     #timer;
     #settings;
@@ -47,6 +39,15 @@ var SwitcherTheme = class extends Switcher {
 
     #settingsConnections = [];
 
+    /**
+     * @param {object} params Params object.
+     * @param {string} params.name Name of the switcher.
+     * @param {Timer} params.timer Timer to listen to.
+     * @param {Gio.Settings} params.settings Settings with the `enabled`, `day` and `night` keys.
+     * @param {Gio.Settings} [params.systemSettings] System settings containing the theme name.
+     * @param {string} params.themeKey Settings key of the theme name.
+     * @param {noSettingsUpdateSystemThemeCallback} params.noSettingsUpdateSystemThemeCallback function.
+     */
     constructor({ name, timer, settings, systemSettings = null, themeKey, noSettingsUpdateSystemThemeCallback = null }) {
         super({
             name,
@@ -141,59 +142,78 @@ var SwitcherTheme = class extends Switcher {
         else if (this.#noSettingsUpdateSystemThemeCallback)
             this.#noSettingsUpdateSystemThemeCallback(this.#timer.time);
     }
-};
+}
 
 
-var SwitcherThemeCursor = class extends SwitcherTheme {
+export class SwitcherThemeCursor extends SwitcherTheme {
-    constructor({ timer }) {
+    /**
+     * @param {object} params Params object.
+     * @param {Timer} params.timer Timer to listen to.
+     * @param {Gio.Settings} params.settings Cursor theme settings.
+     */
+    constructor({ timer, settings }) {
         super({
             name: 'Cursor theme',
             timer,
-            settings: extensionUtils.getSettings(`${Me.metadata['settings-schema']}.cursor-variants`),
+            settings,
             systemSettings: new Gio.Settings({ schema: 'org.gnome.desktop.interface' }),
             themeKey: 'cursor-theme',
         });
     }
-};
+}
 
 
-var SwitcherThemeGtk = class extends SwitcherTheme {
+export class SwitcherThemeGtk extends SwitcherTheme {
-    constructor({ timer }) {
+    /**
+     * @param {object} params Params object.
+     * @param {Timer} params.timer Timer to listen to.
+     * @param {Gio.Settings} params.settings GTK theme settings.
+     */
+    constructor({ timer, settings }) {
         super({
             name: 'GTK theme',
             timer,
-            settings: extensionUtils.getSettings(`${Me.metadata['settings-schema']}.gtk-variants`),
+            settings,
             systemSettings: new Gio.Settings({ schema: 'org.gnome.desktop.interface' }),
             themeKey: 'gtk-theme',
         });
     }
-};
+}
 
 
-var SwitcherThemeIcon = class extends SwitcherTheme {
+export class SwitcherThemeIcon extends SwitcherTheme {
-    constructor({ timer }) {
+    /**
+     * @param {object} params Params object.
+     * @param {Timer} params.timer Timer to listen to.
+     * @param {Gio.Settings} params.settings Icon theme settings.
+     */
+    constructor({ timer, settings }) {
         super({
             name: 'Icon theme',
             timer,
-            settings: extensionUtils.getSettings(`${Me.metadata['settings-schema']}.icon-variants`),
+            settings,
             systemSettings: new Gio.Settings({ schema: 'org.gnome.desktop.interface' }),
             themeKey: 'icon-theme',
         });
     }
-};
+}
 
 
-var SwitcherThemeShell = class extends SwitcherTheme {
+export class SwitcherThemeShell extends SwitcherTheme {
     #settings;
     #extensionManagerConnection = null;
 
-    constructor({ timer }) {
+    /**
-        const settings = extensionUtils.getSettings(`${Me.metadata['settings-schema']}.shell-variants`);
+     * @param {object} params Params object.
+     * @param {Timer} params.timer Timer to listen to.
+     * @param {Gio.Settings} params.settings Shell theme settings.
+     */
+    constructor({ timer, settings }) {
         super({
             name: 'Shell theme',
             timer,
             settings,
-            systemSettings: utils.getUserthemesSettings(),
+            systemSettings: getUserthemesSettings(),
             themeKey: 'name',
             noSettingsUpdateSystemThemeCallback: time => this.#noSettingsUpdateSystemThemeCallback(time),
         });
@@ -215,11 +235,79 @@ var SwitcherThemeShell = class extends SwitcherTheme {
 
     #noSettingsUpdateSystemThemeCallback(time) {
         const shellTheme = this.#settings.get_string(time);
-        const stylesheet = utils.getShellThemeStylesheet(shellTheme);
+        const stylesheet = getShellThemeStylesheet(shellTheme);
-        utils.applyShellStylesheet(stylesheet);
+        applyShellStylesheet(stylesheet);
     }
 
     #onExtensionStateChanged() {
-        this.systemSettings = utils.getUserthemesSettings();
+        this.systemSettings = getUserthemesSettings();
+    }
+}
+
+
+/**
+ * Get the User Themes extension.
+ *
+ * @returns {object|undefined} The User Themes extension object or undefined if
+ * it isn't installed.
+ */
+function getUserthemesExtension() {
+    try {
+        return extensionManager.lookup('user-theme@gnome-shell-extensions.gcampax.github.com');
+    } catch (_e) {
+        return undefined;
+    }
+}
+
+/**
+ * Get the User Themes extension settings.
+ *
+ * @returns {Gio.Settings|null} The User Themes extension settings or null if
+ * the extension isn't installed.
+ */
+function getUserthemesSettings() {
+    let extension = getUserthemesExtension();
+    if (!extension || extension.state !== ExtensionState.ENABLED)
+        return null;
+    const schemaDir = extension.dir.get_child('schemas');
+    const GioSSS = Gio.SettingsSchemaSource;
+    let schemaSource;
+    if (schemaDir.query_exists(null))
+        schemaSource = GioSSS.new_from_directory(schemaDir.get_path(), GioSSS.get_default(), false);
+    else
+        schemaSource = GioSSS.get_default();
+    const schemaObj = schemaSource.lookup('org.gnome.shell.extensions.user-theme', true);
+    return new Gio.Settings({ settings_schema: schemaObj });
+}
+
+/**
+ * Get the shell theme stylesheet.
+ *
+ * @param {string} theme The shell theme name.
+ * @returns {string|null} Path to the shell theme stylesheet.
+ */
+function getShellThemeStylesheet(theme) {
+    const themeName = theme ? `'${theme}'` : 'default';
+    debug.message(`Getting the ${themeName} theme shell stylesheet...`);
+    let stylesheet = null;
+    if (theme) {
+        const stylesheetPaths = utils.getResourcesDirsPaths('themes').map(path => GLib.build_filenamev([path, theme, 'gnome-shell', 'gnome-shell.css']));
+        stylesheet = stylesheetPaths.find(path => {
+            const file = Gio.file_new_for_path(path);
+            return file.query_exists(null);
+        });
+    }
+    return stylesheet;
+}
+
+/**
+ * Apply a stylesheet to the shell.
+ *
+ * @param {string} stylesheet The shell stylesheet to apply.
+ */
+function applyShellStylesheet(stylesheet) {
+    debug.message('Applying shell stylesheet...');
+    setThemeStylesheet(stylesheet);
+    loadTheme();
+    debug.message('Shell stylesheet applied.');
 }
-};

src/modules/Timer.js

@@ -1,18 +1,20 @@
 // SPDX-FileCopyrightText: 2020-2022 Romain Vigier <contact AT romainvigier.fr>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-const { Geoclue, Gio, GLib, GObject, Meta, Shell } = imports.gi;
+import Geoclue from 'gi://Geoclue';
-const { extensionUtils } = imports.misc;
+import Gio from 'gi://Gio';
+import GLib from 'gi://GLib';
+import GObject from 'gi://GObject';
+import Meta from 'gi://Meta';
+import Shell from 'gi://Shell';
 
-const { main, messageTray } = imports.ui;
+import { gettext as _ } from 'resource:///org/gnome/shell/extensions/extension.js';
+import { layoutManager, messageTray, wm } from 'resource:///org/gnome/shell/ui/main.js';
+import * as MessageTray from 'resource:///org/gnome/shell/ui/messageTray.js';
 
-const Me = extensionUtils.getCurrentExtension();
+import * as debug from '../debug.js';
 
-const _ = extensionUtils.gettext;
+import { Time } from '../enums/Time.js';
-
-const debug = Me.imports.debug;
-
-const { Time } = Me.imports.enums.Time;
 
 
 /**
@@ -24,10 +26,11 @@ const { Time } = Me.imports.enums.Time;
  * to a manual schedule if the location services are disabled or if the user
  * forced the manual schedule in the preferences.
  */
-var Timer = class extends GObject.Object {
+export class Timer extends GObject.Object {
     #settings;
     #interfaceSettings;
     #locationSettings;
+    #openPrefs;
     #time;
 
     #cancellable = null;
@@ -48,11 +51,17 @@ var Timer = class extends GObject.Object {
         }, this);
     }
 
-    constructor() {
+    /**
+     * @param {object} params Params object.
+     * @param {Gio.Settings} params.settings Timer settings.
+     * @param {Function} params.openPrefs Function opening the extension preferences.
+     */
+    constructor({ settings, openPrefs }) {
         super();
-        this.#settings = extensionUtils.getSettings(`${Me.metadata['settings-schema']}.time`);
+        this.#settings = settings;
         this.#interfaceSettings = new Gio.Settings({ schema: 'org.gnome.desktop.interface' });
         this.#locationSettings = new Gio.Settings({ schema: 'org.gnome.system.location' });
+        this.#openPrefs = openPrefs;
     }
 
     enable() {
@@ -103,7 +112,7 @@ var Timer = class extends GObject.Object {
 
         debug.message(manual ? `Time manually set to ${time}.` : `Time changed to ${time}.`);
 
-        main.layoutManager.screenTransition.run();
+        layoutManager.screenTransition.run();
         this.#interfaceSettings.set_string('color-scheme', time === Time.NIGHT ? 'prefer-dark' : 'default');
         this.notify('time');
     }
@@ -203,7 +212,7 @@ var Timer = class extends GObject.Object {
         if (!this.#settings.get_strv('nightthemeswitcher-ondemand-keybinding')[0])
             return;
         debug.message('Adding keybinding...');
-        main.wm.addKeybinding(
+        wm.addKeybinding(
             'nightthemeswitcher-ondemand-keybinding',
             this.#settings,
             Meta.KeyBindingFlags.IGNORE_AUTOREPEAT,
@@ -219,7 +228,7 @@ var Timer = class extends GObject.Object {
     #removeKeybinding() {
         if (this.#previousKeybinding) {
             debug.message('Removing keybinding...');
-            main.wm.removeKeybinding('nightthemeswitcher-ondemand-keybinding');
+            wm.removeKeybinding('nightthemeswitcher-ondemand-keybinding');
             debug.message('Removed keybinding.');
         }
     }
@@ -258,29 +267,29 @@ var Timer = class extends GObject.Object {
         } catch (e) {
             const [latitude, longitude] = this.#settings.get_value('location').deepUnpack();
             if (latitude >= -90 && latitude <= 90 && longitude >= -180 && longitude <= 180) {
-                console.error(`[${Me.metadata.name}] Unable to retrieve the location, using the last known location instead.\n${e}`);
+                console.error(`[${NTSMetadata.name}] Unable to retrieve the location, using the last known location instead.\n${e}`);
                 this.#updateSuntimes();
             } else {
-                console.error(`[${Me.metadata.name}] Unable to retrieve the location, using the manual schedule times instead.\n${e}`);
+                console.error(`[${NTSMetadata.name}] Unable to retrieve the location, using the manual schedule times instead.\n${e}`);
 
-                const source = new messageTray.Source(Me.metadata.name, 'dialog-information-symbolic');
+                const source = new MessageTray.Source(NTSMetadata.name, 'dialog-information-symbolic');
-                main.messageTray.add(source);
+                messageTray.add(source);
 
-                const notification = new messageTray.Notification(
+                const notification = new MessageTray.Notification(
                     source,
                     _('Unknown Location'),
                     _('A manual schedule will be used to switch the dark mode.'),
                     {
-                        gicon: Gio.icon_new_for_string(GLib.build_filenamev([Me.path, 'icons', 'nightthemeswitcher-symbolic.svg'])),
+                        gicon: Gio.icon_new_for_string(GLib.build_filenamev([NTSMetadata.path, 'icons', 'nightthemeswitcher-symbolic.svg'])),
                     }
                 );
-                notification.addAction(_('Edit Manual Schedule'), () => extensionUtils.openPrefs());
+                notification.addAction(_('Edit Manual Schedule'), () => this.#openPrefs());
 
                 const locationSettingsApp = Shell.AppSystem.get_default().lookup_app('gnome-location-panel.desktop');
                 if (locationSettingsApp)
                     notification.addAction(_('Open Location Settings'), () => locationSettingsApp.activate());
 
-                notification.connect('activated', () => extensionUtils.openPrefs());
+                notification.connect('activated', () => this.#openPrefs());
 
                 source.showNotification(notification);
 
@@ -364,4 +373,4 @@ var Timer = class extends GObject.Object {
 
         debug.message(`New sun times: (sunrise: ${sunrise}; sunset: ${sunset})`);
     }
-};
+}

src/preferences/BackgroundButton.js

@@ -1,16 +1,24 @@
 // SPDX-FileCopyrightText: 2021, 2022 Romain Vigier <contact AT romainvigier.fr>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-const { Adw, Gdk, GdkPixbuf, Gio, GLib, GObject, Gtk } = imports.gi;
+import Adw from 'gi://Adw';
-const { extensionUtils } = imports.misc;
+import Gdk from 'gi://Gdk';
+import GdkPixbuf from 'gi://GdkPixbuf';
+import Gio from 'gi://Gio';
+import GLib from 'gi://GLib';
+import GObject from 'gi://GObject';
+import Gtk from 'gi://Gtk';
 
-const Me = extensionUtils.getCurrentExtension();
+import { gettext as _ } from 'resource:///org/gnome/Shell/Extensions/js/extensions/prefs.js';
-const _ = extensionUtils.gettext;
 
 
-var BackgroundButton = GObject.registerClass({
+export class BackgroundButton extends Gtk.Button {
+    #uri;
+
+    static {
+        GObject.registerClass({
             GTypeName: 'BackgroundButton',
-    Template: 'resource:///org/gnome/shell/extensions/nightthemeswitcher/preferences/ui/BackgroundButton.ui',
+            Template: 'resource:///org/gnome/Shell/Extensions/nightthemeswitcher/preferences/ui/BackgroundButton.ui',
             InternalChildren: ['filechooser', 'thumbnail'],
             Properties: {
                 uri: GObject.ParamSpec.string(
@@ -37,11 +45,11 @@ var BackgroundButton = GObject.registerClass({
                     180
                 ),
             },
-}, class BackgroundButton extends Gtk.Button {
+        }, this);
-    #uri;
+    }
 
-    constructor(props = {}) {
+    constructor({ ...params } = {}) {
-        super(props);
+        super(params);
         this.#setupSize();
         this.#setupDropTarget();
         this.#setupFileChooserFilter();
@@ -151,7 +159,7 @@ var BackgroundButton = GObject.registerClass({
                 if (!this.#isContentTypeSupported(Gio.content_type_guess(path, null)[0]))
                     throw new Error();
             } catch (e) {
-                console.error(`[${Me.metadata.name}] No suitable background file found in ${file.get_path()}.\n${e}`);
+                console.error(`No suitable background file found in ${file.get_path()}.\n${e}`);
                 return;
             }
         } else {
@@ -172,4 +180,4 @@ var BackgroundButton = GObject.registerClass({
 
         this._thumbnail.paintable = Gdk.Texture.new_for_pixbuf(thumbPixbuf);
     }
-});
+}

src/preferences/BackgroundsPage.js

@@ -1,25 +1,28 @@
 // SPDX-FileCopyrightText: 2020-2022 Romain Vigier <contact AT romainvigier.fr>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-const { Adw, Gio, GLib, GObject } = imports.gi;
+import Adw from 'gi://Adw';
-const { extensionUtils } = imports.misc;
+import Gio from 'gi://Gio';
-
+import GObject from 'gi://GObject';
-const Me = extensionUtils.getCurrentExtension();
 
 
-var BackgroundsPage = GObject.registerClass({
+export class BackgroundsPage extends Adw.PreferencesPage {
+    static {
+        GObject.registerClass({
             GTypeName: 'BackgroundsPage',
-    Template: 'resource:///org/gnome/shell/extensions/nightthemeswitcher/preferences/ui/BackgroundsPage.ui',
+            Template: 'resource:///org/gnome/Shell/Extensions/nightthemeswitcher/preferences/ui/BackgroundsPage.ui',
             InternalChildren: [
                 'day_button',
                 'night_button',
             ],
-}, class BackgroundsPage extends Adw.PreferencesPage {
+        }, this);
-    constructor(props = {}) {
+    }
-        super(props);
+
+    constructor({ ...params } = {}) {
+        super(params);
         const settings = new Gio.Settings({ schema: 'org.gnome.desktop.background' });
 
         settings.bind('picture-uri', this._day_button, 'uri', Gio.SettingsBindFlags.DEFAULT);
         settings.bind('picture-uri-dark', this._night_button, 'uri', Gio.SettingsBindFlags.DEFAULT);
     }
-});
+}

src/preferences/ClearableEntry.js

@@ -1,18 +1,20 @@
 // SPDX-FileCopyrightText: 2021 Romain Vigier <contact AT romainvigier.fr>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-const { Gio, GLib, GObject, Gtk } = imports.gi;
+import GObject from 'gi://GObject';
-const { extensionUtils } = imports.misc;
+import Gtk from 'gi://Gtk';
-
-const Me = extensionUtils.getCurrentExtension();
 
 
-var ClearableEntry = GObject.registerClass({
+export class ClearableEntry extends Gtk.Entry {
+    static {
+        GObject.registerClass({
             GTypeName: 'ClearableEntry',
-    Template: 'resource:///org/gnome/shell/extensions/nightthemeswitcher/preferences/ui/ClearableEntry.ui',
+            Template: 'resource:///org/gnome/Shell/Extensions/nightthemeswitcher/preferences/ui/ClearableEntry.ui',
-}, class ClearableEntry extends Gtk.Entry {
+        }, this);
+    }
+
     onIconReleased(entry, position) {
         if (position === Gtk.EntryIconPosition.SECONDARY)
             entry.text = '';
     }
-});
+}

src/preferences/CommandsPage.js

@@ -1,27 +1,29 @@
 // SPDX-FileCopyrightText: 2020-2022 Romain Vigier <contact AT romainvigier.fr>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-const { Adw, Gio, GLib, GObject } = imports.gi;
+import Adw from 'gi://Adw';
-const { extensionUtils } = imports.misc;
+import Gio from 'gi://Gio';
-
+import GObject from 'gi://GObject';
-const Me = extensionUtils.getCurrentExtension();
 
 
-var CommandsPage = GObject.registerClass({
+export class CommandsPage extends Adw.PreferencesPage {
+    static {
+        GObject.registerClass({
             GTypeName: 'CommandsPage',
-    Template: 'resource:///org/gnome/shell/extensions/nightthemeswitcher/preferences/ui/CommandsPage.ui',
+            Template: 'resource:///org/gnome/Shell/Extensions/nightthemeswitcher/preferences/ui/CommandsPage.ui',
             InternalChildren: [
                 'enabled_switch',
                 'sunrise_entry',
                 'sunset_entry',
             ],
-}, class CommandsPage extends Adw.PreferencesPage {
+        }, this);
-    constructor(props = {}) {
+    }
-        super(props);
+
-        const settings = extensionUtils.getSettings(`${Me.metadata['settings-schema']}.commands`);
+    constructor({ settings, ...params } = {}) {
+        super(params);
 
         settings.bind('enabled', this._enabled_switch, 'active', Gio.SettingsBindFlags.DEFAULT);
         settings.bind('sunrise', this._sunrise_entry, 'text', Gio.SettingsBindFlags.DEFAULT);
         settings.bind('sunset', this._sunset_entry, 'text', Gio.SettingsBindFlags.DEFAULT);
     }
-});
+}

src/preferences/ContributePage.js

@@ -1,18 +1,15 @@
 // SPDX-FileCopyrightText: 2022 Romain Vigier <contact AT romainvigier.fr>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-const { Adw, GLib, GObject } = imports.gi;
+import Adw from 'gi://Adw';
-const { extensionUtils } = imports.misc;
+import GObject from 'gi://GObject';
-
-const Me = extensionUtils.getCurrentExtension();
-const _ = extensionUtils.gettext;
 
 
-var ContributePage = GObject.registerClass({
+export class ContributePage extends Adw.PreferencesPage {
+    static {
+        GObject.registerClass({
             GTypeName: 'ContributePage',
-    Template: 'resource:///org/gnome/shell/extensions/nightthemeswitcher/preferences/ui/ContributePage.ui',
+            Template: 'resource:///org/gnome/Shell/Extensions/nightthemeswitcher/preferences/ui/ContributePage.ui',
-}, class ContributePage extends Adw.PreferencesPage {
+        }, this);
-    getVersionString(_page) {
+    }
-        return _('Version %d').format(Me.metadata.version);
 }
-});

src/preferences/DropDownChoice.js

@@ -1,10 +1,12 @@
 // SPDX-FileCopyrightText: 2020, 2021 Romain Vigier <contact AT romainvigier.fr>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-const { GObject } = imports.gi;
+import GObject from 'gi://GObject';
 
 
-var DropDownChoice = GObject.registerClass({
+export class DropDownChoice extends GObject.Object {
+    static {
+        GObject.registerClass({
             GTypeName: 'DropDownChoice',
             Properties: {
                 id: GObject.ParamSpec.string(
@@ -29,4 +31,6 @@ var DropDownChoice = GObject.registerClass({
                     true
                 ),
             },
-}, class DropDownChoice extends GObject.Object {});
+        }, this);
+    }
+}

src/preferences/SchedulePage.js

@@ -1,25 +1,27 @@
 // SPDX-FileCopyrightText: 2020-2022 Romain Vigier <contact AT romainvigier.fr>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-const { Adw, Gio, GLib, GObject, Gtk } = imports.gi;
+import Adw from 'gi://Adw';
-const { extensionUtils } = imports.misc;
+import Gio from 'gi://Gio';
-
+import GObject from 'gi://GObject';
-const Me = extensionUtils.getCurrentExtension();
 
 
-var SchedulePage = GObject.registerClass({
+export class SchedulePage extends Adw.PreferencesPage {
+    static {
+        GObject.registerClass({
             GTypeName: 'SchedulePage',
-    Template: 'resource:///org/gnome/shell/extensions/nightthemeswitcher/preferences/ui/SchedulePage.ui',
+            Template: 'resource:///org/gnome/Shell/Extensions/nightthemeswitcher/preferences/ui/SchedulePage.ui',
             InternalChildren: [
                 'manual_schedule_switch',
                 'keyboard_shortcut_button',
                 'schedule_sunrise_time_chooser',
                 'schedule_sunset_time_chooser',
             ],
-}, class SchedulePage extends Adw.PreferencesPage {
+        }, this);
-    constructor(props = {}) {
+    }
-        super(props);
+
-        const settings = extensionUtils.getSettings(`${Me.metadata['settings-schema']}.time`);
+    constructor({ settings, ...params } = {}) {
+        super(params);
 
         settings.bind('manual-schedule', this._manual_schedule_switch, 'active', Gio.SettingsBindFlags.DEFAULT);
 
@@ -34,4 +36,4 @@ var SchedulePage = GObject.registerClass({
         });
         this._keyboard_shortcut_button.keybinding = settings.get_strv('nightthemeswitcher-ondemand-keybinding')[0];
     }
-});
+}

src/preferences/ShortcutButton.js

@@ -1,17 +1,16 @@
 // SPDX-FileCopyrightText: 2021, 2022 Romain Vigier <contact AT romainvigier.fr>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-const { Gdk, GLib, GObject, Gtk } = imports.gi;
+import Gdk from 'gi://Gdk';
-const { extensionUtils } = imports.misc;
+import GObject from 'gi://GObject';
-
+import Gtk from 'gi://Gtk';
-const Me = extensionUtils.getCurrentExtension();
-
-const utils = Me.imports.utils;
 
 
-var ShortcutButton = GObject.registerClass({
+export class ShortcutButton extends Gtk.Stack {
+    static {
+        GObject.registerClass({
             GTypeName: 'ShortcutButton',
-    Template: 'resource:///org/gnome/shell/extensions/nightthemeswitcher/preferences/ui/ShortcutButton.ui',
+            Template: 'resource:///org/gnome/Shell/Extensions/nightthemeswitcher/preferences/ui/ShortcutButton.ui',
             InternalChildren: ['choose_button', 'change_button', 'clear_button', 'dialog'],
             Properties: {
                 keybinding: GObject.ParamSpec.string(
@@ -22,7 +21,9 @@ var ShortcutButton = GObject.registerClass({
                     null
                 ),
             },
-}, class ShortcutButton extends Gtk.Stack {
+        }, this);
+    }
+
     vfunc_mnemonic_activate() {
         this.activate();
     }
@@ -65,8 +66,8 @@ var ShortcutButton = GObject.registerClass({
         }
 
         if (
-            !utils.isBindingValid({ mask, keycode, keyval }) ||
+            !isBindingValid({ mask, keycode, keyval }) ||
-            !utils.isAccelValid({ mask, keyval })
+            !isAccelValid({ mask, keyval })
         )
             return Gdk.EVENT_STOP;
 
@@ -79,4 +80,68 @@ var ShortcutButton = GObject.registerClass({
         this._dialog.close();
         return Gdk.EVENT_STOP;
     }
-});
+}
+
+
+/**
+ * Check if the given keyval is forbidden.
+ *
+ * @param {number} keyval The keyval number.
+ * @returns {boolean} `true` if the keyval is forbidden.
+ */
+function isKeyvalForbidden(keyval) {
+    const forbiddenKeyvals = [
+        Gdk.KEY_Home,
+        Gdk.KEY_Left,
+        Gdk.KEY_Up,
+        Gdk.KEY_Right,
+        Gdk.KEY_Down,
+        Gdk.KEY_Page_Up,
+        Gdk.KEY_Page_Down,
+        Gdk.KEY_End,
+        Gdk.KEY_Tab,
+        Gdk.KEY_KP_Enter,
+        Gdk.KEY_Return,
+        Gdk.KEY_Mode_switch,
+    ];
+    return forbiddenKeyvals.includes(keyval);
+}
+
+/**
+ * Check if the given key combo is a valid binding
+ *
+ * @param {{mask: number, keycode: number, keyval:number}} combo An object
+ * representing the key combo.
+ * @returns {boolean} `true` if the key combo is a valid binding.
+ */
+function isBindingValid({ mask, keycode, keyval }) {
+    if ((mask === 0 || mask === Gdk.SHIFT_MASK) && keycode !== 0) {
+        if (
+            (keyval >= Gdk.KEY_a && keyval <= Gdk.KEY_z) ||
+            (keyval >= Gdk.KEY_A && keyval <= Gdk.KEY_Z) ||
+            (keyval >= Gdk.KEY_0 && keyval <= Gdk.KEY_9) ||
+            (keyval >= Gdk.KEY_kana_fullstop && keyval <= Gdk.KEY_semivoicedsound) ||
+            (keyval >= Gdk.KEY_Arabic_comma && keyval <= Gdk.KEY_Arabic_sukun) ||
+            (keyval >= Gdk.KEY_Serbian_dje && keyval <= Gdk.KEY_Cyrillic_HARDSIGN) ||
+            (keyval >= Gdk.KEY_Greek_ALPHAaccent && keyval <= Gdk.KEY_Greek_omega) ||
+            (keyval >= Gdk.KEY_hebrew_doublelowline && keyval <= Gdk.KEY_hebrew_taf) ||
+            (keyval >= Gdk.KEY_Thai_kokai && keyval <= Gdk.KEY_Thai_lekkao) ||
+            (keyval >= Gdk.KEY_Hangul_Kiyeog && keyval <= Gdk.KEY_Hangul_J_YeorinHieuh) ||
+            (keyval === Gdk.KEY_space && mask === 0) ||
+            isKeyvalForbidden(keyval)
+        )
+            return false;
+    }
+    return true;
+}
+
+/**
+ * Check if the given key combo is a valid accelerator.
+ *
+ * @param {{mask: number, keyval:number}} combo An object representing the key
+ * combo.
+ * @returns {boolean} `true` if the key combo is a valid accelerator.
+ */
+function isAccelValid({ mask, keyval }) {
+    return Gtk.accelerator_valid(keyval, mask) || (keyval === Gdk.KEY_Tab && mask !== 0);
+}

src/preferences/ThemesPage.js

@@ -1,20 +1,23 @@
 // SPDX-FileCopyrightText: 2020-2022 Romain Vigier <contact AT romainvigier.fr>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-const { Adw, Gio, GLib, GObject, Gtk } = imports.gi;
+import Adw from 'gi://Adw';
-const { extensionUtils } = imports.misc;
+import Gio from 'gi://Gio';
+import GObject from 'gi://GObject';
+import Gtk from 'gi://Gtk';
 
-const Me = extensionUtils.getCurrentExtension();
+import { gettext as _ } from 'resource:///org/gnome/Shell/Extensions/js/extensions/prefs.js';
-const _ = extensionUtils.gettext;
 
-const utils = Me.imports.utils;
+import * as utils from '../utils.js';
 
-const { DropDownChoice } = Me.imports.preferences.DropDownChoice;
+import { DropDownChoice } from './DropDownChoice.js';
 
 
-var ThemesPage = GObject.registerClass({
+export class ThemesPage extends Adw.PreferencesPage {
+    static {
+        GObject.registerClass({
             GTypeName: 'ThemesPage',
-    Template: 'resource:///org/gnome/shell/extensions/nightthemeswitcher/preferences/ui/ThemesPage.ui',
+            Template: 'resource:///org/gnome/Shell/Extensions/nightthemeswitcher/preferences/ui/ThemesPage.ui',
             InternalChildren: [
                 'gtk_row',
                 'gtk_day_variant_combo_row',
@@ -29,13 +32,11 @@ var ThemesPage = GObject.registerClass({
                 'cursor_day_variant_combo_row',
                 'cursor_night_variant_combo_row',
             ],
-}, class ThemesPage extends Adw.PreferencesPage {
+        }, this);
-    constructor(props = {}) {
+    }
-        super(props);
+
-        const gtkSettings = extensionUtils.getSettings(`${Me.metadata['settings-schema']}.gtk-variants`);
+    constructor({ gtkSettings, shellSettings, iconSettings, cursorSettings, ...params } = {}) {
-        const shellSettings = extensionUtils.getSettings(`${Me.metadata['settings-schema']}.shell-variants`);
+        super(params);
-        const iconSettings = extensionUtils.getSettings(`${Me.metadata['settings-schema']}.icon-variants`);
-        const cursorSettings = extensionUtils.getSettings(`${Me.metadata['settings-schema']}.cursor-variants`);
 
         gtkSettings.bind('enabled', this._gtk_row, 'enable-expansion', Gio.SettingsBindFlags.DEFAULT);
 
@@ -65,7 +66,8 @@ var ThemesPage = GObject.registerClass({
         _setupComboRow(this._cursor_day_variant_combo_row, cursorThemesStore, cursorSettings, 'day');
         _setupComboRow(this._cursor_night_variant_combo_row, cursorThemesStore, cursorSettings, 'night');
     }
-});
+}
+
 
 /**
  * Set up the model of a combo row.

src/preferences/TimeChooser.js

@@ -1,15 +1,15 @@
 // SPDX-FileCopyrightText: 2021 Romain Vigier <contact AT romainvigier.fr>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-const { GLib, GObject, Gtk } = imports.gi;
+import GObject from 'gi://GObject';
-const { extensionUtils } = imports.misc;
+import Gtk from 'gi://Gtk';
-
-const Me = extensionUtils.getCurrentExtension();
 
 
-var TimeChooser = GObject.registerClass({
+export class TimeChooser extends Gtk.Box {
+    static {
+        GObject.registerClass({
             GTypeName: 'TimeChooser',
-    Template: 'resource:///org/gnome/shell/extensions/nightthemeswitcher/preferences/ui/TimeChooser.ui',
+            Template: 'resource:///org/gnome/Shell/Extensions/nightthemeswitcher/preferences/ui/TimeChooser.ui',
             InternalChildren: ['hours', 'minutes'],
             Properties: {
                 time: GObject.ParamSpec.double(
@@ -22,7 +22,9 @@ var TimeChooser = GObject.registerClass({
                     0
                 ),
             },
-}, class TimeChooser extends Gtk.Box {
+        }, this);
+    }
+
     onTimeChanged(chooser) {
         const hours = Math.trunc(chooser.time);
         const minutes = Math.round((chooser.time - hours) * 60);
@@ -40,4 +42,4 @@ var TimeChooser = GObject.registerClass({
         spin.text = spin.value.toString().padStart(2, '0');
         return true;
     }
-});
+}

src/prefs.js

@@ -3,57 +3,78 @@
 
 'use strict';
 
-const { Adw, Gdk, Gio, GLib, GObject, Gtk } = imports.gi;
+import Adw from 'gi://Adw';
-const { extensionUtils } = imports.misc;
+import Gdk from 'gi://Gdk';
+import Gio from 'gi://Gio';
+import GLib from 'gi://GLib';
+import GObject from 'gi://GObject';
+import Gtk from 'gi://Gtk';
 
-const Me = extensionUtils.getCurrentExtension();
+import { ExtensionPreferences } from 'resource:///org/gnome/Shell/Extensions/js/extensions/prefs.js';
-const _ = extensionUtils.gettext;
 
 
-/**
+export default class NightThemeSwitcherPreferences extends ExtensionPreferences {
- * Initialize the preferences.
- */
-function init() {
-    extensionUtils.initTranslations();
-
-    const resource = Gio.Resource.load(GLib.build_filenamev([Me.path, 'resources', 'preferences.gresource']));
-    Gio.resources_register(resource);
-
-    GObject.type_ensure(Me.imports.preferences.BackgroundsPage.BackgroundsPage);
-    GObject.type_ensure(Me.imports.preferences.CommandsPage.CommandsPage);
-    GObject.type_ensure(Me.imports.preferences.ContributePage.ContributePage);
-    GObject.type_ensure(Me.imports.preferences.SchedulePage.SchedulePage);
-    GObject.type_ensure(Me.imports.preferences.ThemesPage.ThemesPage);
-
-    GObject.type_ensure(Me.imports.preferences.BackgroundButton.BackgroundButton);
-    GObject.type_ensure(Me.imports.preferences.ClearableEntry.ClearableEntry);
-    GObject.type_ensure(Me.imports.preferences.ShortcutButton.ShortcutButton);
-    GObject.type_ensure(Me.imports.preferences.TimeChooser.TimeChooser);
-
-    const iconTheme = Gtk.IconTheme.get_for_display(Gdk.Display.get_default());
-    iconTheme.add_resource_path('/org/gnome/shell/extensions/nightthemeswitcher/preferences/icons');
-}
-
     /**
      * Fill the PreferencesWindow.
      *
      * @param {Adw.PreferencesWindow} window The PreferencesWindow to fill.
      */
-function fillPreferencesWindow(window) {
+    async fillPreferencesWindow(window) {
-    const { BackgroundsPage } = Me.imports.preferences.BackgroundsPage;
+        // Load resources
-    const { CommandsPage } = Me.imports.preferences.CommandsPage;
+        const resource = Gio.Resource.load(GLib.build_filenamev([this.path, 'resources', 'preferences.gresource']));
-    const { ContributePage } = Me.imports.preferences.ContributePage;
+        Gio.resources_register(resource);
-    const { SchedulePage } = Me.imports.preferences.SchedulePage;
-    const { ThemesPage } = Me.imports.preferences.ThemesPage;
 
+        // Load icons
+        const iconTheme = Gtk.IconTheme.get_for_display(Gdk.Display.get_default());
+        iconTheme.add_resource_path('/org/gnome/Shell/Extensions/nightthemeswitcher/preferences/icons');
+
+        // Set window properties
+        window.search_enabled = true;
+        window.set_default_size(640, 600);
+
+        // Add a dummy page until the dynamics imports are done
+        const dummyPage = new Adw.PreferencesPage();
+        window.add(dummyPage);
+
+        // Dynamically import all classes
+        const { BackgroundButton } = await import('./preferences/BackgroundButton.js');
+        const { BackgroundsPage } = await import('./preferences/BackgroundsPage.js');
+        const { ClearableEntry } = await import('./preferences/ClearableEntry.js');
+        const { CommandsPage } = await import('./preferences/CommandsPage.js');
+        const { ContributePage } = await import('./preferences/ContributePage.js');
+        const { DropDownChoice } = await import('./preferences/DropDownChoice.js');
+        const { SchedulePage } = await import('./preferences/SchedulePage.js');
+        const { ShortcutButton } = await import('./preferences/ShortcutButton.js');
+        const { ThemesPage } = await import('./preferences/ThemesPage.js');
+        const { TimeChooser } = await import('./preferences/TimeChooser.js');
+
+        // Make sure all GObjects are registered
+        GObject.type_ensure(BackgroundButton);
+        GObject.type_ensure(BackgroundsPage);
+        GObject.type_ensure(ClearableEntry);
+        GObject.type_ensure(CommandsPage);
+        GObject.type_ensure(ContributePage);
+        GObject.type_ensure(DropDownChoice);
+        GObject.type_ensure(SchedulePage);
+        GObject.type_ensure(ShortcutButton);
+        GObject.type_ensure(ThemesPage);
+        GObject.type_ensure(TimeChooser);
+
+        // Remove the dummy page
+        window.remove(dummyPage);
+
+        // Add all pages
         [
-        new SchedulePage(),
+            new SchedulePage({ settings: this.getSettings(`${this.metadata['settings-schema']}.time`) }),
             new BackgroundsPage(),
-        new CommandsPage(),
+            new CommandsPage({ settings: this.getSettings(`${this.metadata['settings-schema']}.commands`) }),
-        new ThemesPage(),
+            new ThemesPage({
+                gtkSettings: this.getSettings(`${this.metadata['settings-schema']}.gtk-variants`),
+                shellSettings: this.getSettings(`${this.metadata['settings-schema']}.shell-variants`),
+                iconSettings: this.getSettings(`${this.metadata['settings-schema']}.icon-variants`),
+                cursorSettings: this.getSettings(`${this.metadata['settings-schema']}.cursor-variants`),
+            }),
             new ContributePage(),
         ].forEach(page => window.add(page));
-
+    }
-    window.search_enabled = true;
-    window.set_default_size(720, 490);
 }

src/utils.js

@@ -1,15 +1,9 @@
 // SPDX-FileCopyrightText: 2020, 2021 Romain Vigier <contact AT romainvigier.fr>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-const { Gdk, Gio, GLib, Gtk } = imports.gi;
+import Gio from 'gi://Gio';
-const { extensionUtils } = imports.misc;
+import GLib from 'gi://GLib';
-
+import Gtk from 'gi://Gtk';
-const Me = extensionUtils.getCurrentExtension();
-
-const Gettext = imports.gettext.domain(Me.metadata['gettext-domain']);
-const _ = Gettext.gettext;
-
-const { ExtensionState } = extensionUtils;
 
 
 /**
@@ -18,7 +12,7 @@ const { ExtensionState } = extensionUtils;
  * @param {string} resource The resource to get the directories.
  * @returns {string[]} An array of paths.
  */
-function getResourcesDirsPaths(resource) {
+export function getResourcesDirsPaths(resource) {
     return [
         GLib.build_filenamev([GLib.get_home_dir(), `.${resource}`]),
         GLib.build_filenamev([GLib.get_user_data_dir(), resource]),
@@ -62,7 +56,7 @@ function getInstalledResources(type) {
  *
  * @returns {Set<string>} A set containing all the installed GTK themes names.
  */
-function getInstalledGtkThemes() {
+export function getInstalledGtkThemes() {
     const themes = new Set();
     getInstalledResources('themes').forEach(theme => {
         const version = [0, Gtk.MINOR_VERSION].find(gtkVersion => {
@@ -82,7 +76,7 @@ function getInstalledGtkThemes() {
  *
  * @returns {Set<string>} A set containing all the installed shell themes names.
  */
-function getInstalledShellThemes() {
+export function getInstalledShellThemes() {
     const themes = new Set(['']);
     getInstalledResources('themes').forEach(theme => {
         const themeFile = Gio.File.new_for_path(GLib.build_filenamev([theme.get('path'), 'gnome-shell', 'gnome-shell.css']));
@@ -97,7 +91,7 @@ function getInstalledShellThemes() {
  *
  * @returns {Set<string>} A set containing all the installed icon themes names.
  */
-function getInstalledIconThemes() {
+export function getInstalledIconThemes() {
     const themes = new Set();
     getInstalledResources('icons').forEach(theme => {
         const themeFile = Gio.File.new_for_path(GLib.build_filenamev([theme.get('path'), 'index.theme']));
@@ -113,7 +107,7 @@ function getInstalledIconThemes() {
  *
  * @returns {Set<string>} A set containing all the installed cursor themes names.
  */
-function getInstalledCursorThemes() {
+export function getInstalledCursorThemes() {
     const themes = new Set();
     getInstalledResources('icons').forEach(theme => {
         const themeFile = Gio.File.new_for_path(GLib.build_filenamev([theme.get('path'), 'cursors']));
@@ -123,136 +117,6 @@ function getInstalledCursorThemes() {
     return themes;
 }
 
-/**
- * Get the User Themes extension.
- *
- * @returns {object|undefined} The User Themes extension object or undefined if
- * it isn't installed.
- */
-function getUserthemesExtension() {
-    try {
-        return imports.ui.main.extensionManager.lookup('user-theme@gnome-shell-extensions.gcampax.github.com');
-    } catch (_e) {
-        return undefined;
-    }
-}
-
-/**
- * Get the User Themes extension settings.
- *
- * @returns {Gio.Settings|null} The User Themes extension settings or null if
- * the extension isn't installed.
- */
-function getUserthemesSettings() {
-    let extension = getUserthemesExtension();
-    if (!extension || extension.state !== ExtensionState.ENABLED)
-        return null;
-    const schemaDir = extension.dir.get_child('schemas');
-    const GioSSS = Gio.SettingsSchemaSource;
-    let schemaSource;
-    if (schemaDir.query_exists(null))
-        schemaSource = GioSSS.new_from_directory(schemaDir.get_path(), GioSSS.get_default(), false);
-    else
-        schemaSource = GioSSS.get_default();
-    const schemaObj = schemaSource.lookup('org.gnome.shell.extensions.user-theme', true);
-    return new Gio.Settings({ settings_schema: schemaObj });
-}
-
-/**
- * Get the shell theme stylesheet.
- *
- * @param {string} theme The shell theme name.
- * @returns {string|null} Path to the shell theme stylesheet.
- */
-function getShellThemeStylesheet(theme) {
-    const themeName = theme ? `'${theme}'` : 'default';
-    console.debug(`Getting the ${themeName} theme shell stylesheet...`);
-    let stylesheet = null;
-    if (theme) {
-        const stylesheetPaths = getResourcesDirsPaths('themes').map(path => GLib.build_filenamev([path, theme, 'gnome-shell', 'gnome-shell.css']));
-        stylesheet = stylesheetPaths.find(path => {
-            const file = Gio.file_new_for_path(path);
-            return file.query_exists(null);
-        });
-    }
-    return stylesheet;
-}
-
-/**
- * Apply a stylesheet to the shell.
- *
- * @param {string} stylesheet The shell stylesheet to apply.
- */
-function applyShellStylesheet(stylesheet) {
-    console.debug('Applying shell stylesheet...');
-    imports.ui.main.setThemeStylesheet(stylesheet);
-    imports.ui.main.loadTheme();
-    console.debug('Shell stylesheet applied.');
-}
-
-/**
- * Check if the given keyval is forbidden.
- *
- * @param {number} keyval The keyval number.
- * @returns {boolean} `true` if the keyval is forbidden.
- */
-function isKeyvalForbidden(keyval) {
-    const forbiddenKeyvals = [
-        Gdk.KEY_Home,
-        Gdk.KEY_Left,
-        Gdk.KEY_Up,
-        Gdk.KEY_Right,
-        Gdk.KEY_Down,
-        Gdk.KEY_Page_Up,
-        Gdk.KEY_Page_Down,
-        Gdk.KEY_End,
-        Gdk.KEY_Tab,
-        Gdk.KEY_KP_Enter,
-        Gdk.KEY_Return,
-        Gdk.KEY_Mode_switch,
-    ];
-    return forbiddenKeyvals.includes(keyval);
-}
-
-/**
- * Check if the given key combo is a valid binding
- *
- * @param {{mask: number, keycode: number, keyval:number}} combo An object
- * representing the key combo.
- * @returns {boolean} `true` if the key combo is a valid binding.
- */
-function isBindingValid({ mask, keycode, keyval }) {
-    if ((mask === 0 || mask === Gdk.SHIFT_MASK) && keycode !== 0) {
-        if (
-            (keyval >= Gdk.KEY_a && keyval <= Gdk.KEY_z) ||
-            (keyval >= Gdk.KEY_A && keyval <= Gdk.KEY_Z) ||
-            (keyval >= Gdk.KEY_0 && keyval <= Gdk.KEY_9) ||
-            (keyval >= Gdk.KEY_kana_fullstop && keyval <= Gdk.KEY_semivoicedsound) ||
-            (keyval >= Gdk.KEY_Arabic_comma && keyval <= Gdk.KEY_Arabic_sukun) ||
-            (keyval >= Gdk.KEY_Serbian_dje && keyval <= Gdk.KEY_Cyrillic_HARDSIGN) ||
-            (keyval >= Gdk.KEY_Greek_ALPHAaccent && keyval <= Gdk.KEY_Greek_omega) ||
-            (keyval >= Gdk.KEY_hebrew_doublelowline && keyval <= Gdk.KEY_hebrew_taf) ||
-            (keyval >= Gdk.KEY_Thai_kokai && keyval <= Gdk.KEY_Thai_lekkao) ||
-            (keyval >= Gdk.KEY_Hangul_Kiyeog && keyval <= Gdk.KEY_Hangul_J_YeorinHieuh) ||
-            (keyval === Gdk.KEY_space && mask === 0) ||
-            isKeyvalForbidden(keyval)
-        )
-            return false;
-    }
-    return true;
-}
-
-/**
- * Check if the given key combo is a valid accelerator.
- *
- * @param {{mask: number, keyval:number}} combo An object representing the key
- * combo.
- * @returns {boolean} `true` if the key combo is a valid accelerator.
- */
-function isAccelValid({ mask, keyval }) {
-    return Gtk.accelerator_valid(keyval, mask) || (keyval === Gdk.KEY_Tab && mask !== 0);
-}
-
 /**
  * Find an item in a `Gio.ListModel`.
  *
@@ -260,7 +124,7 @@ function isAccelValid({ mask, keyval }) {
  * @param {Function} findFunction The function used to find the item. Gets the item as argument.
  * @returns {(*|undefined)} The found item or `undefined`.
  */
-function findItemPositionInModel(model, findFunction) {
+export function findItemPositionInModel(model, findFunction) {
     const nItems = model.get_n_items();
     for (let i = 0; i < nItems; i++) {
         if (findFunction(model.get_item(i)))