first import book
This commit is contained in:
parent
6be2701fd8
commit
dfd9c869d5
233 changed files with 47797 additions and 0 deletions
129
book/_templates/runestone_slides/static/common.js
Normal file
129
book/_templates/runestone_slides/static/common.js
Normal file
|
|
@ -0,0 +1,129 @@
|
|||
var PERMANENT_URL_PREFIX = DOCUMENTATION_OPTIONS.URL_ROOT + '_static/';
|
||||
|
||||
var SLIDE_CLASSES = ['far-past', 'past', 'current', 'next', 'far-next'];
|
||||
var SLIDES_SELECTOR = 'section.slides > article';
|
||||
|
||||
var PM_TOUCH_SENSITIVITY = 15;
|
||||
var TABLE_CLASS = 'table';
|
||||
|
||||
/* ---------------------------------------------------------------------- */
|
||||
/* classList polyfill by Eli Grey
|
||||
* (http://purl.eligrey.com/github/classList.js/blob/master/classList.js) */
|
||||
|
||||
if (typeof document !== "undefined" && !("classList" in document.createElement("a"))) {
|
||||
|
||||
(function (view) {
|
||||
|
||||
var
|
||||
classListProp = "classList"
|
||||
, protoProp = "prototype"
|
||||
, elemCtrProto = (view.HTMLElement || view.Element)[protoProp]
|
||||
, objCtr = Object
|
||||
strTrim = String[protoProp].trim || function () {
|
||||
return this.replace(/^\s+|\s+$/g, "");
|
||||
}
|
||||
, arrIndexOf = Array[protoProp].indexOf || function (item) {
|
||||
for (var i = 0, len = this.length; i < len; i++) {
|
||||
if (i in this && this[i] === item) {
|
||||
return i;
|
||||
}
|
||||
}
|
||||
return -1;
|
||||
}
|
||||
// Vendors: please allow content code to instantiate DOMExceptions
|
||||
, DOMEx = function (type, message) {
|
||||
this.name = type;
|
||||
this.code = DOMException[type];
|
||||
this.message = message;
|
||||
}
|
||||
, checkTokenAndGetIndex = function (classList, token) {
|
||||
if (token === "") {
|
||||
throw new DOMEx(
|
||||
"SYNTAX_ERR"
|
||||
, "An invalid or illegal string was specified"
|
||||
);
|
||||
}
|
||||
if (/\s/.test(token)) {
|
||||
throw new DOMEx(
|
||||
"INVALID_CHARACTER_ERR"
|
||||
, "String contains an invalid character"
|
||||
);
|
||||
}
|
||||
return arrIndexOf.call(classList, token);
|
||||
}
|
||||
, ClassList = function (elem) {
|
||||
var
|
||||
trimmedClasses = strTrim.call(elem.className)
|
||||
, classes = trimmedClasses ? trimmedClasses.split(/\s+/) : []
|
||||
;
|
||||
for (var i = 0, len = classes.length; i < len; i++) {
|
||||
this.push(classes[i]);
|
||||
}
|
||||
this._updateClassName = function () {
|
||||
elem.className = this.toString();
|
||||
};
|
||||
}
|
||||
, classListProto = ClassList[protoProp] = []
|
||||
, classListGetter = function () {
|
||||
return new ClassList(this);
|
||||
}
|
||||
;
|
||||
// Most DOMException implementations don't allow calling DOMException's toString()
|
||||
// on non-DOMExceptions. Error's toString() is sufficient here.
|
||||
DOMEx[protoProp] = Error[protoProp];
|
||||
classListProto.item = function (i) {
|
||||
return this[i] || null;
|
||||
};
|
||||
classListProto.contains = function (token) {
|
||||
token += "";
|
||||
return checkTokenAndGetIndex(this, token) !== -1;
|
||||
};
|
||||
classListProto.add = function (token) {
|
||||
token += "";
|
||||
if (checkTokenAndGetIndex(this, token) === -1) {
|
||||
this.push(token);
|
||||
this._updateClassName();
|
||||
}
|
||||
};
|
||||
classListProto.remove = function (token) {
|
||||
token += "";
|
||||
var index = checkTokenAndGetIndex(this, token);
|
||||
if (index !== -1) {
|
||||
this.splice(index, 1);
|
||||
this._updateClassName();
|
||||
}
|
||||
};
|
||||
classListProto.toggle = function (token) {
|
||||
token += "";
|
||||
if (checkTokenAndGetIndex(this, token) === -1) {
|
||||
this.add(token);
|
||||
} else {
|
||||
this.remove(token);
|
||||
}
|
||||
};
|
||||
classListProto.toString = function () {
|
||||
return this.join(" ");
|
||||
};
|
||||
|
||||
if (objCtr.defineProperty) {
|
||||
var classListPropDesc = {
|
||||
get: classListGetter
|
||||
, enumerable: true
|
||||
, configurable: true
|
||||
};
|
||||
try {
|
||||
objCtr.defineProperty(elemCtrProto, classListProp, classListPropDesc);
|
||||
} catch (ex) { // IE 8 doesn't support enumerable:true
|
||||
if (ex.number === -0x7FF5EC54) {
|
||||
classListPropDesc.enumerable = false;
|
||||
objCtr.defineProperty(elemCtrProto, classListProp, classListPropDesc);
|
||||
}
|
||||
}
|
||||
} else if (objCtr[protoProp].__defineGetter__) {
|
||||
elemCtrProto.__defineGetter__(classListProp, classListGetter);
|
||||
}
|
||||
|
||||
}(self));
|
||||
|
||||
}
|
||||
/* ---------------------------------------------------------------------- */
|
||||
60
book/_templates/runestone_slides/static/console.css
Normal file
60
book/_templates/runestone_slides/static/console.css
Normal file
|
|
@ -0,0 +1,60 @@
|
|||
#controls {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
margin: 10px;
|
||||
font-size: 1.5em;
|
||||
font-family: sans-serif;
|
||||
}
|
||||
|
||||
.slides.table > article {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
article.placeholder {
|
||||
background: #ddd;
|
||||
}
|
||||
|
||||
.slides.table > article {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
margin-left: -225px;
|
||||
}
|
||||
|
||||
.slides.table > article.past {
|
||||
transform: translate(-325px);
|
||||
-o-transform: translate(-325px);
|
||||
-moz-transform: translate(-325px);
|
||||
-webkit-transform: translate3d(-325px, 0, 0);
|
||||
|
||||
}
|
||||
|
||||
.slides.table > article.next {
|
||||
transform: translate(475px);
|
||||
-o-transform: translate(475px);
|
||||
-moz-transform: translate(475px);
|
||||
-webkit-transform: translate3d(475px, 0, 0);
|
||||
}
|
||||
|
||||
.slides > article.past,
|
||||
.slides > article.next {
|
||||
height: 230px;
|
||||
width: 300px;
|
||||
|
||||
margin-top: 60px;
|
||||
}
|
||||
|
||||
div.presenter_notes {
|
||||
position: absolute;
|
||||
top: 420px;
|
||||
left: 10%;
|
||||
background-color: white;
|
||||
color: black;
|
||||
padding: 1em;
|
||||
width: 80%;
|
||||
font-size: 130%;
|
||||
|
||||
border-radius: 10px;
|
||||
-o-border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
-webkit-border-radius: 10px;
|
||||
}
|
||||
91
book/_templates/runestone_slides/static/console.js
Normal file
91
book/_templates/runestone_slides/static/console.js
Normal file
|
|
@ -0,0 +1,91 @@
|
|||
document.addEventListener('DOMContentLoaded', function() {
|
||||
|
||||
var
|
||||
|
||||
handleKey = function(event) {
|
||||
switch (event.keyCode) {
|
||||
case 39: // right arrow
|
||||
case 13: // Enter
|
||||
case 32: // space
|
||||
case 34: // PgDn
|
||||
nextSlide();
|
||||
event.preventDefault();
|
||||
break;
|
||||
|
||||
case 37: // left arrow
|
||||
case 8: // Backspace
|
||||
case 33: // PgUp
|
||||
prevSlide();
|
||||
event.preventDefault();
|
||||
break;
|
||||
}
|
||||
},
|
||||
|
||||
handleUpdateSlides = function(slide_index, prev_slide, cur_slide, next_slide) {
|
||||
document.querySelector('#cur_slide_num').innerHTML = Number(slide_index) + 1;
|
||||
|
||||
// make sure we have a previous and next slide to show;
|
||||
// if not add dummy placeholders
|
||||
if (!prev_slide) {
|
||||
prev_slide = '<article class="past placeholder"></article>';
|
||||
}
|
||||
if (!next_slide) {
|
||||
next_slide = '<article class="next placeholder"></article>';
|
||||
}
|
||||
|
||||
document.querySelector('#slide_container').innerHTML = prev_slide + cur_slide + next_slide;
|
||||
|
||||
// Copy the presenter notes into place
|
||||
$('#presenter_notes').empty();
|
||||
$('article.current').find('div.admonition.note').each(
|
||||
function(i, node) {
|
||||
$('#presenter_notes').append($(node).html());
|
||||
}
|
||||
);
|
||||
|
||||
var slides = document.querySelector('section.slides > article');
|
||||
for (var i=0; i < slides.length; i++) {
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
handleMessage = function(e) {
|
||||
switch (e.data.command) {
|
||||
case 'num_slides':
|
||||
document.querySelector('#num_slides').innerHTML = e.data.content;
|
||||
break;
|
||||
case 'cur_slide':
|
||||
handleUpdateSlides(e.data.content, e.data.prev_slide, e.data.slide, e.data.next_slide);
|
||||
break;
|
||||
}
|
||||
},
|
||||
|
||||
nextSlide = function(e) {
|
||||
if (e) {
|
||||
e.preventDefault();
|
||||
}
|
||||
window.opener.postMessage({command: 'nextSlide'}, '*');
|
||||
},
|
||||
|
||||
prevSlide = function(e) {
|
||||
if (e) {
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
window.opener.postMessage({command: 'prevSlide'}, '*');
|
||||
},
|
||||
|
||||
init = function(e) {
|
||||
window.addEventListener('message', handleMessage, false);
|
||||
document.addEventListener('keydown', handleKey, false);
|
||||
|
||||
document.querySelector('#next').addEventListener('click', nextSlide);
|
||||
document.querySelector('#prev').addEventListener('click', prevSlide);
|
||||
|
||||
window.opener.postMessage({command: 'register'}, '*');
|
||||
|
||||
};
|
||||
|
||||
init();
|
||||
|
||||
}, false);
|
||||
57
book/_templates/runestone_slides/static/controller.js
Normal file
57
book/_templates/runestone_slides/static/controller.js
Normal file
|
|
@ -0,0 +1,57 @@
|
|||
var SlideController = (
|
||||
function(){
|
||||
|
||||
var
|
||||
slidedeck,
|
||||
|
||||
onKeyDown = function (event) {
|
||||
|
||||
switch (event.keyCode) {
|
||||
case 39: // right arrow
|
||||
case 13: // Enter
|
||||
case 32: // space
|
||||
case 34: // PgDn
|
||||
slidedeck.nextSlide();
|
||||
event.preventDefault();
|
||||
break;
|
||||
|
||||
case 37: // left arrow
|
||||
case 8: // Backspace
|
||||
case 33: // PgUp
|
||||
slidedeck.prevSlide();
|
||||
event.preventDefault();
|
||||
break;
|
||||
|
||||
case 40: // down arrow
|
||||
if (isChromeVoxActive()) {
|
||||
slidedeck.speakNextItem();
|
||||
} else {
|
||||
slidedeck.nextSlide();
|
||||
}
|
||||
event.preventDefault();
|
||||
break;
|
||||
|
||||
case 38: // up arrow
|
||||
if (isChromeVoxActive()) {
|
||||
slidedeck.speakPrevItem();
|
||||
} else {
|
||||
slidedeck.prevSlide();
|
||||
}
|
||||
event.preventDefault();
|
||||
break;
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
init = function(slides) {
|
||||
slidedeck = slides;
|
||||
|
||||
document.addEventListener('keydown', onKeyDown, false);
|
||||
|
||||
};
|
||||
|
||||
return {
|
||||
init: init
|
||||
};
|
||||
|
||||
}());
|
||||
2
book/_templates/runestone_slides/static/init.js
Normal file
2
book/_templates/runestone_slides/static/init.js
Normal file
|
|
@ -0,0 +1,2 @@
|
|||
SlideSync.init(SlideDeck);
|
||||
SlideController.init(SlideSync);
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
.CodeMirror-lines {
|
||||
line-height: 35px;
|
||||
}
|
||||
|
||||
.CodeMirror-gutter {
|
||||
line-height: 35px;
|
||||
}
|
||||
47
book/_templates/runestone_slides/static/slides.css
Normal file
47
book/_templates/runestone_slides/static/slides.css
Normal file
|
|
@ -0,0 +1,47 @@
|
|||
img.fill {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
min-width: 100%;
|
||||
min-height: 100%;
|
||||
|
||||
border-radius: 10px;
|
||||
-o-border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
-webkit-border-radius: 10px;
|
||||
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
a.headerlink {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
h1:hover > a.headerlink,
|
||||
h2:hover > a.headerlink,
|
||||
h3:hover > a.headerlink,
|
||||
h4:hover > a.headerlink,
|
||||
h5:hover > a.headerlink,
|
||||
h6:hover > a.headerlink,
|
||||
dt:hover > a.headerlink {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
div.figure p.caption {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
font-size: 0.5em;
|
||||
}
|
||||
|
||||
.slide-no {
|
||||
position: absolute;
|
||||
bottom: 1ex;
|
||||
right: 1em;
|
||||
font-size: 66%;
|
||||
}
|
||||
|
||||
div.admonition.note {
|
||||
visibility: hidden;
|
||||
display: none;
|
||||
}
|
||||
548
book/_templates/runestone_slides/static/slides.js
Normal file
548
book/_templates/runestone_slides/static/slides.js
Normal file
|
|
@ -0,0 +1,548 @@
|
|||
/*
|
||||
|
||||
Slide Presentation Javascript
|
||||
(consumers should include commons.js as well)
|
||||
|
||||
-----
|
||||
|
||||
Based on Google HTML5 slides template
|
||||
|
||||
Original Authors: Luke Mahé (code)
|
||||
Marcin Wichary (code and design)
|
||||
|
||||
Dominic Mazzoni (browser compatibility)
|
||||
Charles Chen (ChromeVox support)
|
||||
|
||||
URL: http://code.google.com/p/html5slides/
|
||||
|
||||
*/
|
||||
|
||||
var SlideDeck = (
|
||||
function() {
|
||||
|
||||
var
|
||||
curSlide,
|
||||
slide_console;
|
||||
|
||||
/* Slide movement */
|
||||
|
||||
function getSlideEl(no) {
|
||||
if ((no < 0) || (no >= slideEls.length)) {
|
||||
return null;
|
||||
} else {
|
||||
return slideEls[no];
|
||||
}
|
||||
};
|
||||
|
||||
function updateSlideClass(slideNo, className) {
|
||||
var el = getSlideEl(slideNo);
|
||||
|
||||
if (!el) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (className) {
|
||||
el.classList.add(className);
|
||||
}
|
||||
|
||||
for (var i in SLIDE_CLASSES) {
|
||||
if (className != SLIDE_CLASSES[i]) {
|
||||
el.classList.remove(SLIDE_CLASSES[i]);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
function updateSlides() {
|
||||
for (var i = 0; i < slideEls.length; i++) {
|
||||
switch (i) {
|
||||
case curSlide - 2:
|
||||
updateSlideClass(i, 'far-past');
|
||||
break;
|
||||
case curSlide - 1:
|
||||
updateSlideClass(i, 'past');
|
||||
break;
|
||||
case curSlide:
|
||||
updateSlideClass(i, 'current');
|
||||
break;
|
||||
case curSlide + 1:
|
||||
updateSlideClass(i, 'next');
|
||||
break;
|
||||
case curSlide + 2:
|
||||
updateSlideClass(i, 'far-next');
|
||||
break;
|
||||
default:
|
||||
updateSlideClass(i);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
triggerLeaveEvent(curSlide - 1);
|
||||
triggerEnterEvent(curSlide);
|
||||
|
||||
window.setTimeout(function() {
|
||||
// Hide after the slide
|
||||
disableSlideFrames(curSlide - 2);
|
||||
}, 301);
|
||||
|
||||
enableSlideFrames(curSlide - 1);
|
||||
enableSlideFrames(curSlide + 2);
|
||||
|
||||
if (isChromeVoxActive()) {
|
||||
speakAndSyncToNode(slideEls[curSlide]);
|
||||
}
|
||||
|
||||
updateHash();
|
||||
$(document).trigger('slidesSized');
|
||||
|
||||
// notifyListeners(
|
||||
// {command: 'cur_slide',
|
||||
// content: curSlide,
|
||||
// prev_slide: curSlide > 0 ? getSlideEl(curSlide - 1).outerHTML : '',
|
||||
// slide: getSlideEl(curSlide).outerHTML,
|
||||
// next_slide: curSlide < slideEls.length - 1 ? getSlideEl(curSlide + 1).outerHTML : ''
|
||||
// }
|
||||
// );
|
||||
|
||||
};
|
||||
|
||||
function buildNextItem() {
|
||||
var toBuild = slideEls[curSlide].querySelectorAll('.to-build');
|
||||
|
||||
if (!toBuild.length) {
|
||||
return false;
|
||||
}
|
||||
|
||||
toBuild[0].classList.remove('to-build');
|
||||
|
||||
if (isChromeVoxActive()) {
|
||||
speakAndSyncToNode(toBuild[0]);
|
||||
}
|
||||
|
||||
return true;
|
||||
};
|
||||
|
||||
|
||||
function prevSlide() {
|
||||
if (slidesContainer.classList.contains(TABLE_CLASS)) return;
|
||||
|
||||
if (curSlide > 0) {
|
||||
curSlide--;
|
||||
|
||||
updateSlides();
|
||||
}
|
||||
};
|
||||
|
||||
function nextSlide() {
|
||||
if (slidesContainer.classList.contains(TABLE_CLASS)) return;
|
||||
|
||||
if (buildNextItem()) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (curSlide < slideEls.length - 1) {
|
||||
curSlide++;
|
||||
|
||||
updateSlides();
|
||||
}
|
||||
};
|
||||
|
||||
function showSlide(e) {
|
||||
|
||||
if (!slidesContainer.classList.contains(TABLE_CLASS)) return;
|
||||
|
||||
// toggle table class
|
||||
toggleView();
|
||||
|
||||
// set curSlide
|
||||
if (e) {
|
||||
for (i = 0; i < slideEls.length; i++) {
|
||||
if (slideEls[i].contains(e.target)) {
|
||||
curSlide = i;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// update slide classes
|
||||
updateSlides();
|
||||
};
|
||||
|
||||
function toggleView() {
|
||||
for (var i = 0; i < slideEls.length; i++) {
|
||||
updateSlideClass(i);
|
||||
};
|
||||
|
||||
if (slidesContainer.classList.contains(TABLE_CLASS)) {
|
||||
// leaving table mode
|
||||
updateSlides();
|
||||
}
|
||||
|
||||
slidesContainer.classList.toggle(TABLE_CLASS);
|
||||
$(document).trigger('slidesSized');
|
||||
};
|
||||
|
||||
|
||||
/* Slide events */
|
||||
|
||||
function triggerEnterEvent(no) {
|
||||
var el = getSlideEl(no);
|
||||
if (!el) {
|
||||
return;
|
||||
}
|
||||
|
||||
var onEnter = el.getAttribute('onslideenter');
|
||||
if (onEnter) {
|
||||
new Function(onEnter).call(el);
|
||||
}
|
||||
|
||||
var evt = document.createEvent('Event');
|
||||
evt.initEvent('slideenter', true, true);
|
||||
evt.slideNumber = no + 1; // Make it readable
|
||||
|
||||
el.dispatchEvent(evt);
|
||||
};
|
||||
|
||||
function triggerLeaveEvent(no) {
|
||||
var el = getSlideEl(no);
|
||||
if (!el) {
|
||||
return;
|
||||
}
|
||||
|
||||
var onLeave = el.getAttribute('onslideleave');
|
||||
if (onLeave) {
|
||||
new Function(onLeave).call(el);
|
||||
}
|
||||
|
||||
var evt = document.createEvent('Event');
|
||||
evt.initEvent('slideleave', true, true);
|
||||
evt.slideNumber = no + 1; // Make it readable
|
||||
|
||||
el.dispatchEvent(evt);
|
||||
};
|
||||
|
||||
/* Touch events */
|
||||
|
||||
function handleTouchStart(event) {
|
||||
if (event.touches.length == 1) {
|
||||
touchDX = 0;
|
||||
touchDY = 0;
|
||||
|
||||
touchStartX = event.touches[0].pageX;
|
||||
touchStartY = event.touches[0].pageY;
|
||||
|
||||
document.body.addEventListener('touchmove', handleTouchMove, true);
|
||||
document.body.addEventListener('touchend', handleTouchEnd, true);
|
||||
}
|
||||
};
|
||||
|
||||
function handleTouchMove(event) {
|
||||
if (event.touches.length > 1) {
|
||||
cancelTouch();
|
||||
} else {
|
||||
touchDX = event.touches[0].pageX - touchStartX;
|
||||
touchDY = event.touches[0].pageY - touchStartY;
|
||||
}
|
||||
};
|
||||
|
||||
function handleTouchEnd(event) {
|
||||
var dx = Math.abs(touchDX);
|
||||
var dy = Math.abs(touchDY);
|
||||
|
||||
if ((dx > PM_TOUCH_SENSITIVITY) && (dy < (dx * 2 / 3))) {
|
||||
if (touchDX > 0) {
|
||||
prevSlide();
|
||||
} else {
|
||||
nextSlide();
|
||||
}
|
||||
}
|
||||
|
||||
cancelTouch();
|
||||
};
|
||||
|
||||
function cancelTouch() {
|
||||
document.body.removeEventListener('touchmove', handleTouchMove, true);
|
||||
document.body.removeEventListener('touchend', handleTouchEnd, true);
|
||||
};
|
||||
|
||||
/* Preloading frames */
|
||||
|
||||
function disableSlideFrames(no) {
|
||||
var el = getSlideEl(no);
|
||||
if (!el) {
|
||||
return;
|
||||
}
|
||||
|
||||
var frames = el.getElementsByTagName('iframe');
|
||||
for (var i = 0, frame; frame = frames[i]; i++) {
|
||||
disableFrame(frame);
|
||||
}
|
||||
};
|
||||
|
||||
function enableSlideFrames(no) {
|
||||
var el = getSlideEl(no);
|
||||
if (!el) {
|
||||
return;
|
||||
}
|
||||
|
||||
var frames = el.getElementsByTagName('iframe');
|
||||
for (var i = 0, frame; frame = frames[i]; i++) {
|
||||
enableFrame(frame);
|
||||
}
|
||||
};
|
||||
|
||||
function disableFrame(frame) {
|
||||
frame.src = 'about:blank';
|
||||
};
|
||||
|
||||
function enableFrame(frame) {
|
||||
var src = frame._src;
|
||||
|
||||
if (frame.src != src && src != 'about:blank') {
|
||||
frame.src = src;
|
||||
}
|
||||
};
|
||||
|
||||
function setupFrames() {
|
||||
var frames = document.querySelectorAll('iframe');
|
||||
for (var i = 0, frame; frame = frames[i]; i++) {
|
||||
frame._src = frame.src;
|
||||
disableFrame(frame);
|
||||
}
|
||||
|
||||
enableSlideFrames(curSlide);
|
||||
enableSlideFrames(curSlide + 1);
|
||||
enableSlideFrames(curSlide + 2);
|
||||
};
|
||||
|
||||
function setupInteraction() {
|
||||
/* Clicking and tapping */
|
||||
|
||||
var el = document.createElement('div');
|
||||
el.className = 'slide-area';
|
||||
el.id = 'prev-slide-area';
|
||||
el.addEventListener('click', prevSlide, false);
|
||||
document.querySelector('section.slides').appendChild(el);
|
||||
|
||||
var el = document.createElement('div');
|
||||
el.className = 'slide-area';
|
||||
el.id = 'next-slide-area';
|
||||
el.addEventListener('click', nextSlide, false);
|
||||
document.querySelector('section.slides').appendChild(el);
|
||||
|
||||
/* Swiping */
|
||||
|
||||
document.body.addEventListener('touchstart', handleTouchStart, false);
|
||||
|
||||
/* Clicking Slides */
|
||||
for (i = 0; i < slideEls.length; i++) {
|
||||
slideEls[i].addEventListener('click', showSlide, false);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/* ChromeVox support */
|
||||
|
||||
function isChromeVoxActive() {
|
||||
if (typeof(cvox) == 'undefined') {
|
||||
return false;
|
||||
} else {
|
||||
return true;
|
||||
}
|
||||
};
|
||||
|
||||
function speakAndSyncToNode(node) {
|
||||
if (!isChromeVoxActive()) {
|
||||
return;
|
||||
}
|
||||
|
||||
cvox.ChromeVox.navigationManager.switchToStrategy(
|
||||
cvox.ChromeVoxNavigationManager.STRATEGIES.LINEARDOM, 0, true);
|
||||
cvox.ChromeVox.navigationManager.syncToNode(node);
|
||||
cvox.ChromeVoxUserCommands.finishNavCommand('');
|
||||
var target = node;
|
||||
while (target.firstChild) {
|
||||
target = target.firstChild;
|
||||
}
|
||||
cvox.ChromeVox.navigationManager.syncToNode(target);
|
||||
};
|
||||
|
||||
function speakNextItem() {
|
||||
if (!isChromeVoxActive()) {
|
||||
return;
|
||||
}
|
||||
|
||||
cvox.ChromeVox.navigationManager.switchToStrategy(
|
||||
cvox.ChromeVoxNavigationManager.STRATEGIES.LINEARDOM, 0, true);
|
||||
cvox.ChromeVox.navigationManager.next(true);
|
||||
if (!cvox.DomUtil.isDescendantOfNode(
|
||||
cvox.ChromeVox.navigationManager.getCurrentNode(), slideEls[curSlide])){
|
||||
var target = slideEls[curSlide];
|
||||
while (target.firstChild) {
|
||||
target = target.firstChild;
|
||||
}
|
||||
cvox.ChromeVox.navigationManager.syncToNode(target);
|
||||
cvox.ChromeVox.navigationManager.next(true);
|
||||
}
|
||||
cvox.ChromeVoxUserCommands.finishNavCommand('');
|
||||
};
|
||||
|
||||
function speakPrevItem() {
|
||||
if (!isChromeVoxActive()) {
|
||||
return;
|
||||
}
|
||||
|
||||
cvox.ChromeVox.navigationManager.switchToStrategy(
|
||||
cvox.ChromeVoxNavigationManager.STRATEGIES.LINEARDOM, 0, true);
|
||||
cvox.ChromeVox.navigationManager.previous(true);
|
||||
if (!cvox.DomUtil.isDescendantOfNode(
|
||||
cvox.ChromeVox.navigationManager.getCurrentNode(), slideEls[curSlide])){
|
||||
var target = slideEls[curSlide];
|
||||
while (target.lastChild){
|
||||
target = target.lastChild;
|
||||
}
|
||||
cvox.ChromeVox.navigationManager.syncToNode(target);
|
||||
cvox.ChromeVox.navigationManager.previous(true);
|
||||
}
|
||||
cvox.ChromeVoxUserCommands.finishNavCommand('');
|
||||
};
|
||||
|
||||
/* Hash functions */
|
||||
|
||||
function findSlideById(title_id) {
|
||||
// Return the 1-base index of the Slide with id ``title_id``
|
||||
//
|
||||
// The index must be 1-based, as it's passed to code which assumes
|
||||
// it was specified as the location fragment.
|
||||
|
||||
for (var i = 0; i < slideEls.length; i++) {
|
||||
if (slideEls.item(i).id == title_id) {
|
||||
return i + 1;
|
||||
}
|
||||
}
|
||||
|
||||
// no match on a slide, perhaps it's an explicit reference?
|
||||
var
|
||||
target_link = document.querySelector("span[id='" + title_id + "']"),
|
||||
// XXX this is pretty strict, may need to be more flexible in the future
|
||||
slide = (target_link && target_link.parentNode);
|
||||
|
||||
if (slide && slide.tagName == 'ARTICLE') {
|
||||
return findSlideById(slide.id);
|
||||
}
|
||||
|
||||
return false;
|
||||
|
||||
};
|
||||
|
||||
function getCurSlideFromHash() {
|
||||
var slideNo = Number(location.hash.substr(1));
|
||||
|
||||
if (isNaN(slideNo)) {
|
||||
// must be a section title reference
|
||||
slideNo = findSlideById(location.hash.substr(1));
|
||||
}
|
||||
|
||||
if (slideNo) {
|
||||
curSlide = slideNo - 1;
|
||||
} else {
|
||||
curSlide = 0;
|
||||
}
|
||||
};
|
||||
|
||||
function updateHash() {
|
||||
location.replace('#' + (curSlide + 1));
|
||||
};
|
||||
|
||||
/* Event listeners */
|
||||
|
||||
|
||||
|
||||
|
||||
function addEventListeners() {
|
||||
|
||||
};
|
||||
|
||||
/* Initialization */
|
||||
|
||||
function addGeneralStyle() {
|
||||
var el = document.createElement('meta');
|
||||
el.name = 'viewport';
|
||||
el.content = 'width=1100,height=750';
|
||||
document.querySelector('head').appendChild(el);
|
||||
|
||||
var el = document.createElement('meta');
|
||||
el.name = 'apple-mobile-web-app-capable';
|
||||
el.content = 'yes';
|
||||
document.querySelector('head').appendChild(el);
|
||||
};
|
||||
|
||||
function makeBuildLists() {
|
||||
for (var i = curSlide, slide; slide = slideEls[i]; i++) {
|
||||
var items = slide.querySelectorAll('.build > *');
|
||||
for (var j = 0, item; item = items[j]; j++) {
|
||||
if (item.classList) {
|
||||
item.classList.add('to-build');
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
function handleDomLoaded() {
|
||||
slidesContainer = document.querySelector('section.slides');
|
||||
slideEls = document.querySelectorAll(SLIDES_SELECTOR);
|
||||
|
||||
getCurSlideFromHash();
|
||||
setupFrames();
|
||||
|
||||
addGeneralStyle();
|
||||
addEventListeners();
|
||||
|
||||
updateSlides();
|
||||
|
||||
setupInteraction();
|
||||
makeBuildLists();
|
||||
|
||||
document.body.classList.add('loaded');
|
||||
$(document).trigger('slidesSized');
|
||||
};
|
||||
|
||||
|
||||
var
|
||||
|
||||
getLocation = function () {
|
||||
return curSlide;
|
||||
},
|
||||
|
||||
setLocation = function (slide) {
|
||||
curSlide = slide;
|
||||
updateSlides();
|
||||
},
|
||||
|
||||
getLength = function () {
|
||||
return slideEls.length;
|
||||
},
|
||||
|
||||
init = function () {
|
||||
document.addEventListener('DOMContentLoaded', handleDomLoaded, false);
|
||||
};
|
||||
|
||||
|
||||
init();
|
||||
|
||||
return {
|
||||
curSlide: getLocation,
|
||||
location: getLocation,
|
||||
setLocation: setLocation,
|
||||
|
||||
toggleView: toggleView,
|
||||
|
||||
length: getLength,
|
||||
|
||||
getSlideEl: getSlideEl,
|
||||
|
||||
nextSlide: nextSlide,
|
||||
prevSlide: prevSlide
|
||||
};
|
||||
|
||||
}());
|
||||
723
book/_templates/runestone_slides/static/styles.css
Normal file
723
book/_templates/runestone_slides/static/styles.css
Normal file
|
|
@ -0,0 +1,723 @@
|
|||
@import url(fonts/stylesheet.css);
|
||||
|
||||
/*
|
||||
Google HTML5 slides template
|
||||
|
||||
Authors: Luke Mahé (code)
|
||||
Marcin Wichary (code and design)
|
||||
|
||||
Dominic Mazzoni (browser compatibility)
|
||||
Charles Chen (ChromeVox support)
|
||||
|
||||
URL: http://code.google.com/p/html5slides/
|
||||
*/
|
||||
|
||||
/* Framework */
|
||||
|
||||
html {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
display: block !important;
|
||||
|
||||
height: 100%;
|
||||
min-height: 740px;
|
||||
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
|
||||
background: rgb(215, 215, 215);
|
||||
background: -o-radial-gradient(rgb(240, 240, 240), rgb(190, 190, 190));
|
||||
background: -moz-radial-gradient(rgb(240, 240, 240), rgb(190, 190, 190));
|
||||
background: -webkit-radial-gradient(rgb(240, 240, 240), rgb(190, 190, 190));
|
||||
background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 500, from(rgb(240, 240, 240)), to(rgb(190, 190, 190)));
|
||||
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.slides {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
|
||||
position: absolute;
|
||||
|
||||
-webkit-transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
.slides > article {
|
||||
display: block;
|
||||
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
|
||||
width: 900px;
|
||||
height: 700px;
|
||||
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
|
||||
margin-left: -450px;
|
||||
margin-top: -350px;
|
||||
|
||||
padding: 40px 60px;
|
||||
|
||||
box-sizing: border-box;
|
||||
-o-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
|
||||
border-radius: 10px;
|
||||
-o-border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
-webkit-border-radius: 10px;
|
||||
|
||||
background-color: white;
|
||||
|
||||
box-shadow: 0 2px 6px rgba(0, 0, 0, .1);
|
||||
border: 1px solid rgba(0, 0, 0, .3);
|
||||
|
||||
transition: transform .3s ease-out;
|
||||
-o-transition: -o-transform .3s ease-out;
|
||||
-moz-transition: -moz-transform .3s ease-out;
|
||||
-webkit-transition: -webkit-transform .3s ease-out;
|
||||
}
|
||||
.slides.layout-widescreen > article {
|
||||
margin-left: -550px;
|
||||
width: 1100px;
|
||||
}
|
||||
.slides.layout-faux-widescreen > article {
|
||||
margin-left: -550px;
|
||||
width: 1100px;
|
||||
|
||||
padding: 40px 160px;
|
||||
}
|
||||
|
||||
.slides.layout-widescreen > article:not(.nobackground):not(.biglogo),
|
||||
.slides.layout-faux-widescreen > article:not(.nobackground):not(.biglogo) {
|
||||
background-position-x: 0, 840px;
|
||||
}
|
||||
|
||||
.slides > article.appear {
|
||||
transition: none;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.slides > article.fade-in {
|
||||
transition: opacity 0.2s;
|
||||
}
|
||||
|
||||
.slides > article.fade-in.current {
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.slides .handout {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.slides.table {
|
||||
font-size: 15px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.slides.table > .slide-area {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.slides.table > article:hover {
|
||||
-moz-box-shadow: 0px 0px 20px yellow;
|
||||
-webkit-box-shadow: 0px 0px 20px yellow;
|
||||
box-shadow: 0px 0px 20px yellow;
|
||||
border: 2px;
|
||||
}
|
||||
|
||||
.slides.table > article {
|
||||
display: block;
|
||||
float: left;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
|
||||
width: 450px;
|
||||
height: 350px;
|
||||
|
||||
left: 0;
|
||||
top: 0;
|
||||
|
||||
margin: 10px;
|
||||
|
||||
padding: 20px 30px;
|
||||
|
||||
box-sizing: border-box;
|
||||
-o-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
|
||||
border-radius: 10px;
|
||||
-o-border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
-webkit-border-radius: 10px;
|
||||
|
||||
box-shadow: 0 2px 6px rgba(0, 0, 0, .1);
|
||||
border: 1px solid rgba(0, 0, 0, .3);
|
||||
|
||||
/* transform: scale(0.5); */
|
||||
/* -webkit-transform: scale(0.5); */
|
||||
transition: width height .3s ease-out;
|
||||
-o-transition: -o-transform .3s ease-out;
|
||||
-moz-transition: -moz-transform .3s ease-out;
|
||||
-webkit-transition: width height .3s ease-out;
|
||||
}
|
||||
|
||||
.slides.table > article,
|
||||
.slides.table > article.next,
|
||||
.slides.table > article.far-past,
|
||||
.slides.table > article.past,
|
||||
.slides.table > article.current,
|
||||
.slides.table > article.far-next {
|
||||
display: block;
|
||||
transform: translate(0px);
|
||||
-o-transform: translate(0px);
|
||||
-moz-transform: translate(0px);
|
||||
-webkit-transform: translate(0px);
|
||||
}
|
||||
|
||||
.slides.table > article .to-build {
|
||||
opacity: 100;
|
||||
}
|
||||
|
||||
/* Clickable/tappable areas */
|
||||
|
||||
.slide-area {
|
||||
z-index: 1000;
|
||||
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 150px;
|
||||
height: 700px;
|
||||
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
|
||||
cursor: pointer;
|
||||
margin-top: -350px;
|
||||
|
||||
tap-highlight-color: transparent;
|
||||
-o-tap-highlight-color: transparent;
|
||||
-moz-tap-highlight-color: transparent;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
#prev-slide-area {
|
||||
margin-left: -550px;
|
||||
}
|
||||
#next-slide-area {
|
||||
margin-left: 400px;
|
||||
}
|
||||
.slides.layout-widescreen #prev-slide-area,
|
||||
.slides.layout-faux-widescreen #prev-slide-area {
|
||||
margin-left: -650px;
|
||||
}
|
||||
.slides.layout-widescreen #next-slide-area,
|
||||
.slides.layout-faux-widescreen #next-slide-area {
|
||||
margin-left: 500px;
|
||||
}
|
||||
|
||||
/* Slides */
|
||||
|
||||
.slides > article {
|
||||
display: none;
|
||||
}
|
||||
.slides > article.far-past {
|
||||
display: block;
|
||||
transform: translate(-2040px);
|
||||
-o-transform: translate(-2040px);
|
||||
-moz-transform: translate(-2040px);
|
||||
-webkit-transform: translate3d(-2040px, 0, 0);
|
||||
}
|
||||
.slides > article.past {
|
||||
display: block;
|
||||
transform: translate(-1020px);
|
||||
-o-transform: translate(-1020px);
|
||||
-moz-transform: translate(-1020px);
|
||||
-webkit-transform: translate3d(-1020px, 0, 0);
|
||||
}
|
||||
.slides > article.current {
|
||||
display: block;
|
||||
opacity: 1;
|
||||
transform: translate(0);
|
||||
-o-transform: translate(0);
|
||||
-moz-transform: translate(0);
|
||||
-webkit-transform: translate3d(0, 0, 0);
|
||||
}
|
||||
.slides > article.next {
|
||||
display: block;
|
||||
transform: translate(1020px);
|
||||
-o-transform: translate(1020px);
|
||||
-moz-transform: translate(1020px);
|
||||
-webkit-transform: translate3d(1020px, 0, 0);
|
||||
}
|
||||
.slides > article.far-next {
|
||||
display: block;
|
||||
transform: translate(2040px);
|
||||
-o-transform: translate(2040px);
|
||||
-moz-transform: translate(2040px);
|
||||
-webkit-transform: translate3d(2040px, 0, 0);
|
||||
}
|
||||
|
||||
.slides.layout-widescreen > article.far-past,
|
||||
.slides.layout-faux-widescreen > article.far-past {
|
||||
display: block;
|
||||
transform: translate(-2260px);
|
||||
-o-transform: translate(-2260px);
|
||||
-moz-transform: translate(-2260px);
|
||||
-webkit-transform: translate3d(-2260px, 0, 0);
|
||||
}
|
||||
.slides.layout-widescreen > article.past,
|
||||
.slides.layout-faux-widescreen > article.past {
|
||||
display: block;
|
||||
transform: translate(-1130px);
|
||||
-o-transform: translate(-1130px);
|
||||
-moz-transform: translate(-1130px);
|
||||
-webkit-transform: translate3d(-1130px, 0, 0);
|
||||
}
|
||||
.slides.layout-widescreen > article.current,
|
||||
.slides.layout-faux-widescreen > article.current {
|
||||
display: block;
|
||||
transform: translate(0);
|
||||
-o-transform: translate(0);
|
||||
-moz-transform: translate(0);
|
||||
-webkit-transform: translate3d(0, 0, 0);
|
||||
}
|
||||
.slides.layout-widescreen > article.next,
|
||||
.slides.layout-faux-widescreen > article.next {
|
||||
display: block;
|
||||
transform: translate(1130px);
|
||||
-o-transform: translate(1130px);
|
||||
-moz-transform: translate(1130px);
|
||||
-webkit-transform: translate3d(1130px, 0, 0);
|
||||
}
|
||||
.slides.layout-widescreen > article.far-next,
|
||||
.slides.layout-faux-widescreen > article.far-next {
|
||||
display: block;
|
||||
transform: translate(2260px);
|
||||
-o-transform: translate(2260px);
|
||||
-moz-transform: translate(2260px);
|
||||
-webkit-transform: translate3d(2260px, 0, 0);
|
||||
}
|
||||
|
||||
.slides > article.fade-in.next,
|
||||
.slides > article.fade-in.far-past,
|
||||
.slides > article.fade-in.past,
|
||||
.slides > article.fade-in.far-next {
|
||||
opacity: 0;
|
||||
transform: translate(0px);
|
||||
-o-transform: translate(0px);
|
||||
-moz-transform: translate(0px);
|
||||
-webkit-transform: translate(0px);
|
||||
}
|
||||
|
||||
.slides > article.appear.next,
|
||||
.slides > article.appear.far-past,
|
||||
.slides > article.appear.past,
|
||||
.slides > article.appear.far-next {
|
||||
display: none;
|
||||
transform: translate(0px);
|
||||
-o-transform: translate(0px);
|
||||
-moz-transform: translate(0px);
|
||||
-webkit-transform: translate(0px);
|
||||
}
|
||||
|
||||
|
||||
/* Styles for slides */
|
||||
|
||||
.slides {
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.slides > article {
|
||||
font-family: 'Open Sans', Arial, sans-serif;
|
||||
|
||||
color: rgb(102, 102, 102);
|
||||
text-shadow: 0 1px 1px rgba(0, 0, 0, .1);
|
||||
|
||||
font-size: 1em;
|
||||
line-height: 1.2em;
|
||||
|
||||
letter-spacing: -1px;
|
||||
}
|
||||
|
||||
b {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.blue {
|
||||
color: rgb(0, 102, 204);
|
||||
}
|
||||
.yellow {
|
||||
color: rgb(255, 211, 25);
|
||||
}
|
||||
.green {
|
||||
color: rgb(0, 138, 53);
|
||||
}
|
||||
.red {
|
||||
color: rgb(255, 0, 0);
|
||||
}
|
||||
.black {
|
||||
color: black;
|
||||
}
|
||||
.white {
|
||||
color: white;
|
||||
}
|
||||
|
||||
a {
|
||||
color: rgb(0, 102, 204);
|
||||
}
|
||||
a:visited {
|
||||
color: rgba(0, 102, 204, .75);
|
||||
}
|
||||
a:hover {
|
||||
color: black;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
margin-top: 20px;
|
||||
}
|
||||
p:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
line-height: 1em;
|
||||
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
margin-top: 200px;
|
||||
padding-right: 40px;
|
||||
|
||||
font-weight: 600;
|
||||
|
||||
letter-spacing: -3px;
|
||||
|
||||
color: rgb(51, 51, 51);
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.5em;
|
||||
line-height: 1em;
|
||||
|
||||
position: absolute;
|
||||
bottom: 150px;
|
||||
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
padding-right: 40px;
|
||||
|
||||
font-weight: 600;
|
||||
|
||||
letter-spacing: -2px;
|
||||
|
||||
color: rgb(51, 51, 51);
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1em;
|
||||
line-height: 1.2em;
|
||||
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
padding-right: 40px;
|
||||
|
||||
font-weight: 600;
|
||||
|
||||
letter-spacing: -1px;
|
||||
|
||||
color: rgb(51, 51, 51);
|
||||
}
|
||||
|
||||
article.fill h3 {
|
||||
background: rgba(255, 255, 255, .75);
|
||||
padding-top: .2em;
|
||||
padding-bottom: .3em;
|
||||
margin-top: -.2em;
|
||||
margin-left: -60px;
|
||||
padding-left: 60px;
|
||||
margin-right: -60px;
|
||||
padding-right: 60px;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
margin-top: 40px;
|
||||
|
||||
margin-left: .75em;
|
||||
}
|
||||
ul ul {
|
||||
margin-top: .5em;
|
||||
}
|
||||
li {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
margin-bottom: .5em;
|
||||
}
|
||||
ul li::before {
|
||||
content: '·';
|
||||
|
||||
width: .75em;
|
||||
margin-left: -.75em;
|
||||
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
pre {
|
||||
font-family: 'Droid Sans Mono', 'Courier New', monospace;
|
||||
|
||||
font-size: 0.66em;
|
||||
line-height: 1.4em;
|
||||
padding: 5px 10px;
|
||||
|
||||
letter-spacing: -1px;
|
||||
|
||||
margin-top: 40px;
|
||||
margin-bottom: 40px;
|
||||
|
||||
color: black;
|
||||
background: rgb(240, 240, 240);
|
||||
border: 1px solid rgb(224, 224, 224);
|
||||
box-shadow: inset 0 2px 6px rgba(0, 0, 0, .1);
|
||||
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
code {
|
||||
font-size: 95%;
|
||||
font-family: 'Droid Sans Mono', 'Courier New', monospace;
|
||||
|
||||
color: black;
|
||||
}
|
||||
|
||||
iframe {
|
||||
width: 100%;
|
||||
|
||||
height: 620px;
|
||||
|
||||
background: white;
|
||||
border: 1px solid rgb(192, 192, 192);
|
||||
margin: -1px;
|
||||
/*box-shadow: inset 0 2px 6px rgba(0, 0, 0, .1);*/
|
||||
}
|
||||
|
||||
h3 + iframe {
|
||||
margin-top: 40px;
|
||||
height: 540px;
|
||||
}
|
||||
|
||||
article.fill iframe {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
border: 0;
|
||||
margin: 0;
|
||||
|
||||
border-radius: 10px;
|
||||
-o-border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
-webkit-border-radius: 10px;
|
||||
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
article.fill img {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
min-width: 100%;
|
||||
min-height: 100%;
|
||||
|
||||
border-radius: 10px;
|
||||
-o-border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
-webkit-border-radius: 10px;
|
||||
|
||||
z-index: -1;
|
||||
}
|
||||
img.centered {
|
||||
margin: 0 auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin-top: 40px;
|
||||
}
|
||||
th {
|
||||
font-weight: 600;
|
||||
text-align: left;
|
||||
}
|
||||
td,
|
||||
th {
|
||||
border: 1px solid rgb(224, 224, 224);
|
||||
padding: 5px 10px;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.source {
|
||||
position: absolute;
|
||||
left: 60px;
|
||||
top: 644px;
|
||||
padding-right: 175px;
|
||||
|
||||
font-size: 0.5em;
|
||||
letter-spacing: 0;
|
||||
line-height: 18px;
|
||||
}
|
||||
|
||||
q {
|
||||
display: block;
|
||||
font-size: 2em;
|
||||
line-height: 72px;
|
||||
|
||||
margin-left: 20px;
|
||||
|
||||
margin-top: 100px;
|
||||
margin-right: 150px;
|
||||
}
|
||||
q::before {
|
||||
content: '“';
|
||||
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
margin-left: -2.1em;
|
||||
width: 2em;
|
||||
text-align: right;
|
||||
|
||||
font-size: 3em;
|
||||
color: rgb(192, 192, 192);
|
||||
}
|
||||
q::after {
|
||||
content: '”';
|
||||
|
||||
position: absolute;
|
||||
margin-left: .1em;
|
||||
|
||||
font-size: 3em;
|
||||
color: rgb(192, 192, 192);
|
||||
}
|
||||
div.author {
|
||||
text-align: right;
|
||||
font-size: 1.33em;
|
||||
|
||||
margin-top: 20px;
|
||||
margin-right: 150px;
|
||||
}
|
||||
div.author::before {
|
||||
content: '—';
|
||||
}
|
||||
|
||||
/* Size variants */
|
||||
|
||||
article.smaller p,
|
||||
article.smaller ul {
|
||||
font-size: 0.66em;
|
||||
line-height: 1.2em;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
article.smaller table {
|
||||
font-size: 0.66em;
|
||||
line-height: 1.2em;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
article.smaller pre {
|
||||
font-size: 0.5em;
|
||||
line-height: 1.33em;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
article.smaller q {
|
||||
font-size: 1.33em;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
article.smaller q::before,
|
||||
article.smaller q::after {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
/* Builds */
|
||||
|
||||
.build > * {
|
||||
transition: opacity 0.5s ease-in-out 0.2s;
|
||||
-o-transition: opacity 0.5s ease-in-out 0.2s;
|
||||
-moz-transition: opacity 0.5s ease-in-out 0.2s;
|
||||
-webkit-transition: opacity 0.5s ease-in-out 0.2s;
|
||||
}
|
||||
|
||||
.to-build {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* Pretty print */
|
||||
|
||||
.prettyprint .str, /* string content */
|
||||
.prettyprint .atv { /* a markup attribute value */
|
||||
color: rgb(0, 138, 53);
|
||||
}
|
||||
.prettyprint .kwd, /* a keyword */
|
||||
.prettyprint .tag { /* a markup tag name */
|
||||
color: rgb(0, 102, 204);
|
||||
}
|
||||
.prettyprint .com { /* a comment */
|
||||
color: rgb(127, 127, 127);
|
||||
font-style: italic;
|
||||
}
|
||||
.prettyprint .lit { /* a literal value */
|
||||
color: rgb(127, 0, 0);
|
||||
}
|
||||
.prettyprint .pun, /* punctuation, lisp open bracket, lisp close bracket */
|
||||
.prettyprint .opn,
|
||||
.prettyprint .clo {
|
||||
color: rgb(127, 127, 127);
|
||||
}
|
||||
.prettyprint .typ, /* a type name */
|
||||
.prettyprint .atn, /* a markup attribute name */
|
||||
.prettyprint .dec,
|
||||
.prettyprint .var { /* a declaration; a variable name */
|
||||
color: rgb(127, 0, 127);
|
||||
}
|
||||
|
||||
@media print {
|
||||
|
||||
.slides > article,
|
||||
.slides > article.far-past,
|
||||
.slides > article.past,
|
||||
.slides > article.next,
|
||||
.slides > article.far-next {
|
||||
|
||||
position: static;
|
||||
overflow: hidden;
|
||||
display: block !important;
|
||||
|
||||
margin: auto;
|
||||
page-break-after: always;
|
||||
page-break-inside: avoid;
|
||||
|
||||
transform: none;
|
||||
-o-transform: none;
|
||||
-moz-transform: none;
|
||||
-webkit-transform: none;
|
||||
}
|
||||
|
||||
}
|
||||
129
book/_templates/runestone_slides/static/sync.js
Normal file
129
book/_templates/runestone_slides/static/sync.js
Normal file
|
|
@ -0,0 +1,129 @@
|
|||
var SlideSync = (
|
||||
function() {
|
||||
|
||||
var
|
||||
slides,
|
||||
slide_listeners = [],
|
||||
|
||||
showConsole = function(e) {
|
||||
slide_console = window.open(
|
||||
DOCUMENTATION_OPTIONS.URL_ROOT + 'console.html',
|
||||
'console',
|
||||
"menubar=no,location=no,resizable=yes,scrollbars=yes,status=yes");
|
||||
},
|
||||
|
||||
nextSlide = function() {
|
||||
slides.nextSlide();
|
||||
|
||||
sendCommand('nextSlide');
|
||||
sendCurSlide();
|
||||
},
|
||||
|
||||
prevSlide = function() {
|
||||
slides.prevSlide();
|
||||
|
||||
sendCommand('prevSlide');
|
||||
sendCurSlide();
|
||||
},
|
||||
|
||||
sendCurSlide = function() {
|
||||
|
||||
var curSlide = slides.curSlide();
|
||||
|
||||
notifyListeners(
|
||||
{command: 'cur_slide',
|
||||
content: curSlide,
|
||||
prev_slide: curSlide > 0 ? slides.getSlideEl(curSlide - 1).outerHTML : '',
|
||||
slide: slides.getSlideEl(curSlide).outerHTML,
|
||||
next_slide: curSlide < slides.length() - 1 ? slides.getSlideEl(curSlide + 1).outerHTML : ''
|
||||
}
|
||||
);
|
||||
|
||||
},
|
||||
|
||||
notifyListeners = function (message) {
|
||||
|
||||
for (var i = 0; i < slide_listeners.length; i++) {
|
||||
slide_listeners[i].postMessage(message, '*');
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
sendCommand = function(command) {
|
||||
return sendMessage({'command':command});
|
||||
},
|
||||
|
||||
sendMessage = function(message) {
|
||||
notifyListeners(message);
|
||||
},
|
||||
|
||||
handleMessage = function(message, source) {
|
||||
|
||||
console.log(message);
|
||||
|
||||
switch (message.command) {
|
||||
|
||||
case 'register':
|
||||
slide_listeners.push(source);
|
||||
sendMessage(
|
||||
{command: 'num_slides',
|
||||
content: slideEls.length
|
||||
}
|
||||
);
|
||||
break;
|
||||
|
||||
case 'nextSlide':
|
||||
slides.nextSlide();
|
||||
break;
|
||||
|
||||
case 'prevSlide':
|
||||
slides.prevSlide();
|
||||
break;
|
||||
|
||||
};
|
||||
|
||||
sendCurSlide();
|
||||
|
||||
},
|
||||
|
||||
onKeyDown = function (event) {
|
||||
|
||||
switch (event.keyCode) {
|
||||
|
||||
case 84: // t
|
||||
slides.toggleView && slides.toggleView();
|
||||
break;
|
||||
|
||||
case 67: // c
|
||||
showConsole();
|
||||
break;
|
||||
}
|
||||
},
|
||||
|
||||
init = function(slidedeck) {
|
||||
slides = slidedeck;
|
||||
|
||||
// attach event handlers
|
||||
document.addEventListener('keydown', onKeyDown, false);
|
||||
window.addEventListener(
|
||||
'message',
|
||||
function(e) {
|
||||
return handleMessage(e.data, e.source);
|
||||
}, false);
|
||||
|
||||
};
|
||||
|
||||
|
||||
return {
|
||||
init: init,
|
||||
showConsole: showConsole,
|
||||
|
||||
nextSlide: nextSlide,
|
||||
prevSlide: prevSlide,
|
||||
|
||||
handleMessage: handleMessage,
|
||||
sendMessage: sendMessage,
|
||||
sendCommand: sendCommand
|
||||
};
|
||||
|
||||
}());
|
||||
3
book/_templates/runestone_slides/static/theme.css
Normal file
3
book/_templates/runestone_slides/static/theme.css
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
a.headerlink {
|
||||
display: none;
|
||||
}
|
||||
Loading…
Reference in a new issue