Browse Source

Initial commit.

master
Greg 1 year ago
commit
fbe9009d23
  1. BIN
      accel.jpg
  2. BIN
      ble.png
  3. 60
      core/deck.core.css
  4. 748
      core/deck.core.js
  5. 65
      core/deck.core.scss
  6. 25
      core/print.css
  7. 14
      core/print.scss
  8. 36
      extensions/goto/deck.goto.css
  9. 7
      extensions/goto/deck.goto.html
  10. 190
      extensions/goto/deck.goto.js
  11. 39
      extensions/goto/deck.goto.scss
  12. 45
      extensions/menu/deck.menu.css
  13. 225
      extensions/menu/deck.menu.js
  14. 55
      extensions/menu/deck.menu.scss
  15. 42
      extensions/navigation/deck.navigation.css
  16. 5
      extensions/navigation/deck.navigation.html
  17. 94
      extensions/navigation/deck.navigation.js
  18. 44
      extensions/navigation/deck.navigation.scss
  19. 20
      extensions/scale/deck.scale.css
  20. 190
      extensions/scale/deck.scale.js
  21. 22
      extensions/scale/deck.scale.scss
  22. 18
      extensions/status/deck.status.css
  23. 6
      extensions/status/deck.status.html
  24. 108
      extensions/status/deck.status.js
  25. 18
      extensions/status/deck.status.scss
  26. BIN
      fragment.png
  27. 407
      godoc-style.css
  28. 215
      introduction/index.html
  29. BIN
      jni.png
  30. 640
      jni/jni - The Go Programming Language_files/godocs.js
  31. 2
      jni/jni - The Go Programming Language_files/jquery.js
  32. 872
      jni/jni - The Go Programming Language_files/style.css
  33. 1377
      jni/jni.html
  34. 6
      jquery.min.js
  35. 732
      main.html
  36. 4
      modernizr.custom.js
  37. BIN
      nswrap-git.png
  38. 300
      themes/style/_reset.scss
  39. 421
      themes/style/neon.css
  40. 148
      themes/style/neon.scss
  41. 389
      themes/style/swiss.css
  42. 109
      themes/style/swiss.scss
  43. 500
      themes/style/web-2.0.css
  44. 228
      themes/style/web-2.0.scss
  45. 35
      themes/transition/fade.css
  46. 59
      themes/transition/fade.scss
  47. 53
      themes/transition/horizontal-slide.css
  48. 72
      themes/transition/horizontal-slide.scss
  49. 67
      themes/transition/vertical-slide.css
  50. 92
      themes/transition/vertical-slide.scss

BIN
accel.jpg

After

Width: 1440  |  Height: 1109  |  Size: 77 KiB

BIN
ble.png

After

Width: 2182  |  Height: 1984  |  Size: 378 KiB

60
core/deck.core.css

@ -0,0 +1,60 @@
html, body {
height: 100%;
padding: 0;
margin: 0;
}
.deck-container {
position: relative;
min-height: 100%;
margin: 0 auto;
overflow: hidden;
overflow-y: auto;
}
.js .deck-container {
visibility: hidden;
}
.ready .deck-container {
visibility: visible;
}
.touch .deck-container {
-webkit-text-size-adjust: none;
-moz-text-size-adjust: none;
}
.deck-loading {
display: none;
}
.slide {
width: auto;
min-height: 100%;
position: relative;
}
.deck-before, .deck-previous, .deck-next, .deck-after {
position: absolute;
left: -999em;
top: -999em;
}
.deck-current {
z-index: 2;
}
.slide .slide {
visibility: hidden;
position: static;
min-height: 0;
}
.deck-child-current {
position: static;
z-index: 2;
}
.deck-child-current .slide {
visibility: hidden;
}
.deck-child-current .deck-previous, .deck-child-current .deck-before, .deck-child-current .deck-current {
visibility: visible;
}

748
core/deck.core.js

