bulma-extensions
Advanced tools
Comparing version 6.0.1 to 6.2.0
@@ -1,1 +0,1 @@ | ||
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.bulmaCarousel=t():e.bulmaCarousel=t()}("undefined"!=typeof self?self:this,function(){return function(n){var i={};function s(e){if(i[e])return i[e].exports;var t=i[e]={i:e,l:!1,exports:{}};return n[e].call(t.exports,t,t.exports,s),t.l=!0,t.exports}return s.m=n,s.c=i,s.d=function(e,t,n){s.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:n})},s.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return s.d(t,"a",t),t},s.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},s.p="",s(s.s=0)}([function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(1),r=n(2),o=function(){function i(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(e,t,n){return t&&i(e.prototype,t),n&&i(e,n),e}}();var a="carousel:ready",l="carousel:slide:before",u="carousel:slide:after",h=Symbol("onSwipeStart"),c=Symbol("onSwipeMove"),d=Symbol("onSwipeEnd"),f=!1;try{var s=Object.defineProperty({},"passive",{get:function(){f=!0}});window.addEventListener("testPassive",null,s),window.removeEventListener("testPassive",null,s)}catch(e){}var v=function(e){function s(e){var t=1<arguments.length&&void 0!==arguments[1]?arguments[1]:{};!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,s);var n=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}(this,(s.__proto__||Object.getPrototypeOf(s)).call(this));if(n.element="string"==typeof e?document.querySelector(e):e,!n.element)throw new Error("An invalid selector or non-DOM node has been provided.");return n._clickEvents=["click"],n.options=Object.assign({},r.a,t),n.element.dataset.autoplay&&(n.options.autoplay=n.element.dataset.autoplay),n.element.dataset.delay&&(n.options.delay=n.element.dataset.delay),n.element.dataset.size&&!n.element.classList.contains("carousel-animate-fade")&&(n.options.size=n.element.dataset.size),n.element.classList.contains("carousel-animate-fade")&&(n.options.size=1),n.forceHiddenNavigation=!1,n[h]=n[h].bind(n),n[c]=n[c].bind(n),n[d]=n[d].bind(n),n.init(),n}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(s,i["a"]),o(s,[{key:"init",value:function(){this.container=this.element.querySelector(".carousel-container"),this.items=this.element.querySelectorAll(".carousel-item"),this.currentItem={element:this.element,node:this.element.querySelector(".carousel-item.is-active"),pos:-1},this.currentItem.pos=this.currentItem.node?Array.from(this.items).indexOf(this.currentItem.node):-1,this.currentItem.node||(this.currentItem.node=this.items[0],this.currentItem.node.classList.add("is-active"),this.currentItem.pos=0),this.forceHiddenNavigation=this.items.length<=1;var e=this.element.querySelectorAll("img");[].forEach.call(e,function(e){e.setAttribute("draggable",!1)}),this._resize(),this._setOrder(),this._initNavigation(),this._bindEvents(),this.options.autoplay&&this._autoPlay(this.options.delay),this.emit(a,this.currentItem)}},{key:"_resize",value:function(){var t=this,e=window.getComputedStyle(this.element),n=parseInt(e.getPropertyValue("width"),10);if(1<this.options.size&&(this.options.size>=Array.from(this.items).length?this.offset=0:this.offset=n/this.options.size,this.container.style.left=0-this.offset+"px",this.container.style.transform="translateX("+this.offset+"px)",[].forEach.call(this.items,function(e){e.style.flexBasis=t.offset+"px"})),this.element.classList.contains("carousel-animate-fade")&&this.items.length){var i=this.items[0].querySelector("img"),s=1;i.naturalWidth?(s=n/i.naturalWidth,this.container.style.height=i.naturalHeight*s+"px"):i.onload=function(){s=n/i.naturalWidth,t.container.style.height=i.naturalHeight*s+"px"}}}},{key:"_bindEvents",value:function(){var t=this;this.previousControl&&this._clickEvents.forEach(function(e){t.previousControl.addEventListener(e,function(e){f||e.preventDefault(),t._autoPlayInterval&&(clearInterval(t._autoPlayInterval),t._autoPlay(t.optionsdelay)),t._slide("previous")},!!f&&{passive:!0})}),this.nextControl&&this._clickEvents.forEach(function(e){t.nextControl.addEventListener(e,function(e){f||e.preventDefault(),t._autoPlayInterval&&(clearInterval(t._autoPlayInterval),t._autoPlay(t.options.delay)),t._slide("next")},!!f&&{passive:!0})}),this.element.addEventListener("touchstart",this[h],!!f&&{passive:!0}),this.element.addEventListener("mousedown",this[h],!!f&&{passive:!0}),this.element.addEventListener("touchmove",this[c],!!f&&{passive:!0}),this.element.addEventListener("mousemove",this[c],!!f&&{passive:!0}),this.element.addEventListener("touchend",this[d],!!f&&{passive:!0}),this.element.addEventListener("mouseup",this[d],!!f&&{passive:!0})}},{key:"destroy",value:function(){this.element.removeEventListener("touchstart",this[h],!!f&&{passive:!0}),this.element.removeEventListener("mousedown",this[h],!!f&&{passive:!0}),this.element.removeEventListener("touchmove",this[c],!!f&&{passive:!0}),this.element.removeEventListener("mousemove",this[c],!!f&&{passive:!0}),this.element.removeEventListener("touchend",this[d],!!f&&{passive:!0}),this.element.removeEventListener("mouseup",this[d],!!f&&{passive:!0})}},{key:h,value:function(e){f||e.preventDefault(),e="changedTouches"in(e=e||window.event)?e.changedTouches[0]:e,this._touch={start:{time:(new Date).getTime(),x:e.pageX,y:e.pageY},dist:{x:0,y:0}}}},{key:c,value:function(e){f||e.preventDefault()}},{key:d,value:function(e){f||e.preventDefault(),e="changedTouches"in(e=e||window.event)?e.changedTouches[0]:e,this._touch.dist={x:e.pageX-this._touch.start.x,y:e.pageY-this._touch.start.y},this._handleGesture()}},{key:"_handleGesture",value:function(){(new Date).getTime()-this._touch.start.time<=this.options.allowedTime&&Math.abs(this._touch.dist.x)>=this.options.threshold&&Math.abs(this._touch.dist.y)<=this.options.restraint&&(this._touch.dist.x<0?this._slide("next"):this._slide("previous"))}},{key:"_initNavigation",value:function(){this.previousControl=this.element.querySelector(".carousel-nav-left"),this.nextControl=this.element.querySelector(".carousel-nav-right"),(this.items.length<=1||this.forceHiddenNavigation)&&(this.container&&(this.container.style.left="0"),this.previousControl&&(this.previousControl.style.display="none"),this.nextControl&&(this.nextControl.style.display="none"))}},{key:"_setOrder",value:function(){this.currentItem.node.style.order="1",this.currentItem.node.style.zIndex="1";var e,t=this.currentItem.node,n=void 0,i=void 0;for(n=i=2,e=Array.from(this.items).length;2<=e?i<=e:e<=i;n=2<=e?++i:--i)(t=this._next(t)).style.order=""+n%Array.from(this.items).length,t.style.zIndex="0"}},{key:"_next",value:function(e){return e.nextElementSibling?e.nextElementSibling:this.items[0]}},{key:"_previous",value:function(e){return e.previousElementSibling?e.previousElementSibling:this.items[this.items.length-1]}},{key:"_slide",value:function(){var e=this,t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:"next";this.items.length&&(this.oldItemNode=this.currentItem.node,this.emit(l,this.currentItem),"previous"===t?(this.currentItem.node=this._previous(this.currentItem.node),this.element.classList.contains("carousel-animate-fade")||(this.element.classList.add("is-reversing"),this.container.style.transform="translateX("+-Math.abs(this.offset)+"px)")):(this.currentItem.node=this._next(this.currentItem.node),this.element.classList.remove("is-reversing"),this.container.style.transform="translateX("+Math.abs(this.offset)+"px)"),this.currentItem.node.classList.add("is-active"),this.oldItemNode.classList.remove("is-active"),this.element.classList.remove("carousel-animated"),setTimeout(function(){e.element.classList.add("carousel-animated")},50),this._setOrder(),this.emit(u,this.currentItem))}},{key:"_autoPlay",value:function(){var e=this,t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:5e3;this._autoPlayInterval=setInterval(function(){e._slide("next")},t)}}],[{key:"attach",value:function(){var e=0<arguments.length&&void 0!==arguments[0]?arguments[0]:".carousel, .hero-carousel",t=1<arguments.length&&void 0!==arguments[1]?arguments[1]:{},n=new Array,i=document.querySelectorAll(e);return[].forEach.call(i,function(e){setTimeout(function(){n.push(new s(e,t))},100)}),n}}]),s}();t.default=v},function(e,t,n){"use strict";var i=function(){function i(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(e,t,n){return t&&i(e.prototype,t),n&&i(e,n),e}}();var s=function(){function t(){var e=0<arguments.length&&void 0!==arguments[0]?arguments[0]:[];!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t),this._listeners=new Map(e),this._middlewares=new Map}return i(t,[{key:"listenerCount",value:function(e){return this._listeners.has(e)?this._listeners.get(e).length:0}},{key:"removeListeners",value:function(){var t=this,e=0<arguments.length&&void 0!==arguments[0]?arguments[0]:null,n=1<arguments.length&&void 0!==arguments[1]&&arguments[1];null!==e?Array.isArray(e)?name.forEach(function(e){return t.removeListeners(e,n)}):(this._listeners.delete(e),n&&this.removeMiddleware(e)):this._listeners=new Map}},{key:"middleware",value:function(e,t){var n=this;Array.isArray(e)?name.forEach(function(e){return n.middleware(e,t)}):(Array.isArray(this._middlewares.get(e))||this._middlewares.set(e,[]),this._middlewares.get(e).push(t))}},{key:"removeMiddleware",value:function(){var t=this,e=0<arguments.length&&void 0!==arguments[0]?arguments[0]:null;null!==e?Array.isArray(e)?name.forEach(function(e){return t.removeMiddleware(e)}):this._middlewares.delete(e):this._middlewares=new Map}},{key:"on",value:function(e,t){var n=this,i=2<arguments.length&&void 0!==arguments[2]&&arguments[2];if(Array.isArray(e))e.forEach(function(e){return n.on(e,t)});else{var s=(e=e.toString()).split(/,|, | /);1<s.length?s.forEach(function(e){return n.on(e,t)}):(Array.isArray(this._listeners.get(e))||this._listeners.set(e,[]),this._listeners.get(e).push({once:i,callback:t}))}}},{key:"once",value:function(e,t){this.on(e,t,!0)}},{key:"emit",value:function(n,i){var s=this,r=2<arguments.length&&void 0!==arguments[2]&&arguments[2];n=n.toString();var o=this._listeners.get(n),a=null,l=0,u=r;if(Array.isArray(o))for(o.forEach(function(e,t){r||(a=s._middlewares.get(n),Array.isArray(a)?(a.forEach(function(e){e(i,function(){var e=0<arguments.length&&void 0!==arguments[0]?arguments[0]:null;null!==e&&(i=e),l++},n)}),l>=a.length&&(u=!0)):u=!0),u&&(e.once&&(o[t]=null),e.callback(i))});-1!==o.indexOf(null);)o.splice(o.indexOf(null),1)}}]),t}();t.a=s},function(e,t,n){"use strict";t.a={size:1,autoplay:!1,delay:5e3,threshold:50,restraint:100,allowedTime:500}}]).default}); | ||
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.bulmaCarousel=e():t.bulmaCarousel=e()}("undefined"!=typeof self?self:this,function(){return function(i){var n={};function s(t){if(n[t])return n[t].exports;var e=n[t]={i:t,l:!1,exports:{}};return i[t].call(e.exports,e,e.exports,s),e.l=!0,e.exports}return s.m=i,s.c=n,s.d=function(t,e,i){s.o(t,e)||Object.defineProperty(t,e,{configurable:!1,enumerable:!0,get:i})},s.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return s.d(e,"a",e),e},s.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},s.p="",s(s.s=4)}([function(t,e,i){"use strict";i.d(e,"d",function(){return s}),i.d(e,"e",function(){return r}),i.d(e,"b",function(){return o}),i.d(e,"c",function(){return a}),i.d(e,"a",function(){return h});var n=i(1),s=function(e,t){(t=Array.isArray(t)?t:t.split(" ")).forEach(function(t){e.classList.remove(t)})},r=function(t){return t.getBoundingClientRect().width||t.offsetWidth},o=function(t){return t.getBoundingClientRect().height||t.offsetHeight},a=function(t){var e=1<arguments.length&&void 0!==arguments[1]&&arguments[1],i=t.offsetHeight;if(e){var n=window.getComputedStyle(t);i+=parseInt(n.marginTop)+parseInt(n.marginBottom)}return i},h=function(t,e){if(!e)return window.getComputedStyle(t);if(Object(n.b)(e)){var i="";Object.keys(e).forEach(function(t){i+=t+": "+e[t]+";"}),t.style.cssText+=i}}},function(t,e,i){"use strict";i.d(e,"a",function(){return s}),i.d(e,"c",function(){return r}),i.d(e,"b",function(){return o});var n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},s=function(t){return"function"==typeof t},r=function(t){return"string"==typeof t||!!t&&"object"===(void 0===t?"undefined":n(t))&&"[object String]"===Object.prototype.toString.call(t)},o=function(t){return("function"==typeof t||"object"===(void 0===t?"undefined":n(t))&&!!t)&&!Array.isArray(t)}},function(t,e,i){"use strict";var n=function(){function n(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(t,e,i){return e&&n(t.prototype,e),i&&n(t,i),t}}();var s=function(){function e(){var t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:[];!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),this.events=new Map(t)}return n(e,[{key:"on",value:function(t,e){var i=this;return this.events.set(t,[].concat(function(t){if(Array.isArray(t)){for(var e=0,i=Array(t.length);e<t.length;e++)i[e]=t[e];return i}return Array.from(t)}(this.events.has(t)?this.events.get(t):[]),[e])),function(){return i.events.set(t,i.events.get(t).filter(function(t){return t!==e}))}}},{key:"emit",value:function(t){for(var e=arguments.length,i=Array(1<e?e-1:0),n=1;n<e;n++)i[n-1]=arguments[n];return this.events.has(t)&&this.events.get(t).map(function(t){return t.apply(void 0,i)})}}]),e}();e.a=s},function(t,e,i){"use strict";var n=function(){function n(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(t,e,i){return e&&n(t.prototype,e),i&&n(t,i),t}}();var s=function(){function s(){var t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:0,e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:0;!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,s),this._x=t,this._y=e}return n(s,[{key:"add",value:function(t){return new s(this._x+t._x,this._y+t._y)}},{key:"sub",value:function(t){return new s(this._x-t._x,this._y-t._y)}},{key:"distance",value:function(t){var e=this._x-t._x,i=this._y-t._y;return Math.sqrt(Math.pow(e,2)+Math.pow(i,2))}},{key:"max",value:function(t){return new s(Math.max(this._x,t._x),Math.max(this._y,t._y))}},{key:"equals",value:function(t){return this==t||!(!t||null==t)&&(this._x==t._x&&this._y==t._y)}},{key:"inside",value:function(t,e){return this._x>=t._x&&this._x<=e._x&&this._y>=t._y&&this._y<=e._y}},{key:"constrain",value:function(t,e){if(t._x>e._x||t._y>e._y)return this;var i=this._x,n=this._y;return null!==t._x&&(i=Math.max(i,t._x)),null!==e._x&&(i=Math.min(i,e._x)),null!==t._y&&(n=Math.max(n,t._y)),null!==e._y&&(n=Math.min(n,e._y)),new s(i,n)}},{key:"reposition",value:function(t){t.style.top=this._y+"px",t.style.left=this._x+"px"}},{key:"toString",value:function(){return"("+this._x+","+this._y+")"}},{key:"x",get:function(){return this._x},set:function(){var t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:0;return this._x=t,this}},{key:"y",get:function(){return this._y},set:function(){var t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:0;return this._y=t,this}}]),s}();e.a=s},function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n=i(5),s=i(0),a=i(1),r=i(2),h=i(6),l=i(8),u=i(9),d=i(10),c=i(12),f=i(14),p=i(17),v=i(18),y=i(21),_=i(22),g=i(23),b=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var i=arguments[e];for(var n in i)Object.prototype.hasOwnProperty.call(i,n)&&(t[n]=i[n])}return t},w=function(){function n(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(t,e,i){return e&&n(t.prototype,e),i&&n(t,i),t}}();var o=function(t){function o(t){var e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:{};!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,o);var r=function(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}(this,(o.__proto__||Object.getPrototypeOf(o)).call(this));if(r.element=Object(a.c)(t)?document.querySelector(t):t,!r.element)throw new Error("An invalid selector or non-DOM node has been provided.");r._clickEvents=["click","touch"];var i=r.element.dataset?Object.keys(r.element.dataset).filter(function(t){return Object.keys(y.a).includes(t)}).reduce(function(t,e){return b({},t,(i={},n=e,s=r.element.dataset[e],n in i?Object.defineProperty(i,n,{value:s,enumerable:!0,configurable:!0,writable:!0}):i[n]=s,i));var i,n,s},{}):{};return r.options=b({},y.a,e,i),r._id=Object(n.a)("slider"),r.onShow=r.onShow.bind(r),r._init(),r}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}(o,r["a"]),w(o,[{key:"_init",value:function(){return this._items=Array.from(this.element.children),this._breakpoint=new l.a(this),this._autoplay=new h.a(this),this._navigation=new c.a(this),this._pagination=new f.a(this),this._infinite=new u.a(this),this._loop=new d.a(this),this._swipe=new p.a(this),this._build(),Object(a.a)(this.options.onReady)&&this.options.onReady(this),this}},{key:"_build",value:function(){var i=this;this.node=document.createRange().createContextualFragment(Object(_.a)(this.id)),this._ui={wrapper:this.node.firstChild,container:this.node.querySelector(".slider-container")},this.element.appendChild(this.node),this._ui.wrapper.classList.add("is-loading"),this._ui.container.style.opacity=0,this._transitioner=new v.a(this),this._slides=this._items.map(function(t,e){return i._createSlide(t,e)}),this.reset(),this._bindEvents(),this._ui.container.style.opacity=1,this._ui.wrapper.classList.remove("is-loading")}},{key:"_bindEvents",value:function(){this.on("show",this.onShow)}},{key:"_unbindEvents",value:function(){this.off("show",this.onShow)}},{key:"_createSlide",value:function(t,e){var i=document.createRange().createContextualFragment(Object(g.a)()).firstChild;return i.dataset.sliderIndex=e,i.appendChild(t),i}},{key:"_setDimensions",value:function(){var e=this;this.options.vertical?(this._ui.wrapper.style.height=Object(s.c)(this._slides[0])*this.slidesToShow,this.options.centerMode&&(this._ui.wrapper.style.padding=this.options.centerPadding+" 0px")):this.options.centerMode&&(this._ui.wrapper.style.padding="0px "+this.options.centerPadding),this._wrapperWidth=Object(s.e)(this._ui.wrapper),this._wrapperHeight=Object(s.c)(this._ui.wrapper),this.options.vertical?(this._slideWidth=Math.ceil(this._wrapperWidth),this._containerHeight=Math.ceil(Object(s.c)(this._slides[0])*this._slides.length),this._ui.container.style.height=this._containerHeight+"px"):(this._slideWidth=Math.ceil(this._wrapperWidth/this.slidesToShow),this._containerWidth=Math.ceil(this._slideWidth*this._slides.length),this._ui.container.style.width=this._containerWidth+"px"),this._slides.forEach(function(t){t.style.width=e._slideWidth+"px"})}},{key:"_setHeight",value:function(){"translate"!==this.options.effect&&(this._ui.container.style.height=Object(s.c)(this._slides[this.state.index])+"px")}},{key:"_setClasses",value:function(){var e=this;this._slides.forEach(function(t){Object(s.d)(t,"is-active is-current is-slide-previous is-slide-next"),Math.abs((e.state.index-1)%e.state.length)===parseInt(t.dataset.sliderIndex,10)&&t.classList.add("is-slide-previous"),Math.abs(e.state.index%e.state.length)===parseInt(t.dataset.sliderIndex,10)&&t.classList.add("is-current"),Math.abs((e.state.index+1)%e.state.length)===parseInt(t.dataset.sliderIndex,10)&&t.classList.add("is-slide-next")})}},{key:"onShow",value:function(t){this._navigation.refresh(),this._pagination.refresh(),this._setClasses()}},{key:"next",value:function(){!this.options.loop&&!this.options.infinite&&this.state.index+this.slidesToScroll>this.state.length-this.slidesToShow&&!this.options.centerMode?this.state.next=this.state.index:this.state.next=this.state.index+this.slidesToScroll,this.show()}},{key:"previous",value:function(){this.options.loop||this.options.infinite||0!==this.state.index?this.state.next=this.state.index-this.slidesToScroll:this.state.next=this.state.index,this.show()}},{key:"start",value:function(){this._autoplay.start()}},{key:"pause",value:function(){this._autoplay.pause()}},{key:"stop",value:function(){this._autoplay.stop()}},{key:"show",value:function(t){var e=1<arguments.length&&void 0!==arguments[1]&&arguments[1];!this.state.length||this.state.length<=this.slidesToShow||("Number"==typeof t&&(this.state.next=t),this.options.loop&&this._loop.apply(),this.options.infinite&&this._infinite.apply(),this.state.index!==this.state.next&&(this.emit("before:show",this.state),this._transitioner.apply(e,this._setHeight.bind(this)),this.emit("after:show",this.state),this.emit("show",this)))}},{key:"reset",value:function(){var e=this;this.state={length:this._items.length,index:Math.abs(this.options.initialSlide),next:Math.abs(this.options.initialSlide),prev:void 0},this.options.loop&&this.options.infinite&&(this.options.loop=!1),this.options.slidesToScroll>this.options.slidesToShow&&(this.options.slidesToScroll=this.slidesToShow),this._breakpoint.init(),this.state.index>=this.state.length&&0!==this.state.index&&(this.state.index=this.state.index-this.slidesToScroll),this.state.length<=this.slidesToShow&&(this.state.index=0),this._ui.wrapper.appendChild(this._navigation.init().render()),this._ui.wrapper.appendChild(this._pagination.init().render()),this.options.navigationSwipe?this._swipe.bindEvents():this._swipe._bindEvents(),this._breakpoint.apply(),this._slides.forEach(function(t){return e._ui.container.appendChild(t)}),this._transitioner.init().apply(!0,this._setHeight.bind(this)),this.options.autoplay&&this._autoplay.init().start()}},{key:"destroy",value:function(){var e=this;this._unbindEvents(),this._items.forEach(function(t){e.element.appendChild(t)}),this.node.remove()}},{key:"id",get:function(){return this._id}},{key:"index",set:function(t){this._index=t},get:function(){return this._index}},{key:"length",set:function(t){this._length=t},get:function(){return this._length}},{key:"slides",get:function(){return this._slides},set:function(t){this._slides=t}},{key:"slidesToScroll",get:function(){return"translate"===this.options.effect?this._breakpoint.getSlidesToScroll():1}},{key:"slidesToShow",get:function(){return"translate"===this.options.effect?this._breakpoint.getSlidesToShow():1}},{key:"direction",get:function(){return"rtl"===this.element.dir.toLowerCase()||"rtl"===this.element.style.direction?"rtl":"ltr"}},{key:"wrapper",get:function(){return this._ui.wrapper}},{key:"wrapperWidth",get:function(){return this._wrapperWidth||0}},{key:"container",get:function(){return this._ui.container}},{key:"containerWidth",get:function(){return this._containerWidth||0}},{key:"slideWidth",get:function(){return this._slideWidth||0}},{key:"transitioner",get:function(){return this._transitioner}}],[{key:"attach",value:function(){var i=this,t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:".slider",n=1<arguments.length&&void 0!==arguments[1]?arguments[1]:{},s=new Array,e=Object(a.c)(t)?document.querySelectorAll(t):Array.isArray(t)?t:[t];return[].forEach.call(e,function(t){if(void 0===t[i.constructor.name]){var e=new o(t,n);t[i.constructor.name]=e,s.push(e)}else s.push(t[i.constructor.name])}),s}}]),o}();e.default=o},function(t,e,i){"use strict";i.d(e,"a",function(){return n});var n=function(){return(0<arguments.length&&void 0!==arguments[0]?arguments[0]:"")+([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g,function(t){return(t^crypto.getRandomValues(new Uint8Array(1))[0]&15>>t/4).toString(16)})}},function(t,e,i){"use strict";var n=i(2),s=i(7),r=function(){function n(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(t,e,i){return e&&n(t.prototype,e),i&&n(t,i),t}}();Symbol("onVisibilityChange"),Symbol("onMouseEnter"),Symbol("onMouseLeave");var o=function(t){function i(t){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,i);var e=function(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}(this,(i.__proto__||Object.getPrototypeOf(i)).call(this));return e.slider=t,e.onVisibilityChange=e.onVisibilityChange.bind(e),e.onMouseEnter=e.onMouseEnter.bind(e),e.onMouseLeave=e.onMouseLeave.bind(e),e}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}(i,n["a"]),r(i,[{key:"init",value:function(){return this._bindEvents(),this}},{key:"_bindEvents",value:function(){document.addEventListener("visibilitychange",this.onVisibilityChange),this.slider.options.pauseOnHover&&(this.slider.container.addEventListener(s.a,this.onMouseEnter),this.slider.container.addEventListener(s.b,this.onMouseLeave))}},{key:"_unbindEvents",value:function(){document.removeEventListener("visibilitychange",this.onVisibilityChange),this.slider.container.removeEventListener(s.a,this.onMouseEnter),this.slider.container.removeEventListener(s.b,this.onMouseLeave)}},{key:"start",value:function(){var t=this;this.stop(),this.slider.options.autoplay&&(this.emit("start",this),this._interval=setInterval(function(){t._hovering&&t.slider.options.pauseOnHover||(!t.slider.options.centerMode&&t.slider.state.next>=t.slider.state.length-t.slider.slidesToShow&&!t.slider.options.loop&&!t.slider.options.infinite?t.stop():t.slider.next())},this.slider.options.autoplaySpeed))}},{key:"stop",value:function(){this._interval=clearInterval(this._interval),this.emit("stop",this)}},{key:"pause",value:function(){var t=this,e=0<arguments.length&&void 0!==arguments[0]?arguments[0]:0;this.paused||(this.timer&&this.stop(),this.paused=!0,0===e?(this.paused=!1,this.start()):this.slider.on("transition:end",function(){t&&(t.paused=!1,t.run?t.start():t.stop())}))}},{key:"onVisibilityChange",value:function(t){document.hidden?this.stop():this.start()}},{key:"onMouseEnter",value:function(t){this._hovering=!0,this.slider.options.pauseOnHover&&this.pause()}},{key:"onMouseLeave",value:function(t){this._hovering=!1,this.slider.options.pauseOnHover&&this.pause()}}]),i}();e.a=o},function(t,e,i){"use strict";i.d(e,"a",function(){return o}),i.d(e,"b",function(){return a});window.navigator.pointerEnabled||window.navigator.msPointerEnabled,window.navigator.msPointerEnabled&&1<window.navigator.msMaxTouchPoints||window.navigator.pointerEnabled&&window.navigator.maxTouchPoints,navigator.userAgent.match(/(Android);?[\s\/]+([\d.]+)?/),navigator.userAgent.match(/(iPad).*OS\s([\d_]+)/),navigator.userAgent.match(/(iPod)(.*OS\s([\d_]+))?/),!navigator.userAgent.match(/(iPad).*OS\s([\d_]+)/)&&navigator.userAgent.match(/(iPhone\sOS)\s([\d_]+)/),0<=navigator.userAgent.toLowerCase().indexOf("safari")&&navigator.userAgent.toLowerCase().indexOf("chrome")<0&&navigator.userAgent.toLowerCase().indexOf("android"),/(iPhone|iPod|iPad).*AppleWebKit(?!.*Safari)/i.test(navigator.userAgent);var n=!!("ontouchstart"in window),s=!!("PointerEvent"in window),r=n||window.DocumentTouch&&document instanceof DocumentTouch||navigator.maxTouchPoints,o=r&&s?"pointerenter":"mouseenter",a=r&&s?"pointerleave":"mouseleave"},function(t,e,i){"use strict";var n=function(){function n(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(t,e,i){return e&&n(t.prototype,e),i&&n(t,i),t}}();var s=Symbol("onResize"),r=function(){function e(t){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),this.slider=t,this.options=t.options,this[s]=this[s].bind(this),this._bindEvents()}return n(e,[{key:"init",value:function(){return this._defaultBreakpoint={slidesToShow:this.options.slidesToShow,slidesToScroll:this.options.slidesToScroll},this.options.breakpoints.sort(function(t,e){return parseInt(t.changePoint,10)>parseInt(e.changePoint,10)}),this._currentBreakpoint=this._getActiveBreakpoint(),this}},{key:"destroy",value:function(){this._unbindEvents()}},{key:"_bindEvents",value:function(){window.addEventListener("resize",this[s]),window.addEventListener("orientationchange",this[s])}},{key:"_unbindEvents",value:function(){window.removeEventListener("resize",this[s]),window.removeEventListener("orientationchange",this[s])}},{key:"_getActiveBreakpoint",value:function(){var t=!0,e=!1,i=void 0;try{for(var n,s=this.options.breakpoints[Symbol.iterator]();!(t=(n=s.next()).done);t=!0){var r=n.value;if(r.changePoint>=window.innerWidth)return r}}catch(t){e=!0,i=t}finally{try{!t&&s.return&&s.return()}finally{if(e)throw i}}return this._defaultBreakpoint}},{key:"getSlidesToShow",value:function(){return this._currentBreakpoint?this._currentBreakpoint.slidesToShow:this._defaultBreakpoint.slidesToShow}},{key:"getSlidesToScroll",value:function(){return this._currentBreakpoint?this._currentBreakpoint.slidesToScroll:this._defaultBreakpoint.slidesToScroll}},{key:"apply",value:function(){this.slider.state.index>=this.slider.state.length&&0!==this.slider.state.index&&(this.slider.state.index=this.slider.state.index-this._currentBreakpoint.slidesToScroll),this.slider.state.length<=this._currentBreakpoint.slidesToShow&&(this.slider.state.index=0),this.options.loop&&this.slider._loop.init().apply(),this.options.infinite&&this.slider._infinite.init().apply(),this.slider._setDimensions(),this.slider._transitioner.init().apply(!0,this.slider._setHeight.bind(this.slider)),this.slider._setClasses(),this.slider._navigation.refresh(),this.slider._pagination.refresh()}},{key:s,value:function(t){var e=this._getActiveBreakpoint();e.slidesToShow!==this._currentBreakpoint.slidesToShow&&(this._currentBreakpoint=e,this.apply())}}]),e}();e.a=r},function(t,e,i){"use strict";var n=function(){function n(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(t,e,i){return e&&n(t.prototype,e),i&&n(t,i),t}}();var s=function(){function e(t){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),this.slider=t}return n(e,[{key:"init",value:function(){if(this.slider.options.infinite&&"translate"===this.slider.options.effect){this.slider.options.centerMode?this._infiniteCount=Math.ceil(this.slider.slidesToShow+this.slider.slidesToShow/2):this._infiniteCount=this.slider.slidesToShow;for(var t=[],e=0,i=this.slider.state.length;i>this.slider.state.length-1-this._infiniteCount;i-=1)e=i-1,t.unshift(this._cloneSlide(this.slider.slides[e],e-this.slider.state.length));for(var n=[],s=0;s<this._infiniteCount+this.slider.state.length;s+=1)n.push(this._cloneSlide(this.slider.slides[s%this.slider.state.length],s+this.slider.state.length));this.slider.slides=[].concat(t,function(t){if(Array.isArray(t)){for(var e=0,i=Array(t.length);e<t.length;e++)i[e]=t[e];return i}return Array.from(t)}(this.slider.slides),n)}return this}},{key:"apply",value:function(){}},{key:"onTransitionEnd",value:function(t){this.slider.options.infinite&&(this.slider.state.next>=this.slider.state.length?(this.slider.state.index=this.slider.state.next=this.slider.state.next-this.slider.state.length,this.slider.transitioner.apply(!0)):this.slider.state.next<0&&(this.slider.state.index=this.slider.state.next=this.slider.state.length+this.slider.state.next,this.slider.transitioner.apply(!0)))}},{key:"_cloneSlide",value:function(t,e){var i=t.cloneNode(!0);return i.dataset.sliderIndex=e,i.dataset.cloned=!0,(i.querySelectorAll("[id]")||[]).forEach(function(t){t.setAttribute("id","")}),i}}]),e}();e.a=s},function(t,e,i){"use strict";var n=i(11),s=function(){function n(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(t,e,i){return e&&n(t.prototype,e),i&&n(t,i),t}}();var r=function(){function e(t){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),this.slider=t}return s(e,[{key:"init",value:function(){return this}},{key:"apply",value:function(){this.slider.options.loop&&(0<this.slider.state.next?this.slider.state.next<this.slider.state.length?this.slider.state.next>this.slider.state.length-this.slider.slidesToShow&&Object(n.a)(this.slider._slides[this.slider.state.length-1],this.slider.wrapper)?this.slider.state.next=0:this.slider.state.next=Math.min(Math.max(this.slider.state.next,0),this.slider.state.length-this.slider.slidesToShow):this.slider.state.next=0:this.slider.state.next<=0-this.slider.slidesToScroll?this.slider.state.next=this.slider.state.length-this.slider.slidesToShow:this.slider.state.next=0)}}]),e}();e.a=r},function(t,e,i){"use strict";i.d(e,"a",function(){return n});var n=function(t,e){var i=t.getBoundingClientRect();return e=e||document.documentElement,0<=i.top&&0<=i.left&&i.bottom<=(window.innerHeight||e.clientHeight)&&i.right<=(window.innerWidth||e.clientWidth)}},function(t,e,i){"use strict";var n=i(13),s=function(){function n(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(t,e,i){return e&&n(t.prototype,e),i&&n(t,i),t}}();var r=function(){function e(t){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),this.slider=t,this._clickEvents=["click","touch"],this.onPreviousClick=this.onPreviousClick.bind(this),this.onNextClick=this.onNextClick.bind(this),this.onKeyUp=this.onKeyUp.bind(this)}return s(e,[{key:"init",value:function(){return this.node=document.createRange().createContextualFragment(Object(n.a)()),this._ui={previous:this.node.querySelector(".slider-navigation-previous"),next:this.node.querySelector(".slider-navigation-next")},this._unbindEvents(),this._bindEvents(),this.refresh(),this}},{key:"destroy",value:function(){this._unbindEvents()}},{key:"_bindEvents",value:function(){var e=this;this.slider.wrapper.addEventListener("keyup",this.onKeyUp),this._clickEvents.forEach(function(t){e._ui.previous.addEventListener(t,e.onPreviousClick),e._ui.next.addEventListener(t,e.onNextClick)})}},{key:"_unbindEvents",value:function(){var e=this;this.slider.wrapper.removeEventListener("keyup",this.onKeyUp),this._clickEvents.forEach(function(t){e._ui.previous.removeEventListener(t,e.onPreviousClick),e._ui.next.removeEventListener(t,e.onNextClick)})}},{key:"onNextClick",value:function(t){t.preventDefault(),this.slider.options.navigation&&this.slider.next()}},{key:"onPreviousClick",value:function(t){t.preventDefault(),this.slider.options.navigation&&this.slider.previous()}},{key:"onKeyUp",value:function(t){this.slider.options.keyNavigation&&("ArrowRight"===t.key||"Right"===t.key?this.slider.next():"ArrowLeft"!==t.key&&"Left"!==t.key||this.slider.previous())}},{key:"refresh",value:function(){this.slider.options.loop||this.slider.options.infinite||(this.slider.options.navigation&&this.slider.state.length>this.slider.slidesToShow?(this._ui.previous.classList.remove("is-hidden"),this._ui.next.classList.remove("is-hidden"),0===this.slider.state.next?(this._ui.previous.classList.add("is-hidden"),this._ui.next.classList.remove("is-hidden")):this.slider.state.next>=this.slider.state.length-this.slider.slidesToShow&&!this.slider.options.centerMode?(this._ui.previous.classList.remove("is-hidden"),this._ui.next.classList.add("is-hidden")):this.slider.state.next>=this.slider.state.length-1&&this.slider.options.centerMode&&(this._ui.previous.classList.remove("is-hidden"),this._ui.next.classList.add("is-hidden"))):(this._ui.previous.classList.add("is-hidden"),this._ui.next.classList.add("is-hidden")))}},{key:"render",value:function(){return this.node}}]),e}();e.a=r},function(t,e,i){"use strict";e.a=function(){return'<div class="slider-navigation-previous"></div>\n<div class="slider-navigation-next"></div>'}},function(t,e,i){"use strict";var n=i(15),s=i(16),r=function(){function n(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(t,e,i){return e&&n(t.prototype,e),i&&n(t,i),t}}();var o=function(){function e(t){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),this.slider=t,this._clickEvents=["click","touch"],this.onPageClick=this.onPageClick.bind(this),this.onResize=this.onResize.bind(this)}return r(e,[{key:"init",value:function(){return this._pages=[],this.node=document.createRange().createContextualFragment(Object(n.a)()),this._ui={container:this.node.firstChild},this._count=Math.ceil((this.slider.state.length-this.slider.slidesToShow)/this.slider.slidesToScroll),this._draw(),this.refresh(),this}},{key:"destroy",value:function(){this._unbindEvents()}},{key:"_bindEvents",value:function(){var i=this;window.addEventListener("resize",this.onResize),window.addEventListener("orientationchange",this.onResize),this._clickEvents.forEach(function(e){i._pages.forEach(function(t){return t.addEventListener(e,i.onPageClick)})})}},{key:"_unbindEvents",value:function(){var i=this;window.removeEventListener("resize",this.onResize),window.removeEventListener("orientationchange",this.onResize),this._clickEvents.forEach(function(e){i._pages.forEach(function(t){return t.removeEventListener(e,i.onPageClick)})})}},{key:"_draw",value:function(){if(this._ui.container.innerHTML="",this.slider.options.pagination&&this.slider.state.length>this.slider.slidesToShow){for(var t=0;t<=this._count;t++){var e=document.createRange().createContextualFragment(Object(s.a)()).firstChild;e.dataset.index=t*this.slider.slidesToScroll,this._pages.push(e),this._ui.container.appendChild(e)}this._bindEvents()}}},{key:"onPageClick",value:function(t){t.preventDefault(),this.slider.state.next=t.currentTarget.dataset.index,this.slider.show()}},{key:"onResize",value:function(){this._draw()}},{key:"refresh",value:function(){var e=this,t=void 0;(t=this.slider.options.infinite?Math.ceil(this.slider.state.length-1/this.slider.slidesToScroll):Math.ceil((this.slider.state.length-this.slider.slidesToShow)/this.slider.slidesToScroll))!==this._count&&(this._count=t,this._draw()),this._pages.forEach(function(t){t.classList.remove("is-active"),parseInt(t.dataset.index,10)===e.slider.state.next%e.slider.state.length&&t.classList.add("is-active")})}},{key:"render",value:function(){return this.node}}]),e}();e.a=o},function(t,e,i){"use strict";e.a=function(){return'<div class="slider-pagination"></div>'}},function(t,e,i){"use strict";e.a=function(){return'<div class="slider-page"></div>'}},function(t,e,i){"use strict";var n=i(3),s=function(){function n(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(t,e,i){return e&&n(t.prototype,e),i&&n(t,i),t}}();var r=function(){function e(t){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),this.slider=t,this.onStartDrag=this.onStartDrag.bind(this),this.onMoveDrag=this.onMoveDrag.bind(this),this.onStopDrag=this.onStopDrag.bind(this),this._init()}return s(e,[{key:"_init",value:function(){}},{key:"bindEvents",value:function(){this.slider.container.addEventListener("dragstart",function(t){return t.preventDefault()}),this.slider.container.addEventListener("mousedown",this.onStartDrag),this.slider.container.addEventListener("touchstart",this.onStartDrag),window.addEventListener("mousemove",this.onMoveDrag),window.addEventListener("touchmove",this.onMoveDrag),window.addEventListener("mouseup",this.onStopDrag),window.addEventListener("touchend",this.onStopDrag),window.addEventListener("touchcancel",this.onStopDrag)}},{key:"unbindEvents",value:function(){this.slider.container.removeEventListener("dragstart",function(t){return t.preventDefault()}),this.slider.container.removeEventListener("mousedown",this.onStartDrag),this.slider.container.removeEventListener("touchstart",this.onStartDrag),window.removeEventListener("mousemove",this.onMoveDrag),window.removeEventListener("touchmove",this.onMoveDrag),window.removeEventListener("mouseup",this.onStopDrag),window.removeEventListener("mouseup",this.onStopDrag),window.removeEventListener("touchcancel",this.onStopDrag)}},{key:"onStartDrag",value:function(t){if(t.touches){if(1<t.touches.length)return;t=t.touches[0]}this._origin=new n.a(t.screenX,t.screenY),this.width=this.slider.wrapperWidth,this.slider.transitioner.disable()}},{key:"onMoveDrag",value:function(t){if(this._origin){var e=t.touches?t.touches[0]:t;this._lastTranslate=new n.a(e.screenX-this._origin.x,e.screenY-this._origin.y),t.touches&&Math.abs(this._lastTranslate.x)>Math.abs(this._lastTranslate.y)&&(t.preventDefault(),t.stopPorpagation())}}},{key:"onStopDrag",value:function(t){this._origin&&this._lastTranslate&&(Math.abs(this._lastTranslate.x)>.2*this.width?this._lastTranslate.x<0?this.slider.next():this.slider.previous():this.slider.show(!0)),this._origin=null,this._lastTranslate=null}}]),e}();e.a=r},function(t,e,i){"use strict";var n=i(19),s=i(20),r=function(){function n(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(t,e,i){return e&&n(t.prototype,e),i&&n(t,i),t}}();var o=function(){function e(t){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),this.slider=t,this.options=t.options,this._animating=!1,this._animation=void 0,this._translate=new s.a(this,t,t.options),this._fade=new n.a(this,t,t.options)}return r(e,[{key:"init",value:function(){return this._fade.init(),this._translate.init(),this}},{key:"isAnimating",value:function(){return this._animating}},{key:"enable",value:function(){this._animation&&this._animation.enable()}},{key:"disable",value:function(){this._animation&&this._animation.disable()}},{key:"apply",value:function(t,e){if(!this._animating||t){switch(this.options.effect){case"fade":this._animation=this._fade;break;case"translate":default:this._animation=this._translate}this._animationCallback=e,t?this._animation&&this._animation.disable():(this._animation&&this._animation.enable(),this._animating=!0),this._animation&&this._animation.apply(),t&&this.end()}}},{key:"end",value:function(){this._animating=!1,this._animation=void 0,this.slider.state.index=this.slider.state.next,this._animationCallback&&this._animationCallback()}}]),e}();e.a=o},function(t,e,i){"use strict";var s=i(0),r=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var i=arguments[e];for(var n in i)Object.prototype.hasOwnProperty.call(i,n)&&(t[n]=i[n])}return t},o=function(){function n(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(t,e,i){return e&&n(t.prototype,e),i&&n(t,i),t}}();var n=function(){function n(t,e){var i=2<arguments.length&&void 0!==arguments[2]?arguments[2]:{};!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,n),this.transitioner=t,this.slider=e,this.options=r({},i)}return o(n,[{key:"init",value:function(){var i=this;return"fade"===this.options.effect&&this.slider.slides.forEach(function(t,e){Object(s.a)(t,{position:"absolute",left:0,top:0,"z-index":t.dataset.sliderIndex==i.slider.state.index?0:-2,opacity:t.dataset.sliderIndex==i.slider.state.index?1:0})}),this}},{key:"enable",value:function(){var e=this;this._oldSlide=this.slider.slides.filter(function(t){return t.dataset.sliderIndex==e.slider.state.index})[0],this._newSlide=this.slider.slides.filter(function(t){return t.dataset.sliderIndex==e.slider.state.next})[0],this._newSlide&&(this._newSlide.addEventListener("transitionend",this.onTransitionEnd.bind(this)),this._newSlide.style.transition=this.options.duration+"ms "+this.options.timing,this._oldSlide&&(this._oldSlide.addEventListener("transitionend",this.onTransitionEnd.bind(this)),this._oldSlide.style.transition=this.options.duration+"ms "+this.options.timing))}},{key:"disable",value:function(){var e=this;this._oldSlide=this.slider.slides.filter(function(t){return t.dataset.sliderIndex==e.slider.state.index})[0],this._newSlide=this.slider.slides.filter(function(t){return t.dataset.sliderIndex==e.slider.state.next})[0],this._newSlide&&(this._newSlide.removeEventListener("transitionend",this.onTransitionEnd.bind(this)),this._newSlide.style.transition="none",this._oldSlide&&(this._oldSlide.removeEventListener("transitionend",this.onTransitionEnd.bind(this)),this._oldSlide.style.transition="none"))}},{key:"apply",value:function(t){var e=this;this._oldSlide=this.slider.slides.filter(function(t){return t.dataset.sliderIndex==e.slider.state.index})[0],this._newSlide=this.slider.slides.filter(function(t){return t.dataset.sliderIndex==e.slider.state.next})[0],this._oldSlide&&this._newSlide&&(Object(s.a)(this._oldSlide,{opacity:0}),Object(s.a)(this._newSlide,{opacity:1,"z-index":t?0:-1}))}},{key:"onTransitionEnd",value:function(t){"fade"===this.options.effect&&(this.transitioner.isAnimating()&&t.target==this._newSlide&&(this._newSlide&&(Object(s.a)(this._newSlide,{"z-index":0}),this._newSlide.removeEventListener("transitionend",this.onTransitionEnd.bind(this))),this._oldSlide&&(Object(s.a)(this._oldSlide,{"z-index":-2}),this._oldSlide.removeEventListener("transitionend",this.onTransitionEnd.bind(this)))),this.transitioner.end())}}]),n}();e.a=n},function(t,e,i){"use strict";var r=i(3),o=i(0),s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var i=arguments[e];for(var n in i)Object.prototype.hasOwnProperty.call(i,n)&&(t[n]=i[n])}return t},a=function(){function n(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(t,e,i){return e&&n(t.prototype,e),i&&n(t,i),t}}();var n=function(){function n(t,e){var i=2<arguments.length&&void 0!==arguments[2]?arguments[2]:{};!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,n),this.transitioner=t,this.slider=e,this.options=s({},i),this.onTransitionEnd=this.onTransitionEnd.bind(this)}return a(n,[{key:"init",value:function(){return this._position=new r.a(this.slider.container.offsetLeft,this.slider.container.offsetTop),this._bindEvents(),this}},{key:"destroy",value:function(){this._unbindEvents()}},{key:"_bindEvents",value:function(){this.slider.container.addEventListener("transitionend",this.onTransitionEnd)}},{key:"_unbindEvents",value:function(){this.slider.container.removeEventListener("transitionend",this.onTransitionEnd)}},{key:"enable",value:function(){this.slider.container.style.transition=this.options.duration+"ms "+this.options.timing}},{key:"disable",value:function(){this.slider.container.style.transition="none"}},{key:"apply",value:function(){var e=this,t=void 0;if("translate"===this.options.effect){var i=this.slider.slides.filter(function(t){return t.dataset.sliderIndex==e.slider.state.next})[0],n=new r.a(i.offsetLeft,i.offsetTop);t=this.options.centerMode?new r.a(Math.round(Object(o.e)(this.slider.container)),Math.round(Object(o.b)(this.slider.container))):new r.a(Math.round(Object(o.e)(this.slider.container)-Object(o.e)(this.slider.wrapper)),Math.round(Object(o.b)(this.slider.container)-Object(o.b)(this.slider.wrapper)));var s=new r.a(Math.min(Math.max(-1*n.x,-1*t.x),0),Math.min(Math.max(-1*n.y,-1*t.y),0));this.options.loop&&(!this.options.vertical&&Math.abs(this._position.x)>t.x?(s.x=0,this.slider.state.next=0):this.options.vertical&&Math.abs(this._position.y)>t.y&&(s.y=0,this.slider.state.next=0)),this._position.x=s.x,this._position.y=s.y,this.options.centerMode&&(this._position.x=this._position.x+this.slider.wrapperWidth/2-Object(o.e)(i)/2),"rtl"===this.slider.direction&&(this._position.x=-this._position.x,this._position.y=-this._position.y),this.slider.container.style.transform="translate3d("+this._position.x+"px, "+this._position.y+"px, 0)",n.x>t.x&&this.slider.transitioner.end()}}},{key:"onTransitionEnd",value:function(t){"translate"===this.options.effect&&(this.transitioner.isAnimating()&&t.target==this.slider.container&&this.options.infinite&&this.slider._infinite.onTransitionEnd(t),this.transitioner.end())}}]),n}();e.a=n},function(t,e,i){"use strict";e.a={initialSlide:0,slidesToScroll:1,slidesToShow:1,navigation:!0,navigationKeys:!0,navigationSwipe:!0,pagination:!0,loop:!1,infinite:!1,effect:"translate",duration:300,timing:"ease",autoplay:!1,autoplaySpeed:3e3,pauseOnHover:!0,breakpoints:[{changePoint:480,slidesToShow:1,slidesToScroll:1},{changePoint:640,slidesToShow:2,slidesToScroll:2},{changePoint:768,slidesToShow:3,slidesToScroll:3}],onReady:null}},function(t,e,i){"use strict";e.a=function(t){return'<div id="'+t+'" class="slider" tabindex="0">\n <div class="slider-container"></div>\n </div>'}},function(t,e,i){"use strict";e.a=function(){return'<div class="slider-item"></div>'}}]).default}); |
@@ -1,12 +0,66 @@ | ||
# bulma-carousel | ||
Display a carousel | ||
# [CreativeBulma Boilerplate](https://creativebulma.net/) | ||
The official CreativeBulma Template boilerplate. | ||
(find all my bulma's extensions [here](https://wikiki.github.io)) | ||
This project provides a starter-kit to ease your Bulma.io template development based on the last [Bulma.io](https://bulma.io) version, [Gulp](https://gulpjs.com/) as build processor and [Jekyll](https://jekyllrb.com/) to provide a demo site for your template. | ||
[![npm](https://img.shields.io/npm/v/bulma-carousel.svg)](https://www.npmjs.com/package/bulma-carousel) | ||
[![npm](https://img.shields.io/npm/dm/bulma-carousel.svg)](https://www.npmjs.com/package/bulma-carousel) | ||
[![Build Status](https://travis-ci.org/Wikiki/bulma-carousel.svg?branch=master)](https://travis-ci.org/Wikiki/bulma-carousel) | ||
![bulma logo](https://bulma.io/images/bulma-logo.png) | ||
![sass logo](https://user-images.githubusercontent.com/10498583/31125541-e2a732e6-a848-11e7-959d-7d7b0c138124.jpg) | ||
![gulp logo](https://user-images.githubusercontent.com/10498583/31125542-e2a78b88-a848-11e7-8ac5-c396f46e811f.jpg) | ||
![browsersync logo](https://user-images.githubusercontent.com/10498583/31125540-e2a6eed0-a848-11e7-817a-69c5619f772a.jpg) | ||
Documentation & Demo | ||
--- | ||
You can find the Documentation and a demo [here](https://wikiki.github.io/components/carousel) | ||
## Requirements | ||
This project requires you to have a installation of [nodejs](https://nodejs.org/en/) with [npm](https://www.npmjs.com/get-npm) | ||
This project also requires you to have global installations of [gulp](http://gulpjs.com/). | ||
``` | ||
# Install gulp globally | ||
npm install -g gulp | ||
``` | ||
## Quick Start | ||
``` | ||
# 1 Clone this repo | ||
git clone https://github.com/CreativeBulma/Boilerplate.git | ||
# 2 Navigate into the repo directory | ||
cd Boilerplate | ||
# 3 Install all node packages | ||
npm install | ||
``` | ||
## Build | ||
The build process consists of numerous Gulp tasks that work together to optimize your template. | ||
``` bash | ||
# To run the build process, run the Gulp build script. | ||
gulp build | ||
# To run the styles build process alone. | ||
gulp build:styles | ||
# To run the scripts build process alone. | ||
gulp build:scripts | ||
# Run a build and test the template with the demo site. | ||
gulp demo | ||
``` | ||
## File structure | ||
|-- CreativeBulma Boilerplate folder | ||
|-- demo | ||
|-- dist | ||
|-- src | ||
|-- gruntfile.js | ||
|-- package.json | ||
|-- README.md | ||
## Test | ||
The test process consists of generating the Jekyll demo site and launch the local server. | ||
``` bash | ||
# Run a build and test the template with the demo site. | ||
gulp demo | ||
``` | ||
## License | ||
This project is licensed under the MIT license, Copyright (c) 2018 [CreativeBulma](https://creativebulma.net). | ||
For more information see `LICENSE.md`. |
const defaultOptions = { | ||
size: 1, | ||
initialSlide: 0, | ||
slidesToScroll: 1, | ||
slidesToShow: 1, | ||
navigation: true, | ||
navigationKeys: true, | ||
navigationSwipe: true, | ||
pagination: true, | ||
loop: false, | ||
infinite: false, | ||
effect: 'translate', | ||
duration: 300, | ||
timing: 'ease', | ||
autoplay: false, | ||
stopautoplayoninteraction: false, // stop autoplay if a user interacts with the controls | ||
delay: 5000, | ||
threshold: 50, //required min distance traveled to be considered swipe | ||
restraint: 100, // maximum distance allowed at the same time in perpendicular direction | ||
allowedTime: 500 // maximum time allowed to travel that distance | ||
autoplaySpeed: 3000, | ||
pauseOnHover: true, | ||
breakpoints: [{ | ||
changePoint: 480, | ||
slidesToShow: 1, | ||
slidesToScroll: 1 | ||
}, | ||
{ | ||
changePoint: 640, | ||
slidesToShow: 2, | ||
slidesToScroll: 2 | ||
}, | ||
{ | ||
changePoint: 768, | ||
slidesToShow: 3, | ||
slidesToScroll: 3 | ||
} | ||
], | ||
onReady: null | ||
}; | ||
export default defaultOptions; | ||
export default defaultOptions; |
@@ -1,25 +0,29 @@ | ||
import EventEmitter from './events'; | ||
import defaultOptions from './defaultOptions'; | ||
import { | ||
uuid | ||
} from './utils/index'; | ||
import { | ||
removeClasses, | ||
height, | ||
width, | ||
outerHeight | ||
} from './utils/css'; | ||
import { | ||
isString, | ||
isFunction | ||
} from './utils/type'; | ||
import EventEmitter from './utils/eventEmitter'; | ||
const BULMA_CAROUSEL_EVENTS = { | ||
'ready': 'carousel:ready', | ||
'slideBefore': 'carousel:slide:before', | ||
'slideAfter': 'carousel:slide:after' | ||
}; | ||
import Autoplay from './components/autoplay'; | ||
import Breakpoint from './components/breakpoint'; | ||
import Infinite from './components/infinite'; | ||
import Loop from './components/loop'; | ||
import Navigation from './components/navigation'; | ||
import Pagination from './components/pagination'; | ||
import Swipe from './components/swipe'; | ||
import Transitioner from './components/transitioner'; | ||
const onSwipeStart = Symbol('onSwipeStart'); | ||
const onSwipeMove = Symbol('onSwipeMove'); | ||
const onSwipeEnd = Symbol('onSwipeEnd'); | ||
import defaultOptions from './defaultOptions'; | ||
import template from './templates'; | ||
import templateItem from './templates/item'; | ||
var supportsPassive = false; | ||
try { | ||
var opts = Object.defineProperty({}, 'passive', { | ||
get: function() { | ||
supportsPassive = true; | ||
} | ||
}); | ||
window.addEventListener("testPassive", null, opts); | ||
window.removeEventListener("testPassive", null, opts); | ||
} catch (e) {} | ||
export default class bulmaCarousel extends EventEmitter { | ||
@@ -29,5 +33,3 @@ constructor(selector, options = {}) { | ||
this.element = typeof selector === 'string' | ||
? document.querySelector(selector) | ||
: selector; | ||
this.element = isString(selector) ? document.querySelector(selector) : selector; | ||
// An invalid selector or non-DOM node has been provided. | ||
@@ -37,123 +39,112 @@ if (!this.element) { | ||
} | ||
this._clickEvents = ['click', 'touch']; | ||
this._clickEvents = ['click']; | ||
/// Set default options and merge with instance defined | ||
// Use Element dataset values to override options | ||
const elementConfig = this.element.dataset ? Object.keys(this.element.dataset) | ||
.filter(key => Object.keys(defaultOptions).includes(key)) | ||
.reduce((obj, key) => { | ||
return { | ||
...obj, | ||
[key]: this.element.dataset[key] | ||
}; | ||
}, {}) : {}; | ||
// Set default options - dataset attributes are master | ||
this.options = { | ||
...defaultOptions, | ||
...options | ||
...options, | ||
...elementConfig | ||
}; | ||
if (this.element.dataset.autoplay) { | ||
this.options.autoplay = this.element.dataset.autoplay; | ||
} | ||
if (this.element.dataset.delay) { | ||
this.options.delay = this.element.dataset.delay; | ||
} | ||
if (this.element.dataset.size && !this.element.classList.contains('carousel-animate-fade')) { | ||
this.options.size = this.element.dataset.size; | ||
} | ||
if (this.element.classList.contains('carousel-animate-fade')) { | ||
this.options.size = 1; | ||
} | ||
if (this.element.dataset.stopautoplayoninteraction) { | ||
this.options.stopautoplayoninteraction = this.element.dataset.stopautoplayoninteraction; | ||
} | ||
this.forceHiddenNavigation = false; | ||
this._id = uuid('slider'); | ||
this[onSwipeStart] = this[onSwipeStart].bind(this); | ||
this[onSwipeMove] = this[onSwipeMove].bind(this); | ||
this[onSwipeEnd] = this[onSwipeEnd].bind(this); | ||
this.onShow = this.onShow.bind(this); | ||
this.init(); | ||
// Initiate plugin | ||
this._init(); | ||
} | ||
/** | ||
* Initiate all DOM element containing carousel class | ||
* Initiate all DOM element containing datePicker class | ||
* @method | ||
* @return {Array} Array of all Carousel instances | ||
* @return {Array} Array of all datePicker instances | ||
*/ | ||
static attach(selector = '.carousel, .hero-carousel', options = {}) { | ||
static attach(selector = '.slider', options = {}) { | ||
let instances = new Array(); | ||
const elements = document.querySelectorAll(selector); | ||
const elements = isString(selector) ? document.querySelectorAll(selector) : Array.isArray(selector) ? selector : [selector]; | ||
[].forEach.call(elements, element => { | ||
setTimeout(() => { | ||
instances.push(new bulmaCarousel(element, options)); | ||
}, 100); | ||
if (typeof element[this.constructor.name] === 'undefined') { | ||
const instance = new bulmaCarousel(element, options); | ||
element[this.constructor.name] = instance; | ||
instances.push(instance); | ||
} else { | ||
instances.push(element[this.constructor.name]); | ||
} | ||
}); | ||
return instances; | ||
} | ||
/**************************************************** | ||
* * | ||
* PRIVATE FUNCTIONS * | ||
* * | ||
****************************************************/ | ||
/** | ||
* Initiate plugin | ||
* @method init | ||
* @return {void} | ||
* Initiate plugin instance | ||
* @method _init | ||
* @return {Slider} Current plugin instance | ||
*/ | ||
init() { | ||
this.container = this.element.querySelector('.carousel-container'); | ||
this.items = this.element.querySelectorAll('.carousel-item'); | ||
this.currentItem = { | ||
element: this.element, | ||
node: this.element.querySelector('.carousel-item.is-active'), | ||
pos: -1 | ||
}; | ||
this.currentItem.pos = this.currentItem.node ? Array.from(this.items).indexOf(this.currentItem.node) : -1; | ||
if (!this.currentItem.node) { | ||
this.currentItem.node = this.items[0]; | ||
this.currentItem.node.classList.add('is-active'); | ||
this.currentItem.node.style.opacity = 1; | ||
this.currentItem.pos = 0; | ||
} | ||
this.forceHiddenNavigation = this.items.length <= 1; | ||
_init() { | ||
this._items = Array.from(this.element.children); | ||
let images = this.element.querySelectorAll('img'); | ||
[].forEach.call(images, img => { | ||
img.setAttribute('draggable', false); | ||
}); | ||
// Load plugins | ||
this._breakpoint = new Breakpoint(this); | ||
this._autoplay = new Autoplay(this); | ||
this._navigation = new Navigation(this); | ||
this._pagination = new Pagination(this); | ||
this._infinite = new Infinite(this); | ||
this._loop = new Loop(this); | ||
this._swipe = new Swipe(this); | ||
this._resize(); | ||
this._setOrder(); | ||
this._initNavigation(); | ||
this._bindEvents(); | ||
this._build(); | ||
if (this.options.autoplay) { | ||
this._autoPlay(this.options.delay); | ||
if (isFunction(this.options.onReady)) { | ||
this.options.onReady(this); | ||
} | ||
this.emit(BULMA_CAROUSEL_EVENTS.ready, this.currentItem); | ||
return this; | ||
} | ||
_resize() { | ||
const computedStyle = window.getComputedStyle(this.element); | ||
const width = parseInt(computedStyle.getPropertyValue('width'), 10); | ||
/** | ||
* Build Slider HTML component and append it to the DOM | ||
* @method _build | ||
*/ | ||
_build() { | ||
// Generate HTML Fragment of template | ||
this.node = document.createRange().createContextualFragment(template(this.id)); | ||
// Save pointers to template parts | ||
this._ui = { | ||
wrapper: this.node.firstChild, | ||
container: this.node.querySelector('.slider-container') | ||
} | ||
// Detect which animation is setup and auto-calculate size and transformation | ||
if (this.options.size > 1) { | ||
if (this.options.size >= Array.from(this.items).length) { | ||
this.offset = 0; | ||
} else { | ||
this.offset = width / this.options.size; | ||
} | ||
// Add slider to DOM | ||
this.element.appendChild(this.node); | ||
this._ui.wrapper.classList.add('is-loading'); | ||
this._ui.container.style.opacity = 0; | ||
this.container.style.left = 0 - this.offset + 'px'; | ||
this.container.style.transform = `translateX(${this.offset}px)`; | ||
[].forEach.call(this.items, item => { | ||
item.style.flexBasis = `${this.offset}px`; | ||
}); | ||
} | ||
this._transitioner = new Transitioner(this); | ||
// If animation is fade then force carouselContainer size (due to the position: absolute) | ||
if (this.element.classList.contains('carousel-animate-fade') && this.items.length) { | ||
let img = this.items[0].querySelector('img'); | ||
let scale = 1; | ||
if (img.naturalWidth) { | ||
scale = width / img.naturalWidth; | ||
this.container.style.height = (img.naturalHeight * scale) + 'px'; | ||
} else { | ||
img.onload = () => { | ||
scale = width / img.naturalWidth; | ||
this.container.style.height = (img.naturalHeight * scale) + 'px'; | ||
} | ||
} | ||
} | ||
// Wrap all items by slide element | ||
this._slides = this._items.map((item, index) => { | ||
return this._createSlide(item, index); | ||
}); | ||
this.reset(); | ||
this._bindEvents(); | ||
this._ui.container.style.opacity = 1; | ||
this._ui.wrapper.classList.remove('is-loading'); | ||
} | ||
@@ -167,257 +158,274 @@ | ||
_bindEvents() { | ||
if (this.previousControl) { | ||
this._clickEvents.forEach(clickEvent => { | ||
this.previousControl.addEventListener(clickEvent, e => { | ||
if (!supportsPassive) { | ||
e.preventDefault(); | ||
} | ||
if (this._autoPlayInterval) { | ||
clearInterval(this._autoPlayInterval); | ||
if (!this.options.stopautoplayoninteraction) { | ||
this._autoPlay(this.options.delay); | ||
} | ||
} | ||
this._slide('previous'); | ||
}, supportsPassive ? { passive: true } : false); | ||
}); | ||
} | ||
this.on('show', this.onShow); | ||
} | ||
if (this.nextControl) { | ||
this._clickEvents.forEach(clickEvent => { | ||
this.nextControl.addEventListener(clickEvent, e => { | ||
if (!supportsPassive) { | ||
e.preventDefault(); | ||
} | ||
if (this._autoPlayInterval) { | ||
clearInterval(this._autoPlayInterval); | ||
if (!this.options.stopautoplayoninteraction) { | ||
this._autoPlay(this.options.delay); | ||
} | ||
} | ||
this._slide('next'); | ||
}, supportsPassive ? { passive: true } : false); | ||
}); | ||
} | ||
// Bind swipe events | ||
this.element.addEventListener('touchstart', this[onSwipeStart], supportsPassive ? { passive: true } : false); | ||
this.element.addEventListener('mousedown', this[onSwipeStart], supportsPassive ? { passive: true } : false); | ||
this.element.addEventListener('touchmove', this[onSwipeMove], supportsPassive ? { passive: true } : false); | ||
this.element.addEventListener('mousemove', this[onSwipeMove], supportsPassive ? { passive: true } : false); | ||
this.element.addEventListener('touchend', this[onSwipeEnd], supportsPassive ? { passive: true } : false); | ||
this.element.addEventListener('mouseup', this[onSwipeEnd], supportsPassive ? { passive: true } : false); | ||
_unbindEvents() { | ||
this.off('show', this.onShow); | ||
} | ||
destroy() { | ||
this.element.removeEventListener('touchstart', this[onSwipeStart], supportsPassive ? { passive: true } : false); | ||
this.element.removeEventListener('mousedown', this[onSwipeStart], supportsPassive ? { passive: true } : false); | ||
this.element.removeEventListener('touchmove', this[onSwipeMove], supportsPassive ? { passive: true } : false); | ||
this.element.removeEventListener('mousemove', this[onSwipeMove], supportsPassive ? { passive: true } : false); | ||
this.element.removeEventListener('touchend', this[onSwipeEnd], supportsPassive ? { passive: true } : false); | ||
this.element.removeEventListener('mouseup', this[onSwipeEnd], supportsPassive ? { passive: true } : false); | ||
_createSlide(item, index) { | ||
const slide = document.createRange().createContextualFragment(templateItem()).firstChild; | ||
slide.dataset.sliderIndex = index; | ||
slide.appendChild(item); | ||
return slide; | ||
} | ||
/** | ||
* Save current position on start swiping | ||
* @method onSwipeStart | ||
* @param {Event} e Swipe event | ||
* @return {void} | ||
* Calculate slider dimensions | ||
*/ | ||
[onSwipeStart](e) { | ||
if (!supportsPassive) { | ||
e.preventDefault(); | ||
_setDimensions() { | ||
if (!this.options.vertical) { | ||
if (this.options.centerMode) { | ||
this._ui.wrapper.style.padding = '0px ' + this.options.centerPadding; | ||
} | ||
} else { | ||
this._ui.wrapper.style.height = outerHeight(this._slides[0]) * this.slidesToShow; | ||
if (this.options.centerMode) { | ||
this._ui.wrapper.style.padding = this.options.centerPadding + ' 0px'; | ||
} | ||
} | ||
e = e ? e : window.event; | ||
e = ('changedTouches' in e) ? e.changedTouches[0] : e; | ||
this._touch = { | ||
start: { | ||
time: new Date().getTime(), // record time when finger first makes contact with surface | ||
x: e.pageX, | ||
y: e.pageY | ||
}, | ||
dist: { | ||
x: 0, | ||
y: 0 | ||
} | ||
this._wrapperWidth = width(this._ui.wrapper); | ||
this._wrapperHeight = outerHeight(this._ui.wrapper); | ||
if (!this.options.vertical) { | ||
this._slideWidth = Math.ceil(this._wrapperWidth / this.slidesToShow); | ||
this._containerWidth = Math.ceil(this._slideWidth * this._slides.length); | ||
this._ui.container.style.width = this._containerWidth + 'px'; | ||
} else { | ||
this._slideWidth = Math.ceil(this._wrapperWidth); | ||
this._containerHeight = Math.ceil((outerHeight(this._slides[0]) * this._slides.length)); | ||
this._ui.container.style.height = this._containerHeight + 'px'; | ||
} | ||
this._slides.forEach(slide => { | ||
slide.style.width = this._slideWidth + 'px'; | ||
}); | ||
} | ||
/** | ||
* Save current position on end swiping | ||
* @method onSwipeMove | ||
* @param {Event} e swipe event | ||
* @return {void} | ||
*/ | ||
[onSwipeMove](e) { | ||
if (!supportsPassive) { | ||
e.preventDefault(); | ||
_setHeight() { | ||
if (this.options.effect !== 'translate') { | ||
this._ui.container.style.height = outerHeight(this._slides[this.state.index]) + 'px'; | ||
} | ||
} | ||
// Update slides classes | ||
_setClasses() { | ||
this._slides.forEach(slide => { | ||
removeClasses(slide, 'is-active is-current is-slide-previous is-slide-next'); | ||
if (Math.abs((this.state.index - 1) % this.state.length) === parseInt(slide.dataset.sliderIndex, 10)) { | ||
slide.classList.add('is-slide-previous'); | ||
} | ||
if (Math.abs(this.state.index % this.state.length) === parseInt(slide.dataset.sliderIndex, 10)) { | ||
slide.classList.add('is-current'); | ||
} | ||
if (Math.abs((this.state.index + 1) % this.state.length) === parseInt(slide.dataset.sliderIndex, 10)) { | ||
slide.classList.add('is-slide-next'); | ||
} | ||
}); | ||
} | ||
/**************************************************** | ||
* * | ||
* GETTERS and SETTERS * | ||
* * | ||
****************************************************/ | ||
/** | ||
* Save current position on end swiping | ||
* @method onSwipeEnd | ||
* @param {Event} e swipe event | ||
* @return {void} | ||
* Get id of current datePicker | ||
*/ | ||
[onSwipeEnd](e) { | ||
if (!supportsPassive) { | ||
e.preventDefault(); | ||
} | ||
get id() { | ||
return this._id; | ||
} | ||
e = e ? e : window.event; | ||
e = ('changedTouches' in e) ? e.changedTouches[0] : e; | ||
this._touch.dist = { | ||
x: e.pageX - this._touch.start.x, // get horizontal dist traveled by finger while in contact with surface | ||
y: e.pageY - this._touch.start.y // get vertical dist traveled by finger while in contact with surface | ||
}; | ||
set index(index) { | ||
this._index = index; | ||
} | ||
this._handleGesture(); | ||
get index() { | ||
return this._index; | ||
} | ||
/** | ||
* Identify the gestureand slide if necessary | ||
* @method _handleGesture | ||
* @return {void} | ||
*/ | ||
_handleGesture() { | ||
const elapsedTime = new Date().getTime() - this._touch.start.time; // get time elapsed | ||
if (elapsedTime <= this.options.allowedTime) { // first condition for awipe met | ||
if (Math.abs(this._touch.dist.x) >= this.options.threshold && Math.abs(this._touch.dist.y) <= this.options.restraint) { // 2nd condition for horizontal swipe met | ||
(this._touch.dist.x < 0) | ||
? this._slide('next') | ||
: this._slide('previous'); // if dist traveled is negative, it indicates left swipe | ||
} | ||
} | ||
set length(length) { | ||
this._length = length; | ||
} | ||
/** | ||
* Initiate Navigation area and Previous/Next buttons | ||
* @method _initNavigation | ||
* @return {[type]} [description] | ||
*/ | ||
_initNavigation() { | ||
this.previousControl = this.element.querySelector('.carousel-nav-left'); | ||
this.nextControl = this.element.querySelector('.carousel-nav-right'); | ||
get length() { | ||
return this._length; | ||
} | ||
if (this.items.length <= 1 || this.forceHiddenNavigation) { | ||
if (this.container && !this.element.classList.contains('carousel-animate-fade')) { | ||
this.container.style.left = '0'; | ||
} | ||
if (this.previousControl) { | ||
this.previousControl.style.display = 'none'; | ||
} | ||
if (this.nextControl) { | ||
this.nextControl.style.display = 'none'; | ||
} | ||
} | ||
get slides() { | ||
return this._slides; | ||
} | ||
/** | ||
* Update each item order | ||
* @method _setOrder | ||
*/ | ||
_setOrder() { | ||
this.currentItem.node.style.order = '1'; | ||
this.currentItem.node.style.zIndex = '1'; | ||
let item = this.currentItem.node; | ||
let i, | ||
j, | ||
ref; | ||
for ( | ||
i = j = 2, ref = Array.from(this.items).length; ( | ||
2 <= ref | ||
? j <= ref | ||
: j >= ref); i = 2 <= ref | ||
? ++j | ||
: --j) { | ||
item = this._next(item); | ||
item.style.order = '' + i % Array.from(this.items).length; | ||
item.style.zIndex = '0'; | ||
} | ||
set slides(slides) { | ||
this._slides = slides; | ||
} | ||
/** | ||
* Find next item to display | ||
* @method _next | ||
* @param {Node} element Current Node element | ||
* @return {Node} Next Node element | ||
*/ | ||
_next(element) { | ||
if (element.nextElementSibling) { | ||
return element.nextElementSibling; | ||
get slidesToScroll() { | ||
return this.options.effect === 'translate' ? this._breakpoint.getSlidesToScroll() : 1; | ||
} | ||
get slidesToShow() { | ||
return this.options.effect === 'translate' ? this._breakpoint.getSlidesToShow() : 1; | ||
} | ||
get direction() { | ||
return (this.element.dir.toLowerCase() === 'rtl' || this.element.style.direction === 'rtl') ? 'rtl' : 'ltr'; | ||
} | ||
get wrapper() { | ||
return this._ui.wrapper; | ||
} | ||
get wrapperWidth() { | ||
return this._wrapperWidth || 0; | ||
} | ||
get container() { | ||
return this._ui.container; | ||
} | ||
get containerWidth() { | ||
return this._containerWidth || 0; | ||
} | ||
get slideWidth() { | ||
return this._slideWidth || 0; | ||
} | ||
get transitioner() { | ||
return this._transitioner; | ||
} | ||
/**************************************************** | ||
* * | ||
* EVENTS FUNCTIONS * | ||
* * | ||
****************************************************/ | ||
onShow(e) { | ||
this._navigation.refresh(); | ||
this._pagination.refresh(); | ||
this._setClasses(); | ||
} | ||
/**************************************************** | ||
* * | ||
* PUBLIC FUNCTIONS * | ||
* * | ||
****************************************************/ | ||
next() { | ||
if (!this.options.loop && !this.options.infinite && this.state.index + this.slidesToScroll > this.state.length - this.slidesToShow && !this.options.centerMode) { | ||
this.state.next = this.state.index; | ||
} else { | ||
return this.items[0]; | ||
this.state.next = this.state.index + this.slidesToScroll; | ||
} | ||
this.show(); | ||
} | ||
/** | ||
* Find previous item to display | ||
* @method _previous | ||
* @param {Node} element Current Node element | ||
* @return {Node} Previous Node element | ||
*/ | ||
_previous(element) { | ||
if (element.previousElementSibling) { | ||
return element.previousElementSibling; | ||
previous() { | ||
if (!this.options.loop && !this.options.infinite && this.state.index === 0) { | ||
this.state.next = this.state.index; | ||
} else { | ||
return this.items[this.items.length - 1]; | ||
this.state.next = this.state.index - this.slidesToScroll; | ||
} | ||
this.show(); | ||
} | ||
/** | ||
* Update slides to display the wanted one | ||
* @method _slide | ||
* @param {String} [direction='next'] Direction in which items need to move | ||
* @return {void} | ||
*/ | ||
_slide(direction = 'next') { | ||
if (this.items.length) { | ||
this.oldItemNode = this.currentItem.node; | ||
this.emit(BULMA_CAROUSEL_EVENTS.slideBefore, this.currentItem); | ||
if(this.options.stopautoplayoninteraction) { | ||
clearInterval(this._autoPlayInterval); | ||
} | ||
// initialize direction to change order | ||
if (direction === 'previous') { | ||
this.currentItem.node = this._previous(this.currentItem.node); | ||
// add reverse class | ||
if (!this.element.classList.contains('carousel-animate-fade')) { | ||
this.element.classList.add('is-reversing'); | ||
this.container.style.transform = `translateX(${ - Math.abs(this.offset)}px)`; | ||
} | ||
} else { | ||
// Reorder items | ||
this.currentItem.node = this._next(this.currentItem.node); | ||
// re_slide reverse class | ||
this.element.classList.remove('is-reversing'); | ||
this.container.style.transform = `translateX(${Math.abs(this.offset)}px)`; | ||
} | ||
this.currentItem.node.classList.add('is-active'); | ||
this.oldItemNode.classList.remove('is-active'); | ||
start() { | ||
this._autoplay.start(); | ||
} | ||
// Disable transition to instant change order | ||
this.element.classList.remove('carousel-animated'); | ||
// Enable transition to animate order 1 to order 2 | ||
setTimeout(() => { | ||
this.element.classList.add('carousel-animated'); | ||
}, 50); | ||
pause() { | ||
this._autoplay.pause(); | ||
} | ||
this._setOrder(); | ||
this.emit(BULMA_CAROUSEL_EVENTS.slideAfter, this.currentItem); | ||
stop() { | ||
this._autoplay.stop(); | ||
} | ||
show(index, force = false) { | ||
// If all slides are already visible then return | ||
if (!this.state.length || this.state.length <= this.slidesToShow) { | ||
return; | ||
} | ||
if (typeof index === 'Number') { | ||
this.state.next = index; | ||
} | ||
if (this.options.loop) { | ||
this._loop.apply(); | ||
} | ||
if (this.options.infinite) { | ||
this._infinite.apply(); | ||
} | ||
// If new slide is already the current one then return | ||
if (this.state.index === this.state.next) { | ||
return; | ||
} | ||
this.emit('before:show', this.state); | ||
this._transitioner.apply(force, this._setHeight.bind(this)); | ||
this.emit('after:show', this.state); | ||
this.emit('show', this); | ||
} | ||
reset() { | ||
this.state = { | ||
length: this._items.length, | ||
index: Math.abs(this.options.initialSlide), | ||
next: Math.abs(this.options.initialSlide), | ||
prev: undefined | ||
}; | ||
// Fix options | ||
if (this.options.loop && this.options.infinite) { | ||
this.options.loop = false; | ||
} | ||
if (this.options.slidesToScroll > this.options.slidesToShow) { | ||
this.options.slidesToScroll = this.slidesToShow; | ||
} | ||
this._breakpoint.init(); | ||
if (this.state.index >= this.state.length && this.state.index !== 0) { | ||
this.state.index = this.state.index - this.slidesToScroll; | ||
} | ||
if (this.state.length <= this.slidesToShow) { | ||
this.state.index = 0; | ||
} | ||
this._ui.wrapper.appendChild(this._navigation.init().render()); | ||
this._ui.wrapper.appendChild(this._pagination.init().render()); | ||
if (this.options.navigationSwipe) { | ||
this._swipe.bindEvents(); | ||
} else { | ||
this._swipe._bindEvents(); | ||
} | ||
this._breakpoint.apply(); | ||
// Move all created slides into slider | ||
this._slides.forEach(slide => this._ui.container.appendChild(slide)); | ||
this._transitioner.init().apply(true, this._setHeight.bind(this)); | ||
if (this.options.autoplay) { | ||
this._autoplay.init().start(); | ||
} | ||
} | ||
/** | ||
* Initiate autoplay system | ||
* @method _autoPlay | ||
* @param {Number} [delay=5000] Delay between slides in milliseconds | ||
* @return {void} | ||
* Destroy Slider | ||
* @method destroy | ||
*/ | ||
_autoPlay(delay = 5000) { | ||
this._autoPlayInterval = setInterval(() => { | ||
this._slide('next'); | ||
}, delay); | ||
destroy() { | ||
this._unbindEvents(); | ||
this._items.forEach(item => { | ||
this.element.appendChild(item); | ||
}); | ||
this.node.remove(); | ||
} | ||
} | ||
} |
@@ -6,3 +6,3 @@ { | ||
"style": "./dist/css/bulma-extensions.min.css", | ||
"version": "6.0.1", | ||
"version": "6.2.0", | ||
"scripts": { | ||
@@ -9,0 +9,0 @@ "build": "gulp", |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
5282871
293
76621