slideshow-service 0.1.0 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/Manifest.txt +42 -0
- data/lib/slideshow/service/public/slideshow-deck.js/core/deck.core.css +391 -0
- data/lib/slideshow/service/public/slideshow-deck.js/core/deck.core.html +39 -0
- data/lib/slideshow/service/public/slideshow-deck.js/core/deck.core.js +460 -0
- data/lib/slideshow/service/public/slideshow-deck.js/core/deck.core.scss +432 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/goto/deck.goto.css +41 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/goto/deck.goto.html +6 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/goto/deck.goto.js +118 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/goto/deck.goto.scss +46 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/hash/deck.hash.css +13 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/hash/deck.hash.html +2 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/hash/deck.hash.js +126 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/hash/deck.hash.scss +15 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/menu/deck.menu.css +46 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/menu/deck.menu.js +182 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/menu/deck.menu.scss +57 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/navigation/deck.navigation.css +43 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/navigation/deck.navigation.html +3 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/navigation/deck.navigation.js +83 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/navigation/deck.navigation.scss +56 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/scale/deck.scale.css +16 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/scale/deck.scale.js +155 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/scale/deck.scale.scss +17 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/status/deck.status.css +14 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/status/deck.status.html +6 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/status/deck.status.js +83 -0
- data/lib/slideshow/service/public/slideshow-deck.js/extensions/status/deck.status.scss +16 -0
- data/lib/slideshow/service/public/slideshow-deck.js/lib/jquery-1.6.4.min.js +4 -0
- data/lib/slideshow/service/public/slideshow-deck.js/lib/modernizr.custom.js +4 -0
- data/lib/slideshow/service/public/slideshow-deck.js/slides.html +119 -0
- data/lib/slideshow/service/public/slideshow-deck.js/style.css +59 -0
- data/lib/slideshow/service/public/slideshow-deck.js/themes/style/neon.css +114 -0
- data/lib/slideshow/service/public/slideshow-deck.js/themes/style/neon.scss +139 -0
- data/lib/slideshow/service/public/slideshow-deck.js/themes/style/swiss.css +75 -0
- data/lib/slideshow/service/public/slideshow-deck.js/themes/style/swiss.scss +91 -0
- data/lib/slideshow/service/public/slideshow-deck.js/themes/style/web-2.0.css +210 -0
- data/lib/slideshow/service/public/slideshow-deck.js/themes/style/web-2.0.scss +238 -0
- data/lib/slideshow/service/public/slideshow-deck.js/themes/transition/fade.css +44 -0
- data/lib/slideshow/service/public/slideshow-deck.js/themes/transition/fade.scss +70 -0
- data/lib/slideshow/service/public/slideshow-deck.js/themes/transition/horizontal-slide.css +79 -0
- data/lib/slideshow/service/public/slideshow-deck.js/themes/transition/horizontal-slide.scss +94 -0
- data/lib/slideshow/service/public/slideshow-deck.js/themes/transition/vertical-slide.css +97 -0
- data/lib/slideshow/service/public/slideshow-deck.js/themes/transition/vertical-slide.scss +116 -0
- data/lib/slideshow/service/version.rb +1 -1
- metadata +43 -1
@@ -0,0 +1,126 @@
|
|
1
|
+
/*!
|
2
|
+
Deck JS - deck.hash
|
3
|
+
Copyright (c) 2011 Caleb Troughton
|
4
|
+
Dual licensed under the MIT license and GPL license.
|
5
|
+
https://github.com/imakewebthings/deck.js/blob/master/MIT-license.txt
|
6
|
+
https://github.com/imakewebthings/deck.js/blob/master/GPL-license.txt
|
7
|
+
*/
|
8
|
+
|
9
|
+
/*
|
10
|
+
This module adds deep linking to individual slides, enables internal links
|
11
|
+
to slides within decks, and updates the address bar with the hash as the user
|
12
|
+
moves through the deck. A permalink anchor is also updated. Standard themes
|
13
|
+
hide this link in browsers that support the History API, and show it for
|
14
|
+
those that do not. Slides that do not have an id are assigned one according to
|
15
|
+
the hashPrefix option. In addition to the on-slide container state class
|
16
|
+
kept by core, this module adds an on-slide state class that uses the id of each
|
17
|
+
slide.
|
18
|
+
*/
|
19
|
+
(function ($, deck, window, undefined) {
|
20
|
+
var $d = $(document),
|
21
|
+
$window = $(window),
|
22
|
+
|
23
|
+
/* Collection of internal fragment links in the deck */
|
24
|
+
$internals,
|
25
|
+
|
26
|
+
/*
|
27
|
+
Internal only function. Given a string, extracts the id from the hash,
|
28
|
+
matches it to the appropriate slide, and navigates there.
|
29
|
+
*/
|
30
|
+
goByHash = function(str) {
|
31
|
+
var id = str.substr(str.indexOf("#") + 1),
|
32
|
+
slides = $[deck]('getSlides');
|
33
|
+
|
34
|
+
$.each(slides, function(i, $el) {
|
35
|
+
if ($el.attr('id') === id) {
|
36
|
+
$[deck]('go', i);
|
37
|
+
return false;
|
38
|
+
}
|
39
|
+
});
|
40
|
+
|
41
|
+
// If we don't set these to 0 the container scrolls due to hashchange
|
42
|
+
$[deck]('getContainer').scrollLeft(0).scrollTop(0);
|
43
|
+
};
|
44
|
+
|
45
|
+
/*
|
46
|
+
Extends defaults/options.
|
47
|
+
|
48
|
+
options.selectors.hashLink
|
49
|
+
The element matching this selector has its href attribute updated to
|
50
|
+
the hash of the current slide as the user navigates through the deck.
|
51
|
+
|
52
|
+
options.hashPrefix
|
53
|
+
Every slide that does not have an id is assigned one at initialization.
|
54
|
+
Assigned ids take the form of hashPrefix + slideIndex, e.g., slide-0,
|
55
|
+
slide-12, etc.
|
56
|
+
*/
|
57
|
+
$.extend(true, $[deck].defaults, {
|
58
|
+
selectors: {
|
59
|
+
hashLink: '.deck-permalink'
|
60
|
+
},
|
61
|
+
|
62
|
+
hashPrefix: 'slide-'
|
63
|
+
});
|
64
|
+
|
65
|
+
|
66
|
+
$d.bind('deck.init', function() {
|
67
|
+
var opts = $[deck]('getOptions');
|
68
|
+
$internals = $();
|
69
|
+
|
70
|
+
$.each($[deck]('getSlides'), function(i, $el) {
|
71
|
+
var hash;
|
72
|
+
|
73
|
+
/* Hand out ids to the unfortunate slides born without them */
|
74
|
+
if (!$el.attr('id') || $el.data('deckAssignedId') === $el.attr('id')) {
|
75
|
+
$el.attr('id', opts.hashPrefix + i);
|
76
|
+
$el.data('deckAssignedId', opts.hashPrefix + i);
|
77
|
+
}
|
78
|
+
|
79
|
+
hash ='#' + $el.attr('id');
|
80
|
+
|
81
|
+
/* Deep link to slides on init */
|
82
|
+
if (hash === window.location.hash) {
|
83
|
+
$[deck]('go', i);
|
84
|
+
}
|
85
|
+
|
86
|
+
/* Add internal links to this slide */
|
87
|
+
$internals = $internals.add('a[href="' + hash + '"]');
|
88
|
+
});
|
89
|
+
|
90
|
+
if (!Modernizr.hashchange) {
|
91
|
+
/* Set up internal links using click for the poor browsers
|
92
|
+
without a hashchange event. */
|
93
|
+
$internals.unbind('click.deckhash').bind('click.deckhash', function(e) {
|
94
|
+
goByHash($(this).attr('href'));
|
95
|
+
});
|
96
|
+
}
|
97
|
+
|
98
|
+
/* Set up first id container state class */
|
99
|
+
$[deck]('getContainer').addClass(opts.classes.onPrefix + $[deck]('getSlide').attr('id'));
|
100
|
+
})
|
101
|
+
/* Update permalink, address bar, and state class on a slide change */
|
102
|
+
.bind('deck.change', function(e, from, to) {
|
103
|
+
var hash = '#' + $[deck]('getSlide', to).attr('id'),
|
104
|
+
opts = $[deck]('getOptions'),
|
105
|
+
osp = opts.classes.onPrefix,
|
106
|
+
$c = $[deck]('getContainer');
|
107
|
+
|
108
|
+
$c.removeClass(osp + $[deck]('getSlide', from).attr('id'));
|
109
|
+
$c.addClass(osp + $[deck]('getSlide', to).attr('id'));
|
110
|
+
|
111
|
+
$(opts.selectors.hashLink).attr('href', hash);
|
112
|
+
if (Modernizr.history) {
|
113
|
+
window.history.replaceState({}, "", hash);
|
114
|
+
}
|
115
|
+
});
|
116
|
+
|
117
|
+
/* Deals with internal links in modern browsers */
|
118
|
+
$window.bind('hashchange.deckhash', function(e) {
|
119
|
+
if (e.originalEvent && e.originalEvent.newURL) {
|
120
|
+
goByHash(e.originalEvent.newURL);
|
121
|
+
}
|
122
|
+
else {
|
123
|
+
goByHash(window.location.hash);
|
124
|
+
}
|
125
|
+
});
|
126
|
+
})(jQuery, 'deck', this);
|
@@ -0,0 +1,46 @@
|
|
1
|
+
.deck-menu .slide {
|
2
|
+
background: #eee;
|
3
|
+
position: relative;
|
4
|
+
left: 0;
|
5
|
+
top: 0;
|
6
|
+
visibility: visible;
|
7
|
+
cursor: pointer;
|
8
|
+
}
|
9
|
+
.no-csstransforms .deck-menu > .slide {
|
10
|
+
float: left;
|
11
|
+
width: 22%;
|
12
|
+
height: 22%;
|
13
|
+
min-height: 0;
|
14
|
+
margin: 1%;
|
15
|
+
font-size: 0.22em;
|
16
|
+
overflow: hidden;
|
17
|
+
padding: 0 0.5%;
|
18
|
+
}
|
19
|
+
.csstransforms .deck-menu > .slide {
|
20
|
+
-webkit-transform: scale(0.22);
|
21
|
+
-moz-transform: scale(0.22);
|
22
|
+
-o-transform: scale(0.22);
|
23
|
+
-ms-transform: scale(0.22);
|
24
|
+
transform: scale(0.22);
|
25
|
+
-webkit-transform-origin: 0 0;
|
26
|
+
-moz-transform-origin: 0 0;
|
27
|
+
-o-transform-origin: 0 0;
|
28
|
+
-ms-transform-origin: 0 0;
|
29
|
+
transform-origin: 0 0;
|
30
|
+
-webkit-box-sizing: border-box;
|
31
|
+
-moz-box-sizing: border-box;
|
32
|
+
box-sizing: border-box;
|
33
|
+
width: 100%;
|
34
|
+
height: 100%;
|
35
|
+
overflow: hidden;
|
36
|
+
padding: 0 48px;
|
37
|
+
}
|
38
|
+
.deck-menu iframe, .deck-menu img, .deck-menu video {
|
39
|
+
max-width: 100%;
|
40
|
+
}
|
41
|
+
.deck-menu .deck-current, .no-touch .deck-menu .slide:hover {
|
42
|
+
background: #ddf;
|
43
|
+
}
|
44
|
+
.deck-menu.deck-container:hover .deck-prev-link, .deck-menu.deck-container:hover .deck-next-link {
|
45
|
+
display: none;
|
46
|
+
}
|
@@ -0,0 +1,182 @@
|
|
1
|
+
/*!
|
2
|
+
Deck JS - deck.menu
|
3
|
+
Copyright (c) 2011 Caleb Troughton
|
4
|
+
Dual licensed under the MIT license and GPL license.
|
5
|
+
https://github.com/imakewebthings/deck.js/blob/master/MIT-license.txt
|
6
|
+
https://github.com/imakewebthings/deck.js/blob/master/GPL-license.txt
|
7
|
+
*/
|
8
|
+
|
9
|
+
/*
|
10
|
+
This module adds the methods and key binding to show and hide a menu of all
|
11
|
+
slides in the deck. The deck menu state is indicated by the presence of a class
|
12
|
+
on the deck container.
|
13
|
+
*/
|
14
|
+
(function($, deck, undefined) {
|
15
|
+
var $d = $(document),
|
16
|
+
rootSlides, // Array of top level slides
|
17
|
+
$placeholder; // Holds the place of the deck container during detachment
|
18
|
+
|
19
|
+
/*
|
20
|
+
Extends defaults/options.
|
21
|
+
|
22
|
+
options.classes.menu
|
23
|
+
This class is added to the deck container when showing the slide menu.
|
24
|
+
|
25
|
+
options.keys.menu
|
26
|
+
The numeric keycode used to toggle between showing and hiding the slide
|
27
|
+
menu.
|
28
|
+
|
29
|
+
options.touch.doubletapWindow
|
30
|
+
Two consecutive touch events within this number of milliseconds will
|
31
|
+
be considered a double tap, and will toggle the menu on touch devices.
|
32
|
+
*/
|
33
|
+
$.extend(true, $[deck].defaults, {
|
34
|
+
classes: {
|
35
|
+
menu: 'deck-menu'
|
36
|
+
},
|
37
|
+
|
38
|
+
keys: {
|
39
|
+
menu: 77 // m
|
40
|
+
},
|
41
|
+
|
42
|
+
touch: {
|
43
|
+
doubletapWindow: 400
|
44
|
+
}
|
45
|
+
});
|
46
|
+
|
47
|
+
/*
|
48
|
+
jQuery.deck('showMenu')
|
49
|
+
|
50
|
+
Shows the slide menu by adding the class specified by the menu class option
|
51
|
+
to the deck container.
|
52
|
+
*/
|
53
|
+
$[deck]('extend', 'showMenu', function() {
|
54
|
+
var $c = $[deck]('getContainer');
|
55
|
+
|
56
|
+
// Detaching for this big style change for performance (no transitions!)
|
57
|
+
$c.replaceWith($placeholder);
|
58
|
+
$c.addClass($[deck]('getOptions').classes.menu);
|
59
|
+
|
60
|
+
/* Forced to do this in JS until CSS learns second-grade math. Save old
|
61
|
+
style value for restoration when menu is hidden. */
|
62
|
+
if (Modernizr.csstransforms) {
|
63
|
+
$.each(rootSlides, function(i, $slide) {
|
64
|
+
$slide.data('oldStyle', $slide.attr('style'));
|
65
|
+
$slide.css({
|
66
|
+
'position': 'absolute',
|
67
|
+
'left': ((i % 4) * 25) + '%',
|
68
|
+
'top': (Math.floor(i / 4) * 25) + '%'
|
69
|
+
});
|
70
|
+
});
|
71
|
+
}
|
72
|
+
|
73
|
+
$placeholder.replaceWith($c);
|
74
|
+
$c.scrollTop($[deck]('getSlide').offset().top);
|
75
|
+
});
|
76
|
+
|
77
|
+
/*
|
78
|
+
jQuery.deck('hideMenu')
|
79
|
+
|
80
|
+
Hides the slide menu by removing the class specified by the menu class
|
81
|
+
option from the deck container.
|
82
|
+
*/
|
83
|
+
$[deck]('extend', 'hideMenu', function() {
|
84
|
+
var $c = $[deck]('getContainer');
|
85
|
+
|
86
|
+
$c.replaceWith($placeholder);
|
87
|
+
$c.removeClass($[deck]('getOptions').classes.menu);
|
88
|
+
|
89
|
+
/* Restore old style value */
|
90
|
+
if (Modernizr.csstransforms) {
|
91
|
+
$.each(rootSlides, function(i, $slide) {
|
92
|
+
var oldStyle = $slide.data('oldStyle');
|
93
|
+
|
94
|
+
$slide.attr('style', oldStyle ? oldStyle : '');
|
95
|
+
});
|
96
|
+
}
|
97
|
+
|
98
|
+
$placeholder.replaceWith($c);
|
99
|
+
$c.scrollTop(0);
|
100
|
+
});
|
101
|
+
|
102
|
+
/*
|
103
|
+
jQuery.deck('toggleMenu')
|
104
|
+
|
105
|
+
Toggles between showing and hiding the slide menu.
|
106
|
+
*/
|
107
|
+
$[deck]('extend', 'toggleMenu', function() {
|
108
|
+
$[deck]('getContainer').hasClass($[deck]('getOptions').classes.menu) ?
|
109
|
+
$[deck]('hideMenu') : $[deck]('showMenu');
|
110
|
+
});
|
111
|
+
|
112
|
+
$d.bind('deck.init', function() {
|
113
|
+
var opts = $[deck]('getOptions'),
|
114
|
+
touchEndTime = 0,
|
115
|
+
currentSlide,
|
116
|
+
slideTest = $.map([
|
117
|
+
opts.classes.before,
|
118
|
+
opts.classes.previous,
|
119
|
+
opts.classes.current,
|
120
|
+
opts.classes.next,
|
121
|
+
opts.classes.after
|
122
|
+
], function(el, i) {
|
123
|
+
return '.' + el;
|
124
|
+
}).join(', ');
|
125
|
+
|
126
|
+
// Create placeholder element
|
127
|
+
$placeholder = $('<' + $[deck]('getContainer').get(0).tagName + '>');
|
128
|
+
|
129
|
+
// Build top level slides array
|
130
|
+
rootSlides = [];
|
131
|
+
$.each($[deck]('getSlides'), function(i, $el) {
|
132
|
+
if (!$el.parentsUntil(opts.selectors.container, slideTest).length) {
|
133
|
+
rootSlides.push($el);
|
134
|
+
}
|
135
|
+
});
|
136
|
+
|
137
|
+
// Bind key events
|
138
|
+
$d.unbind('keydown.deckmenu').bind('keydown.deckmenu', function(e) {
|
139
|
+
if (e.which === opts.keys.menu || $.inArray(e.which, opts.keys.menu) > -1) {
|
140
|
+
$[deck]('toggleMenu');
|
141
|
+
e.preventDefault();
|
142
|
+
}
|
143
|
+
});
|
144
|
+
|
145
|
+
// Double tap to toggle slide menu for touch devices
|
146
|
+
$[deck]('getContainer').unbind('touchstart.deckmenu').bind('touchstart.deckmenu', function(e) {
|
147
|
+
currentSlide = $[deck]('getSlide');
|
148
|
+
})
|
149
|
+
.unbind('touchend.deckmenu').bind('touchend.deckmenu', function(e) {
|
150
|
+
var now = Date.now();
|
151
|
+
|
152
|
+
// Ignore this touch event if it caused a nav change (swipe)
|
153
|
+
if (currentSlide !== $[deck]('getSlide')) return;
|
154
|
+
|
155
|
+
if (now - touchEndTime < opts.touch.doubletapWindow) {
|
156
|
+
$[deck]('toggleMenu');
|
157
|
+
e.preventDefault();
|
158
|
+
}
|
159
|
+
touchEndTime = now;
|
160
|
+
});
|
161
|
+
|
162
|
+
// Selecting slides from the menu
|
163
|
+
$.each($[deck]('getSlides'), function(i, $s) {
|
164
|
+
$s.unbind('click.deckmenu').bind('click.deckmenu', function(e) {
|
165
|
+
if (!$[deck]('getContainer').hasClass(opts.classes.menu)) return;
|
166
|
+
|
167
|
+
$[deck]('go', i);
|
168
|
+
$[deck]('hideMenu');
|
169
|
+
e.stopPropagation();
|
170
|
+
e.preventDefault();
|
171
|
+
});
|
172
|
+
});
|
173
|
+
})
|
174
|
+
.bind('deck.change', function(e, from, to) {
|
175
|
+
var container = $[deck]('getContainer');
|
176
|
+
|
177
|
+
if (container.hasClass($[deck]('getOptions').classes.menu)) {
|
178
|
+
container.scrollTop($[deck]('getSlide', to).offset().top);
|
179
|
+
}
|
180
|
+
});
|
181
|
+
})(jQuery, 'deck');
|
182
|
+
|
@@ -0,0 +1,57 @@
|
|
1
|
+
.deck-menu {
|
2
|
+
.slide {
|
3
|
+
background:#eee;
|
4
|
+
position:relative;
|
5
|
+
left:0;
|
6
|
+
top:0;
|
7
|
+
visibility:visible;
|
8
|
+
cursor:pointer;
|
9
|
+
}
|
10
|
+
|
11
|
+
> .slide {
|
12
|
+
.no-csstransforms & {
|
13
|
+
float:left;
|
14
|
+
width:22%;
|
15
|
+
height:22%;
|
16
|
+
min-height:0;
|
17
|
+
margin:1%;
|
18
|
+
font-size:0.22em;
|
19
|
+
overflow:hidden;
|
20
|
+
padding:0 0.5%;
|
21
|
+
}
|
22
|
+
|
23
|
+
.csstransforms & {
|
24
|
+
-webkit-transform:scale(.22);
|
25
|
+
-moz-transform:scale(.22);
|
26
|
+
-o-transform:scale(.22);
|
27
|
+
-ms-transform:scale(.22);
|
28
|
+
transform:scale(.22);
|
29
|
+
-webkit-transform-origin:0 0;
|
30
|
+
-moz-transform-origin:0 0;
|
31
|
+
-o-transform-origin:0 0;
|
32
|
+
-ms-transform-origin:0 0;
|
33
|
+
transform-origin:0 0;
|
34
|
+
-webkit-box-sizing: border-box;
|
35
|
+
-moz-box-sizing: border-box;
|
36
|
+
box-sizing: border-box;
|
37
|
+
width:100%;
|
38
|
+
height:100%;
|
39
|
+
overflow:hidden;
|
40
|
+
padding:0 48px;
|
41
|
+
}
|
42
|
+
}
|
43
|
+
|
44
|
+
iframe, img, video {
|
45
|
+
max-width:100%;
|
46
|
+
}
|
47
|
+
|
48
|
+
.deck-current, .no-touch & .slide:hover {
|
49
|
+
background:#ddf;
|
50
|
+
}
|
51
|
+
|
52
|
+
&.deck-container:hover {
|
53
|
+
.deck-prev-link, .deck-next-link {
|
54
|
+
display:none;
|
55
|
+
}
|
56
|
+
}
|
57
|
+
}
|
@@ -0,0 +1,43 @@
|
|
1
|
+
.deck-container .deck-prev-link, .deck-container .deck-next-link {
|
2
|
+
display: none;
|
3
|
+
position: absolute;
|
4
|
+
z-index: 3;
|
5
|
+
top: 50%;
|
6
|
+
width: 32px;
|
7
|
+
height: 32px;
|
8
|
+
margin-top: -16px;
|
9
|
+
font-size: 20px;
|
10
|
+
font-weight: bold;
|
11
|
+
line-height: 32px;
|
12
|
+
vertical-align: middle;
|
13
|
+
text-align: center;
|
14
|
+
text-decoration: none;
|
15
|
+
color: #fff;
|
16
|
+
background: #888;
|
17
|
+
}
|
18
|
+
.borderradius .deck-container .deck-prev-link, .borderradius .deck-container .deck-next-link {
|
19
|
+
-webkit-border-radius: 16px;
|
20
|
+
-moz-border-radius: 16px;
|
21
|
+
border-radius: 16px;
|
22
|
+
}
|
23
|
+
.deck-container .deck-prev-link:hover, .deck-container .deck-prev-link:focus, .deck-container .deck-prev-link:active, .deck-container .deck-prev-link:visited, .deck-container .deck-next-link:hover, .deck-container .deck-next-link:focus, .deck-container .deck-next-link:active, .deck-container .deck-next-link:visited {
|
24
|
+
color: #fff;
|
25
|
+
}
|
26
|
+
.deck-container .deck-prev-link {
|
27
|
+
left: 8px;
|
28
|
+
}
|
29
|
+
.deck-container .deck-next-link {
|
30
|
+
right: 8px;
|
31
|
+
}
|
32
|
+
.deck-container:hover .deck-prev-link, .deck-container:hover .deck-next-link {
|
33
|
+
display: block;
|
34
|
+
}
|
35
|
+
.deck-container:hover .deck-prev-link.deck-nav-disabled, .touch .deck-container:hover .deck-prev-link, .deck-container:hover .deck-next-link.deck-nav-disabled, .touch .deck-container:hover .deck-next-link {
|
36
|
+
display: none;
|
37
|
+
}
|
38
|
+
|
39
|
+
@media print {
|
40
|
+
.deck-prev-link, .deck-next-link {
|
41
|
+
display: none !important;
|
42
|
+
}
|
43
|
+
}
|
@@ -0,0 +1,83 @@
|
|
1
|
+
/*!
|
2
|
+
Deck JS - deck.navigation
|
3
|
+
Copyright (c) 2011 Caleb Troughton
|
4
|
+
Dual licensed under the MIT license and GPL license.
|
5
|
+
https://github.com/imakewebthings/deck.js/blob/master/MIT-license.txt
|
6
|
+
https://github.com/imakewebthings/deck.js/blob/master/GPL-license.txt
|
7
|
+
*/
|
8
|
+
|
9
|
+
/*
|
10
|
+
This module adds clickable previous and next links to the deck.
|
11
|
+
*/
|
12
|
+
(function($, deck, undefined) {
|
13
|
+
var $d = $(document);
|
14
|
+
|
15
|
+
/*
|
16
|
+
Extends defaults/options.
|
17
|
+
|
18
|
+
options.classes.navDisabled
|
19
|
+
This class is added to a navigation link when that action is disabled.
|
20
|
+
It is added to the previous link when on the first slide, and to the
|
21
|
+
next link when on the last slide.
|
22
|
+
|
23
|
+
options.selectors.nextLink
|
24
|
+
The elements that match this selector will move the deck to the next
|
25
|
+
slide when clicked.
|
26
|
+
|
27
|
+
options.selectors.previousLink
|
28
|
+
The elements that match this selector will move to deck to the previous
|
29
|
+
slide when clicked.
|
30
|
+
*/
|
31
|
+
$.extend(true, $[deck].defaults, {
|
32
|
+
classes: {
|
33
|
+
navDisabled: 'deck-nav-disabled'
|
34
|
+
},
|
35
|
+
|
36
|
+
selectors: {
|
37
|
+
nextLink: '.deck-next-link',
|
38
|
+
previousLink: '.deck-prev-link'
|
39
|
+
}
|
40
|
+
});
|
41
|
+
|
42
|
+
$d.bind('deck.init', function() {
|
43
|
+
var opts = $[deck]('getOptions'),
|
44
|
+
nextSlide = $[deck]('getSlide', 1),
|
45
|
+
nextId = nextSlide ? nextSlide.attr('id') : undefined;
|
46
|
+
|
47
|
+
// Setup prev/next link events
|
48
|
+
$(opts.selectors.previousLink)
|
49
|
+
.unbind('click.decknavigation')
|
50
|
+
.bind('click.decknavigation', function(e) {
|
51
|
+
$[deck]('prev');
|
52
|
+
e.preventDefault();
|
53
|
+
});
|
54
|
+
|
55
|
+
$(opts.selectors.nextLink)
|
56
|
+
.unbind('click.decknavigation')
|
57
|
+
.bind('click.decknavigation', function(e) {
|
58
|
+
$[deck]('next');
|
59
|
+
e.preventDefault();
|
60
|
+
});
|
61
|
+
|
62
|
+
// Start on first slide, previous link is disabled, set next link href
|
63
|
+
$(opts.selectors.previousLink).addClass(opts.classes.navDisabled);
|
64
|
+
$(opts.selectors.nextLink).attr('href', '#' + (nextId ? nextId : ''));
|
65
|
+
})
|
66
|
+
/* Updates link hrefs, and disabled states if last/first slide */
|
67
|
+
.bind('deck.change', function(e, from, to) {
|
68
|
+
var opts = $[deck]('getOptions'),
|
69
|
+
last = $[deck]('getSlides').length - 1,
|
70
|
+
prevSlide = $[deck]('getSlide', to - 1),
|
71
|
+
nextSlide = $[deck]('getSlide', to + 1),
|
72
|
+
prevId = prevSlide ? prevSlide.attr('id') : undefined;
|
73
|
+
nextId = nextSlide ? nextSlide.attr('id') : undefined;
|
74
|
+
|
75
|
+
$(opts.selectors.previousLink)
|
76
|
+
.toggleClass(opts.classes.navDisabled, !to)
|
77
|
+
.attr('href', '#' + (prevId ? prevId : ''));
|
78
|
+
$(opts.selectors.nextLink)
|
79
|
+
.toggleClass(opts.classes.navDisabled, to === last)
|
80
|
+
.attr('href', '#' + (nextId ? nextId : ''));
|
81
|
+
});
|
82
|
+
})(jQuery, 'deck');
|
83
|
+
|
data/lib/slideshow/service/public/slideshow-deck.js/extensions/navigation/deck.navigation.scss
ADDED
@@ -0,0 +1,56 @@
|
|
1
|
+
@mixin border-radius($r) {
|
2
|
+
-webkit-border-radius:$r;
|
3
|
+
-moz-border-radius:$r;
|
4
|
+
border-radius:$r;
|
5
|
+
}
|
6
|
+
|
7
|
+
.deck-container {
|
8
|
+
.deck-prev-link, .deck-next-link {
|
9
|
+
display:none;
|
10
|
+
position:absolute;
|
11
|
+
z-index:3;
|
12
|
+
top:50%;
|
13
|
+
width:32px;
|
14
|
+
height:32px;
|
15
|
+
margin-top:-16px;
|
16
|
+
font-size:20px;
|
17
|
+
font-weight:bold;
|
18
|
+
line-height:32px;
|
19
|
+
vertical-align:middle;
|
20
|
+
text-align:center;
|
21
|
+
text-decoration:none;
|
22
|
+
color:#fff;
|
23
|
+
background:#888;
|
24
|
+
|
25
|
+
.borderradius & {
|
26
|
+
@include border-radius(16px);
|
27
|
+
}
|
28
|
+
|
29
|
+
&:hover, &:focus, &:active, &:visited {
|
30
|
+
color:#fff;
|
31
|
+
}
|
32
|
+
}
|
33
|
+
|
34
|
+
.deck-prev-link {
|
35
|
+
left:8px;
|
36
|
+
}
|
37
|
+
|
38
|
+
.deck-next-link {
|
39
|
+
right:8px;
|
40
|
+
}
|
41
|
+
|
42
|
+
&:hover .deck-prev-link, &:hover .deck-next-link {
|
43
|
+
display:block;
|
44
|
+
|
45
|
+
&.deck-nav-disabled, .touch & {
|
46
|
+
display:none;
|
47
|
+
}
|
48
|
+
}
|
49
|
+
}
|
50
|
+
|
51
|
+
|
52
|
+
@media print {
|
53
|
+
.deck-prev-link, .deck-next-link {
|
54
|
+
display:none !important;
|
55
|
+
}
|
56
|
+
}
|
@@ -0,0 +1,16 @@
|
|
1
|
+
.csstransforms .deck-container.deck-scale {
|
2
|
+
width: auto;
|
3
|
+
-webkit-transform-origin: 50% 0;
|
4
|
+
-moz-transform-origin: 50% 0;
|
5
|
+
-o-transform-origin: 50% 0;
|
6
|
+
-ms-transform-origin: 50% 0;
|
7
|
+
transform-origin: 50% 0;
|
8
|
+
}
|
9
|
+
.csstransforms .deck-container.deck-scale.deck-menu {
|
10
|
+
width: 70%;
|
11
|
+
-webkit-transform: none !important;
|
12
|
+
-moz-transform: none !important;
|
13
|
+
-o-transform: none !important;
|
14
|
+
-ms-transform: none !important;
|
15
|
+
transform: none !important;
|
16
|
+
}
|