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

js: Ease non-animatable actor properties

Browse Source 
Properties that aren't marked as animatable don't support *implicit*
animations, but they can still be animated with explicit transitions.
Use the newly added convenience method to cut down further on Tweener
usage.

https://gitlab.gnome.org/GNOME/gnome-shell/merge_requests/666
This commit is contained in:
Florian Müllner
2019-07-25 02:06:05 +02:00
parent ef18f621ac
commit fffe7bdf9c
8 changed files with 135 additions and 157 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
js/ui/lightbox.js
View File

@ -5,7 +5,6 @@ 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;
@ -175,29 +174,31 @@ 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) {
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');
}
});
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
});
} else {
this.actor.remove_all_transitions();
this.actor.ease({
opacity: 255 * this._fadeFactor,
duration: fadeInTime,
mode: Clutter.AnimationMode.EASE_OUT_QUAD,
onComplete: () => {
this.shown = true;
this.emit('shown');
}
onComplete
});
}
@ -208,29 +209,28 @@ var Lightbox = class Lightbox {
fadeOutTime = fadeOutTime || 0;
this.shown = false;
this.actor.remove_all_transitions();
let onComplete = () => this.actor.hide();
if (this._radialEffect) {
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();
}
});
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
});
} else {
this.actor.remove_all_transitions();
this.actor.ease({
opacity: 0,
duration: fadeOutTime,
mode: Clutter.AnimationMode.EASE_OUT_QUAD,
onComplete: () => {
this.actor.hide();
}
onComplete
});
}
}