Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
deck revised extension example: goto
(function($, undefined) {
$.deck('extend', {
name: 'goto',
options: {
class: 'deck-goto',
datalistSelector: '#goto-datalist',
formSelector: '.goto-form',
inputSelector: '#goto-slide',
countNested: true
},
keys: {
'g': {
method: 'toggleGoto',
description: 'Shows or hides a form that will allow you to jump around slides by typing in the slide number or slide ID.'
}
},
methods: {
showGoTo: function() {
var options = $.deck('getOptions');
$.deck('getContainer').addClass(options.goto.class);
$(options.goto.inputSelector).focus();
},
hideGoTo: function() {
var options = $.deck('getOptions');
$(options.goto.inputSelector).blur();
$.deck('getContainer').removeClass(options.goto.class);
},
toggleGoTo: function() {
var options = $.deck('getOptions');
var $container = $.deck('getContainer');
$.deck($container.hasClass(options.goto.class) ? 'hideGoTo' : 'showGoTo');
}
},
events: {
init: function() {
var options = $.deck('getOptions');
var $datalist = $(options.goto.datalistSelector);
var $field = $(options.goto.inputSelector);
var rootCounter = 1;
var slideTest = $.map([
options.beforeClass,
options.previousClass,
options.currentClass,
options.nextClass,
options.afterClass
], function(el, i) {
return '.' + el;
}).join(', ');
$.each($.deck('getSlides'), function(i, $slide) {
var id = $slide.attr('id');
var $parentSlides = $slide.parentsUntil(options.containerSelector, slideTest);
if (id) {
$datalist.append('<option value="' + id + '">');
}
if ($parentSlides.length) {
$slide.removeData('rootIndex');
}
else if (!options.goto.countNested) {
$slide.data('rootIndex', rootCounter);
++rootCounter;
}
});
$(options.goto.formSelector).bind('submit.deckgoto', function(event) {
var target = parseInt($field.val(), 10);
if (!options.goto.countNested) {
if (target >= rootCounter) return false;
$.each($.deck('getSlides'), function(i, $slide) {
if ($slide.data('rootIndex') === target) {
target = i + 1;
return false;
}
});
}
$.deck('go', isNan(target) ? $field.val() : target - 1);
$.deck('hideGoTo');
$field.val('');
event.preventDefault();
});
$field.bind('keydown.deckgoto', function(event) {
event.stopPropagation();
});
}
}
});
})(jQuery, 'deck');
// Usage examples
$.deck('.slide', {
all: {
countNested: false // Will be passed to all extensions
}
goto: {
inputSelector: '.some-other-input'
},
menu: false // Disables menu extension entirely
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.