@ -0,0 +1,748 @@
/*!
Deck JS - deck.core
Copyright (c) 2011-2014 Caleb Troughton
Dual licensed under the MIT license.
https://github.com/imakewebthings/deck.js/blob/master/MIT-license.txt
*/
/*
The deck.core module provides all the basic functionality for creating and
moving through a deck. It does so by applying classes to indicate the state of
the deck and its slides, allowing CSS to take care of the visual representation
of each state. It also provides methods for navigating the deck and inspecting
its state, as well as basic key bindings for going to the next and previous
slides. More functionality is provided by wholly separate extension modules
that use the API provided by core.
*/
(function($, undefined) {
var slides, currentIndex, $container, $fragmentLinks;
var events = {
/*
This event fires at the beginning of a slide change, before the actual
change occurs. Its purpose is to give extension authors a way to prevent
the slide change from occuring. This is done by calling preventDefault
on the event object within this event. If that is done, the deck.change
event will never be fired and the slide will not change.
*/
beforeChange: 'deck.beforeChange',
/*
This event fires whenever the current slide changes, whether by way of
next, prev, or go. The callback function is passed two parameters, from
and to, equal to the indices of the old slide and the new slide
respectively. If preventDefault is called on the event within this handler
the slide change does not occur.
$(document).bind('deck.change', function(event, from, to) {
alert('Moving from slide ' + from + ' to ' + to);
});
*/
change: 'deck.change',
/*
This event fires at the beginning of deck initialization. This event makes
a good hook for preprocessing extensions looking to modify the DOM before
the deck is fully initialized. It is also possible to halt the deck.init
event from firing while you do things in beforeInit. This can be done by
calling lockInit on the event object passed to this event. The init can be
released by calling releaseInit.
$(document).bind('deck.beforeInit', function(event) {
event.lockInit(); // halts deck.init event
window.setTimeout(function() {
event.releaseInit(); // deck.init will now fire 2 seconds later
}, 2000);
});
The init event will be fired regardless of locks after
options.initLockTimeout milliseconds.
*/
beforeInitialize: 'deck.beforeInit',
/*
This event fires at the end of deck initialization. Extensions should
implement any code that relies on user extensible options (key bindings,
element selectors, classes) within a handler for this event. Native
events associated with Deck JS should be scoped under a .deck event
namespace, as with the example below:
var $d = $(document);
$.deck.defaults.keys.myExtensionKeycode = 70; // 'h'
$d.bind('deck.init', function() {
$d.bind('keydown.deck', function(event) {
if (event.which === $.deck.getOptions().keys.myExtensionKeycode) {
// Rock out
}
});
});
*/
initialize: 'deck.init'
};
var options = {};
var $document = $(document);
var $window = $(window);
var stopPropagation = function(event) {
event.stopPropagation();
};
var updateContainerState = function() {
var oldIndex = $container.data('onSlide');
$container.removeClass(options.classes.onPrefix + oldIndex);
$container.addClass(options.classes.onPrefix + currentIndex);
$container.data('onSlide', currentIndex);
};
var updateChildCurrent = function() {
var $oldCurrent = $('.' + options.classes.current);
var $oldParents = $oldCurrent.parentsUntil(options.selectors.container);
var $newCurrent = slides[currentIndex];
var $newParents = $newCurrent.parentsUntil(options.selectors.container);
$oldParents.removeClass(options.classes.childCurrent);
$newParents.addClass(options.classes.childCurrent);
};
var removeOldSlideStates = function() {
var $all = $();
$.each(slides, function(i, el) {
$all = $all.add(el);
});
$all.removeClass([
options.classes.before,
options.classes.previous,
options.classes.current,
options.classes.next,
options.classes.after
].join(' '));
};
var addNewSlideStates = function() {
slides[currentIndex].addClass(options.classes.current);
if (currentIndex > 0) {
slides[currentIndex-1].addClass(options.classes.previous);
}
if (currentIndex + 1 < slides.length) {
slides[currentIndex+1].addClass(options.classes.next);
}
if (currentIndex > 1) {
$.each(slides.slice(0, currentIndex - 1), function(i, $slide) {
$slide.addClass(options.classes.before);
});
}
if (currentIndex + 2 < slides.length) {
$.each(slides.slice(currentIndex+2), function(i, $slide) {
$slide.addClass(options.classes.after);
});
}
};
var setAriaHiddens = function() {
$(options.selectors.slides).each(function() {
var $slide = $(this);
var isSub = $slide.closest('.' + options.classes.childCurrent).length;
var isBefore = $slide.hasClass(options.classes.before) && !isSub;
var isPrevious = $slide.hasClass(options.classes.previous) && !isSub;
var isNext = $slide.hasClass(options.classes.next);
var isAfter = $slide.hasClass(options.classes.after);
var ariaHiddenValue = isBefore || isPrevious || isNext || isAfter;
$slide.attr('aria-hidden', ariaHiddenValue);
});
};
var updateStates = function() {
updateContainerState();
updateChildCurrent();
removeOldSlideStates();
addNewSlideStates();
if (options.setAriaHiddens) {
setAriaHiddens();
}
};
var initSlidesArray = function(elements) {
if ($.isArray(elements)) {
$.each(elements, function(i, element) {
slides.push($(element));
});
}
else {
$(elements).each(function(i, element) {
slides.push($(element));
});
}
};
var bindKeyEvents = function() {
var editables = [
'input',
'textarea',
'select',
'button',
'meter',
'progress',
'[contentEditable]'
].join(', ');
$document.unbind('keydown.deck').bind('keydown.deck', function(event) {
var isNext = event.which === options.keys.next;
var isPrev = event.which === options.keys.previous;
isNext = isNext || $.inArray(event.which, options.keys.next) > -1;
isPrev = isPrev || $.inArray(event.which, options.keys.previous) > -1;
if (isNext) {
methods.next();
event.preventDefault();
}
else if (isPrev) {
methods.prev();
event.preventDefault();
}
});
$document.undelegate(editables, 'keydown.deck', stopPropagation);
$document.delegate(editables, 'keydown.deck', stopPropagation);
};
var bindTouchEvents = function() {
var startTouch;
var direction = options.touch.swipeDirection;
var tolerance = options.touch.swipeTolerance;
var listenToHorizontal = ({ both: true, horizontal: true })[direction];
var listenToVertical = ({ both: true, vertical: true })[direction];
$container.unbind('touchstart.deck');
$container.bind('touchstart.deck', function(event) {
if (!startTouch) {
startTouch = $.extend({}, event.originalEvent.targetTouches[0]);
}
});
$container.unbind('touchmove.deck');
$container.bind('touchmove.deck', function(event) {
$.each(event.originalEvent.changedTouches, function(i, touch) {
if (!startTouch || touch.identifier !== startTouch.identifier) {
return true;
}
var xDistance = touch.screenX - startTouch.screenX;
var yDistance = touch.screenY - startTouch.screenY;
var leftToRight = xDistance > tolerance && listenToHorizontal;
var rightToLeft = xDistance < -tolerance && listenToHorizontal;
var topToBottom = yDistance > tolerance && listenToVertical;
var bottomToTop = yDistance < -tolerance && listenToVertical;
if (leftToRight || topToBottom) {
$.deck('prev');
startTouch = undefined;
}
else if (rightToLeft || bottomToTop) {
$.deck('next');
startTouch = undefined;
}
return false;
});
if (listenToVertical) {
event.preventDefault();
}
});
$container.unbind('touchend.deck');
$container.bind('touchend.deck', function(event) {
$.each(event.originalEvent.changedTouches, function(i, touch) {
if (startTouch && touch.identifier === startTouch.identifier) {
startTouch = undefined;
}
});
});
};
var indexInBounds = function(index) {
return typeof index === 'number' && index >=0 && index < slides.length;
};
var createBeforeInitEvent = function() {
var event = $.Event(events.beforeInitialize);
event.locks = 0;
event.done = $.noop;
event.lockInit = function() {
++event.locks;
};
event.releaseInit = function() {
--event.locks;
if (!event.locks) {
event.done();
}
};
return event;
};
var goByHash = function(str) {
var id = str.substr(str.indexOf("#") + 1);
$.each(slides, function(i, $slide) {
if ($slide.attr('id') === id) {
$.deck('go', i);
return false;
}
});
// If we don't set these to 0 the container scrolls due to hashchange
if (options.preventFragmentScroll) {
$.deck('getContainer').scrollLeft(0).scrollTop(0);
}
};
var assignSlideId = function(i, $slide) {
var currentId = $slide.attr('id');
var previouslyAssigned = $slide.data('deckAssignedId') === currentId;
if (!currentId || previouslyAssigned) {
$slide.attr('id', options.hashPrefix + i);
$slide.data('deckAssignedId', options.hashPrefix + i);
}
};
var removeContainerHashClass = function(id) {
$container.removeClass(options.classes.onPrefix + id);
};
var addContainerHashClass = function(id) {
$container.addClass(options.classes.onPrefix + id);
};
var setupHashBehaviors = function() {
$fragmentLinks = $();
$.each(slides, function(i, $slide) {
var hash;
assignSlideId(i, $slide);
hash = '#' + $slide.attr('id');
if (hash === window.location.hash) {
setTimeout(function() {
$.deck('go', i);
}, 1);
}
$fragmentLinks = $fragmentLinks.add('a[href="' + hash + '"]');
});
if (slides.length) {
addContainerHashClass($.deck('getSlide').attr('id'));
};
};
var changeHash = function(from, to) {
var hash = '#' + $.deck('getSlide', to).attr('id');
var hashPath = window.location.href.replace(/#.*/, '') + hash;
removeContainerHashClass($.deck('getSlide', from).attr('id'));
addContainerHashClass($.deck('getSlide', to).attr('id'));
if (Modernizr.history) {
window.history.replaceState({}, "", hashPath);
}
};
/* Methods exposed in the jQuery.deck namespace */
var methods = {
/*
jQuery.deck(selector, options)
selector: string | jQuery | array
options: object, optional
Initializes the deck, using each element matched by selector as a slide.
May also be passed an array of string selectors or jQuery objects, in
which case each selector in the array is considered a slide. The second
parameter is an optional options object which will extend the default
values.
Users may also pass only an options object to init. In this case the slide
selector will be options.selectors.slides which defaults to .slide.
$.deck('.slide');
or
$.deck([
'#first-slide',
'#second-slide',
'#etc'
]);
*/
init: function(opts) {
var beforeInitEvent = createBeforeInitEvent();
var overrides = opts;
if (!$.isPlainObject(opts)) {
overrides = arguments[1] || {};
$.extend(true, overrides, {
selectors: {
slides: arguments[0]
}
});
}
options = $.extend(true, {}, $.deck.defaults, overrides);
slides = [];
currentIndex = 0;
$container = $(options.selectors.container);
// Hide the deck while states are being applied to kill transitions
$container.addClass(options.classes.loading);
// populate the array of slides for pre-init
initSlidesArray(options.selectors.slides);
// Pre init event for preprocessing hooks
beforeInitEvent.done = function() {
// re-populate the array of slides
slides = [];
initSlidesArray(options.selectors.slides);
setupHashBehaviors();
bindKeyEvents();
bindTouchEvents();
$container.scrollLeft(0).scrollTop(0);
if (slides.length) {
updateStates();
}
// Show deck again now that slides are in place
$container.removeClass(options.classes.loading);
$document.trigger(events.initialize);
};
$document.trigger(beforeInitEvent);
if (!beforeInitEvent.locks) {
beforeInitEvent.done();
}
window.setTimeout(function() {
if (beforeInitEvent.locks) {
if (window.console) {
window.console.warn('Something locked deck initialization\
without releasing it before the timeout. Proceeding with\
initialization anyway.');
}
beforeInitEvent.done();
}
}, options.initLockTimeout);
},
/*
jQuery.deck('go', index)
index: integer | string
Moves to the slide at the specified index if index is a number. Index is
0-based, so $.deck('go', 0); will move to the first slide. If index is a
string this will move to the slide with the specified id. If index is out
of bounds or doesn't match a slide id the call is ignored.
*/
go: function(indexOrId) {
var beforeChangeEvent = $.Event(events.beforeChange);
var index;
/* Number index, easy. */
if (indexInBounds(indexOrId)) {
index = indexOrId;
}
/* Id string index, search for it and set integer index */
else if (typeof indexOrId === 'string') {
$.each(slides, function(i, $slide) {
if ($slide.attr('id') === indexOrId) {
index = i;
return false;
}
});
}
if (typeof index === 'undefined') {
return;
}
/* Trigger beforeChange. If nothing prevents the change, trigger
the slide change. */
$document.trigger(beforeChangeEvent, [currentIndex, index]);
if (!beforeChangeEvent.isDefaultPrevented()) {
$document.trigger(events.change, [currentIndex, index]);
changeHash(currentIndex, index);
currentIndex = index;
updateStates();
}
},
/*
jQuery.deck('next')
Moves to the next slide. If the last slide is already active, the call
is ignored.
*/
next: function() {
methods.go(currentIndex+1);
},
/*
jQuery.deck('prev')
Moves to the previous slide. If the first slide is already active, the
call is ignored.
*/
prev: function() {
methods.go(currentIndex-1);
},
/*
jQuery.deck('getSlide', index)
index: integer, optional
Returns a jQuery object containing the slide at index. If index is not
specified, the current slide is returned.
*/
getSlide: function(index) {
index = typeof index !== 'undefined' ? index : currentIndex;
if (!indexInBounds(index)) {
return null;
}
return slides[index];
},
/*
jQuery.deck('getSlides')
Returns all slides as an array of jQuery objects.
*/
getSlides: function() {
return slides;
},
/*
jQuery.deck('getTopLevelSlides')
Returns all slides that are not subslides.
*/
getTopLevelSlides: function() {
var topLevelSlides = [];
var slideSelector = options.selectors.slides;
var subSelector = [slideSelector, slideSelector].join(' ');
$.each(slides, function(i, $slide) {
if (!$slide.is(subSelector)) {
topLevelSlides.push($slide);
}
});
return topLevelSlides;
},
/*
jQuery.deck('getNestedSlides', index)
index: integer, optional
Returns all the nested slides of the current slide. If index is
specified it returns the nested slides of the slide at that index.
If there are no nested slides this will return an empty array.
*/
getNestedSlides: function(index) {
var targetIndex = index == null ? currentIndex : index;
var $targetSlide = $.deck('getSlide', targetIndex);
var $nesteds = $targetSlide.find(options.selectors.slides);
var nesteds = $nesteds.get();
return $.map(nesteds, function(slide, i) {
return $(slide);
});
},
/*
jQuery.deck('getContainer')
Returns a jQuery object containing the deck container as defined by the
container option.
*/
getContainer: function() {
return $container;
},
/*
jQuery.deck('getOptions')
Returns the options object for the deck, including any overrides that
were defined at initialization.
*/
getOptions: function() {
return options;
},
/*
jQuery.deck('extend', name, method)
name: string
method: function
Adds method to the deck namespace with the key of name. This doesnโ€™t
give access to any private member data โ€” public methods must still be
used within method โ€” but lets extension authors piggyback on the deck
namespace rather than pollute jQuery.
$.deck('extend', 'alert', function(msg) {
alert(msg);
});
// Alerts 'boom'
$.deck('alert', 'boom');
*/
extend: function(name, method) {
methods[name] = method;
}
};
/* jQuery extension */
$.deck = function(method, arg) {
var args = Array.prototype.slice.call(arguments, 1);
if (methods[method]) {
return methods[method].apply(this, args);
}
else {
return methods.init(method, arg);
}
};
/*
The default settings object for a deck. All deck extensions should extend
this object to add defaults for any of their options.
options.classes.after
This class is added to all slides that appear after the 'next' slide.
options.classes.before
This class is added to all slides that appear before the 'previous'
slide.
options.classes.childCurrent
This class is added to all elements in the DOM tree between the
'current' slide and the deck container. For standard slides, this is
mostly seen and used for nested slides.
options.classes.current
This class is added to the current slide.
options.classes.loading
This class is applied to the deck container during loading phases and is
primarily used as a way to short circuit transitions between states
where such transitions are distracting or unwanted. For example, this
class is applied during deck initialization and then removed to prevent
all the slides from appearing stacked and transitioning into place
on load.
options.classes.next
This class is added to the slide immediately following the 'current'
slide.
options.classes.onPrefix
This prefix, concatenated with the current slide index, is added to the
deck container as you change slides.
options.classes.previous
This class is added to the slide immediately preceding the 'current'
slide.
options.selectors.container
Elements matched by this CSS selector will be considered the deck
container. The deck container is used to scope certain states of the
deck, as with the onPrefix option, or with extensions such as deck.goto
and deck.menu.
options.selectors.slides
Elements matched by this selector make up the individual deck slides.
If a user chooses to pass the slide selector as the first argument to
$.deck() on initialization it does the same thing as passing in this
option and this option value will be set to the value of that parameter.
options.keys.next
The numeric keycode used to go to the next slide.
options.keys.previous
The numeric keycode used to go to the previous slide.
options.touch.swipeDirection
The direction swipes occur to cause slide changes. Can be 'horizontal',
'vertical', or 'both'. Any other value or a falsy value will disable
swipe gestures for navigation.
options.touch.swipeTolerance
The number of pixels the users finger must travel to produce a swipe
gesture.
options.initLockTimeout
The number of milliseconds the init event will wait for BeforeInit event
locks to be released before firing the init event regardless.
options.hashPrefix
Every slide that does not have an id is assigned one at initialization.
Assigned ids take the form of hashPrefix + slideIndex, e.g., slide-0,
slide-12, etc.
options.preventFragmentScroll
When deep linking to a hash of a nested slide, this scrolls the deck
container to the top, undoing the natural browser behavior of scrolling
to the document fragment on load.
options.setAriaHiddens
When set to true, deck.js will set aria hidden attributes for slides
that do not appear onscreen according to a typical heirarchical
deck structure. You may want to turn this off if you are using a theme
where slides besides the current slide are visible on screen and should
be accessible to screenreaders.
*/
$.deck.defaults = {
classes: {
after: 'deck-after',
before: 'deck-before',
childCurrent: 'deck-child-current',
current: 'deck-current',
loading: 'deck-loading',
next: 'deck-next',
onPrefix: 'on-slide-',
previous: 'deck-previous'
},
selectors: {
container: '.deck-container',
slides: '.slide'
},
keys: {
// enter, space, page down, right arrow, down arrow,
next: [13, 32, 34, 39, 40],
// backspace, page up, left arrow, up arrow
previous: [8, 33, 37, 38]
},
touch: {
swipeDirection: 'horizontal',
swipeTolerance: 60
},
initLockTimeout: 10000,
hashPrefix: 'slide-',
preventFragmentScroll: true,
setAriaHiddens: true
};
$document.ready(function() {
$('html').addClass('ready');
});
$window.bind('hashchange.deck', function(event) {
if (event.originalEvent && event.originalEvent.newURL) {
goByHash(event.originalEvent.newURL);
}
else {
goByHash(window.location.hash);
}
});
$window.bind('load.deck', function() {
if (options.preventFragmentScroll) {
$container.scrollLeft(0).scrollTop(0);
}
});
})(jQuery);

65
core/deck.core.scss

@ -0,0 +1,65 @@
html, body {
height:100%;
padding:0;
margin:0;
}
.deck-container {
position:relative;
min-height:100%;
margin:0 auto;
overflow:hidden;
overflow-y:auto;
.js & {
visibility:hidden;
}
.ready & {
visibility:visible;
}
.touch & {
-webkit-text-size-adjust:none;
-moz-text-size-adjust:none;
}
}
.deck-loading {
display:none;
}
.slide {
width:auto;
min-height:100%;
position:relative;
}
.deck-before, .deck-previous, .deck-next, .deck-after {
position:absolute;
left:-999em;
top:-999em;
}
.deck-current {
z-index:2;
}
.slide .slide {
visibility:hidden;
position:static;
min-height:0;
}
.deck-child-current {
position:static;
z-index:2;
.slide {
visibility:hidden;
}
.deck-previous, .deck-before, .deck-current {
visibility:visible;
}
}

25
core/print.css

@ -0,0 +1,25 @@
body {
font-size: 18pt;
}
h1 {
font-size: 48pt;
}
h2 {
font-size: 36pt;
}
h3 {
font-size: 28pt;
}
pre {
border: 1px solid #000;
padding: 10px;
white-space: pre-wrap;
}
.deck-container > .slide {
page-break-after: always;
}

14
core/print.scss

@ -0,0 +1,14 @@
body { font-size:18pt; }
h1 { font-size:48pt; }
h2 { font-size:36pt; }
h3 { font-size:28pt; }
pre {
border:1px solid #000;
padding:10px;
white-space:pre-wrap;
}
.deck-container > .slide {
page-break-after: always;
}

36
extensions/goto/deck.goto.css

@ -0,0 +1,36 @@
.goto-form {
position: absolute;
z-index: 3;
bottom: 10px;
left: 50%;
height: 1.75em;
margin: 0 0 0 -9.125em;
line-height: 1.75em;
padding: 0.625em;
display: none;
background: #ccc;
overflow: hidden;
border-radius: 10px;
}
.goto-form label {
font-weight: bold;
}
.goto-form label, .goto-form input {
display: inline-block;
font-family: inherit;
}
.deck-goto .goto-form {
display: block;
}
#goto-slide {
width: 8.375em;
margin: 0 0.625em;
height: 1.4375em;
}
@media print {
.goto-form, #goto-slide {
display: none;
}
}

