[gnome-shell/overview-relayout: 13/14] overview: Rework workspace controls for the view selector
- From: Florian Müllner <fmuellner src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gnome-shell/overview-relayout: 13/14] overview: Rework workspace controls for the view selector
- Date: Sun, 24 Oct 2010 11:45:40 +0000 (UTC)
commit d4b29d93d67b5db8d9ec87a42110d55f76b3a19c
Author: Florian Müllner <fmuellner gnome org>
Date: Mon Oct 4 16:42:11 2010 +0200
overview: Rework workspace controls for the view selector
As workspaces now appear as a particular view in the view selector,
merge WorkspacesControls and WorkspacesManager to control workspaces
and related controls, so that a single actor can be added to the
selector instead of positioning the elements from the overview.
Also enforce linear view, the grid will have its comeback with the
new DND behavior.
data/theme/gnome-shell.css | 38 ++++-----
js/ui/overview.js | 37 +++------
js/ui/workspacesView.js | 215 ++++++++++++--------------------------------
3 files changed, 86 insertions(+), 204 deletions(-)
---
diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index 3f58e37..4eae72c 100644
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -297,8 +297,8 @@ StTooltip {
.workspace-indicator {
width: 24px;
height: 16px;
- background: rgba(155,155,155,0.8);
- border-spacing: 16px;
+ background: rgba(255,255,255,0.2);
+ border-spacing: 8px;
}
.workspace-indicator.active {
@@ -323,36 +323,32 @@ StTooltip {
}
.single-view-controls {
- padding: 0px 15px;
+ padding: 8px 0px;
}
.workspace-controls {
- width: 24px;
- height: 16px;
-}
-
-.workspace-controls.add {
- background-image: url("add-workspace.svg");
-}
-
-.workspace-controls.remove {
- background-image: url("remove-workspace.svg");
+ width: 48px;
+ font-size: 32px;
+ font-weight: bold;
}
-.workspace-controls.switch-single {
- background-image: url("single-view.svg");
+.add-workspace {
+ color: #ffffff;
+ background-color: rgba(128, 128, 128, 0.4);
}
-.workspace-controls.switch-mosaic {
- background-image: url("mosaic-view.svg");
+.add-workspace:hover {
+ background-color: rgba(128, 128, 128, 0.6);
}
-.workspace-controls.switch-single:checked {
- background-image: url("single-view-active.svg");
+.remove-workspace {
+ color: rgba(128, 128, 128, 0.4);
+ height: 48px;
}
-.workspace-controls.switch-mosaic:checked {
- background-image: url("mosaic-view-active.svg");
+.remove-workspace:hover {
+ color: rgba(128, 128, 128, 0.6);
+ background-color: rgba(128, 128, 128, 0.2);
}
/* Overview */
diff --git a/js/ui/overview.js b/js/ui/overview.js
index 62f0cf7..53f11df 100644
--- a/js/ui/overview.js
+++ b/js/ui/overview.js
@@ -143,7 +143,7 @@ Overview.prototype = {
this.shellInfo = new ShellInfo();
- this._workspacesManager = null;
+ this._workspacesDisplay = null;
this.visible = false;
this.animationInProgress = false;
@@ -168,7 +168,8 @@ Overview.prototype = {
this._group.add_actor(this.viewSelector.actor);
// placeholder
- this.viewSelector.addViewTab("Windows", new St.Bin({ y_fill: true }));
+ this._workspacePlaceholder = new St.Bin({ x_fill: true, y_fill: true });
+ this.viewSelector.addViewTab("Windows", this._workspacePlaceholder);
let appView = new AppDisplay.AllAppDisplay();
this.viewSelector.addViewTab("Applications", appView.actor);
@@ -203,11 +204,10 @@ Overview.prototype = {
if (!this.visible)
return;
- this.workspaces = this._workspacesManager.workspacesView;
+ this.workspaces = this._workspacesDisplay.workspacesView;
// Show new workspacesView
this._group.add_actor(this.workspaces.actor);
- this._workspacesBar.raise(this.workspaces.actor);
this._appWell.actor.raise(this.workspaces.actor);
},
@@ -247,11 +247,6 @@ Overview.prototype = {
this.viewSelector.actor.set_position(viewX, viewY);
this.viewSelector.actor.set_size(viewWidth, viewHeight);
- // place the 'Add Workspace' button in the bottom row of the grid
- this._workspacesBarX = this._workspacesX;
- this._workspacesBarWidth = this._workspacesWidth;
- this._workspacesBarY = this._workspacesX + this._workspacesHeight + this._spacing;
-
// The parent (this._group) is positioned at the top left of the primary monitor
// while this._backOver occupies the entire screen.
this._backOver.set_position(- primary.x, - primary.y);
@@ -315,14 +310,15 @@ Overview.prototype = {
this.viewSelector.show();
/* TODO: make this stuff dynamic */
- this._workspacesManager =
- new WorkspacesView.WorkspacesManager(this._workspacesWidth,
+ this._workspacesDisplay =
+ new WorkspacesView.WorkspacesDisplay(this._workspacesWidth,
this._workspacesHeight,
this._workspacesX,
this._workspacesY);
- this._workspacesManager.connect('view-changed',
+ this._workspacesDisplay.connect('view-changed',
Lang.bind(this, this._onViewChanged));
- this.workspaces = this._workspacesManager.workspacesView;
+ this.workspaces = this._workspacesDisplay.workspacesView;
+ this._workspacePlaceholder.set_child(this._workspacesDisplay.actor);
this._group.add_actor(this.workspaces.actor);
// The workspaces actor is as big as the screen, so we have to raise the dash above it
@@ -330,15 +326,6 @@ Overview.prototype = {
// be as big as the screen.
this._appWell.actor.raise(this.workspaces.actor);
- this._workspacesBar = this._workspacesManager.controlsBar.actor;
- this._workspacesBar.set_position(this._workspacesBarX,
- this._workspacesBarY);
- this._workspacesBar.width = this._workspacesBarWidth;
-
- this._group.add_actor(this._workspacesBar);
- //this._workspacesBar.raise(this.workspaces.actor);
- this._workspacesBar.hide();
-
if (!this._desktop.child)
this._desktop.child = this._getDesktopClone();
@@ -466,10 +453,8 @@ Overview.prototype = {
this.workspaces.destroy();
this.workspaces = null;
- this._workspacesBar.destroy();
- this._workspacesBar = null;
-
- this._workspacesManager = null;
+ this._workspacesDisplay.actor.destroy();
+ this._workspacesDisplay = null;
this.viewSelector.hide();
diff --git a/js/ui/workspacesView.js b/js/ui/workspacesView.js
index da5db2b..9bf4b95 100644
--- a/js/ui/workspacesView.js
+++ b/js/ui/workspacesView.js
@@ -1246,180 +1246,66 @@ SingleView.prototype = {
}
};
-function WorkspacesControls() {
- this._init();
+function WorkspacesDisplay(width, height, x, y) {
+ this._init(width, height, x, y);
}
-WorkspacesControls.prototype = {
- _init: function() {
- this.actor = new St.BoxLayout({ style_class: 'workspaces-bar' });
- this.actor.connect('destroy', Lang.bind(this, this._onDestroy));
+WorkspacesDisplay.prototype = {
+ _init: function(width, height, x, y) {
+ this._workspacesWidth = width;
+ this._workspacesHeight = height;
+ this._workspacesX = x;
+ this._workspacesY = y;
- let view = global.settings.get_string(WORKSPACES_VIEW_KEY).toUpperCase();
- if (view in WorkspacesViewType)
- this._currentViewType = WorkspacesViewType[view];
- else
- this._currentViewType = WorkspacesViewType.SINGLE;
+ this._workspaces = [];
+ for (let w = 0; w < global.screen.n_workspaces; w++) {
+ let metaWorkspace = global.screen.get_workspace_by_index(w);
+ this._workspaces[w] = new Workspace.Workspace(metaWorkspace);
+ }
- this._currentView = null;
+ this.actor = new St.BoxLayout();
- // View switcher button
- this._toggleViewButton = new St.Button();
- this._updateToggleButtonStyle();
+ let workspacesBox = new St.BoxLayout({ vertical: true });
+ this.actor.add(workspacesBox, { expand: true });
- this._toggleViewButton.connect('clicked', Lang.bind(this, function() {
- if (this._currentViewType == WorkspacesViewType.SINGLE)
- this._setView(WorkspacesViewType.GRID);
- else
- this._setView(WorkspacesViewType.SINGLE);
- }));
+ // placeholder for window previews
+ workspacesBox.add(new St.Bin(), { expand: true });
- this.actor.add(this._toggleViewButton, { y_fill: false, y_align: St.Align.START });
+ this._workspaceControls = new St.Bin({ x_fill: true });
+ workspacesBox.add(this._workspaceControls);
- // View specific controls
- this._viewControls = new St.Bin({ x_fill: true, y_fill: true });
- this.actor.add(this._viewControls, { expand: true, x_fill: true });
+ let controls = new St.BoxLayout({ vertical: true,
+ style_class: 'workspace-controls' });
+ this.actor.add(controls);
// Add/remove workspace buttons
- this._removeButton = new St.Button({ style_class: 'workspace-controls remove' });
+ this._removeButton = new St.Button({ label: '–', // n-dash
+ style_class: 'remove-workspace' });
this._removeButton.connect('clicked', Lang.bind(this, function() {
- this._currentView.removeWorkspace();
+ this.workspacesView.removeWorkspace();
}));
- this.actor.add(this._removeButton, { y_fill: false,
- y_align: St.Align.START });
+ controls.add(this._removeButton);
- this._addButton = new St.Button({ style_class: 'workspace-controls add' });
+ this._addButton = new St.Button({ label: '+',
+ style_class: 'add-workspace' });
this._addButton.connect('clicked', Lang.bind(this, function() {
- this._currentView.addWorkspace();
+ this.workspacesView.addWorkspace();
}));
this._addButton._delegate = this._addButton;
this._addButton._delegate.acceptDrop = Lang.bind(this,
function(source, actor, x, y, time) {
- return this._currentView._acceptNewWorkspaceDrop(source, actor, x, y, time);
+ return this.workspacesView._acceptNewWorkspaceDrop(source, actor, x, y, time);
});
this._addButton._delegate.handleDragOver = Lang.bind(this,
function(source, actor, x, y, time) {
- return this._currentView._handleDragOverNewWorkspace(source, actor, x, y, time);
+ return this.workspacesView._handleDragOverNewWorkspace(source, actor, x, y, time);
});
- this.actor.add(this._addButton, { y_fill: false,
- y_align: St.Align.START });
-
- this._nWorkspacesNotifyId =
- global.screen.connect('notify::n-workspaces',
- Lang.bind(this, this._workspacesChanged));
- this._switchWorkspaceNotifyId =
- global.window_manager.connect('switch-workspace',
- Lang.bind(this, this.updateControlsSensitivity));
-
- this._workspacesChanged();
- },
-
- updateControls: function(view) {
- this._currentView = view;
-
- this.updateControlsSensitivity();
-
- let newControls = this._currentView.createControllerBar();
- if (newControls) {
- this._viewControls.child = newControls;
- this._viewControls.child.opacity = 0;
- Tweener.addTween(this._viewControls.child,
- { opacity: 255,
- time: Overview.ANIMATION_TIME,
- transition: 'easeOutQuad' });
- } else {
- if (this._viewControls.child)
- Tweener.addTween(this._viewControls.child,
- { opacity: 0,
- time: Overview.ANIMATION_TIME,
- transition: 'easeOutQuad',
- onComplete: Lang.bind(this, function() {
- this._viewControls.child.destroy();
- })});
- }
- },
-
- _updateToggleButtonStyle: function() {
- if (this._currentViewType == WorkspacesViewType.SINGLE)
- this._toggleViewButton.set_style_class_name('workspace-controls switch-mosaic');
- else
- this._toggleViewButton.set_style_class_name('workspace-controls switch-single');
- },
-
- _setView: function(view) {
- if (this._currentViewType == view)
- return;
-
- if (WorkspacesViewType.SINGLE == view)
- this._toggleViewButton.set_style_class_name('workspace-controls switch-mosaic');
- else
- this._toggleViewButton.set_style_class_name('workspace-controls switch-single');
-
- this._currentViewType = view;
- global.settings.set_string(WORKSPACES_VIEW_KEY, view);
- },
-
- _onDestroy: function() {
- if (this._nWorkspacesNotifyId > 0) {
- global.screen.disconnect(this._nWorkspacesNotifyId);
- this._nWorkspacesNotifyId = 0;
- }
- if (this._switchWorkspaceNotifyId > 0) {
- global.window_manager.disconnect(this._switchWorkspaceNotifyId);
- this._switchWorkspaceNotifyId = 0;
- }
- },
-
- _setButtonSensitivity: function(button, sensitive) {
- if (button == null)
- return;
- button.opacity = sensitive ? 255 : 85;
- },
-
- updateControlsSensitivity: function() {
- if (this._currentView) {
- this._setButtonSensitivity(this._removeButton, this._currentView.canRemoveWorkspace());
- this._setButtonSensitivity(this._addButton, this._currentView.canAddWorkspace());
- }
- },
-
- _workspacesChanged: function() {
- let showToggleButton = (global.screen.n_workspaces > 1);
- Tweener.addTween(this._toggleViewButton,
- { opacity: showToggleButton ? 255 : 0,
- time: WORKSPACE_SWITCH_TIME,
- transition: 'easeOutQuad' });
- this.updateControlsSensitivity();
- }
-};
-Signals.addSignalMethods(WorkspacesControls.prototype);
-
-function WorkspacesManager(width, height, x, y) {
- this._init(width, height, x, y);
-}
-
-WorkspacesManager.prototype = {
- _init: function(width, height, x, y) {
- this._workspacesWidth = width;
- this._workspacesHeight = height;
- this._workspacesX = x;
- this._workspacesY = y;
-
- this._workspaces = [];
- for (let w = 0; w < global.screen.n_workspaces; w++) {
- let metaWorkspace = global.screen.get_workspace_by_index(w);
- this._workspaces[w] = new Workspace.Workspace(metaWorkspace);
- }
+ controls.add(this._addButton, { expand: true });
this.workspacesView = null;
- this.controlsBar = new WorkspacesControls();
this._updateView();
- this.controlsBar.actor.connect('destroy',
- Lang.bind(this, this._onDestroy));
- this._viewChangedId =
- global.settings.connect('changed::' + WORKSPACES_VIEW_KEY,
- Lang.bind(this, this._updateView));
+ this.actor.connect('destroy', Lang.bind(this, this._onDestroy));
this._nWorkspacesNotifyId =
global.screen.connect('notify::n-workspaces',
Lang.bind(this, this._workspacesChanged));
@@ -1428,11 +1314,7 @@ WorkspacesManager.prototype = {
_updateView: function() {
let viewType, newView;
- let view = global.settings.get_string(WORKSPACES_VIEW_KEY).toUpperCase();
- if (view in WorkspacesViewType)
- viewType = WorkspacesViewType[view];
- else
- viewType = WorkspacesViewType.SINGLE;
+ viewType = WorkspacesViewType.SINGLE;
switch (viewType) {
case WorkspacesViewType.SINGLE:
@@ -1455,11 +1337,32 @@ WorkspacesManager.prototype = {
this.workspacesView.destroy();
this.workspacesView = newView;
- this.controlsBar.updateControls(this.workspacesView);
+ this._updateWorkspaceControls(this.workspacesView);
this.emit('view-changed');
},
+ _updateWorkspaceControls: function() {
+ let newControls = this.workspacesView.createControllerBar();
+ if (newControls) {
+ this._workspaceControls.child = newControls;
+ this._workspaceControls.child.opacity = 0;
+ Tweener.addTween(this._workspaceControls.child,
+ { opacity: 255,
+ time: Overview.ANIMATION_TIME,
+ transition: 'easeOutQuad' });
+ } else {
+ if (this._workspaceControls.child)
+ Tweener.addTween(this._workspaceControls.child,
+ { opacity: 0,
+ time: Overview.ANIMATION_TIME,
+ transition: 'easeOutQuad',
+ onComplete: Lang.bind(this, function() {
+ this._workspaceControls.child.destroy();
+ })});
+ }
+ },
+
_workspacesChanged: function() {
let oldNumWorkspaces = this._workspaces.length;
let newNumWorkspaces = global.screen.n_workspaces;
@@ -1505,12 +1408,10 @@ WorkspacesManager.prototype = {
_onDestroy: function() {
if (this._nWorkspacesNotifyId > 0)
global.screen.disconnect(this._nWorkspacesNotifyId);
- if (this._viewChangedId > 0)
- global.settings.disconnect(this._viewChangedId);
for (let w = 0; w < this._workspaces.length; w++) {
this._workspaces[w].disconnectAll();
this._workspaces[w].destroy();
}
}
};
-Signals.addSignalMethods(WorkspacesManager.prototype);
+Signals.addSignalMethods(WorkspacesDisplay.prototype);
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]
