diff --git a/panel.js b/panel.js index d025b9b..34d7b2e 100644 --- a/panel.js +++ b/panel.js @@ -17,13 +17,13 @@ * Credits: * This file is based on code from the Dash to Dock extension by micheleg * and code from the Taskbar extension by Zorin OS - * + * * Code to re-anchor the panel was taken from Thoma5 BottomPanel: * https://github.com/Thoma5/gnome-shell-extension-bottompanel - * + * * Pattern for moving clock based on Frippery Move Clock by R M Yorston * http://frippery.org/extensions/ - * + * * Some code was also adapted from the upstream Gnome Shell source code. */ @@ -85,7 +85,7 @@ export const Panel = GObject.registerClass({ // so in this case use isPrimary to get the panel on the primary dtp monitor, which // might be different from the system's primary monitor. this.isStandalone = isStandalone; - this.isPrimary = !isStandalone || (SETTINGS.get_boolean('stockgs-keep-top-panel') && + this.isPrimary = !isStandalone || (SETTINGS.get_boolean('stockgs-keep-top-panel') && monitor == panelManager.dtpPrimaryMonitor); this._sessionStyle = null; @@ -144,20 +144,20 @@ export const Panel = GObject.registerClass({ }); } - // Create a wrapper around the real showAppsIcon in order to add a popupMenu. Most of + // Create a wrapper around the real showAppsIcon in order to add a popupMenu. Most of // its behavior is handled by the taskbar, but its positioning is done at the panel level this.showAppsIconWrapper = new AppIcons.ShowAppsIconWrapper(this); this.panel.add_child(this.showAppsIconWrapper.realShowAppsIcon); this.panel._delegate = this; - + this.add_child(this.panel); if (Main.panel._onButtonPress || Main.panel._tryDragWindow) { this._signalsHandler.add([ - this.panel, + this.panel, [ - 'button-press-event', + 'button-press-event', 'touch-event' ], this._onButtonPress.bind(this) @@ -167,7 +167,7 @@ export const Panel = GObject.registerClass({ if (Main.panel._onKeyPress) { this._signalsHandler.add([this.panel, 'key-press-event', Main.panel._onKeyPress.bind(this)]); } - + Main.ctrlAltTabManager.addGroup(this, _("Top Bar")+" "+ monitor.index, 'focus-top-bar-symbolic', { sortGroup: CtrlAltTab.SortGroup.TOP }); } @@ -180,7 +180,7 @@ export const Panel = GObject.registerClass({ } this.geom = this.getGeometry(); - + this._setPanelPosition(); if (!this.isStandalone) { @@ -209,13 +209,13 @@ export const Panel = GObject.registerClass({ }; this.dynamicTransparency = new Transparency.DynamicTransparency(this); - + this.taskbar = new Taskbar.Taskbar(this); this.panel.add_child(this.taskbar.actor); this._setShowDesktopButton(true); - + this._setAllocationMap(); this.panel.add_style_class_name('dashtopanelMainPanel ' + this.getOrientation()); @@ -225,14 +225,14 @@ export const Panel = GObject.registerClass({ this._signalsHandler.add( // this is to catch changes to the theme or window scale factor [ - Utils.getStageTheme(), - 'changed', + Utils.getStageTheme(), + 'changed', () => (this._resetGeometry(), this._setShowDesktopButtonStyle()), ], [ // sync hover after a popupmenu is closed this.taskbar, - 'menu-closed', + 'menu-closed', () => this.panel.sync_hover() ], [ @@ -255,10 +255,10 @@ export const Panel = GObject.registerClass({ ], [ this.statusArea.activities, - 'captured-event', + 'captured-event', (actor, e) => { if (e.type() == Clutter.EventType.BUTTON_PRESS || e.type() == Clutter.EventType.TOUCH_BEGIN) { - //temporarily use as primary the monitor on which the activities btn was clicked + //temporarily use as primary the monitor on which the activities btn was clicked this.panelManager.setFocusedMonitor(this.monitor); } } @@ -302,7 +302,7 @@ export const Panel = GObject.registerClass({ if (this.statusArea.dateMenu) { this._formatVerticalClock(); - + this._signalsHandler.add([ this.statusArea.dateMenu._clock, 'notify::clock', @@ -324,7 +324,7 @@ export const Panel = GObject.registerClass({ this._timeoutsHandler.destroy(); this._signalsHandler.destroy(); - + this.panel.remove_child(this.taskbar.actor); if (this.intellihide) { @@ -366,14 +366,14 @@ export const Panel = GObject.registerClass({ ['activities', systemMenuName, 'dateMenu'].forEach(b => { let container = this.statusArea[b].container; let originalParent = container._dtpOriginalParent; - + this.panel.remove_child(container); originalParent && originalParent.insert_child_at_index( - container, + container, Math.min(container._dtpOriginalIndex, originalParent.get_children().length - 1) ); - + delete container._dtpOriginalParent; delete container._dtpOriginalIndex; }); @@ -384,7 +384,7 @@ export const Panel = GObject.registerClass({ delete Utils.getIndicators(this.statusArea[systemMenuName]._volumeOutput)._dtpIgnoreScroll; this._injectionManager.clear(); - + this.panel._delegate = this.panel; } else { this._removePanelMenu('dateMenu'); @@ -405,16 +405,16 @@ export const Panel = GObject.registerClass({ } else if (position == Pos.BOTTOM) { return St.Side.BOTTOM; } - + return St.Side.LEFT; } checkIfVertical() { let position = this.getPosition(); - + return (position == St.Side.LEFT || position == St.Side.RIGHT); } - + getOrientation() { return (this.checkIfVertical() ? 'vertical' : 'horizontal'); } @@ -452,7 +452,7 @@ export const Panel = GObject.registerClass({ currentPosition = Pos.STACKED_BR; } - if (!previousPosition || + if (!previousPosition || (previousPosition == Pos.STACKED_TL && currentPosition != Pos.STACKED_TL) || (previousPosition != Pos.STACKED_BR && currentPosition == Pos.STACKED_BR) || (isCentered && previousPosition != currentPosition && previousPosition != Pos.STACKED_BR)) { @@ -514,7 +514,7 @@ export const Panel = GObject.registerClass({ 'changed::clock-format', () => { this._clockFormat = null; - + if (isVertical) { this._formatVerticalClock(); } @@ -544,7 +544,7 @@ export const Panel = GObject.registerClass({ container.insert_child_at_index(this.statusArea[propName].container, 0); } } - + _removePanelMenu(propName) { if (this.statusArea[propName]) { let parent = this.statusArea[propName].container.get_parent(); @@ -555,8 +555,8 @@ export const Panel = GObject.registerClass({ //calling this.statusArea[propName].destroy(); is buggy for now, gnome-shell never //destroys those panel menus... - //since we can't destroy the menu (hence properly disconnect its signals), let's - //store it so the next time a panel needs one of its kind, we can reuse it instead + //since we can't destroy the menu (hence properly disconnect its signals), let's + //store it so the next time a panel needs one of its kind, we can reuse it instead //of creating a new one let panelMenu = this.statusArea[propName]; @@ -660,7 +660,7 @@ export const Panel = GObject.registerClass({ if (this.checkIfVertical()) { let viewHeight = this.monitor.height - gsTopPanelOffset; - + if (anchor === Pos.MIDDLE) { anchorPlaceOnMonitor = (viewHeight - h) / 2; } else if (anchor === Pos.END) { @@ -681,7 +681,7 @@ export const Panel = GObject.registerClass({ } return { - x, y, + x, y, w, h, lrPadding, tbPadding, @@ -691,11 +691,11 @@ export const Panel = GObject.registerClass({ _setAllocationMap() { this.allocationMap = {}; - let setMap = (name, actor) => this.allocationMap[name] = { + let setMap = (name, actor) => this.allocationMap[name] = { actor: actor, - box: new Clutter.ActorBox() + box: new Clutter.ActorBox() }; - + setMap(Pos.SHOW_APPS_BTN, this.showAppsIconWrapper.realShowAppsIcon); setMap(Pos.ACTIVITIES_BTN, this.statusArea.activities ? this.statusArea.activities.container : 0); setMap(Pos.LEFT_BOX, this._leftBox); @@ -772,19 +772,19 @@ export const Panel = GObject.registerClass({ brSize += refGroup.size; } } - + if (group.isCentered) { availableSize -= Math.max(tlSize, brSize) * 2; } else { availableSize -= tlSize + brSize; } - + if (availableSize < group.size) { expandable.natSize -= (group.size - availableSize) * (group.isCentered && !Pos.checkIfCentered(expandable.position) ? .5 : 1); assignGroupSize(group, true); } } - + if (group.isCentered) { startPosition = tlLimit + (brLimit - tlLimit - group.size) * .5; } else if (group.position == Pos.STACKED_BR) { @@ -833,9 +833,9 @@ export const Panel = GObject.registerClass({ let prevGroup = this._elementGroups[i - 1]; let nextGroup = this._elementGroups[i + 1]; - let prevLimit = prevGroup && prevGroup.fixed ? prevGroup[this.varCoord.c2] : + let prevLimit = prevGroup && prevGroup.fixed ? prevGroup[this.varCoord.c2] : centeredMonitorGroup && group.index > centeredMonitorGroup.index ? centeredMonitorGroup[this.varCoord.c2] : panelAlloc[this.varCoord.c1]; - let nextLimit = nextGroup && nextGroup.fixed ? nextGroup[this.varCoord.c1] : + let nextLimit = nextGroup && nextGroup.fixed ? nextGroup[this.varCoord.c1] : centeredMonitorGroup && group.index < centeredMonitorGroup.index ? centeredMonitorGroup[this.varCoord.c1] : panelAlloc[this.varCoord.c2]; if (group.position == Pos.STACKED_TL) { @@ -860,7 +860,7 @@ export const Panel = GObject.registerClass({ // styles for theming Object.keys(St.Side).forEach(p => { let cssName = 'dashtopanel' + p.charAt(0) + p.slice(1).toLowerCase(); - + this.panel[(St.Side[p] == this.geom.position ? 'add' : 'remove') + '_style_class_name'](cssName); }); @@ -892,7 +892,7 @@ export const Panel = GObject.registerClass({ } else { const targetActor = global.stage.get_event_actor(event); - if (Main.modalCount > 0 || targetActor != actor || + if (Main.modalCount > 0 || targetActor != actor || (!isPress && type != Clutter.EventType.TOUCH_BEGIN) || (isPress && button != 1)) { return Clutter.EVENT_PROPAGATE; @@ -956,7 +956,7 @@ export const Panel = GObject.registerClass({ actor.vertical = isVertical; } else if ( actor != this.statusArea.appMenu && - ((actor._delegate || actor) instanceof PanelMenu.ButtonBox || actor == this.statusArea.quickSettings) + ((actor._delegate || actor) instanceof PanelMenu.ButtonBox || actor == this.statusArea.quickSettings) ) { let child = actor.get_first_child(); @@ -983,7 +983,7 @@ export const Panel = GObject.registerClass({ }; _set(actor, false); - + if (isVertical) _set(actor, isVertical); } @@ -994,7 +994,7 @@ export const Panel = GObject.registerClass({ delete actor._dtpVisibleId; delete actor._dtpDestroyId; - + this._unmappedButtons.splice(this._unmappedButtons.indexOf(actor), 1); } @@ -1008,16 +1008,16 @@ export const Panel = GObject.registerClass({ let setClockText = (text, useTimeSeparator) => { let stacks = text instanceof Array; let separator = `\n ${useTimeSeparator ? '‧‧' : '—' } \n`; - + clockText.set_text((stacks ? text.join(separator) : text).trim()); clockText.set_use_markup(stacks); clockText.get_allocation_box(); - + return !clockText.get_layout().is_ellipsized(); }; if (clockText.ellipsize == Pango.EllipsizeMode.NONE) { - //on gnome-shell 3.36.4, the clockdisplay isn't ellipsize anymore, so set it back + //on gnome-shell 3.36.4, the clockdisplay isn't ellipsize anymore, so set it back clockText.ellipsize = Pango.EllipsizeMode.END; } @@ -1029,8 +1029,8 @@ export const Panel = GObject.registerClass({ datetimeParts = [datetimeParts.join(' '), time]; } - if (!setClockText(datetime) && - !setClockText(datetimeParts) && + if (!setClockText(datetime) && + !setClockText(datetimeParts) && !setClockText(time)) { let timeParts = time.split('∶'); @@ -1078,7 +1078,7 @@ export const Panel = GObject.registerClass({ }]); } }); - + this._showDesktopButton.connect('leave-event', () => { this._showDesktopButton.remove_style_class_name(this._getBackgroundBrightness() ? 'showdesktop-button-light-hovered' : 'showdesktop-button-dark-hovered'); @@ -1103,8 +1103,12 @@ export const Panel = GObject.registerClass({ } } + _getDefaultLineColor(isBrightOverride) { + return (typeof isBrightOverride === 'undefined' && this._getBackgroundBrightness()) || isBrightOverride ? "rgba(55, 55, 55, .2)" : "rgba(200, 200, 200, .2)"; + } + _setShowDesktopButtonStyle() { - let rgb = this._getBackgroundBrightness() ? "rgba(55, 55, 55, .2)" : "rgba(200, 200, 200, .2)"; + let rgb = this._getDefaultLineColor(); let isLineCustom = SETTINGS.get_boolean('desktop-line-use-custom-color'); rgb = isLineCustom ? SETTINGS.get_string('desktop-line-custom-color') : rgb; @@ -1136,7 +1140,7 @@ export const Panel = GObject.registerClass({ time: time, transition: 'easeOutQuad' }; - + Utils.animateWindowOpacity(w.get_compositor_private(), tweenOpts); } }); @@ -1168,14 +1172,14 @@ export const Panel = GObject.registerClass({ windows.forEach(function(w) { w.minimize(); }); - + this._restoreWindowList = windows; this._timeoutsHandler.add([T5, 20, () => this._signalsHandler.addWithLabel( - label, + label, [ - tracker, - 'notify::focus-app', + tracker, + 'notify::focus-app', () => this._restoreWindowList = null ] )]); @@ -1208,7 +1212,7 @@ export const Panel = GObject.registerClass({ showWsPopup ? 0 : Main.wm._workspaceSwitcherPopup = null; } else if (direction && scrollAction === 'CYCLE_WINDOWS') { let windows = this.taskbar.getAppInfos().reduce((ws, appInfo) => ws.concat(appInfo.windows), []); - + Utils.activateSiblingWindow(windows, direction); } else if (scrollAction === 'CHANGE_VOLUME' && !event.is_pointer_emulated()) { let proto = Volume.OutputIndicator.prototype; diff --git a/prefs.js b/prefs.js index d2337c2..1c22f30 100644 --- a/prefs.js +++ b/prefs.js @@ -160,7 +160,7 @@ const Preferences = class { this._builder.set_scope(new BuilderScope(this)); this._settings = settings; this._path = path; - + this._metadata = ExtensionPreferences.lookupByURL(import.meta.url).metadata; this._builder.set_translation_domain(this._metadata['gettext-domain']); @@ -377,7 +377,7 @@ const Preferences = class { _displayPanelPositionsForMonitor(monitorIndex) { let taskbarListBox = this._builder.get_object('taskbar_display_listbox'); - + while(taskbarListBox.get_first_child()) { taskbarListBox.remove(taskbarListBox.get_first_child()); @@ -403,7 +403,7 @@ const Preferences = class { }); child = child.get_next_sibling(); } - + monitors.forEach(m => panelElementPositionsSettings[m] = newPanelElementPositions); this._settings.set_string('panel-element-positions', JSON.stringify(panelElementPositionsSettings)); }; @@ -462,7 +462,7 @@ const Preferences = class { if (Pos.optionDialogFunctions[el.element]) { let cogImg = new Gtk.Image({ icon_name: 'emblem-system-symbolic' }); let optionsBtn = new Gtk.Button({ tooltip_text: _('More options') }); - + optionsBtn.get_style_context().add_class('circular'); optionsBtn.set_child(cogImg); grid.attach(optionsBtn, 2, 0, 1, 1); @@ -484,7 +484,7 @@ const Preferences = class { _createPreferencesDialog(title, content, reset_function = null) { let dialog; - + dialog = new Gtk.Dialog({ title: title, transient_for: this.notebook.get_root(), use_header_bar: true, @@ -572,7 +572,7 @@ const Preferences = class { _showDesktopButtonOptions() { let box = this._builder.get_object('box_show_showdesktop_options'); - + let dialog = this._createPreferencesDialog(_('Show Desktop options'), box, () => { // restore default settings @@ -846,7 +846,7 @@ const Preferences = class { this._builder.get_object('grid_dot_color'), 'sensitive', Gio.SettingsBindFlags.DEFAULT); - + this._settings.bind('dot-color-override', this._builder.get_object('dot_color_unfocused_box'), 'sensitive', @@ -856,7 +856,7 @@ const Preferences = class { this._builder.get_object('grid_dot_color_unfocused'), 'sensitive', Gio.SettingsBindFlags.DEFAULT); - + for (let i = 1; i <= MAX_WINDOW_INDICATOR; i++) { let rgba = new Gdk.RGBA(); rgba.parse(this._settings.get_string('dot-color-' + i)); @@ -927,7 +927,7 @@ const Preferences = class { this._settings.connect('changed::panel-positions', () => this._updateVerticalRelatedOptions()); this._updateVerticalRelatedOptions(); - + for (let i = 0; i < this.monitors.length; ++i) { //the gnome-shell primary index is the first one in the "available-monitors" setting let label = !i ? _('Primary monitor') : _('Monitor ') + (i + 1); @@ -935,7 +935,7 @@ const Preferences = class { this._builder.get_object('multimon_primary_combo').append_text(label); this._builder.get_object('taskbar_position_monitor_combo').append_text(label); } - + this._builder.get_object('multimon_primary_combo').set_active(dtpPrimaryMonitorIndex); this._builder.get_object('taskbar_position_monitor_combo').set_active(dtpPrimaryMonitorIndex); @@ -1110,7 +1110,7 @@ const Preferences = class { this._builder.get_object('trans_options_distance_spinbutton').connect('value-changed', (widget) => { this._settings.set_int('trans-dynamic-distance', widget.get_value()); }); - + this._builder.get_object('trans_options_min_opacity_spinbutton').set_value(this._settings.get_double('trans-dynamic-anim-target') * 100); this._builder.get_object('trans_options_min_opacity_spinbutton').connect('value-changed', (widget) => { this._settings.set_double('trans-dynamic-anim-target', widget.get_value() * 0.01); @@ -1143,7 +1143,49 @@ const Preferences = class { dialog.set_default_size(1, 1); }); - + + + // Panel border + this._settings.bind('trans-use-border', + this._builder.get_object('trans_border_switch'), + 'active', + Gio.SettingsBindFlags.DEFAULT); + + this._settings.bind('trans-use-border', + this._builder.get_object('trans_border_color_box'), + 'sensitive', + Gio.SettingsBindFlags.DEFAULT); + + this._settings.bind('trans-use-border', + this._builder.get_object('trans_border_width_box'), + 'sensitive', + Gio.SettingsBindFlags.DEFAULT); + + this._settings.bind('trans-border-use-custom-color', + this._builder.get_object('trans_border_color_switch'), + 'active', + Gio.SettingsBindFlags.DEFAULT); + + this._settings.bind('trans-border-use-custom-color', + this._builder.get_object('trans_border_color_colorbutton'), + 'sensitive', + Gio.SettingsBindFlags.DEFAULT); + + rgba.parse(this._settings.get_string('trans-border-custom-color')); + this._builder.get_object('trans_border_color_colorbutton').set_rgba(rgba); + this._builder.get_object('trans_border_color_colorbutton').connect('color-set', (button) => { + let rgba = button.get_rgba(); + let css = rgba.to_string(); + this._settings.set_string('trans-border-custom-color', css); + }); + + this._builder.get_object('trans_border_width_spinbutton').set_value(this._settings.get_int('trans-border-width')); + this._builder.get_object('trans_border_width_spinbutton').connect('value-changed', (widget) => { + this._settings.set_int('trans-border-width', widget.get_value()); + }); + + + this._settings.bind('desktop-line-use-custom-color', this._builder.get_object('override_show_desktop_line_color_switch'), 'active', @@ -1153,7 +1195,7 @@ const Preferences = class { this._builder.get_object('override_show_desktop_line_color_colorbutton'), 'sensitive', Gio.SettingsBindFlags.DEFAULT); - + rgba.parse(this._settings.get_string('desktop-line-custom-color')); this._builder.get_object('override_show_desktop_line_color_colorbutton').set_rgba(rgba); this._builder.get_object('override_show_desktop_line_color_colorbutton').connect('color-set', (button) => { @@ -1191,7 +1233,7 @@ const Preferences = class { this._settings.bind('intellihide-use-pressure', this._builder.get_object('intellihide_use_pressure_switch'), 'active', - Gio.SettingsBindFlags.DEFAULT); + Gio.SettingsBindFlags.DEFAULT); this._settings.bind('intellihide-use-pressure', this._builder.get_object('intellihide_use_pressure_options'), @@ -1268,7 +1310,7 @@ const Preferences = class { this._settings.set_value('intellihide-pressure-threshold', this._settings.get_default_value('intellihide-pressure-threshold')); this._builder.get_object('intellihide_pressure_threshold_spinbutton').set_value(this._settings.get_int('intellihide-pressure-threshold')); - + this._settings.set_value('intellihide-pressure-time', this._settings.get_default_value('intellihide-pressure-time')); this._builder.get_object('intellihide_pressure_time_spinbutton').set_value(this._settings.get_int('intellihide-pressure-time')); @@ -1340,7 +1382,7 @@ const Preferences = class { this._builder.get_object('multimon_multi_show_favorites_switch'), 'active', Gio.SettingsBindFlags.DEFAULT); - + this._settings.bind('show-favorites', this._builder.get_object('multimon_multi_show_favorites_switch'), 'sensitive', @@ -1349,7 +1391,7 @@ const Preferences = class { this._settings.bind('show-running-apps', this._builder.get_object('show_runnning_apps_switch'), 'active', - Gio.SettingsBindFlags.DEFAULT); + Gio.SettingsBindFlags.DEFAULT); this._setPreviewTitlePosition(); @@ -1378,7 +1420,7 @@ const Preferences = class { this._builder.get_object('animation_time_spinbutton').set_value(this._settings.get_int('window-preview-animation-time')); this._settings.set_value('preview-use-custom-opacity', this._settings.get_default_value('preview-use-custom-opacity')); - + this._settings.set_value('window-preview-use-custom-icon-size', this._settings.get_default_value('window-preview-use-custom-icon-size')); this._settings.set_value('preview-custom-opacity', this._settings.get_default_value('preview-custom-opacity')); @@ -1405,7 +1447,7 @@ const Preferences = class { this._settings.set_value('window-preview-aspect-ratio-y', this._settings.get_default_value('window-preview-aspect-ratio-y')); this._builder.get_object('preview_aspect_ratio_y_combo').set_active_id(this._settings.get_int('window-preview-aspect-ratio-y').toString()); - + this._settings.set_value('window-preview-padding', this._settings.get_default_value('window-preview-padding')); this._builder.get_object('preview_padding_spinbutton').set_value(this._settings.get_int('window-preview-padding')); @@ -1413,7 +1455,7 @@ const Preferences = class { this._settings.set_value('window-preview-title-font-size', this._settings.get_default_value('window-preview-title-font-size')); this._builder.get_object('preview_title_size_spinbutton').set_value(this._settings.get_int('window-preview-title-font-size')); - + this._settings.set_value('window-preview-custom-icon-size', this._settings.get_default_value('window-preview-custom-icon-size')); this._builder.get_object('preview_custom_icon_size_spinbutton').set_value(this._settings.get_int('window-preview-custom-icon-size')); @@ -1467,7 +1509,7 @@ const Preferences = class { this._builder.get_object('preview_custom_opacity_spinbutton').connect('value-changed', (widget) => { this._settings.set_int('preview-custom-opacity', widget.get_value()); }); - + this._settings.bind('peek-mode', this._builder.get_object('peek_mode_switch'), 'active', @@ -1480,7 +1522,7 @@ const Preferences = class { this._builder.get_object('grid_peek_mode_opacity'), 'sensitive', Gio.SettingsBindFlags.DEFAULT); - + this._settings.bind('window-preview-show-title', this._builder.get_object('preview_show_title_switch'), 'active', @@ -1551,7 +1593,7 @@ const Preferences = class { this._builder.get_object('preview_title_size_spinbutton').connect('value-changed', (widget) => { this._settings.set_int('window-preview-title-font-size', widget.get_value()); }); - + this._builder.get_object('preview_custom_icon_size_spinbutton').set_value(this._settings.get_int('window-preview-custom-icon-size')); this._builder.get_object('preview_custom_icon_size_spinbutton').connect('value-changed', (widget) => { this._settings.set_int('window-preview-custom-icon-size', widget.get_value()); @@ -1571,7 +1613,7 @@ const Preferences = class { dialog.show(); }); - + this._settings.bind('isolate-workspaces', this._builder.get_object('isolate_workspaces_switch'), 'active', @@ -1634,7 +1676,7 @@ const Preferences = class { this._settings.bind('group-apps-use-launchers', this._builder.get_object('group_apps_use_launchers_switch'), 'active', - Gio.SettingsBindFlags.DEFAULT); + Gio.SettingsBindFlags.DEFAULT); this._builder.get_object('show_group_apps_options_button').connect('clicked', () => { let box = this._builder.get_object('box_group_apps_options'); @@ -1696,7 +1738,7 @@ const Preferences = class { dialog.show(); dialog.set_default_size(600, 1); - }); + }); this._builder.get_object('click_action_combo').set_active_id(this._settings.get_string('click-action')); this._builder.get_object('click_action_combo').connect('changed', (widget) => { @@ -1890,7 +1932,7 @@ const Preferences = class { dialog.set_default_size(600, 1); }); - + // setup dialog for secondary menu options this._builder.get_object('secondarymenu_options_button').connect('clicked', () => { let box = this._builder.get_object('box_secondarymenu_options'); @@ -2064,7 +2106,7 @@ const Preferences = class { 'active', Gio.SettingsBindFlags.DEFAULT); - + this._settings.connect('changed::stockgs-keep-top-panel', () => this._maybeDisableTopPosition()); @@ -2074,7 +2116,7 @@ const Preferences = class { this._builder.get_object('stockgs_panelbtn_switch'), 'active', Gio.SettingsBindFlags.DEFAULT); - + this._settings.bind('stockgs-force-hotcorner', this._builder.get_object('stockgs_hotcorner_switch'), 'active', @@ -2151,7 +2193,7 @@ const Preferences = class { dialog.connect('response', (dialog, id) => { if (id == Gtk.ResponseType.ACCEPT) acceptHandler.call(this, dialog.get_file().get_path()); - + dialog.destroy(); }); } @@ -2161,7 +2203,7 @@ const Preferences = class { const BuilderScope = GObject.registerClass({ Implements: [Gtk.BuilderScope], }, class BuilderScope extends GObject.Object { - + _init(preferences) { this._preferences = preferences; super._init(); @@ -2170,13 +2212,13 @@ const BuilderScope = GObject.registerClass({ vfunc_create_closure(builder, handlerName, flags, connectObject) { if (flags & Gtk.BuilderClosureFlags.SWAPPED) throw new Error('Unsupported template signal flag "swapped"'); - + if (typeof this[handlerName] === 'undefined') throw new Error(`${handlerName} is undefined`); - + return this[handlerName].bind(connectObject || this); } - + on_btn_click(connectObject) { connectObject.set_label("Clicked"); } @@ -2188,7 +2230,7 @@ const BuilderScope = GObject.registerClass({ position_top_button_clicked_cb(button) { if (!this._preferences._ignorePositionRadios && button.get_active()) this._preferences._setPanelPosition(Pos.TOP); } - + position_left_button_clicked_cb(button) { if (!this._preferences._ignorePositionRadios && button.get_active()) this._preferences._setPanelPosition(Pos.LEFT); } 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 a73a349..17e75dc 100644 --- a/schemas/org.gnome.shell.extensions.dash-to-panel.gschema.xml +++ b/schemas/org.gnome.shell.extensions.dash-to-panel.gschema.xml @@ -313,6 +313,26 @@ Custom gradient bottom opacity Custom gradient bottom opacity for the panel + + false + Display border + Display a border between panel and the rest of the desktop + + + 1 + Width of panel border + Customize the width of the panel border + + + false + Override panel border color + Replace current panel border color + + + "rgba(200,200,200,0.2)" + Custom panel border color + Custom panel border color + false Intellihide diff --git a/transparency.js b/transparency.js index 25ff00f..a05074a 100644 --- a/transparency.js +++ b/transparency.js @@ -98,6 +98,16 @@ export const DynamicTransparency = class { ], () => this._updateGradientAndSet() ], + [ + SETTINGS, + [ + 'changed::trans-use-border', + 'changed::trans-border-use-custom-color', + 'changed::trans-border-custom-color', + 'changed::trans-border-width', + ], + () => this._updateBorderAndSet() + ], [ SETTINGS, [ @@ -108,7 +118,7 @@ export const DynamicTransparency = class { () => this._updateProximityWatch() ], [ - SETTINGS, + SETTINGS, 'changed::trans-dynamic-anim-time', () => this._updateAnimationDuration() ] @@ -128,10 +138,10 @@ export const DynamicTransparency = class { this._proximityWatchId = this._proximityManager.createWatch( this._dtpPanel.panelBox.get_parent(), this._dtpPanel.monitor.index, - Proximity.Mode[SETTINGS.get_string('trans-dynamic-behavior')], - isVertical ? threshold : 0, - isVertical ? 0 : threshold, - overlap => { + Proximity.Mode[SETTINGS.get_string('trans-dynamic-behavior')], + isVertical ? threshold : 0, + isVertical ? 0 : threshold, + overlap => { this._windowOverlap = overlap; this._updateAlphaAndSet(); } @@ -149,6 +159,7 @@ export const DynamicTransparency = class { this._updateColor(themeBackground); this._updateAlpha(themeBackground); this._updateComplementaryStyles(); + this._updateBorder(); this._updateGradient(); this._setBackground(); this._setGradient(); @@ -169,6 +180,11 @@ export const DynamicTransparency = class { this._setGradient(); } + _updateBorderAndSet() { + this._updateBorder(); + this._setBackground(); + } + _updateComplementaryStyles() { let panelThemeNode = this._dtpPanel.panel.get_theme_node(); @@ -181,12 +197,31 @@ export const DynamicTransparency = class { (themeBackground || this._getThemeBackground()); } + _updateBorder() { + let rgba = this._dtpPanel._getDefaultLineColor(Utils.checkIfColorIsBright(this.backgroundColorRgb)); // supply parameter manually or else an exception (something is undefined) will arise + const isLineCustom = SETTINGS.get_boolean('trans-border-use-custom-color'); + rgba = isLineCustom ? SETTINGS.get_string('trans-border-custom-color') : rgba; + + const showBorder = SETTINGS.get_boolean('trans-use-border'); + const borderWidth = SETTINGS.get_int('trans-border-width'); + + const position = this._dtpPanel.getPosition(); + let borderPosition = ''; + if (position == St.Side.LEFT) { borderPosition = 'right'; } + if (position == St.Side.RIGHT) { borderPosition = 'left'; } + if (position == St.Side.TOP) { borderPosition = 'bottom'; } + if (position == St.Side.BOTTOM) { borderPosition = 'top'; } + + const style = `border: 0 solid ${rgba}; border-${borderPosition}-width:${borderWidth}px;`; + this._borderStyle = showBorder ? style : ''; + } + _updateAlpha(themeBackground) { if (this._windowOverlap && !Main.overview.visibleTarget && SETTINGS.get_boolean('trans-use-dynamic-opacity')) { this.alpha = SETTINGS.get_double('trans-dynamic-anim-target'); } else { this.alpha = SETTINGS.get_boolean('trans-use-custom-opacity') ? - SETTINGS.get_double('trans-panel-opacity') : + SETTINGS.get_double('trans-panel-opacity') : (themeBackground || this._getThemeBackground()).alpha * 0.003921569; // 1 / 255 = 0.003921569 } } @@ -196,9 +231,9 @@ export const DynamicTransparency = class { if (SETTINGS.get_boolean('trans-use-custom-gradient')) { this._gradientStyle += 'background-gradient-direction: ' + (this._dtpPanel.checkIfVertical() ? 'horizontal;' : 'vertical;') + - 'background-gradient-start: ' + Utils.getrgbaColor(SETTINGS.get_string('trans-gradient-top-color'), - SETTINGS.get_double('trans-gradient-top-opacity')) + - 'background-gradient-end: ' + Utils.getrgbaColor(SETTINGS.get_string('trans-gradient-bottom-color'), + 'background-gradient-start: ' + Utils.getrgbaColor(SETTINGS.get_string('trans-gradient-top-color'), + SETTINGS.get_double('trans-gradient-top-opacity')) + + 'background-gradient-end: ' + Utils.getrgbaColor(SETTINGS.get_string('trans-gradient-bottom-color'), SETTINGS.get_double('trans-gradient-bottom-opacity')); } } @@ -208,13 +243,13 @@ export const DynamicTransparency = class { let transition = 'transition-duration:' + this.animationDuration; - this._dtpPanel.set_style('background-color: ' + this.currentBackgroundColor + transition + this._complementaryStyles); + this._dtpPanel.set_style('background-color: ' + this.currentBackgroundColor + transition + this._complementaryStyles + this._borderStyle); } _setGradient() { this._dtpPanel.panel.set_style( - 'background: none; ' + - 'border-image: none; ' + + 'background: none; ' + + 'border-image: none; ' + 'background-image: none; ' + this._gradientStyle + 'transition-duration:' + this.animationDuration diff --git a/ui/SettingsStyle.ui b/ui/SettingsStyle.ui index abe5c34..c4662f1 100644 --- a/ui/SettingsStyle.ui +++ b/ui/SettingsStyle.ui @@ -34,6 +34,19 @@ 10 + + 100 + 5 + 10 + + + + 1 + 10 + 1 + 2 + + Style applications-graphics-symbolic @@ -42,7 +55,7 @@ AppIcon style - + App Icon Margin @@ -355,5 +368,50 @@ + + + + + + Panel border + + + center + + + + + + + Override border color + + + True + center + True + + + + + center + + + + + + + Border thickness + + + center + 1 + trans_border_width_adjustment + + + + + + + \ No newline at end of file