7
extensions/goto/deck.goto.html

@ -0,0 +1,7 @@
<!-- Place the following snippet at the bottom of the deck container. -->
<form action="." method="get" class="goto-form">
<label for="goto-slide">Go to slide:</label>
<input type="text" name="slidenum" id="goto-slide" list="goto-datalist">
<datalist id="goto-datalist"></datalist>
<input type="submit" value="Go">
</form>

190
extensions/goto/deck.goto.js

@ -0,0 +1,190 @@
/*!
Deck JS - deck.goto
Copyright (c) 2011-2014 Caleb Troughton
Dual licensed under the MIT license.
https://github.com/imakewebthings/deck.js/blob/master/MIT-license.txt
*/
/*
This module adds the necessary methods and key bindings to show and hide a form
for jumping to any slide number/id in the deck (and processes that form
accordingly). The form-showing state is indicated by the presence of a class on
the deck container.
*/
(function($, undefined) {
var $document = $(document);
var rootCounter;
var bindKeyEvents = function() {
$document.unbind('keydown.deckgoto');
$document.bind('keydown.deckgoto', function(event) {
var key = $.deck('getOptions').keys.goto;
if (event.which === key || $.inArray(event.which, key) > -1) {
event.preventDefault();
$.deck('toggleGoTo');
}
});
};
var populateDatalist = function() {
var options = $.deck('getOptions');
var $datalist = $(options.selectors.gotoDatalist);
$.each($.deck('getSlides'), function(i, $slide) {
var id = $slide.attr('id');
if (id) {
$datalist.append('<option value="' + id + '">');
}
});
};
var markRootSlides = function() {
var options = $.deck('getOptions');
var slideTest = $.map([
options.classes.before,
options.classes.previous,
options.classes.current,
options.classes.next,
options.classes.after
], function(el, i) {
return '.' + el;
}).join(', ');
rootCounter = 0;
$.each($.deck('getSlides'), function(i, $slide) {
var $parentSlides = $slide.parentsUntil(
options.selectors.container,
slideTest
);
if ($parentSlides.length) {
$slide.removeData('rootIndex');
}
else if (!options.countNested) {
++rootCounter;
$slide.data('rootIndex', rootCounter);
}
});
};
var handleFormSubmit = function() {
var options = $.deck('getOptions');
var $form = $(options.selectors.gotoForm);
$form.unbind('submit.deckgoto');
$form.bind('submit.deckgoto', function(event) {
var $field = $(options.selectors.gotoInput);
var indexOrId = $field.val();
var index = parseInt(indexOrId, 10);
if (!options.countNested) {
if (!isNaN(index) && index >= rootCounter) {
return false;
}
$.each($.deck('getSlides'), function(i, $slide) {
if ($slide.data('rootIndex') === index) {
index = i + 1;
return false;
}
});
}
$.deck('go', isNaN(index) ? indexOrId : index - 1);
$.deck('hideGoTo');
$field.val('');
event.preventDefault();
});
};
/*
Extends defaults/options.
options.classes.goto
This class is added to the deck container when showing the Go To Slide
form.
options.selectors.gotoDatalist
The element that matches this selector is the datalist element that will
be populated with options for each of the slide ids. In browsers that
support the datalist element, this provides a drop list of slide ids to
aid the user in selecting a slide.
options.selectors.gotoForm
The element that matches this selector is the form that is submitted
when a user hits enter after typing a slide number/id in the gotoInput
element.
options.selectors.gotoInput
The element that matches this selector is the text input field for
entering a slide number/id in the Go To Slide form.
options.keys.goto
The numeric keycode used to show the Go To Slide form.
options.countNested
If false, only top level slides will be counted when entering a
slide number.
*/
$.extend(true, $.deck.defaults, {
classes: {
goto: 'deck-goto'
},
selectors: {
gotoDatalist: '#goto-datalist',
gotoForm: '.goto-form',
gotoInput: '#goto-slide'
},
keys: {
goto: 71 // g
},
countNested: true
});
/*
jQuery.deck('showGoTo')
Shows the Go To Slide form by adding the class specified by the goto class
option to the deck container.
*/
$.deck('extend', 'showGoTo', function() {
var options = $.deck('getOptions');
$.deck('getContainer').addClass(options.classes.goto);
$(options.selectors.gotoForm).attr('aria-hidden', false);
$(options.selectors.gotoInput).focus();
});
/*
jQuery.deck('hideGoTo')
Hides the Go To Slide form by removing the class specified by the goto class
option from the deck container.
*/
$.deck('extend', 'hideGoTo', function() {
var options = $.deck('getOptions');
$(options.selectors.gotoInput).blur();
$.deck('getContainer').removeClass(options.classes.goto);
$(options.selectors.gotoForm).attr('aria-hidden', true);
});
/*
jQuery.deck('toggleGoTo')
Toggles between showing and hiding the Go To Slide form.
*/
$.deck('extend', 'toggleGoTo', function() {
var options = $.deck('getOptions');
var hasGotoClass = $.deck('getContainer').hasClass(options.classes.goto);
$.deck(hasGotoClass ? 'hideGoTo' : 'showGoTo');
});
$document.bind('deck.init', function() {
bindKeyEvents();
populateDatalist();
markRootSlides();
handleFormSubmit();
});
})(jQuery);

