From d4f1d89724821eba5810233fe46a2b862924af0c Mon Sep 17 00:00:00 2001 From: Charles Gagnon Date: Thu, 13 Feb 2025 18:35:58 -0500 Subject: [PATCH] Add global border radius slider gh-1819 --- ...shell.extensions.dash-to-panel.gschema.xml | 4 + src/appIcons.js | 5 +- src/extension.js | 38 +++- src/panel.js | 5 +- src/panelManager.js | 7 +- src/prefs.js | 39 +++- src/stylesheet.css | 78 +++++++- src/transparency.js | 14 +- ui/BoxHighlightAppIconHoverOptions.ui | 2 +- ui/SettingsStyle.ui | 184 +++++++++--------- 10 files changed, 252 insertions(+), 124 deletions(-) diff --git a/schemas/org.gnome.shell.extensions.dash-to-panel.gschema.xml b/schemas/org.gnome.shell.extensions.dash-to-panel.gschema.xml index ddd00dc..f6e8879 100644 --- a/schemas/org.gnome.shell.extensions.dash-to-panel.gschema.xml +++ b/schemas/org.gnome.shell.extensions.dash-to-panel.gschema.xml @@ -727,6 +727,10 @@ Leftbox font size Set the size of the leftBox font. (0 for default) + + 0 + Border radius of panel elements + 8 App icon margin diff --git a/src/appIcons.js b/src/appIcons.js index 0fefd63..340b6cd 100644 --- a/src/appIcons.js +++ b/src/appIcons.js @@ -541,7 +541,7 @@ export const TaskbarAppIcon = GObject.registerClass( ) // Some trickery needed to get the effect - const br = `border-radius: ${border_radius}px;` + const br = border_radius ? `border-radius: ${border_radius}px;` : '' this._appicon_normalstyle = br this._container.set_style(this._appicon_normalstyle) this._appicon_hoverstyle = `background-color: ${background_color}; ${br}` @@ -1718,7 +1718,8 @@ export const TaskbarAppIcon = GObject.registerClass( this.window ? Main.activateWindow(this.window) : activateFirstWindow(this.app, this.monitor) - } else this.dtpPanel.panelManager.showFocusedAppInOverview(this.app, true) + } else + this.dtpPanel.panelManager.showFocusedAppInOverview(this.app, true) return DND.DragMotionResult.MOVE_DROP } diff --git a/src/extension.js b/src/extension.js index 3a81f67..698e9a9 100644 --- a/src/extension.js +++ b/src/extension.js @@ -73,14 +73,8 @@ export default class DashToPanelExtension extends Extension { // To remove later, try to map settings using monitor indexes to monitor ids PanelSettings.adjustMonitorSettings(SETTINGS) - let completeEnable = () => { - panelManager = new PanelManager.PanelManager() - panelManager.enable() - ubuntuDockDelayId = 0 - } - let donateIconUnixtime = SETTINGS.get_string('hide-donate-icon-unixtime') - // 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', '') @@ -99,6 +93,14 @@ export default class DashToPanelExtension extends Extension { ) } + this.enableGlobalStyles() + + let completeEnable = () => { + panelManager = new PanelManager.PanelManager() + panelManager.enable() + ubuntuDockDelayId = 0 + } + // disable ubuntu dock if present if (Main.extensionManager._extensionOrder.indexOf(UBUNTU_DOCK_UUID) >= 0) { let disabled = global.settings.get_strv('disabled-extensions') @@ -127,6 +129,8 @@ export default class DashToPanelExtension extends Extension { delete global.dashToPanel + this.disableGlobalStyles() + AppIcons.resetRecentlyClickedApp() if (startupCompleteHandler) { @@ -152,4 +156,24 @@ export default class DashToPanelExtension extends Extension { super.openPreferences() } + + resetGlobalStyles() { + this.disableGlobalStyles() + this.enableGlobalStyles() + } + + enableGlobalStyles() { + let globalBorderRadius = SETTINGS.get_int('global-border-radius') + + if (globalBorderRadius) + Main.layoutManager.uiGroup.add_style_class_name( + `br${globalBorderRadius * 4}`, + ) + } + + disableGlobalStyles() { + ;['br4', 'br8', 'br12', 'br16', 'br20'].forEach((c) => + Main.layoutManager.uiGroup.remove_style_class_name(c), + ) + } } diff --git a/src/panel.js b/src/panel.js index cf47536..8de680e 100644 --- a/src/panel.js +++ b/src/panel.js @@ -71,7 +71,10 @@ export const Panel = GObject.registerClass( {}, class Panel extends St.Widget { _init(panelManager, monitor, panelBox, isStandalone) { - super._init({ layout_manager: new Clutter.BinLayout() }) + super._init({ + name: 'dashtopanelPanel', + layout_manager: new Clutter.BinLayout(), + }) this._timeoutsHandler = new Utils.TimeoutsHandler() this._signalsHandler = new Utils.GlobalSignalsHandler() diff --git a/src/panelManager.js b/src/panelManager.js index 49703fd..117b472 100755 --- a/src/panelManager.js +++ b/src/panelManager.js @@ -49,7 +49,7 @@ import { NotificationsMonitor } from './notificationsMonitor.js' import { Workspace } from 'resource:///org/gnome/shell/ui/workspace.js' import * as Layout from 'resource:///org/gnome/shell/ui/layout.js' import { InjectionManager } from 'resource:///org/gnome/shell/extensions/extension.js' -import { SETTINGS } from './extension.js' +import { DTP_EXTENSION, SETTINGS } from './extension.js' import { SecondaryMonitorDisplay, WorkspacesView, @@ -204,6 +204,11 @@ export const PanelManager = class { //listen settings this._signalsHandler.add( + [ + SETTINGS, + 'changed::global-border-radius', + () => DTP_EXTENSION.resetGlobalStyles(), + ], [ SETTINGS, [ diff --git a/src/prefs.js b/src/prefs.js index 36a2c5e..1257b71 100644 --- a/src/prefs.js +++ b/src/prefs.js @@ -235,6 +235,7 @@ const Preferences = class { this._dot_height_timeout = 0 this._tray_size_timeout = 0 this._leftbox_size_timeout = 0 + this._globalBorderRadius_margin_timeout = 0 this._appicon_margin_timeout = 0 this._appicon_margin_todesktop_timeout = 0 this._appicon_margin_toscreenborder_timeout = 0 @@ -800,6 +801,12 @@ const Preferences = class { }) // style + this._builder + .get_object('global_border_radius_scale') + .set_format_value_func((scale, value) => { + return value * 4 + ' px' + }) + this._builder .get_object('appicon_margin_scale') .set_format_value_func((scale, value) => { @@ -3051,6 +3058,12 @@ const Preferences = class { valueName: 'leftbox-size', range: DEFAULT_FONT_SIZES, }, + { + objectName: 'global_border_radius_scale', + valueName: 'global-border-radius', + range: [5, 4, 3, 2, 1, 0], + rangeFactor: 4, + }, { objectName: 'appicon_margin_scale', valueName: 'appicon-margin', @@ -3097,6 +3110,7 @@ const Preferences = class { for (const idx in sizeScales) { let size_scale = this._builder.get_object(sizeScales[idx].objectName) let range = sizeScales[idx].range + let factor = sizeScales[idx].rangeFactor size_scale.set_range(range[range.length - 1], range[0]) let value if (sizeScales[idx].objectName === 'panel_length_scale') { @@ -3110,7 +3124,11 @@ const Preferences = class { size_scale.set_value(value) // Add marks from range arrays, omitting the first and last values. range.slice(1, -1).forEach(function (val) { - size_scale.add_mark(val, Gtk.PositionType.TOP, val.toString()) + size_scale.add_mark( + val, + Gtk.PositionType.TOP, + (val * (factor || 1)).toString(), + ) }) // Corrent for rtl languages @@ -3741,6 +3759,25 @@ const BuilderScope = GObject.registerClass( ) } + global_border_radius_scale_value_changed_cb(scale) { + // Avoid settings the size consinuosly + if (this._preferences._globalBorderRadius_margin_timeout > 0) + GLib.Source.remove(this._preferences._globalBorderRadius_margin_timeout) + + this._preferences._globalBorderRadius_margin_timeout = GLib.timeout_add( + GLib.PRIORITY_DEFAULT, + SCALE_UPDATE_TIMEOUT, + () => { + this._preferences._settings.set_int( + 'global-border-radius', + scale.get_value(), + ) + this._preferences._globalBorderRadius_margin_timeout = 0 + return GLib.SOURCE_REMOVE + }, + ) + } + appicon_margin_scale_value_changed_cb(scale) { // Avoid settings the size consinuosly if (this._preferences._appicon_margin_timeout > 0) diff --git a/src/stylesheet.css b/src/stylesheet.css index 4f6efe2..913bc3d 100644 --- a/src/stylesheet.css +++ b/src/stylesheet.css @@ -66,7 +66,6 @@ background: none; } - #dashtopanelScrollview .overview-tile:active .dtp-container { background-color: rgba(238, 238, 236, 0.18); } @@ -168,3 +167,80 @@ .symbolic-icon-style { -st-icon-style: symbolic; } + + +/* border radius, grrr no css variables in ST */ +#uiGroup.br4 #dashtopanelPanel, +#uiGroup.br4 .show-apps, +#uiGroup.br4 .dtp-container, +#uiGroup.br4 .dtp-dots-container, +#uiGroup.br4 #preview-menu, +#uiGroup.br4 #preview-menu .preview-header-box, +#uiGroup.br4 #preview-menu .preview-container, +#uiGroup.br4 #preview-menu .preview-close-btn-container { + border-radius: 4px !important; + overflow: hidden !important; +} +#uiGroup.br4 .showdesktop-button { + border-radius: 0 4px 4px 0 !important; +} + +#uiGroup.br8 #dashtopanelPanel, +#uiGroup.br8 .show-apps, +#uiGroup.br8 .dtp-container, +#uiGroup.br8 .dtp-dots-container, +#uiGroup.br8 #preview-menu, +#uiGroup.br8 #preview-menu .preview-header-box, +#uiGroup.br8 #preview-menu .preview-container, +#uiGroup.br8 #preview-menu .preview-close-btn-container { + border-radius: 8px !important; + overflow: hidden !important; +} +#uiGroup.br8 .showdesktop-button { + border-radius: 0 8px 8px 0 !important; +} + +#uiGroup.br12 #dashtopanelPanel, +#uiGroup.br12 .show-apps, +#uiGroup.br12 .dtp-container, +#uiGroup.br12 .dtp-dots-container, +#uiGroup.br12 #preview-menu, +#uiGroup.br12 #preview-menu .preview-header-box, +#uiGroup.br12 #preview-menu .preview-container, +#uiGroup.br12 #preview-menu .preview-close-btn-container { + border-radius: 12px !important; + overflow: hidden !important; +} +#uiGroup.br12 .showdesktop-button { + border-radius: 0 12px 12px 0 !important; +} + +#uiGroup.br16 #dashtopanelPanel, +#uiGroup.br16 .show-apps, +#uiGroup.br16 .dtp-container, +#uiGroup.br16 .dtp-dots-container, +#uiGroup.br16 #preview-menu, +#uiGroup.br16 #preview-menu .preview-header-box, +#uiGroup.br16 #preview-menu .preview-container, +#uiGroup.br16 #preview-menu .preview-close-btn-container { + border-radius: 16px !important; + overflow: hidden !important; +} +#uiGroup.br16 .showdesktop-button { + border-radius: 0 16px 16px 0 !important; +} + +#uiGroup.br20 #dashtopanelPanel, +#uiGroup.br20 .show-apps, +#uiGroup.br20 .dtp-container, +#uiGroup.br20 .dtp-dots-container, +#uiGroup.br20 #preview-menu, +#uiGroup.br20 #preview-menu .preview-header-box, +#uiGroup.br20 #preview-menu .preview-container, +#uiGroup.br20 #preview-menu .preview-close-btn-container { + border-radius: 20px !important; + overflow: hidden !important; +} +#uiGroup.br20 .showdesktop-button { + border-radius: 0 20px 20px 0 !important; +} diff --git a/src/transparency.js b/src/transparency.js index 17b1059..3283907 100644 --- a/src/transparency.js +++ b/src/transparency.js @@ -48,7 +48,6 @@ export const DynamicTransparency = class { } updateExternalStyle() { - this._updateComplementaryStyles() this._setBackground() } @@ -134,7 +133,6 @@ export const DynamicTransparency = class { this._updateColor(themeBackground) this._updateAlpha(themeBackground) - this._updateComplementaryStyles() this._updateGradient() this._setBackground() this._setGradient() @@ -155,13 +153,6 @@ export const DynamicTransparency = class { this._setGradient() } - _updateComplementaryStyles() { - let panelThemeNode = this._dtpPanel.panel.get_theme_node() - - this._complementaryStyles = - 'border-radius: ' + panelThemeNode.get_border_radius(0) + 'px;' - } - _updateColor(themeBackground) { this.backgroundColorRgb = SETTINGS.get_boolean('trans-use-custom-bg') ? SETTINGS.get_string('trans-bg-color') @@ -211,10 +202,7 @@ export const DynamicTransparency = class { let transition = 'transition-duration:' + this.animationDuration this._dtpPanel.set_style( - 'background-color: ' + - this.currentBackgroundColor + - transition + - this._complementaryStyles, + 'background-color: ' + this.currentBackgroundColor + transition, ) } diff --git a/ui/BoxHighlightAppIconHoverOptions.ui b/ui/BoxHighlightAppIconHoverOptions.ui index 5b99fcf..aa9f493 100644 --- a/ui/BoxHighlightAppIconHoverOptions.ui +++ b/ui/BoxHighlightAppIconHoverOptions.ui @@ -48,7 +48,7 @@ Highlight AppIcon border radius - (default is 0) + Overrides global border radius (default is 0) 300 diff --git a/ui/SettingsStyle.ui b/ui/SettingsStyle.ui index d31ef7f..aabe0a3 100644 --- a/ui/SettingsStyle.ui +++ b/ui/SettingsStyle.ui @@ -1,144 +1,152 @@ - + + - + 0.33 + 0.1 + 0.01 1 - 0.01 - 0.1 - 0.33 + 0.1 + 0.01 1 - 0.01 - 0.1 - 0.33 + 0.1 + 0.01 1 - 0.01 - 0.1 - 0.33 + 0.1 + 0.01 1 - 0.01 - 0.1 - + 10 + 5 100 - 5 - 10 - + 10 + 5 100 - 5 - 10 - + 10 + 5 100 - 5 - 10 - + applications-graphics-symbolic Style - applications-graphics-symbolic - - + + + Global style + + + Border radius + + + global_border_radius_adjustment + 0 + True + 0 + right + 300 + + + + + + + AppIcon style - - App Icon Margin (default is 8) + App Icon Margin - 300 appicon_margin_adjustment - 0 0 - right - True + True + 0 + right + 300 - - App Icon Margin Towards Desktop (default is 0) + App Icon Margin Towards Desktop - 300 appicon_margin_todesktop_adjustment - 0 0 - right - True - + True + 0 + right + 300 + - - App Icon Margin Towards Screen Border (default is 0) + App Icon Margin Towards Screen Border - 300 appicon_margin_toscreenborder_adjustment - 0 0 - right - True - + True + 0 + right + 300 + - - App Icon Padding (default is 4) + App Icon Padding - 300 appicon_padding_adjustment - 0 0 - right - True + True + 0 + right + 300 - Animate hovering app icons - True + True center - emblem-system-symbolic + emblem-system-symbolic