JAVASCRIPT   67
scroll
Guest on 29th April 2022 01:37:51 AM


  1. (function(namespace) {
  2.         "use strict";
  3.  
  4.         var Scroll = function(element, options) {
  5.                 this.defaultOptions = {
  6.                         dots: false,
  7.                         arrows: false,
  8.                         infinite: true,
  9.                         speed: 300,
  10.                         swipeToSlide: true,
  11.                         slidesToShow: 1,
  12.                         initialSlide: 1,
  13.                         variableWidth: true,
  14.                         touchThreshold: 999
  15.                 };
  16.                 this.element = element;
  17.                 this.elements = {
  18.                         "items": this.element.find(".items"),
  19.                         "item": this.element.find(".item"),
  20.                         "inner": this.element.find(".inner"),
  21.                         "next": this.element.find(".next"),
  22.                         "prev": this.element.find(".prev")
  23.                 };
  24.                 this.options = _.extend(this.defaultOptions, options);
  25.                 this.scrollWidth = 0;
  26.                 this.slideWidth = 0;
  27.                 this.viewWidth = 0;
  28.  
  29.                 this.init();
  30.         };
  31.  
  32.         /**
  33.          * Init
  34.          */
  35.         Scroll.prototype.init = function() {
  36.                 var that = this;
  37.  
  38.                 //Slide and scroll width
  39.                 this.viewWidth = this.elements.inner.width();
  40.                 this.element.find(".item").each(function() {
  41.                         if(that.slideWidth === 0) {
  42.                                 that.slideWidth = jQuery(this).outerWidth(true);
  43.                         }
  44.  
  45.                         that.scrollWidth += parseInt(jQuery(this).outerWidth(true));
  46.                 });
  47.  
  48.                 //Resize
  49.                 jQuery(window).resize(function(e) {
  50.                         that.resize();
  51.                 });
  52.                 that.resize();
  53.  
  54.                 //Events
  55.                 this.events();
  56.         };
  57.  
  58.         /**
  59.          * Resize
  60.          */
  61.         Scroll.prototype.resize = function() {
  62.                 if(this.elements.items.width() < this.scrollWidth && this.elements.item.length > 1) {
  63.                         if(this.hasScroll !== true) {
  64.                                 this.enableScroll();
  65.                         }
  66.                 } else {
  67.                         if(this.hasScroll !== false) {
  68.  
  69.                                 this.disableScroll();
  70.                         }
  71.                 }
  72.  
  73.                 //slidesToShow
  74.                 var slidesToShow;
  75.                 this.viewWidth = this.elements.inner.width();
  76.                 if(this.hasScroll === true) {
  77.                                 slidesToShow = Math.floor(this.viewWidth / this.slideWidth);
  78.                                 if(slidesToShow<1) {
  79.                                         slidesToShow = 1;
  80.                                 }
  81.  
  82.                                 this.scroller.slickSetOption('slidesToShow', slidesToShow, true);
  83.                 }
  84.         };
  85.  
  86.         /**
  87.          * Enable scroll
  88.          */
  89.         Scroll.prototype.enableScroll = function() {
  90.                 this.hasScroll = true;
  91.                 this.element.addClass("scroll").removeClass("static");
  92.  
  93.                 var slidesToShow = Math.floor(this.viewWidth / this.slideWidth);
  94.                 if(slidesToShow<1) {
  95.                         slidesToShow = 1;
  96.                 }
  97.  
  98.                 this.options.slidesToShow = slidesToShow;
  99.                 this.elements.items.slick(this.options);
  100.                 this.scroller = this.elements.items.slick('getSlick');
  101.         };
  102.  
  103.         /**
  104.          * Disable scroll
  105.          */
  106.         Scroll.prototype.disableScroll = function() {
  107.                 this.hasScroll = false;
  108.                 this.element.removeClass("scroll").addClass("static");
  109.  
  110.                 if(_.isObject(this.scroller)) {
  111.                         this.scroller.unslick();
  112.                         this.scroller = false;
  113.                 }
  114.         };
  115.  
  116.         /**
  117.          * Events
  118.          */
  119.         Scroll.prototype.events = function() {
  120.                 var that = this;
  121.  
  122.                 //Next
  123.                 this.elements.next.bind('click.Scroll', function(e) {
  124.                         e.preventDefault();
  125.  
  126.                         if(_.isObject(that.scroller)) {
  127.                                 that.scroller.slickNext();
  128.                         }
  129.                 });
  130.  
  131.                 //Prev
  132.                 this.elements.prev.bind('click.Scroll', function(e) {
  133.                         e.preventDefault();
  134.  
  135.                         if(_.isObject(that.scroller)) {
  136.                                 that.scroller.slickPrev();
  137.                         }
  138.                 });
  139.         };
  140.  
  141.         window[namespace].Scroll = Scroll;
  142. })('edison');
Raw Paste

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