39
extensions/goto/deck.goto.scss

@ -0,0 +1,39 @@
.goto-form {
position:absolute;
z-index:3;
bottom:10px;
left:50%;
height:1.75em;
margin:0 0 0 -9.125em;
line-height:1.75em;
padding:0.625em;
display:none;
background:#ccc;
overflow:hidden;
border-radius:10px;
label {
font-weight:bold;
}
label, input {
display:inline-block;
font-family:inherit;
}
.deck-goto & {
display:block;
}
}
#goto-slide {
width:8.375em;
margin:0 0.625em;
height:1.4375em;
}
@media print {
.goto-form, #goto-slide {
display:none;
}
}

45
extensions/menu/deck.menu.css

@ -0,0 +1,45 @@
.deck-menu {
overflow: auto;
}
.deck-menu .slide {
background: #eee;
position: relative;
left: 0;
top: 0;
visibility: visible;
cursor: pointer;
}
.no-csstransforms .deck-menu > .slide {
float: left;
width: 22%;
height: 22%;
min-height: 0;
margin: 1%;
font-size: 0.22em;
overflow: hidden;
padding: 0 0.5%;
}
.csstransforms .deck-menu > .slide {
-webkit-transform: scale(0.22) !important;
-ms-transform: scale(0.22) !important;
transform: scale(0.22) !important;
-webkit-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
height: 100%;
overflow: hidden;
padding: 0 48px;
margin: 12px;
}
.deck-menu iframe, .deck-menu img, .deck-menu video {
max-width: 100%;
}
.deck-menu .deck-current, .no-touch .deck-menu .slide:hover {
background: #ddf;
}
.deck-menu.deck-container:hover .deck-prev-link, .deck-menu.deck-container:hover .deck-next-link {
display: none;
}

