Merge pull request #123 from miripiruni/master
Fix for #99: Inner navigation should be also controlled by slide timing
This commit is contained in:
Vadim Makeev
commit
b364f02839
492
shower.js
492
shower.js
|
|
@ -9,9 +9,164 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
body = document.body,
|
||||
slides = [],
|
||||
progress = [],
|
||||
slideList = [],
|
||||
timer,
|
||||
isHistoryApiSupported = !!(window.history && history.pushState);
|
||||
isHistoryApiSupported = !!(window.history && window.history.pushState);
|
||||
|
||||
/**
|
||||
* Slide constructor
|
||||
*
|
||||
* @param {Object} opts
|
||||
* @param {String} opts.id html id attribute or automaticaly assigned order number
|
||||
* @param {Number} opts.number slide number
|
||||
* @param {Boolean} opts.hasInnerNavigation
|
||||
* @param {Number} [opts.timing]
|
||||
* @param {Number} [opts.innerLength]
|
||||
* @param {Number} [opts.innerComplete = 0]
|
||||
* @constructor
|
||||
*/
|
||||
function Slide(opts) {
|
||||
for (var prop in opts) {
|
||||
if (opts.hasOwnProperty(prop)) {
|
||||
this[prop] = opts[prop];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Slide.prototype = {
|
||||
/**
|
||||
* Get slide number.
|
||||
* @returns {Number}
|
||||
*/
|
||||
getSlideNumber : function() {
|
||||
return this.number;
|
||||
},
|
||||
|
||||
isLast : function() {
|
||||
return shower.slideList.length === this.number + 1
|
||||
},
|
||||
|
||||
/**
|
||||
* Check if inner navigation is finished
|
||||
* @returns {boolean}
|
||||
*/
|
||||
isFinished : function() {
|
||||
return this.innerComplete >= this.innerLength;
|
||||
},
|
||||
|
||||
/**
|
||||
* Start inner navigation by timer or just switch slide after timer.
|
||||
* time sets in HTML: .slide[data-timing=MM:SS]
|
||||
* @returns {Object} Current slide
|
||||
*/
|
||||
process : function(shower) {
|
||||
if (this.timing) {
|
||||
this.initTimer(shower);
|
||||
return this;
|
||||
}
|
||||
|
||||
this.next(shower);
|
||||
return this;
|
||||
},
|
||||
|
||||
/**
|
||||
* Init timer for inner navigation or for just turn to next slide
|
||||
* @param shower
|
||||
* @returns {Object|Boolean} Current slide
|
||||
*/
|
||||
initTimer : function(shower) {
|
||||
var slide = this;
|
||||
|
||||
if ( ! slide.timing) {
|
||||
return false;
|
||||
}
|
||||
|
||||
slide.stopTimer();
|
||||
|
||||
if (slide.isFinished()) {
|
||||
timer = setInterval(function() {
|
||||
slide.stopTimer();
|
||||
shower.next();
|
||||
},
|
||||
slide.timing * (slide.innerLength || 1));
|
||||
} else {
|
||||
timer = setInterval(function() {
|
||||
if (slide.isFinished()) {
|
||||
slide.stopTimer();
|
||||
shower.next();
|
||||
} else {
|
||||
slide.next(shower);
|
||||
}
|
||||
},
|
||||
slide.timing);
|
||||
}
|
||||
|
||||
return this;
|
||||
},
|
||||
|
||||
/**
|
||||
* Stop timer
|
||||
*/
|
||||
stopTimer : function() {
|
||||
if (timer) {
|
||||
clearInterval(timer);
|
||||
timer = false;
|
||||
}
|
||||
|
||||
return this;
|
||||
},
|
||||
|
||||
/**
|
||||
* Previous step of inner navigation or if current step is step 0 then go to previous slide.
|
||||
* @returns {Object|Boolean} Current slide
|
||||
*/
|
||||
prev : function(shower) {
|
||||
var prevSteps,
|
||||
slide = this;
|
||||
|
||||
if ( ! slide.hasInnerNavigation || slide.isFinished() || slide.innerComplete === 0) {
|
||||
shower.prev();
|
||||
return false;
|
||||
}
|
||||
|
||||
prevSteps = document.getElementById(slide.id).querySelectorAll('.next.active');
|
||||
|
||||
if ( ! prevSteps || prevSteps.length < 1) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (slide.innerComplete > 0) {
|
||||
slide.innerComplete--;
|
||||
prevSteps[prevSteps.length - 1].classList.remove('active');
|
||||
} else {
|
||||
shower.prev();
|
||||
}
|
||||
|
||||
return this;
|
||||
},
|
||||
|
||||
/**
|
||||
* Next step of inner navigation or if current step is last then go to next slide.
|
||||
* @returns {Object|Boolean} Current slide
|
||||
*/
|
||||
next : function(shower) {
|
||||
var nextSteps,
|
||||
slide = this;
|
||||
|
||||
if ( ! slide.hasInnerNavigation || slide.isFinished()) {
|
||||
shower.next();
|
||||
return false;
|
||||
}
|
||||
|
||||
if ( ! slide.isFinished()) {
|
||||
nextSteps = document.getElementById(slide.id).querySelectorAll('.next:not(.active)');
|
||||
nextSteps[0].classList.add('active');
|
||||
|
||||
slide.innerComplete++;
|
||||
}
|
||||
|
||||
return this;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Get value at named data store for the DOM element.
|
||||
|
|
@ -24,19 +179,23 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
return element.dataset ? element.dataset[name] : element.getAttribute('data-' + name);
|
||||
};
|
||||
|
||||
|
||||
shower.slideList = [];
|
||||
|
||||
/**
|
||||
* Init
|
||||
* @param {String} slideSelector
|
||||
* @param {String} progressBarSelector
|
||||
* Shower initialization
|
||||
* @param {String} [slideSelector]
|
||||
* @param {String} [progressSelector]
|
||||
* @returns {Object} shower
|
||||
*/
|
||||
shower.init = function(slideSelector, progressSelector) {
|
||||
var timing;
|
||||
|
||||
slideSelector = slideSelector || '.slide';
|
||||
progressSelector = progressSelector || 'div.progress div';
|
||||
|
||||
slides = document.querySelectorAll(slideSelector);
|
||||
progress = document.querySelector(progressSelector);
|
||||
slideList = [];
|
||||
|
||||
for (var i = 0; i < slides.length; i++) {
|
||||
// Slide IDs are optional. In case of missing ID we set it to the
|
||||
|
|
@ -45,16 +204,31 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
slides[i].id = i + 1;
|
||||
}
|
||||
|
||||
slideList.push({
|
||||
id: slides[i].id,
|
||||
hasInnerNavigation: null !== slides[i].querySelector('.next'),
|
||||
hasTiming: (shower._getData(slides[i], 'timing') && shower._getData(slides[i], 'timing').indexOf(':') !== -1)
|
||||
});
|
||||
timing = shower._getData(slides[i], 'timing');
|
||||
|
||||
if (timing && timing.indexOf(':') !== -1) {
|
||||
timing = timing.split(':');
|
||||
// Compute number of milliseconds from format "mm:ss"
|
||||
timing = (parseInt(timing[0], 10) * 60 + parseInt(timing[1], 10)) * 1000;
|
||||
|
||||
if (slides[i].querySelector('.next')) {
|
||||
timing = timing / (slides[i].querySelectorAll('.next').length + 1);
|
||||
}
|
||||
}
|
||||
|
||||
shower.slideList.push(new Slide({
|
||||
id : slides[i].id,
|
||||
number : i,
|
||||
hasInnerNavigation : null !== slides[i].querySelector('.next'),
|
||||
timing : parseInt(timing, 10) || undefined,
|
||||
innerLength : slides[i].querySelectorAll('.next').length,
|
||||
innerComplete : 0
|
||||
}));
|
||||
}
|
||||
|
||||
return shower;
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Get slide scale value.
|
||||
* @private
|
||||
|
|
@ -75,11 +249,15 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
* @returns {Boolean}
|
||||
*/
|
||||
shower._applyTransform = function(transform) {
|
||||
body.style.WebkitTransform = transform;
|
||||
body.style.MozTransform = transform;
|
||||
body.style.msTransform = transform;
|
||||
body.style.OTransform = transform;
|
||||
body.style.transform = transform;
|
||||
[
|
||||
'WebkitTransform',
|
||||
'MozTransform',
|
||||
'msTransform',
|
||||
'OTransform',
|
||||
'transform'
|
||||
].forEach(function(prop) {
|
||||
body.style[prop] = transform;
|
||||
});
|
||||
|
||||
return true;
|
||||
};
|
||||
|
|
@ -109,8 +287,8 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
slideNumber = 0;
|
||||
}
|
||||
|
||||
if (slideNumber >= slideList.length) {
|
||||
slideNumber = slideList.length - 1;
|
||||
if (slideNumber >= shower.slideList.length) {
|
||||
slideNumber = shower.slideList.length - 1;
|
||||
}
|
||||
|
||||
return slideNumber;
|
||||
|
|
@ -119,7 +297,7 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
/**
|
||||
* Get slide id from HTML element.
|
||||
* @private
|
||||
* @param {HTMLElement} el
|
||||
* @param {Node} el
|
||||
* @returns {String}
|
||||
*/
|
||||
shower._getSlideIdByEl = function(el) {
|
||||
|
|
@ -137,7 +315,7 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
/**
|
||||
* For touch devices: check if link is clicked.
|
||||
*
|
||||
* @TODO: add support for textareas/inputs/etc.
|
||||
* @TODO: add support for textarea/input/etc.
|
||||
*
|
||||
* @private
|
||||
* @param {HTMLElement} e
|
||||
|
|
@ -148,12 +326,12 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
};
|
||||
|
||||
/**
|
||||
* Get slide number by slideId.
|
||||
* @param {String} slideId (HTML id or position in slideList)
|
||||
* @returns {Number}
|
||||
*/
|
||||
* Get slide number by slideId.
|
||||
* @param {String} slideId
|
||||
* @returns {Number}
|
||||
*/
|
||||
shower.getSlideNumber = function(slideId) {
|
||||
var i = slideList.length - 1,
|
||||
var i = shower.slideList.length - 1,
|
||||
slideNumber;
|
||||
|
||||
if (slideId === '') {
|
||||
|
|
@ -163,7 +341,7 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
// As fast as you can ;-)
|
||||
// http://jsperf.com/for-vs-foreach/46
|
||||
for (; i >= 0; --i) {
|
||||
if (slideId === slideList[i].id) {
|
||||
if (slideId === shower.slideList[i].id) {
|
||||
slideNumber = i;
|
||||
break;
|
||||
}
|
||||
|
|
@ -176,13 +354,19 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
* Go to slide number.
|
||||
* @param {Number} slideNumber slide number (sic!). Attention: starts from zero.
|
||||
* @param {Function} [callback] runs only if you not in List mode.
|
||||
* @returns {Number}
|
||||
* @returns {Number|Boolean}
|
||||
*/
|
||||
shower.go = function(slideNumber, callback) {
|
||||
var slide;
|
||||
|
||||
if ( ! shower._isNumber(slideNumber)) {
|
||||
throw new Error('Gimme slide number as Number, baby!');
|
||||
}
|
||||
|
||||
if ( ! shower.slideList[slideNumber]) {
|
||||
return false;
|
||||
}
|
||||
|
||||
// Also triggers popstate and invoke shower.enter__Mode()
|
||||
url.hash = shower.getSlideHash(slideNumber);
|
||||
|
||||
|
|
@ -191,7 +375,10 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
|
||||
if (shower.isSlideMode()) {
|
||||
shower.showPresenterNotes(slideNumber);
|
||||
shower.runInnerNavigation(slideNumber);
|
||||
slide = shower.slideList[slideNumber];
|
||||
if (slide.timing) {
|
||||
slide.initTimer(shower);
|
||||
}
|
||||
}
|
||||
|
||||
if (typeof(callback) === 'function') {
|
||||
|
|
@ -203,87 +390,125 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
|
||||
/**
|
||||
* Show next slide or show next Inner navigation item.
|
||||
* Returns false on a last slide, otherwise returns shown slide number.
|
||||
* Returns false on a last slide, otherwise returns shower.
|
||||
* @param {Function} [callback] runs only if shower.next() is successfully completed.
|
||||
* @returns {Number|Boolean}
|
||||
* @returns {Boolean}
|
||||
*/
|
||||
shower.next = function(callback) {
|
||||
var currentSlideNumber = shower.getCurrentSlideNumber(),
|
||||
ret = false;
|
||||
nextSlide = shower.slideList[currentSlideNumber + 1];
|
||||
|
||||
// Only go to next slide if current slide have no inner
|
||||
// navigation or inner navigation is fully shown
|
||||
// NOTE: But first of all check if there is no current slide
|
||||
if (
|
||||
(
|
||||
-1 === currentSlideNumber ||
|
||||
! slideList[currentSlideNumber].hasInnerNavigation ||
|
||||
! shower.increaseInnerNavigation(currentSlideNumber)
|
||||
) &&
|
||||
// If exist next slide
|
||||
(currentSlideNumber + 2) <= slideList.length
|
||||
) {
|
||||
shower.go(currentSlideNumber + 1);
|
||||
// Slides starts from 0. So return next slide number.
|
||||
ret = currentSlideNumber + 2;
|
||||
// If don't exist next slide
|
||||
if (! nextSlide) {
|
||||
return false;
|
||||
}
|
||||
|
||||
shower.go(currentSlideNumber + 1);
|
||||
|
||||
if (typeof(callback) === 'function') {
|
||||
callback();
|
||||
}
|
||||
|
||||
return this;
|
||||
};
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {Function} [callback]
|
||||
*/
|
||||
shower._turnNextSlide = function(callback) {
|
||||
var currentSlideNumber = shower.getCurrentSlideNumber(),
|
||||
slide = shower.slideList[currentSlideNumber];
|
||||
|
||||
|
||||
if (shower.isSlideMode()) {
|
||||
shower.runInnerNavigation(currentSlideNumber + 1);
|
||||
slide.stopTimer();
|
||||
slide.next(shower);
|
||||
} else {
|
||||
shower.go(currentSlideNumber + 1);
|
||||
}
|
||||
|
||||
if (typeof(callback) === 'function') {
|
||||
callback();
|
||||
}
|
||||
|
||||
return ret;
|
||||
return;
|
||||
};
|
||||
|
||||
/**
|
||||
* Show previous slide. Returns false on a first slide, otherwise returns shown slide number.
|
||||
* @param {Function} [callback] runs only if shower.previous() is successfully completed.
|
||||
* @returns {Number|Boolean}
|
||||
* @returns {Boolean}
|
||||
*/
|
||||
shower.previous = function(callback) {
|
||||
var currentSlideNumber = shower.getCurrentSlideNumber(),
|
||||
ret = false;
|
||||
shower.prev = shower.previous = function(callback) {
|
||||
var currentSlideNumber = shower.getCurrentSlideNumber();
|
||||
|
||||
// slides starts from 0
|
||||
if (currentSlideNumber > 0) {
|
||||
ret = currentSlideNumber;
|
||||
shower.go(currentSlideNumber - 1);
|
||||
|
||||
if (typeof(callback) === 'function') {
|
||||
callback();
|
||||
}
|
||||
// Slides starts from 0
|
||||
if (currentSlideNumber < 1) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return ret;
|
||||
shower.go(currentSlideNumber - 1);
|
||||
|
||||
if (typeof(callback) === 'function') {
|
||||
callback();
|
||||
}
|
||||
|
||||
return true;
|
||||
};
|
||||
|
||||
/**
|
||||
* Show previous slide. Returns false on a first slide, otherwise returns shown slide number.
|
||||
* @param {Function} [callback] runs only if shower.previous() is successfully completed.
|
||||
* @returns {Boolean}
|
||||
*/
|
||||
shower._turnPreviousSlide = function(callback) {
|
||||
var currentSlideNumber = shower.getCurrentSlideNumber(),
|
||||
slide = shower.slideList[currentSlideNumber];
|
||||
|
||||
slide.stopTimer();
|
||||
|
||||
if (shower.isSlideMode()) {
|
||||
slide.prev(shower);
|
||||
} else {
|
||||
shower.go(currentSlideNumber - 1);
|
||||
}
|
||||
|
||||
if (typeof(callback) === 'function') {
|
||||
callback();
|
||||
}
|
||||
|
||||
return true;
|
||||
};
|
||||
|
||||
/**
|
||||
* Show first slide.
|
||||
* @param {Function} [callback]
|
||||
* @returns {Number}
|
||||
*/
|
||||
shower.first = function(callback) {
|
||||
var slide = shower.slideList[shower.getCurrentSlideNumber()];
|
||||
|
||||
slide.timing && slide.stopTimer();
|
||||
shower.go(0);
|
||||
|
||||
if (typeof(callback) === 'function') {
|
||||
callback();
|
||||
}
|
||||
|
||||
return shower.go(0);
|
||||
};
|
||||
|
||||
/**
|
||||
* Show last slide.
|
||||
* @param {Function} [callback]
|
||||
* @returns {Number}
|
||||
*/
|
||||
shower.last = function(callback) {
|
||||
var slide = shower.slideList[shower.getCurrentSlideNumber()];
|
||||
|
||||
slide.timing && slide.stopTimer();
|
||||
shower.go(shower.slideList.length - 1);
|
||||
|
||||
if (typeof(callback) === 'function') {
|
||||
callback();
|
||||
}
|
||||
return shower.go(slideList.length - 1);
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -318,6 +543,8 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
* @returns {Boolean}
|
||||
*/
|
||||
shower.enterListMode = function(callback) {
|
||||
var currentSlideNumber;
|
||||
|
||||
// Anyway: change body class (@TODO: refactoring)
|
||||
body.classList.remove('full');
|
||||
body.classList.add('list');
|
||||
|
|
@ -328,9 +555,9 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
return false;
|
||||
}
|
||||
|
||||
var currentSlideNumber = shower.getCurrentSlideNumber();
|
||||
currentSlideNumber = shower.getCurrentSlideNumber();
|
||||
|
||||
clearTimeout(timer);
|
||||
shower.slideList[currentSlideNumber].stopTimer();
|
||||
|
||||
if (shower.isSlideMode() && isHistoryApiSupported) {
|
||||
history.pushState(null, null, url.pathname + shower.getSlideHash(currentSlideNumber));
|
||||
|
|
@ -371,13 +598,13 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
* @returns {Number}
|
||||
*/
|
||||
shower.getCurrentSlideNumber = function() {
|
||||
var i = slideList.length - 1,
|
||||
var i = shower.slideList.length - 1,
|
||||
currentSlideId = url.hash.substr(1);
|
||||
|
||||
// As fast as you can ;-)
|
||||
// http://jsperf.com/for-vs-foreach/46
|
||||
for (; i >= 0; --i) {
|
||||
if (currentSlideId === slideList[i].id) {
|
||||
if (currentSlideId === shower.slideList[i].id) {
|
||||
return i;
|
||||
}
|
||||
}
|
||||
|
|
@ -407,8 +634,8 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
return ret;
|
||||
}
|
||||
|
||||
if (slideList[slideNumber]) {
|
||||
currentSlide = document.getElementById(slideList[slideNumber].id);
|
||||
if (shower.slideList[slideNumber]) {
|
||||
currentSlide = document.getElementById(shower.slideList[slideNumber].id);
|
||||
window.scrollTo(0, currentSlide.offsetTop);
|
||||
ret = true;
|
||||
} else {
|
||||
|
|
@ -449,7 +676,7 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
throw new Error('Gimme slide number as Number, baby!');
|
||||
}
|
||||
|
||||
progress.style.width = (100 / (slideList.length - 1) * shower._normalizeSlideNumber(slideNumber)).toFixed(2) + '%';
|
||||
progress.style.width = (100 / (shower.slideList.length - 1) * shower._normalizeSlideNumber(slideNumber)).toFixed(2) + '%';
|
||||
|
||||
return true;
|
||||
};
|
||||
|
|
@ -462,7 +689,7 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
shower.updateActiveAndVisitedSlides = function(slideNumber) {
|
||||
var i,
|
||||
slide,
|
||||
l = slideList.length;
|
||||
l = shower.slideList.length;
|
||||
|
||||
slideNumber = shower._normalizeSlideNumber(slideNumber);
|
||||
|
||||
|
|
@ -471,7 +698,7 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
}
|
||||
|
||||
for (i = 0; i < l; ++i) {
|
||||
slide = document.getElementById(slideList[i].id);
|
||||
slide = document.getElementById(shower.slideList[i].id);
|
||||
|
||||
if (i < slideNumber) {
|
||||
slide.classList.remove('active');
|
||||
|
|
@ -507,8 +734,8 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
if (window.console) {
|
||||
slideNumber = shower._normalizeSlideNumber(slideNumber);
|
||||
|
||||
var slideId = slideList[slideNumber].id,
|
||||
nextSlideId = slideList[slideNumber + 1] ? slideList[slideNumber + 1].id : null,
|
||||
var slideId = shower.slideList[slideNumber].id,
|
||||
nextSlideId = shower.slideList[slideNumber + 1] ? shower.slideList[slideNumber + 1].id : null,
|
||||
notes = document.getElementById(slideId).querySelector('footer');
|
||||
|
||||
if (notes && notes.innerHTML) {
|
||||
|
|
@ -539,63 +766,7 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
|
||||
slideNumber = shower._normalizeSlideNumber(slideNumber);
|
||||
|
||||
return '#' + slideList[slideNumber].id;
|
||||
};
|
||||
|
||||
/**
|
||||
* Run slide show if presented.
|
||||
* @param {Number} slideNumber
|
||||
* @returns {Boolean}
|
||||
*/
|
||||
shower.runInnerNavigation = function(slideNumber) {
|
||||
if ( ! shower._isNumber(slideNumber)) {
|
||||
throw new Error('Gimme slide number as Number, baby!');
|
||||
}
|
||||
|
||||
slideNumber = shower._normalizeSlideNumber(slideNumber);
|
||||
|
||||
clearTimeout(timer);
|
||||
|
||||
if (slideList[slideNumber].hasTiming) {
|
||||
// Compute number of milliseconds from format "X:Y", where X is
|
||||
// number of minutes, and Y is number of seconds
|
||||
var timing = shower._getData(document.getElementById(slideList[slideNumber].id), 'timing').split(':');
|
||||
timing = parseInt(timing[0], 10) * 60 * 1000 + parseInt(timing[1], 10) * 1000;
|
||||
|
||||
timer = setTimeout(function() {
|
||||
shower.next();
|
||||
},
|
||||
timing);
|
||||
}
|
||||
|
||||
return true;
|
||||
};
|
||||
|
||||
/**
|
||||
* Increases inner navigation by adding 'active' class to next inactive inner navigation item
|
||||
* @param {Number} slideNumber
|
||||
* @returns {Boolean}
|
||||
*/
|
||||
shower.increaseInnerNavigation = function(slideNumber) {
|
||||
var nextNodes,
|
||||
node;
|
||||
|
||||
if ( ! shower._isNumber(slideNumber)) {
|
||||
throw new Error('Gimme slide number as Number, baby!');
|
||||
}
|
||||
|
||||
// If inner navigation in this slide
|
||||
if (slideList[slideNumber].hasInnerNavigation) {
|
||||
nextNodes = document.getElementById(slideList[slideNumber].id).querySelectorAll('.next:not(.active)');
|
||||
|
||||
if (0 !== nextNodes.length) {
|
||||
node = nextNodes[0];
|
||||
node.classList.add('active');
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
return '#' + shower.slideList[slideNumber].id;
|
||||
};
|
||||
|
||||
// Event handlers
|
||||
|
|
@ -622,24 +793,31 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
}, false);
|
||||
|
||||
document.addEventListener('keydown', function(e) {
|
||||
var currentSlideNumber,
|
||||
slide;
|
||||
|
||||
// Shortcut for alt, ctrl and meta keys
|
||||
if (e.altKey || e.ctrlKey || e.metaKey) { return; }
|
||||
|
||||
var currentSlideNumber = shower.getCurrentSlideNumber(),
|
||||
isInnerNavCompleted = true;
|
||||
currentSlideNumber = shower.getCurrentSlideNumber();
|
||||
slide = shower.slideList[currentSlideNumber];
|
||||
|
||||
switch (e.which) {
|
||||
case 116: // F5
|
||||
e.preventDefault();
|
||||
|
||||
if (shower.isListMode()) {
|
||||
var slideNumber = e.shiftKey ? currentSlideNumber : 0;
|
||||
var slideNumber = e.shiftKey ? currentSlideNumber : 0,
|
||||
slide;
|
||||
|
||||
// Warning: go must be before enterSlideMode.
|
||||
// Otherwise there is a bug in Chrome
|
||||
shower.go(slideNumber);
|
||||
shower.enterSlideMode();
|
||||
shower.showPresenterNotes(slideNumber);
|
||||
|
||||
slide = shower.slideList[currentSlideNumber];
|
||||
slide.timing && slide.initTimer(shower);
|
||||
} else {
|
||||
shower.enterListMode();
|
||||
}
|
||||
|
|
@ -650,7 +828,10 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
e.preventDefault();
|
||||
shower.enterSlideMode();
|
||||
shower.showPresenterNotes(currentSlideNumber);
|
||||
shower.runInnerNavigation(currentSlideNumber);
|
||||
|
||||
if (slide.timing) {
|
||||
slide.initTimer(shower);
|
||||
}
|
||||
}
|
||||
break;
|
||||
|
||||
|
|
@ -667,7 +848,7 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
case 72: // H
|
||||
case 75: // K
|
||||
e.preventDefault();
|
||||
shower.previous();
|
||||
shower._turnPreviousSlide();
|
||||
break;
|
||||
|
||||
case 34: // PgDown
|
||||
|
|
@ -676,7 +857,7 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
case 76: // L
|
||||
case 74: // J
|
||||
e.preventDefault();
|
||||
shower.next();
|
||||
shower._turnNextSlide();
|
||||
break;
|
||||
|
||||
case 36: // Home
|
||||
|
|
@ -686,13 +867,14 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
|
||||
case 35: // End
|
||||
e.preventDefault();
|
||||
|
||||
shower.last();
|
||||
break;
|
||||
|
||||
case 9: // Tab = +1; Shift + Tab = -1
|
||||
case 32: // Space = +1; Shift + Space = -1
|
||||
e.preventDefault();
|
||||
shower[e.shiftKey ? 'previous' : 'next']();
|
||||
shower[e.shiftKey ? '_turnPreviousSlide' : '_turnNextSlide']();
|
||||
break;
|
||||
|
||||
default:
|
||||
|
|
@ -703,7 +885,8 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
shower.init();
|
||||
|
||||
document.addEventListener('click', function(e) {
|
||||
var slideNumber = shower.getSlideNumber(shower._getSlideIdByEl(e.target));
|
||||
var slideNumber = shower.getSlideNumber(shower._getSlideIdByEl(e.target)),
|
||||
slide;
|
||||
|
||||
// Click on slide in List mode
|
||||
if (shower.isListMode() && shower._getSlideIdByEl(e.target)) {
|
||||
|
|
@ -712,24 +895,41 @@ window.shower = window.shower || (function(window, document, undefined) {
|
|||
shower.go(slideNumber);
|
||||
shower.enterSlideMode();
|
||||
shower.showPresenterNotes(slideNumber);
|
||||
|
||||
slide = shower.slideList[slideNumber];
|
||||
if (slide.timing) {
|
||||
slide.initTimer(shower);
|
||||
}
|
||||
}
|
||||
}, false);
|
||||
|
||||
document.addEventListener('touchstart', function(e) {
|
||||
var slideNumber = shower.getSlideNumber(shower._getSlideIdByEl(e.target)),
|
||||
slide,
|
||||
x;
|
||||
|
||||
if (shower._getSlideIdByEl(e.target)) {
|
||||
if (shower.isSlideMode() && ! shower._checkInteractiveElement(e)) {
|
||||
var x = e.touches[0].pageX;
|
||||
x = e.touches[0].pageX;
|
||||
|
||||
if (x > window.innerWidth / 2) {
|
||||
shower.next();
|
||||
shower._turnNextSlide();
|
||||
} else {
|
||||
shower.previous();
|
||||
shower._turnPreviousSlide();
|
||||
}
|
||||
}
|
||||
|
||||
if (shower.isListMode()) {
|
||||
// Warning: go must be before enterSlideMode.
|
||||
// Otherwise there is a bug in Chrome
|
||||
shower.go(shower.getSlideNumber(shower._getSlideIdByEl(e.target)));
|
||||
shower.enterSlideMode();
|
||||
shower.showPresenterNotes(slideNumber);
|
||||
|
||||
slide = shower.slideList[slideNumber];
|
||||
if (slide.timing) {
|
||||
slide.initTimer(shower);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue