From 80d6986cd9a840620a7287e28095db937a48f25a Mon Sep 17 00:00:00 2001 From: Charles Gagnon Date: Fri, 13 Sep 2019 11:33:59 -0400 Subject: [PATCH] Adjust stacked bg for left/right indicators --- Makefile | 2 +- appIcons.js | 50 ++++++++++++++++++++++++++++-------------------- panel.js | 11 ++++++----- windowPreview.js | 2 +- 4 files changed, 37 insertions(+), 28 deletions(-) diff --git a/Makefile b/Makefile index 02aca8f..2566d9f 100644 --- a/Makefile +++ b/Makefile @@ -3,7 +3,7 @@ UUID = dash-to-panel@jderose9.github.com BASE_MODULES = extension.js stylesheet.css metadata.json COPYING README.md EXTRA_MODULES = appIcons.js convenience.js panel.js panelManager.js proximity.js intellihide.js panelStyle.js overview.js taskbar.js transparency.js windowPreview.js prefs.js utils.js Settings.ui -EXTRA_IMAGES = highlight_stacked_bg.svg +EXTRA_IMAGES = highlight_stacked_bg.svg highlight_stacked_bg_left.svg highlight_stacked_bg_right.svg TOLOCALIZE = prefs.js appIcons.js MSGSRC = $(wildcard po/*.po) ifeq ($(strip $(DESTDIR)),) diff --git a/appIcons.js b/appIcons.js index 6e11b5d..1ff3e0f 100644 --- a/appIcons.js +++ b/appIcons.js @@ -53,6 +53,7 @@ const _ = imports.gettext.domain(Utils.TRANSLATION_DOMAIN).gettext; let LABEL_GAP = 5; let MAX_INDICATORS = 4; +const DEFAULT_PADDING_SIZE = 4; let DOT_STYLE = { DOTS: "DOTS", @@ -132,15 +133,9 @@ var taskbarAppIcon = Utils.defineClass({ this._dot.set_width(0); this._isGroupApps = Me.settings.get_boolean('group-apps'); - let dtpIconContainerOpts = { layout_manager: new Clutter.BinLayout() }; - - if (!this._isGroupApps) { - dtpIconContainerOpts.style = getIconContainerStyle(); - } - this._container = new St.Widget({ style_class: 'dtp-container', layout_manager: new Clutter.BinLayout() }); this._dotsContainer = new St.Widget({ layout_manager: new Clutter.BinLayout() }); - this._dtpIconContainer = new St.Widget(dtpIconContainerOpts); + this._dtpIconContainer = new St.Widget({ layout_manager: new Clutter.BinLayout(), style: getIconContainerStyle() }); this.actor.remove_actor(this._iconContainer); @@ -482,7 +477,15 @@ var taskbarAppIcon = Utils.defineClass({ highlightMargin += 1; if (this._nWindows > 1 && focusedDotStyle == DOT_STYLE.METRO) { - inlineStyle += "background-image: url('" + Me.path + "/img/highlight_stacked_bg.svg');" + + let bgSvg = '/img/highlight_stacked_bg'; + + if (pos == DOT_POSITION.LEFT) { + bgSvg += '_left'; + } else if (pos == DOT_POSITION.RIGHT) { + bgSvg += '_right'; + } + + inlineStyle += "background-image: url('" + Me.path + bgSvg + ".svg');" + "background-position: 0 " + (pos == DOT_POSITION.TOP ? highlightMargin : 0) + "px;" + "background-size: " + backgroundSize; } @@ -626,16 +629,14 @@ var taskbarAppIcon = Utils.defineClass({ } }); - if (position == DOT_POSITION.BOTTOM) { - rotation = 180; - } else if (position == DOT_POSITION.LEFT) { + if (position == DOT_POSITION.LEFT) { rotation = 270; } else if (position == DOT_POSITION.RIGHT) { rotation = 90; } this._focusedDots.rotation_angle_z = this._unfocusedDots.rotation_angle_z = rotation; - + if(focusedIsWide) { newFocusedDotsWidth = (isFocused && this._nWindows > 0) ? containerWidth : 0; newFocusedDotsOpacity = 255; @@ -984,13 +985,14 @@ var taskbarAppIcon = Utils.defineClass({ let [width, height] = area.get_surface_size(); let cr = area.get_context(); let size = this._getRunningIndicatorSize(); + let yOffset = Me.settings.get_string('dot-position') == DOT_POSITION.BOTTOM ? (height - size) : 0; if(type == DOT_STYLE.DOTS) { // Draw the required numbers of dots let radius = size/2; let spacing = Math.ceil(width/18); // separation between the dots - cr.translate((width - (2*n)*radius - (n-1)*spacing)/2, 0); + cr.translate((width - (2*n)*radius - (n-1)*spacing)/2, yOffset); Clutter.cairo_set_source_color(cr, bodyColor); for (let i = 0; i < n; i++) { @@ -1001,7 +1003,7 @@ var taskbarAppIcon = Utils.defineClass({ } else if(type == DOT_STYLE.SQUARES) { let spacing = Math.ceil(width/18); // separation between the dots - cr.translate(Math.floor((width - n*size - (n-1)*spacing)/2), 0); + cr.translate(Math.floor((width - n*size - (n-1)*spacing)/2), yOffset); Clutter.cairo_set_source_color(cr, bodyColor); for (let i = 0; i < n; i++) { @@ -1013,7 +1015,7 @@ var taskbarAppIcon = Utils.defineClass({ let spacing = Math.ceil(width/18); // separation between the dots let dashLength = Math.floor(width/4) - spacing; - cr.translate(Math.floor((width - n*dashLength - (n-1)*spacing)/2), 0); + cr.translate(Math.floor((width - n*dashLength - (n-1)*spacing)/2), yOffset); Clutter.cairo_set_source_color(cr, bodyColor); for (let i = 0; i < n; i++) { @@ -1025,7 +1027,7 @@ var taskbarAppIcon = Utils.defineClass({ let spacing = Math.ceil(width/18); // separation between the dots let dashLength = Math.ceil((width - ((n-1)*spacing))/n); - cr.translate(0, 0); + cr.translate(0, yOffset); Clutter.cairo_set_source_color(cr, bodyColor); for (let i = 0; i < n; i++) { @@ -1037,7 +1039,7 @@ var taskbarAppIcon = Utils.defineClass({ let spacing = size; // separation between the dots let lineLength = width - (size*(n-1)) - (spacing*(n-1)); - cr.translate(0, 0); + cr.translate(0, yOffset); Clutter.cairo_set_source_color(cr, bodyColor); cr.newSubPath(); @@ -1049,7 +1051,7 @@ var taskbarAppIcon = Utils.defineClass({ cr.fill(); } else if (type == DOT_STYLE.METRO) { if(n <= 1) { - cr.translate(0, 0); + cr.translate(0, yOffset); Clutter.cairo_set_source_color(cr, bodyColor); cr.newSubPath(); cr.rectangle(0, 0, width, size); @@ -1060,7 +1062,7 @@ var taskbarAppIcon = Utils.defineClass({ let blackenedColor = bodyColor.shade(.3); let darkenedColor = bodyColor.shade(.7); - cr.translate(0, 0); + cr.translate(0, yOffset); Clutter.cairo_set_source_color(cr, bodyColor); cr.newSubPath(); @@ -1076,7 +1078,7 @@ var taskbarAppIcon = Utils.defineClass({ cr.fill(); } } else { // solid - cr.translate(0, 0); + cr.translate(0, yOffset); Clutter.cairo_set_source_color(cr, bodyColor); cr.newSubPath(); cr.rectangle(0, 0, width, size); @@ -1147,7 +1149,13 @@ var taskbarAppIcon = Utils.defineClass({ taskbarAppIcon.prototype.scaleAndFade = taskbarAppIcon.prototype.undoScaleAndFade = () => {}; function getIconContainerStyle() { - return 'padding: ' + (Panel.checkIfVertical() ? '4px' : '0 4px'); + let style = ';'; + + if (!Me.settings.get_boolean('group-apps')) { + style = 'padding: ' + (Panel.checkIfVertical() ? '' : '0 ') + DEFAULT_PADDING_SIZE + 'px;'; + } + + return style; } function minimizeWindow(app, param, monitor){ diff --git a/panel.js b/panel.js index 81746a1..fa68b0a 100644 --- a/panel.js +++ b/panel.js @@ -32,6 +32,7 @@ const Clutter = imports.gi.Clutter; const Config = imports.misc.config; const Gtk = imports.gi.Gtk; const Gi = imports._gi; +const AppIcons = Me.imports.appIcons; const Utils = Me.imports.utils; const Taskbar = Me.imports.taskbar; const PanelStyle = Me.imports.panelStyle; @@ -176,7 +177,7 @@ var dtpPanel = Utils.defineClass({ this.statusArea.aggregateMenu._volume.indicators._dtpIgnoreScroll = 1; } - this.geom = this._getGeometry(); + this.geom = this.getGeometry(); this.panelBg = new St.Widget({ layout_manager: new Clutter.BinLayout() }); this.panelBox.remove_actor(this); this.panelBg.add_child(this); @@ -552,7 +553,7 @@ var dtpPanel = Utils.defineClass({ _resetGeometry: function(clockOnly) { if (!clockOnly) { - this.geom = this._getGeometry(); + this.geom = this.getGeometry(); this._setPanelPosition(); this.taskbar.resetAppIcons(); } @@ -562,7 +563,7 @@ var dtpPanel = Utils.defineClass({ } }, - _getGeometry: function() { + getGeometry: function() { let scaleFactor = St.ThemeContext.get_for_stage(global.stage).scale_factor || 1; let position = getPosition(); let x = 0, y = 0; @@ -572,8 +573,8 @@ var dtpPanel = Utils.defineClass({ if (checkIfVertical()) { if (!Me.settings.get_boolean('group-apps')) { - // add 8 for the 4px css side padding of _dtpIconContainer when vertical - size += Me.settings.get_int('group-apps-label-max-width') + 8 / scaleFactor; + // add window title width and side padding of _dtpIconContainer when vertical + size += Me.settings.get_int('group-apps-label-max-width') + AppIcons.DEFAULT_PADDING_SIZE * 2 / scaleFactor; } sizeFunc = 'get_preferred_height', diff --git a/windowPreview.js b/windowPreview.js index 99a7214..3c2b7a4 100644 --- a/windowPreview.js +++ b/windowPreview.js @@ -416,7 +416,7 @@ var PreviewMenu = Utils.defineClass({ _updateClip: function() { let x, y, w, h; - let geom = this.panel.geom; + let geom = this.panel.getGeometry(); let panelBoxTheme = this.panel.panelBox.get_theme_node(); let previewSize = (Me.settings.get_int('window-preview-size') + Me.settings.get_int('window-preview-padding') * 2) * scaleFactor;