Commit db000b79 authored by Vadim Makeev's avatar Vadim Makeev

rolling back changes in the stable branch

parent ae328760
......@@ -27,7 +27,7 @@
<h1>Shower Presentation Template</h1>
<p>Vadim Makeev, Opera Software</p>
</header>
<div class="slide cover" data-timing="00:05" id="Cover"><div>
<div class="slide cover" id="Cover"><div>
<section>
<header>
<h2>Shower Presentation Template</h2>
......@@ -35,7 +35,7 @@
<img src="pictures/cover.jpg" alt="">
</section>
</div></div>
<div class="slide" data-timing="00:05"><div>
<div class="slide" id="Header"><div>
<section>
<header>
<h2>Header</h2>
......@@ -44,7 +44,7 @@
<p><a href="examples/index.htm" target="_blank">This link will be opened in the new tab</a></p>
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="TwoLinesHeader"><div>
<section>
<header>
<h2>Two rows.<br>Mighty heading</h2>
......@@ -52,7 +52,7 @@
<p>This <code>&lt;tool&gt;</code> is provided <strong>without</strong> warranty, guarantee, or much in the way of explanation. Note that use of this tool may or may not crash <em>your</em> browser.</p>
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="UnorderedList"><div>
<section>
<header>
<h2>Unordered List</h2>
......@@ -71,7 +71,7 @@
</ul>
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="OrderedList"><div>
<section>
<header>
<h2>Ordered List</h2>
......@@ -90,7 +90,7 @@
</ol>
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="InTheMiddle"><div>
<section>
<header>
<h2>In the Middle</h2>
......@@ -116,7 +116,7 @@
<img src="pictures/picture.jpg" alt="">
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="CodeSample"><div>
<section>
<header>
<h2>Code Sample</h2>
......@@ -132,7 +132,7 @@
</pre>
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="CodeNotes"><div>
<section>
<header>
<h2>Code Notes</h2>
......@@ -147,21 +147,21 @@
<p class="note">Lock up your machine</p>
</section>
</div></div>
<div class="slide shout"><div>
<div class="slide shout" id="Shout"><div>
<section>
<header>
<h2>Warning<br>Message</h2>
</header>
</section>
</div></div>
<div class="slide shout"><div>
<div class="slide shout" id="Demo"><div>
<section>
<header>
<h2><a href="examples/index.htm" target="_blank">Demo</a></h2>
</header>
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="BlockQuote"><div>
<section>
<header>
<h2>Block Quote</h2>
......@@ -171,20 +171,20 @@
</blockquote>
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="InnerNavigation"><div>
<section>
<header>
<h2>Inner Navigation</h2>
</header>
<ol>
<li>This tool is provided</li>
<li class="next">Without warranty, guarantee</li>
<li class="next">Or much in the way of explanation
<li class="next">Erase your hard drive.</li>
<ol class="inner">
<li class="active">This tool is provided</li>
<li>Without warranty, guarantee</li>
<li>Or much in the way of explanation
<li>Erase your hard drive.</li>
</ol>
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="ThankYou"><div>
<section>
<header>
<h2>Shower Presentation Template</h2>
......
......@@ -27,7 +27,7 @@
<h1>Шаблон презентаций Shower</h1>
<p>Вадим Макеев, Opera Software</p>
</header>
<div class="slide cover" data-timing="00:05" id="Cover"><div>
<div class="slide cover" id="Cover"><div>
<section>
<header>
<h2>Шаблон презентации Shower</h2>
......@@ -35,7 +35,7 @@
<img src="pictures/cover.jpg" alt="">
</section>
</div></div>
<div class="slide" data-timing="00:05"><div>
<div class="slide" id="Header"><div>
<section>
<header>
<h2>Заголовок</h2>
......@@ -52,7 +52,7 @@
<p>Очередь <code>заведено</code> создаете <strong>те про,</strong> джоэл должен написано вы всю. Получаете отказаться программистов миф мы, <em>не пишете размере</em> количества нее, по две.</p>
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="UnorderedList"><div>
<section>
<header>
<h2>Неупорядоченный список</h2>
......@@ -71,7 +71,7 @@
</ul>
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="OrderedList"><div>
<section>
<header>
<h2>Упорядоченный список</h2>
......@@ -90,7 +90,7 @@
</ol>
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="InTheMiddle"><div>
<section>
<header>
<h2>Посередине</h2>
......@@ -116,7 +116,7 @@
<img src="pictures/picture.jpg" alt="">
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="CodeSample"><div>
<section>
<header>
<h2>Пример кода</h2>
......@@ -132,7 +132,7 @@
</pre>
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="CodeNotes"><div>
<section>
<header>
<h2>Заметки к коду</h2>
......@@ -147,21 +147,21 @@
<p class="note">Заведено безостановочно</p>
</section>
</div></div>
<div class="slide shout"><div>
<div class="slide shout" id="Shout"><div>
<section>
<header>
<h2>Опасносте<br>сообщение</h2>
</header>
</section>
</div></div>
<div class="slide shout"><div>
<div class="slide shout" id="Demo"><div>
<section>
<header>
<h2><a href="examples/index.htm" target="_blank">Демо</a></h2>
</header>
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="BlockQuote"><div>
<section>
<header>
<h2>Цитата</h2>
......@@ -171,20 +171,20 @@
</blockquote>
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="InnerNavigation"><div>
<section>
<header>
<h2>Внутренняя навигация</h2>
</header>
<ol>
<li>Очередь заведено создаете</li>
<li class="next">Те про, джоэл должен написано вы всю</li>
<li class="next">Получаете отказаться программистов</li>
<li class="next">Ещё то этой вреде внешних.</li>
<ol class="inner">
<li class="active">Очередь заведено создаете</li>
<li>Те про, джоэл должен написано вы всю</li>
<li>Получаете отказаться программистов</li>
<li>Ещё то этой вреде внешних.</li>
</ol>
</section>
</div></div>
<div class="slide"><div>
<div class="slide" id="ThankYou"><div>
<section>
<header>
<h2>Шаблон презентаций Shower</h2>
......
......@@ -4,20 +4,12 @@
slides = document.querySelectorAll('div.slide'),
progress = document.querySelector('div.progress div'),
slideList = [],
timer,
l = slides.length, i;
for (i = 0; i < l; i++) {
// Slide ID's are optional. In case of missing ID we set it to the
// slide number
if (!slides[i].id) {
slides[i].id = i + 1;
}
slideList.push({
id: slides[i].id,
hasInnerNavigation: null !== slides[i].querySelector('.next'),
hasTiming: null != slides[i].dataset.timing
hasInnerNavigation: null !== slides[i].querySelector('.inner')
});
}
......@@ -61,10 +53,10 @@
return -1;
}
function scrollToSlide(slideNumber) {
if (-1 === slideNumber ) { return; }
var currentSlide = document.getElementById(slideList[slideNumber].id);
function scrollToCurrentSlide() {
var currentSlide = document.getElementById(
slideList[getCurrentSlideNumber()].id
);
if (null != currentSlide) {
window.scrollTo(0, currentSlide.offsetTop);
......@@ -90,26 +82,6 @@
progress.style.width = (100 / (slideList.length - 1) * normalizeSlideNumber(slideNumber)).toFixed(2) + '%';
}
function updateCurrentAndPassedSlides(slideNumber) {
var i, l = slideList.length, slide;
slideNumber = normalizeSlideNumber(slideNumber);
for ( i = 0; i < l; ++i ) {
slide = document.getElementById(slideList[i].id);
if ( i < slideNumber ) {
slide.classList.remove('current');
slide.classList.add('passed');
} else if ( i > slideNumber ) {
slide.classList.remove('passed');
slide.classList.remove('current');
} else {
slide.classList.remove('passed');
slide.classList.add('current');
}
}
}
function getSlideHash(slideNumber) {
return '#' + slideList[normalizeSlideNumber(slideNumber)].id;
}
......@@ -119,7 +91,6 @@
if (!isListMode()) {
updateProgress(slideNumber);
updateCurrentAndPassedSlides(slideNumber);
}
}
......@@ -148,26 +119,6 @@
enterSlideMode();
updateProgress(getCurrentSlideNumber());
updateCurrentAndPassedSlides(getCurrentSlideNumber());
runSlideshowIfPresented(getCurrentSlideNumber());
}
}
function runSlideshowIfPresented(slideNumber) {
slideNumber = 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 = document.getElementById(slideList[slideNumber].id).dataset.timing.split(':');
timing = parseInt(timing[0]) * 60 * 1000 + parseInt(timing[1]) * 1000;
timer = setTimeout( function () {
goToSlide(slideNumber + 1);
runSlideshowIfPresented(slideNumber + 1);
}, timing );
}
}
......@@ -176,13 +127,13 @@
// Shortcut for slides without inner navigation
if (true !== slideList[slideNumber].hasInnerNavigation) { return -1; }
var nextNodes = document.getElementById(slideList[slideNumber].id).querySelectorAll('.next:not(.active)'),
node;
var activeNodes = document.querySelectorAll(getSlideHash(slideNumber) + ' .active'),
// NOTE: we assume there is no other elements in inner navigation
node = activeNodes[activeNodes.length - 1].nextElementSibling;
if (0 !== nextNodes.length) {
node = nextNodes[0];
if (null !== node) {
node.classList.add('active');
return nextNodes.length - 1;
return activeNodes.length + 1;
} else {
return -1;
}
......@@ -199,15 +150,13 @@
enterSlideMode();
updateProgress(getCurrentSlideNumber());
updateCurrentAndPassedSlides(getCurrentSlideNumber());
runSlideshowIfPresented(getCurrentSlideNumber())
}
}, false);
window.addEventListener('popstate', function (e) {
if (isListMode()) {
enterListMode();
scrollToSlide(getCurrentSlideNumber());
scrollToCurrentSlide();
} else {
enterSlideMode();
}
......@@ -223,21 +172,18 @@
// Shortcut for alt, shift and meta keys
if (e.altKey || e.ctrlKey || e.metaKey) { return; }
var currentSlideNumber = getCurrentSlideNumber(),
innerNavigationCompleted = true;
var currentSlideNumber = getCurrentSlideNumber();
switch (e.which) {
case 116: // F5
case 13: // Enter
if (isListMode() && -1 !== currentSlideNumber) {
if (isListMode()) {
e.preventDefault();
history.pushState(null, null, url.pathname + '?full' + getSlideHash(currentSlideNumber));
enterSlideMode();
updateProgress(currentSlideNumber);
updateCurrentAndPassedSlides(currentSlideNumber);
runSlideshowIfPresented(currentSlideNumber);
}
break;
......@@ -247,7 +193,7 @@
history.pushState(null, null, url.pathname + getSlideHash(currentSlideNumber));
enterListMode();
scrollToSlide(currentSlideNumber);
scrollToCurrentSlide();
}
break;
......@@ -269,26 +215,14 @@
case 74: // j
e.preventDefault();
if (!isListMode() ) {
// Inner navigation is "completed" if current slide have
// no inner navigation or inner navigation is fully shown
innerNavigationCompleted = !slideList[currentSlideNumber].hasInnerNavigation ||
-1 === increaseInnerNavigation(currentSlideNumber);
} else {
// Also inner navigation is always "completed" if we are in
// list mode
innerNavigationCompleted = true;
}
// NOTE: First of all check if there is no current slide
// Only go to next slide if current slide have no inner
// navigation or inner navigation is fully shown
if (
-1 === currentSlideNumber || innerNavigationCompleted
!slideList[currentSlideNumber].hasInnerNavigation ||
-1 === increaseInnerNavigation(currentSlideNumber)
) {
currentSlideNumber++;
goToSlide(currentSlideNumber);
// We must run slideshow only in full mode
if (!isListMode()) {
runSlideshowIfPresented(currentSlideNumber);
}
}
break;
......
......@@ -394,10 +394,10 @@ BODY {
}
/* Inner Navigation */
.full .next {
.full .inner > * {
opacity:0;
}
.full .next.active {
.full .inner > .active {
opacity:1;
-webkit-transition:opacity 0.5s linear;
-moz-transition:opacity 0.5s linear;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment