// -*- mode: js; js-indent-level: 4; indent-tabs-mode: nil -*- const Cairo = imports.cairo; const Clutter = imports.gi.Clutter; const Gio = imports.gi.Gio; const GLib = imports.gi.GLib; const Gtk = imports.gi.Gtk; const Lang = imports.lang; const Mainloop = imports.mainloop; const Meta = imports.gi.Meta; const Pango = imports.gi.Pango; const Shell = imports.gi.Shell; const St = imports.gi.St; const Signals = imports.signals; const Atk = imports.gi.Atk; const CtrlAltTab = imports.ui.ctrlAltTab; const DND = imports.ui.dnd; const Layout = imports.ui.layout; const Overview = imports.ui.overview; const PopupMenu = imports.ui.popupMenu; const PanelMenu = imports.ui.panelMenu; const DateMenu = imports.ui.dateMenu; const Main = imports.ui.main; const Tweener = imports.ui.tweener; const PANEL_ICON_SIZE = 24; const BUTTON_DND_ACTIVATION_TIMEOUT = 250; const ANIMATED_ICON_UPDATE_TIMEOUT = 100; const SPINNER_ANIMATION_TIME = 0.2; // To make sure the panel corners blend nicely with the panel, // we draw background and borders the same way, e.g. drawing // them as filled shapes from the outside inwards instead of // using cairo stroke(). So in order to give the border the // appearance of being drawn on top of the background, we need // to blend border and background color together. // For that purpose we use the following helper methods, taken // from st-theme-node-drawing.c function _norm(x) { return Math.round(x / 255); } function _over(srcColor, dstColor) { let src = _premultiply(srcColor); let dst = _premultiply(dstColor); let result = new Clutter.Color(); result.alpha = src.alpha + _norm((255 - src.alpha) * dst.alpha); result.red = src.red + _norm((255 - src.alpha) * dst.red); result.green = src.green + _norm((255 - src.alpha) * dst.green); result.blue = src.blue + _norm((255 - src.alpha) * dst.blue); return _unpremultiply(result); } function _premultiply(color) { return new Clutter.Color({ red: _norm(color.red * color.alpha), green: _norm(color.green * color.alpha), blue: _norm(color.blue * color.alpha), alpha: color.alpha }); }; function _unpremultiply(color) { if (color.alpha == 0) return new Clutter.Color(); let red = Math.min((color.red * 255 + 127) / color.alpha, 255); let green = Math.min((color.green * 255 + 127) / color.alpha, 255); let blue = Math.min((color.blue * 255 + 127) / color.alpha, 255); return new Clutter.Color({ red: red, green: green, blue: blue, alpha: color.alpha }); }; const AnimatedIcon = new Lang.Class({ Name: 'AnimatedIcon', _init: function(name, size) { this.actor = new St.Bin({ visible: false }); this.actor.connect('destroy', Lang.bind(this, this._onDestroy)); this.actor.connect('notify::visible', Lang.bind(this, this._onVisibleNotify)); this._timeoutId = 0; this._frame = 0; this._animations = St.TextureCache.get_default().load_sliced_image (global.datadir + '/theme/' + name, size, size); this.actor.set_child(this._animations); }, _disconnectTimeout: function() { if (this._timeoutId > 0) { Mainloop.source_remove(this._timeoutId); this._timeoutId = 0; } }, _onVisibleNotify: function() { if (this.actor.visible) this._timeoutId = Mainloop.timeout_add(ANIMATED_ICON_UPDATE_TIMEOUT, Lang.bind(this, this._update)); else this._disconnectTimeout(); }, _showFrame: function(frame) { let oldFrameActor = this._animations.get_child_at_index(this._frame); if (oldFrameActor) oldFrameActor.hide(); this._frame = (frame % this._animations.get_n_children()); let newFrameActor = this._animations.get_child_at_index(this._frame); if (newFrameActor) newFrameActor.show(); }, _update: function() { this._showFrame(this._frame + 1); return true; }, _onDestroy: function() { this._disconnectTimeout(); } }); const TextShadower = new Lang.Class({ Name: 'TextShadower', _init: function() { this.actor = new Shell.GenericContainer(); this.actor.connect('get-preferred-width', Lang.bind(this, this._getPreferredWidth)); this.actor.connect('get-preferred-height', Lang.bind(this, this._getPreferredHeight)); this.actor.connect('allocate', Lang.bind(this, this._allocate)); this._label = new St.Label(); this.actor.add_actor(this._label); for (let i = 0; i < 4; i++) { let actor = new St.Label({ style_class: 'label-shadow' }); actor.clutter_text.ellipsize = Pango.EllipsizeMode.END; this.actor.add_actor(actor); } this._label.raise_top(); }, setText: function(text) { let children = this.actor.get_children(); for (let i = 0; i < children.length; i++) children[i].set_text(text); }, _getPreferredWidth: function(actor, forHeight, alloc) { let [minWidth, natWidth] = this._label.get_preferred_width(forHeight); alloc.min_size = minWidth + 2; alloc.natural_size = natWidth + 2; }, _getPreferredHeight: function(actor, forWidth, alloc) { let [minHeight, natHeight] = this._label.get_preferred_height(forWidth); alloc.min_size = minHeight + 2; alloc.natural_size = natHeight + 2; }, _allocate: function(actor, box, flags) { let children = this.actor.get_children(); let availWidth = box.x2 - box.x1; let availHeight = box.y2 - box.y1; let [minChildWidth, minChildHeight, natChildWidth, natChildHeight] = this._label.get_preferred_size(); let childWidth = Math.min(natChildWidth, availWidth - 2); let childHeight = Math.min(natChildHeight, availHeight - 2); for (let i = 0; i < children.length; i++) { let child = children[i]; let childBox = new Clutter.ActorBox(); // The order of the labels here is arbitrary, except // we know the "real" label is at the end because Clutter.Group // sorts by Z order switch (i) { case 0: // top childBox.x1 = 1; childBox.y1 = 0; break; case 1: // right childBox.x1 = 2; childBox.y1 = 1; break; case 2: // bottom childBox.x1 = 1; childBox.y1 = 2; break; case 3: // left childBox.x1 = 0; childBox.y1 = 1; break; case 4: // center childBox.x1 = 1; childBox.y1 = 1; break; } childBox.x2 = childBox.x1 + childWidth; childBox.y2 = childBox.y1 + childHeight; child.allocate(childBox, flags); } } }); /** * AppMenuButton: * * This class manages the "application menu" component. It tracks the * currently focused application. However, when an app is launched, * this menu also handles startup notification for it. So when we * have an active startup notification, we switch modes to display that. */ const AppMenuButton = new Lang.Class({ Name: 'AppMenuButton', Extends: PanelMenu.Button, _init: function(menuManager) { this.parent(0.0, null, true); this.actor.accessible_role = Atk.Role.MENU; this._startingApps = []; this._menuManager = menuManager; this._targetApp = null; this._appMenuNotifyId = 0; this._actionGroupNotifyId = 0; let bin = new St.Bin({ name: 'appMenu' }); this.actor.add_actor(bin); this.actor.bind_property("reactive", this.actor, "can-focus", 0); this.actor.reactive = false; this._targetIsCurrent = false; this._container = new Shell.GenericContainer(); bin.set_child(this._container); this._container.connect('get-preferred-width', Lang.bind(this, this._getContentPreferredWidth)); this._container.connect('get-preferred-height', Lang.bind(this, this._getContentPreferredHeight)); this._container.connect('allocate', Lang.bind(this, this._contentAllocate)); this._iconBox = new Shell.Slicer({ name: 'appMenuIcon' }); this._iconBox.connect('style-changed', Lang.bind(this, this._onIconBoxStyleChanged)); this._iconBox.connect('notify::allocation', Lang.bind(this, this._updateIconBoxClip)); this._container.add_actor(this._iconBox); this._label = new TextShadower(); this._container.add_actor(this._label.actor); this._iconBottomClip = 0; this._visible = !Main.overview.visible; if (!this._visible) this.actor.hide(); Main.overview.connect('hiding', Lang.bind(this, function () { this.show(); })); Main.overview.connect('showing', Lang.bind(this, function () { this.hide(); })); this._stop = true; this._spinner = new AnimatedIcon('process-working.svg', PANEL_ICON_SIZE); this._container.add_actor(this._spinner.actor); this._spinner.actor.lower_bottom(); let tracker = Shell.WindowTracker.get_default(); let appSys = Shell.AppSystem.get_default(); tracker.connect('notify::focus-app', Lang.bind(this, this._focusAppChanged)); appSys.connect('app-state-changed', Lang.bind(this, this._onAppStateChanged)); global.window_manager.connect('switch-workspace', Lang.bind(this, this._sync)); this._sync(); }, show: function() { if (this._visible || Main.screenShield.locked) return; this._visible = true; this.actor.show(); if (!this._targetIsCurrent) return; this.actor.reactive = true; Tweener.removeTweens(this.actor); Tweener.addTween(this.actor, { opacity: 255, time: Overview.ANIMATION_TIME, transition: 'easeOutQuad' }); }, hide: function() { if (!this._visible) return; this._visible = false; this.actor.reactive = false; if (!this._targetIsCurrent) { this.actor.hide(); return; } Tweener.removeTweens(this.actor); Tweener.addTween(this.actor, { opacity: 0, time: Overview.ANIMATION_TIME, transition: 'easeOutQuad', onComplete: function() { this.actor.hide(); }, onCompleteScope: this }); }, _onIconBoxStyleChanged: function() { let node = this._iconBox.get_theme_node(); this._iconBottomClip = node.get_length('app-icon-bottom-clip'); this._updateIconBoxClip(); }, _updateIconBoxClip: function() { let allocation = this._iconBox.allocation; if (this._iconBottomClip > 0) this._iconBox.set_clip(0, 0, allocation.x2 - allocation.x1, allocation.y2 - allocation.y1 - this._iconBottomClip); else this._iconBox.remove_clip(); }, stopAnimation: function() { if (this._stop) return; this._stop = true; this.actor.reactive = true; Tweener.addTween(this._spinner.actor, { opacity: 0, time: SPINNER_ANIMATION_TIME, transition: "easeOutQuad", onCompleteScope: this, onComplete: function() { this._spinner.actor.opacity = 255; this._spinner.actor.hide(); } }); }, startAnimation: function() { this._stop = false; this.actor.reactive = false; this._spinner.actor.show(); }, _getContentPreferredWidth: function(actor, forHeight, alloc) { let [minSize, naturalSize] = this._iconBox.get_preferred_width(forHeight); alloc.min_size = minSize; alloc.natural_size = naturalSize; [minSize, naturalSize] = this._label.actor.get_preferred_width(forHeight); alloc.min_size = alloc.min_size + Math.max(0, minSize - Math.floor(alloc.min_size / 2)); alloc.natural_size = alloc.natural_size + Math.max(0, naturalSize - Math.floor(alloc.natural_size / 2)); }, _getContentPreferredHeight: function(actor, forWidth, alloc) { let [minSize, naturalSize] = this._iconBox.get_preferred_height(forWidth); alloc.min_size = minSize; alloc.natural_size = naturalSize; [minSize, naturalSize] = this._label.actor.get_preferred_height(forWidth); if (minSize > alloc.min_size) alloc.min_size = minSize; if (naturalSize > alloc.natural_size) alloc.natural_size = naturalSize; }, _contentAllocate: function(actor, box, flags) { let allocWidth = box.x2 - box.x1; let allocHeight = box.y2 - box.y1; let childBox = new Clutter.ActorBox(); let [minWidth, minHeight, naturalWidth, naturalHeight] = this._iconBox.get_preferred_size(); let direction = this.actor.get_text_direction(); let yPadding = Math.floor(Math.max(0, allocHeight - naturalHeight) / 2); childBox.y1 = yPadding; childBox.y2 = childBox.y1 + Math.min(naturalHeight, allocHeight); if (direction == Clutter.TextDirection.LTR) { childBox.x1 = 0; childBox.x2 = childBox.x1 + Math.min(naturalWidth, allocWidth); } else { childBox.x1 = Math.max(0, allocWidth - naturalWidth); childBox.x2 = allocWidth; } this._iconBox.allocate(childBox, flags); let iconWidth = childBox.x2 - childBox.x1; [minWidth, minHeight, naturalWidth, naturalHeight] = this._label.actor.get_preferred_size(); yPadding = Math.floor(Math.max(0, allocHeight - naturalHeight) / 2); childBox.y1 = yPadding; childBox.y2 = childBox.y1 + Math.min(naturalHeight, allocHeight); if (direction == Clutter.TextDirection.LTR) { childBox.x1 = Math.floor(iconWidth / 2); childBox.x2 = Math.min(childBox.x1 + naturalWidth, allocWidth); } else { childBox.x2 = allocWidth - Math.floor(iconWidth / 2); childBox.x1 = Math.max(0, childBox.x2 - naturalWidth); } this._label.actor.allocate(childBox, flags); if (direction == Clutter.TextDirection.LTR) { childBox.x1 = Math.floor(iconWidth / 2) + this._label.actor.width; childBox.x2 = childBox.x1 + this._spinner.actor.width; childBox.y1 = box.y1; childBox.y2 = box.y2 - 1; this._spinner.actor.allocate(childBox, flags); } else { childBox.x1 = -this._spinner.actor.width; childBox.x2 = childBox.x1 + this._spinner.actor.width; childBox.y1 = box.y1; childBox.y2 = box.y2 - 1; this._spinner.actor.allocate(childBox, flags); } }, _onAppStateChanged: function(appSys, app) { let state = app.state; if (state != Shell.AppState.STARTING) { this._startingApps = this._startingApps.filter(function(a) { return a != app; }); } else if (state == Shell.AppState.STARTING) { this._startingApps.push(app); } // For now just resync on all running state changes; this is mainly to handle // cases where the focused window's application changes without the focus // changing. An example case is how we map OpenOffice.org based on the window // title which is a dynamic property. this._sync(); }, _focusAppChanged: function() { let tracker = Shell.WindowTracker.get_default(); let focusedApp = tracker.focus_app; if (!focusedApp) { // If the app has just lost focus to the panel, pretend // nothing happened; otherwise you can't keynav to the // app menu. if (global.stage_input_mode == Shell.StageInputMode.FOCUSED) return; } this._sync(); }, setLockedState: function(locked) { if (locked) this.hide(); else this._sync(); }, _sync: function() { let tracker = Shell.WindowTracker.get_default(); let focusedApp = tracker.focus_app; let lastStartedApp = null; let workspace = global.screen.get_active_workspace(); for (let i = 0; i < this._startingApps.length; i++) if (this._startingApps[i].is_on_workspace(workspace)) lastStartedApp = this._startingApps[i]; let targetApp = focusedApp != null ? focusedApp : lastStartedApp; if (targetApp == null) { if (!this._targetIsCurrent) return; this.actor.reactive = false; this._targetIsCurrent = false; Tweener.removeTweens(this.actor); Tweener.addTween(this.actor, { opacity: 0, time: Overview.ANIMATION_TIME, transition: 'easeOutQuad' }); return; } if (!targetApp.is_on_workspace(workspace)) return; if (!this._targetIsCurrent) { this.actor.reactive = true; this._targetIsCurrent = true; Tweener.removeTweens(this.actor); Tweener.addTween(this.actor, { opacity: 255, time: Overview.ANIMATION_TIME, transition: 'easeOutQuad' }); } if (targetApp == this._targetApp) { if (targetApp && targetApp.get_state() != Shell.AppState.STARTING) { this.stopAnimation(); this._maybeSetMenu(); } return; } this._spinner.actor.hide(); if (this._iconBox.child != null) this._iconBox.child.destroy(); this._iconBox.hide(); this._label.setText(''); if (this._appMenuNotifyId) this._targetApp.disconnect(this._appMenuNotifyId); if (this._actionGroupNotifyId) this._targetApp.disconnect(this._actionGroupNotifyId); if (targetApp) { this._appMenuNotifyId = targetApp.connect('notify::menu', Lang.bind(this, this._sync)); this._actionGroupNotifyId = targetApp.connect('notify::action-group', Lang.bind(this, this._sync)); } else { this._appMenuNotifyId = 0; this._actionGroupNotifyId = 0; } this._targetApp = targetApp; let icon = targetApp.get_faded_icon(2 * PANEL_ICON_SIZE); this._label.setText(targetApp.get_name()); this.setName(targetApp.get_name()); this._iconBox.set_child(icon); this._iconBox.show(); if (targetApp.get_state() == Shell.AppState.STARTING) this.startAnimation(); else this._maybeSetMenu(); this.emit('changed'); }, _maybeSetMenu: function() { let menu; if (this._targetApp.action_group && this._targetApp.menu) { if (this.menu instanceof PopupMenu.RemoteMenu && this.menu.actionGroup == this._targetApp.action_group) return; menu = new PopupMenu.RemoteMenu(this.actor, this._targetApp.menu, this._targetApp.action_group); } else { if (this.menu && !(this.menu instanceof PopupMenu.RemoteMenu)) return; // fallback to older menu menu = new PopupMenu.PopupMenu(this.actor, 0.0, St.Side.TOP, 0); menu.addAction(_("Quit"), Lang.bind(this, function() { this._targetApp.request_quit(); })); } this.setMenu(menu); this._menuManager.addMenu(menu); } }); Signals.addSignalMethods(AppMenuButton.prototype); // Activities button. Because everything else in the top bar is a // PanelMenu.Button, it simplifies some things to make this be one too. // We just hack it up to not actually have a menu attached to it. const ActivitiesButton = new Lang.Class({ Name: 'ActivitiesButton', Extends: PanelMenu.Button, _init: function() { this.parent(0.0); this.actor.accessible_role = Atk.Role.TOGGLE_BUTTON; let container = new Shell.GenericContainer(); container.connect('get-preferred-width', Lang.bind(this, this._containerGetPreferredWidth)); container.connect('get-preferred-height', Lang.bind(this, this._containerGetPreferredHeight)); container.connect('allocate', Lang.bind(this, this._containerAllocate)); this.actor.add_actor(container); this.actor.name = 'panelActivities'; /* Translators: If there is no suitable word for "Activities" in your language, you can use the word for "Overview". */ this._label = new St.Label({ text: _("Activities") }); container.add_actor(this._label); this.actor.label_actor = this._label; this._hotCorner = new Layout.HotCorner(); container.add_actor(this._hotCorner.actor); // Hack up our menu... this.menu.open = Lang.bind(this, this._onMenuOpenRequest); this.menu.close = Lang.bind(this, this._onMenuCloseRequest); this.menu.toggle = Lang.bind(this, this._onMenuToggleRequest); this.actor.connect('captured-event', Lang.bind(this, this._onCapturedEvent)); this.actor.connect_after('button-release-event', Lang.bind(this, this._onButtonRelease)); this.actor.connect_after('key-release-event', Lang.bind(this, this._onKeyRelease)); Main.overview.connect('showing', Lang.bind(this, function() { this.actor.add_style_pseudo_class('overview'); this._escapeMenuGrab(); this.actor.add_accessible_state (Atk.StateType.CHECKED); })); Main.overview.connect('hiding', Lang.bind(this, function() { this.actor.remove_style_pseudo_class('overview'); this._escapeMenuGrab(); this.actor.remove_accessible_state (Atk.StateType.CHECKED); })); this._xdndTimeOut = 0; }, _containerGetPreferredWidth: function(actor, forHeight, alloc) { [alloc.min_size, alloc.natural_size] = this._label.get_preferred_width(forHeight); }, _containerGetPreferredHeight: function(actor, forWidth, alloc) { [alloc.min_size, alloc.natural_size] = this._label.get_preferred_height(forWidth); }, _containerAllocate: function(actor, box, flags) { this._label.allocate(box, flags); // The hot corner needs to be outside any padding/alignment // that has been imposed on us let primary = Main.layoutManager.primaryMonitor; let hotBox = new Clutter.ActorBox(); let ok, x, y; if (actor.get_text_direction() == Clutter.TextDirection.LTR) { [ok, x, y] = actor.transform_stage_point(primary.x, primary.y) } else { [ok, x, y] = actor.transform_stage_point(primary.x + primary.width, primary.y); // hotCorner.actor has northeast gravity, so we don't need // to adjust x for its width } hotBox.x1 = Math.round(x); hotBox.x2 = hotBox.x1 + this._hotCorner.actor.width; hotBox.y1 = Math.round(y); hotBox.y2 = hotBox.y1 + this._hotCorner.actor.height; this._hotCorner.actor.allocate(hotBox, flags); }, handleDragOver: function(source, actor, x, y, time) { if (source != Main.xdndHandler) return DND.DragMotionResult.CONTINUE; if (this._xdndTimeOut != 0) Mainloop.source_remove(this._xdndTimeOut); this._xdndTimeOut = Mainloop.timeout_add(BUTTON_DND_ACTIVATION_TIMEOUT, Lang.bind(this, this._xdndShowOverview, actor)); return DND.DragMotionResult.CONTINUE; }, _escapeMenuGrab: function() { if (this.menu.isOpen) this.menu.close(); }, _onCapturedEvent: function(actor, event) { if (event.type() == Clutter.EventType.BUTTON_PRESS) { if (!this._hotCorner.shouldToggleOverviewOnClick()) return true; } return false; }, _onMenuOpenRequest: function() { this.menu.isOpen = true; this.menu.emit('open-state-changed', true); }, _onMenuCloseRequest: function() { this.menu.isOpen = false; this.menu.emit('open-state-changed', false); }, _onMenuToggleRequest: function() { this.menu.isOpen = !this.menu.isOpen; this.menu.emit('open-state-changed', this.menu.isOpen); }, _onButtonRelease: function() { if (this.menu.isOpen) { this.menu.close(); Main.overview.toggle(); } }, _onKeyRelease: function(actor, event) { let symbol = event.get_key_symbol(); if (symbol == Clutter.KEY_Return || symbol == Clutter.KEY_space) { if (this.menu.isOpen) this.menu.close(); Main.overview.toggle(); } }, _xdndShowOverview: function(actor) { let [x, y, mask] = global.get_pointer(); let pickedActor = global.stage.get_actor_at_pos(Clutter.PickMode.REACTIVE, x, y); if (pickedActor == this.actor) { if (!Main.overview.visible && !Main.overview.animationInProgress) { Main.overview.showTemporarily(); Main.overview.beginItemDrag(actor); } } Mainloop.source_remove(this._xdndTimeOut); this._xdndTimeOut = 0; } }); const PanelCorner = new Lang.Class({ Name: 'PanelCorner', _init: function(box, side) { this._side = side; this._box = box; this._box.connect('style-changed', Lang.bind(this, this._boxStyleChanged)); this.actor = new St.DrawingArea({ style_class: 'panel-corner' }); this.actor.connect('style-changed', Lang.bind(this, this._styleChanged)); this.actor.connect('repaint', Lang.bind(this, this._repaint)); }, _findRightmostButton: function(container) { if (!container.get_children) return null; let children = container.get_children(); if (!children || children.length == 0) return null; // Start at the back and work backward let index; for (index = children.length - 1; index >= 0; index--) { if (children[index].visible) break; } if (index < 0) return null; if (!(children[index].has_style_class_name('panel-menu')) && !(children[index].has_style_class_name('panel-button'))) return this._findRightmostButton(children[index]); return children[index]; }, _findLeftmostButton: function(container) { if (!container.get_children) return null; let children = container.get_children(); if (!children || children.length == 0) return null; // Start at the front and work forward let index; for (index = 0; index < children.length; index++) { if (children[index].visible) break; } if (index == children.length) return null; if (!(children[index].has_style_class_name('panel-menu')) && !(children[index].has_style_class_name('panel-button'))) return this._findLeftmostButton(children[index]); return children[index]; }, _boxStyleChanged: function() { let side = this._side; let rtlAwareContainer = this._box instanceof St.BoxLayout; if (rtlAwareContainer && this._box.get_text_direction() == Clutter.TextDirection.RTL) { if (this._side == St.Side.LEFT) side = St.Side.RIGHT; else if (this._side == St.Side.RIGHT) side = St.Side.LEFT; } let button; if (side == St.Side.LEFT) button = this._findLeftmostButton(this._box); else if (side == St.Side.RIGHT) button = this._findRightmostButton(this._box); if (button) { if (this._button && this._buttonStyleChangedSignalId) { this._button.disconnect(this._buttonStyleChangedSignalId); this._button.style = null; } this._button = button; button.connect('destroy', Lang.bind(this, function() { if (this._button == button) { this._button = null; this._buttonStyleChangedSignalId = 0; } })); // Synchronize the locate button's pseudo classes with this corner this._buttonStyleChangedSignalId = button.connect('style-changed', Lang.bind(this, function(actor) { let pseudoClass = button.get_style_pseudo_class(); this.actor.set_style_pseudo_class(pseudoClass); })); // The corner doesn't support theme transitions, so override // the .panel-button default button.style = 'transition-duration: 0'; } }, _repaint: function() { let node = this.actor.get_theme_node(); let cornerRadius = node.get_length("-panel-corner-radius"); let borderWidth = node.get_length('-panel-corner-border-width'); let backgroundColor = node.get_color('-panel-corner-background-color'); let borderColor = node.get_color('-panel-corner-border-color'); let cr = this.actor.get_context(); cr.setOperator(Cairo.Operator.SOURCE); cr.moveTo(0, 0); if (this._side == St.Side.LEFT) cr.arc(cornerRadius, borderWidth + cornerRadius, cornerRadius, Math.PI, 3 * Math.PI / 2); else cr.arc(0, borderWidth + cornerRadius, cornerRadius, 3 * Math.PI / 2, 2 * Math.PI); cr.lineTo(cornerRadius, 0); cr.closePath(); let savedPath = cr.copyPath(); let xOffsetDirection = this._side == St.Side.LEFT ? -1 : 1; let over = _over(borderColor, backgroundColor); Clutter.cairo_set_source_color(cr, over); cr.fill(); let offset = borderWidth; Clutter.cairo_set_source_color(cr, backgroundColor); cr.save(); cr.translate(xOffsetDirection * offset, - offset); cr.appendPath(savedPath); cr.fill(); cr.restore(); }, _styleChanged: function() { let node = this.actor.get_theme_node(); let cornerRadius = node.get_length("-panel-corner-radius"); let borderWidth = node.get_length('-panel-corner-border-width'); this.actor.set_size(cornerRadius, borderWidth + cornerRadius); this.actor.set_anchor_point(0, borderWidth); } }); const Panel = new Lang.Class({ Name: 'Panel', _init : function() { this.actor = new Shell.GenericContainer({ name: 'panel', reactive: true }); this.actor._delegate = this; this._statusArea = {}; Main.overview.connect('shown', Lang.bind(this, function () { this.actor.add_style_class_name('in-overview'); })); Main.overview.connect('hiding', Lang.bind(this, function () { this.actor.remove_style_class_name('in-overview'); })); Main.screenShield.connect('lock-status-changed', Lang.bind(this, this._onLockStateChanged)); this._menus = new PopupMenu.PopupMenuManager(this); this._leftBox = new St.BoxLayout({ name: 'panelLeft' }); this.actor.add_actor(this._leftBox); this._centerBox = new St.BoxLayout({ name: 'panelCenter' }); this.actor.add_actor(this._centerBox); this._rightBox = new St.BoxLayout({ name: 'panelRight' }); this.actor.add_actor(this._rightBox); if (this.actor.get_text_direction() == Clutter.TextDirection.RTL) this._leftCorner = new PanelCorner(this._rightBox, St.Side.LEFT); else this._leftCorner = new PanelCorner(this._leftBox, St.Side.LEFT); this.actor.add_actor(this._leftCorner.actor); if (this.actor.get_text_direction() == Clutter.TextDirection.RTL) this._rightCorner = new PanelCorner(this._leftBox, St.Side.RIGHT); else this._rightCorner = new PanelCorner(this._rightBox, St.Side.RIGHT); this.actor.add_actor(this._rightCorner.actor); this.actor.connect('get-preferred-width', Lang.bind(this, this._getPreferredWidth)); this.actor.connect('get-preferred-height', Lang.bind(this, this._getPreferredHeight)); this.actor.connect('allocate', Lang.bind(this, this._allocate)); this.actor.connect('button-press-event', Lang.bind(this, this._onButtonPress)); /* Button on the left side of the panel. */ if (Main.sessionMode.hasOverview) { this._activitiesButton = new ActivitiesButton(); this._activities = this._activitiesButton.actor; this._leftBox.add(this._activities); // The activities button has a pretend menu, so as to integrate // more cleanly with the rest of the panel this._menus.addMenu(this._activitiesButton.menu); } if (Main.sessionMode.hasAppMenu) { this._appMenu = new AppMenuButton(this._menus); this._leftBox.add(this._appMenu.actor); } /* center */ this._dateMenu = new DateMenu.DateMenuButton(); this._centerBox.add(this._dateMenu.actor, { y_fill: true }); this._menus.addMenu(this._dateMenu.menu); Main.layoutManager.panelBox.add(this.actor); Main.ctrlAltTabManager.addGroup(this.actor, _("Top Bar"), 'start-here', { sortGroup: CtrlAltTab.SortGroup.TOP }); }, _getPreferredWidth: function(actor, forHeight, alloc) { alloc.min_size = -1; alloc.natural_size = Main.layoutManager.primaryMonitor.width; }, _getPreferredHeight: function(actor, forWidth, alloc) { // We don't need to implement this; it's forced by the CSS alloc.min_size = -1; alloc.natural_size = -1; }, _allocate: function(actor, box, flags) { let allocWidth = box.x2 - box.x1; let allocHeight = box.y2 - box.y1; let [leftMinWidth, leftNaturalWidth] = this._leftBox.get_preferred_width(-1); let [centerMinWidth, centerNaturalWidth] = this._centerBox.get_preferred_width(-1); let [rightMinWidth, rightNaturalWidth] = this._rightBox.get_preferred_width(-1); let sideWidth, centerWidth; centerWidth = centerNaturalWidth; sideWidth = (allocWidth - centerWidth) / 2; let childBox = new Clutter.ActorBox(); childBox.y1 = 0; childBox.y2 = allocHeight; if (this.actor.get_text_direction() == Clutter.TextDirection.RTL) { childBox.x1 = allocWidth - Math.min(Math.floor(sideWidth), leftNaturalWidth); childBox.x2 = allocWidth; } else { childBox.x1 = 0; childBox.x2 = Math.min(Math.floor(sideWidth), leftNaturalWidth); } this._leftBox.allocate(childBox, flags); childBox.x1 = Math.ceil(sideWidth); childBox.y1 = 0; childBox.x2 = childBox.x1 + centerWidth; childBox.y2 = allocHeight; this._centerBox.allocate(childBox, flags); childBox.y1 = 0; childBox.y2 = allocHeight; if (this.actor.get_text_direction() == Clutter.TextDirection.RTL) { childBox.x1 = 0; childBox.x2 = Math.min(Math.floor(sideWidth), rightNaturalWidth); } else { childBox.x1 = allocWidth - Math.min(Math.floor(sideWidth), rightNaturalWidth); childBox.x2 = allocWidth; } this._rightBox.allocate(childBox, flags); let [cornerMinWidth, cornerWidth] = this._leftCorner.actor.get_preferred_width(-1); let [cornerMinHeight, cornerHeight] = this._leftCorner.actor.get_preferred_width(-1); childBox.x1 = 0; childBox.x2 = cornerWidth; childBox.y1 = allocHeight; childBox.y2 = allocHeight + cornerHeight; this._leftCorner.actor.allocate(childBox, flags); let [cornerMinWidth, cornerWidth] = this._rightCorner.actor.get_preferred_width(-1); let [cornerMinHeight, cornerHeight] = this._rightCorner.actor.get_preferred_width(-1); childBox.x1 = allocWidth - cornerWidth; childBox.x2 = allocWidth; childBox.y1 = allocHeight; childBox.y2 = allocHeight + cornerHeight; this._rightCorner.actor.allocate(childBox, flags); }, _onButtonPress: function(actor, event) { if (event.get_source() != actor) return false; let button = event.get_button(); if (button != 1) return false; let focusWindow = global.display.focus_window; if (!focusWindow) return false; let dragWindow = focusWindow.is_attached_dialog() ? focusWindow.get_transient_for() : focusWindow; if (!dragWindow) return false; let rect = dragWindow.get_outer_rect(); let [stageX, stageY] = event.get_coords(); let allowDrag = dragWindow.maximized_vertically && stageX > rect.x && stageX < rect.x + rect.width; if (!allowDrag) return false; global.display.begin_grab_op(global.screen, dragWindow, Meta.GrabOp.MOVING, false, /* pointer grab */ true, /* frame action */ button, event.get_state(), event.get_time(), stageX, stageY); return true; }, openAppMenu: function() { let menu = this._appMenu.menu; if (!this._appMenu.actor.reactive || menu.isOpen) return; menu.open(); menu.actor.navigate_focus(null, Gtk.DirectionType.TAB_FORWARD, false); }, startStatusArea: function() { for (let i = 0; i < Main.sessionMode.statusArea.order.length; i++) { let role = Main.sessionMode.statusArea.order[i]; let constructor = Main.sessionMode.statusArea.implementation[role]; if (!constructor) { // This icon is not implemented (this is a bug) continue; } let indicator = new constructor(); this.addToStatusArea(role, indicator, i); } }, _insertStatusItem: function(actor, position) { let children = this._rightBox.get_children(); let i; for (i = children.length - 1; i >= 0; i--) { let rolePosition = children[i]._rolePosition; if (position > rolePosition) { this._rightBox.insert_child_at_index(actor, i + 1); break; } } if (i == -1) { // If we didn't find a position, we must be first this._rightBox.insert_child_at_index(actor, 0); } actor._rolePosition = position; }, addToStatusArea: function(role, indicator, position) { if (this._statusArea[role]) throw new Error('Extension point conflict: there is already a status indicator for role ' + role); if (!(indicator instanceof PanelMenu.Button)) throw new TypeError('Status indicator must be an instance of PanelMenu.Button'); if (!position) position = 0; this._insertStatusItem(indicator.actor, position); if (indicator.menu) this._menus.addMenu(indicator.menu); this._statusArea[role] = indicator; let destroyId = indicator.connect('destroy', Lang.bind(this, function(emitter) { delete this._statusArea[role]; emitter.disconnect(destroyId); })); return indicator; }, _onLockStateChanged: function(shield, locked) { if (this._activitiesButton) this._activitiesButton.setLockedState(locked); if (this._appMenu) this._appMenu.setLockedState(locked); if (this._dateMenu) this._dateMenu.setLockedState(locked); for (let id in this._statusArea) this._statusArea[id].setLockedState(locked); }, });