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

expose a simple API 

shower.next()
shower.previous()
shower.first()
shower.last()
shower.go()
shower.enterSlideMode()
shower.enterListMode()
This commit is contained in:
Lorenzo Giuliani 2012-10-05 14:44:15 +02:00
parent d7bd266b34
commit 786b12ed4f
1 changed files with 70 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

131
scripts/script.js
View File

@ -1,5 +1,6 @@
(function () { window.shower = (function () {
var url = window.location, var _ = {},
url = window.location,
body = document.body, body = document.body,
slides = document.querySelectorAll('div.slide'), slides = document.querySelectorAll('div.slide'),
progress = document.querySelector('div.progress div'), progress = document.querySelector('div.progress div'),
@ -30,17 +31,42 @@
body.style.transform = transform; body.style.transform = transform;
} }
function enterSlideMode() { _.next = function () {
var currentSlideNumber = _.getCurrentSlideNumber();
// 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 ||
-1 === increaseInnerNavigation(currentSlideNumber)
) {
currentSlideNumber++;
_.go(currentSlideNumber);
}
}
_.previous = function () {
_.go(_.getCurrentSlideNumber() - 1);
}
_.first = function() {
_.go(0)
}
_.last = function() {
_.go(slideList.length - 1);
}
_.enterSlideMode = function() {
body.className = 'full'; body.className = 'full';
applyTransform(getTransform()); applyTransform(getTransform());
} }
function enterListMode() { _.enterListMode = function() {
body.className = 'list'; body.className = 'list';
applyTransform('none'); applyTransform('none');
} }
function getCurrentSlideNumber() { _.getCurrentSlideNumber = function() {
var i, l = slideList.length, var i, l = slideList.length,
currentSlideId = url.hash.substr(1); currentSlideId = url.hash.substr(1);
@ -63,7 +89,7 @@
} }
} }
function isListMode() { _.isListMode = function() {
return 'full' !== url.search.substr(1); return 'full' !== url.search.substr(1);
} }
@ -77,20 +103,20 @@
} }
} }
function updateProgress(slideNumber) { _.updateProgress = function(slideNumber) {
if (null === progress) { return; } if (null === progress) { return; }
progress.style.width = (100 / (slideList.length - 1) * normalizeSlideNumber(slideNumber)).toFixed(2) + '%'; progress.style.width = (100 / (slideList.length - 1) * normalizeSlideNumber(slideNumber)).toFixed(2) + '%';
} }
function getSlideHash(slideNumber) { _.getSlideHash = function(slideNumber) {
return '#' + slideList[normalizeSlideNumber(slideNumber)].id; return '#' + slideList[normalizeSlideNumber(slideNumber)].id;
} }
function goToSlide(slideNumber) { _.go = function(slideNumber) {
url.hash = getSlideHash(slideNumber); url.hash = _.getSlideHash(slideNumber);
if (!isListMode()) { if (!_.isListMode()) {
updateProgress(slideNumber); _.updateProgress(slideNumber);
} }
} }
@ -110,15 +136,15 @@
function dispatchSingleSlideMode(e) { function dispatchSingleSlideMode(e) {
var slideId = getContainingSlideId(e.target); var slideId = getContainingSlideId(e.target);
if ('' !== slideId && isListMode()) { if ('' !== slideId && _.isListMode()) {
e.preventDefault(); e.preventDefault();
// NOTE: we should update hash to get things work properly // NOTE: we should update hash to get things work properly
url.hash = '#' + slideId; url.hash = '#' + slideId;
history.replaceState(null, null, url.pathname + '?full#' + slideId); history.replaceState(null, null, url.pathname + '?full#' + slideId);
enterSlideMode(); _.enterSlideMode();
updateProgress(getCurrentSlideNumber()); _.updateProgress(_.getCurrentSlideNumber());
} }
} }
@ -127,7 +153,7 @@
// Shortcut for slides without inner navigation // Shortcut for slides without inner navigation
if (true !== slideList[slideNumber].hasInnerNavigation) { return -1; } if (true !== slideList[slideNumber].hasInnerNavigation) { return -1; }
var activeNodes = document.querySelectorAll(getSlideHash(slideNumber) + ' .active'), var activeNodes = document.querySelectorAll(_.getSlideHash(slideNumber) + ' .active'),
// NOTE: we assume there is no other elements in inner navigation // NOTE: we assume there is no other elements in inner navigation
node = activeNodes[activeNodes.length - 1].nextElementSibling; node = activeNodes[activeNodes.length - 1].nextElementSibling;
@ -142,28 +168,28 @@
// Event handlers // Event handlers
window.addEventListener('DOMContentLoaded', function () { window.addEventListener('DOMContentLoaded', function () {
if (!isListMode()) { if (!_.isListMode()) {
// "?full" is present without slide hash, so we should display first slide // "?full" is present without slide hash, so we should display first slide
if (-1 === getCurrentSlideNumber()) { if (-1 === _.getCurrentSlideNumber()) {
history.replaceState(null, null, url.pathname + '?full' + getSlideHash(0)); history.replaceState(null, null, url.pathname + '?full' + _.getSlideHash(0));
} }
enterSlideMode(); _.enterSlideMode();
updateProgress(getCurrentSlideNumber()); _.updateProgress(_.getCurrentSlideNumber());
} }
}, false); }, false);
window.addEventListener('popstate', function (e) { window.addEventListener('popstate', function (e) {
if (isListMode()) { if (_.isListMode()) {
enterListMode(); _.enterListMode();
scrollToSlide(getCurrentSlideNumber()); scrollToSlide(_.getCurrentSlideNumber());
} else { } else {
enterSlideMode(); _.enterSlideMode();
} }
}, false); }, false);
window.addEventListener('resize', function (e) { window.addEventListener('resize', function (e) {
if (!isListMode()) { if (!_.isListMode()) {
applyTransform(getTransform()); applyTransform(getTransform());
} }
}, false); }, false);
@ -171,28 +197,27 @@
document.addEventListener('keydown', function (e) { document.addEventListener('keydown', function (e) {
// Shortcut for alt, shift and meta keys // Shortcut for alt, shift and meta keys
if (e.altKey || e.ctrlKey || e.metaKey) { return; } if (e.altKey || e.ctrlKey || e.metaKey) { return; }
var currentSlideNumber = _.getCurrentSlideNumber();
var currentSlideNumber = getCurrentSlideNumber();
switch (e.which) { switch (e.which) {
case 116: // F5 case 116: // F5
case 13: // Enter case 13: // Enter
if (isListMode() && -1 !== currentSlideNumber) { if (_.isListMode() && -1 !== currentSlideNumber) {
e.preventDefault(); e.preventDefault();
history.pushState(null, null, url.pathname + '?full' + getSlideHash(currentSlideNumber)); history.pushState(null, null, url.pathname + '?full' + _.getSlideHash(currentSlideNumber));
enterSlideMode(); _.enterSlideMode();
updateProgress(currentSlideNumber); _.updateProgress(currentSlideNumber);
} }
break; break;
case 27: // Esc case 27: // Esc
if (!isListMode()) { if (!_.isListMode()) {
e.preventDefault(); e.preventDefault();
history.pushState(null, null, url.pathname + getSlideHash(currentSlideNumber)); history.pushState(null, null, url.pathname + _.getSlideHash(currentSlideNumber));
enterListMode(); _.enterListMode();
scrollToSlide(currentSlideNumber); scrollToSlide(currentSlideNumber);
} }
break; break;
@ -203,9 +228,7 @@
case 72: // h case 72: // h
case 75: // k case 75: // k
e.preventDefault(); e.preventDefault();
_.previous();
currentSlideNumber--;
goToSlide(currentSlideNumber);
break; break;
case 34: // PgDown case 34: // PgDown
@ -215,39 +238,24 @@
case 74: // j case 74: // j
e.preventDefault(); e.preventDefault();
// Only go to next slide if current slide have no inner _.next();
// 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 ||
-1 === increaseInnerNavigation(currentSlideNumber)
) {
currentSlideNumber++;
goToSlide(currentSlideNumber);
}
break; break;
case 36: // Home case 36: // Home
e.preventDefault(); e.preventDefault();
_.first();
currentSlideNumber = 0;
goToSlide(currentSlideNumber);
break; break;
case 35: // End case 35: // End
e.preventDefault(); e.preventDefault();
_.last();
currentSlideNumber = slideList.length - 1;
goToSlide(currentSlideNumber);
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();
currentSlideNumber += e.shiftKey ? -1 : 1; _[e.shiftKey ? 'previous' : 'next']();
goToSlide(currentSlideNumber);
break; break;
default: default:
@ -259,8 +267,8 @@
document.addEventListener('touchend', dispatchSingleSlideMode, false); document.addEventListener('touchend', dispatchSingleSlideMode, false);
document.addEventListener('touchstart', function (e) { document.addEventListener('touchstart', function (e) {
if (!isListMode()) { if (!_.isListMode()) {
var currentSlideNumber = getCurrentSlideNumber(), var currentSlideNumber = _.getCurrentSlideNumber(),
x = e.touches[0].pageX; x = e.touches[0].pageX;
if (x > window.innerWidth / 2) { if (x > window.innerWidth / 2) {
currentSlideNumber++; currentSlideNumber++;
@ -268,14 +276,15 @@
currentSlideNumber--; currentSlideNumber--;
} }
goToSlide(currentSlideNumber); _.go(currentSlideNumber);
} }
}, false); }, false);
document.addEventListener('touchmove', function (e) { document.addEventListener('touchmove', function (e) {
if (!isListMode()) { if (!_.isListMode()) {
e.preventDefault(); e.preventDefault();
} }
}, false); }, false);
return _;
}()); }());