JAVASCRIPT   29
lightslider JS
Guest on 2nd February 2023 04:38:33 AM


  1. (function ($, undefined) {
  2.     'use strict';
  3.     var defaults = {
  4.         item: 3,
  5.         autoWidth: false,
  6.         slideMove: 1,
  7.         slideMargin: 10,
  8.         addClass: '',
  9.         mode: 'slide',
  10.         useCSS: true,
  11.         cssEasing: 'ease', //'cubic-bezier(0.25, 0, 0.25, 1)',
  12.         easing: 'linear', //'for jquery animation',//
  13.         speed: 400, //ms'
  14.         auto: false,
  15.         pauseOnHover: false,
  16.         loop: false,
  17.         slideEndAnimation: true,
  18.         pause: 2000,
  19.         keyPress: false,
  20.         controls: true,
  21.         prevHtml: '',
  22.         nextHtml: '',
  23.         rtl: false,
  24.         adaptiveHeight: false,
  25.         vertical: false,
  26.         verticalHeight: 500,
  27.         vThumbWidth: 100,
  28.         thumbItem: 10,
  29.         pager: true,
  30.         gallery: false,
  31.         galleryMargin: 5,
  32.         thumbMargin: 5,
  33.         currentPagerPosition: 'middle',
  34.         enableTouch: true,
  35.         enableDrag: true,
  36.         freeMove: true,
  37.         swipeThreshold: 40,
  38.         responsive: [],
  39.         /* jshint ignore:start */
  40.         onBeforeStart: function ($el) {},
  41.         onSliderLoad: function ($el) {},
  42.         onBeforeSlide: function ($el, scene) {},
  43.         onAfterSlide: function ($el, scene) {},
  44.         onBeforeNextSlide: function ($el, scene) {},
  45.         onBeforePrevSlide: function ($el, scene) {}
  46.         /* jshint ignore:end */
  47.     };
  48.     $.fn.lightSlider = function (options) {
  49.         if (this.length === 0) {
  50.             return this;
  51.         }
  52.  
  53.         if (this.length > 1) {
  54.             this.each(function () {
  55.                 $(this).lightSlider(options);
  56.             });
  57.             return this;
  58.         }
  59.  
  60.         var plugin = {},
  61.             settings = $.extend(true, {}, defaults, options),
  62.             settingsTemp = {},
  63.             $el = this;
  64.         plugin.$el = this;
  65.  
  66.         if (settings.mode === 'fade') {
  67.             settings.vertical = false;
  68.         }
  69.         var $children = $el.children(),
  70.             windowW = $(window).width(),
  71.             breakpoint = null,
  72.             resposiveObj = null,
  73.             length = 0,
  74.             w = 0,
  75.             on = false,
  76.             elSize = 0,
  77.             $slide = '',
  78.             scene = 0,
  79.             property = (settings.vertical === true) ? 'height' : 'width',
  80.             gutter = (settings.vertical === true) ? 'margin-bottom' : 'margin-right',
  81.             slideValue = 0,
  82.             pagerWidth = 0,
  83.             slideWidth = 0,
  84.             thumbWidth = 0,
  85.             interval = null,
  86.             isTouch = ('ontouchstart' in document.documentElement);
  87.         var refresh = {};
  88.  
  89.         refresh.chbreakpoint = function () {
  90.             windowW = $(window).width();
  91.             if (settings.responsive.length) {
  92.                 var item;
  93.                 if (settings.autoWidth === false) {
  94.                     item = settings.item;
  95.                 }
  96.                 if (windowW < settings.responsive[0].breakpoint) {
  97.                     for (var i = 0; i < settings.responsive.length; i++) {
  98.                         if (windowW < settings.responsive[i].breakpoint) {
  99.                             breakpoint = settings.responsive[i].breakpoint;
  100.                             resposiveObj = settings.responsive[i];
  101.                         }
  102.                     }
  103.                 }
  104.                 if (typeof resposiveObj !== 'undefined' && resposiveObj !== null) {
  105.                     for (var j in resposiveObj.settings) {
  106.                         if (resposiveObj.settings.hasOwnProperty(j)) {
  107.                             if (typeof settingsTemp[j] === 'undefined' || settingsTemp[j] === null) {
  108.                                 settingsTemp[j] = settings[j];
  109.                             }
  110.                             settings[j] = resposiveObj.settings[j];
  111.                         }
  112.                     }
  113.                 }
  114.                 if (!$.isEmptyObject(settingsTemp) && windowW > settings.responsive[0].breakpoint) {
  115.                     for (var k in settingsTemp) {
  116.                         if (settingsTemp.hasOwnProperty(k)) {
  117.                             settings[k] = settingsTemp[k];
  118.                         }
  119.                     }
  120.                 }
  121.                 if (settings.autoWidth === false) {
  122.                     if (slideValue > 0 && slideWidth > 0) {
  123.                         if (item !== settings.item) {
  124.                             scene = Math.round(slideValue / ((slideWidth + settings.slideMargin) * settings.slideMove));
  125.                         }
  126.                     }
  127.                 }
  128.             }
  129.         };
  130.  
  131.         refresh.calSW = function () {
  132.             if (settings.autoWidth === false) {
  133.                 slideWidth = (elSize - ((settings.item * (settings.slideMargin)) - settings.slideMargin)) / settings.item;
  134.             }
  135.         };
  136.  
  137.         refresh.calWidth = function (cln) {
  138.             var ln = cln === true ? $slide.find('.lslide').length : $children.length;
  139.             if (settings.autoWidth === false) {
  140.                 w = ln * (slideWidth + settings.slideMargin);
  141.             } else {
  142.                 w = 0;
  143.                 for (var i = 0; i < ln; i++) {
  144.                     w += (parseInt($children.eq(i).width()) + settings.slideMargin);
  145.                 }
  146.             }
  147.             return w;
  148.         };
  149.         plugin = {
  150.             doCss: function () {
  151.                 var support = function () {
  152.                     var transition = ['transition', 'MozTransition', 'WebkitTransition', 'OTransition', 'msTransition', 'KhtmlTransition'];
  153.                     var root = document.documentElement;
  154.                     for (var i = 0; i < transition.length; i++) {
  155.                         if (transition[i] in root.style) {
  156.                             return true;
  157.                         }
  158.                     }
  159.                 };
  160.                 if (settings.useCSS && support()) {
  161.                     return true;
  162.                 }
  163.                 return false;
  164.             },
  165.             keyPress: function () {
  166.                 if (settings.keyPress) {
  167.                     $(document).on('keyup.lightslider', function (e) {
  168.                         if (!$(':focus').is('input, textarea')) {
  169.                             if (e.preventDefault) {
  170.                                 e.preventDefault();
  171.                             } else {
  172.                                 e.returnValue = false;
  173.                             }
  174.                             if (e.keyCode === 37) {
  175.                                 $el.goToPrevSlide();
  176.                             } else if (e.keyCode === 39) {
  177.                                 $el.goToNextSlide();
  178.                             }
  179.                         }
  180.                     });
  181.                 }
  182.             },
  183.             controls: function () {
  184.                 if (settings.controls) {
  185.                     $el.after('<div class="lSAction"><a class="lSPrev">' + settings.prevHtml + '</a><a class="lSNext">' + settings.nextHtml + '</a></div>');
  186.                     if (!settings.autoWidth) {
  187.                         if (length <= settings.item) {
  188.                             $slide.find('.lSAction').hide();
  189.                         }
  190.                     } else {
  191.                         if (refresh.calWidth(false) < elSize) {
  192.                             $slide.find('.lSAction').hide();
  193.                         }
  194.                     }
  195.                     $slide.find('.lSAction a').on('click', function (e) {
  196.                         if (e.preventDefault) {
  197.                             e.preventDefault();
  198.                         } else {
  199.                             e.returnValue = false;
  200.                         }
  201.                         if ($(this).attr('class') === 'lSPrev') {
  202.                             $el.goToPrevSlide();
  203.                         } else {
  204.                             $el.goToNextSlide();
  205.                         }
  206.                         return false;
  207.                     });
  208.                 }
  209.             },
  210.             initialStyle: function () {
  211.                 var $this = this;
  212.                 if (settings.mode === 'fade') {
  213.                     settings.autoWidth = false;
  214.                     settings.slideEndAnimation = false;
  215.                 }
  216.                 if (settings.auto) {
  217.                     settings.slideEndAnimation = false;
  218.                 }
  219.                 if (settings.autoWidth) {
  220.                     settings.slideMove = 1;
  221.                     settings.item = 1;
  222.                 }
  223.                 if (settings.loop) {
  224.                     settings.slideMove = 1;
  225.                     settings.freeMove = false;
  226.                 }
  227.                 settings.onBeforeStart.call(this, $el);
  228.                 refresh.chbreakpoint();
  229.                 $el.addClass('lightSlider').wrap('<div class="lSSlideOuter ' + settings.addClass + '"><div class="lSSlideWrapper"></div></div>');
  230.                 $slide = $el.parent('.lSSlideWrapper');
  231.                 if (settings.rtl === true) {
  232.                     $slide.parent().addClass('lSrtl');
  233.                 }
  234.                 if (settings.vertical) {
  235.                     $slide.parent().addClass('vertical');
  236.                     elSize = settings.verticalHeight;
  237.                     $slide.css('height', elSize + 'px');
  238.                 } else {
  239.                     elSize = $el.outerWidth();
  240.                 }
  241.                 $children.addClass('lslide');
  242.                 if (settings.loop === true && settings.mode === 'slide') {
  243.                     refresh.calSW();
  244.                     refresh.clone = function () {
  245.                         if (refresh.calWidth(true) > elSize) {
  246.                             /**/
  247.                             var tWr = 0,
  248.                                 tI = 0;
  249.                             for (var k = 0; k < $children.length; k++) {
  250.                                 tWr += (parseInt($el.find('.lslide').eq(k).width()) + settings.slideMargin);
  251.                                 tI++;
  252.                                 if (tWr >= (elSize + settings.slideMargin)) {
  253.                                     break;
  254.                                 }
  255.                             }
  256.                             var tItem = settings.autoWidth === true ? tI : settings.item;
  257.  
  258.                             /**/
  259.                             if (tItem < $el.find('.clone.left').length) {
  260.                                 for (var i = 0; i < $el.find('.clone.left').length - tItem; i++) {
  261.                                     $children.eq(i).remove();
  262.                                 }
  263.                             }
  264.                             if (tItem < $el.find('.clone.right').length) {
  265.                                 for (var j = $children.length - 1; j > ($children.length - 1 - $el.find('.clone.right').length); j--) {
  266.                                     scene--;
  267.                                     $children.eq(j).remove();
  268.                                 }
  269.                             }
  270.                             /**/
  271.                             for (var n = $el.find('.clone.right').length; n < tItem; n++) {
  272.                                 $el.find('.lslide').eq(n).clone().removeClass('lslide').addClass('clone right').appendTo($el);
  273.                                 scene++;
  274.                             }
  275.                             for (var m = $el.find('.lslide').length - $el.find('.clone.left').length; m > ($el.find('.lslide').length - tItem); m--) {
  276.                                 $el.find('.lslide').eq(m - 1).clone().removeClass('lslide').addClass('clone left').prependTo($el);
  277.                             }
  278.                             $children = $el.children();
  279.                         } else {
  280.                             if ($children.hasClass('clone')) {
  281.                                 $el.find('.clone').remove();
  282.                                 $this.move($el, 0);
  283.                             }
  284.                         }
  285.                     };
  286.                     refresh.clone();
  287.                 }
  288.                 refresh.sSW = function () {
  289.                     length = $children.length;
  290.                     if (settings.rtl === true && settings.vertical === false) {
  291.                         gutter = 'margin-left';
  292.                     }
  293.                     if (settings.autoWidth === false) {
  294.                         $children.css(property, slideWidth + 'px');
  295.                     }
  296.                     $children.css(gutter, settings.slideMargin + 'px');
  297.                     w = refresh.calWidth(false);
  298.                     $el.css(property, w + 'px');
  299.                     if (settings.loop === true && settings.mode === 'slide') {
  300.                         if (on === false) {
  301.                             scene = $el.find('.clone.left').length;
  302.                         }
  303.                     }
  304.                 };
  305.                 refresh.calL = function () {
  306.                     $children = $el.children();
  307.                     length = $children.length;
  308.                 };
  309.                 if (this.doCss()) {
  310.                     $slide.addClass('usingCss');
  311.                 }
  312.                 refresh.calL();
  313.                 if (settings.mode === 'slide') {
  314.                     refresh.calSW();
  315.                     refresh.sSW();
  316.                     if (settings.loop === true) {
  317.                         slideValue = $this.slideValue();
  318.                         this.move($el, slideValue);
  319.                     }
  320.                     if (settings.vertical === false) {
  321.                         this.setHeight($el, false);
  322.                     }
  323.  
  324.                 } else {
  325.                     this.setHeight($el, true);
  326.                     $el.addClass('lSFade');
  327.                     if (!this.doCss()) {
  328.                         $children.fadeOut(0);
  329.                         $children.eq(scene).fadeIn(0);
  330.                     }
  331.                 }
  332.                 if (settings.loop === true && settings.mode === 'slide') {
  333.                     $children.eq(scene).addClass('active');
  334.                 } else {
  335.                     $children.first().addClass('active');
  336.                 }
  337.             },
  338.             pager: function () {
  339.                 var $this = this;
  340.                 refresh.createPager = function () {
  341.                     thumbWidth = (elSize - ((settings.thumbItem * (settings.thumbMargin)) - settings.thumbMargin)) / settings.thumbItem;
  342.                     var $children = $slide.find('.lslide');
  343.                     var length = $slide.find('.lslide').length;
  344.                     var i = 0,
  345.                         pagers = '',
  346.                         v = 0;
  347.                     for (i = 0; i < length; i++) {
  348.                         if (settings.mode === 'slide') {
  349.                             // calculate scene * slide value
  350.                             if (!settings.autoWidth) {
  351.                                 v = i * ((slideWidth + settings.slideMargin) * settings.slideMove);
  352.                             } else {
  353.                                 v += ((parseInt($children.eq(i).width()) + settings.slideMargin) * settings.slideMove);
  354.                             }
  355.                         }
  356.                         var thumb = $children.eq(i * settings.slideMove).attr('data-thumb');
  357.                         if (settings.gallery === true) {
  358.                             pagers += '<li style="width:100%;' + property + ':' + thumbWidth + 'px;' + gutter + ':' + settings.thumbMargin + 'px"><a href="#"><img src="' + thumb + '" /></a></li>';
  359.                         } else {
  360.                             pagers += '<li><a href="#">' + (i + 1) + '</a></li>';
  361.                         }
  362.                         if (settings.mode === 'slide') {
  363.                             if ((v) >= w - elSize - settings.slideMargin) {
  364.                                 i = i + 1;
  365.                                 var minPgr = 2;
  366.                                 if (settings.autoWidth) {
  367.                                     pagers += '<li><a href="#">' + (i + 1) + '</a></li>';
  368.                                     minPgr = 1;
  369.                                 }
  370.                                 if (i < minPgr) {
  371.                                     pagers = null;
  372.                                     $slide.parent().addClass('noPager');
  373.                                 } else {
  374.                                     $slide.parent().removeClass('noPager');
  375.                                 }
  376.                                 break;
  377.                             }
  378.                         }
  379.                     }
  380.                     var $cSouter = $slide.parent();
  381.                     $cSouter.find('.lSPager').html(pagers);
  382.                     if (settings.gallery === true) {
  383.                         if (settings.vertical === true) {
  384.                             // set Gallery thumbnail width
  385.                             $cSouter.find('.lSPager').css('width', settings.vThumbWidth + 'px');
  386.                         }
  387.                         pagerWidth = (i * (settings.thumbMargin + thumbWidth)) + 0.5;
  388.                         $cSouter.find('.lSPager').css({
  389.                             property: pagerWidth + 'px',
  390.                             'transition-duration': settings.speed + 'ms'
  391.                         });
  392.                         if (settings.vertical === true) {
  393.                             $slide.parent().css('padding-right', (settings.vThumbWidth + settings.galleryMargin) + 'px');
  394.                         }
  395.                         $cSouter.find('.lSPager').css(property, pagerWidth + 'px');
  396.                     }
  397.                     var $pager = $cSouter.find('.lSPager').find('li');
  398.                     $pager.first().addClass('active');
  399.                     $pager.on('click', function () {
  400.                         if (settings.loop === true && settings.mode === 'slide') {
  401.                             scene = scene + ($pager.index(this) - $cSouter.find('.lSPager').find('li.active').index());
  402.                         } else {
  403.                             scene = $pager.index(this);
  404.                         }
  405.                         $el.mode(false);
  406.                         if (settings.gallery === true) {
  407.                             $this.slideThumb();
  408.                         }
  409.                         return false;
  410.                     });
  411.                 };
  412.                 if (settings.pager) {
  413.                     var cl = 'lSpg';
  414.                     if (settings.gallery) {
  415.                         cl = 'lSGallery';
  416.                     }
  417.                     $slide.after('<ul class="lSPager ' + cl + '"></ul>');
  418.                     var gMargin = (settings.vertical) ? 'margin-left' : 'margin-top';
  419.                     $slide.parent().find('.lSPager').css(gMargin, settings.galleryMargin + 'px');
  420.                     refresh.createPager();
  421.                 }
  422.  
  423.                 setTimeout(function () {
  424.                     refresh.init();
  425.                 }, 0);
  426.             },
  427.             setHeight: function (ob, fade) {
  428.                 var obj = null,
  429.                     $this = this;
  430.                 if (settings.loop) {
  431.                     obj = ob.children('.lslide ').first();
  432.                 } else {
  433.                     obj = ob.children().first();
  434.                 }
  435.                 var setCss = function () {
  436.                     var tH = obj.outerHeight(),
  437.                         tP = 0,
  438.                         tHT = tH;
  439.                     if (fade) {
  440.                         tH = 0;
  441.                         tP = ((tHT) * 100) / elSize;
  442.                     }
  443.                     ob.css({
  444.                         'height': tH + 'px',
  445.                         'padding-bottom': tP + '%'
  446.                     });
  447.                 };
  448.                 setCss();
  449.                 if (obj.find('img').length) {
  450.                     if ( obj.find('img')[0].complete) {
  451.                         setCss();
  452.                         if (!interval) {
  453.                             $this.auto();
  454.                         }  
  455.                     }else{
  456.                         obj.find('img').on('load', function () {
  457.                             setTimeout(function () {
  458.                                 setCss();
  459.                                 if (!interval) {
  460.                                     $this.auto();
  461.                                 }
  462.                             }, 100);
  463.                         });
  464.                     }
  465.                 }else{
  466.                     if (!interval) {
  467.                         $this.auto();
  468.                     }
  469.                 }
  470.             },
  471.             active: function (ob, t) {
  472.                 if (this.doCss() && settings.mode === 'fade') {
  473.                     $slide.addClass('on');
  474.                 }
  475.                 var sc = 0;
  476.                 if (scene * settings.slideMove < length) {
  477.                     ob.removeClass('active');
  478.                     if (!this.doCss() && settings.mode === 'fade' && t === false) {
  479.                         ob.fadeOut(settings.speed);
  480.                     }
  481.                     if (t === true) {
  482.                         sc = scene;
  483.                     } else {
  484.                         sc = scene * settings.slideMove;
  485.                     }
  486.                     //t === true ? sc = scene : sc = scene * settings.slideMove;
  487.                     var l, nl;
  488.                     if (t === true) {
  489.                         l = ob.length;
  490.                         nl = l - 1;
  491.                         if (sc + 1 >= l) {
  492.                             sc = nl;
  493.                         }
  494.                     }
  495.                     if (settings.loop === true && settings.mode === 'slide') {
  496.                         //t === true ? sc = scene - $el.find('.clone.left').length : sc = scene * settings.slideMove;
  497.                         if (t === true) {
  498.                             sc = scene - $el.find('.clone.left').length;
  499.                         } else {
  500.                             sc = scene * settings.slideMove;
  501.                         }
  502.                         if (t === true) {
  503.                             l = ob.length;
  504.                             nl = l - 1;
  505.                             if (sc + 1 === l) {
  506.                                 sc = nl;
  507.                             } else if (sc + 1 > l) {
  508.                                 sc = 0;
  509.                             }
  510.                         }
  511.                     }
  512.  
  513.                     if (!this.doCss() && settings.mode === 'fade' && t === false) {
  514.                         ob.eq(sc).fadeIn(settings.speed);
  515.                     }
  516.                     ob.eq(sc).addClass('active');
  517.                 } else {
  518.                     ob.removeClass('active');
  519.                     ob.eq(ob.length - 1).addClass('active');
  520.                     if (!this.doCss() && settings.mode === 'fade' && t === false) {
  521.                         ob.fadeOut(settings.speed);
  522.                         ob.eq(sc).fadeIn(settings.speed);
  523.                     }
  524.                 }
  525.             },
  526.             move: function (ob, v) {
  527.                 if (settings.rtl === true) {
  528.                     v = -v;
  529.                 }
  530.                 if (this.doCss()) {
  531.                     if (settings.vertical === true) {
  532.                         ob.css({
  533.                             'transform': 'translate3d(0px, ' + (-v) + 'px, 0px)',
  534.                             '-webkit-transform': 'translate3d(0px, ' + (-v) + 'px, 0px)'
  535.                         });
  536.                     } else {
  537.                         ob.css({
  538.                             'transform': 'translate3d(' + (-v) + 'px, 0px, 0px)',
  539.                             '-webkit-transform': 'translate3d(' + (-v) + 'px, 0px, 0px)',
  540.                         });
  541.                     }
  542.                 } else {
  543.                     if (settings.vertical === true) {
  544.                         ob.css('position', 'relative').animate({
  545.                             top: -v + 'px'
  546.                         }, settings.speed, settings.easing);
  547.                     } else {
  548.                         ob.css('position', 'relative').animate({
  549.                             left: -v + 'px'
  550.                         }, settings.speed, settings.easing);
  551.                     }
  552.                 }
  553.                 var $thumb = $slide.parent().find('.lSPager').find('li');
  554.                 this.active($thumb, true);
  555.             },
  556.             fade: function () {
  557.                 this.active($children, false);
  558.                 var $thumb = $slide.parent().find('.lSPager').find('li');
  559.                 this.active($thumb, true);
  560.             },
  561.             slide: function () {
  562.                 var $this = this;
  563.                 refresh.calSlide = function () {
  564.                     if (w > elSize) {
  565.                         slideValue = $this.slideValue();
  566.                         $this.active($children, false);
  567.                         if ((slideValue) > w - elSize - settings.slideMargin) {
  568.                             slideValue = w - elSize - settings.slideMargin;
  569.                         } else if (slideValue < 0) {
  570.                             slideValue = 0;
  571.                         }
  572.                         $this.move($el, slideValue);
  573.                         if (settings.loop === true && settings.mode === 'slide') {
  574.                             if (scene >= (length - ($el.find('.clone.left').length / settings.slideMove))) {
  575.                                 $this.resetSlide($el.find('.clone.left').length);
  576.                             }
  577.                             if (scene === 0) {
  578.                                 $this.resetSlide($slide.find('.lslide').length);
  579.                             }
  580.                         }
  581.                     }
  582.                 };
  583.                 refresh.calSlide();
  584.             },
  585.             resetSlide: function (s) {
  586.                 var $this = this;
  587.                 $slide.find('.lSAction a').addClass('disabled');
  588.                 setTimeout(function () {
  589.                     scene = s;
  590.                     $slide.css('transition-duration', '0ms');
  591.                     slideValue = $this.slideValue();
  592.                     $this.active($children, false);
  593.                     plugin.move($el, slideValue);
  594.                     setTimeout(function () {
  595.                         $slide.css('transition-duration', settings.speed + 'ms');
  596.                         $slide.find('.lSAction a').removeClass('disabled');
  597.                     }, 50);
  598.                 }, settings.speed + 100);
  599.             },
  600.             slideValue: function () {
  601.                 var _sV = 0;
  602.                 if (settings.autoWidth === false) {
  603.                     _sV = scene * ((slideWidth + settings.slideMargin) * settings.slideMove);
  604.                 } else {
  605.                     _sV = 0;
  606.                     for (var i = 0; i < scene; i++) {
  607.                         _sV += (parseInt($children.eq(i).width()) + settings.slideMargin);
  608.                     }
  609.                 }
  610.                 return _sV;
  611.             },
  612.             slideThumb: function () {
  613.                 var position;
  614.                 switch (settings.currentPagerPosition) {
  615.                 case 'left':
  616.                     position = 0;
  617.                     break;
  618.                 case 'middle':
  619.                     position = (elSize / 2) - (thumbWidth / 2);
  620.                     break;
  621.                 case 'right':
  622.                     position = elSize - thumbWidth;
  623.                 }
  624.                 var sc = scene - $el.find('.clone.left').length;
  625.                 var $pager = $slide.parent().find('.lSPager');
  626.                 if (settings.mode === 'slide' && settings.loop === true) {
  627.                     if (sc >= $pager.children().length) {
  628.                         sc = 0;
  629.                     } else if (sc < 0) {
  630.                         sc = $pager.children().length;
  631.                     }
  632.                 }
  633.                 var thumbSlide = sc * ((thumbWidth + settings.thumbMargin)) - (position);
  634.                 if ((thumbSlide + elSize) > pagerWidth) {
  635.                     thumbSlide = pagerWidth - elSize - settings.thumbMargin;
  636.                 }
  637.                 if (thumbSlide < 0) {
  638.                     thumbSlide = 0;
  639.                 }
  640.                 this.move($pager, thumbSlide);
  641.             },
  642.             auto: function () {
  643.                 if (settings.auto) {
  644.                     clearInterval(interval);
  645.                     interval = setInterval(function () {
  646.                         $el.goToNextSlide();
  647.                     }, settings.pause);
  648.                 }
  649.             },
  650.             pauseOnHover: function(){
  651.                 var $this = this;
  652.                 if (settings.auto && settings.pauseOnHover) {
  653.                     $slide.on('mouseenter', function(){
  654.                         $(this).addClass('ls-hover');
  655.                         $el.pause();
  656.                         settings.auto = true;
  657.                     });
  658.                     $slide.on('mouseleave',function(){
  659.                         $(this).removeClass('ls-hover');
  660.                         if (!$slide.find('.lightSlider').hasClass('lsGrabbing')) {
  661.                             $this.auto();
  662.                         }
  663.                     });
  664.                 }
  665.             },
  666.             touchMove: function (endCoords, startCoords) {
  667.                 $slide.css('transition-duration', '0ms');
  668.                 if (settings.mode === 'slide') {
  669.                     var distance = endCoords - startCoords;
  670.                     var swipeVal = slideValue - distance;
  671.                     if ((swipeVal) >= w - elSize - settings.slideMargin) {
  672.                         if (settings.freeMove === false) {
  673.                             swipeVal = w - elSize - settings.slideMargin;
  674.                         } else {
  675.                             var swipeValT = w - elSize - settings.slideMargin;
  676.                             swipeVal = swipeValT + ((swipeVal - swipeValT) / 5);
  677.  
  678.                         }
  679.                     } else if (swipeVal < 0) {
  680.                         if (settings.freeMove === false) {
  681.                             swipeVal = 0;
  682.                         } else {
  683.                             swipeVal = swipeVal / 5;
  684.                         }
  685.                     }
  686.                     this.move($el, swipeVal);
  687.                 }
  688.             },
  689.  
  690.             touchEnd: function (distance) {
  691.                 $slide.css('transition-duration', settings.speed + 'ms');
  692.                 if (settings.mode === 'slide') {
  693.                     var mxVal = false;
  694.                     var _next = true;
  695.                     slideValue = slideValue - distance;
  696.                     if ((slideValue) > w - elSize - settings.slideMargin) {
  697.                         slideValue = w - elSize - settings.slideMargin;
  698.                         if (settings.autoWidth === false) {
  699.                             mxVal = true;
  700.                         }
  701.                     } else if (slideValue < 0) {
  702.                         slideValue = 0;
  703.                     }
  704.                     var gC = function (next) {
  705.                         var ad = 0;
  706.                         if (!mxVal) {
  707.                             if (next) {
  708.                                 ad = 1;
  709.                             }
  710.                         }
  711.                         if (!settings.autoWidth) {
  712.                             var num = slideValue / ((slideWidth + settings.slideMargin) * settings.slideMove);
  713.                             scene = parseInt(num) + ad;
  714.                             if (slideValue >= (w - elSize - settings.slideMargin)) {
  715.                                 if (num % 1 !== 0) {
  716.                                     scene++;
  717.                                 }
  718.                             }
  719.                         } else {
  720.                             var tW = 0;
  721.                             for (var i = 0; i < $children.length; i++) {
  722.                                 tW += (parseInt($children.eq(i).width()) + settings.slideMargin);
  723.                                 scene = i + ad;
  724.                                 if (tW >= slideValue) {
  725.                                     break;
  726.                                 }
  727.                             }
  728.                         }
  729.                     };
  730.                     if (distance >= settings.swipeThreshold) {
  731.                         gC(false);
  732.                         _next = false;
  733.                     } else if (distance <= -settings.swipeThreshold) {
  734.                         gC(true);
  735.                         _next = false;
  736.                     }
  737.                     $el.mode(_next);
  738.                     this.slideThumb();
  739.                 } else {
  740.                     if (distance >= settings.swipeThreshold) {
  741.                         $el.goToPrevSlide();
  742.                     } else if (distance <= -settings.swipeThreshold) {
  743.                         $el.goToNextSlide();
  744.                     }
  745.                 }
  746.             },
  747.  
  748.  
  749.  
  750.             enableDrag: function () {
  751.                 var $this = this;
  752.                 if (!isTouch) {
  753.                     var startCoords = 0,
  754.                         endCoords = 0,
  755.                         isDraging = false;
  756.                     $slide.find('.lightSlider').addClass('lsGrab');
  757.                     $slide.on('mousedown', function (e) {
  758.                         if (w < elSize) {
  759.                             if (w !== 0) {
  760.                                 return false;
  761.                             }
  762.                         }
  763.                         if ($(e.target).attr('class') !== ('lSPrev') && $(e.target).attr('class') !== ('lSNext')) {
  764.                             startCoords = (settings.vertical === true) ? e.pageY : e.pageX;
  765.                             isDraging = true;
  766.                             if (e.preventDefault) {
  767.                                 e.preventDefault();
  768.                             } else {
  769.                                 e.returnValue = false;
  770.                             }
  771.                             // ** Fix for webkit cursor issue https://code.google.com/p/chromium/issues/detail?id=26723
  772.                             $slide.scrollLeft += 1;
  773.                             $slide.scrollLeft -= 1;
  774.                             // *
  775.                             $slide.find('.lightSlider').removeClass('lsGrab').addClass('lsGrabbing');
  776.                             clearInterval(interval);
  777.                         }
  778.                     });
  779.                     $(window).on('mousemove', function (e) {
  780.                         if (isDraging) {
  781.                             endCoords = (settings.vertical === true) ? e.pageY : e.pageX;
  782.                             $this.touchMove(endCoords, startCoords);
  783.                         }
  784.                     });
  785.                     $(window).on('mouseup', function (e) {
  786.                         if (isDraging) {
  787.                             $slide.find('.lightSlider').removeClass('lsGrabbing').addClass('lsGrab');
  788.                             isDraging = false;
  789.                             endCoords = (settings.vertical === true) ? e.pageY : e.pageX;
  790.                             var distance = endCoords - startCoords;
  791.                             if (Math.abs(distance) >= settings.swipeThreshold) {
  792.                                 $(window).on('click.ls', function (e) {
  793.                                     if (e.preventDefault) {
  794.                                         e.preventDefault();
  795.                                     } else {
  796.                                         e.returnValue = false;
  797.                                     }
  798.                                     e.stopImmediatePropagation();
  799.                                     e.stopPropagation();
  800.                                     $(window).off('click.ls');
  801.                                 });
  802.                             }
  803.  
  804.                             $this.touchEnd(distance);
  805.  
  806.                         }
  807.                     });
  808.                 }
  809.             },
  810.  
  811.  
  812.  
  813.  
  814.             enableTouch: function () {
  815.                 var $this = this;
  816.                 if (isTouch) {
  817.                     var startCoords = {},
  818.                         endCoords = {};
  819.                     $slide.on('touchstart', function (e) {
  820.                         endCoords = e.originalEvent.targetTouches[0];
  821.                         startCoords.pageX = e.originalEvent.targetTouches[0].pageX;
  822.                         startCoords.pageY = e.originalEvent.targetTouches[0].pageY;
  823.                         clearInterval(interval);
  824.                     });
  825.                     $slide.on('touchmove', function (e) {
  826.                         if (w < elSize) {
  827.                             if (w !== 0) {
  828.                                 return false;
  829.                             }
  830.                         }
  831.                         var orig = e.originalEvent;
  832.                         endCoords = orig.targetTouches[0];
  833.                         var xMovement = Math.abs(endCoords.pageX - startCoords.pageX);
  834.                         var yMovement = Math.abs(endCoords.pageY - startCoords.pageY);
  835.                         if (settings.vertical === true) {
  836.                             if ((yMovement * 3) > xMovement) {
  837.                                 e.preventDefault();
  838.                             }
  839.                             $this.touchMove(endCoords.pageY, startCoords.pageY);
  840.                         } else {
  841.                             if ((xMovement * 3) > yMovement) {
  842.                                 e.preventDefault();
  843.                             }
  844.                             $this.touchMove(endCoords.pageX, startCoords.pageX);
  845.                         }
  846.  
  847.                     });
  848.                     $slide.on('touchend', function () {
  849.                         if (w < elSize) {
  850.                             if (w !== 0) {
  851.                                 return false;
  852.                             }
  853.                         }
  854.                         var distance;
  855.                         if (settings.vertical === true) {
  856.                             distance = endCoords.pageY - startCoords.pageY;
  857.                         } else {
  858.                             distance = endCoords.pageX - startCoords.pageX;
  859.                         }
  860.                         $this.touchEnd(distance);
  861.                     });
  862.                 }
  863.             },
  864.             build: function () {
  865.                 var $this = this;
  866.                 $this.initialStyle();
  867.                 if (this.doCss()) {
  868.  
  869.                     if (settings.enableTouch === true) {
  870.                         $this.enableTouch();
  871.                     }
  872.                     if (settings.enableDrag === true) {
  873.                         $this.enableDrag();
  874.                     }
  875.                 }
  876.  
  877.                 $(window).on('focus', function(){
  878.                     $this.auto();
  879.                 });
  880.                
  881.                 $(window).on('blur', function(){
  882.                     clearInterval(interval);
  883.                 });
  884.  
  885.                 $this.pager();
  886.                 $this.pauseOnHover();
  887.                 $this.controls();
  888.                 $this.keyPress();
  889.             }
  890.         };
  891.         plugin.build();
  892.         refresh.init = function () {
  893.             refresh.chbreakpoint();
  894.             if (settings.vertical === true) {
  895.                 if (settings.item > 1) {
  896.                     elSize = settings.verticalHeight;
  897.                 } else {
  898.                     elSize = $children.outerHeight();
  899.                 }
  900.                 $slide.css('height', elSize + 'px');
  901.             } else {
  902.                 elSize = $slide.outerWidth();
  903.             }
  904.             if (settings.loop === true && settings.mode === 'slide') {
  905.                 refresh.clone();
  906.             }
  907.             refresh.calL();
  908.             if (settings.mode === 'slide') {
  909.                 $el.removeClass('lSSlide');
  910.             }
  911.             if (settings.mode === 'slide') {
  912.                 refresh.calSW();
  913.                 refresh.sSW();
  914.             }
  915.             setTimeout(function () {
  916.                 if (settings.mode === 'slide') {
  917.                     $el.addClass('lSSlide');
  918.                 }
  919.             }, 1000);
  920.             if (settings.pager) {
  921.                 refresh.createPager();
  922.             }
  923.             if (settings.adaptiveHeight === true && settings.vertical === false) {
  924.                 $el.css('height', $children.eq(scene).outerHeight(true));
  925.             }
  926.             if (settings.adaptiveHeight === false) {
  927.                 if (settings.mode === 'slide') {
  928.                     if (settings.vertical === false) {
  929.                         plugin.setHeight($el, false);
  930.                     }else{
  931.                         plugin.auto();
  932.                     }
  933.                 } else {
  934.                     plugin.setHeight($el, true);
  935.                 }
  936.             }
  937.             if (settings.gallery === true) {
  938.                 plugin.slideThumb();
  939.             }
  940.             if (settings.mode === 'slide') {
  941.                 plugin.slide();
  942.             }
  943.             if (settings.autoWidth === false) {
  944.                 if ($children.length <= settings.item) {
  945.                     $slide.find('.lSAction').hide();
  946.                 } else {
  947.                     $slide.find('.lSAction').show();
  948.                 }
  949.             } else {
  950.                 if ((refresh.calWidth(false) < elSize) && (w !== 0)) {
  951.                     $slide.find('.lSAction').hide();
  952.                 } else {
  953.                     $slide.find('.lSAction').show();
  954.                 }
  955.             }
  956.         };
  957.         $el.goToPrevSlide = function () {
  958.             if (scene > 0) {
  959.                 settings.onBeforePrevSlide.call(this, $el, scene);
  960.                 scene--;
  961.                 $el.mode(false);
  962.                 if (settings.gallery === true) {
  963.                     plugin.slideThumb();
  964.                 }
  965.             } else {
  966.                 if (settings.loop === true) {
  967.                     settings.onBeforePrevSlide.call(this, $el, scene);
  968.                     if (settings.mode === 'fade') {
  969.                         var l = (length - 1);
  970.                         scene = parseInt(l / settings.slideMove);
  971.                     }
  972.                     $el.mode(false);
  973.                     if (settings.gallery === true) {
  974.                         plugin.slideThumb();
  975.                     }
  976.                 } else if (settings.slideEndAnimation === true) {
  977.                     $el.addClass('leftEnd');
  978.                     setTimeout(function () {
  979.                         $el.removeClass('leftEnd');
  980.                     }, 400);
  981.                 }
  982.             }
  983.         };
  984.         $el.goToNextSlide = function () {
  985.             var nextI = true;
  986.             if (settings.mode === 'slide') {
  987.                 var _slideValue = plugin.slideValue();
  988.                 nextI = _slideValue < w - elSize - settings.slideMargin;
  989.             }
  990.             if (((scene * settings.slideMove) < length - settings.slideMove) && nextI) {
  991.                 settings.onBeforeNextSlide.call(this, $el, scene);
  992.                 scene++;
  993.                 $el.mode(false);
  994.                 if (settings.gallery === true) {
  995.                     plugin.slideThumb();
  996.                 }
  997.             } else {
  998.                 if (settings.loop === true) {
  999.                     settings.onBeforeNextSlide.call(this, $el, scene);
  1000.                     scene = 0;
  1001.                     $el.mode(false);
  1002.                     if (settings.gallery === true) {
  1003.                         plugin.slideThumb();
  1004.                     }
  1005.                 } else if (settings.slideEndAnimation === true) {
  1006.                     $el.addClass('rightEnd');
  1007.                     setTimeout(function () {
  1008.                         $el.removeClass('rightEnd');
  1009.                     }, 400);
  1010.                 }
  1011.             }
  1012.         };
  1013.         $el.mode = function (_touch) {
  1014.             if (settings.adaptiveHeight === true && settings.vertical === false) {
  1015.                 $el.css('height', $children.eq(scene).outerHeight(true));
  1016.             }
  1017.             if (on === false) {
  1018.                 if (settings.mode === 'slide') {
  1019.                     if (plugin.doCss()) {
  1020.                         $el.addClass('lSSlide');
  1021.                         if (settings.speed !== '') {
  1022.                             $slide.css('transition-duration', settings.speed + 'ms');
  1023.                         }
  1024.                         if (settings.cssEasing !== '') {
  1025.                             $slide.css('transition-timing-function', settings.cssEasing);
  1026.                         }
  1027.                     }
  1028.                 } else {
  1029.                     if (plugin.doCss()) {
  1030.                         if (settings.speed !== '') {
  1031.                             $el.css('transition-duration', settings.speed + 'ms');
  1032.                         }
  1033.                         if (settings.cssEasing !== '') {
  1034.                             $el.css('transition-timing-function', settings.cssEasing);
  1035.                         }
  1036.                     }
  1037.                 }
  1038.             }
  1039.             if (!_touch) {
  1040.                 settings.onBeforeSlide.call(this, $el, scene);
  1041.             }
  1042.             if (settings.mode === 'slide') {
  1043.                 plugin.slide();
  1044.             } else {
  1045.                 plugin.fade();
  1046.             }
  1047.             if (!$slide.hasClass('ls-hover')) {
  1048.                 plugin.auto();
  1049.             }
  1050.             setTimeout(function () {
  1051.                 if (!_touch) {
  1052.                     settings.onAfterSlide.call(this, $el, scene);
  1053.                 }
  1054.             }, settings.speed);
  1055.             on = true;
  1056.         };
  1057.         $el.play = function () {
  1058.             $el.goToNextSlide();
  1059.             settings.auto = true;
  1060.             plugin.auto();
  1061.         };
  1062.         $el.pause = function () {
  1063.             settings.auto = false;
  1064.             clearInterval(interval);
  1065.         };
  1066.         $el.refresh = function () {
  1067.             refresh.init();
  1068.         };
  1069.         $el.getCurrentSlideCount = function () {
  1070.             var sc = scene;
  1071.             if (settings.loop) {
  1072.                 var ln = $slide.find('.lslide').length,
  1073.                     cl = $el.find('.clone.left').length;
  1074.                 if (scene <= cl - 1) {
  1075.                     sc = ln + (scene - cl);
  1076.                 } else if (scene >= (ln + cl)) {
  1077.                     sc = scene - ln - cl;
  1078.                 } else {
  1079.                     sc = scene - cl;
  1080.                 }
  1081.             }
  1082.             return sc + 1;
  1083.         };
  1084.         $el.getTotalSlideCount = function () {
  1085.             return $slide.find('.lslide').length;
  1086.         };
  1087.         $el.goToSlide = function (s) {
  1088.             if (settings.loop) {
  1089.                 scene = (s + $el.find('.clone.left').length - 1);
  1090.             } else {
  1091.                 scene = s;
  1092.             }
  1093.             $el.mode(false);
  1094.             if (settings.gallery === true) {
  1095.                 plugin.slideThumb();
  1096.             }
  1097.         };
  1098.         $el.destroy = function () {
  1099.             if ($el.lightSlider) {
  1100.                 $el.goToPrevSlide = function(){};
  1101.                 $el.goToNextSlide = function(){};
  1102.                 $el.mode = function(){};
  1103.                 $el.play = function(){};
  1104.                 $el.pause = function(){};
  1105.                 $el.refresh = function(){};
  1106.                 $el.getCurrentSlideCount = function(){};
  1107.                 $el.getTotalSlideCount = function(){};
  1108.                 $el.goToSlide = function(){};
  1109.                 $el.lightSlider = null;
  1110.                 refresh = {
  1111.                     init : function(){}
  1112.                 };
  1113.                 $el.parent().parent().find('.lSAction, .lSPager').remove();
  1114.                 $el.removeClass('lightSlider lSFade lSSlide lsGrab lsGrabbing leftEnd right').removeAttr('style').unwrap().unwrap();
  1115.                 $el.children().removeAttr('style');
  1116.                 $children.removeClass('lslide active');
  1117.                 $el.find('.clone').remove();
  1118.                 $children = null;
  1119.                 interval = null;
  1120.                 on = false;
  1121.                 scene = 0;
  1122.             }
  1123.  
  1124.         };
  1125.         setTimeout(function () {
  1126.             settings.onSliderLoad.call(this, $el);
  1127.         }, 10);
  1128.         $(window).on('resize orientationchange', function (e) {
  1129.             setTimeout(function () {
  1130.                 if (e.preventDefault) {
  1131.                     e.preventDefault();
  1132.                 } else {
  1133.                     e.returnValue = false;
  1134.                 }
  1135.                 refresh.init();
  1136.             }, 200);
  1137.         });
  1138.         return this;
  1139.     };
  1140. }(jQuery));
Raw Paste

Login or Register to edit or fork this paste. It's free.