eab4f4c963
Currently they return 'undefined' instead of something meaningful, e.g. DND.DragMotionResult.CONTINUE. This was unnoticed because none of the ancestors of the Activities button actors do any drag handling. The only visible issue are JS errors generated when dragging, for example, a window thumbnail over the button, because the cursor cannot be set. https://bugzilla.gnome.org/show_bug.cgi?id=669921
1125 lines
40 KiB
JavaScript
1125 lines
40 KiB
JavaScript
// -*- 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 Lang = imports.lang;
|
|
const Mainloop = imports.mainloop;
|
|
const Pango = imports.gi.Pango;
|
|
const Shell = imports.gi.Shell;
|
|
const St = imports.gi.St;
|
|
const Signals = imports.signals;
|
|
|
|
const Config = imports.misc.config;
|
|
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;
|
|
|
|
const STANDARD_STATUS_AREA_ORDER = ['a11y', 'keyboard', 'volume', 'bluetooth', 'network', 'battery', 'userMenu'];
|
|
const STANDARD_STATUS_AREA_SHELL_IMPLEMENTATION = {
|
|
'a11y': imports.ui.status.accessibility.ATIndicator,
|
|
'volume': imports.ui.status.volume.Indicator,
|
|
'battery': imports.ui.status.power.Indicator,
|
|
'keyboard': imports.ui.status.keyboard.XKBIndicator,
|
|
'userMenu': imports.ui.userMenu.UserMenuButton
|
|
};
|
|
|
|
if (Config.HAVE_BLUETOOTH)
|
|
STANDARD_STATUS_AREA_SHELL_IMPLEMENTATION['bluetooth'] = imports.ui.status.bluetooth.Indicator;
|
|
|
|
try {
|
|
STANDARD_STATUS_AREA_SHELL_IMPLEMENTATION['network'] = imports.ui.status.network.NMApplet;
|
|
} catch(e) {
|
|
log('NMApplet is not supported. It is possible that your NetworkManager version is too old');
|
|
}
|
|
|
|
const GDM_STATUS_AREA_ORDER = ['a11y', 'display', 'keyboard', 'volume', 'battery', 'powerMenu'];
|
|
const GDM_STATUS_AREA_SHELL_IMPLEMENTATION = {
|
|
'a11y': imports.ui.status.accessibility.ATIndicator,
|
|
'volume': imports.ui.status.volume.Indicator,
|
|
'battery': imports.ui.status.power.Indicator,
|
|
'keyboard': imports.ui.status.keyboard.XKBIndicator,
|
|
'powerMenu': imports.gdm.powerMenu.PowerMenuButton
|
|
};
|
|
|
|
// 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, function() {
|
|
if (this.actor.visible) {
|
|
this._timeoutId = Mainloop.timeout_add(ANIMATED_ICON_UPDATE_TIMEOUT, Lang.bind(this, this._update));
|
|
} else {
|
|
if (this._timeoutId)
|
|
Mainloop.source_remove(this._timeoutId);
|
|
this._timeoutId = 0;
|
|
}
|
|
}));
|
|
|
|
this._timeoutId = 0;
|
|
this._i = 0;
|
|
this._animations = St.TextureCache.get_default().load_sliced_image (global.datadir + '/theme/' + name, size, size);
|
|
this.actor.set_child(this._animations);
|
|
},
|
|
|
|
_update: function() {
|
|
this._animations.hide_all();
|
|
this._animations.show();
|
|
if (this._i && this._i < this._animations.get_n_children())
|
|
this._animations.get_nth_child(this._i++).show();
|
|
else {
|
|
this._i = 1;
|
|
if (this._animations.get_n_children())
|
|
this._animations.get_nth_child(0).show();
|
|
}
|
|
return true;
|
|
},
|
|
|
|
_onDestroy: function() {
|
|
if (this._timeoutId)
|
|
Mainloop.source_remove(this._timeoutId);
|
|
}
|
|
});
|
|
|
|
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._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._sync));
|
|
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)
|
|
return;
|
|
|
|
this._visible = true;
|
|
this.actor.show();
|
|
this.actor.reactive = true;
|
|
|
|
if (!this._targetIsCurrent)
|
|
return;
|
|
|
|
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;
|
|
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._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_direction();
|
|
|
|
let yPadding = Math.floor(Math.max(0, allocHeight - naturalHeight) / 2);
|
|
childBox.y1 = yPadding;
|
|
childBox.y2 = childBox.y1 + Math.min(naturalHeight, allocHeight);
|
|
if (direction == St.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 == St.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 == St.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();
|
|
},
|
|
|
|
_sync: function() {
|
|
let tracker = Shell.WindowTracker.get_default();
|
|
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 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;
|
|
}
|
|
|
|
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);
|
|
|
|
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._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();
|
|
}));
|
|
Main.overview.connect('hiding', Lang.bind(this, function() {
|
|
this.actor.remove_style_pseudo_class('overview');
|
|
this._escapeMenuGrab();
|
|
}));
|
|
|
|
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_direction() == St.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 = children.length - 1;
|
|
while (!children[index].visible && index >= 0)
|
|
index--;
|
|
|
|
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 = 0;
|
|
while (!children[index].visible && index < children.length)
|
|
index++;
|
|
|
|
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_direction() == St.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');
|
|
}));
|
|
|
|
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_direction() == St.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_direction() == St.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));
|
|
|
|
/* Button on the left side of the panel. */
|
|
if (global.session_type == Shell.SessionType.USER) {
|
|
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);
|
|
|
|
this._appMenu = new AppMenuButton(this._menus);
|
|
this._leftBox.add(this._appMenu.actor);
|
|
}
|
|
|
|
/* center */
|
|
if (global.session_type == Shell.SessionType.USER)
|
|
this._dateMenu = new DateMenu.DateMenuButton({ showEvents: true });
|
|
else
|
|
this._dateMenu = new DateMenu.DateMenuButton({ showEvents: false });
|
|
this._centerBox.add(this._dateMenu.actor, { y_fill: true });
|
|
this._menus.addMenu(this._dateMenu.menu);
|
|
|
|
/* right */
|
|
if (global.session_type == Shell.SessionType.GDM) {
|
|
this._status_area_order = GDM_STATUS_AREA_ORDER;
|
|
this._status_area_shell_implementation = GDM_STATUS_AREA_SHELL_IMPLEMENTATION;
|
|
} else {
|
|
this._status_area_order = STANDARD_STATUS_AREA_ORDER;
|
|
this._status_area_shell_implementation = STANDARD_STATUS_AREA_SHELL_IMPLEMENTATION;
|
|
}
|
|
|
|
Main.statusIconDispatcher.connect('status-icon-added', Lang.bind(this, this._onTrayIconAdded));
|
|
Main.statusIconDispatcher.connect('status-icon-removed', Lang.bind(this, this._onTrayIconRemoved));
|
|
|
|
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_direction() == St.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_direction() == St.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);
|
|
},
|
|
|
|
startStatusArea: function() {
|
|
for (let i = 0; i < this._status_area_order.length; i++) {
|
|
let role = this._status_area_order[i];
|
|
let constructor = this._status_area_shell_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_actor(actor, i + 1);
|
|
break;
|
|
}
|
|
}
|
|
if (i == -1) {
|
|
// If we didn't find a position, we must be first
|
|
this._rightBox.insert_actor(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);
|
|
this._menus.addMenu(indicator.menu);
|
|
|
|
this._statusArea[role] = indicator;
|
|
let destroyId = indicator.connect('destroy', Lang.bind(this, function(emitter) {
|
|
this._statusArea[role] = null;
|
|
emitter.disconnect(destroyId);
|
|
}));
|
|
|
|
return indicator;
|
|
},
|
|
|
|
_onTrayIconAdded: function(o, icon, role) {
|
|
if (this._status_area_shell_implementation[role]) {
|
|
// This icon is legacy, and replaced by a Shell version
|
|
// Hide it
|
|
return;
|
|
}
|
|
|
|
icon.height = PANEL_ICON_SIZE;
|
|
let buttonBox = new PanelMenu.ButtonBox();
|
|
let box = buttonBox.actor;
|
|
box.add_actor(icon);
|
|
|
|
this._insertStatusItem(box, this._status_area_order.indexOf(role));
|
|
},
|
|
|
|
_onTrayIconRemoved: function(o, icon) {
|
|
let box = icon.get_parent();
|
|
if (box && box._delegate instanceof PanelMenu.ButtonBox)
|
|
box.destroy();
|
|
},
|
|
});
|