Advertisement
Guest User

Untitled

a guest
Sep 17th, 2014
182
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.62 KB | None | 0 0
  1. if($(document).width() < 640){
  2. window.sliderInit = (function (window, document, undefined) {
  3.  
  4. 'use strict';
  5.  
  6. // Feature Test
  7. if ( 'querySelector' in document && 'addEventListener' in window && Array.prototype.forEach ) {
  8.  
  9. // SELECTORS
  10. var sliders = document.querySelectorAll('[data-slider]');
  11. var mySwipe = Array;
  12.  
  13.  
  14. // EVENTS, LISTENERS, AND INITS
  15.  
  16. // Add class to HTML element to activate conditional CSS
  17. document.documentElement.className += ' js-slider';
  18.  
  19. // Activate all sliders
  20. Array.prototype.forEach.call(sliders, function (slider, index) {
  21.  
  22. // SELECTORS
  23.  
  24. var slideCount = slider.querySelector('[data-slider-count]'); // Slider count wrapper
  25. var slideNav = slider.querySelector('[data-slider-nav]'); // Slider nav wrapper
  26.  
  27.  
  28. // METHODS
  29.  
  30. // Display count of slides
  31. var createSlideCount = function () {
  32. // Variables
  33. var slideTotal = mySwipe[index].getNumSlides();
  34. var slideCurrent = mySwipe[index].getPos();
  35.  
  36. // Content
  37. if ( slideCount !== null ) {
  38. slideCount.innerHTML = slideCurrent + ' of ' + slideTotal;
  39. }
  40. };
  41.  
  42. // Display Slider navigation
  43. var createNavButtons = function () {
  44. if ( slideNav !== null ) {
  45. slideNav.innerHTML = '<a data-slider-nav-prev href="#">Previous</a> | <a data-slider-nav-next href="#">Next</a>';
  46. }
  47. };
  48.  
  49. // Stop YouTube and Vimeo videos from playing when leaving the slide
  50. var stopVideo = function () {
  51. var currentSlide = mySwipe[index].getPos() - 1;
  52. var iframe = slider.querySelector( '[data-index="' + currentSlide + '"] iframe');
  53. var video = slider.querySelector( '[data-index="' + currentSlide + '"] video' );
  54. if ( iframe !== null ) {
  55. var iframeSrc = iframe.src;
  56. iframe.src = iframeSrc;
  57. }
  58. if ( video !== null ) {
  59. video.pause();
  60. }
  61. };
  62.  
  63. // Handle next button
  64. var handleNextBtn = function (event) {
  65. event.preventDefault();
  66. stopVideo();
  67. mySwipe[index].next();
  68. };
  69.  
  70. // Handle previous button
  71. var handlePrevBtn = function (event) {
  72. event.preventDefault();
  73. stopVideo();
  74. mySwipe[index].prev();
  75. };
  76.  
  77. // Handle keypress
  78. var handleKeypress = function (event) {
  79. if ( event.keyCode == 37 ) {
  80. mySwipe[index].prev();
  81. }
  82. if ( event.keyCode == 39) {
  83. mySwipe[index].next();
  84. }
  85. };
  86.  
  87.  
  88. // EVENTS, LISTENERS, AND INITS
  89.  
  90. // Activate Slider
  91. mySwipe[index] = Swipe(slider, {
  92. continuous: true,
  93. callback: function(index, elem) {
  94. createSlideCount(); // Update with new position on slide change
  95. }
  96. });
  97.  
  98. // Create slide count and nav
  99. createSlideCount();
  100. createNavButtons();
  101. var btnNext = slider.querySelector('[data-slider-nav-next]'); // Next slide button
  102. var btnPrev = slider.querySelector('[data-slider-nav-prev]'); // Previous slide button
  103.  
  104. // Toggle Previous & Next Buttons
  105. if ( btnNext ) {
  106. btnNext.addEventListener('click', handleNextBtn, false);
  107. }
  108. if ( btnPrev ) {
  109. btnPrev.addEventListener('click', handlePrevBtn, false);
  110. }
  111.  
  112. // Toggle Left & Right Keypress
  113. window.addEventListener('keydown', handleKeypress, false);
  114.  
  115. });
  116.  
  117. }
  118.  
  119. })(window, document);
  120. } else{
  121.  
  122. }
  123.  
  124. var currentState = false;
  125.  
  126. function setSize() {
  127.  
  128. var state = $(window).width() < 640;
  129. if (state != currentState) {
  130. currentState = state;
  131. if (state) {
  132. $(window).on('resize', slider);
  133. }
  134. else {
  135. $(window).off('resize', slider);
  136. }
  137. }
  138. }
  139.  
  140. setSize();
  141. $(window).on('resize', setSize);
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement