ivan-igorevich
/
bmstu-mt-wp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #107 from miripiruni/master 

Little clean-up
This commit is contained in:
Vadim Makeev 2013-01-19 13:17:03 -08:00
parent 554c9f7787 f36d547070
commit 3829b27005
1 changed files with 136 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

253
shower.js
View File

@ -1,7 +1,8 @@
// Shower HTML presentation engine: github.com/shower/shower /**
// Copyright © 2010–2013 Vadim Makeev, pepelsbey.net * Shower HTML presentation engine: github.com/shower/shower
// Licensed under MIT license: github.com/shower/shower/wiki/MIT-License * @copyright 2010–2013 Vadim Makeev, pepelsbey.net
* @license MIT license: github.com/shower/shower/wiki/MIT-License
*/
window.shower = (function(window, document, undefined) { window.shower = (function(window, document, undefined) {
var shower = {}, var shower = {},
url = window.location, url = window.location,
@ -25,7 +26,7 @@ window.shower = (function(window, document, undefined) {
}; };
for (i = 0; i < l; i++) { for (i = 0; i < l; i++) {
// Slide ID's are optional. In case of missing ID we set it to the // Slide IDs are optional. In case of missing ID we set it to the
// slide number // slide number
if ( ! slides[i].id) { if ( ! slides[i].id) {
slides[i].id = i + 1; slides[i].id = i + 1;
@ -104,12 +105,12 @@ window.shower = (function(window, document, undefined) {
}; };
/** /**
* Get containing slide id. * Get slide id from HTML element.
* @private * @private
* @param {domElem} el * @param {domElem} el
* @returns {String} * @returns {String}
*/ */
shower._getContainingSlideId = function(el) { shower._getSlideIdByEl = function(el) {
while ('BODY' !== el.nodeName && 'HTML' !== el.nodeName) { while ('BODY' !== el.nodeName && 'HTML' !== el.nodeName) {
if (el.classList.contains('slide')) { if (el.classList.contains('slide')) {
return el.id; return el.id;
@ -122,42 +123,48 @@ window.shower = (function(window, document, undefined) {
}; };
/** /**
* Dispatch single slide mode. * For touch devices: check if click on links...
* @TODO: Renaming needed? Or just some handlers rewriting? *
* @TODO: add support for textareas/inputs/...
*
* @private * @private
* @param {domElem} e * @param {domElem} e
* @returns {Undefined} * @returns {Boolean}
*/ */
shower._dispatchSingleSlideMode = function(e) { shower._checkInteractiveElement = function(e) {
// Process links
// @TODO: presentation links support
if ('A' === e.target.nodeName) { if ('A' === e.target.nodeName) {
e.preventDefault(); return true;
} else {
window.open(e.target.getAttribute('href')); return false;
return;
} }
var slideId = shower._getContainingSlideId(e.target);
if ('' !== slideId && shower.isListMode()) {
e.preventDefault();
// NOTE: we should update hash to get things work properly
url.hash = '#' + slideId;
if (isHistoryApiSupported) {
history.replaceState(null, null, url.pathname + '?full#' + slideId);
}
shower.enterSlideMode();
shower.updateProgress(shower.getCurrentSlideNumber());
shower.updateCurrentAndPassedSlides(shower.getCurrentSlideNumber());
shower.runSlideshowIfPresented(shower.getCurrentSlideNumber());
}
return;
}; };
/**
* Get slide number by slideId
* @param {Number} slideId (HTML id or position in slideList)
* @returns {Number}
*/
shower.getSlideNumber = function(slideId) {
var i = slideList.length - 1,
slideNumber;
if (slideId === '') {
slideNumber = 0;
}
// As fast as you can ;-)
// http://jsperf.com/for-vs-foreach/46
for (; i >= 0; --i) {
if (slideId === slideList[i].id) {
slideNumber = i;
break;
}
}
return slideNumber;
};
/** /**
* Show next slide. If slide is last returns false, otherwise return slide * Show next slide. If slide is last returns false, otherwise return slide
* number which been shown. * number which been shown.
@ -180,7 +187,7 @@ window.shower = (function(window, document, undefined) {
// slides starts from 0 // slides starts from 0
ret = currentSlideNumber + 2; ret = currentSlideNumber + 2;
if (typeof(callback) === "function") { if (typeof(callback) === 'function') {
callback(); callback();
} }
} else { } else {
@ -205,7 +212,7 @@ window.shower = (function(window, document, undefined) {
ret = currentSlideNumber; ret = currentSlideNumber;
shower.go(currentSlideNumber - 1); shower.go(currentSlideNumber - 1);
if (typeof(callback) === "function") { if (typeof(callback) === 'function') {
callback(); callback();
} }
} else { } else {
@ -221,7 +228,7 @@ window.shower = (function(window, document, undefined) {
* @returns {Number} * @returns {Number}
*/ */
shower.first = function(callback) { shower.first = function(callback) {
if (typeof(callback) === "function") { if (typeof(callback) === 'function') {
callback(); callback();
} }
@ -234,7 +241,7 @@ window.shower = (function(window, document, undefined) {
* @returns {Number} * @returns {Number}
*/ */
shower.last = function(callback) { shower.last = function(callback) {
if (typeof(callback) === "function") { if (typeof(callback) === 'function') {
callback(); callback();
} }
return shower.go(slideList.length - 1); return shower.go(slideList.length - 1);
@ -246,9 +253,17 @@ window.shower = (function(window, document, undefined) {
* @returns {Number|Boolean} * @returns {Number|Boolean}
*/ */
shower.enterSlideMode = function(callback) { shower.enterSlideMode = function(callback) {
// check if it's already in slide mode... var currentSlideNumber = shower.getCurrentSlideNumber();
if (body.classList.contains('full')) {
return false; if (currentSlideNumber === -1) {
currentSlideNumber = 0;
}
shower.go(currentSlideNumber);
shower.showPresenterNotes(currentSlideNumber);
if (shower.isListMode() && isHistoryApiSupported) {
history.pushState(null, null, url.pathname + '?full' + shower.getSlideHash(currentSlideNumber));
} }
body.classList.remove('list'); body.classList.remove('list');
@ -258,9 +273,11 @@ window.shower = (function(window, document, undefined) {
console.clear(); console.clear();
} }
shower.showPresenterNotes(shower.getCurrentSlideNumber()); shower.updateProgress(currentSlideNumber);
shower.updateCurrentAndPassedSlides(currentSlideNumber);
shower.runSlideshowIfPresented(currentSlideNumber);
if (typeof(callback) === "function") { if (typeof(callback) === 'function') {
callback(); callback();
} }
@ -273,22 +290,41 @@ window.shower = (function(window, document, undefined) {
* @returns {Number} * @returns {Number}
*/ */
shower.enterListMode = function(callback) { shower.enterListMode = function(callback) {
// check if it's already in list mode... var currentSlideNumber = shower.getCurrentSlideNumber();
if (body.classList.contains('list')) {
return false;
}
body.classList.remove('full'); body.classList.remove('full');
body.classList.add('list'); body.classList.add('list');
if (typeof(callback) === "function") { if (shower.isSlideMode() && isHistoryApiSupported) {
history.pushState(null, null, url.pathname + shower.getSlideHash(currentSlideNumber));
}
shower.scrollToSlide(currentSlideNumber);
if (typeof(callback) === 'function') {
callback(); callback();
} }
return shower._applyTransform('none'); return shower._applyTransform('none');
}; };
// @TODO: add method shower.toggleMode() /**
* Toggle Mode: Slide and List
* @param {Function} callback
*/
shower.toggleMode = function(callback) {
if (shower.isListMode()) {
shower.enterSlideMode();
} else {
shower.enterListMode();
}
if (typeof(callback) === 'function') {
callback();
}
return true;
};
/** /**
* Get current slide number. Starts from zero. Warning: when in url you have * Get current slide number. Starts from zero. Warning: when in url you have
@ -324,7 +360,7 @@ window.shower = (function(window, document, undefined) {
throw new Error('Gimme slide number as Number, baby!'); throw new Error('Gimme slide number as Number, baby!');
} }
if ( ! shower.isListMode()) { if (shower.isSlideMode()) {
throw new Error('You can\'t scroll to because you in slide mode. Please, switch to list mode.'); throw new Error('You can\'t scroll to because you in slide mode. Please, switch to list mode.');
} }
@ -345,13 +381,21 @@ window.shower = (function(window, document, undefined) {
}; };
/** /**
* Chech if it's list mode. * Check if it's List mode.
* @returns {Boolean} * @returns {Boolean}
*/ */
shower.isListMode = function() { shower.isListMode = function() {
return isHistoryApiSupported ? ! /^full.*/.test(url.search.substr(1)) : body.classList.contains('list'); return isHistoryApiSupported ? ! /^full.*/.test(url.search.substr(1)) : body.classList.contains('list');
}; };
/**
* Check if it's Slide mode.
* @returns {Boolean}
*/
shower.isSlideMode = function() {
return isHistoryApiSupported ? /^full.*/.test(url.search.substr(1)) : body.classList.contains('full');
};
/** /**
* Update progress bar. * Update progress bar.
* @param {Number} slideNumber slide number (sic!) * @param {Number} slideNumber slide number (sic!)
@ -414,15 +458,17 @@ window.shower = (function(window, document, undefined) {
if (window.console) { if (window.console) {
slideNumber = shower._normalizeSlideNumber(slideNumber); slideNumber = shower._normalizeSlideNumber(slideNumber);
var slideId = slideList[slideNumber].id; var slideId = slideList[slideNumber].id,
var nextSlideId = slideList[slideNumber + 1] ? slideList[slideNumber + 1].id : null; nextSlideId = slideList[slideNumber + 1] ? slideList[slideNumber + 1].id : null,
notes = document.getElementById(slideId).querySelector('footer');
var notes = document.getElementById(slideId).querySelector('footer');
if (notes) { if (notes) {
console.info(notes.innerHTML.replace(/\n\s+/g,'\n')); console.info(notes.innerHTML.replace(/\n\s+/g,'\n'));
} }
if (nextSlideId) { if (nextSlideId) {
var next = document.getElementById(nextSlideId).querySelector('h2'); var next = document.getElementById(nextSlideId).querySelector('h2');
if (next) { if (next) {
next = next.innerHTML.replace(/^\s+|<[^>]+>/g,''); next = next.innerHTML.replace(/^\s+|<[^>]+>/g,'');
console.info('NEXT: ' + next); console.info('NEXT: ' + next);
@ -459,12 +505,12 @@ window.shower = (function(window, document, undefined) {
url.hash = shower.getSlideHash(slideNumber); url.hash = shower.getSlideHash(slideNumber);
if ( ! shower.isListMode()) { if (shower.isSlideMode()) {
shower.updateProgress(slideNumber); shower.updateProgress(slideNumber);
shower.updateCurrentAndPassedSlides(slideNumber); shower.updateCurrentAndPassedSlides(slideNumber);
shower.showPresenterNotes(slideNumber); shower.showPresenterNotes(slideNumber);
if (typeof(callback) === "function") { if (typeof(callback) === 'function') {
callback(); callback();
} }
} }
@ -534,32 +580,21 @@ window.shower = (function(window, document, undefined) {
// Event handlers // Event handlers
window.addEventListener('DOMContentLoaded', function() { window.addEventListener('DOMContentLoaded', function() {
if ( ! shower.isListMode()) { if (shower.isSlideMode()) {
// "?full" is present without slide hash, so we should display first slide
if (-1 === shower.getCurrentSlideNumber()) {
if (isHistoryApiSupported) {
history.replaceState(null, null, url.pathname + '?full' + shower.getSlideHash(0));
}
}
shower.enterSlideMode(); shower.enterSlideMode();
shower.updateProgress(shower.getCurrentSlideNumber());
shower.updateCurrentAndPassedSlides(shower.getCurrentSlideNumber());
shower.runSlideshowIfPresented(shower.getCurrentSlideNumber());
} }
}, false); }, false);
window.addEventListener('popstate', function(e) { window.addEventListener('popstate', function(e) {
if (shower.isListMode()) { if (shower.isListMode()) {
shower.enterListMode(); shower.enterListMode();
shower.scrollToSlide(shower.getCurrentSlideNumber());
} else { } else {
shower.enterSlideMode(); shower.enterSlideMode();
} }
}, false); }, false);
window.addEventListener('resize', function(e) { window.addEventListener('resize', function(e) {
if ( ! shower.isListMode()) { if (shower.isSlideMode()) {
shower._applyTransform(shower._getTransform()); shower._applyTransform(shower._getTransform());
} }
}, false); }, false);
@ -579,48 +614,23 @@ window.shower = (function(window, document, undefined) {
var slideNumber = e.shiftKey ? currentSlideNumber : 0; var slideNumber = e.shiftKey ? currentSlideNumber : 0;
shower.go(slideNumber); shower.go(slideNumber);
if (isHistoryApiSupported) {
history.pushState(null, null, url.pathname + '?full' + shower.getSlideHash(slideNumber));
}
shower.enterSlideMode(); shower.enterSlideMode();
shower.updateProgress(slideNumber);
shower.updateCurrentAndPassedSlides(slideNumber);
shower.runSlideshowIfPresented(slideNumber);
} else { } else {
if (isHistoryApiSupported) {
history.pushState(null, null, url.pathname + shower.getSlideHash(currentSlideNumber));
}
shower.enterListMode(); shower.enterListMode();
shower.scrollToSlide(currentSlideNumber);
} }
break; break;
case 13: // Enter case 13: // Enter
if (shower.isListMode() && -1 !== currentSlideNumber) { if (shower.isListMode() && -1 !== currentSlideNumber) {
e.preventDefault(); e.preventDefault();
if (isHistoryApiSupported) {
history.pushState(null, null, url.pathname + '?full' + shower.getSlideHash(currentSlideNumber));
}
shower.enterSlideMode(); shower.enterSlideMode();
shower.updateProgress(currentSlideNumber);
shower.updateCurrentAndPassedSlides(currentSlideNumber);
shower.runSlideshowIfPresented(currentSlideNumber);
} }
break; break;
case 27: // Esc case 27: // Esc
if ( ! shower.isListMode()) { if (shower.isSlideMode()) {
e.preventDefault(); e.preventDefault();
if (isHistoryApiSupported) {
history.pushState(null, null, url.pathname + shower.getSlideHash(currentSlideNumber));
}
shower.enterListMode(); shower.enterListMode();
shower.scrollToSlide(currentSlideNumber);
} }
break; break;
@ -640,7 +650,7 @@ window.shower = (function(window, document, undefined) {
case 74: // j case 74: // j
e.preventDefault(); e.preventDefault();
if ( ! shower.isListMode()) { if (shower.isSlideMode()) {
// Inner navigation is "completed" if current slide have // Inner navigation is "completed" if current slide have
// no inner navigation or inner navigation is fully shown // no inner navigation or inner navigation is fully shown
innerNavigationCompleted = !slideList[currentSlideNumber].hasInnerNavigation || innerNavigationCompleted = !slideList[currentSlideNumber].hasInnerNavigation ||
@ -657,7 +667,7 @@ window.shower = (function(window, document, undefined) {
currentSlideNumber++; currentSlideNumber++;
shower.go(currentSlideNumber); shower.go(currentSlideNumber);
// We must run slideshow only in full mode // We must run slideshow only in full mode
if ( ! shower.isListMode()) { if (shower.isSlideMode()) {
shower.runSlideshowIfPresented(currentSlideNumber); shower.runSlideshowIfPresented(currentSlideNumber);
} }
} }
@ -665,20 +675,17 @@ window.shower = (function(window, document, undefined) {
case 36: // Home case 36: // Home
e.preventDefault(); e.preventDefault();
shower.first(); shower.first();
break; break;
case 35: // End case 35: // End
e.preventDefault(); e.preventDefault();
shower.last(); shower.last();
break; break;
case 9: // Tab = +1; Shift + Tab = -1 case 9: // Tab = +1; Shift + Tab = -1
case 32: // Space = +1; Shift + Space = -1 case 32: // Space = +1; Shift + Space = -1
e.preventDefault(); e.preventDefault();
shower[e.shiftKey ? 'previous' : 'next'](); shower[e.shiftKey ? 'previous' : 'next']();
break; break;
@ -687,25 +694,37 @@ window.shower = (function(window, document, undefined) {
} }
}, false); }, false);
document.addEventListener('click', shower._dispatchSingleSlideMode, false); document.addEventListener('click', function(e) {
document.addEventListener('touchend', shower._dispatchSingleSlideMode, false); if (shower.isListMode() && shower._getSlideIdByEl(e.target)) {
e.preventDefault();
document.addEventListener('touchstart', function(e) { shower.go(shower.getSlideNumber(shower._getSlideIdByEl(e.target)));
if ( ! shower.isListMode()) { shower.enterSlideMode();
var currentSlideNumber = shower.getCurrentSlideNumber(),
x = e.touches[0].pageX;
if (x > window.innerWidth / 2) {
currentSlideNumber++;
} else {
currentSlideNumber--;
}
shower.go(currentSlideNumber);
} }
}, false); }, false);
document.addEventListener('touchstart', function(e) {
if (shower._getSlideIdByEl(e.target)) {
if (shower.isSlideMode() && ! shower._checkInteractiveElement(e)) {
var x = e.touches[0].pageX;
if (x > window.innerWidth / 2) {
shower.next();
} else {
shower.previous();
}
}
if (shower.isListMode()) {
shower.go(shower.getSlideNumber(shower._getSlideIdByEl(e.target)));
shower.enterSlideMode();
}
}
}, false);
document.addEventListener('touchmove', function(e) { document.addEventListener('touchmove', function(e) {
if ( ! shower.isListMode()) { if (shower.isSlideMode()) {
e.preventDefault(); e.preventDefault();
} }
}, false); }, false);