From 93d9c16672f9dc7a62b3553c99cf6cd12feff176 Mon Sep 17 00:00:00 2001 From: Carlos Soriano Date: Thu, 5 Sep 2013 14:48:03 +0200 Subject: [PATCH] appDisplay: Rework indicators animation Previously the animation was not entirely according to the mockup. Now we are closer to the mockup. The padding for the indicators are decremented, since we need that to make the animation not too quick. As a drawback, maybe visually is not as good as before, or the area to click dots is too much little. Just make that change for now and test it widely, and we can change that after. https://bugzilla.gnome.org/show_bug.cgi?id=707565 --- data/theme/gnome-shell.css | 2 +- js/ui/appDisplay.js | 22 ++++++++++------------ 2 files changed, 11 insertions(+), 13 deletions(-) diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css index 4f738114b..15f91ef87 100644 --- a/data/theme/gnome-shell.css +++ b/data/theme/gnome-shell.css @@ -941,7 +941,7 @@ StScrollBar StButton#vhandle:active { } .page-indicator { - padding: 15px 30px; + padding: 15px 20px; } .page-indicator .page-indicator-icon { diff --git a/js/ui/appDisplay.js b/js/ui/appDisplay.js index 262b46a93..52d7b70ae 100644 --- a/js/ui/appDisplay.js +++ b/js/ui/appDisplay.js @@ -39,12 +39,9 @@ const FOLDER_SUBICON_FRACTION = .4; const MIN_FREQUENT_APPS_COUNT = 3; -const INDICATORS_ANIMATION_TIME = 0.5; -// 100% means indicators wait for be animated until the previous one -// is animated completely. 0% means all animators are animated -// at once without delay -const INDICATORS_ANIMATION_DELAY_PERCENTAGE = 50; - +const INDICATORS_BASE_TIME = 0.25; +const INDICATORS_ANIMATION_DELAY = 0.125; +const INDICATORS_ANIMATION_MAX_TIME = 0.75; // Fraction of page height the finger or mouse must reach // to change page const PAGE_SWITCH_TRESHOLD = 0.2; @@ -230,22 +227,23 @@ const PageIndicators = new Lang.Class({ if (children.length == 0) return; - let timePerChild = INDICATORS_ANIMATION_TIME / this._nPages; - let delay = INDICATORS_ANIMATION_DELAY_PERCENTAGE / 100 * timePerChild; - let offset; if (this.actor.get_text_direction() == Clutter.TextDirection.RTL) offset = -children[0].width; else offset = children[0].width; + let delay = INDICATORS_ANIMATION_DELAY; + let totalAnimationTime = INDICATORS_BASE_TIME + INDICATORS_ANIMATION_DELAY * this._nPages; + if (totalAnimationTime > INDICATORS_ANIMATION_MAX_TIME) + delay -= (totalAnimationTime - INDICATORS_ANIMATION_MAX_TIME) / this._nPages; + for (let i = 0; i < this._nPages; i++) { children[i].translation_x = offset; Tweener.addTween(children[i], { translation_x: 0, - time: timePerChild, - delay: delay * i, - transition: 'easeOutQuad' + time: INDICATORS_BASE_TIME + delay * i, + transition: 'easeInOutQuad' }); } }