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

windowManager: Use easing for window animations

Browse Source
This commit is contained in:
Florian Müllner 2018-07-20 21:46:19 +02:00
parent c168bd4e01
commit 253d234b50
1 changed files with 175 additions and 168 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

343
js/ui/windowManager.js
View File

@ -11,7 +11,6 @@ const WorkspaceSwitcherPopup = imports.ui.workspaceSwitcherPopup;
const InhibitShortcutsDialog = imports.ui.inhibitShortcutsDialog; const InhibitShortcutsDialog = imports.ui.inhibitShortcutsDialog;
const Main = imports.ui.main; const Main = imports.ui.main;
const ModalDialog = imports.ui.modalDialog; const ModalDialog = imports.ui.modalDialog;
const Tweener = imports.ui.tweener;
const WindowMenu = imports.ui.windowMenu; const WindowMenu = imports.ui.windowMenu;
const PadOsd = imports.ui.padOsd; const PadOsd = imports.ui.padOsd;
const EdgeDragAction = imports.ui.edgeDragAction; const EdgeDragAction = imports.ui.edgeDragAction;
@ -21,12 +20,12 @@ const SwitchMonitor = imports.ui.switchMonitor;
const { loadInterfaceXML } = imports.misc.fileUtils; const { loadInterfaceXML } = imports.misc.fileUtils;
var SHELL_KEYBINDINGS_SCHEMA = 'org.gnome.shell.keybindings'; var SHELL_KEYBINDINGS_SCHEMA = 'org.gnome.shell.keybindings';
var MINIMIZE_WINDOW_ANIMATION_TIME = 0.2; var MINIMIZE_WINDOW_ANIMATION_TIME = 200; // ms
var SHOW_WINDOW_ANIMATION_TIME = 0.15; var SHOW_WINDOW_ANIMATION_TIME = 150; // ms
var DIALOG_SHOW_WINDOW_ANIMATION_TIME = 0.1; var DIALOG_SHOW_WINDOW_ANIMATION_TIME = 100; // ms
var DESTROY_WINDOW_ANIMATION_TIME = 0.15; var DESTROY_WINDOW_ANIMATION_TIME = 150; // ms
var DIALOG_DESTROY_WINDOW_ANIMATION_TIME = 0.1; var DIALOG_DESTROY_WINDOW_ANIMATION_TIME = 100; // ms
var WINDOW_ANIMATION_TIME = 0.25; var WINDOW_ANIMATION_TIME = 250; // ms
var DIM_BRIGHTNESS = -0.3; var DIM_BRIGHTNESS = -0.3;
var DIM_TIME = 500; // ms var DIM_TIME = 500; // ms
var UNDIM_TIME = 250; // ms var UNDIM_TIME = 250; // ms
@ -441,15 +440,16 @@ var TilePreview = class {
this._showing = true; this._showing = true;
this.actor.show(); this.actor.show();
Tweener.addTween(this.actor, this.actor.ease({
{ x: tileRect.x, x: tileRect.x,
y: tileRect.y, y: tileRect.y,
width: tileRect.width, width: tileRect.width,
height: tileRect.height, height: tileRect.height,
opacity: 255, opacity: 255
time: WINDOW_ANIMATION_TIME, }, {
transition: 'easeOutQuad' duration: WINDOW_ANIMATION_TIME,
}); mode: Clutter.AnimationMode.EASE_OUT_QUAD
});
} }
hide() { hide() {
@ -457,12 +457,13 @@ var TilePreview = class {
return; return;
this._showing = false; this._showing = false;
Tweener.addTween(this.actor, this.actor.ease({
{ opacity: 0, opacity: 0
time: WINDOW_ANIMATION_TIME, }, {
transition: 'easeOutQuad', duration: WINDOW_ANIMATION_TIME,
onComplete: this._reset.bind(this) mode: Clutter.AnimationMode.EASE_OUT_QUAD,
}); onComplete: () => this._reset()
});
} }
_reset() { _reset() {
@ -1164,15 +1165,16 @@ var WindowManager = class {
return; return;
let switchData = this._switchData; let switchData = this._switchData;
this._switchData = null; this._switchData = null;
Tweener.addTween(switchData.container, switchData.container.ease({
{ x: 0, x: 0,
y: 0, y: 0
time: WINDOW_ANIMATION_TIME, }, {
transition: 'easeOutQuad', time: WINDOW_ANIMATION_TIME,
onComplete: this._finishWorkspaceSwitch, mode: Clutter.AnimationMode.EASE_OUT_QUAD,
onCompleteScope: this, onComplete: () => {
onCompleteParams: [switchData], this._finishWorkspaceSwitch(switchData);
}); }
});
} }
_actionSwitchWorkspace(action, direction) { _actionSwitchWorkspace(action, direction) {
@ -1342,17 +1344,18 @@ var WindowManager = class {
this._minimizing.push(actor); this._minimizing.push(actor);
if (actor.meta_window.is_monitor_sized()) { if (actor.meta_window.is_monitor_sized()) {
Tweener.addTween(actor, actor.ease({
{ opacity: 0, opacity: 0
time: MINIMIZE_WINDOW_ANIMATION_TIME, }, {
transition: 'easeOutQuad', duration: MINIMIZE_WINDOW_ANIMATION_TIME,
onComplete: this._minimizeWindowDone, mode: Clutter.AnimationMode.EASE_OUT_QUAD,
onCompleteScope: this, onStopped: isFinished => {
onCompleteParams: [shellwm, actor], if (isFinished)
onOverwrite: this._minimizeWindowOverwritten, this._minimizeWindowDone(shellwm, actor);
onOverwriteScope: this, else
onOverwriteParams: [shellwm, actor] this._minimizeWindowOverwritten(shellwm, actor);
}); },
});
} else { } else {
let xDest, yDest, xScale, yScale; let xDest, yDest, xScale, yScale;
let [success, geom] = actor.meta_window.get_icon_geometry(); let [success, geom] = actor.meta_window.get_icon_geometry();
@ -1375,26 +1378,27 @@ var WindowManager = class {
yScale = 0; yScale = 0;
} }
Tweener.addTween(actor, actor.ease({
{ scale_x: xScale, scale_x: xScale,
scale_y: yScale, scale_y: yScale,
x: xDest, x: xDest,
y: yDest, y: yDest
time: MINIMIZE_WINDOW_ANIMATION_TIME, }, {
transition: 'easeInExpo', duration: MINIMIZE_WINDOW_ANIMATION_TIME,
onComplete: this._minimizeWindowDone, mode: Clutter.AnimationMode.EASE_IN_EXPO,
onCompleteScope: this, onStopped: isFinished => {
onCompleteParams: [shellwm, actor], if (isFinished)
onOverwrite: this._minimizeWindowOverwritten, this._minimizeWindowDone(shellwm, actor);
onOverwriteScope: this, else
onOverwriteParams: [shellwm, actor] this._minimizeWindowOverwritten(shellwm, actor);
}); }
});
} }
} }
_minimizeWindowDone(shellwm, actor) { _minimizeWindowDone(shellwm, actor) {
if (this._removeEffect(this._minimizing, actor)) { if (this._removeEffect(this._minimizing, actor)) {
Tweener.removeTweens(actor); actor.remove_all_transitions();
actor.set_scale(1.0, 1.0); actor.set_scale(1.0, 1.0);
actor.set_opacity(255); actor.set_opacity(255);
actor.set_pivot_point(0, 0); actor.set_pivot_point(0, 0);
@ -1423,17 +1427,18 @@ var WindowManager = class {
if (actor.meta_window.is_monitor_sized()) { if (actor.meta_window.is_monitor_sized()) {
actor.opacity = 0; actor.opacity = 0;
actor.set_scale(1.0, 1.0); actor.set_scale(1.0, 1.0);
Tweener.addTween(actor, actor.ease({
{ opacity: 255, opacity: 255
time: MINIMIZE_WINDOW_ANIMATION_TIME, }, {
transition: 'easeOutQuad', duration: MINIMIZE_WINDOW_ANIMATION_TIME,
onComplete: this._unminimizeWindowDone, mode: Clutter.AnimationMode.EASE_OUT_QUAD,
onCompleteScope: this, onStopped: isFinished => {
onCompleteParams: [shellwm, actor], if (isFinished)
onOverwrite: this._unminimizeWindowOverwritten, this._unminimizeWindowDone(shellwm, actor);
onOverwriteScope: this, else
onOverwriteParams: [shellwm, actor] this._unminimizeWindowOverwritten(shellwm, actor);
}); }
});
} else { } else {
let [success, geom] = actor.meta_window.get_icon_geometry(); let [success, geom] = actor.meta_window.get_icon_geometry();
if (success) { if (success) {
@ -1457,26 +1462,27 @@ var WindowManager = class {
let [xDest, yDest] = [rect.x, rect.y]; let [xDest, yDest] = [rect.x, rect.y];
actor.show(); actor.show();
Tweener.addTween(actor, actor.ease({
{ scale_x: 1.0, scale_x: 1,
scale_y: 1.0, scale_y: 1,
x: xDest, x: xDest,
y: yDest, y: yDest
time: MINIMIZE_WINDOW_ANIMATION_TIME, }, {
transition: 'easeInExpo', duration: MINIMIZE_WINDOW_ANIMATION_TIME,
onComplete: this._unminimizeWindowDone, mode: Clutter.AnimationMode.EASE_IN_EXPO,
onCompleteScope: this, onStopped: isFinished => {
onCompleteParams: [shellwm, actor], if (isFinished)
onOverwrite: this._unminimizeWindowOverwritten, this._unminimizeWindowDone(shellwm, actor);
onOverwriteScope: this, else
onOverwriteParams: [shellwm, actor] this._unminimizeWindowOverwritten(shellwm, actor);
}); }
});
} }
} }
_unminimizeWindowDone(shellwm, actor) { _unminimizeWindowDone(shellwm, actor) {
if (this._removeEffect(this._unminimizing, actor)) { if (this._removeEffect(this._unminimizing, actor)) {
Tweener.removeTweens(actor); actor.remove_all_transitions();
actor.set_scale(1.0, 1.0); actor.set_scale(1.0, 1.0);
actor.set_opacity(255); actor.set_opacity(255);
actor.set_pivot_point(0, 0); actor.set_pivot_point(0, 0);
@ -1542,15 +1548,16 @@ var WindowManager = class {
this._resizing.push(actor); this._resizing.push(actor);
// Now scale and fade out the clone // Now scale and fade out the clone
Tweener.addTween(actorClone, actorClone.ease({
{ x: targetRect.x, x: targetRect.x,
y: targetRect.y, y: targetRect.y,
scale_x: scaleX, scale_x: scaleX,
scale_y: scaleY, scale_y: scaleY,
opacity: 0, opacity: 0
time: WINDOW_ANIMATION_TIME, }, {
transition: 'easeOutQuad' duration: WINDOW_ANIMATION_TIME,
}); mode: Clutter.AnimationMode.EASE_OUT_QUAD
});
actor.translation_x = -targetRect.x + sourceRect.x; actor.translation_x = -targetRect.x + sourceRect.x;
actor.translation_y = -targetRect.y + sourceRect.y; actor.translation_y = -targetRect.y + sourceRect.y;
@ -1560,20 +1567,21 @@ var WindowManager = class {
actor.scale_y = 1 / scaleY; actor.scale_y = 1 / scaleY;
// Scale it to its actual new size // Scale it to its actual new size
Tweener.addTween(actor, actor.ease({
{ scale_x: 1.0, scale_x: 1,
scale_y: 1.0, scale_y: 1,
translation_x: 0, translation_x: 0,
translation_y: 0, translation_y: 0
time: WINDOW_ANIMATION_TIME, }, {
transition: 'easeOutQuad', duration: WINDOW_ANIMATION_TIME,
onComplete: this._sizeChangeWindowDone, mode: Clutter.AnimationMode.EASE_OUT_QUAD,
onCompleteScope: this, onStopped: isFinished => {
onCompleteParams: [shellwm, actor], if (isFinished)
onOverwrite: this._sizeChangeWindowOverwritten, this._sizeChangeWindowDone(shellwm, actor);
onOverwriteScope: this, else
onOverwriteParams: [shellwm, actor] this._sizeChangeWindowOverwritten(shellwm, actor);
}); }
});
// Now unfreeze actor updates, to get it to the new size. // Now unfreeze actor updates, to get it to the new size.
// It's important that we don't wait until the animation is completed to // It's important that we don't wait until the animation is completed to
@ -1593,7 +1601,7 @@ var WindowManager = class {
_sizeChangeWindowDone(shellwm, actor) { _sizeChangeWindowDone(shellwm, actor) {
if (this._removeEffect(this._resizing, actor)) { if (this._removeEffect(this._resizing, actor)) {
Tweener.removeTweens(actor); actor.remove_all_transitions();
actor.scale_x = 1.0; actor.scale_x = 1.0;
actor.scale_y = 1.0; actor.scale_y = 1.0;
actor.translation_x = 0; actor.translation_x = 0;
@ -1698,19 +1706,20 @@ var WindowManager = class {
actor.show(); actor.show();
this._mapping.push(actor); this._mapping.push(actor);
Tweener.addTween(actor, actor.ease({
{ opacity: 255, opacity: 255,
scale_x: 1, scale_x: 1,
scale_y: 1, scale_y: 1
time: SHOW_WINDOW_ANIMATION_TIME, }, {
transition: 'easeOutExpo', duration: SHOW_WINDOW_ANIMATION_TIME,
onComplete: this._mapWindowDone, mode: Clutter.AnimationMode.EASE_OUT_EXPO,
onCompleteScope: this, onStopped: isFinished => {
onCompleteParams: [shellwm, actor], if (isFinished)
onOverwrite: this._mapWindowOverwrite, this._mapWindowDone(shellwm, actor);
onOverwriteScope: this, else
onOverwriteParams: [shellwm, actor] this._mapWindowOverwrite(shellwm, actor);
}); }
});
break; break;
case Meta.WindowType.MODAL_DIALOG: case Meta.WindowType.MODAL_DIALOG:
case Meta.WindowType.DIALOG: case Meta.WindowType.DIALOG:
@ -1720,19 +1729,20 @@ var WindowManager = class {
actor.show(); actor.show();
this._mapping.push(actor); this._mapping.push(actor);
Tweener.addTween(actor, actor.ease({
{ opacity: 255, opacity: 255,
scale_x: 1, scale_x: 1,
scale_y: 1, scale_y: 1
time: DIALOG_SHOW_WINDOW_ANIMATION_TIME, }, {
transition: 'easeOutQuad', duration: DIALOG_SHOW_WINDOW_ANIMATION_TIME,
onComplete: this._mapWindowDone, mode: Clutter.AnimationMode.EASE_OUT_QUAD,
onCompleteScope: this, onStopped: isFinished => {
onCompleteParams: [shellwm, actor], if (isFinished)
onOverwrite: this._mapWindowOverwrite, this._mapWindowDone(shellwm, actor);
onOverwriteScope: this, else
onOverwriteParams: [shellwm, actor] this._mapWindowOverwrite(shellwm, actor);
}); }
});
break; break;
default: default:
shellwm.completed_map(actor); shellwm.completed_map(actor);
@ -1742,7 +1752,7 @@ var WindowManager = class {
_mapWindowDone(shellwm, actor) { _mapWindowDone(shellwm, actor) {
if (this._removeEffect(this._mapping, actor)) { if (this._removeEffect(this._mapping, actor)) {
Tweener.removeTweens(actor); actor.remove_all_transitions();
actor.opacity = 255; actor.opacity = 255;
actor.set_pivot_point(0, 0); actor.set_pivot_point(0, 0);
actor.scale_y = 1; actor.scale_y = 1;
@ -1786,19 +1796,17 @@ var WindowManager = class {
actor.set_pivot_point(0.5, 0.5); actor.set_pivot_point(0.5, 0.5);
this._destroying.push(actor); this._destroying.push(actor);
Tweener.addTween(actor, actor.ease({
{ opacity: 0, opacity: 0,
scale_x: 0.8, scale_x: 0.8,
scale_y: 0.8, scale_y: 0.8
time: DESTROY_WINDOW_ANIMATION_TIME, }, {
transition: 'easeOutQuad', duration: DESTROY_WINDOW_ANIMATION_TIME,
onComplete: this._destroyWindowDone, mode: Clutter.AnimationMode.EASE_OUT_QUAD,
onCompleteScope: this, onStopped: () => {
onCompleteParams: [shellwm, actor], this._destroyWindowDone(shellwm, actor);
onOverwrite: this._destroyWindowDone, }
onOverwriteScope: this, });
onOverwriteParams: [shellwm, actor]
});
break; break;
case Meta.WindowType.MODAL_DIALOG: case Meta.WindowType.MODAL_DIALOG:
case Meta.WindowType.DIALOG: case Meta.WindowType.DIALOG:
@ -1808,22 +1816,20 @@ var WindowManager = class {
if (window.is_attached_dialog()) { if (window.is_attached_dialog()) {
let parent = window.get_transient_for(); let parent = window.get_transient_for();
actor._parentDestroyId = parent.connect('unmanaged', () => { actor._parentDestroyId = parent.connect('unmanaged', () => {
Tweener.removeTweens(actor); actor.remove_all_transitions();
this._destroyWindowDone(shellwm, actor); this._destroyWindowDone(shellwm, actor);
}); });
} }
Tweener.addTween(actor, actor.ease({
{ scale_y: 0, scale_y: 0
time: DIALOG_DESTROY_WINDOW_ANIMATION_TIME, }, {
transition: 'easeOutQuad', duration: DIALOG_DESTROY_WINDOW_ANIMATION_TIME,
onComplete: this._destroyWindowDone, mode: Clutter.AnimationMode.EASE_OUT_QUAD,
onCompleteScope: this, onStopped: () => {
onCompleteParams: [shellwm, actor], this._destroyWindowDone(shellwm, actor);
onOverwrite: this._destroyWindowDone, }
onOverwriteScope: this, });
onOverwriteParams: [shellwm, actor]
});
break; break;
default: default:
shellwm.completed_destroy(actor); shellwm.completed_destroy(actor);
@ -2061,15 +2067,16 @@ var WindowManager = class {
xDest = -xDest; xDest = -xDest;
yDest = -yDest; yDest = -yDest;
Tweener.addTween(this._switchData.container, this._switchData.container.ease({
{ x: xDest, x: xDest,
y: yDest, y: yDest
time: WINDOW_ANIMATION_TIME, }, {
transition: 'easeOutQuad', time: WINDOW_ANIMATION_TIME,
onComplete: this._switchWorkspaceDone, mode: Clutter.AnimationMode.EASE_OUT_QUAD,
onCompleteScope: this, onComplete: () => {
onCompleteParams: [shellwm] this._switchWorkspaceDone(shellwm);
}); }
});
} }
_switchWorkspaceDone(shellwm) { _switchWorkspaceDone(shellwm) {