Add donation settings page

Makefile

@@ -1,11 +1,9 @@
 # Basic Makefile
 
 UUID = dash-to-panel@jderose9.github.com
-BASE_MODULES = extension.js stylesheet.css metadata.json COPYING README.md
+MODULES = ./*.js stylesheet.css metadata.json COPYING README.md
-EXTRA_MODULES = appIcons.js panel.js panelManager.js proximity.js intellihide.js progress.js panelPositions.js panelSettings.js panelStyle.js overview.js taskbar.js transparency.js windowPreview.js prefs.js utils.js desktopIconsIntegration.js
+UI_MODULES = ui/*.ui
-UI_MODULES = ui/BoxAdvancedOptions.ui ui/BoxAnimateAppIconHoverOptions.ui ui/BoxDotOptions.ui ui/BoxDynamicOpacityOptions.ui ui/BoxGroupAppsOptions.ui ui/BoxIntellihideOptions.ui ui/BoxMiddleClickOptions.ui ui/BoxOverlayShortcut.ui ui/BoxScrollIconOptions.ui ui/BoxScrollPanelOptions.ui ui/BoxSecondaryMenuOptions.ui ui/BoxShowApplicationsOptions.ui ui/BoxShowDesktopOptions.ui ui/BoxWindowPreviewOptions.ui ui/SettingsAbout.ui ui/SettingsAction.ui ui/SettingsBehavior.ui ui/SettingsFineTune.ui ui/SettingsPosition.ui ui/SettingsStyle.ui
+IMAGES = ./* ../media/design/svg/dash-to-panel-logo-light.svg
-
-EXTRA_IMAGES = highlight_stacked_bg.svg highlight_stacked_bg_2.svg highlight_stacked_bg_3.svg
 
 TOLOCALIZE =  prefs.js appIcons.js
 MSGSRC = $(wildcard po/*.po)
@@ -83,12 +81,12 @@ zip-file: _build
 _build: all
 	-rm -fR ./_build
 	mkdir -p _build
-	cp $(BASE_MODULES) $(EXTRA_MODULES) _build
+	cp $(MODULES) _build
 	mkdir -p _build/ui
 	cp $(UI_MODULES) _build/ui
 
 	mkdir -p _build/img
-	cd img ; cp $(EXTRA_IMAGES) ../_build/img/
+	cd img ; cp $(IMAGES) ../_build/img/
 	mkdir -p _build/schemas
 	cp schemas/*.xml _build/schemas/
 	cp schemas/gschemas.compiled _build/schemas/

extension.js

@@ -118,6 +118,12 @@ function _enable(extension) {
         });
     }
 
+    // show the donate icon every 120 days (10368000000 milliseconds)
+    let donateIconUnixtime = SETTINGS.get_string('hide-donate-icon-unixtime')
+
+    if (donateIconUnixtime && donateIconUnixtime < Date.now() - 10368000000)
+        SETTINGS.set_string('hide-donate-icon-unixtime', '')
+
     panelManager = new PanelManager.PanelManager();
 
     panelManager.enable();

prefs.js

@@ -203,6 +203,10 @@ const Preferences = class {
         let pageFineTune = this._builder.get_object('finetune');
         window.add(pageFineTune);
 
+        this._builder.add_from_file(this._path + '/ui/SettingsDonation.ui');
+        let pageDonation = this._builder.get_object('donation');
+        window.add(pageDonation);
+
         this._builder.add_from_file(this._path + '/ui/SettingsAbout.ui');
         let pageAbout = this._builder.get_object('about');
         window.add(pageAbout);
@@ -229,6 +233,13 @@ const Preferences = class {
         this._leftbox_padding_timeout = 0;
         this._addFormatValueCallbacks();
         this._bindSettings();
+
+        let targetPageName = settings.get_string('target-prefs-page')
+        
+        if (targetPageName) {
+            window.set_visible_page_name(targetPageName)
+            settings.set_string('target-prefs-page', '')
+        }
     }
 
     /**
@@ -2127,6 +2138,31 @@ const Preferences = class {
             );
         });
 
+        // Donation panel
+
+        let revealDonateTimeout = 0;
+        let donationIconSwitch = this._builder.get_object('donation_icon_switch')
+        let donationRevealer = this._builder.get_object('donation_revealer');
+        let hiddenDonateIcon = !!this._settings.get_string('hide-donate-icon-unixtime')
+
+        this._builder.get_object('donation_logo').set_from_file(`${this._path}/img/dash-to-panel-logo-light.svg`)
+        this._builder.get_object('paypal_logo').set_from_file(`${this._path}/img/paypal.png`)
+        this._builder.get_object('stripe_logo').set_from_file(`${this._path}/img/stripe.png`)
+        this._builder.get_object('kofi_logo').set_from_file(`${this._path}/img/kofi.png`)
+        
+        donationIconSwitch.set_active(hiddenDonateIcon)
+        donationRevealer.set_reveal_child(hiddenDonateIcon)
+
+        donationIconSwitch.connect('notify::active', (widget) => 
+            this._settings.set_string('hide-donate-icon-unixtime', widget.get_active() ? Date.now().toString() : '')
+        )
+        
+        this.notebook.connect('notify::visible-page', () => {
+            clearTimeout(revealDonateTimeout)
+            
+            if (this.notebook.visible_page_name == 'donation' && !donationRevealer.get_reveal_child())
+                revealDonateTimeout = setTimeout(() => donationRevealer.set_reveal_child(true), 14000)
+        })
     }
 
     _setPreviewTitlePosition() {

schemas/org.gnome.shell.extensions.dash-to-panel.gschema.xml

@@ -1279,5 +1279,13 @@
       <summary>Show badge count on app icon</summary>
       <description>Whether to show badge count overlay on app icon, for supported applications.</description>
     </key>
+    <key type="s" name="target-prefs-page">
+      <default>''</default>
+      <summary>The preferences page name to display</summary>
+    </key>
+    <key type="s" name="hide-donate-icon-unixtime">
+      <default>''</default>
+      <summary>Unix time when the donate icon was hidden</summary>
+    </key>
   </schema>
 </schemalist>

taskbar.js

@@ -42,7 +42,7 @@ import * as PanelSettings from './panelSettings.js';
 import * as Pos from './panelPositions.js';
 import * as Utils from './utils.js';
 import * as WindowPreview from './windowPreview.js';
-import {SETTINGS} from './extension.js';
+import {DTP_EXTENSION, SETTINGS} from './extension.js';
 
 const SearchController = Main.overview.searchController;
 
@@ -53,7 +53,45 @@ export const MIN_ICON_SIZE = 4;
 const T1 = 'ensureAppIconVisibilityTimeout'
 const T2 = 'showLabelTimeout'
 const T3 = 'resetHoverTimeout'
+const T4 = 'donateAppTimeout'
 
+let donateDummyApp = {
+    connect: () => [],
+    connectObject: () => [],
+    get_id: () => "dtp_donate",
+    get_windows: () => [],
+    get_name: function() { 
+        return this.isActive() ? _('Thank you!') : _("Please donate :)") 
+    },
+    create_icon_texture: function(size) { 
+        return new St.Icon({
+            icon_name: this.isActive() ? 'face-smile' : 'emote-love',
+            icon_size: size
+        })
+    },
+    activate: function() {
+        if (this.isActive())
+            return
+
+        SETTINGS.set_string('target-prefs-page', 'donation')
+        DTP_EXTENSION.openPreferences()
+        this._taskbar._timeoutsHandler.add([T4, 5000, this.forceRefresh.bind(this)])
+        this.forceRefresh()
+    },
+    forceRefresh: function() {
+        setDonateApp.call(this._taskbar)
+        this._taskbar._queueRedisplay()
+    },
+    isActive: function() {
+        return !!this._taskbar._timeoutsHandler.getId(T4)
+    }
+}
+
+function setDonateApp() {
+    this._donateApp = Object.create(donateDummyApp)
+    this._donateApp._taskbar = this
+    this._donateApp.visible = !SETTINGS.get_string('hide-donate-icon-unixtime')
+}
 
 /**
  * Extend DashItemContainer
@@ -360,7 +398,8 @@ export const Taskbar = class extends EventEmitter {
                     'changed::dot-size',
                     'changed::show-favorites',
                     'changed::show-running-apps',
-                    'changed::show-favorites-all-monitors'
+                    'changed::show-favorites-all-monitors',
+                    'changed::hide-donate-icon-unixtime'
                 ],
                 () => {
                     setAttributes()
@@ -404,6 +443,8 @@ export const Taskbar = class extends EventEmitter {
                                  (this.dtpPanel.isPrimary || SETTINGS.get_boolean('show-favorites-all-monitors'))
             this.showRunningApps = SETTINGS.get_boolean('show-running-apps')
             this.allowSplitApps = this.usingLaunchers || (!this.isGroupApps && !this.showFavorites)
+            
+            setDonateApp.call(this)
         }
 
         setAttributes()
@@ -914,15 +955,28 @@ export const Taskbar = class extends EventEmitter {
         // When using isolation, we filter out apps that have no windows in
         // the current workspace (this check is done in AppIcons.getInterestingWindows)
         let runningApps = this.showRunningApps ? this._getRunningApps().sort(this.sortAppsCompareFunction.bind(this)) : [];
+        let appInfos
 
         if (this.allowSplitApps) {
-            return this._createAppInfos(favoriteApps, [], true)
+            appInfos = this._createAppInfos(favoriteApps, [], true)
                        .concat(this._createAppInfos(runningApps)
                        .filter(appInfo => appInfo.windows.length));
         } else {
-            return this._createAppInfos(favoriteApps.concat(runningApps.filter(app => favoriteApps.indexOf(app) < 0)))
+            appInfos = this._createAppInfos(favoriteApps.concat(runningApps.filter(app => favoriteApps.indexOf(app) < 0)))
                        .filter(appInfo => appInfo.windows.length || favoriteApps.indexOf(appInfo.app) >= 0);
         }
+
+        if (this._donateApp.visible)
+            appInfos = [
+                {
+                    app: this._donateApp,
+                    isLauncher: true,
+                    windows: [],
+                },
+                ...appInfos
+            ]
+
+        return appInfos
     }
 
     _redisplay() {

ui/SettingsAction.ui

@@ -4,7 +4,7 @@
 
   <object class="AdwPreferencesPage" id="action">
     <property name="title" translatable="yes">Action</property>
-    <property name="icon_name">view-pin-symbolic</property>
+    <property name="icon_name">input-mouse-symbolic</property>
 
     <!-- group click action -->
     <child>

ui/SettingsDonation.ui

@@ -0,0 +1,167 @@
+<?xml version='1.0' encoding='UTF-8'?>
+<interface>
+  <requires lib="gtk" version="4.12"/>
+  <requires lib="libadwaita" version="1.6"/>
+  <object class="AdwPreferencesPage" id="donation">
+    <property name="hexpand-set">True</property>
+    <property name="icon-name">emote-love-symbolic</property>
+    <property name="name">donation</property>
+    <property name="title" translatable="yes">Donation</property>
+    <child>
+      <object class="AdwPreferencesGroup" id="donation_group">
+        <child>
+          <object class="GtkBox">
+            <property name="halign">center</property>
+            <property name="margin-bottom">50</property>
+            <property name="margin-top">50</property>
+            <property name="spacing">16</property>
+            <child>
+              <object class="GtkImage" id="donation_title_icon">
+                <property name="css-classes">error</property>
+                <property name="icon-name">emote-love-symbolic</property>
+                <property name="pixel-size">48</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkImage" id="donation_logo">
+                <property name="pixel-size">96</property>
+              </object>
+            </child>
+          </object>
+        </child>
+        <child>
+          <object class="GtkLabel" id="donation_label_1">
+            <property name="justify">center</property>
+            <property name="label" translatable="yes">&lt;span size="large"&gt;Gnome is the best desktop environment. No question. But if you're like me and would never use it without the enhanced workflow that Dash to Panel provides, please support my work by making a donation.&lt;/span&gt;</property>
+            <property name="margin-bottom">40</property>
+            <property name="use-markup">True</property>
+            <property name="wrap">True</property>
+          </object>
+        </child>
+        <child>
+          <object class="GtkLabel" id="donation_label_2">
+            <property name="justify">center</property>
+            <property name="label" translatable="yes">I know you're thinking "I don't have time for this", but consider that I've poured countless volunteer hours into making Dash to Panel a quality extension that is useful to YOU! :)</property>
+            <property name="margin-bottom">60</property>
+            <property name="use-markup">True</property>
+            <property name="wrap">True</property>
+          </object>
+        </child>
+        <child>
+          <object class="GtkBox">
+            <property name="halign">center</property>
+            <property name="margin-bottom">60</property>
+            <property name="spacing">40</property>
+            <property name="valign">center</property>
+            <child>
+              <object class="GtkLinkButton">
+                <property name="child">
+                  <object class="GtkBox">
+                    <property name="halign">center</property>
+                    <property name="spacing">6</property>
+                    <property name="valign">center</property>
+                    <child>
+                      <object class="GtkImage" id="paypal_logo">
+                        <property name="margin-bottom">2</property>
+                        <property name="margin-top">2</property>
+                        <property name="pixel-size">32</property>
+                      </object>
+                    </child>
+                    <child>
+                      <object class="GtkLabel">
+                        <property name="label">Paypal</property>
+                        <property name="margin-end">6</property>
+                      </object>
+                    </child>
+                  </object>
+                </property>
+                <property name="css-classes">button</property>
+                <property name="uri">https://www.paypal.com/donate/?hosted_button_id=5DCVELP7BSAVQ</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkLinkButton">
+                <property name="child">
+                  <object class="GtkBox">
+                    <property name="halign">center</property>
+                    <property name="spacing">6</property>
+                    <property name="valign">center</property>
+                    <child>
+                      <object class="GtkImage" id="stripe_logo">
+                        <property name="margin-bottom">2</property>
+                        <property name="margin-top">2</property>
+                        <property name="pixel-size">32</property>
+                      </object>
+                    </child>
+                    <child>
+                      <object class="GtkLabel">
+                        <property name="label">Stripe</property>
+                        <property name="margin-end">6</property>
+                      </object>
+                    </child>
+                  </object>
+                </property>
+                <property name="css-classes">button</property>
+                <property name="uri">https://donate.stripe.com/9AQg1g8sA5EY1y07ss</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkLinkButton">
+                <property name="child">
+                  <object class="GtkBox">
+                    <property name="halign">center</property>
+                    <property name="spacing">6</property>
+                    <property name="valign">center</property>
+                    <child>
+                      <object class="GtkImage" id="kofi_logo">
+                        <property name="margin-bottom">2</property>
+                        <property name="margin-top">2</property>
+                        <property name="pixel-size">32</property>
+                      </object>
+                    </child>
+                    <child>
+                      <object class="GtkLabel">
+                        <property name="label">Ko-fi</property>
+                        <property name="margin-end">6</property>
+                      </object>
+                    </child>
+                  </object>
+                </property>
+                <property name="css-classes">button</property>
+                <property name="uri">https://ko-fi.com/charlesgagnon</property>
+              </object>
+            </child>
+          </object>
+        </child>
+        <child>
+          <object class="GtkRevealer" id="donation_revealer">
+            <property name="child">
+              <object class="GtkBox">
+                <property name="halign">center</property>
+                <property name="valign">start</property>
+                <child>
+                  <object class="GtkLabel">
+                    <property name="halign">start</property>
+                    <property name="label" translatable="yes">&lt;span size="9000"&gt;Thanks for your time!
+If you like, you can now hide the donate icon&lt;/span&gt;</property>
+                    <property name="margin-end">10</property>
+                    <property name="use-markup">True</property>
+                    <property name="valign">center</property>
+                  </object>
+                </child>
+                <child>
+                  <object class="GtkSwitch" id="donation_icon_switch">
+                    <property name="halign">end</property>
+                    <property name="valign">center</property>
+                  </object>
+                </child>
+              </object>
+            </property>
+            <property name="margin-bottom">20</property>
+            <property name="transition-type">crossfade</property>
+          </object>
+        </child>
+      </object>
+    </child>
+  </object>
+</interface>