isa/gnome-shell
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[Overview] Fade dash menus

Browse Source 
As the design calls for smooth transitions whenever possible, use
a similar fade effect for the all-apps and more-docs menus as for
the panel menus.

https://bugzilla.gnome.org/show_bug.cgi?id=620775
This commit is contained in:
Florian Müllner 2010-06-06 20:20:00 +02:00
parent b83d5975b0
commit 88be8e87ac
3 changed files with 45 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
js/ui/appDisplay.js
View File

@ -17,7 +17,9 @@ const AppFavorites = imports.ui.appFavorites;
const DND = imports.ui.dnd; const DND = imports.ui.dnd;
const GenericDisplay = imports.ui.genericDisplay; const GenericDisplay = imports.ui.genericDisplay;
const Main = imports.ui.main; const Main = imports.ui.main;
const Overview = imports.ui.overview;
const Search = imports.ui.search; const Search = imports.ui.search;
const Tweener = imports.ui.tweener;
const Workspace = imports.ui.workspace; const Workspace = imports.ui.workspace;
const APPICON_SIZE = 48; const APPICON_SIZE = 48;
@ -179,9 +181,28 @@ AllAppDisplay.prototype = {
}, },
toggle: function() { toggle: function() {
this.emit('open-state-changed', !this.actor.visible); if (this.actor.visible) {
Tweener.addTween(this.actor,
this.actor.visible = !this.actor.visible; { opacity: 0,
time: Overview.PANE_FADE_TIME,
transition: 'easeOutQuad',
onComplete: Lang.bind(this,
function() {
this.actor.hide();
this.emit('open-state-changed',
this.actor.visible);
})
});
} else {
this.actor.show();
this.emit('open-state-changed', this.actor.visible);
this.actor.opacity = 0;
Tweener.addTween(this.actor,
{ opacity: 255,
time: Overview.PANE_FADE_TIME,
transition: 'easeOutQuad'
});
}
}, },
close: function() { close: function() {

21
js/ui/dash.js
View File

@ -17,7 +17,9 @@ const DocDisplay = imports.ui.docDisplay;
const PlaceDisplay = imports.ui.placeDisplay; const PlaceDisplay = imports.ui.placeDisplay;
const GenericDisplay = imports.ui.genericDisplay; const GenericDisplay = imports.ui.genericDisplay;
const Main = imports.ui.main; const Main = imports.ui.main;
const Overview = imports.ui.overview;
const Search = imports.ui.search; const Search = imports.ui.search;
const Tweener = imports.ui.tweener;
// 25 search results (per result type) should be enough for everyone // 25 search results (per result type) should be enough for everyone
const MAX_RENDERED_SEARCH_RESULTS = 25; const MAX_RENDERED_SEARCH_RESULTS = 25;
@ -79,16 +81,29 @@ Pane.prototype = {
if (this._open) if (this._open)
return; return;
this._open = true; this._open = true;
this.actor.show();
this.emit('open-state-changed', this._open); this.emit('open-state-changed', this._open);
this.actor.opacity = 0;
this.actor.show();
Tweener.addTween(this.actor,
{ opacity: 255,
time: Overview.PANE_FADE_TIME,
transition: 'easeOutQuad'
});
}, },
close: function () { close: function () {
if (!this._open) if (!this._open)
return; return;
this._open = false; this._open = false;
this.actor.hide(); Tweener.addTween(this.actor,
this.emit('open-state-changed', this._open); { opacity: 0,
time: Overview.PANE_FADE_TIME,
transition: 'easeOutQuad',
onComplete: Lang.bind(this, function() {
this.actor.hide();
this.emit('open-state-changed', this._open);
})
});
}, },
destroyContent: function() { destroyContent: function() {

3
js/ui/overview.js
View File

@ -24,6 +24,9 @@ const WorkspacesView = imports.ui.workspacesView;
// Time for initial animation going into Overview mode // Time for initial animation going into Overview mode
const ANIMATION_TIME = 0.25; const ANIMATION_TIME = 0.25;
// Time for pane menus to fade in/out
const PANE_FADE_TIME = 0.1;
// We divide the screen into a grid of rows and columns, which we use // We divide the screen into a grid of rows and columns, which we use
// to help us position the Overview components, such as the side panel // to help us position the Overview components, such as the side panel
// that lists applications and documents, the workspaces display, and // that lists applications and documents, the workspaces display, and