gnome-shell/0001-Revert-js-Ease-non-animatable-actor-properties.patch

558 lines
22 KiB
Diff

From 00e2a5c5a540273ac03e6b43bf37817c903c28f4 Mon Sep 17 00:00:00 2001
From: Adam Williamson <awilliam@redhat.com>
Date: Fri, 23 Aug 2019 12:48:47 -0700
Subject: [PATCH] Revert "js: Ease non-animatable actor properties"
This reverts commit fffe7bdf9cde5817736cb5f7fbe777b5c08d122a.
It causes breakage in the overview:
https://bugzilla.redhat.com/show_bug.cgi?id=1740897
---
js/ui/keyboard.js | 27 ++++++-----
js/ui/lightbox.js | 68 +++++++++++++--------------
js/ui/messageList.js | 19 ++++----
js/ui/osdWindow.js | 9 ++--
js/ui/overview.js | 29 +++++-------
js/ui/overviewControls.js | 15 +++---
js/ui/windowManager.js | 37 ++++++++++-----
js/ui/workspaceThumbnail.js | 94 ++++++++++++++++++++-----------------
8 files changed, 160 insertions(+), 138 deletions(-)
diff --git a/js/ui/keyboard.js b/js/ui/keyboard.js
index 462d860c4..1d26e6143 100644
--- a/js/ui/keyboard.js
+++ b/js/ui/keyboard.js
@@ -11,6 +11,7 @@ const Layout = imports.ui.layout;
const Main = imports.ui.main;
const PageIndicators = imports.ui.pageIndicators;
const PopupMenu = imports.ui.popupMenu;
+const Tweener = imports.ui.tweener;
var KEYBOARD_REST_TIME = Layout.KEYBOARD_ANIMATION_TIME * 2;
var KEY_LONG_PRESS_TIME = 250;
@@ -711,13 +712,15 @@ var EmojiPager = GObject.registerClass({
let relDelta = Math.abs(this._delta - value) / this._width;
let time = PANEL_SWITCH_ANIMATION_TIME * Math.abs(relDelta);
- this.remove_all_transitions();
- this.ease_property('delta', value, {
- duration: time,
- onComplete: () => {
- this.setCurrentPage(this.getFollowingPage());
- }
- });
+ Tweener.removeTweens(this);
+ Tweener.addTween(this,
+ { delta: value,
+ time: time / 1000,
+ transition: 'easeInOutQuad',
+ onComplete() {
+ this.setCurrentPage(this.getFollowingPage());
+ }
+ });
}
}
@@ -725,10 +728,12 @@ var EmojiPager = GObject.registerClass({
let relDelta = Math.abs(this._delta) / this.width;
let time = PANEL_SWITCH_ANIMATION_TIME * Math.abs(relDelta);
- this.remove_all_transitions();
- this.ease_property('delta', 0, {
- duration: time,
- });
+ Tweener.removeTweens(this);
+ Tweener.addTween(this,
+ { delta: 0,
+ time: time / 1000,
+ transition: 'easeInOutQuad',
+ });
}
_initPagingInfo() {
diff --git a/js/ui/lightbox.js b/js/ui/lightbox.js
index fbbc01168..0f2578154 100644
--- a/js/ui/lightbox.js
+++ b/js/ui/lightbox.js
@@ -5,6 +5,7 @@ const { Clutter, GObject, Shell, St } = imports.gi;
const Signals = imports.signals;
const Params = imports.misc.params;
+const Tweener = imports.ui.tweener;
var DEFAULT_FADE_FACTOR = 0.4;
var VIGNETTE_BRIGHTNESS = 0.2;
@@ -174,31 +175,29 @@ var Lightbox = class Lightbox {
show(fadeInTime) {
fadeInTime = fadeInTime || 0;
- this.actor.remove_all_transitions();
-
- let onComplete = () => {
- this.shown = true;
- this.emit('shown');
- };
-
if (this._radialEffect) {
- this.actor.ease_property(
- '@effects.radial.brightness', VIGNETTE_BRIGHTNESS, {
- duration: fadeInTime,
- mode: Clutter.AnimationMode.EASE_OUT_QUAD
- });
- this.actor.ease_property(
- '@effects.radial.sharpness', VIGNETTE_SHARPNESS, {
- duration: fadeInTime,
- mode: Clutter.AnimationMode.EASE_OUT_QUAD,
- onComplete
- });
+ let effect = this.actor.get_effect('radial');
+ Tweener.removeTweens(effect);
+ Tweener.addTween(effect,
+ { brightness: VIGNETTE_BRIGHTNESS,
+ sharpness: VIGNETTE_SHARPNESS,
+ time: fadeInTime / 1000,
+ transition: 'easeOutQuad',
+ onComplete: () => {
+ this.shown = true;
+ this.emit('shown');
+ }
+ });
} else {
+ this.actor.remove_all_transitions();
this.actor.ease({
opacity: 255 * this._fadeFactor,
duration: fadeInTime,
mode: Clutter.AnimationMode.EASE_OUT_QUAD,
- onComplete
+ onComplete: () => {
+ this.shown = true;
+ this.emit('shown');
+ }
});
}
@@ -209,28 +208,29 @@ var Lightbox = class Lightbox {
fadeOutTime = fadeOutTime || 0;
this.shown = false;
- this.actor.remove_all_transitions();
-
- let onComplete = () => this.actor.hide();
if (this._radialEffect) {
- this.actor.ease_property(
- '@effects.radial.brightness', 1.0, {
- duration: fadeOutTime,
- mode: Clutter.AnimationMode.EASE_OUT_QUAD
- });
- this.actor.ease_property(
- '@effects.radial.sharpness', 0.0, {
- duration: fadeOutTime,
- mode: Clutter.AnimationMode.EASE_OUT_QUAD,
- onComplete
- });
+ let effect = this.actor.get_effect('radial');
+ Tweener.removeTweens(effect);
+ Tweener.addTween(effect,
+ { brightness: 1.0,
+ sharpness: 0.0,
+ opacity: 0,
+ time: fadeOutTime / 1000,
+ transition: 'easeOutQuad',
+ onComplete: () => {
+ this.actor.hide();
+ }
+ });
} else {
+ this.actor.remove_all_transitions();
this.actor.ease({
opacity: 0,
duration: fadeOutTime,
mode: Clutter.AnimationMode.EASE_OUT_QUAD,
- onComplete
+ onComplete: () => {
+ this.actor.hide();
+ }
});
}
}
diff --git a/js/ui/messageList.js b/js/ui/messageList.js
index 4dcdb6d7f..8fbd79a84 100644
--- a/js/ui/messageList.js
+++ b/js/ui/messageList.js
@@ -4,6 +4,7 @@ const MessageTray = imports.ui.messageTray;
const Signals = imports.signals;
const Calendar = imports.ui.calendar;
+const Tweener = imports.ui.tweener;
const Util = imports.misc.util;
var MESSAGE_ANIMATION_TIME = 100;
@@ -439,11 +440,10 @@ var Message = class Message {
}
if (animate) {
- this._bodyStack.ease_property('@layout.expansion', 1, {
- progress_mode: Clutter.AnimationMode.EASE_OUT_QUAD,
- duration: MessageTray.ANIMATION_TIME,
- });
-
+ Tweener.addTween(this._bodyStack.layout_manager,
+ { expansion: 1,
+ time: MessageTray.ANIMATION_TIME / 1000,
+ transition: 'easeOutQuad' });
this._actionBin.scale_y = 0;
this._actionBin.ease({
scale_y: 1,
@@ -460,11 +460,10 @@ var Message = class Message {
unexpand(animate) {
if (animate) {
- this._bodyStack.ease_property('@layout.expansion', 0, {
- progress_mode: Clutter.AnimationMode.EASE_OUT_QUAD,
- duration: MessageTray.ANIMATION_TIME,
- });
-
+ Tweener.addTween(this._bodyStack.layout_manager,
+ { expansion: 0,
+ time: MessageTray.ANIMATION_TIME / 1000,
+ transition: 'easeOutQuad' });
this._actionBin.ease({
scale_y: 0,
duration: MessageTray.ANIMATION_TIME,
diff --git a/js/ui/osdWindow.js b/js/ui/osdWindow.js
index 0f85dce38..cdcd36a18 100644
--- a/js/ui/osdWindow.js
+++ b/js/ui/osdWindow.js
@@ -7,6 +7,7 @@ const Mainloop = imports.mainloop;
const BarLevel = imports.ui.barLevel;
const Layout = imports.ui.layout;
const Main = imports.ui.main;
+const Tweener = imports.ui.tweener;
var HIDE_TIMEOUT = 1500;
var FADE_TIME = 100;
@@ -112,10 +113,10 @@ var OsdWindow = class {
this._level.visible = (value != undefined);
if (value != undefined) {
if (this.actor.visible)
- this._level.ease_property('value', value, {
- mode: Clutter.AnimationMode.EASE_OUT_QUAD,
- duration: LEVEL_ANIMATION_TIME
- });
+ Tweener.addTween(this._level,
+ { value: value,
+ time: LEVEL_ANIMATION_TIME / 1000,
+ transition: 'easeOutQuad' });
else
this._level.value = value;
}
diff --git a/js/ui/overview.js b/js/ui/overview.js
index 1325eff6b..57dcca278 100644
--- a/js/ui/overview.js
+++ b/js/ui/overview.js
@@ -13,6 +13,7 @@ const Main = imports.ui.main;
const MessageTray = imports.ui.messageTray;
const OverviewControls = imports.ui.overviewControls;
const Params = imports.misc.params;
+const Tweener = imports.ui.tweener;
const WorkspaceThumbnail = imports.ui.workspaceThumbnail;
// Time for initial animation going into Overview mode
@@ -173,28 +174,24 @@ var Overview = class {
_unshadeBackgrounds() {
let backgrounds = this._backgroundGroup.get_children();
for (let i = 0; i < backgrounds.length; i++) {
- backgrounds[i].ease_property('brightness', 1.0, {
- duration: SHADE_ANIMATION_TIME,
- mode: Clutter.AnimationMode.EASE_OUT_QUAD
- });
- backgrounds[i].ease_property('vignette-sharpness', 0.0, {
- duration: SHADE_ANIMATION_TIME,
- mode: Clutter.AnimationMode.EASE_OUT_QUAD
- });
+ Tweener.addTween(backgrounds[i],
+ { brightness: 1.0,
+ vignette_sharpness: 0.0,
+ time: SHADE_ANIMATION_TIME / 1000,
+ transition: 'easeOutQuad'
+ });
}
}
_shadeBackgrounds() {
let backgrounds = this._backgroundGroup.get_children();
for (let i = 0; i < backgrounds.length; i++) {
- backgrounds[i].ease_property('brightness', Lightbox.VIGNETTE_BRIGHTNESS, {
- duration: SHADE_ANIMATION_TIME,
- mode: Clutter.AnimationMode.EASE_OUT_QUAD
- });
- backgrounds[i].ease_property('vignette-sharpness', Lightbox.VIGNETTE_SHARPNESS, {
- duration: SHADE_ANIMATION_TIME,
- mode: Clutter.AnimationMode.EASE_OUT_QUAD
- });
+ Tweener.addTween(backgrounds[i],
+ { brightness: Lightbox.VIGNETTE_BRIGHTNESS,
+ vignette_sharpness: Lightbox.VIGNETTE_SHARPNESS,
+ time: SHADE_ANIMATION_TIME / 1000,
+ transition: 'easeOutQuad'
+ });
}
}
diff --git a/js/ui/overviewControls.js b/js/ui/overviewControls.js
index cf24a5e56..761c69f44 100644
--- a/js/ui/overviewControls.js
+++ b/js/ui/overviewControls.js
@@ -6,6 +6,7 @@ const { Clutter, GObject, Meta, St } = imports.gi;
const Dash = imports.ui.dash;
const Main = imports.ui.main;
const Params = imports.misc.params;
+const Tweener = imports.ui.tweener;
const ViewSelector = imports.ui.viewSelector;
const WorkspaceThumbnail = imports.ui.workspaceThumbnail;
@@ -146,10 +147,9 @@ var SlidingControl = class {
}
_updateSlide() {
- this.actor.ease_property('@layout.slide-x', this._getSlide(), {
- mode: Clutter.AnimationMode.EASE_OUT_QUAD,
- duration: SIDE_CONTROLS_ANIMATION_TIME,
- });
+ Tweener.addTween(this.layout, { slide_x: this._getSlide(),
+ time: SIDE_CONTROLS_ANIMATION_TIME / 1000,
+ transition: 'easeOutQuad' });
}
getVisibleWidth() {
@@ -185,10 +185,9 @@ var SlidingControl = class {
return;
this.layout.translation_x = translationStart;
- this.actor.ease_property('@layout.translation-x', translationEnd, {
- mode: Clutter.AnimationMode.EASE_OUT_QUAD,
- duration: SIDE_CONTROLS_ANIMATION_TIME,
- });
+ Tweener.addTween(this.layout, { translation_x: translationEnd,
+ time: SIDE_CONTROLS_ANIMATION_TIME / 1000,
+ transition: 'easeOutQuad' });
}
_onOverviewHiding() {
diff --git a/js/ui/windowManager.js b/js/ui/windowManager.js
index 346485ffd..b8200c996 100644
--- a/js/ui/windowManager.js
+++ b/js/ui/windowManager.js
@@ -12,6 +12,7 @@ const WorkspaceSwitcherPopup = imports.ui.workspaceSwitcherPopup;
const InhibitShortcutsDialog = imports.ui.inhibitShortcutsDialog;
const Main = imports.ui.main;
const ModalDialog = imports.ui.modalDialog;
+const Tweener = imports.ui.tweener;
const WindowMenu = imports.ui.windowMenu;
const PadOsd = imports.ui.padOsd;
const EdgeDragAction = imports.ui.edgeDragAction;
@@ -117,18 +118,17 @@ class DisplayChangeDialog extends ModalDialog.ModalDialog {
var WindowDimmer = class {
constructor(actor) {
this._brightnessEffect = new Clutter.BrightnessContrastEffect({
- name: 'dim',
enabled: false
});
actor.add_effect(this._brightnessEffect);
this.actor = actor;
this._enabled = true;
+ this._dimFactor = 0.0;
}
_syncEnabled() {
- let animating = this.actor.get_transition('@effects.dim.brightness') != null;
let dimmed = this._brightnessEffect.brightness.red != 127;
- this._brightnessEffect.enabled = this._enabled && (animating || dimmed);
+ this._brightnessEffect.enabled = (this._enabled && dimmed);
}
setEnabled(enabled) {
@@ -137,16 +137,27 @@ var WindowDimmer = class {
}
setDimmed(dimmed, animate) {
- let val = 127 * (1 + (dimmed ? 1 : 0) * DIM_BRIGHTNESS);
- let color = Clutter.Color.new(val, val, val, 255);
-
- this.actor.ease_property('@effects.dim.brightness', color, {
- mode: Clutter.AnimationMode.LINEAR,
- duration: (dimmed ? DIM_TIME : UNDIM_TIME) * (animate ? 1 : 0),
- onComplete: () => this._syncEnabled()
- });
-
- this._syncEnabled();
+ let factor = dimmed ? 1.0 : 0.0;
+
+ if (animate) {
+ Tweener.addTween(this, {
+ _dimFactor: factor,
+ time: (dimmed ? DIM_TIME : UNDIM_TIME) / 1000,
+ transition: 'linear',
+ onUpdate: () => {
+ let val = 127 * (1 + this._dimFactor * DIM_BRIGHTNESS);
+ let color = Clutter.Color.new(val, val, val, 255);
+ this._brightnessEffect.brightness = color;
+ this._syncEnabled();
+ }
+ });
+ } else {
+ this._dimFactor = factor;
+ let val = 127 * (1 + this._dimFactor * DIM_BRIGHTNESS);
+ let color = Clutter.Color.new(val, val, val, 255);
+ this._brightnessEffect.brightness = color;
+ this._syncEnabled();
+ }
}
};
diff --git a/js/ui/workspaceThumbnail.js b/js/ui/workspaceThumbnail.js
index c516934c9..989f088d7 100644
--- a/js/ui/workspaceThumbnail.js
+++ b/js/ui/workspaceThumbnail.js
@@ -8,6 +8,7 @@ const Signals = imports.signals;
const Background = imports.ui.background;
const DND = imports.ui.dnd;
const Main = imports.ui.main;
+const Tweener = imports.ui.tweener;
const Workspace = imports.ui.workspace;
const WorkspacesView = imports.ui.workspacesView;
@@ -1071,6 +1072,15 @@ var ThumbnailsBox = GObject.registerClass({
}
}
+ _tweenScale() {
+ Tweener.addTween(this,
+ { scale: this._targetScale,
+ time: RESCALE_ANIMATION_TIME / 1000,
+ transition: 'easeOutQuad',
+ onComplete: this._queueUpdateStates,
+ onCompleteScope: this });
+ }
+
_updateStates() {
this._stateUpdateQueued = false;
@@ -1082,14 +1092,15 @@ var ThumbnailsBox = GObject.registerClass({
this._iterateStateThumbnails(ThumbnailState.REMOVING, thumbnail => {
this._setThumbnailState(thumbnail, ThumbnailState.ANIMATING_OUT);
- thumbnail.ease_property('slide-position', 1, {
- duration: SLIDE_ANIMATION_TIME,
- mode: Clutter.AnimationMode.LINEAR,
- onComplete: () => {
- this._setThumbnailState(thumbnail, ThumbnailState.ANIMATED_OUT);
- this._queueUpdateStates();
- }
- });
+ Tweener.addTween(thumbnail,
+ { slide_position: 1,
+ time: SLIDE_ANIMATION_TIME / 1000,
+ transition: 'linear',
+ onComplete: () => {
+ this._setThumbnailState(thumbnail, ThumbnailState.ANIMATED_OUT);
+ this._queueUpdateStates();
+ }
+ });
});
// As long as things are sliding out, don't proceed
@@ -1099,28 +1110,25 @@ var ThumbnailsBox = GObject.registerClass({
// Once that's complete, we can start scaling to the new size and collapse any removed thumbnails
this._iterateStateThumbnails(ThumbnailState.ANIMATED_OUT, thumbnail => {
this._setThumbnailState(thumbnail, ThumbnailState.COLLAPSING);
- thumbnail.ease_property('collapse-fraction', 1, {
- duration: RESCALE_ANIMATION_TIME,
- mode: Clutter.AnimationMode.EASE_OUT_QUAD,
- onComplete: () => {
- this._stateCounts[thumbnail.state]--;
- thumbnail.state = ThumbnailState.DESTROYED;
-
- let index = this._thumbnails.indexOf(thumbnail);
- this._thumbnails.splice(index, 1);
- thumbnail.destroy();
-
- this._queueUpdateStates();
- }
- });
+ Tweener.addTween(thumbnail,
+ { collapse_fraction: 1,
+ time: RESCALE_ANIMATION_TIME / 1000,
+ transition: 'easeOutQuad',
+ onComplete: () => {
+ this._stateCounts[thumbnail.state]--;
+ thumbnail.state = ThumbnailState.DESTROYED;
+
+ let index = this._thumbnails.indexOf(thumbnail);
+ this._thumbnails.splice(index, 1);
+ thumbnail.destroy();
+
+ this._queueUpdateStates();
+ }
+ });
});
if (this._pendingScaleUpdate) {
- this.ease_property('scale', this._targetScale, {
- mode: Clutter.AnimationMode.EASE_OUT_QUAD,
- duration: RESCALE_ANIMATION_TIME,
- onComplete: () => this._queueUpdateStates()
- });
+ this._tweenScale();
this._pendingScaleUpdate = false;
}
@@ -1131,13 +1139,14 @@ var ThumbnailsBox = GObject.registerClass({
// And then slide in any new thumbnails
this._iterateStateThumbnails(ThumbnailState.NEW, thumbnail => {
this._setThumbnailState(thumbnail, ThumbnailState.ANIMATING_IN);
- thumbnail.ease_property('slide-position', 0, {
- duration: SLIDE_ANIMATION_TIME,
- mode: Clutter.AnimationMode.EASE_OUT_QUAD,
- onComplete: () => {
- this._setThumbnailState(thumbnail, ThumbnailState.NORMAL);
- }
- });
+ Tweener.addTween(thumbnail,
+ { slide_position: 0,
+ time: SLIDE_ANIMATION_TIME / 1000,
+ transition: 'easeOutQuad',
+ onComplete: () => {
+ this._setThumbnailState(thumbnail, ThumbnailState.NORMAL);
+ }
+ });
});
}
@@ -1354,13 +1363,14 @@ var ThumbnailsBox = GObject.registerClass({
let indicatorThemeNode = this._indicator.get_theme_node();
let indicatorTopFullBorder = indicatorThemeNode.get_padding(St.Side.TOP) + indicatorThemeNode.get_border_width(St.Side.TOP);
this.indicator_y = this._indicator.allocation.y1 + indicatorTopFullBorder;
- this.ease_property('indicator-y', thumbnail.allocation.y1, {
- progress_mode: Clutter.AnimationMode.EASE_OUT_QUAD,
- duration: WorkspacesView.WORKSPACE_SWITCH_TIME,
- onComplete: () => {
- this._animatingIndicator = false;
- this._queueUpdateStates();
- }
- });
+ Tweener.addTween(this,
+ { indicator_y: thumbnail.allocation.y1,
+ time: WorkspacesView.WORKSPACE_SWITCH_TIME / 1000,
+ transition: 'easeOutQuad',
+ onComplete: () => {
+ this._animatingIndicator = false;
+ this._queueUpdateStates();
+ }
+ });
}
});
--
2.23.0