staple 0.0.9 → 0.1.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (146) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +9 -7
  3. data/Rakefile +1 -0
  4. data/lib/staple/install_generator.rb +11 -1
  5. data/source/stylesheets/after.scss +5 -0
  6. data/source/stylesheets/before.scss +9 -0
  7. data/source/stylesheets/buttons.scss +0 -0
  8. data/source/stylesheets/color.scss +0 -0
  9. data/source/stylesheets/forms.scss +0 -0
  10. data/source/stylesheets/foundation_and_overrides.scss +3 -0
  11. data/source/stylesheets/sizing.scss +0 -0
  12. data/source/stylesheets/typography.scss +0 -0
  13. data/source/stylesheets/utilities.scss +0 -0
  14. data/staple.gemspec +6 -6
  15. metadata +12 -190
  16. data/config.rb +0 -24
  17. data/source/CNAME +0 -1
  18. data/source/_accordion.html.erb +0 -24
  19. data/source/_accordion_tabs.html.erb +0 -26
  20. data/source/_accordion_tabs_minimal.html.erb +0 -26
  21. data/source/_badges.html.erb +0 -7
  22. data/source/_breadcrumbs.html.erb +0 -7
  23. data/source/_browser.html.erb +0 -29
  24. data/source/_button_group.html.erb +0 -18
  25. data/source/_cards.html.erb +0 -59
  26. data/source/_centered_navigation.html.erb +0 -38
  27. data/source/_code.html.erb +0 -10
  28. data/source/_comment.html.erb +0 -21
  29. data/source/_device.html.erb +0 -10
  30. data/source/_dropdown.html.erb +0 -12
  31. data/source/_expander.html.erb +0 -6
  32. data/source/_flashes.html.erb +0 -15
  33. data/source/_footer.html.erb +0 -28
  34. data/source/_footer_2.html.erb +0 -33
  35. data/source/_grid_items.html.erb +0 -37
  36. data/source/_grid_items_lines.html.erb +0 -44
  37. data/source/_hero.html.erb +0 -11
  38. data/source/_hover_tile_animation.html.erb +0 -11
  39. data/source/_icon_bullet_points.html.erb +0 -30
  40. data/source/_image_gradient_dynamic.html.erb +0 -7
  41. data/source/_intro_text.html.erb +0 -6
  42. data/source/_label_alerts.html.erb +0 -5
  43. data/source/_modal.html.erb +0 -14
  44. data/source/_navigation.html.erb +0 -44
  45. data/source/_pagination.html.erb +0 -17
  46. data/source/_progress_bar.html.erb +0 -3
  47. data/source/_progress_bar_indication.html.erb +0 -5
  48. data/source/_search_bar.html.erb +0 -8
  49. data/source/_search_tools.html.erb +0 -58
  50. data/source/_side_image.html.erb +0 -10
  51. data/source/_sliding_menu.html.erb +0 -13
  52. data/source/_snippet.html.erb +0 -4
  53. data/source/_switch.html.erb +0 -4
  54. data/source/_tables.html.erb +0 -31
  55. data/source/_tables_minimal.html.erb +0 -31
  56. data/source/_texture-legend.html.erb +0 -24
  57. data/source/_textures.html.erb +0 -4
  58. data/source/_tooltip.html.erb +0 -6
  59. data/source/_type_system_geometric.html.erb +0 -18
  60. data/source/_type_system_rounded.html.erb +0 -18
  61. data/source/_type_system_sans.html.erb +0 -18
  62. data/source/_type_system_serif.html.erb +0 -19
  63. data/source/_type_system_slab.html.erb +0 -18
  64. data/source/_type_system_traditional.html.erb +0 -18
  65. data/source/_vertical_tabs.html.erb +0 -30
  66. data/source/_video.html.erb +0 -5
  67. data/source/components.html.erb +0 -174
  68. data/source/foundation/application.html.slim +0 -17
  69. data/source/foundation/foundation_and_overrides.scss +0 -4
  70. data/source/index.html.erb +0 -162
  71. data/source/javascripts/all.js +0 -11
  72. data/source/javascripts/jquery.erToc.js +0 -477
  73. data/source/javascripts/jquery.glide.js +0 -941
  74. data/source/javascripts/staple/accordion.js +0 -5
  75. data/source/javascripts/staple/accordion_tabs.js +0 -19
  76. data/source/javascripts/staple/accordion_tabs_minimal.js +0 -19
  77. data/source/javascripts/staple/centered_navigation.js +0 -14
  78. data/source/javascripts/staple/dropdown.js +0 -9
  79. data/source/javascripts/staple/expander.js +0 -53
  80. data/source/javascripts/staple/navigation.js +0 -23
  81. data/source/javascripts/staple/search_tools.js +0 -110
  82. data/source/javascripts/staple/sliding_menu.js +0 -13
  83. data/source/javascripts/staple/vertical_tabs.js +0 -32
  84. data/source/layouts/layout.erb +0 -1
  85. data/source/refills-hero.html.erb +0 -7
  86. data/source/refills-menu.html.erb +0 -5
  87. data/source/refills-page-scripts.html.erb +0 -66
  88. data/source/stylesheets/_bourbon-nav.scss +0 -86
  89. data/source/stylesheets/_normalize.scss +0 -425
  90. data/source/stylesheets/_refills-nav.scss +0 -102
  91. data/source/stylesheets/_refills-styles.scss +0 -543
  92. data/source/stylesheets/all.scss +0 -61
  93. data/source/stylesheets/staple/_accordion-tabs-minimal.scss +0 -60
  94. data/source/stylesheets/staple/_accordion-tabs.scss +0 -88
  95. data/source/stylesheets/staple/_accordion.scss +0 -55
  96. data/source/stylesheets/staple/_badges.scss +0 -44
  97. data/source/stylesheets/staple/_breadcrumbs.scss +0 -84
  98. data/source/stylesheets/staple/_browser.scss +0 -141
  99. data/source/stylesheets/staple/_button-group.scss +0 -81
  100. data/source/stylesheets/staple/_cards.scss +0 -132
  101. data/source/stylesheets/staple/_centered-navigation.scss +0 -251
  102. data/source/stylesheets/staple/_comment.scss +0 -60
  103. data/source/stylesheets/staple/_device.scss +0 -83
  104. data/source/stylesheets/staple/_dropdown.scss +0 -127
  105. data/source/stylesheets/staple/_expander.scss +0 -30
  106. data/source/stylesheets/staple/_flashes.scss +0 -29
  107. data/source/stylesheets/staple/_footer-2.scss +0 -117
  108. data/source/stylesheets/staple/_footer.scss +0 -76
  109. data/source/stylesheets/staple/_grid-items-lines.scss +0 -86
  110. data/source/stylesheets/staple/_grid-items.scss +0 -97
  111. data/source/stylesheets/staple/_hero.scss +0 -54
  112. data/source/stylesheets/staple/_hover-tile-animation.scss +0 -52
  113. data/source/stylesheets/staple/_icon-bullet-points.scss +0 -63
  114. data/source/stylesheets/staple/_image-gradient-dynamic.scss +0 -59
  115. data/source/stylesheets/staple/_intro-text.scss +0 -67
  116. data/source/stylesheets/staple/_label-alerts.scss +0 -11
  117. data/source/stylesheets/staple/_modal.scss +0 -147
  118. data/source/stylesheets/staple/_navigation.scss +0 -329
  119. data/source/stylesheets/staple/_pagination.scss +0 -51
  120. data/source/stylesheets/staple/_progress-bar-indication.scss +0 -39
  121. data/source/stylesheets/staple/_progress-bar.scss +0 -83
  122. data/source/stylesheets/staple/_search-bar.scss +0 -40
  123. data/source/stylesheets/staple/_search-tools.scss +0 -67
  124. data/source/stylesheets/staple/_side-image.scss +0 -59
  125. data/source/stylesheets/staple/_sliding-menu.scss +0 -63
  126. data/source/stylesheets/staple/_switch.scss +0 -77
  127. data/source/stylesheets/staple/_tables-minimal.scss +0 -60
  128. data/source/stylesheets/staple/_tables.scss +0 -88
  129. data/source/stylesheets/staple/_texture-legend.scss +0 -182
  130. data/source/stylesheets/staple/_textures.scss +0 -119
  131. data/source/stylesheets/staple/_tooltip.scss +0 -57
  132. data/source/stylesheets/staple/_type-system-geometric.scss +0 -103
  133. data/source/stylesheets/staple/_type-system-rounded.scss +0 -107
  134. data/source/stylesheets/staple/_type-system-sans.scss +0 -110
  135. data/source/stylesheets/staple/_type-system-serif.scss +0 -111
  136. data/source/stylesheets/staple/_type-system-slab.scss +0 -107
  137. data/source/stylesheets/staple/_type-system-traditional.scss +0 -114
  138. data/source/stylesheets/staple/_vertical-tabs.scss +0 -105
  139. data/source/stylesheets/staple/_video.scss +0 -21
  140. data/source/type-systems.html.erb +0 -67
  141. data/source/vendor/javascripts/ZeroClipboard.min.js +0 -9
  142. data/source/vendor/javascripts/fixedsticky.js +0 -185
  143. data/source/vendor/javascripts/prism.js +0 -13
  144. data/source/vendor/javascripts/smooth-scroll.js +0 -125
  145. data/source/vendor/stylesheets/fixedsticky.css +0 -22
  146. data/source/vendor/stylesheets/prism.css +0 -126
