comparison modules/contrib/views_slideshow/js/views_slideshow.js @ 5:c69a71b4f40f

Add slideshow module

+(function ($, Drupal, drupalSettings) {
+  'use strict';
+  Drupal.viewsSlideshow = Drupal.viewsSlideshow || {};
+  var pagerLocation;
+  var slideNum;
+  var error;
+  var excludeMethods;
+  /**
+   * Views Slideshow Controls
+   */
+  Drupal.viewsSlideshowControls = Drupal.viewsSlideshowControls || {};
+
+  /**
+   * Implement the play hook for controls.
+   */
+  Drupal.viewsSlideshowControls.play = function (options) {
+    // Route the control call to the correct control type.
+    // Need to use try catch so we don't have to check to make sure every part
+    // of the object is defined.
+    try {
+      if (typeof drupalSettings.viewsSlideshowControls[options.slideshowID].top.type != "undefined" && typeof Drupal[drupalSettings.viewsSlideshowControls[options.slideshowID].top.type].play == 'function') {
+        Drupal[drupalSettings.viewsSlideshowControls[options.slideshowID].top.type].play(options);
+      }
+    }
+    catch(err) {
+      // Don't need to do anything on error.
+    }
+
+    try {
+      if (typeof drupalSettings.viewsSlideshowControls[options.slideshowID].bottom.type != "undefined" && typeof Drupal[drupalSettings.viewsSlideshowControls[options.slideshowID].bottom.type].play == 'function') {
+        Drupal[drupalSettings.viewsSlideshowControls[options.slideshowID].bottom.type].play(options);
+      }
+    }
+    catch(err) {
+      // Don't need to do anything on error.
+    }
+  };
+
+  /**
+   * Implement the pause hook for controls.
+   */
+  Drupal.viewsSlideshowControls.pause = function (options) {
+    // Route the control call to the correct control type.
+    // Need to use try catch so we don't have to check to make sure every part
+    // of the object is defined.
+    try {
+      if (typeof drupalSettings.viewsSlideshowControls[options.slideshowID].top.type != "undefined" && typeof Drupal[drupalSettings.viewsSlideshowControls[options.slideshowID].top.type].pause == 'function') {
+        Drupal[drupalSettings.viewsSlideshowControls[options.slideshowID].top.type].pause(options);
+      }
+    }
+    catch(err) {
+      // Don't need to do anything on error.
+    }
+
+    try {
+      if (typeof drupalSettings.viewsSlideshowControls[options.slideshowID].bottom.type != "undefined" && typeof Drupal[drupalSettings.viewsSlideshowControls[options.slideshowID].bottom.type].pause == 'function') {
+        Drupal[drupalSettings.viewsSlideshowControls[options.slideshowID].bottom.type].pause(options);
+      }
+    }
+    catch(err) {
+      // Don't need to do anything on error.
+    }
+  };
+
+
+  /**
+   * Views Slideshow Text Controls
+   */
+
+  // Add views slieshow api calls for views slideshow text controls.
+  Drupal.behaviors.viewsSlideshowControlsText = {
+    attach: function (context) {
+
+      // Process previous link
+      $('.views_slideshow_controls_text_previous:not(.views-slideshow-controls-text-previous-processed)', context).addClass('views-slideshow-controls-text-previous-processed').each(function () {
+        var uniqueID = $(this).attr('id').replace('views_slideshow_controls_text_previous_', '');
+        $(this).click(function () {
+          Drupal.viewsSlideshow.action({"action": 'previousSlide', "slideshowID": uniqueID});
+          return false;
+        });
+      });
+
+      // Process next link
+      $('.views_slideshow_controls_text_next:not(.views-slideshow-controls-text-next-processed)', context).addClass('views-slideshow-controls-text-next-processed').each(function () {
+        var uniqueID = $(this).attr('id').replace('views_slideshow_controls_text_next_', '');
+        $(this).click(function () {
+          Drupal.viewsSlideshow.action({"action": 'nextSlide', "slideshowID": uniqueID});
+          return false;
+        });
+      });
+
+      // Process pause link
+      $('.views_slideshow_controls_text_pause:not(.views-slideshow-controls-text-pause-processed)', context).addClass('views-slideshow-controls-text-pause-processed').each(function () {
+        var uniqueID = $(this).attr('id').replace('views_slideshow_controls_text_pause_', '');
+        $(this).click(function () {
+          if (drupalSettings.viewsSlideshow[uniqueID].paused) {
+            Drupal.viewsSlideshow.action({"action": 'play', "slideshowID": uniqueID, "force": true});
+          }
+          else {
+            Drupal.viewsSlideshow.action({"action": 'pause', "slideshowID": uniqueID, "force": true});
+          }
+          return false;
+        });
+      });
+    }
+  };
+
+  Drupal.viewsSlideshowControlsText = Drupal.viewsSlideshowControlsText || {};
+
+  /**
+   * Implement the pause hook for text controls.
+   */
+  Drupal.viewsSlideshowControlsText.pause = function (options) {
+    var pauseText = Drupal.theme.viewsSlideshowControlsPause ? Drupal.theme('viewsSlideshowControlsPause') : '';
+    var $element = $('#views_slideshow_controls_text_pause_' + options.slideshowID);
+    $element.find('a').text(pauseText);
+    $element.removeClass('views-slideshow-controls-text-status-play');
+    $element.addClass('views-slideshow-controls-text-status-pause');
+  };
+
+  /**
+   * Implement the play hook for text controls.
+   */
+  Drupal.viewsSlideshowControlsText.play = function (options) {
+    var playText = Drupal.theme.viewsSlideshowControlsPlay ? Drupal.theme('viewsSlideshowControlsPlay') : '';
+    var $element = $('#views_slideshow_controls_text_pause_' + options.slideshowID);
+    $element.find('a').text(playText);
+    $element.removeClass('views-slideshow-controls-text-status-pause');
+    $element.addClass('views-slideshow-controls-text-status-play');
+  };
+
+  // Theme the resume control.
+  Drupal.theme.viewsSlideshowControlsPause = function () {
+    return Drupal.t('Resume');
+  };
+
+  // Theme the pause control.
+  Drupal.theme.viewsSlideshowControlsPlay = function () {
+    return Drupal.t('Pause');
+  };
+
+  /**
+   * Views Slideshow Pager
+   */
+  Drupal.viewsSlideshowPager = Drupal.viewsSlideshowPager || {};
+
+  /**
+   * Implement the transitionBegin hook for pagers.
+   */
+  Drupal.viewsSlideshowPager.transitionBegin = function (options) {
+    // Route the pager call to the correct pager type.
+    // Need to use try catch so we don't have to check to make sure every part
+    // of the object is defined.
+    try {
+      if (typeof drupalSettings.viewsSlideshowPager != "undefined" && typeof drupalSettings.viewsSlideshowPager[options.slideshowID].top.type != "undefined" && typeof Drupal[drupalSettings.viewsSlideshowPager[options.slideshowID].top.type].transitionBegin == 'function') {
+        Drupal[drupalSettings.viewsSlideshowPager[options.slideshowID].top.type].transitionBegin(options);
+      }
+    }
+    catch(err) {
+      // Don't need to do anything on error.
+    }
+
+    try {
+      if (typeof drupalSettings.viewsSlideshowPager != "undefined" && typeof drupalSettings.viewsSlideshowPager[options.slideshowID].bottom.type != "undefined" && typeof Drupal[drupalSettings.viewsSlideshowPager[options.slideshowID].bottom.type].transitionBegin == 'function') {
+        Drupal[drupalSettings.viewsSlideshowPager[options.slideshowID].bottom.type].transitionBegin(options);
+      }
+    }
+    catch(err) {
+      // Don't need to do anything on error.
+    }
+  };
+
+  /**
+   * Implement the goToSlide hook for pagers.
+   */
+  Drupal.viewsSlideshowPager.goToSlide = function (options) {
+    // Route the pager call to the correct pager type.
+    // Need to use try catch so we don't have to check to make sure every part
+    // of the object is defined.
+    try {
+      if (typeof drupalSettings.viewsSlideshowPager[options.slideshowID].top.type != "undefined" && typeof Drupal[drupalSettings.viewsSlideshowPager[options.slideshowID].top.type].goToSlide == 'function') {
+        Drupal[drupalSettings.viewsSlideshowPager[options.slideshowID].top.type].goToSlide(options);
+      }
+    }
+    catch(err) {
+      // Don't need to do anything on error.
+    }
+
+    try {
+      if (typeof drupalSettings.viewsSlideshowPager[options.slideshowID].bottom.type != "undefined" && typeof Drupal[drupalSettings.viewsSlideshowPager[options.slideshowID].bottom.type].goToSlide == 'function') {
+        Drupal[drupalSettings.viewsSlideshowPager[options.slideshowID].bottom.type].goToSlide(options);
+      }
+    }
+    catch(err) {
+      // Don't need to do anything on error.
+    }
+  };
+
+  /**
+   * Implement the previousSlide hook for pagers.
+   */
+  Drupal.viewsSlideshowPager.previousSlide = function (options) {
+    // Route the pager call to the correct pager type.
+    // Need to use try catch so we don't have to check to make sure every part
+    // of the object is defined.
+    try {
+      if (typeof drupalSettings.viewsSlideshowPager[options.slideshowID].top.type != "undefined" && typeof Drupal[drupalSettings.viewsSlideshowPager[options.slideshowID].top.type].previousSlide == 'function') {
+        Drupal[drupalSettings.viewsSlideshowPager[options.slideshowID].top.type].previousSlide(options);
+      }
+    }
+    catch(err) {
+      // Don't need to do anything on error.
+    }
+
+    try {
+      if (typeof drupalSettings.viewsSlideshowPager[options.slideshowID].bottom.type != "undefined" && typeof Drupal[drupalSettings.viewsSlideshowPager[options.slideshowID].bottom.type].previousSlide == 'function') {
+        Drupal[drupalSettings.viewsSlideshowPager[options.slideshowID].bottom.type].previousSlide(options);
+      }
+    }
+    catch(err) {
+      // Don't need to do anything on error.
+    }
+  };
+
+  /**
+   * Implement the nextSlide hook for pagers.
+   */
+  Drupal.viewsSlideshowPager.nextSlide = function (options) {
+    // Route the pager call to the correct pager type.
+    // Need to use try catch so we don't have to check to make sure every part
+    // of the object is defined.
+    try {
+      if (typeof drupalSettings.viewsSlideshowPager[options.slideshowID].top.type != "undefined" && typeof Drupal[drupalSettings.viewsSlideshowPager[options.slideshowID].top.type].nextSlide == 'function') {
+        Drupal[drupalSettings.viewsSlideshowPager[options.slideshowID].top.type].nextSlide(options);
+      }
+    }
+    catch(err) {
+      // Don't need to do anything on error.
+    }
+
+    try {
+      if (typeof drupalSettings.viewsSlideshowPager[options.slideshowID].bottom.type != "undefined" && typeof Drupal[drupalSettings.viewsSlideshowPager[options.slideshowID].bottom.type].nextSlide == 'function') {
+        Drupal[drupalSettings.viewsSlideshowPager[options.slideshowID].bottom.type].nextSlide(options);
+      }
+    }
+    catch(err) {
+      // Don't need to do anything on error.
+    }
+  };
+
+
+  /**
+   * Views Slideshow Pager Fields
+   */
+
+  // Add views slieshow api calls for views slideshow pager fields.
+  Drupal.behaviors.viewsSlideshowPagerFields = {
+    attach: function (context) {
+      // Process pause on hover.
+      $('.views_slideshow_pager_field:not(.views-slideshow-pager-field-processed)', context).addClass('views-slideshow-pager-field-processed').each(function () {
+        // Parse out the location and unique id from the full id.
+        var pagerInfo = $(this).attr('id').split('_');
+        var location = pagerInfo[2];
+        pagerInfo.splice(0, 3);
+        var uniqueID = pagerInfo.join('_');
+
+        // Add the activate and pause on pager hover event to each pager item.
+        if (drupalSettings.viewsSlideshowPagerFields[uniqueID][location].activatePauseOnHover) {
+          $(this).children().each(function (index, pagerItem) {
+            var mouseIn = function () {
+              Drupal.viewsSlideshow.action({"action": 'goToSlide', "slideshowID": uniqueID, "slideNum": index});
+              Drupal.viewsSlideshow.action({"action": 'pause', "slideshowID": uniqueID});
+            };
+
+            var mouseOut = function () {
+              Drupal.viewsSlideshow.action({"action": 'play', "slideshowID": uniqueID});
+            };
+
+            if (jQuery.fn.hoverIntent) {
+              $(pagerItem).hoverIntent(mouseIn, mouseOut);
+            }
+            else {
+              $(pagerItem).hover(mouseIn, mouseOut);
+            }
+          });
+        }
+        else {
+          $(this).children().each(function (index, pagerItem) {
+            $(pagerItem).click(function () {
+              Drupal.viewsSlideshow.action({"action": 'goToSlide', "slideshowID": uniqueID, "slideNum": index});
+            });
+          });
+        }
+      });
+    }
+  };
+
+  Drupal.viewsSlideshowPagerFields = Drupal.viewsSlideshowPagerFields || {};
+
+  /**
+   * Implement the transitionBegin hook for pager fields pager.
+   */
+  Drupal.viewsSlideshowPagerFields.transitionBegin = function (options) {
+    for (pagerLocation in drupalSettings.viewsSlideshowPager[options.slideshowID]) {
+      if (drupalSettings.viewsSlideshowPager[options.slideshowID]) {
+        // Remove active class from pagers
+        $('[id^="views_slideshow_pager_field_item_' + pagerLocation + '_' + options.slideshowID + '"]').removeClass('active');
+
+        // Add active class to active pager.
+        $('#views_slideshow_pager_field_item_'+ pagerLocation + '_' + options.slideshowID + '_' + options.slideNum).addClass('active');
+      }
+    }
+  };
+
+  /**
+   * Implement the goToSlide hook for pager fields pager.
+   */
+  Drupal.viewsSlideshowPagerFields.goToSlide = function (options) {
+    for (pagerLocation in drupalSettings.viewsSlideshowPager[options.slideshowID]) {
+      if (drupalSettings.viewsSlideshowPager[options.slideshowID]) {
+        // Remove active class from pagers
+        $('[id^="views_slideshow_pager_field_item_' + pagerLocation + '_' + options.slideshowID + '"]').removeClass('active');
+
+        // Add active class to active pager.
+        $('#views_slideshow_pager_field_item_' + pagerLocation + '_' + options.slideshowID + '_' + options.slideNum).addClass('active');
+      }
+    }
+  };
+
+  /**
+   * Implement the previousSlide hook for pager fields pager.
+   */
+  Drupal.viewsSlideshowPagerFields.previousSlide = function (options) {
+    for (pagerLocation in drupalSettings.viewsSlideshowPager[options.slideshowID]) {
+      if (drupalSettings.viewsSlideshowPager[options.slideshowID]) {
+        // Get the current active pager.
+        var pagerNum = $('[id^="views_slideshow_pager_field_item_' + pagerLocation + '_' + options.slideshowID + '"].active').attr('id').replace('views_slideshow_pager_field_item_' + pagerLocation + '_' + options.slideshowID + '_', '');
+
+        // If we are on the first pager then activate the last pager.
+        // Otherwise activate the previous pager.
+        if (pagerNum === 0) {
+          pagerNum = $('[id^="views_slideshow_pager_field_item_' + pagerLocation + '_' + options.slideshowID + '"]').length() - 1;
+        }
+        else {
+          pagerNum--;
+        }
+
+        // Remove active class from pagers
+        $('[id^="views_slideshow_pager_field_item_' + pagerLocation + '_' + options.slideshowID + '"]').removeClass('active');
+
+        // Add active class to active pager.
+        $('#views_slideshow_pager_field_item_' + pagerLocation + '_' + options.slideshowID + '_' + pagerNum).addClass('active');
+      }
+    }
+  };
+
+  /**
+   * Implement the nextSlide hook for pager fields pager.
+   */
+  Drupal.viewsSlideshowPagerFields.nextSlide = function (options) {
+    for (pagerLocation in drupalSettings.viewsSlideshowPager[options.slideshowID]) {
+      if (drupalSettings.viewsSlideshowPager[options.slideshowID]) {
+        // Get the current active pager.
+        var pagerNum = $('[id^="views_slideshow_pager_field_item_' + pagerLocation + '_' + options.slideshowID + '"].active').attr('id').replace('views_slideshow_pager_field_item_' + pagerLocation + '_' + options.slideshowID + '_', '');
+        var totalPagers = $('[id^="views_slideshow_pager_field_item_' + pagerLocation + '_' + options.slideshowID + '"]').length();
+
+        // If we are on the last pager then activate the first pager.
+        // Otherwise activate the next pager.
+        pagerNum++;
+        if (pagerNum === totalPagers) {
+          pagerNum = 0;
+        }
+
+        // Remove active class from pagers
+        $('[id^="views_slideshow_pager_field_item_' + pagerLocation + '_' + options.slideshowID + '"]').removeClass('active');
+
+        // Add active class to active pager.
+        $('#views_slideshow_pager_field_item_' + pagerLocation + '_' + options.slideshowID + '_' + slideNum).addClass('active');
+      }
+    }
+  };
+
+  // Copy the pager hooks from fields pager to the bullets one.
+  Drupal.viewsSlideshowPagerBullets = Drupal.viewsSlideshowPagerFields || {};
+
+  /**
+   * Views Slideshow Slide Counter
+   */
+
+  Drupal.viewsSlideshowSlideCounter = Drupal.viewsSlideshowSlideCounter || {};
+
+  /**
+   * Implement the transitionBegin for the slide counter.
+   */
+  Drupal.viewsSlideshowSlideCounter.transitionBegin = function (options) {
+    $('#views_slideshow_slide_counter_' + options.slideshowID + ' .num').text(options.slideNum + 1);
+  };
+
+  /**
+   * This is used as a router to process actions for the slideshow.
+   */
+  Drupal.viewsSlideshow.action = function (options) {
+    // Set default values for our return status.
+    var status = {
+      'value': true,
+      'text': ''
+    };
+
+    // If an action isn't specified return false.
+    if (typeof options.action == 'undefined' || options.action === '') {
+      status.value = false;
+      status.text =  Drupal.t('There was no action specified.');
+      return error;
+    }
+
+    // If we are using pause or play switch paused state accordingly.
+    if (options.action === 'pause') {
+      drupalSettings.viewsSlideshow[options.slideshowID].paused = 1;
+      // If the calling method is forcing a pause then mark it as such.
+      if (options.force) {
+        drupalSettings.viewsSlideshow[options.slideshowID].pausedForce = 1;
+      }
+    }
+    else if (options.action === 'play') {
+      // If the slideshow isn't forced pause or we are forcing a play then play
+      // the slideshow.
+      // Otherwise return telling the calling method that it was forced paused.
+      if (!drupalSettings.viewsSlideshow[options.slideshowID].pausedForce || options.force) {
+        drupalSettings.viewsSlideshow[options.slideshowID].paused = 0;
+        drupalSettings.viewsSlideshow[options.slideshowID].pausedForce = 0;
+      }
+      else {
+        status.value = false;
+        status.text += ' ' + Drupal.t('This slideshow is forced paused.');
+        return status;
+      }
+    }
+
+    // We use a switch statement here mainly just to limit the type of actions
+    // that are available.
+    switch (options.action) {
+      case "goToSlide":
+      case "transitionBegin":
+      case "transitionEnd":
+        // The three methods above require a slide number. Checking if it is
+        // defined and it is a number that is an integer.
+        if (typeof options.slideNum == 'undefined' || typeof options.slideNum !== 'number' || parseInt(options.slideNum) !== (options.slideNum - 0)) {
+          status.value = false;
+          status.text = Drupal.t('An invalid integer was specified for slideNum.');
+        }
+      case "pause":
+      case "play":
+      case "nextSlide":
+      case "previousSlide":
+        // Grab our list of methods.
+        var methods = drupalSettings.viewsSlideshow[options.slideshowID]['methods'];
+
+        // if the calling method specified methods that shouldn't be called then
+        // exclude calling them.
+        var excludeMethodsObj = {};
+        if (typeof options.excludeMethods !== 'undefined') {
+          // We need to turn the excludeMethods array into an object so we can use the in
+          // function.
+          for (var i=0; i < excludeMethods.length; i++) {
+            excludeMethodsObj[excludeMethods[i]] = '';
+          }
+        }
+
+        // Call every registered method and don't call excluded ones.
+        for (var i = 0; i < methods[options.action].length; i++) {
+          if (Drupal[methods[options.action][i]] !== 'undefined' && typeof Drupal[methods[options.action][i]][options.action] == 'function' && !(methods[options.action][i] in excludeMethodsObj)) {
+            Drupal[methods[options.action][i]][options.action](options);
+          }
+        }
+        break;
+
+      // If it gets here it's because it's an invalid action.
+      default:
+        status.value = false;
+        status.text = Drupal.t('An invalid action "@action" was specified.', {"@action": options.action});
+    }
+    return status;
+  };
+})(jQuery, Drupal, drupalSettings);