225
extensions/menu/deck.menu.js

@ -0,0 +1,225 @@
/*!
Deck JS - deck.menu
Copyright (c) 2011-2014 Caleb Troughton
Dual licensed under the MIT license.
https://github.com/imakewebthings/deck.js/blob/master/MIT-license.txt
*/
/*
This module adds the methods and key binding to show and hide a menu of all
slides in the deck. The deck menu state is indicated by the presence of a class
on the deck container.
*/
(function($, undefined) {
var $document = $(document);
var $html = $('html');
var rootSlides;
var populateRootSlidesArray = function() {
var options = $.deck('getOptions');
var slideTest = $.map([
options.classes.before,
options.classes.previous,
options.classes.current,
options.classes.next,
options.classes.after
], function(el, i) {
return '.' + el;
}).join(', ');
rootSlides = [];
$.each($.deck('getSlides'), function(i, $slide) {
var $parentSlides = $slide.parentsUntil(
options.selectors.container,
slideTest
);
if (!$parentSlides.length) {
rootSlides.push($slide);
}
});
};
var bindKeyEvents = function() {
var options = $.deck('getOptions');
$document.unbind('keydown.deckmenu');
$document.bind('keydown.deckmenu', function(event) {
var isMenuKey = event.which === options.keys.menu;
isMenuKey = isMenuKey || $.inArray(event.which, options.keys.menu) > -1;
if (isMenuKey && !event.ctrlKey) {
$.deck('toggleMenu');
event.preventDefault();
}
});
};
var bindTouchEvents = function() {
var $container = $.deck('getContainer');
var options = $.deck('getOptions');
var touchEndTime = 0;
var currentSlide;
$container.unbind('touchstart.deckmenu');
$container.bind('touchstart.deckmenu', function() {
currentSlide = $.deck('getSlide');
});
$container.unbind('touchend.deckmenu');
$container.bind('touchend.deckmenu', function(event) {
var now = Date.now();
var isDoubletap = now - touchEndTime < options.touch.doubletapWindow;
// Ignore this touch event if it caused a nav change (swipe)
if (currentSlide !== $.deck('getSlide')) {
return;
}
if (isDoubletap) {
$.deck('toggleMenu');
event.preventDefault();
}
touchEndTime = now;
});
};
var setupMenuSlideSelection = function() {
var options = $.deck('getOptions');
$.each($.deck('getSlides'), function(i, $slide) {
$slide.unbind('click.deckmenu');
$slide.bind('click.deckmenu', function(event) {
if (!$.deck('getContainer').hasClass(options.classes.menu)) {
return;
}
$.deck('go', i);
$.deck('hideMenu');
event.stopPropagation();
event.preventDefault();
});
});
};
/*
Extends defaults/options.
options.classes.menu
This class is added to the deck container when showing the slide menu.
options.keys.menu
The numeric keycode used to toggle between showing and hiding the slide
menu.
options.touch.doubletapWindow
Two consecutive touch events within this number of milliseconds will
be considered a double tap, and will toggle the menu on touch devices.
*/
$.extend(true, $.deck.defaults, {
classes: {
menu: 'deck-menu'
},
keys: {
menu: 77 // m
},
touch: {
doubletapWindow: 400
}
});
/*
jQuery.deck('showMenu')
Shows the slide menu by adding the class specified by the menu class option
to the deck container.
*/
$.deck('extend', 'showMenu', function() {
var $container = $.deck('getContainer');
var options = $.deck('getOptions');
if ($container.hasClass(options.classes.menu)) {
return;
}
// Hide through loading class to short-circuit transitions (perf)
$container.addClass([
options.classes.loading,
options.classes.menu
].join(' '));
/* Forced to do this in JS until CSS learns second-grade math. Save old
style value for restoration when menu is hidden. */
if (Modernizr.csstransforms) {
$.each(rootSlides, function(i, $slide) {
$slide.data('oldStyle', $slide.attr('style'));
$slide.css({
'position': 'absolute',
'left': ((i % 4) * 25) + '%',
'top': (Math.floor(i / 4) * 25) + '%'
});
});
}
// Need to ensure the loading class renders first, then remove
window.setTimeout(function() {
$container.removeClass(options.classes.loading);
$container.scrollTop($.deck('getSlide').position().top);
}, 0);
});
/*
jQuery.deck('hideMenu')
Hides the slide menu by removing the class specified by the menu class
option from the deck container.
*/
$.deck('extend', 'hideMenu', function() {
var $container = $.deck('getContainer');
var options = $.deck('getOptions');
if (!$container.hasClass(options.classes.menu)) {
return;
}
$container.removeClass(options.classes.menu);
$container.addClass(options.classes.loading);
/* Restore old style value */
if (Modernizr.csstransforms) {
$.each(rootSlides, function(i, $slide) {
var oldStyle = $slide.data('oldStyle');
$slide.attr('style', oldStyle ? oldStyle : '');
});
}
window.setTimeout(function() {
$container.removeClass(options.classes.loading);
$container.scrollTop(0);
}, 0);
});
/*
jQuery.deck('toggleMenu')
Toggles between showing and hiding the slide menu.
*/
$.deck('extend', 'toggleMenu', function() {
$.deck('getContainer').hasClass($.deck('getOptions').classes.menu) ?
$.deck('hideMenu') : $.deck('showMenu');
});
$document.bind('deck.init', function() {
populateRootSlidesArray();
bindKeyEvents();
bindTouchEvents();
setupMenuSlideSelection();
});
$document.bind('deck.change', function(event, from, to) {
var $container = $.deck('getContainer');
var containerScroll, slideTop;
if ($container.hasClass($.deck('getOptions').classes.menu)) {
containerScroll = $container.scrollTop();
slideTop = $.deck('getSlide', to).position().top;
$container.scrollTop(containerScroll + slideTop);
}
});
})(jQuery);

55
extensions/menu/deck.menu.scss

@ -0,0 +1,55 @@
.deck-menu {
overflow:auto;
.slide {
background:#eee;
position:relative;
left:0;
top:0;
visibility:visible;
cursor:pointer;
}
> .slide {
.no-csstransforms & {
float:left;
width:22%;
height:22%;
min-height:0;
margin:1%;
font-size:0.22em;
overflow:hidden;
padding:0 0.5%;
}
.csstransforms & {
-webkit-transform:scale(.22) !important;
-ms-transform:scale(.22) !important;
transform:scale(.22) !important;
-webkit-transform-origin:0 0;
-ms-transform-origin:0 0;
transform-origin:0 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
width:100%;
height:100%;
overflow:hidden;
padding:0 48px;
margin:12px;
}
}
iframe, img, video {
max-width:100%;
}
.deck-current, .no-touch & .slide:hover {
background:#ddf;
}
&.deck-container:hover {
.deck-prev-link, .deck-next-link {
display:none;
}
}
}

42
extensions/navigation/deck.navigation.css

@ -0,0 +1,42 @@
.deck-prev-link, .deck-next-link {
display: none;
position: absolute;
z-index: 3;
top: 50%;
width: 32px;
height: 32px;
margin-top: -16px;
font-size: 20px;
font-weight: bold;
line-height: 32px;
vertical-align: middle;
text-align: center;
text-decoration: none;
color: #fff;