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

rolling back changes in the stable branch

This commit is contained in:
Vadim Makeev 2012-03-02 00:11:40 +01:00
parent ae328760c3
commit db000b791d
4 changed files with 57 additions and 123 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
en.htm
View File

@ -27,7 +27,7 @@
<h1>Shower Presentation Template</h1> <h1>Shower Presentation Template</h1>
<p>Vadim Makeev, Opera Software</p> <p>Vadim Makeev, Opera Software</p>
</header> </header>
<div class="slide cover" data-timing="00:05" id="Cover"><div> <div class="slide cover" id="Cover"><div>
<section> <section>
<header> <header>
<h2>Shower Presentation Template</h2> <h2>Shower Presentation Template</h2>
@ -35,7 +35,7 @@
<img src="pictures/cover.jpg" alt=""> <img src="pictures/cover.jpg" alt="">
</section> </section>
</div></div> </div></div>
<div class="slide" data-timing="00:05"><div> <div class="slide" id="Header"><div>
<section> <section>
<header> <header>
<h2>Header</h2> <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> <p><a href="examples/index.htm" target="_blank">This link will be opened in the new tab</a></p>
</section> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="TwoLinesHeader"><div>
<section> <section>
<header> <header>
<h2>Two rows.<br>Mighty heading</h2> <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> <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> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="UnorderedList"><div>
<section> <section>
<header> <header>
<h2>Unordered List</h2> <h2>Unordered List</h2>
@ -71,7 +71,7 @@
</ul> </ul>
</section> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="OrderedList"><div>
<section> <section>
<header> <header>
<h2>Ordered List</h2> <h2>Ordered List</h2>
@ -90,7 +90,7 @@
</ol> </ol>
</section> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="InTheMiddle"><div>
<section> <section>
<header> <header>
<h2>In the Middle</h2> <h2>In the Middle</h2>
@ -116,7 +116,7 @@
<img src="pictures/picture.jpg" alt=""> <img src="pictures/picture.jpg" alt="">
</section> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="CodeSample"><div>
<section> <section>
<header> <header>
<h2>Code Sample</h2> <h2>Code Sample</h2>
@ -132,7 +132,7 @@
</pre> </pre>
</section> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="CodeNotes"><div>
<section> <section>
<header> <header>
<h2>Code Notes</h2> <h2>Code Notes</h2>
@ -147,21 +147,21 @@
<p class="note">Lock up your machine</p> <p class="note">Lock up your machine</p>
</section> </section>
</div></div> </div></div>
<div class="slide shout"><div> <div class="slide shout" id="Shout"><div>
<section> <section>
<header> <header>
<h2>Warning<br>Message</h2> <h2>Warning<br>Message</h2>
</header> </header>
</section> </section>
</div></div> </div></div>
<div class="slide shout"><div> <div class="slide shout" id="Demo"><div>
<section> <section>
<header> <header>
<h2><a href="examples/index.htm" target="_blank">Demo</a></h2> <h2><a href="examples/index.htm" target="_blank">Demo</a></h2>
</header> </header>
</section> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="BlockQuote"><div>
<section> <section>
<header> <header>
<h2>Block Quote</h2> <h2>Block Quote</h2>
@ -171,20 +171,20 @@
</blockquote> </blockquote>
</section> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="InnerNavigation"><div>
<section> <section>
<header> <header>
<h2>Inner Navigation</h2> <h2>Inner Navigation</h2>
</header> </header>
<ol> <ol class="inner">
<li>This tool is provided</li> <li class="active">This tool is provided</li>
<li class="next">Without warranty, guarantee</li> <li>Without warranty, guarantee</li>
<li class="next">Or much in the way of explanation <li>Or much in the way of explanation
<li class="next">Erase your hard drive.</li> <li>Erase your hard drive.</li>
</ol> </ol>
</section> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="ThankYou"><div>
<section> <section>
<header> <header>
<h2>Shower Presentation Template</h2> <h2>Shower Presentation Template</h2>

34
ru.htm
View File

