@valo/carousel - npm Package Compare versions

Comparing version 1.0.13 to 1.0.14

dist/carousel.min.js

		@@ -1,1 +0,1 @@
		!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t();else if("function"==typeof define&&define.amd)define([],t);else{var i=t();for(var r in i)("object"==typeof exports?exports:e)[r]=i[r]}}("undefined"!=typeof self?self:this,function(){return function(e){function t(r){if(i[r])return i[r].exports;var n=i[r]={i:r,l:!1,exports:{}};return e[r].call(n.exports,n,n.exports,t),n.l=!0,n.exports}var i={};return t.m=e,t.c=i,t.d=function(e,i,r){t.o(e,i)\|\|Object.defineProperty(e,i,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var i=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(i,"a",i),i},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=0)}([function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=i(1);Object.defineProperty(t,"carousel",{enumerable:!0,get:function(){return r.Siema}});var n=i(2);Object.defineProperty(t,"Observer",{enumerable:!0,get:function(){return n.Observer}})},function(e,t,i){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},s=function(){function e(e,t){for(var i=0;i<t.length;i++){var r=t[i];r.enumerable=r.enumerable\|\|!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,i,r){return i&&e(t.prototype,i),r&&e(t,r),t}}();t.Siema=function(){function e(t){var i=this;if(r(this,e),this.config=e.mergeSettings(t),this.selector="string"==typeof this.config.selector?document.querySelector(this.config.selector):this.config.selector,null===this.selector)throw new Error("Something wrong with your selector");this.resolveSlidesNumber(),this.selectorWidth=this.selector.offsetWidth,this.innerElements=[].slice.call(this.selector.children),this.currentSlide=this.config.loop?this.config.startIndex%this.innerElements.length:Math.max(0,Math.min(this.config.startIndex,this.innerElements.length-this.perPage)),this.transformProperty=e.webkitOrNot(),["resizeHandler","touchstartHandler","touchendHandler","touchmoveHandler","bodyTouchMove","mousedownHandler","mouseupHandler","mouseleaveHandler","mousemoveHandler","clickHandler"].forEach(function(e){i[e]=i[e].bind(i)}),this.init()}return s(e,[{key:"attachEvents",value:function(){window.addEventListener("resize",this.resizeHandler),this.config.draggable&&(this.pointerDown=!1,this.drag={startX:0,endX:0,startY:0,letItGo:null,preventClick:!1},document.body.addEventListener("touchmove",this.bodyTouchMove,!0),this.selector.addEventListener("touchstart",this.touchstartHandler),this.selector.addEventListener("touchend",this.touchendHandler),this.selector.addEventListener("touchmove",this.touchmoveHandler),this.selector.addEventListener("mousedown",this.mousedownHandler),this.selector.addEventListener("mouseup",this.mouseupHandler),this.selector.addEventListener("mouseleave",this.mouseleaveHandler),this.selector.addEventListener("mousemove",this.mousemoveHandler),this.selector.addEventListener("click",this.clickHandler))}},{key:"detachEvents",value:function(){window.removeEventListener("resize",this.resizeHandler),this.selector.removeEventListener("touchstart",this.touchstartHandler),this.selector.removeEventListener("touchend",this.touchendHandler),this.selector.removeEventListener("touchmove",this.touchmoveHandler),this.selector.removeEventListener("mousedown",this.mousedownHandler),this.selector.removeEventListener("mouseup",this.mouseupHandler),this.selector.removeEventListener("mouseleave",this.mouseleaveHandler),this.selector.removeEventListener("mousemove",this.mousemoveHandler),this.selector.removeEventListener("click",this.clickHandler)}},{key:"init",value:function(){this.attachEvents(),this.selector.style.overflow="hidden",this.selector.style.direction=this.config.rtl?"rtl":"ltr",this.buildSliderFrame(),this.config.onInit.call(this)}},{key:"buildSliderFrame",value:function(){var e=document.querySelector(this.config.selector);if(null!==e){if(!e.querySelector(".sliderFrame")){var t=this.selectorWidth/this.perPage,i=this.config.loop?this.innerElements.length+2this.perPage:this.innerElements.length;this.sliderFrame=document.createElement("div"),this.sliderFrame.classList.add("sliderFrame"),this.sliderFrame.style.width=ti+"px",this.enableTransition(),this.config.draggable&&(this.selector.style.cursor="-webkit-grab");var r=document.createDocumentFragment();if(this.config.loop)for(var n=this.innerElements.length-this.perPage;n<this.innerElements.length;n++){var s=this.buildSliderFrameItem(this.innerElements[n].cloneNode(!0));r.appendChild(s)}for(var o=0;o<this.innerElements.length;o++){var l=this.buildSliderFrameItem(this.innerElements[o]);r.appendChild(l)}if(this.config.loop)for(var a=0;a<this.perPage;a++){var h=this.buildSliderFrameItem(this.innerElements[a].cloneNode(!0));r.appendChild(h)}this.sliderFrame.appendChild(r),this.selector.innerHTML="",this.selector.appendChild(this.sliderFrame)}if(this.config.useIntersectionObserver){new Observer({selector:this.config.selector})}this.slideToCurrent()}}},{key:"buildSliderFrameItem",value:function(e){var t=document.createElement("div");return t.style.cssFloat=this.config.rtl?"right":"left",t.style.float=this.config.rtl?"right":"left",t.style.width=(this.config.loop?100/(this.innerElements.length+2this.perPage):100/this.innerElements.length)+"%",t.appendChild(e),t}},{key:"resolveSlidesNumber",value:function(){if("number"==typeof this.config.perPage)this.perPage=this.config.perPage;else if("object"===n(this.config.perPage)){this.perPage=1;for(var e in this.config.perPage)window.innerWidth>=e&&(this.perPage=this.config.perPage[e])}}},{key:"prev",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:1,t=arguments[1];if(!(this.innerElements.length<=this.perPage)){var i=this.currentSlide;if(this.config.loop){if(this.currentSlide-e<0){this.disableTransition();var r=this.currentSlide+this.innerElements.length,n=this.perPage,s=r+n,o=(this.config.rtl?1:-1)s(this.selectorWidth/this.perPage),l=this.config.draggable?this.drag.endX-this.drag.startX:0;this.sliderFrame.style[this.transformProperty]="translate3d("+(o+l)+"px, 0, 0)",this.currentSlide=r-e}else this.currentSlide=this.currentSlide-e}else this.currentSlide=Math.max(this.currentSlide-e,0);i!==this.currentSlide&&(this.slideToCurrent(this.config.loop),this.config.onChange.call(this),t&&t.call(this))}}},{key:"next",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:1,t=arguments[1];if(!(this.innerElements.length<=this.perPage)){var i=this.currentSlide;if(this.config.loop){if(this.currentSlide+e>this.innerElements.length-this.perPage){this.disableTransition();var r=this.currentSlide-this.innerElements.length,n=this.perPage,s=r+n,o=(this.config.rtl?1:-1)s(this.selectorWidth/this.perPage),l=this.config.draggable?this.drag.endX-this.drag.startX:0;this.sliderFrame.style[this.transformProperty]="translate3d("+(o+l)+"px, 0, 0)",this.currentSlide=r+e}else this.currentSlide=this.currentSlide+e}else this.currentSlide=Math.min(this.currentSlide+e,this.innerElements.length-this.perPage);i!==this.currentSlide&&(this.slideToCurrent(this.config.loop),this.config.onChange.call(this),t&&t.call(this))}}},{key:"disableTransition",value:function(){void 0!==this.sliderFrame&&(this.sliderFrame.style.webkitTransition="all 0ms "+this.config.easing,this.sliderFrame.style.transition="all 0ms "+this.config.easing)}},{key:"enableTransition",value:function(){void 0!==this.sliderFrame&&(this.sliderFrame.style.webkitTransition="all "+this.config.duration+"ms "+this.config.easing,this.sliderFrame.style.transition="all "+this.config.duration+"ms "+this.config.easing)}},{key:"goTo",value:function(e,t){if(!(this.innerElements.length<=this.perPage)){var i=this.currentSlide;this.currentSlide=this.config.loop?e%this.innerElements.length:Math.min(Math.max(e,0),this.innerElements.length-this.perPage),i!==this.currentSlide&&(this.slideToCurrent(),this.config.onChange.call(this),t&&t.call(this)),this.config.pause\|\|this.resetTimeout()}}},{key:"addDots",value:function(){var e=document.querySelector(this.config.selector),t=document.createElement("div");t.classList.add("dots");for(var i=this,r=0;r<this.innerElements.length;r++)!function(){var e=document.createElement("button");e.classList.add("dots__item"),e.id=r,e.addEventListener("click",function(){i.goTo(e.id)}),t.appendChild(e)}();e.parentNode.insertBefore(t,e.nextSibling)}},{key:"updateDots",value:function(){for(var e=document.querySelector(".dots"),t=0;t<e.querySelectorAll("button").length;t++){var i=this.currentSlide===t?"add":"remove";e.querySelectorAll("button")[t].classList[i]("dots__item--active")}}},{key:"resetTimeout",value:function(){clearTimeout(this.config.timeout),this.config.timeout=null;var e=this;this.config.timeout=setTimeout(function(){e.next(),e.resetTimeout()},this.config.loopDelay)}},{key:"isPaused",value:function(){return this.config.pause}},{key:"togglePause",value:function(){return this.config.pause?(this.next(),this.resetTimeout()):(clearTimeout(this.config.timeout),this.config.timeout=null),this.config.pause=!this.config.pause,this.config.pause}},{key:"slideToCurrent",value:function(e){var t=this,i=this.config.loop?this.currentSlide+this.perPage:this.currentSlide,r=this.config.loop?this.innerElements.length+2this.perPage:this.innerElements.length,n=(this.config.rtl?1:-1)i(this.selectorWidth/this.perPage),s=rthis.selectorWidth;e?requestAnimationFrame(function(){requestAnimationFrame(function(){t.enableTransition(),void 0!==t.sliderFrame&&(t.sliderFrame.style.width=s+"px",t.sliderFrame.style[t.transformProperty]="translate3d("+n+"px, 0, 0)")})}):void 0!==this.sliderFrame&&(this.sliderFrame.style.width=s+"px",this.sliderFrame.style[this.transformProperty]="translate3d("+n+"px, 0, 0)")}},{key:"updateAfterDrag",value:function(){var e=(this.config.rtl?-1:1)(this.drag.endX-this.drag.startX),t=Math.abs(e),i=this.config.multipleDrag?Math.ceil(t/(this.selectorWidth/this.perPage)):1,r=e>0&&this.currentSlide-i<0,n=e<0&&this.currentSlide+i>this.innerElements.length-this.perPage;e>0&&t>this.config.threshold&&this.innerElements.length>this.perPage?(this.prev(i),this.resetTimeout()):e<0&&t>this.config.threshold&&this.innerElements.length>this.perPage&&(this.next(i),this.resetTimeout()),this.slideToCurrent(r\|\|n)}},{key:"resizeHandler",value:function(){this.resolveSlidesNumber(),this.currentSlide+this.perPage>this.innerElements.length&&(this.currentSlide=this.innerElements.length<=this.perPage?0:this.innerElements.length-this.perPage),this.selectorWidth=this.selector.offsetWidth,this.buildSliderFrame()}},{key:"clearDrag",value:function(){this.drag={startX:0,endX:0,startY:0,letItGo:null,preventClick:this.drag.preventClick}}},{key:"touchstartHandler",value:function(e){-1!==["TEXTAREA","OPTION","INPUT","SELECT"].indexOf(e.target.nodeName)\|\|(e.stopPropagation(),this.pointerDown=!0,this.drag.startX=e.touches[0].pageX,this.drag.startY=e.touches[0].pageY)}},{key:"touchendHandler",value:function(e){e.stopPropagation(),this.pointerDown=!1,this.enableTransition(),this.drag.endX&&this.updateAfterDrag(),this.clearDrag()}},{key:"bodyTouchMove",value:function(e){e&&-1!==e.target.className.toLowerCase().indexOf("valo-banner")&&(e.preventDefault(),this.touchmoveHandler(e))}},{key:"touchmoveHandler",value:function(e){if(e.stopPropagation(),null===this.drag.letItGo&&(this.drag.letItGo=Math.abs(this.drag.startY-e.touches[0].pageY)<Math.abs(this.drag.startX-e.touches[0].pageX)),this.pointerDown&&this.drag.letItGo){e.preventDefault(),this.drag.endX=e.touches[0].pageX;var t=this.config.loop?this.currentSlide+this.perPage:this.currentSlide,i=t(this.selectorWidth/this.perPage),r=this.drag.endX-this.drag.startX,n=this.config.rtl?i+r:i-r;void 0!==this.sliderFrame&&(this.sliderFrame.style.webkitTransition="all 0ms "+this.config.easing,this.sliderFrame.style.transition="all 0ms "+this.config.easing,this.sliderFrame.style[this.transformProperty]="translate3d("+(this.config.rtl?1:-1)n+"px, 0, 0)")}}},{key:"mousedownHandler",value:function(e){-1!==["TEXTAREA","OPTION","INPUT","SELECT"].indexOf(e.target.nodeName)\|\|(e.preventDefault(),e.stopPropagation(),this.pointerDown=!0,this.drag.startX=e.pageX)}},{key:"mouseupHandler",value:function(e){e.stopPropagation(),this.pointerDown=!1,this.selector.style.cursor="-webkit-grab",this.enableTransition(),this.drag.endX&&this.updateAfterDrag(),this.clearDrag()}},{key:"mousemoveHandler",value:function(e){if(e.preventDefault(),this.pointerDown){"A"===e.target.nodeName&&(this.drag.preventClick=!0),this.drag.endX=e.pageX,this.selector.style.cursor="-webkit-grabbing";var t=this.config.loop?this.currentSlide+this.perPage:this.currentSlide,i=t(this.selectorWidth/this.perPage),r=this.drag.endX-this.drag.startX,n=this.config.rtl?i+r:i-r;void 0!==this.sliderFrame&&(this.sliderFrame.style.webkitTransition="all 0ms "+this.config.easing,this.sliderFrame.style.transition="all 0ms "+this.config.easing,this.sliderFrame.style[this.transformProperty]="translate3d("+(this.config.rtl?1:-1)n+"px, 0, 0)")}}},{key:"mouseleaveHandler",value:function(e){this.pointerDown&&(this.pointerDown=!1,this.selector.style.cursor="-webkit-grab",this.drag.endX=e.pageX,this.drag.preventClick=!1,this.enableTransition(),this.updateAfterDrag(),this.clearDrag())}},{key:"clickHandler",value:function(e){this.drag.preventClick&&e.preventDefault(),this.drag.preventClick=!1}},{key:"remove",value:function(e,t){if(e<0\|\|e>=this.innerElements.length)throw new Error("Item to remove doesn't exist");var i=e<this.currentSlide,r=this.currentSlide+this.perPage-1===e;(i\|\|r)&&this.currentSlide--,this.innerElements.splice(e,1),this.buildSliderFrame(),t&&t.call(this)}},{key:"insert",value:function(e,t,i){if(t<0\|\|t>this.innerElements.length+1)throw new Error("Unable to inset it at this index");if(-1!==this.innerElements.indexOf(e))throw new Error("The same item in a carousel?");var r=t<=this.currentSlide>0&&this.innerElements.length;this.currentSlide=r?this.currentSlide+1:this.currentSlide,this.innerElements.splice(t,0,e),this.buildSliderFrame(),i&&i.call(this)}},{key:"prepend",value:function(e,t){this.insert(e,0),t&&t.call(this)}},{key:"append",value:function(e,t){this.insert(e,this.innerElements.length+1),t&&t.call(this)}},{key:"destroy",value:function(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],t=arguments[1];if(this.detachEvents(),this.selector.style.cursor="auto",e){for(var i=document.createDocumentFragment(),r=0;r<this.innerElements.length;r++)i.appendChild(this.innerElements[r]);this.selector.innerHTML="",this.selector.appendChild(i),this.selector.removeAttribute("style")}t&&t.call(this)}}],[{key:"mergeSettings",value:function(e){var t={selector:".siema",duration:200,easing:"ease-out",perPage:1,startIndex:0,draggable:!0,multipleDrag:!0,threshold:20,loop:!1,rtl:!1,loopDelay:12e3,addDots:!1,useIntersectionObserver:!0,timeout:null,pause:!1,onInit:function(){this.config.addDots&&(this.addDots(),this.updateDots()),this.config.loopDelay>0&&this.resetTimeout()},onChange:function(){this.config.addDots&&this.updateDots()}},i=e;for(var r in i)t[r]=i[r];return t}},{key:"webkitOrNot",value:function(){return"string"==typeof document.documentElement.style.transform?"transform":"WebkitTransform"}}]),e}()},function(e,t,i){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var n=function(){function e(e,t){for(var i=0;i<t.length;i++){var r=t[i];r.enumerable=r.enumerable\|\|!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,i,r){return i&&e(t.prototype,i),r&&e(t,r),t}}();t.Observer=function(){function e(t){r(this,e),this.config=e.mergeSettings(t),this.run()}return n(e,[{key:"run",value:function(){if(this.config.useIntersectionObserver){var e=!0;if("IntersectionObserver"in window&&"IntersectionObserverEntry"in window\|\|(e=!1),e){var t=function(e,t){var i=e.getAttribute("data-bg");if(i){t.querySelectorAll("[data-bg='"+i+"']").forEach(function(e){e.style.backgroundImage="url("+i+")",e.removeAttribute("data-bg")})}},i=document.querySelector(this.config.selector);if(!i)return;var r=i.querySelectorAll("[data-bg]"),n={root:i[0],rootMargin:"0px 0px 0px -20px",threshold:0},s=new IntersectionObserver(function(e,r){e.forEach(function(e){e.isIntersecting&&(t(e.target,i),r.unobserve(e.target))})},n),o=1;r.forEach(function(e){s.observe(e),o++})}}}}],[{key:"mergeSettings",value:function(e){var t={selector:"",useIntersectionObserver:!0},i=e;for(var r in i)t[r]=i[r];return t}}]),e}()}])});
		!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t();else if("function"==typeof define&&define.amd)define([],t);else{var i=t();for(var r in i)("object"==typeof exports?exports:e)[r]=i[r]}}("undefined"!=typeof self?self:this,function(){return function(e){function t(r){if(i[r])return i[r].exports;var n=i[r]={i:r,l:!1,exports:{}};return e[r].call(n.exports,n,n.exports,t),n.l=!0,n.exports}var i={};return t.m=e,t.c=i,t.d=function(e,i,r){t.o(e,i)\|\|Object.defineProperty(e,i,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var i=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(i,"a",i),i},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=0)}([function(e,t,i){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=i(1);Object.defineProperty(t,"carousel",{enumerable:!0,get:function(){return r.Siema}});var n=i(2);Object.defineProperty(t,"Observer",{enumerable:!0,get:function(){return n.Observer}})},function(e,t,i){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},s=function(){function e(e,t){for(var i=0;i<t.length;i++){var r=t[i];r.enumerable=r.enumerable\|\|!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,i,r){return i&&e(t.prototype,i),r&&e(t,r),t}}();t.Siema=function(){function e(t){var i=this;if(r(this,e),this.config=e.mergeSettings(t),this.selector="string"==typeof this.config.selector?document.querySelector(this.config.selector):this.config.selector,null===this.selector)throw new Error("Something wrong with your selector");this.resolveSlidesNumber(),this.selectorWidth=this.selector.offsetWidth,this.innerElements=[].slice.call(this.selector.children),this.currentSlide=this.config.loop?this.config.startIndex%this.innerElements.length:Math.max(0,Math.min(this.config.startIndex,this.innerElements.length-this.perPage)),this.transformProperty=e.webkitOrNot(),["resizeHandler","touchstartHandler","touchendHandler","touchmoveHandler","bodyTouchMove","mousedownHandler","mouseupHandler","mouseleaveHandler","mousemoveHandler","clickHandler"].forEach(function(e){i[e]=i[e].bind(i)}),this.init()}return s(e,[{key:"attachEvents",value:function(){window.addEventListener("resize",this.resizeHandler),this.config.draggable&&(this.pointerDown=!1,this.drag={startX:0,endX:0,startY:0,letItGo:null,preventClick:!1},document.body.addEventListener("touchmove",this.bodyTouchMove,!0),this.selector.addEventListener("touchstart",this.touchstartHandler),this.selector.addEventListener("touchend",this.touchendHandler),this.selector.addEventListener("touchmove",this.touchmoveHandler),this.selector.addEventListener("mousedown",this.mousedownHandler),this.selector.addEventListener("mouseup",this.mouseupHandler),this.selector.addEventListener("mouseleave",this.mouseleaveHandler),this.selector.addEventListener("mousemove",this.mousemoveHandler),this.selector.addEventListener("click",this.clickHandler))}},{key:"detachEvents",value:function(){window.removeEventListener("resize",this.resizeHandler),this.selector.removeEventListener("touchstart",this.touchstartHandler),this.selector.removeEventListener("touchend",this.touchendHandler),this.selector.removeEventListener("touchmove",this.touchmoveHandler),this.selector.removeEventListener("mousedown",this.mousedownHandler),this.selector.removeEventListener("mouseup",this.mouseupHandler),this.selector.removeEventListener("mouseleave",this.mouseleaveHandler),this.selector.removeEventListener("mousemove",this.mousemoveHandler),this.selector.removeEventListener("click",this.clickHandler)}},{key:"init",value:function(){this.attachEvents(),this.selector.style.overflow="hidden",this.selector.style.direction=this.config.rtl?"rtl":"ltr",this.buildSliderFrame(),this.config.onInit.call(this)}},{key:"buildSliderFrame",value:function(){var e=document.querySelector(this.config.selector);if(null!==e){if(!e.querySelector(".sliderFrame")){var t=this.selectorWidth/this.perPage,i=this.config.loop?this.innerElements.length+2this.perPage:this.innerElements.length;this.sliderFrame=document.createElement("div"),this.sliderFrame.classList.add("sliderFrame"),this.sliderFrame.style.width=ti+"px",this.enableTransition(),this.config.draggable&&(this.selector.style.cursor="-webkit-grab");var r=document.createDocumentFragment();if(this.config.loop)for(var n=this.innerElements.length-this.perPage;n<this.innerElements.length;n++){var s=this.buildSliderFrameItem(this.innerElements[n].cloneNode(!0));r.appendChild(s)}for(var o=0;o<this.innerElements.length;o++){var l=this.buildSliderFrameItem(this.innerElements[o]);r.appendChild(l)}if(this.config.loop)for(var a=0;a<this.perPage;a++){var h=this.buildSliderFrameItem(this.innerElements[a].cloneNode(!0));r.appendChild(h)}this.sliderFrame.appendChild(r),this.selector.innerHTML="",this.selector.appendChild(this.sliderFrame)}if(this.config.useIntersectionObserver){new Observer({selector:this.config.selector})}this.slideToCurrent()}}},{key:"buildSliderFrameItem",value:function(e){var t=document.createElement("div");return t.style.cssFloat=this.config.rtl?"right":"left",t.style.float=this.config.rtl?"right":"left",t.style.width=(this.config.loop?100/(this.innerElements.length+2this.perPage):100/this.innerElements.length)+"%",t.appendChild(e),t}},{key:"resolveSlidesNumber",value:function(){if("number"==typeof this.config.perPage)this.perPage=this.config.perPage;else if("object"===n(this.config.perPage)){this.perPage=1;for(var e in this.config.perPage)window.innerWidth>=e&&(this.perPage=this.config.perPage[e])}}},{key:"prev",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:1,t=arguments[1];if(!(this.innerElements.length<=this.perPage)){var i=this.currentSlide;if(this.config.loop){if(this.currentSlide-e<0){this.disableTransition();var r=this.currentSlide+this.innerElements.length,n=this.perPage,s=r+n,o=(this.config.rtl?1:-1)s(this.selectorWidth/this.perPage),l=this.config.draggable?this.drag.endX-this.drag.startX:0;this.sliderFrame.style[this.transformProperty]="translate3d("+(o+l)+"px, 0, 0)",this.currentSlide=r-e}else this.currentSlide=this.currentSlide-e}else this.currentSlide=Math.max(this.currentSlide-e,0);i!==this.currentSlide&&(this.slideToCurrent(this.config.loop),this.config.onChange.call(this),t&&t.call(this))}}},{key:"next",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:1,t=arguments[1];if(!(this.innerElements.length<=this.perPage)){var i=this.currentSlide;if(this.config.loop){if(this.currentSlide+e>this.innerElements.length-this.perPage){this.disableTransition();var r=this.currentSlide-this.innerElements.length,n=this.perPage,s=r+n,o=(this.config.rtl?1:-1)s(this.selectorWidth/this.perPage),l=this.config.draggable?this.drag.endX-this.drag.startX:0;this.sliderFrame.style[this.transformProperty]="translate3d("+(o+l)+"px, 0, 0)",this.currentSlide=r+e}else this.currentSlide=this.currentSlide+e}else this.currentSlide=Math.min(this.currentSlide+e,this.innerElements.length-this.perPage);i!==this.currentSlide&&(this.slideToCurrent(this.config.loop),this.config.onChange.call(this),t&&t.call(this))}}},{key:"disableTransition",value:function(){void 0!==this.sliderFrame&&(this.sliderFrame.style.webkitTransition="all 0ms "+this.config.easing,this.sliderFrame.style.transition="all 0ms "+this.config.easing)}},{key:"enableTransition",value:function(){void 0!==this.sliderFrame&&(this.sliderFrame.style.webkitTransition="all "+this.config.duration+"ms "+this.config.easing,this.sliderFrame.style.transition="all "+this.config.duration+"ms "+this.config.easing)}},{key:"goTo",value:function(e,t){if(!(this.innerElements.length<=this.perPage)){var i=this.currentSlide;this.currentSlide=this.config.loop?e%this.innerElements.length:Math.min(Math.max(e,0),this.innerElements.length-this.perPage),i!==this.currentSlide&&(this.slideToCurrent(),this.config.onChange.call(this),t&&t.call(this)),this.config.pause\|\|this.resetTimeout()}}},{key:"addDots",value:function(){var e=document.querySelector(this.config.selector),t=document.createElement("div");t.classList.add("dots");for(var i=this,r=0;r<this.innerElements.length;r++)!function(){var e=document.createElement("button");e.classList.add("dots__item"),e.id=r,e.addEventListener("click",function(){i.goTo(e.id)}),t.appendChild(e)}();e.parentNode.insertBefore(t,e.nextSibling)}},{key:"updateDots",value:function(){for(var e=document.querySelector(".dots"),t=0;t<e.querySelectorAll("button").length;t++){var i=this.currentSlide===t?"add":"remove";e.querySelectorAll("button")[t].classList[i]("dots__item--active")}}},{key:"resetTimeout",value:function(e){if(!this.config.pause\|\|e){clearTimeout(this.config.timeout),this.config.timeout=null;var t=this;this.config.timeout=setTimeout(function(){t.next(),t.resetTimeout()},this.config.loopDelay)}}},{key:"isPaused",value:function(){return this.config.pause}},{key:"togglePause",value:function(){return this.config.pause?(this.next(),this.resetTimeout(!0)):(clearTimeout(this.config.timeout),this.config.timeout=null),this.config.pause=!this.config.pause,this.config.pause}},{key:"slideToCurrent",value:function(e){var t=this,i=this.config.loop?this.currentSlide+this.perPage:this.currentSlide,r=this.config.loop?this.innerElements.length+2this.perPage:this.innerElements.length,n=(this.config.rtl?1:-1)i(this.selectorWidth/this.perPage),s=rthis.selectorWidth;e?requestAnimationFrame(function(){requestAnimationFrame(function(){t.enableTransition(),void 0!==t.sliderFrame&&(t.sliderFrame.style.width=s+"px",t.sliderFrame.style[t.transformProperty]="translate3d("+n+"px, 0, 0)")})}):void 0!==this.sliderFrame&&(this.sliderFrame.style.width=s+"px",this.sliderFrame.style[this.transformProperty]="translate3d("+n+"px, 0, 0)")}},{key:"updateAfterDrag",value:function(){var e=(this.config.rtl?-1:1)(this.drag.endX-this.drag.startX),t=Math.abs(e),i=this.config.multipleDrag?Math.ceil(t/(this.selectorWidth/this.perPage)):1,r=e>0&&this.currentSlide-i<0,n=e<0&&this.currentSlide+i>this.innerElements.length-this.perPage;e>0&&t>this.config.threshold&&this.innerElements.length>this.perPage?(this.prev(i),this.resetTimeout()):e<0&&t>this.config.threshold&&this.innerElements.length>this.perPage&&(this.next(i),this.resetTimeout()),this.slideToCurrent(r\|\|n)}},{key:"resizeHandler",value:function(){this.resolveSlidesNumber(),this.currentSlide+this.perPage>this.innerElements.length&&(this.currentSlide=this.innerElements.length<=this.perPage?0:this.innerElements.length-this.perPage),this.selectorWidth=this.selector.offsetWidth,this.buildSliderFrame()}},{key:"clearDrag",value:function(){this.drag={startX:0,endX:0,startY:0,letItGo:null,preventClick:this.drag.preventClick}}},{key:"touchstartHandler",value:function(e){-1!==["TEXTAREA","OPTION","INPUT","SELECT"].indexOf(e.target.nodeName)\|\|(e.stopPropagation(),this.pointerDown=!0,this.drag.startX=e.touches[0].pageX,this.drag.startY=e.touches[0].pageY)}},{key:"touchendHandler",value:function(e){e.stopPropagation(),this.pointerDown=!1,this.enableTransition(),this.drag.endX&&this.updateAfterDrag(),this.clearDrag()}},{key:"bodyTouchMove",value:function(e){e&&-1!==e.target.className.toLowerCase().indexOf("valo-banner")&&(e.preventDefault(),this.touchmoveHandler(e))}},{key:"touchmoveHandler",value:function(e){if(e.stopPropagation(),null===this.drag.letItGo&&(this.drag.letItGo=Math.abs(this.drag.startY-e.touches[0].pageY)<Math.abs(this.drag.startX-e.touches[0].pageX)),this.pointerDown&&this.drag.letItGo){e.preventDefault(),this.drag.endX=e.touches[0].pageX;var t=this.config.loop?this.currentSlide+this.perPage:this.currentSlide,i=t(this.selectorWidth/this.perPage),r=this.drag.endX-this.drag.startX,n=this.config.rtl?i+r:i-r;void 0!==this.sliderFrame&&(this.sliderFrame.style.webkitTransition="all 0ms "+this.config.easing,this.sliderFrame.style.transition="all 0ms "+this.config.easing,this.sliderFrame.style[this.transformProperty]="translate3d("+(this.config.rtl?1:-1)n+"px, 0, 0)")}}},{key:"mousedownHandler",value:function(e){-1!==["TEXTAREA","OPTION","INPUT","SELECT"].indexOf(e.target.nodeName)\|\|(e.preventDefault(),e.stopPropagation(),this.pointerDown=!0,this.drag.startX=e.pageX)}},{key:"mouseupHandler",value:function(e){e.stopPropagation(),this.pointerDown=!1,this.selector.style.cursor="-webkit-grab",this.enableTransition(),this.drag.endX&&this.updateAfterDrag(),this.clearDrag()}},{key:"mousemoveHandler",value:function(e){if(e.preventDefault(),this.pointerDown){"A"===e.target.nodeName&&(this.drag.preventClick=!0),this.drag.endX=e.pageX,this.selector.style.cursor="-webkit-grabbing";var t=this.config.loop?this.currentSlide+this.perPage:this.currentSlide,i=t(this.selectorWidth/this.perPage),r=this.drag.endX-this.drag.startX,n=this.config.rtl?i+r:i-r;void 0!==this.sliderFrame&&(this.sliderFrame.style.webkitTransition="all 0ms "+this.config.easing,this.sliderFrame.style.transition="all 0ms "+this.config.easing,this.sliderFrame.style[this.transformProperty]="translate3d("+(this.config.rtl?1:-1)n+"px, 0, 0)")}}},{key:"mouseleaveHandler",value:function(e){this.pointerDown&&(this.pointerDown=!1,this.selector.style.cursor="-webkit-grab",this.drag.endX=e.pageX,this.drag.preventClick=!1,this.enableTransition(),this.updateAfterDrag(),this.clearDrag())}},{key:"clickHandler",value:function(e){this.drag.preventClick&&e.preventDefault(),this.drag.preventClick=!1}},{key:"remove",value:function(e,t){if(e<0\|\|e>=this.innerElements.length)throw new Error("Item to remove doesn't exist");var i=e<this.currentSlide,r=this.currentSlide+this.perPage-1===e;(i\|\|r)&&this.currentSlide--,this.innerElements.splice(e,1),this.buildSliderFrame(),t&&t.call(this)}},{key:"insert",value:function(e,t,i){if(t<0\|\|t>this.innerElements.length+1)throw new Error("Unable to inset it at this index");if(-1!==this.innerElements.indexOf(e))throw new Error("The same item in a carousel?");var r=t<=this.currentSlide>0&&this.innerElements.length;this.currentSlide=r?this.currentSlide+1:this.currentSlide,this.innerElements.splice(t,0,e),this.buildSliderFrame(),i&&i.call(this)}},{key:"prepend",value:function(e,t){this.insert(e,0),t&&t.call(this)}},{key:"append",value:function(e,t){this.insert(e,this.innerElements.length+1),t&&t.call(this)}},{key:"destroy",value:function(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],t=arguments[1];if(this.detachEvents(),this.selector.style.cursor="auto",e){for(var i=document.createDocumentFragment(),r=0;r<this.innerElements.length;r++)i.appendChild(this.innerElements[r]);this.selector.innerHTML="",this.selector.appendChild(i),this.selector.removeAttribute("style")}t&&t.call(this)}}],[{key:"mergeSettings",value:function(e){var t={selector:".siema",duration:200,easing:"ease-out",perPage:1,startIndex:0,draggable:!0,multipleDrag:!0,threshold:20,loop:!1,rtl:!1,loopDelay:12e3,addDots:!1,useIntersectionObserver:!0,timeout:null,pause:!1,onInit:function(){this.config.addDots&&(this.addDots(),this.updateDots()),this.config.loopDelay>0&&this.resetTimeout()},onChange:function(){this.config.addDots&&this.updateDots()}},i=e;for(var r in i)t[r]=i[r];return t}},{key:"webkitOrNot",value:function(){return"string"==typeof document.documentElement.style.transform?"transform":"WebkitTransform"}}]),e}()},function(e,t,i){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var n=function(){function e(e,t){for(var i=0;i<t.length;i++){var r=t[i];r.enumerable=r.enumerable\|\|!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,i,r){return i&&e(t.prototype,i),r&&e(t,r),t}}();t.Observer=function(){function e(t){r(this,e),this.config=e.mergeSettings(t),this.run()}return n(e,[{key:"run",value:function(){if(this.config.useIntersectionObserver){var e=!0;if("IntersectionObserver"in window&&"IntersectionObserverEntry"in window\|\|(e=!1),e){var t=function(e,t){var i=e.getAttribute("data-bg");if(i){t.querySelectorAll("[data-bg='"+i+"']").forEach(function(e){e.style.backgroundImage="url("+i+")",e.removeAttribute("data-bg")})}},i=document.querySelector(this.config.selector);if(!i)return;var r=i.querySelectorAll("[data-bg]"),n={root:i[0],rootMargin:"0px 0px 0px -20px",threshold:0},s=new IntersectionObserver(function(e,r){e.forEach(function(e){e.isIntersecting&&(t(e.target,i),r.unobserve(e.target))})},n),o=1;r.forEach(function(e){s.observe(e),o++})}}}}],[{key:"mergeSettings",value:function(e){var t={selector:"",useIntersectionObserver:!0},i=e;for(var r in i)t[r]=i[r];return t}}]),e}()}])});

package.json

		{
		"name": "@valo/carousel",
		"version": "1.0.13",
		"version": "1.0.14",
		"description": "Lightweight and simple carousel with no dependencies",
		@@ -5,0 +5,0 @@ "main": "dist/carousel.min.js",

@valo/carousel - npm Package Compare versions

New alerts

Fixed alerts

Improved metrics