janishutz-legacy/impress.js
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perspective and transition duration added to config

Browse Source
This commit is contained in:
Bartek Szopka
2012-03-08 22:56:13 +01:00
parent 5ff03982a1
commit 2131784fea
1 changed files with 18 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
js/impress.js
View File

@@ -123,7 +123,11 @@
width: 1024, width: 1024,
height: 768, height: 768,
maxScale: 1, maxScale: 1,
minScale: 0 minScale: 0,
perspective: 1000,
transitionDuration: 1000,
}; };
var impress = window.impress = function ( rootId ) { var impress = window.impress = function ( rootId ) {
@@ -162,7 +166,11 @@
width: toNumber(rootData.width, defaults.width), width: toNumber(rootData.width, defaults.width),
height: toNumber(rootData.height, defaults.height), height: toNumber(rootData.height, defaults.height),
maxScale: toNumber(rootData.maxScale, defaults.maxScale), maxScale: toNumber(rootData.maxScale, defaults.maxScale),
minScale: toNumber(rootData.minScale, defaults.minScale) minScale: toNumber(rootData.minScale, defaults.minScale),
perspective: toNumber(rootData.perspective, defaults.perspective),
transitionDuration: toNumber(rootData.transitionDuration, defaults.transitionDuration),
} }
var canvas = document.createElement("div"); var canvas = document.createElement("div");
@@ -196,7 +204,7 @@
css(root, { css(root, {
top: "50%", top: "50%",
left: "50%", left: "50%",
transform: perspective(1000) transform: perspective( config.perspective )
}); });
css(canvas, props); css(canvas, props);
@@ -301,7 +309,7 @@
window.clearTimeout( hashTimeout ); window.clearTimeout( hashTimeout );
hashTimeout = window.setTimeout(function () { hashTimeout = window.setTimeout(function () {
window.location.hash = "#/" + el.id; window.location.hash = "#/" + el.id;
}, 1000); }, config.transitionDuration);
var target = { var target = {
rotate: { rotate: {
@@ -322,7 +330,8 @@
// if presentation starts (nothing is active yet) // if presentation starts (nothing is active yet)
// don't animate (set duration to 0) // don't animate (set duration to 0)
var duration = (active) ? "1s" : "0"; var duration = (active) ? config.transitionDuration + "ms" : "0ms",
delay = (config.transitionDuration / 2) + "ms";
if (force) { if (force) {
windowScale = computeWindowScale(); windowScale = computeWindowScale();
@@ -331,15 +340,16 @@
css(root, { css(root, {
// to keep the perspective look similar for different scales // to keep the perspective look similar for different scales
// we need to 'scale' the perspective, too // we need to 'scale' the perspective, too
transform: perspective( 1000 / (target.scale * windowScale) ) + scale(target.scale * windowScale), transform: perspective( config.perspective / (target.scale * windowScale) )
+ scale(target.scale * windowScale),
transitionDuration: duration, transitionDuration: duration,
transitionDelay: (zoomin ? "500ms" : "0ms") transitionDelay: (zoomin ? delay : "0ms")
}); });
css(canvas, { css(canvas, {
transform: rotate(target.rotate, true) + translate(target.translate), transform: rotate(target.rotate, true) + translate(target.translate),
transitionDuration: duration, transitionDuration: duration,
transitionDelay: (zoomin ? "0ms" : "500ms") transitionDelay: (zoomin ? "0ms" : delay)
}); });
current = target; current = target;