@@ -1,941 +0,0 @@
1
- /*!
2
- * Glide.js
3
- * Version: 1.0.6
4
- * Simple, lightweight and fast jQuery slider
5
- * Author: @JedrzejChalubek
6
- * Site: http://jedrzejchalubek.com/
7
- * Licensed under the MIT license
8
- */
9
- ;(function ($, window, document, undefined) {
10
-
11
- var name = 'glide',
12
- defaults = {
13
-
14
- // {Int or Bool} False for turning off autoplay
15
- autoplay: 4000,
16
- // {Bool} Pause autoplay on mouseover slider
17
- hoverpause: true,
18
-
19
- // {Bool} Circual play
20
- circular: true,
21
-
22
- // {Int} Animation time
23
- animationDuration: 500,
24
- // {String} Animation easing function
25
- animationTimingFunc: 'cubic-bezier(0.165, 0.840, 0.440, 1.000)',
26
-
27
- /**
28
- * {Bool or String} Show/hide/appendTo arrows
29
- * True for append arrows to slider wrapper
30
- * False for not appending arrows
31
- * Id or class name (e.g. '.class-name') for appending to specific HTML markup
32
- */
33
- arrows: true,
34
- // {String} Arrows wrapper class
35
- arrowsWrapperClass: 'slider-arrows',
36
- // {String} Main class for both arrows
37
- arrowMainClass: 'slider-arrow',
38
- // {String} Right arrow
39
- arrowRightClass: 'slider-arrow--right',
40
- // {String} Right arrow text
41
- arrowRightText: 'next',
42
- // {String} Left arrow
43
- arrowLeftClass: 'slider-arrow--left',
44
- // {String} Left arrow text
45
- arrowLeftText: 'prev',
46
-
47
- /**
48
- * {Bool or String} Show/hide/appendTo bullets navigation
49
- * True for append arrows to slider wrapper
50
- * False for not appending arrows
51
- * Id or class name (e.g. '.class-name') for appending to specific HTML markup
52
- */
53
- navigation: true,
54
- // {Bool} Center bullet navigation
55
- navigationCenter: true,
56
- // {String} Navigation class
57
- navigationClass: 'slider-nav',
58
- // {String} Navigation item class
59
- navigationItemClass: 'slider-nav__item',
60
- // {String} Current navigation item class
61
- navigationCurrentItemClass: 'slider-nav__item--current',
62
-
63
- // {Bool} Slide on left/right keyboard arrows press
64
- keyboard: true,
65
-
66
- // {Int or Bool} Touch settings
67
- touchDistance: 60,
68
-
69
- // {Function} Callback before plugin init
70
- beforeInit: function() {},
71
- // {Function} Callback after plugin init
72
- afterInit: function() {},
73
-
74
- // {Function} Callback before slide change
75
- beforeTransition: function() {},
76
- // {Function} Callback after slide change
77
- afterTransition: function() {}
78
-
79
- };
80
-
81
- /**
82
- * Slider Constructor
83
- * @param {Object} parent
84
- * @param {Object} options
85
- */
86
- function Glide(parent, options) {
87
-
88
- // Cache this
89
- var self = this;
90
-
91
- // Extend options
92
- this.options = $.extend({}, defaults, options);
93
- // Current slide id
94
- this.currentSlide = 0;
95
- // If CSS3 Transition isn't supported switch cssSupport variable to false and use $.animate()
96
- this.cssSupport = ( !this.css.isSupported("transition") || !this.css.isSupported("transform") ) ? false : true;
97
- // If circular set offset, two cloned slides
98
- this.offset = (this.options.circular) ? 2 : 0;
99
-
100
- // Callbacks before plugin init
101
- this.options.beforeInit.call(this);
102
-
103
- // Sidebar
104
- this.parent = parent;
105
- // Initialize
106
- this.init();
107
- // Start autoplay
108
- this.play();
109
-
110
- // Callback after plugin init
111
- this.options.afterInit.call(this);
112
-
113
- /**
114
- * API
115
- * Returning slider methods
116
- */
117
- return {
118
-
119
- /**
120
- * Get current slide number
121
- * @return {Int}
122
- */
123
- current: function() {
124
- return -(self.currentSlide) + 1;
125
- },
126
-
127
- /**
128
- * Reinit
129
- * Rebuild and recalculate dimensions of slider elements
130
- */
131
- reinit: function() {
132
- self.init();
133
- },
134
-
135
- /**
136
- * Start autoplay
137
- */
138
- play: function() {
139
- self.play();
140
- },
141
-
142
- /**
143
- * Stop autoplay
144
- */
145
- pause: function() {
146
- self.pause();
147
- },
148
-
149
- /**
150
- * Slide one forward
151
- * @param {Function} callback
152
- */
153
- next: function(callback) {
154
- self.slide(1, false, callback);
155
- },
156
-
157
- /**
158
- * Slide one backward
159
- * @param {Function} callback
160
- */
161
- prev: function(callback) {
162
- self.slide(-1, false, callback);
163
- },
164
-
165
- /**
166
- * Jump to specifed slide
167
- * @param {Int} distance
168
- * @param {Function} callback
169
- */
170
- jump: function(distance, callback) {
171
- self.slide(distance-1, true, callback);
172
- },
173
-
174
- /**
175
- * Append navigation to specifet target
176
- * @param {Mixed} target
177
- */
178
- nav: function(target) {
179
-
180
- /**
181
- * If navigation wrapper already exist
182
- * Remove it, protection before doubled navigation
183
- */
184
- if (self.navigation.wrapper) self.navigation.wrapper.remove();
185
-
186
- // While target isn't specifed, use slider wrapper
187
- self.options.navigation = (target) ? target : self.options.navigation;
188
- // Build
189
- self.navigation();
190
-
191
- },
192
-
193
- /**
194
- * Append arrows to specifet target
195
- * @param {Mixed} target
196
- */
197
- arrows: function(target) {
198
-
199
- /**
200
- * If arrows wrapper already exist
201
- * Remove it, protection before doubled arrows
202
- */
203
- if (self.arrows.wrapper) self.arrows.wrapper.remove();
204
-
205
- // While target isn't specifed, use slider wrapper
206
- self.options.arrows = (target) ? target : self.options.arrows;
207
- // Build
208
- self.arrows();
209
-
210
- }
211
-
212
- };
213
-
214
- }
215
-
216
- /**
217
- * Building slider
218
- */
219
- Glide.prototype.build = function() {
220
-
221
- /**
222
- * Attatch bindings
223
- */
224
- this.bindings();
225
-
226
- /**
227
- * There is more than one slide
228
- */
229
- if (this.slides.length > 1) {
230
- /**
231
- * Circular
232
- * If circular option is true
233
- * Append left and right arrow
234
- */
235
- if (this.options.circular) this.circular();
236
-
237
- /**
238
- * Arrows
239
- * If arrows option is true
240
- * Append left and right arrow
241
- */
242
- if (this.options.arrows) this.arrows();
243
-
244
- /**
245
- * Navigation
246
- * If navigation option is true
247
- * Append navigation item for each slide
248
- */
249
- if (this.options.navigation) this.navigation();
250
- }
251
-
252
- /**
253
- * Attatch events
254
- */
255
- this.events();
256
-
257
- };
258
-
259
- /**
260
- * Build circular DOM elements
261
- * Clone first and last slide
262
- * Set wrapper width with addional slides
263
- * Move slider wrapper to first slide
264
- */
265
- Glide.prototype.circular = function() {
266
-
267
- /**
268
- * Clone first and last slide
269
- * and set width for each
270
- */
271
- this.firstClone = this.slides.filter(':first-child').clone().width(this.slides.spread);
272
- this.lastClone = this.slides.filter(':last-child').clone().width(this.slides.spread);
273
-
274
- /**
275
- * Append clodes slides to slider wrapper at the beginning and end
276
- * Increase wrapper with with values of addional slides
277
- * Clear translate and skip cloned last slide at the beginning
278
- */
279
- this.wrapper.append(this.firstClone).prepend(this.lastClone).width( this.parent.width() * (this.slides.length+2) )
280
- .trigger('clearTransition')
281
- .trigger('setTranslate', [-this.slides.spread]);
282
-
283
- };
284
-
285
- /**
286
- * Building navigation DOM
287
- */
288
- Glide.prototype.navigation = function() {
289
-
290
- this.navigation.items = {};
291
-
292
- // Navigation wrapper
293
- this.navigation.wrapper = $('<div />', {
294
- 'class': this.options.navigationClass
295
- }).appendTo(
296
- /**
297
- * Setting append target
298
- * If option is true set default target, that is slider wrapper
299
- * Else get target set in options
300
- * @type {Bool or String}
301
- */
302
- (this.options.navigation === true) ? this.parent : this.options.navigation
303
- );
304
-
305
- for (var i = 0; i < this.slides.length; i++) {
306
- this.navigation.items[i] = $('<a />', {
307
- 'href': '#',
308
- 'class': this.options.navigationItemClass,
309
- // Direction and distance -> Item index forward
310
- 'data-distance': i
311
- }).appendTo(this.navigation.wrapper);
312
- }
313
-
314
- // Add navCurrentItemClass to the first navigation item
315
- this.navigation.items[0].addClass(this.options.navigationCurrentItemClass);
316
-
317
- // If centered option is true
318
- if (this.options.navigationCenter) {
319
- // Center bullet navigation
320
- this.navigation.wrapper.css({
321
- 'left': '50%',
322
- 'width': this.navigation.wrapper.children().outerWidth(true) * this.navigation.wrapper.children().length,
323
- 'margin-left': -(this.navigation.wrapper.outerWidth(true)/2)
324
- });
325
- }
326
-
327
- };
328
-
329
- /**
330
- * Building arrows DOM
331
- */
332
- Glide.prototype.arrows = function() {
333
-
334
- /**
335
- * Arrows wrapper
336
- * @type {Obejct}
337
- */
338
- this.arrows.wrapper = $('<div />', {
339
- 'class': this.options.arrowsWrapperClass
340
- }).appendTo(
341
- /**
342
- * Setting append target
343
- * If option is true set default target, that is slider wrapper
344
- * Else get target set in options
345
- * @type {Bool or String}
346
- */
347
- (this.options.arrows === true) ? this.parent : this.options.arrows
348
- );
349
-
350
- /**
351
- * Right arrow
352
- * @type {Obejct}
353
- */
354
- this.arrows.right = $('<a />', {
355
- 'href': '#',
356
- 'class': this.options.arrowMainClass + ' ' + this.options.arrowRightClass,
357
- // Direction and distance -> One forward
358
- 'data-distance': '1',
359
- 'html': this.options.arrowRightText
360
- }).appendTo(this.arrows.wrapper);
361
-
362
- /**
363
- * Left arrow
364
- * @type {Object}
365
- */
366
- this.arrows.left = $('<a />', {
367
- 'href': '#',
368
- 'class': this.options.arrowMainClass + ' ' + this.options.arrowLeftClass,
369
- // Direction and distance -> One backward
370
- 'data-distance': '-1',
371
- 'html': this.options.arrowLeftText
372
- }).appendTo(this.arrows.wrapper);
373
-
374
- };
375
-
376
- /**
377
- * Function bindings
378
- */
379
- Glide.prototype.bindings = function() {
380
-
381
- var self = this,
382
- o = this.options,
383
- prefix = this.css.getPrefix();
384
-
385
- /**
386
- * Setup slider wrapper bindings
387
- * for translate and transition control
388
- */
389
- this.wrapper.bind({
390
-
391
- /**
392
- * Set transition
393
- */
394
- 'setTransition': function() {
395
- $(this).css( prefix + 'transition', prefix + 'transform ' + o.animationDuration + 'ms ' + o.animationTimingFunc);
396
- },
397
-
398
- /**
399
- * Clear transition
400
- * for immediate jump effect
401
- */
402
- 'clearTransition': function() {
403
- $(this).css( prefix + 'transition', 'none');
404
- },
405
-
406
- /**
407
- * Set translate value
408
- * @param {Object} event
409
- * @param {Ind} translate
410
- */
411
- 'setTranslate': function(event, translate) {
412
- // if css3 suported set translate3d
413
- if (self.cssSupport) $(this).css( prefix + 'transform', 'translate3d(' + translate + 'px, 0px, 0px)');
414
- // if not set left margin
415
- else $(this).css('margin-left', translate);
416
- }
417
-
418
- });
419
-
420
- };
421
-
422
- /**
423
- * Events controllers
424
- */
425
- Glide.prototype.events = function() {
426
-
427
- /**
428
- * Swipe
429
- * If swipe option is true
430
- * Attach touch events
431
- */
432
- if (this.options.touchDistance) {
433
- this.parent.on({
434
- 'touchstart MSPointerDown': $.proxy(this.events.touchstart, this),
435
- 'touchmove MSPointerMove': $.proxy(this.events.touchmove, this),
436
- 'touchend MSPointerUp': $.proxy(this.events.touchend, this),
437
- });
438
- }
439
-
440
- /**
441
- * Arrows
442
- * If arrows exists
443
- * Attach click event
444
- */
445
- if (this.arrows.wrapper) {
446
- $(this.arrows.wrapper).children().on('click touchstart',
447
- $.proxy(this.events.arrows, this)
448
- );
449
- }
450
-
451
- /**
452
- * Navigation
453
- * If navigation exists
454
- * Attach click event
455
- */
456
- if (this.navigation.wrapper) {
457
- $(this.navigation.wrapper).children().on('click touchstart',
458
- $.proxy(this.events.navigation, this)
459
- );
460
- }
461
-
462
- /**
463
- * Keyboard
464
- * If keyboard option is true
465
- * Attach press event
466
- */
467
- if (this.options.keyboard) {
468
- $(document).on('keyup.glideKeyup',
469
- $.proxy(this.events.keyboard, this)
470
- );
471
- }
472
-
473
- /**
474
- * Slider hover
475
- * If hover option is true
476
- * Attach hover event
477
- */
478
- if (this.options.hoverpause) {
479
- this.parent.on('mouseover mouseout',
480
- $.proxy(this.events.hover, this)
481
- );
482
- }
483
-
484
- /**
485
- * Slider resize
486
- * On window resize
487
- * Attach resize event
488
- */
489
- $(window).on('resize',
490
- $.proxy(this.events.resize, this)
491
- );
492
-
493
- };
494
-
495
- /**
496
- * Navigation event controller
497
- * On click in navigation item get distance
498
- * Then slide specified distance with jump
499
- */
500
- Glide.prototype.events.navigation = function(event) {
501
-
502
- if ( !this.wrapper.attr('disabled') ) {
503
- // Prevent default behaviour
504
- event.preventDefault();
505
- // Slide distance specified in data attribute
506
- this.slide( $(event.currentTarget).data('distance'), true );
507
- }
508
-
509
- };
510
-
511
- /**
512
- * Arrows event controller
513
- * On click in arrows get direction and distance
514
- * Then slide specified distance without jump
515
- * @param {Obejct} event
516
- */
517
- Glide.prototype.events.arrows = function(event) {
518
-
519
- if ( !this.wrapper.attr('disabled') ) {
520
- // Prevent default behaviour
521
- event.preventDefault();
522
- // Slide distance specified in data attribute
523
- this.slide( $(event.currentTarget).data('distance'), false );
524
- }
525
-
526
- };
527
-
528
- /**
529
- * Keyboard arrows event controller
530
- * Keyboard left and right arrow keys press
531
- */
532
- Glide.prototype.events.keyboard = function(event) {
533
-
534
- if ( !this.wrapper.attr('disabled') ) {
535
- // Next
536
- if (event.keyCode === 39) this.slide(1);
537
- // Prev
538
- if (event.keyCode === 37) this.slide(-1);
539
- }
540
-
541
- };
542
-
543
- /**
544
- * When mouse is over slider, pause autoplay
545
- * On out, start autoplay again
546
- */
547
- Glide.prototype.events.hover = function(event) {
548
-
549
- // Pasue autoplay
550
- this.pause();
551
-
552
- // When mouse left slider or touch end, start autoplay anew
553
- if (event.type === 'mouseout') this.play();
554
-
555
- };
556
-
557
- /**
558
- * When resize browser window
559
- * Reinit plugin for new slider dimensions
560
- * Correct crop to current slide
561
- */
562
- Glide.prototype.events.resize = function(event) {
563
-
564
- // Reinit plugin (set new slider dimensions)
565
- this.dimensions();
566
- // Crop to current slide
567
- this.slide(0);
568
-
569
- };
570
-
571
- /**
572
- * Disable events thats controls slide changes
573
- */
574
- Glide.prototype.disableEvents = function() {
575
- this.wrapper.attr( "disabled", true );
576
- };
577
-
578
- /**
579
- * Enable events thats controls slide changes
580
- */
581
- Glide.prototype.enableEvents = function() {
582
- this.wrapper.attr( "disabled", false );
583
- };
584
-
585
- /**
586
- * Touch start
587
- * @param {Object} e event
588
- */
589
- Glide.prototype.events.touchstart = function(event) {
590
-
591
- // Cache event
592
- var touch = event.originalEvent.touches[0] || event.originalEvent.changedTouches[0];
593
-
594
- // Get touch start points
595
- this.events.touchStartX = touch.pageX;
596
- this.events.touchStartY = touch.pageY;
597
- this.events.touchSin = null;
598
-
599
- };
600
-
601
- /**
602
- * Touch move
603
- * From swipe length segments calculate swipe angle
604
- * @param {Obejct} e event
605
- */
606
- Glide.prototype.events.touchmove = function(event) {
607
-
608
- // Cache event
609
- var touch = event.originalEvent.touches[0] || event.originalEvent.changedTouches[0];
610
-
611
- // Calculate start, end points
612
- var subExSx = touch.pageX - this.events.touchStartX;
613
- var subEySy = touch.pageY - this.events.touchStartY;
614
- // Bitwise subExSx pow
615
- var powEX = Math.abs( subExSx << 2 );
616
- // Bitwise subEySy pow
617
- var powEY = Math.abs( subEySy << 2 );
618
- // Calculate the length of the hypotenuse segment
619
- var touchHypotenuse = Math.sqrt( powEX + powEY );
620
- // Calculate the length of the cathetus segment
621
- var touchCathetus = Math.sqrt( powEY );
622
-
623
- // Calculate the sine of the angle
624
- this.events.touchSin = Math.asin( touchCathetus/touchHypotenuse );
625
-
626
- if ( (this.events.touchSin * (180 / Math.PI)) < 45 ) event.preventDefault();
627
-
628
- };
629
-
630
- /**
631
- * Touch end
632
- * @param {Object} e event
633
- */
634
- Glide.prototype.events.touchend = function(event) {
635
-
636
- // Cache event
637
- var touch = event.originalEvent.touches[0] || event.originalEvent.changedTouches[0];
638
-
639
- // Calculate touch distance
640
- var touchDistance = touch.pageX - this.events.touchStartX;
641
-
642
- // While touch is positive and greater than distance set in options
643
- if ( (touchDistance > this.options.touchDistance) && ( (this.events.touchSin * (180 / Math.PI)) < 45) ) {
644
- // Slide one backward
645
- this.slide(-1);
646
- // While touch is negative and lower than negative distance set in options
647
- } else if (
648
- (touchDistance < -this.options.touchDistance) && ( (this.events.touchSin * (180 / Math.PI)) < 45) ) {
649
- // Slide one forward
650
- this.slide(1);
651
- }
652
-
653
- };
654
-
655
- /**
656
- * Slides change & animate logic
657
- * @param {int} distance
658
- * @param {bool} jump
659
- * @param {function} callback
660
- */
661
- Glide.prototype.slide = function(distance, jump, callback) {
662
-
663
- /**
664
- * Stop autoplay
665
- * Clearing timer
666
- */
667
- this.pause();
668
-
669
- // Callbacks before slide change
670
- this.options.beforeTransition.call(this);
671
-
672
- // Setup variables
673
- var self = this,
674
- currentSlide = (jump) ? 0 : this.currentSlide,
675
- slidesLength = -(this.slides.length-1),
676
- fromFirst = false,
677
- fromLast = false;
678
-
679
- /**
680
- * Check if current slide is first and direction is previous, then go to last slide
681
- * or current slide is last and direction is next, then go to the first slide
682
- * else change current slide normally
683
- */
684
- if ( currentSlide === 0 && distance === -1 ) {
685
- fromFirst = true;
686
- currentSlide = slidesLength;
687
- } else if ( currentSlide === slidesLength && distance === 1 ) {
688
- fromLast = true;
689
- currentSlide = 0;
690
- } else {
691
- currentSlide = currentSlide + (-distance);
692
- }
693
-
694
- /**
695
- * Crop to current slide.
696
- * Mul slide width by current slide number.
697
- */
698
- var offset = this.slides.spread * currentSlide;
699
-
700
- /**
701
- * While circular decrease offset with the width of single slide
702
- * When fromFirst and fromLast flags are set, unbind events thats controls changing
703
- * When fromLast flags is set, set offset to slide width mulled by slides count without cloned slides
704
- * When fromFirst flags is set, set offset to zero
705
- */
706
- if (this.options.circular) {
707
- offset = offset - this.slides.spread;
708
- if (fromLast || fromFirst) this.disableEvents();
709
- if (fromLast) offset = this.slides.spread * (slidesLength - 2);
710
- if (fromFirst) offset = 0;
711
- }
712
-
713
- /**
714
- * Slide change animation
715
- * While CSS3 is supported use offset
716
- * if not, use $.animate();
717
- */
718
- if (this.cssSupport) this.wrapper.trigger('setTransition').trigger('setTranslate', [offset]);
719
- else this.wrapper.stop().animate({ 'margin-left': offset }, this.options.animationDuration);
720
-
721
- /**
722
- * While circular
723
- */
724
- if (this.options.circular) {
725
-
726
- /**
727
- * When fromFirst and fromLast flags are set
728
- * after animation clear transition and bind events that control slides changing
729
- */
730
- if (fromFirst || fromLast) {
731
- this.afterAnimation(function(){
732
- self.wrapper.trigger('clearTransition');
733
- self.enableEvents();
734
- });
735
- }
736
-
737
- /**
738
- * When fromLast flag is set
739
- * after animation make immediate jump from cloned slide to proper one
740
- */
741
- if (fromLast) {
742
- this.afterAnimation(function(){
743
- fromLast = false;
744
- self.wrapper.trigger('setTranslate', [-self.slides.spread]);
745
- });
746
- }
747
-
748
- /**
749
- * When fromFirst flag is set
750
- * after animation make immediate jump from cloned slide to proper one
751
- */
752
- if (fromFirst) {
753
- this.afterAnimation(function(){
754
- fromFirst = false;
755
- self.wrapper.trigger('setTranslate', [self.slides.spread * (slidesLength-1)]);
756
- });
757
- }
758
-
759
- }
760
-
761
- // Set to navigation item current class
762
- if (this.options.navigation && this.navigation.wrapper) {
763
- $(this.parent).children('.' + this.options.navigationClass).children()
764
- .eq(-currentSlide)
765
- .addClass(this.options.navigationCurrentItemClass)
766
- .siblings()
767
- .removeClass(this.options.navigationCurrentItemClass);
768
- }
769
-
770
- // Update current slide globaly
771
- this.currentSlide = currentSlide;
772
-
773
- // Callbacks after slide change
774
- this.afterAnimation(function(){
775
- self.options.afterTransition.call(self);
776
- if ( (callback !== 'undefined') && (typeof callback === 'function') ) callback();
777
- });
778
-
779
- /**
780
- * Start autoplay
781
- * Setting up timer
782
- */
783
- this.play();
784
-
785
- };
786
-
787
- /**
788
- * Autoplay logic
789
- * Setup counting
790
- */
791
- Glide.prototype.play = function() {
792
-
793
- // Cache this
794
- var self = this;
795
-
796
- /**
797
- * If autoplay turn on
798
- * Slide one forward after a set time
799
- */
800
- if (this.options.autoplay) {
801
- this.auto = setInterval(function() {
802
- self.slide(1, false);
803
- }, this.options.autoplay);
804
- }
805
-
806
- };
807
-
808
- /**
809
- * Autoplay pause
810
- * Clear counting
811
- */
812
- Glide.prototype.pause = function() {
813
-
814
- /**
815
- * If autoplay turn on
816
- * Clear interial
817
- */
818
- if (this.options.autoplay) this.auto = clearInterval(this.auto);
819
-
820
- };
821
-
822
- /**
823
- * Call callback after animation duration
824
- * Added 10 ms to duration to be sure is fired after animation
825
- * @param {Function} callback
826
- */
827
- Glide.prototype.afterAnimation = function(callback) {
828
-
829
- setTimeout(function(){
830
- callback();
831
- }, this.options.animationDuration + 10);
832
-
833
- };
834
-
835
- /**
836
- * Dimensions
837
- * Get & set dimensions of slider elements
838
- */
839
- Glide.prototype.dimensions = function() {
840
-
841
- // Get slide width
842
- this.slides.spread = this.parent.width();
843
- // Set wrapper width
844
- this.wrapper.width(this.slides.spread * (this.slides.length + this.offset));
845
- // Set slide width
846
- this.slides.add(this.firstClone).add(this.lastClone).width(this.slides.spread);
847
-
848
- };
849
-
850
- /**
851
- * Initialize
852
- * Set wrapper
853
- * Set slides
854
- * Set animation type
855
- */
856
- Glide.prototype.init = function() {
857
-
858
- // Set slides wrapper
859
- this.wrapper = this.parent.children();
860
- // Set slides
861
- this.slides = this.wrapper.children();
862
- // Set slider dimentions
863
- this.dimensions();
864
-
865
- // Build DOM
866
- this.build();
867
-
868
- };
869
-
870
-
871
- /**
872
- * Methods for css3 management
873
- */
874
- Glide.prototype.css = {
875
-
876
- /**
877
- * Check css3 support
878
- * @param {String} Declaration name to check
879
- * @return {Boolean}
880
- */
881
- isSupported: function(declaration) {
882
-
883
- var isSupported = false,
884
- prefixes = 'Khtml ms O Moz Webkit'.split(' '),
885
- clone = document.createElement('div'),
886
- declarationCapital = null;
887
-
888
- declaration = declaration.toLowerCase();
889
- if (clone.style[declaration] !== undefined) isSupported = true;
890
- if (isSupported === false) {
891
- declarationCapital = declaration.charAt(0).toUpperCase() + declaration.substr(1);
892
- for( var i = 0; i < prefixes.length; i++ ) {
893
- if( clone.style[prefixes[i] + declarationCapital ] !== undefined ) {
894
- isSupported = true;
895
- break;
896
- }
897
- }
898
- }
899
-
900
- if (window.opera) {
901
- if (window.opera.version() < 13) isSupported = false;
902
- }
903
-
904
- if (isSupported === 'undefined' || isSupported === undefined) isSupported = false;
905
-
906
- return isSupported;
907
-
908
- },
909
-
910
- /**
911
- * Get browser css prefix
912
- * @return {String} Returns prefix in "-{prefix}-" format
913
- */
914
- getPrefix: function () {
915
-
916
- if (!window.getComputedStyle) return '';
917
-
918
- var styles = window.getComputedStyle(document.documentElement, '');
919
- return '-' + (Array.prototype.slice
920
- .call(styles)
921
- .join('')
922
- .match(/-(moz|webkit|ms)-/) || (styles.OLink === '' && ['', 'o'])
923
- )[1] + '-';
924
-
925
- }
926
-
927
- };
928
-
929
- $.fn[name] = function(options) {
930
-
931
- return this.each(function () {
932
- if ( !$.data(this, 'api_' + name) ) {
933
- $.data(this, 'api_' + name,
934
- new Glide($(this), options)
935
- );
936
- }
937
- });
938
-
939
- };
940
-
941
- })(jQuery, window, document);