From b0c5644b475a09704ea010025b491fd9211122c3 Mon Sep 17 00:00:00 2001 From: Bartek Szopka Date: Wed, 14 Mar 2012 22:53:17 +0000 Subject: [PATCH] "`goto` now accepts duration parameter" --- README.md | 3 +++ index.html | 5 +++-- js/impress.js | 27 +++++++++++++++------------ 3 files changed, 21 insertions(+), 14 deletions(-) diff --git a/README.md b/README.md index 060bfd610..040c7bd0a 100644 --- a/README.md +++ b/README.md @@ -45,6 +45,9 @@ VERSION HISTORY - you can give it a number of step you want to go to: `impress().goto(7)` - or its id: `impress().goto("the-best-slide-ever")` - of course DOM element is still acceptable: `impress().goto( document.getElementById("overview") )` +* and if it's not enough, `goto()` also accepts second parameter to define the transition duration in ms, for example + `impress().goto("make-it-quick", 300)` or `impress().goto("now", 0)` + ### 0.4.1 ([browse](http://github.com/bartaz/impress.js/tree/0.4.1), [zip](http://github.com/bartaz/impress.js/zipball/0.4.1), [tar](http://github.com/bartaz/impress.js/tarball/0.4.1)) diff --git a/index.html b/index.html index e81557eba..929d59d1d 100644 --- a/index.html +++ b/index.html @@ -340,8 +340,9 @@

impress.js*

`api.init()` - initializes the presentation, `api.next()` - moves to next step of the presentation, `api.prev()` - moves to previous step of the presentation, - `api.goto( idx | id | element )` - moves the presentation to the step given by its index number, - id or the DOM element. + `api.goto( idx | id | element, [duration] )` - moves the presentation to the step given by its index number + id or the DOM element; second parameter can be used to define duration of the transition in ms, + but it's optional - if not provided default transition duration for the presentation will be used. You can also simply call `impress()` again to get the API, so `impress().next()` is also allowed. Don't worry, it wont initialize the presentation again. diff --git a/js/impress.js b/js/impress.js index e06edbc06..7c1b28983 100644 --- a/js/impress.js +++ b/js/impress.js @@ -365,10 +365,10 @@ return (step && step.id && stepsData["impress-" + step.id]) ? step : null; }; - var goto = function ( el, force ) { + var goto = function ( el, duration ) { - if ( !initialized || !(el = getStep(el)) || (el === activeStep && !force) ) { - // selected element is not defined as step or is already active + if ( !initialized || !(el = getStep(el)) ) { + // presentation not initialized or given element is not a step return false; } @@ -409,12 +409,10 @@ // check if the transition is zooming in or not var zoomin = target.scale >= currentState.scale; - // if presentation starts (nothing is active yet) - // don't animate (set duration to 0) - var duration = (activeStep) ? config.transitionDuration : 0, - delay = (config.transitionDuration / 2); + duration = toNumber(duration, config.transitionDuration); + var delay = (duration / 2); - if (force) { + if (el === activeStep) { windowScale = computeWindowScale(config); } @@ -486,6 +484,8 @@ root.addEventListener("impress-init", function(){ // HASH CHANGE + var lastHash = ""; + // `#/step-id` is used instead of `#step-id` to prevent default browser // scrolling to element in hash // @@ -493,16 +493,19 @@ // causes transtion being laggy // BUG: http://code.google.com/p/chromium/issues/detail?id=62820 root.addEventListener("impress-step-enter", function (event) { - window.location.hash = "#/" + event.target.id; + window.location.hash = lastHash = "#/" + event.target.id; }, false); window.addEventListener("hashchange", function () { - goto( getElementFromUrl() ); + // don't go twice to same element + if (window.location.hash !== lastHash) { + goto( getElementFromUrl() ); + } }, false); // START // by selecting step defined in url or first step of the presentation - goto(getElementFromUrl() || steps[0]); + goto(getElementFromUrl() || steps[0], 0); }, false); body.classList.add("impress-disabled"); @@ -633,7 +636,7 @@ // rescale presentation when window is resized window.addEventListener("resize", throttle(function () { // force going to active step again, to trigger rescaling - api.goto( document.querySelector(".active"), true ); + api.goto( document.querySelector(".active"), 500 ); }, 250), false); }, false);