@ -27,7 +27,7 @@
<h1>Шаблон презентаций Shower</h1> <h1>Шаблон презентаций Shower</h1>
<p>Вадим Макеев, Opera Software</p> <p>Вадим Макеев, Opera Software</p>
</header> </header>
<div class="slide cover" data-timing="00:05" id="Cover"><div> <div class="slide cover" id="Cover"><div>
<section> <section>
<header> <header>
<h2>Шаблон презентации Shower</h2> <h2>Шаблон презентации Shower</h2>
@ -35,7 +35,7 @@
<img src="pictures/cover.jpg" alt=""> <img src="pictures/cover.jpg" alt="">
</section> </section>
</div></div> </div></div>
<div class="slide" data-timing="00:05"><div> <div class="slide" id="Header"><div>
<section> <section>
<header> <header>
<h2>Заголовок</h2> <h2>Заголовок</h2>
@ -52,7 +52,7 @@
<p>Очередь <code>заведено</code> создаете <strong>те про,</strong> джоэл должен написано вы всю. Получаете отказаться программистов миф мы, <em>не пишете размере</em> количества нее, по две.</p> <p>Очередь <code>заведено</code> создаете <strong>те про,</strong> джоэл должен написано вы всю. Получаете отказаться программистов миф мы, <em>не пишете размере</em> количества нее, по две.</p>
</section> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="UnorderedList"><div>
<section> <section>
<header> <header>
<h2>Неупорядоченный список</h2> <h2>Неупорядоченный список</h2>
@ -71,7 +71,7 @@
</ul> </ul>
</section> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="OrderedList"><div>
<section> <section>
<header> <header>
<h2>Упорядоченный список</h2> <h2>Упорядоченный список</h2>
@ -90,7 +90,7 @@
</ol> </ol>
</section> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="InTheMiddle"><div>
<section> <section>
<header> <header>
<h2>Посередине</h2> <h2>Посередине</h2>
@ -116,7 +116,7 @@
<img src="pictures/picture.jpg" alt=""> <img src="pictures/picture.jpg" alt="">
</section> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="CodeSample"><div>
<section> <section>
<header> <header>
<h2>Пример кода</h2> <h2>Пример кода</h2>
@ -132,7 +132,7 @@
</pre> </pre>
</section> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="CodeNotes"><div>
<section> <section>
<header> <header>
<h2>Заметки к коду</h2> <h2>Заметки к коду</h2>
@ -147,21 +147,21 @@
<p class="note">Заведено безостановочно</p> <p class="note">Заведено безостановочно</p>
</section> </section>
</div></div> </div></div>
<div class="slide shout"><div> <div class="slide shout" id="Shout"><div>
<section> <section>
<header> <header>
<h2>Опасносте<br>сообщение</h2> <h2>Опасносте<br>сообщение</h2>
</header> </header>
</section> </section>
</div></div> </div></div>
<div class="slide shout"><div> <div class="slide shout" id="Demo"><div>
<section> <section>
<header> <header>
<h2><a href="examples/index.htm" target="_blank">Демо</a></h2> <h2><a href="examples/index.htm" target="_blank">Демо</a></h2>
</header> </header>
</section> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="BlockQuote"><div>
<section> <section>
<header> <header>
<h2>Цитата</h2> <h2>Цитата</h2>
@ -171,20 +171,20 @@
</blockquote> </blockquote>
</section> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="InnerNavigation"><div>
<section> <section>
<header> <header>
<h2>Внутренняя навигация</h2> <h2>Внутренняя навигация</h2>
</header> </header>
<ol> <ol class="inner">
<li>Очередь заведено создаете</li> <li class="active">Очередь заведено создаете</li>
<li class="next">Те про, джоэл должен написано вы всю</li> <li>Те про, джоэл должен написано вы всю</li>
<li class="next">Получаете отказаться программистов</li> <li>Получаете отказаться программистов</li>
<li class="next">Ещё то этой вреде внешних.</li> <li>Ещё то этой вреде внешних.</li>
</ol> </ol>
</section> </section>
</div></div> </div></div>
<div class="slide"><div> <div class="slide" id="ThankYou"><div>
<section> <section>
<header> <header>
<h2>Шаблон презентаций Shower</h2> <h2>Шаблон презентаций Shower</h2>

102
scripts/script.js
View File

