diff --git a/Settings.ui b/Settings.ui index 5401bfa..b71afc2 100644 --- a/Settings.ui +++ b/Settings.ui @@ -8,6 +8,12 @@ 0.01 0.10000000000000001 + + 0.33000000000000002 + 1 + 0.01 + 0.10000000000000001 + True False @@ -2898,7 +2904,7 @@ - + 100 True True @@ -2947,6 +2953,55 @@ + + + 100 + True + True + + + True + False + 12 + 12 + 12 + 12 + 32 + + + True + False + App Icon Padding +(default is 4) + 0 + + + 0 + 0 + + + + + True + True + baseline + True + appicon_padding_adjustment + 0 + 0 + right + + + + + 1 + 0 + + + + + + diff --git a/appIcons.js b/appIcons.js index 720ba8a..7345158 100644 --- a/appIcons.js +++ b/appIcons.js @@ -130,8 +130,12 @@ var taskbarAppIcon = new Lang.Class({ this._focused = tracker.focus_app == this.app; this._isGroupApps = this._dtpSettings.get_boolean('group-apps'); + this._container = new St.Widget({ layout_manager: new Clutter.BinLayout() }); + this._dotsContainer = new St.Widget({ layout_manager: new Clutter.BinLayout() }); + + this.actor.remove_actor(this._iconContainer); + if (appInfo.window) { - let outbox = new St.Widget({ layout_manager: new Clutter.BinLayout() }); let box = new St.BoxLayout(); this._windowTitle = new St.Label({ @@ -145,13 +149,16 @@ var taskbarAppIcon = new Lang.Class({ this._scaleFactorChangedId = St.ThemeContext.get_for_stage(global.stage).connect('changed', () => this._updateWindowTitleStyle()); - this.actor.remove_actor(this._iconContainer); box.add_child(this._iconContainer); box.add_child(this._windowTitle); - outbox.add_child(box); - this.actor.set_child(outbox); - } + this._dotsContainer.add_child(box); + } else { + this._dotsContainer.add_child(this._iconContainer); + } + + this._container.add_child(this._dotsContainer); + this.actor.set_child(this._container); // Monitor windows-changes instead of app state. // Keep using the same Id and function callback (that is extended) @@ -183,32 +190,31 @@ var taskbarAppIcon = new Lang.Class({ this._switchWorkspaceId = global.window_manager.connect('switch-workspace', Lang.bind(this, this._onSwitchWorkspace)); + this._setAppIconPadding(); this._showDots(); - this._settingsConnectIds = [ - this._dtpSettings.connect('changed::dot-position', Lang.bind(this, this._settingsChangeRefresh)), - this._dtpSettings.connect('changed::dot-size', Lang.bind(this, this._updateDotSize)), - this._dtpSettings.connect('changed::dot-style-focused', Lang.bind(this, this._settingsChangeRefresh)), - this._dtpSettings.connect('changed::dot-style-unfocused', Lang.bind(this, this._settingsChangeRefresh)), - this._dtpSettings.connect('changed::dot-color-override', Lang.bind(this, this._settingsChangeRefresh)), - this._dtpSettings.connect('changed::dot-color-1', Lang.bind(this, this._settingsChangeRefresh)), - this._dtpSettings.connect('changed::dot-color-2', Lang.bind(this, this._settingsChangeRefresh)), - this._dtpSettings.connect('changed::dot-color-3', Lang.bind(this, this._settingsChangeRefresh)), - this._dtpSettings.connect('changed::dot-color-4', Lang.bind(this, this._settingsChangeRefresh)), - this._dtpSettings.connect('changed::dot-color-unfocused-different', Lang.bind(this, this._settingsChangeRefresh)), - this._dtpSettings.connect('changed::dot-color-unfocused-1', Lang.bind(this, this._settingsChangeRefresh)), - this._dtpSettings.connect('changed::dot-color-unfocused-2', Lang.bind(this, this._settingsChangeRefresh)), - this._dtpSettings.connect('changed::dot-color-unfocused-3', Lang.bind(this, this._settingsChangeRefresh)), - this._dtpSettings.connect('changed::dot-color-unfocused-4', Lang.bind(this, this._settingsChangeRefresh)), - this._dtpSettings.connect('changed::focus-highlight', Lang.bind(this, this._settingsChangeRefresh)), - this._dtpSettings.connect('changed::focus-highlight-color', Lang.bind(this, this._settingsChangeRefresh)), - this._dtpSettings.connect('changed::focus-highlight-opacity', Lang.bind(this, this._settingsChangeRefresh)), - this._dtpSettings.connect('changed::group-apps-label-font-size', Lang.bind(this, this._updateWindowTitleStyle)), - this._dtpSettings.connect('changed::group-apps-label-font-color', Lang.bind(this, this._updateWindowTitleStyle)), - this._dtpSettings.connect('changed::group-apps-label-max-width', Lang.bind(this, this._updateWindowTitleStyle)), - this._dtpSettings.connect('changed::group-apps-use-fixed-width', Lang.bind(this, this._updateWindowTitleStyle)), - this._dtpSettings.connect('changed::group-apps-underline-unfocused', Lang.bind(this, this._settingsChangeRefresh)) - ]; + this._dtpSettings.connect('changed::dot-position', Lang.bind(this, this._settingsChangeRefresh)); + this._dtpSettings.connect('changed::dot-size', Lang.bind(this, this._updateDotSize)); + this._dtpSettings.connect('changed::dot-style-focused', Lang.bind(this, this._settingsChangeRefresh)); + this._dtpSettings.connect('changed::dot-style-unfocused', Lang.bind(this, this._settingsChangeRefresh)); + this._dtpSettings.connect('changed::dot-color-override', Lang.bind(this, this._settingsChangeRefresh)); + this._dtpSettings.connect('changed::dot-color-1', Lang.bind(this, this._settingsChangeRefresh)); + this._dtpSettings.connect('changed::dot-color-2', Lang.bind(this, this._settingsChangeRefresh)); + this._dtpSettings.connect('changed::dot-color-3', Lang.bind(this, this._settingsChangeRefresh)); + this._dtpSettings.connect('changed::dot-color-4', Lang.bind(this, this._settingsChangeRefresh)); + this._dtpSettings.connect('changed::dot-color-unfocused-different', Lang.bind(this, this._settingsChangeRefresh)); + this._dtpSettings.connect('changed::dot-color-unfocused-1', Lang.bind(this, this._settingsChangeRefresh)); + this._dtpSettings.connect('changed::dot-color-unfocused-2', Lang.bind(this, this._settingsChangeRefresh)); + this._dtpSettings.connect('changed::dot-color-unfocused-3', Lang.bind(this, this._settingsChangeRefresh)); + this._dtpSettings.connect('changed::dot-color-unfocused-4', Lang.bind(this, this._settingsChangeRefresh)); + this._dtpSettings.connect('changed::focus-highlight', Lang.bind(this, this._settingsChangeRefresh)); + this._dtpSettings.connect('changed::focus-highlight-color', Lang.bind(this, this._settingsChangeRefresh)); + this._dtpSettings.connect('changed::focus-highlight-opacity', Lang.bind(this, this._settingsChangeRefresh)); + this._dtpSettings.connect('changed::group-apps-label-font-size', Lang.bind(this, this._updateWindowTitleStyle)); + this._dtpSettings.connect('changed::group-apps-label-font-color', Lang.bind(this, this._updateWindowTitleStyle)); + this._dtpSettings.connect('changed::group-apps-label-max-width', Lang.bind(this, this._updateWindowTitleStyle)); + this._dtpSettings.connect('changed::group-apps-use-fixed-width', Lang.bind(this, this._updateWindowTitleStyle)); + this._dtpSettings.connect('changed::group-apps-underline-unfocused', Lang.bind(this, this._settingsChangeRefresh)); this.forcedOverview = false; @@ -333,12 +339,6 @@ var taskbarAppIcon = new Lang.Class({ if(this._scaleFactorChangedId) St.ThemeContext.get_for_stage(global.stage).disconnect(this._scaleFactorChangedId); - - for (let i = 0, l = this._settingsConnectIds.length; i < l; ++i) { - if (this._settingsConnectIds[i]) { - this._dtpSettings.disconnect(this._settingsConnectIds[i]); - } - } }, onWindowsChanged: function() { @@ -374,8 +374,6 @@ var taskbarAppIcon = new Lang.Class({ return; } - let container = this.actor.get_children()[0]; - if (!this._isGroupApps) { this._focusedDots = new St.Widget({ layout_manager: new Clutter.BinLayout(), @@ -414,12 +412,12 @@ var taskbarAppIcon = new Lang.Class({ this._displayProperIndicator(); })); - container.add_child(this._unfocusedDots); + this._dotsContainer.add_child(this._unfocusedDots); this._updateCounterClass(); } - container.add_child(this._focusedDots); + this._dotsContainer.add_child(this._focusedDots); }, _updateDotSize: function() { @@ -467,8 +465,7 @@ var taskbarAppIcon = new Lang.Class({ }, _setIconStyle: function(isFocused) { - let margin = this._dtpSettings.get_int('appicon-margin'); - let inlineStyle = 'margin: 0 ' + margin + 'px;'; + let inlineStyle = ''; if(this._dtpSettings.get_boolean('focus-highlight') && tracker.focus_app == this.app && !this.isLauncher && @@ -497,17 +494,31 @@ var taskbarAppIcon = new Lang.Class({ this._dtpSettings.get_int('focus-highlight-opacity') * 0.01); } - if(this.actor.get_style() != inlineStyle) { + if(this._dotsContainer.get_style() != inlineStyle) { if (!this._isGroupApps) { //when the apps are ungrouped, set the style synchronously so the icons don't jump around on taskbar redraw - this.actor.set_style(inlineStyle); + this._dotsContainer.set_style(inlineStyle); } else { //graphical glitches if i dont set this on a timeout - Mainloop.timeout_add(0, Lang.bind(this, function() { this.actor.set_style(inlineStyle); })); + Mainloop.timeout_add(0, Lang.bind(this, function() { this._dotsContainer.set_style(inlineStyle); })); } } }, + _setAppIconPadding: function() { + let scaleFactor = St.ThemeContext.get_for_stage(global.stage).scale_factor; + let availSize = Main.panel.actor.get_height() - this._dtpSettings.get_int('dot-size') * scaleFactor * 2; + let padding = this._dtpSettings.get_int('appicon-padding'); + let margin = this._dtpSettings.get_int('appicon-margin'); + + if (padding * 2 > availSize) { + padding = (availSize - 1) * .5; + } + + this.actor.set_style('padding: 0 ' + margin + 'px;'); + this._iconContainer.set_style('padding: ' + padding + 'px;'); + }, + popupMenu: function() { this._removeMenuTimeout(); this.actor.fake_release(); @@ -578,7 +589,7 @@ var taskbarAppIcon = new Lang.Class({ this._focusedDots.hide(); } } else { - let containerWidth = this.actor.get_children()[0].width; + let containerWidth = this._container.width; let focusedDotStyle = this._dtpSettings.get_string('dot-style-focused'); let unfocusedDotStyle = this._dtpSettings.get_string('dot-style-unfocused'); let focusedIsWide = this._isWideDotStyle(focusedDotStyle); diff --git a/panel.js b/panel.js index a3d0906..b6d1fe4 100644 --- a/panel.js +++ b/panel.js @@ -339,6 +339,10 @@ var dtpPanel = new Lang.Class({ this.taskbar.resetAppIcons(); })); + this._dtpSettings.connect('changed::appicon-padding', Lang.bind(this, function() { + this.taskbar.resetAppIcons(); + })); + this._dtpSettings.connect('changed::show-activities-button', Lang.bind(this, function() { this._setActivitiesButtonVisible(this._dtpSettings.get_boolean('show-activities-button')); })); diff --git a/prefs.js b/prefs.js index 050f92e..6604124 100644 --- a/prefs.js +++ b/prefs.js @@ -166,6 +166,7 @@ const Settings = new Lang.Class({ this._tray_size_timeout = 0; this._leftbox_size_timeout = 0; this._appicon_margin_timeout = 0; + this._appicon_padding_timeout = 0; this._tray_padding_timeout = 0; this._statusicon_padding_timeout = 0; this._leftbox_padding_timeout = 0; @@ -1097,6 +1098,7 @@ const Settings = new Lang.Class({ {objectName: 'tray_size_scale', valueName: 'tray-size', range: DEFAULT_FONT_SIZES }, {objectName: 'leftbox_size_scale', valueName: 'leftbox-size', range: DEFAULT_FONT_SIZES }, {objectName: 'appicon_margin_scale', valueName: 'appicon-margin', range: DEFAULT_MARGIN_SIZES }, + {objectName: 'appicon_padding_scale', valueName: 'appicon-padding', range: DEFAULT_MARGIN_SIZES }, {objectName: 'tray_padding_scale', valueName: 'tray-padding', range: DEFAULT_PADDING_SIZES }, {objectName: 'leftbox_padding_scale', valueName: 'leftbox-padding', range: DEFAULT_PADDING_SIZES }, {objectName: 'statusicon_padding_scale', valueName: 'status-icon-padding', range: DEFAULT_PADDING_SIZES } @@ -1227,6 +1229,22 @@ const Settings = new Lang.Class({ })); }, + appicon_padding_scale_format_value_cb: function(scale, value) { + return value + ' px'; + }, + + appicon_padding_scale_value_changed_cb: function(scale) { + // Avoid settings the size consinuosly + if (this._appicon_padding_timeout > 0) + Mainloop.source_remove(this._appicon_padding_timeout); + + this._appicon_padding_timeout = Mainloop.timeout_add(SCALE_UPDATE_TIMEOUT, Lang.bind(this, function() { + this._settings.set_int('appicon-padding', scale.get_value()); + this._appicon_padding_timeout = 0; + return GLib.SOURCE_REMOVE; + })); + }, + tray_padding_scale_format_value_cb: function(scale, value) { return value+ ' px'; }, 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 ded9478..a9c2045 100644 --- a/schemas/org.gnome.shell.extensions.dash-to-panel.gschema.xml +++ b/schemas/org.gnome.shell.extensions.dash-to-panel.gschema.xml @@ -385,7 +385,12 @@ App icon margin Set the margin for application icons in the embedded dash. - + + 4 + App icon padding + Set the padding for application icons in the embedded dash. + + -1 Tray item padding Set the size of the tray padding. (-1 for default) diff --git a/stylesheet.css b/stylesheet.css index 762ec06..fe3db8d 100644 --- a/stylesheet.css +++ b/stylesheet.css @@ -21,14 +21,8 @@ * Some code was also adapted from the upstream Gnome Shell source code. */ -#dashtopanelScrollview .dash-item-container > StWidget { - padding: 0; - margin: 0 8px; -} - #dashtopanelScrollview .app-well-app .overview-icon { border-radius: 0; - padding: 8px; border: none; } diff --git a/taskbar.js b/taskbar.js index 89f6c70..a076595 100644 --- a/taskbar.js +++ b/taskbar.js @@ -172,8 +172,6 @@ var taskbarActor = new Lang.Class({ * - Sync minimization application target position. */ -const baseIconSizes = [ 16, 22, 24, 32, 48, 64, 96, 128 ]; - var taskbar = new Lang.Class({ Name: 'DashToPanel.Taskbar', @@ -181,9 +179,8 @@ var taskbar = new Lang.Class({ this._dtpSettings = settings; // start at smallest size due to running indicator drawing area expanding but not shrinking - this.iconSize = baseIconSizes[0]; + this.iconSize = 16; - this._availableIconSizes = baseIconSizes; this._shownInitially = false; this._position = getPosition(); @@ -686,29 +683,25 @@ var taskbar = new Lang.Class({ iconChildren.push(this._showAppsIcon); let scaleFactor = St.ThemeContext.get_for_stage(global.stage).scale_factor; - let iconSizes = this._availableIconSizes.map(function(s) { - return s * scaleFactor; - }); // Getting the panel height and making sure that the icon padding is at // least the size of the app running indicator on both the top and bottom. - let availSize = Main.panel.actor.get_height() - (this._dtpSettings.get_int('dot-size') * scaleFactor * 2); - - let newIconSize = this._availableIconSizes[0]; - for (let i = 0; i < iconSizes.length ; i++) { - if (iconSizes[i] < availSize) { - newIconSize = this._availableIconSizes[i]; - } + let availSize = Main.panel.actor.get_height() - + (this._dtpSettings.get_int('dot-size') * scaleFactor * 2) - + (this._dtpSettings.get_int('appicon-padding') * 2); + + if (availSize == this.iconSize) + return; + + if (availSize <= 0) { + availSize = 1; } - if (newIconSize == this.iconSize) - return; - let oldIconSize = this.iconSize; - this.iconSize = newIconSize; + this.iconSize = availSize; this.emit('icon-size-changed'); - let scale = oldIconSize / newIconSize; + let scale = oldIconSize / this.iconSize; for (let i = 0; i < iconChildren.length; i++) { let icon = iconChildren[i].child._delegate.icon;