@ -4,20 +4,12 @@
slides = document.querySelectorAll('div.slide'), slides = document.querySelectorAll('div.slide'),
progress = document.querySelector('div.progress div'), progress = document.querySelector('div.progress div'),
slideList = [], slideList = [],
timer,
l = slides.length, i; l = slides.length, i;
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 number
if (!slides[i].id) {
slides[i].id = i + 1;
}
slideList.push({ slideList.push({
id: slides[i].id, id: slides[i].id,
hasInnerNavigation: null !== slides[i].querySelector('.next'), hasInnerNavigation: null !== slides[i].querySelector('.inner')
hasTiming: null != slides[i].dataset.timing
}); });
} }
@ -61,10 +53,10 @@
return -1; return -1;
} }
function scrollToSlide(slideNumber) { function scrollToCurrentSlide() {
if (-1 === slideNumber ) { return; } var currentSlide = document.getElementById(
slideList[getCurrentSlideNumber()].id
var currentSlide = document.getElementById(slideList[slideNumber].id); );
if (null != currentSlide) { if (null != currentSlide) {
window.scrollTo(0, currentSlide.offsetTop); window.scrollTo(0, currentSlide.offsetTop);
@ -90,26 +82,6 @@
progress.style.width = (100 / (slideList.length - 1) * normalizeSlideNumber(slideNumber)).toFixed(2) + '%'; 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) { function getSlideHash(slideNumber) {
return '#' + slideList[normalizeSlideNumber(slideNumber)].id; return '#' + slideList[normalizeSlideNumber(slideNumber)].id;
} }
@ -119,7 +91,6 @@
if (!isListMode()) { if (!isListMode()) {
updateProgress(slideNumber); updateProgress(slideNumber);
updateCurrentAndPassedSlides(slideNumber);
} }
} }
@ -148,26 +119,6 @@
enterSlideMode(); enterSlideMode();
updateProgress(getCurrentSlideNumber()); 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 // Shortcut for slides without inner navigation
if (true !== slideList[slideNumber].hasInnerNavigation) { return -1; } if (true !== slideList[slideNumber].hasInnerNavigation) { return -1; }
var nextNodes = document.getElementById(slideList[slideNumber].id).querySelectorAll('.next:not(.active)'), var activeNodes = document.querySelectorAll(getSlideHash(slideNumber) + ' .active'),
node; // NOTE: we assume there is no other elements in inner navigation
node = activeNodes[activeNodes.length - 1].nextElementSibling;
if (0 !== nextNodes.length) { if (null !== node) {
node = nextNodes[0];
node.classList.add('active'); node.classList.add('active');
return nextNodes.length - 1; return activeNodes.length + 1;
} else { } else {
return -1; return -1;
} }
@ -199,15 +150,13 @@
enterSlideMode(); enterSlideMode();
updateProgress(getCurrentSlideNumber()); updateProgress(getCurrentSlideNumber());
updateCurrentAndPassedSlides(getCurrentSlideNumber());
runSlideshowIfPresented(getCurrentSlideNumber())
} }
}, false); }, false);
window.addEventListener('popstate', function (e) { window.addEventListener('popstate', function (e) {
if (isListMode()) { if (isListMode()) {
enterListMode(); enterListMode();
scrollToSlide(getCurrentSlideNumber()); scrollToCurrentSlide();
} else { } else {
enterSlideMode(); enterSlideMode();
} }
@ -223,21 +172,18 @@
// 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();
innerNavigationCompleted = true;
switch (e.which) { switch (e.which) {
case 116: // F5 case 116: // F5
case 13: // Enter case 13: // Enter
if (isListMode() && -1 !== currentSlideNumber) { if (isListMode()) {
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);
updateCurrentAndPassedSlides(currentSlideNumber);
runSlideshowIfPresented(currentSlideNumber);
} }
break; break;
@ -247,7 +193,7 @@
history.pushState(null, null, url.pathname + getSlideHash(currentSlideNumber)); history.pushState(null, null, url.pathname + getSlideHash(currentSlideNumber));
enterListMode(); enterListMode();
scrollToSlide(currentSlideNumber); scrollToCurrentSlide();
} }
break; break;
@ -269,26 +215,14 @@
case 74: // j case 74: // j
e.preventDefault(); e.preventDefault();
if (!isListMode() ) { // Only go to next slide if current slide have no inner
// Inner navigation is "completed" if current slide have // navigation or inner navigation is fully shown
// 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
if ( if (
-1 === currentSlideNumber || innerNavigationCompleted !slideList[currentSlideNumber].hasInnerNavigation ||
-1 === increaseInnerNavigation(currentSlideNumber)
) { ) {
currentSlideNumber++; currentSlideNumber++;
goToSlide(currentSlideNumber); goToSlide(currentSlideNumber);
// We must run slideshow only in full mode
if (!isListMode()) {
runSlideshowIfPresented(currentSlideNumber);
}
} }
break; break;

4
themes/ribbon/styles/style.css
View File

@ -394,10 +394,10 @@ BODY {
} }
/* Inner Navigation */ /* Inner Navigation */
.full .next { .full .inner > * {
opacity:0; opacity:0;
} }
.full .next.active { .full .inner > .active {
opacity:1; opacity:1;
-webkit-transition:opacity 0.5s linear; -webkit-transition:opacity 0.5s linear;
-moz-transition:opacity 0.5s linear; -moz-transition:opacity 0.5s linear;