vueperslides - npm Package Compare versions

Comparing version 1.2.1 to 1.3.0

dist/vueperslides.js

@@ -73,3 +73,3 @@ (function (global, factory) {
         style = document.createElement('style'),
-        css = ".vueperslides { position: relative; } .vueperslides__inner { position: relative; padding-bottom: 33.33%; } .vueperslides__track-wrapper { position: absolute; top: 0; bottom: 0; left: 0; right: 0; overflow: hidden; z-index: 1; } .vueperslides__track-wrapper::before, .vueperslides__track-wrapper::after { content: \"\"; position: absolute; bottom: 100%; left: -1em; right: -1em; height: 2em; box-shadow: 0 0 20px rgba(0, 0, 0, 0.25); z-index: 2; } .vueperslides__track-wrapper::after { top: 100%; bottom: auto; } .vueperslides--fade .vueperslides__track { white-space: normal; transition: none; } .vueperslides--touchable .vueperslides__track { cursor: ew-resize; cursor: -webkit-grab; cursor: grab; } .vueperslides--touchable .vueperslides__track--mousedown, .vueperslides--touchable .vueperslides__track--dragging { cursor: -webkit-grabbing; cursor: grabbing; } .vueperslides__track { white-space: nowrap; transition: 0.5s ease-in-out transform; height: 100%; } .vueperslides__track--mousedown { transition: 0.2s ease-in-out transform; } .vueperslides__track--dragging { transition: none; } .vueperslides__track--no-animation { transition-duration: 0s; } .vueperslides__slide { white-space: normal; background-position: top; background-size: cover; display: inline-block; width: 100%; height: 100%; } .vueperslides__slide-content { user-select: none; } .vueperslides__slide-content--outside { user-select: initial; } .vueperslides--fade .vueperslides__slide { position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; transition: .8s ease-in-out opacity; } .vueperslides--fade .vueperslides__slide--active { z-index: 1; opacity: 1; } .vueperslides__arrow { position: absolute; top: 50%; background-color: transparent; border: none; color: #fff; fill: currentColor; font-size: 3em; width: 1em; text-align: center; transform: translateY(-50%); opacity: 0.7; transition: 0.3s ease-in-out; cursor: pointer; user-select: none; outline: none; z-index: 2; } .vueperslides__arrow--prev { left: 10px; } .vueperslides__arrow--next { right: 10px; } .vueperslides__arrow:hover { opacity: 1; } .vueperslides__paused { position: absolute; top: 3%; right: 3%; opacity: 0; transition: 0.3s ease-in-out; text-shadow: 0 0 3px rgba(0, 0, 0, 0.4); z-index: 1; } .vueperslides:hover .vueperslides__paused { opacity: 1; } .vueperslides__bullets { display: flex; justify-content: center; position: absolute; bottom: 0; left: 0; right: 0; } .vueperslides__bullets--outside { position: relative; } .vueperslides__bullet { width: 12px; height: 12px; border-radius: 12px; border: 1px solid #fff; background-color: transparent; box-shadow: 0 0 1px rgba(0, 0, 0, 0.5), 0 0 3px rgba(0, 0, 0, 0.3); margin: 1.5em 0.6em; padding: 0; display: inline-block; cursor: pointer; user-select: none; outline: none; z-index: 2; display: flex; justify-content: center; align-items: center; } .vueperslides__bullet--active { background-color: #fff; } .vueperslides__bullet::-moz-focus-inner { border: 0; } .vueperslides__bullet span { display: none; } ";style.type = 'text/css';if (style.styleSheet) {
+        css = ".vueperslides { position: relative; } .vueperslides__inner { position: relative; } .vueperslides__parallax-wrapper { position: relative; padding-bottom: 33.33%; overflow: hidden; } .vueperslides__parallax-wrapper::before, .vueperslides__parallax-wrapper::after { content: \"\"; position: absolute; bottom: 100%; left: -1em; right: -1em; height: 2em; box-shadow: 0 0 20px rgba(0, 0, 0, 0.25); z-index: 2; } .vueperslides__parallax-wrapper::after { top: 100%; bottom: auto; } .vueperslides__track-wrapper { position: absolute; top: 0; height: 100%; left: 0; right: 0; overflow: hidden; z-index: 1; } .vueperslides--parallax .vueperslides__track-wrapper { height: 200%; transform: translateY(0); } .vueperslides--fade .vueperslides__track { white-space: normal; transition: none; } .vueperslides--touchable .vueperslides__track { cursor: ew-resize; cursor: -webkit-grab; cursor: grab; } .vueperslides--touchable .vueperslides__track--mousedown, .vueperslides--touchable .vueperslides__track--dragging { cursor: -webkit-grabbing; cursor: grabbing; } .vueperslides__track { white-space: nowrap; transition: 0.5s ease-in-out transform; height: 100%; } .vueperslides__track--mousedown { transition: 0.2s ease-in-out transform; } .vueperslides__track--dragging { transition: none; } .vueperslides__track--no-animation { transition-duration: 0s; } .vueperslides__slide { white-space: normal; background-position: top; background-size: cover; display: inline-block; width: 100%; height: 100%; } .vueperslides__slide-content { user-select: none; } .vueperslides__slide-content--outside { user-select: initial; } .vueperslides--fade .vueperslides__slide { position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; transition: .8s ease-in-out opacity; } .vueperslides--fade .vueperslides__slide--active { z-index: 1; opacity: 1; } .vueperslides__arrow { position: absolute; top: 50%; background-color: transparent; border: none; color: #fff; fill: currentColor; font-size: 3em; width: 1em; text-align: center; transform: translateY(-50%); opacity: 0.7; transition: 0.3s ease-in-out; cursor: pointer; user-select: none; outline: none; z-index: 2; } .vueperslides__arrow--prev { left: 10px; } .vueperslides__arrow--next { right: 10px; } .vueperslides__arrow:hover { opacity: 1; } .vueperslides__paused { position: absolute; top: 3%; right: 3%; opacity: 0; transition: 0.3s ease-in-out; text-shadow: 0 0 3px rgba(0, 0, 0, 0.4); z-index: 1; } .vueperslides:hover .vueperslides__paused { opacity: 1; } .vueperslides__bullets { display: flex; justify-content: center; position: absolute; bottom: 0; left: 0; right: 0; } .vueperslides__bullets--outside { position: relative; } .vueperslides__bullet { width: 12px; height: 12px; border-radius: 12px; border: 1px solid #fff; background-color: transparent; box-shadow: 0 0 1px rgba(0, 0, 0, 0.5), 0 0 3px rgba(0, 0, 0, 0.3); margin: 1.5em 0.6em; padding: 0; display: inline-block; cursor: pointer; user-select: none; outline: none; z-index: 2; display: flex; justify-content: center; align-items: center; } .vueperslides__bullet--active { background-color: #fff; } .vueperslides__bullet::-moz-focus-inner { border: 0; } .vueperslides__bullet span { display: none; } ";style.type = 'text/css';if (style.styleSheet) {
       style.styleSheet.cssText = css;
@@ -83,3 +83,3 @@ } else {
 var VueperSlides = { render: function render() {
-    var _vm = this;var _h = _vm.$createElement;var _c = _vm._self._c || _h;return _c('div', { ref: "vueperslides", staticClass: "vueperslides", class: { 'vueperslides--ready': _vm.isReady, 'vueperslides--fade': _vm.conf.fade, 'vueperslides--touchable': _vm.touch.enabled && !_vm.disable } }, [_vm.conf.slideContentOutside ? _c('div', { staticClass: "vueperslides__slide-content vueperslides__slide-content--outside", class: _vm.conf.slideContentOutsideClass }, [_vm.slides.count && _vm.slides.list[_vm.slides.current].title ? _c('p', { staticClass: "slide-title", domProps: { "innerHTML": _vm._s(_vm.slides.list[_vm.slides.current].title) } }) : _vm._e(), _vm.slides.count && _vm.slides.list[_vm.slides.current].content ? _c('p', { staticClass: "slide-content", domProps: { "innerHTML": _vm._s(_vm.slides.list[_vm.slides.current].content) } }) : _vm._e()]) : _vm._e(), _c('div', { staticClass: "vueperslides__inner", style: 'padding-bottom:' + this.conf.slideRatio * 100 + '%' }, [_c('div', { staticClass: "vueperslides__track-wrapper" }, [_c('div', { ref: "track", staticClass: "vueperslides__track", class: { 'vueperslides__track--dragging': _vm.touch.dragging, 'vueperslides__track--mousedown': _vm.mouseDown }, style: !_vm.conf.fade ? 'transform: translate3d(' + _vm.currentTranslation + '%, 0, 0)' : '' }, [_vm.slides.count && _vm.clones[0] ? _c('vueper-slide', { staticClass: "vueperslides__slide--clone", style: _vm.clones[0].style, attrs: { "clone": 0, "title": _vm.clones[0].title, "content": _vm.clones[0].content, "image": _vm.clones[0].image } }) : _vm._e(), _vm._t("default", null, { currentSlide: _vm.slides.current }), _vm.slides.count && _vm.clones[1] ? _c('vueper-slide', { staticClass: "vueperslides__slide--clone", style: _vm.clones[1].style, attrs: { "clone": 1, "title": _vm.clones[1].title, "content": _vm.clones[1].content, "image": _vm.clones[1].image } }) : _vm._e()], 2)]), _vm.$slots.pausedIcon ? _c('div', { staticClass: "vueperslides__paused" }, [_vm._t("pausedIcon")], 2) : _vm._e(), _vm.conf.arrows && _vm.slides.count > 1 && !_vm.disable ? _c('div', { staticClass: "vueperslides__arrows" }, [_c('button', { directives: [{ name: "show", rawName: "v-show", value: !_vm.arrowPrevDisabled, expression: "!arrowPrevDisabled" }], staticClass: "vueperslides__arrow vueperslides__arrow--prev", on: { "click": function click($event) {
+    var _vm = this;var _h = _vm.$createElement;var _c = _vm._self._c || _h;return _c('div', { ref: "vueperslides", staticClass: "vueperslides", class: { 'vueperslides--ready': _vm.isReady, 'vueperslides--fade': _vm.conf.fade, 'vueperslides--parallax': _vm.conf.parallax, 'vueperslides--touchable': _vm.touch.enabled && !_vm.disable } }, [_vm.conf.slideContentOutside ? _c('div', { staticClass: "vueperslides__slide-content vueperslides__slide-content--outside", class: _vm.conf.slideContentOutsideClass }, [_vm.slides.count && _vm.slides.list[_vm.slides.current].title ? _c('p', { staticClass: "slide-title", domProps: { "innerHTML": _vm._s(_vm.slides.list[_vm.slides.current].title) } }) : _vm._e(), _vm.slides.count && _vm.slides.list[_vm.slides.current].content ? _c('p', { staticClass: "slide-content", domProps: { "innerHTML": _vm._s(_vm.slides.list[_vm.slides.current].content) } }) : _vm._e()]) : _vm._e(), _c('div', { staticClass: "vueperslides__inner" }, [_c('div', { staticClass: "vueperslides__parallax-wrapper", style: 'padding-bottom:' + this.conf.slideRatio * 100 + '%' }, [_c('div', { staticClass: "vueperslides__track-wrapper", style: _vm.conf.parallax ? 'transform: translateY(-' + _vm.parallaxData.translation + '%)' : '' }, [_c('div', { ref: "track", staticClass: "vueperslides__track", class: { 'vueperslides__track--dragging': _vm.touch.dragging, 'vueperslides__track--mousedown': _vm.mouseDown }, style: !_vm.conf.fade ? 'transform: translate3d(' + _vm.currentTranslation + '%, 0, 0)' : '' }, [_vm.slides.count && _vm.clones[0] ? _c('vueper-slide', { staticClass: "vueperslides__slide--clone", style: _vm.clones[0].style, attrs: { "clone": 0, "title": _vm.clones[0].title, "content": _vm.clones[0].content, "image": _vm.clones[0].image } }) : _vm._e(), _vm._t("default", null, { currentSlide: _vm.slides.current }), _vm.slides.count && _vm.clones[1] ? _c('vueper-slide', { staticClass: "vueperslides__slide--clone", style: _vm.clones[1].style, attrs: { "clone": 1, "title": _vm.clones[1].title, "content": _vm.clones[1].content, "image": _vm.clones[1].image } }) : _vm._e()], 2)])]), _vm.$slots.pausedIcon ? _c('div', { staticClass: "vueperslides__paused" }, [_vm._t("pausedIcon")], 2) : _vm._e(), _vm.conf.arrows && _vm.slides.count > 1 && !_vm.disable ? _c('div', { staticClass: "vueperslides__arrows" }, [_c('button', { directives: [{ name: "show", rawName: "v-show", value: !_vm.arrowPrevDisabled, expression: "!arrowPrevDisabled" }], staticClass: "vueperslides__arrow vueperslides__arrow--prev", on: { "click": function click($event) {
           _vm.onArrowClick(false);
@@ -162,2 +162,6 @@ } } }, [_vm._t("arrowLeft", [_c('svg', { attrs: { "viewBox": "0 0 24 24" } }, [_c('path', { attrs: { "d": "M16.2,21c0.3,0,0.5-0.1,0.7-0.3c0.4-0.4,0.4-1,0-1.4L9.6,12L17,4.7c0.4-0.4,0.4-1,0-1.4c-0.4-0.4-1-0.4-1.4,0L6.8,12l8.8,8.7C15.7,20.9,16,21,16.2,21z" } })])])], 2), _c('button', { directives: [{ name: "show", rawName: "v-show", value: !_vm.arrowNextDisabled, expression: "!arrowNextDisabled" }], staticClass: "vueperslides__arrow vueperslides__arrow--next", on: { "click": function click($event) {
     },
+    parallax: {
+      type: Boolean,
+      default: false
+    },
     touchable: {
@@ -187,2 +191,3 @@ type: Boolean,
       isReady: false,
+      container: null,
       slides: { list: [], count: 0, activeUid: null, current: 0, clones: [] },
@@ -198,2 +203,3 @@ clones: [],
       breakpointsData: { list: [], current: null },
+      parallaxData: { translation: 0, slideshowOffsetTop: null },
       conf: null
@@ -215,2 +221,4 @@ };
 
+      this.container = this.$refs.vueperslides;
+
       if (Object.keys(this.breakpoints).length) {
@@ -307,2 +315,3 @@ this.setBreakpointsList();
 
+      // Touch enabled slideshow.
       if (this.touch.enabled) {
@@ -316,15 +325,69 @@ this.$refs.track.addEventListener(hasTouch ? 'touchstart' : 'mousedown', this.onMouseDown);
       if (this.conf.pauseOnHover && !hasTouch && this.conf.autoplay) {
-        this.$refs.vueperslides.addEventListener('mouseover', this.onMouseIn);
-        this.$refs.vueperslides.addEventListener('mouseout', this.onMouseOut);
+        this.container.addEventListener('mouseover', this.onMouseIn);
+        this.container.addEventListener('mouseout', this.onMouseOut);
       }
 
-      if (this.breakpointsData.list.length) {
+      // Breakpoints or parallax need a resize event.
+      if (this.breakpointsData.list.length || this.parallax) {
         window.addEventListener('resize', this.onResize);
       }
+
+      // Parallax slideshow.
+      if (this.parallax) {
+        document.addEventListener('scroll', this.onScroll);
+      }
     },
+
+
+    // Recursively sum all the offsetTop values from current element up the tree until body.
+    // By doing so a padding or margin on a parent won't cause a wrong calculation.
+    getSlideshowOffsetTop: function getSlideshowOffsetTop() {
+      var force = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+
+      if (this.parallaxData.slideshowOffsetTop === null || force) {
+        var el = this.container;
+        var top = el.offsetTop;
+
+        while (el = el.offsetParent) {
+          top += el.offsetTop;
+        }
+
+        this.parallaxData.slideshowOffsetTop = top;
+      }
+
+      return this.parallaxData.slideshowOffsetTop;
+    },
+    onScroll: function onScroll(e) {
+      var doc = document.documentElement;
+      var scrollTop = (window.pageYOffset || doc.scrollTop) - (doc.clientTop || 0);
+      var windowHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
+      var slideshowHeight = this.container.clientHeight;
+      var slideshowTopOffset = this.getSlideshowOffsetTop();
+
+      // The distance between the bottom line of the current vueperslides slideshow and top of window.
+      // Negative value means the slideshow is totally above the current window box.
+      var vsBottom2WinTop = slideshowTopOffset + slideshowHeight - scrollTop;
+      // The distance between the top line of the current vueperslides slideshow and bottom of window.
+      // Negative value means the slideshow is totally bellow the current window box.
+      var vsTop2winBottom = windowHeight + scrollTop - slideshowTopOffset;
+
+      // Only apply translation when slideshow is visible.
+      if (vsBottom2WinTop > 0 && vsTop2winBottom > 0) {
+        var heightToCoverWithTranslation = windowHeight + slideshowHeight;
+        var translatePercentage = 100 - vsBottom2WinTop * 100 / heightToCoverWithTranslation;
+        this.parallaxData.translation = 50 - translatePercentage / 2;
+      }
+    },
     onResize: function onResize() {
-      var breakpoint = this.getCurrentBreakpoint();
-      if (this.hasBreakpointChanged(breakpoint)) {
-        this.setBreakpointConfig(breakpoint);
+      if (this.breakpointsData.list.length) {
+        var breakpoint = this.getCurrentBreakpoint();
+        if (this.hasBreakpointChanged(breakpoint)) {
+          this.setBreakpointConfig(breakpoint);
+        }
       }
+
+      if (this.parallax) {
+        // Only refresh parallaxData.slideshowOffsetTop value on resize for better performance.
+        this.getSlideshowOffsetTop(true);
+      }
     },
@@ -372,3 +435,3 @@ onMouseIn: function onMouseIn() {
           this.touch.dragAmount = this.getDragAmount(e);
-          var dragAmountPercentage = this.touch.dragAmount / this.$refs.vueperslides.clientWidth;
+          var dragAmountPercentage = this.touch.dragAmount / this.container.clientWidth;
 
@@ -390,3 +453,3 @@ this.currentTranslation = -100 * (this.slides.current + (this.clones.length ? 1 : 0) - dragAmountPercentage);
           var dragAmount = this.touch.dragAmount;
-          var dragAmountPercentage = dragAmount / this.$refs.vueperslides.clientWidth;
+          var dragAmountPercentage = dragAmount / this.container.clientWidth;
 
@@ -434,4 +497,3 @@ slideOnDragEnd = this.slides.current;
 
-      var vueperslidesWrapper = this.$refs.vueperslides;
-      return (dragStartX - vueperslidesWrapper.offsetLeft) / vueperslidesWrapper.clientWidth;
+      return (dragStartX - this.container.offsetLeft) / this.container.clientWidth;
     },
@@ -438,0 +500,0 @@

dist/vueperslides.min.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t(e.VueperSlides=e.VueperSlides||{})}(this,function(e){"use strict";var t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var s=arguments[t];for(var i in s)Object.prototype.hasOwnProperty.call(s,i)&&(e[i]=s[i])}return e};!function(){if("undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style");t.type="text/css",t.styleSheet?t.styleSheet.cssText="":t.appendChild(document.createTextNode("")),e.appendChild(t)}}();var s={render:function(){var e=this,t=e.$createElement,s=e._self._c||t;return s("div",{class:{vueperslides__slide:!0,"vueperslides__slide--active":e.$parent.slides.activeUid===e._uid},style:e.styles},[e.$parent.conf.slideContentOutside||!e.title&&!e.content?e._e():s("div",{staticClass:"vueperslides__slide-content"},[s("p",{staticClass:"slide-title",domProps:{innerHTML:e._s(e.title)}}),s("p",{staticClass:"slide-content",domProps:{innerHTML:e._s(e.content)}})])])},staticRenderFns:[],props:{clone:{type:Number,default:null},image:{type:String,default:""},title:{type:String,default:""},content:{type:String,default:""}},created:function(){this.$parent.addSlide({_uid:this._uid,image:this.image,title:this.title,content:this.content,clone:this.clone})},destroyed:function(){null===this.clone&&this.$parent.removeSlide(this._uid)},computed:{styles:function(){return t({},this.image&&{backgroundImage:"url("+this.image+")"})}}},i=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var s=arguments[t];for(var i in s)Object.prototype.hasOwnProperty.call(s,i)&&(e[i]=s[i])}return e};function n(e){if(Array.isArray(e)){for(var t=0,s=Array(e.length);t<e.length;t++)s[t]=e[t];return s}return Array.from(e)}!function(){if("undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style"),s='.vueperslides { position: relative; } .vueperslides__inner { position: relative; padding-bottom: 33.33%; } .vueperslides__track-wrapper { position: absolute; top: 0; bottom: 0; left: 0; right: 0; overflow: hidden; z-index: 1; } .vueperslides__track-wrapper::before, .vueperslides__track-wrapper::after { content: ""; position: absolute; bottom: 100%; left: -1em; right: -1em; height: 2em; box-shadow: 0 0 20px rgba(0, 0, 0, 0.25); z-index: 2; } .vueperslides__track-wrapper::after { top: 100%; bottom: auto; } .vueperslides--fade .vueperslides__track { white-space: normal; transition: none; } .vueperslides--touchable .vueperslides__track { cursor: ew-resize; cursor: -webkit-grab; cursor: grab; } .vueperslides--touchable .vueperslides__track--mousedown, .vueperslides--touchable .vueperslides__track--dragging { cursor: -webkit-grabbing; cursor: grabbing; } .vueperslides__track { white-space: nowrap; transition: 0.5s ease-in-out transform; height: 100%; } .vueperslides__track--mousedown { transition: 0.2s ease-in-out transform; } .vueperslides__track--dragging { transition: none; } .vueperslides__track--no-animation { transition-duration: 0s; } .vueperslides__slide { white-space: normal; background-position: top; background-size: cover; display: inline-block; width: 100%; height: 100%; } .vueperslides__slide-content { user-select: none; } .vueperslides__slide-content--outside { user-select: initial; } .vueperslides--fade .vueperslides__slide { position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; transition: .8s ease-in-out opacity; } .vueperslides--fade .vueperslides__slide--active { z-index: 1; opacity: 1; } .vueperslides__arrow { position: absolute; top: 50%; background-color: transparent; border: none; color: #fff; fill: currentColor; font-size: 3em; width: 1em; text-align: center; transform: translateY(-50%); opacity: 0.7; transition: 0.3s ease-in-out; cursor: pointer; user-select: none; outline: none; z-index: 2; } .vueperslides__arrow--prev { left: 10px; } .vueperslides__arrow--next { right: 10px; } .vueperslides__arrow:hover { opacity: 1; } .vueperslides__paused { position: absolute; top: 3%; right: 3%; opacity: 0; transition: 0.3s ease-in-out; text-shadow: 0 0 3px rgba(0, 0, 0, 0.4); z-index: 1; } .vueperslides:hover .vueperslides__paused { opacity: 1; } .vueperslides__bullets { display: flex; justify-content: center; position: absolute; bottom: 0; left: 0; right: 0; } .vueperslides__bullets--outside { position: relative; } .vueperslides__bullet { width: 12px; height: 12px; border-radius: 12px; border: 1px solid #fff; background-color: transparent; box-shadow: 0 0 1px rgba(0, 0, 0, 0.5), 0 0 3px rgba(0, 0, 0, 0.3); margin: 1.5em 0.6em; padding: 0; display: inline-block; cursor: pointer; user-select: none; outline: none; z-index: 2; display: flex; justify-content: center; align-items: center; } .vueperslides__bullet--active { background-color: #fff; } .vueperslides__bullet::-moz-focus-inner { border: 0; } .vueperslides__bullet span { display: none; } ';t.type="text/css",t.styleSheet?t.styleSheet.cssText=s:t.appendChild(document.createTextNode(s)),e.appendChild(t)}}();var o={render:function(){var e=this,t=e.$createElement,s=e._self._c||t;return s("div",{ref:"vueperslides",staticClass:"vueperslides",class:{"vueperslides--ready":e.isReady,"vueperslides--fade":e.conf.fade,"vueperslides--touchable":e.touch.enabled&&!e.disable}},[e.conf.slideContentOutside?s("div",{staticClass:"vueperslides__slide-content vueperslides__slide-content--outside",class:e.conf.slideContentOutsideClass},[e.slides.count&&e.slides.list[e.slides.current].title?s("p",{staticClass:"slide-title",domProps:{innerHTML:e._s(e.slides.list[e.slides.current].title)}}):e._e(),e.slides.count&&e.slides.list[e.slides.current].content?s("p",{staticClass:"slide-content",domProps:{innerHTML:e._s(e.slides.list[e.slides.current].content)}}):e._e()]):e._e(),s("div",{staticClass:"vueperslides__inner",style:"padding-bottom:"+100*this.conf.slideRatio+"%"},[s("div",{staticClass:"vueperslides__track-wrapper"},[s("div",{ref:"track",staticClass:"vueperslides__track",class:{"vueperslides__track--dragging":e.touch.dragging,"vueperslides__track--mousedown":e.mouseDown},style:e.conf.fade?"":"transform: translate3d("+e.currentTranslation+"%, 0, 0)"},[e.slides.count&&e.clones[0]?s("vueper-slide",{staticClass:"vueperslides__slide--clone",style:e.clones[0].style,attrs:{clone:0,title:e.clones[0].title,content:e.clones[0].content,image:e.clones[0].image}}):e._e(),e._t("default",null,{currentSlide:e.slides.current}),e.slides.count&&e.clones[1]?s("vueper-slide",{staticClass:"vueperslides__slide--clone",style:e.clones[1].style,attrs:{clone:1,title:e.clones[1].title,content:e.clones[1].content,image:e.clones[1].image}}):e._e()],2)]),e.$slots.pausedIcon?s("div",{staticClass:"vueperslides__paused"},[e._t("pausedIcon")],2):e._e(),e.conf.arrows&&e.slides.count>1&&!e.disable?s("div",{staticClass:"vueperslides__arrows"},[s("button",{directives:[{name:"show",rawName:"v-show",value:!e.arrowPrevDisabled,expression:"!arrowPrevDisabled"}],staticClass:"vueperslides__arrow vueperslides__arrow--prev",on:{click:function(t){e.onArrowClick(!1)}}},[e._t("arrowLeft",[s("svg",{attrs:{viewBox:"0 0 24 24"}},[s("path",{attrs:{d:"M16.2,21c0.3,0,0.5-0.1,0.7-0.3c0.4-0.4,0.4-1,0-1.4L9.6,12L17,4.7c0.4-0.4,0.4-1,0-1.4c-0.4-0.4-1-0.4-1.4,0L6.8,12l8.8,8.7C15.7,20.9,16,21,16.2,21z"}})])])],2),s("button",{directives:[{name:"show",rawName:"v-show",value:!e.arrowNextDisabled,expression:"!arrowNextDisabled"}],staticClass:"vueperslides__arrow vueperslides__arrow--next",on:{click:function(t){e.onArrowClick()}}},[e._t("arrowRight",[s("svg",{attrs:{viewBox:"0 0 24 24"}},[s("path",{attrs:{d:"M7.8,21c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l7.4-7.3L7,4.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l8.8,8.7l-8.8,8.7C8.3,20.9,8,21,7.8,21z"}})])])],2)]):e._e()]),e.conf.bullets&&e.slides.count>1&&!e.disable?s("div",{staticClass:"vueperslides__bullets",class:{"vueperslides__bullets--outside":e.conf.bulletsOutside}},e._l(e.slides.list,function(t,i){return s("button",{key:i,ref:"bullet",refInFor:!0,staticClass:"vueperslides__bullet",class:{"vueperslides__bullet--active":e.slides.current===i},on:{click:function(t){e.goToSlide(i)},keyup:[function(t){return"button"in t||!e._k(t.keyCode,"left",37,t.key,["Left","ArrowLeft"])?"button"in t&&0!==t.button?null:void e.onArrowClick(!1):null},function(t){return"button"in t||!e._k(t.keyCode,"right",39,t.key,["Right","ArrowRight"])?"button"in t&&2!==t.button?null:void e.onArrowClick():null}]}},[s("span",[e._v(e._s(i+1))])])})):e._e()])},staticRenderFns:[],name:"vueper-slides",components:{VueperSlide:s},props:{initSlide:{type:Number,default:1},slideRatio:{type:Number,default:1/3},arrows:{type:Boolean,default:!0},disableArrowsOnEdges:{type:[Boolean,String],default:!1},bullets:{type:Boolean,default:!0},bulletsOutside:{type:Boolean,default:!1},fade:{type:Boolean,default:!1},slideContentOutside:{type:Boolean,default:!1},slideContentOutsideClass:{type:String,default:""},autoplay:{type:Boolean,default:!1},speed:{type:[Number,String],default:4e3},pauseOnHover:{type:Boolean,default:!0},infinite:{type:Boolean,default:!0},touchable:{type:Boolean,default:!0},draggingDistance:{type:Number,default:null},disable:{type:Boolean,default:!1},breakpoints:{type:Object,default:function(){return{}}}},data:function(){return{isReady:!1,slides:{list:[],count:0,activeUid:null,current:0,clones:[]},clones:[],mouseDown:!1,mouseOver:!1,touch:{enabled:!0,dragging:!1,dragStartX:0,dragAmount:0,goNext:!0},currentTranslation:0,timer:null,arrowPrevDisabled:!1,arrowNextDisabled:!1,breakpointsData:{list:[],current:null},conf:null}},created:function(){this.conf=i({},this.$props),delete this.conf.breakpoints},mounted:function(){this.init()},methods:{init:function(){this.emit("before-init",!1),this.slides.count=this.slides.list.length,Object.keys(this.breakpoints).length&&(this.setBreakpointsList(),this.setBreakpointConfig(this.getCurrentBreakpoint())),this.touch.enabled=this.conf.touchable,this.conf.infinite&&!this.conf.fade&&this.cloneSlides(),this.goToSlide(this.conf.initSlide-1),this.bindEvents(),this.isReady=!0,this.emit("ready")},emit:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],s=arguments.length>2&&void 0!==arguments[2]&&arguments[2],i=[e];if((t||"number"==typeof s)&&(i[1]={},t&&this.slides.activeUid&&(i[1].currentSlide={index:this.slides.current,title:this.slides.list[this.slides.current].title,content:this.slides.list[this.slides.current].content}),"number"==typeof s)){var n=this.getSlideInRange(s).nextSlide;i[1].nextSlide={index:n,title:this.slides.list[n].title,content:this.slides.list[n].content}}this.$emit.apply(this,[e].concat(i))},setBreakpointsList:function(){this.breakpointsData.list=[99999].concat(n(Object.keys(this.breakpoints))).sort(function(e,t){return parseInt(e)<parseInt(t)})},getCurrentBreakpoint:function(){var e=window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth,t=[e].concat(n(this.breakpointsData.list)).sort(function(e,t){return parseInt(e)<parseInt(t)});return this.breakpointsData.list[t.indexOf(e)-1]},hasBreakpointChanged:function(e){return this.breakpointsData.current!==e},setBreakpointConfig:function(e){this.breakpointsData.current=e,this.conf=i({},this.$props,this.$props.breakpoints[e]||{})},cloneSlides:function(){var e=this.$slots.default[0].tag,t=this.$slots.default[e?0:1].elm,s=this.$slots.default[this.$slots.default.length-1].elm;this.clones[0]={title:this.slides.list[this.slides.count-1].title,content:this.slides.list[this.slides.count-1].content,image:this.slides.list[this.slides.count-1].image,style:s&&s.attributes.style?s.attributes.style.value:""},this.clones[1]={title:this.slides.list[0].title,content:this.slides.list[0].content,image:this.slides.list[0].image,style:t&&s.attributes.style?t.attributes.style.value:""}},bindEvents:function(){var e="ontouchstart"in window;this.touch.enabled&&(this.$refs.track.addEventListener(e?"touchstart":"mousedown",this.onMouseDown),document.addEventListener(e?"touchmove":"mousemove",this.onMouseMove),document.addEventListener(e?"touchend":"mouseup",this.onMouseUp)),this.conf.pauseOnHover&&!e&&this.conf.autoplay&&(this.$refs.vueperslides.addEventListener("mouseover",this.onMouseIn),this.$refs.vueperslides.addEventListener("mouseout",this.onMouseOut)),this.breakpointsData.list.length&&window.addEventListener("resize",this.onResize)},onResize:function(){var e=this.getCurrentBreakpoint();this.hasBreakpointChanged(e)&&this.setBreakpointConfig(e)},onMouseIn:function(){this.mouseOver=!0,this.conf.pauseOnHover&&this.conf.autoplay&&this.clearTimer()},onMouseOut:function(){this.mouseOver=!1,this.conf.pauseOnHover&&this.conf.autoplay&&this.setTimer()},onMouseDown:function(e){if(this.touch.enabled&&!this.disable)if(e.touches||e.preventDefault(),this.mouseDown=!0,this.draggingDistance)this.touch.dragStartX="ontouchstart"in window?e.touches[0].clientX:e.clientX;else{var t=this.getDragPercentage(e);this.touch.goNext=t>=.5,this.currentTranslation=-100*(this.slides.current+(this.touch.goNext?1:0)+(this.clones.length?1:0)-t)}},onMouseMove:function(e){if(this.mouseDown||this.touch.dragging)if(this.mouseDown=!1,this.touch.dragging=!0,this.draggingDistance){this.touch.dragAmount=this.getDragAmount(e);var t=this.touch.dragAmount/this.$refs.vueperslides.clientWidth;this.currentTranslation=-100*(this.slides.current+(this.clones.length?1:0)-t)}else{var s=this.getDragPercentage(e);this.currentTranslation=-100*(this.slides.current+(this.touch.goNext?1:0)+(this.clones.length?1:0)-s)}},onMouseUp:function(e){if(this.mouseDown||this.touch.dragging){this.mouseDown=!1,this.touch.dragging=!1;var t=void 0;if(this.draggingDistance){var s=this.touch.dragAmount;this.$refs.vueperslides.clientWidth;t=this.slides.current,Math.abs(s)>=this.draggingDistance&&(t+=s>0?-1:1)}else t=-(Math.round(this.currentTranslation/100)+(this.clones.length?1:0));var i=this.getSlideInRange(t).nextSlide;this.arrowNextDisabled&&this.conf.autoplay&&0===i&&(i=this.slides.count-1),i!==this.slides.current?this.goToSlide(t):this.currentTranslation=100*-(this.slides.current+(this.clones.length?1:0)),this.touch.dragStartX=null,this.touch.dragAmount=null,this.enableScroll()}},getDragPercentage:function(e){var t="ontouchstart"in window?e.touches[0].clientX:e.clientX,s=this.$refs.vueperslides;return(t-s.offsetLeft)/s.clientWidth},getDragAmount:function(e){return("ontouchstart"in window?e.touches[0].clientX:e.clientX)-this.touch.dragStartX},disableScroll:function(){document.ontouchmove=function(e){e.preventDefault()}},enableScroll:function(){document.ontouchmove=function(){return!0}},clearTimer:function(){clearTimeout(this.timer),this.timer=0},setTimer:function(){var e=this;this.timer=setTimeout(function(){e.goToSlide(e.slides.current+1,!0,!0)},this.conf.speed)},onArrowClick:function(){var e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0];this.goToSlide(this.slides.current+(e?1:-1))},getSlideInRange:function(e){var t=null;return this.clones.length?e<0?(e=this.slides.count-1,t=0):e>this.slides.count-1&&(e=0,t=1):e<0?e=this.conf.disableArrowsOnEdges?0:this.slides.count-1:e>this.slides.count-1&&(e=this.conf.disableArrowsOnEdges?this.conf.autoplay?0:this.slides.count-1:0),{nextSlide:e,clone:t}},goToSlide:function(e){var t=this,s=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],i=arguments.length>2&&void 0!==arguments[2]&&arguments[2];if(this.slides.count&&!this.disable){this.conf.autoplay&&this.clearTimer();var n=this.getSlideInRange(e),o=n.nextSlide,r=n.clone;this.isReady&&this.emit("before-slide",!0,o),this.conf.arrows&&this.conf.disableArrowsOnEdges&&(this.arrowPrevDisabled=0===o,this.arrowNextDisabled=o===this.slides.count-1),this.$refs.track.classList[s?"remove":"add"]("vueperslides__track--no-animation"),null!==r&&setTimeout(function(){t.goToSlide(r?0:t.slides.count-1,!1,i)},400),this.slides.current=o,this.conf.fade||(this.currentTranslation=null!==r?-100*(r?this.slides.count+1:0):-100*(this.slides.current+(this.clones.length?1:0))),this.slides.activeUid=this.slides.list[this.slides.current]._uid,this.conf.autoplay&&!this.mouseOver&&this.setTimer(),this.slides.count&&(this.$slots.default[this.slides.current]&&this.isReady&&this.emit("slide"),this.isReady&&!i&&this.$refs.bullet[this.slides.current]&&this.$refs.bullet[this.slides.current].focus())}},addSlide:function(e){var t=this,s=this.conf.infinite&&!this.conf.fade&&this.isReady&&!e.clone;null!==e.clone?this.clones[e.clone]=e:(this.slides.list.push(e),this.slides.count=this.slides.list.length),this.slides.count>1&&this.touchable&&(this.touch.enabled=!0),s&&this.$nextTick(function(){return t.cloneSlides()})},removeSlide:function(e){var t=this,s=!1;this.slides.list.some(function(i,n){if(i._uid===e)return t.slides.list.splice(n,1),t.slides.count=t.slides.list.length,e===t.slides.activeUid&&(t.slides.activeUid=null,t.goToSlide(n-1,!0,!0)),t.slides.count<=1&&(t.touch.enabled=!1),t.clones.length&&t.isReady&&!i.clone&&(s=!0),!0}),this.slides.count&&s&&this.cloneSlides()}}};"undefined"!=typeof window&&window.Vue&&(window.Vue.component("vueper-slides",o),window.Vue.component("vueper-slide",s)),e.VueperSlides=o,e.VueperSlide=s,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t(e.VueperSlides=e.VueperSlides||{})}(this,function(e){"use strict";var t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var s=arguments[t];for(var i in s)Object.prototype.hasOwnProperty.call(s,i)&&(e[i]=s[i])}return e};!function(){if("undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style");t.type="text/css",t.styleSheet?t.styleSheet.cssText="":t.appendChild(document.createTextNode("")),e.appendChild(t)}}();var s={render:function(){var e=this,t=e.$createElement,s=e._self._c||t;return s("div",{class:{vueperslides__slide:!0,"vueperslides__slide--active":e.$parent.slides.activeUid===e._uid},style:e.styles},[e.$parent.conf.slideContentOutside||!e.title&&!e.content?e._e():s("div",{staticClass:"vueperslides__slide-content"},[s("p",{staticClass:"slide-title",domProps:{innerHTML:e._s(e.title)}}),s("p",{staticClass:"slide-content",domProps:{innerHTML:e._s(e.content)}})])])},staticRenderFns:[],props:{clone:{type:Number,default:null},image:{type:String,default:""},title:{type:String,default:""},content:{type:String,default:""}},created:function(){this.$parent.addSlide({_uid:this._uid,image:this.image,title:this.title,content:this.content,clone:this.clone})},destroyed:function(){null===this.clone&&this.$parent.removeSlide(this._uid)},computed:{styles:function(){return t({},this.image&&{backgroundImage:"url("+this.image+")"})}}},i=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var s=arguments[t];for(var i in s)Object.prototype.hasOwnProperty.call(s,i)&&(e[i]=s[i])}return e};function n(e){if(Array.isArray(e)){for(var t=0,s=Array(e.length);t<e.length;t++)s[t]=e[t];return s}return Array.from(e)}!function(){if("undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style"),s='.vueperslides { position: relative; } .vueperslides__inner { position: relative; } .vueperslides__parallax-wrapper { position: relative; padding-bottom: 33.33%; overflow: hidden; } .vueperslides__parallax-wrapper::before, .vueperslides__parallax-wrapper::after { content: ""; position: absolute; bottom: 100%; left: -1em; right: -1em; height: 2em; box-shadow: 0 0 20px rgba(0, 0, 0, 0.25); z-index: 2; } .vueperslides__parallax-wrapper::after { top: 100%; bottom: auto; } .vueperslides__track-wrapper { position: absolute; top: 0; height: 100%; left: 0; right: 0; overflow: hidden; z-index: 1; } .vueperslides--parallax .vueperslides__track-wrapper { height: 200%; transform: translateY(0); } .vueperslides--fade .vueperslides__track { white-space: normal; transition: none; } .vueperslides--touchable .vueperslides__track { cursor: ew-resize; cursor: -webkit-grab; cursor: grab; } .vueperslides--touchable .vueperslides__track--mousedown, .vueperslides--touchable .vueperslides__track--dragging { cursor: -webkit-grabbing; cursor: grabbing; } .vueperslides__track { white-space: nowrap; transition: 0.5s ease-in-out transform; height: 100%; } .vueperslides__track--mousedown { transition: 0.2s ease-in-out transform; } .vueperslides__track--dragging { transition: none; } .vueperslides__track--no-animation { transition-duration: 0s; } .vueperslides__slide { white-space: normal; background-position: top; background-size: cover; display: inline-block; width: 100%; height: 100%; } .vueperslides__slide-content { user-select: none; } .vueperslides__slide-content--outside { user-select: initial; } .vueperslides--fade .vueperslides__slide { position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; transition: .8s ease-in-out opacity; } .vueperslides--fade .vueperslides__slide--active { z-index: 1; opacity: 1; } .vueperslides__arrow { position: absolute; top: 50%; background-color: transparent; border: none; color: #fff; fill: currentColor; font-size: 3em; width: 1em; text-align: center; transform: translateY(-50%); opacity: 0.7; transition: 0.3s ease-in-out; cursor: pointer; user-select: none; outline: none; z-index: 2; } .vueperslides__arrow--prev { left: 10px; } .vueperslides__arrow--next { right: 10px; } .vueperslides__arrow:hover { opacity: 1; } .vueperslides__paused { position: absolute; top: 3%; right: 3%; opacity: 0; transition: 0.3s ease-in-out; text-shadow: 0 0 3px rgba(0, 0, 0, 0.4); z-index: 1; } .vueperslides:hover .vueperslides__paused { opacity: 1; } .vueperslides__bullets { display: flex; justify-content: center; position: absolute; bottom: 0; left: 0; right: 0; } .vueperslides__bullets--outside { position: relative; } .vueperslides__bullet { width: 12px; height: 12px; border-radius: 12px; border: 1px solid #fff; background-color: transparent; box-shadow: 0 0 1px rgba(0, 0, 0, 0.5), 0 0 3px rgba(0, 0, 0, 0.3); margin: 1.5em 0.6em; padding: 0; display: inline-block; cursor: pointer; user-select: none; outline: none; z-index: 2; display: flex; justify-content: center; align-items: center; } .vueperslides__bullet--active { background-color: #fff; } .vueperslides__bullet::-moz-focus-inner { border: 0; } .vueperslides__bullet span { display: none; } ';t.type="text/css",t.styleSheet?t.styleSheet.cssText=s:t.appendChild(document.createTextNode(s)),e.appendChild(t)}}();var o={render:function(){var e=this,t=e.$createElement,s=e._self._c||t;return s("div",{ref:"vueperslides",staticClass:"vueperslides",class:{"vueperslides--ready":e.isReady,"vueperslides--fade":e.conf.fade,"vueperslides--parallax":e.conf.parallax,"vueperslides--touchable":e.touch.enabled&&!e.disable}},[e.conf.slideContentOutside?s("div",{staticClass:"vueperslides__slide-content vueperslides__slide-content--outside",class:e.conf.slideContentOutsideClass},[e.slides.count&&e.slides.list[e.slides.current].title?s("p",{staticClass:"slide-title",domProps:{innerHTML:e._s(e.slides.list[e.slides.current].title)}}):e._e(),e.slides.count&&e.slides.list[e.slides.current].content?s("p",{staticClass:"slide-content",domProps:{innerHTML:e._s(e.slides.list[e.slides.current].content)}}):e._e()]):e._e(),s("div",{staticClass:"vueperslides__inner"},[s("div",{staticClass:"vueperslides__parallax-wrapper",style:"padding-bottom:"+100*this.conf.slideRatio+"%"},[s("div",{staticClass:"vueperslides__track-wrapper",style:e.conf.parallax?"transform: translateY(-"+e.parallaxData.translation+"%)":""},[s("div",{ref:"track",staticClass:"vueperslides__track",class:{"vueperslides__track--dragging":e.touch.dragging,"vueperslides__track--mousedown":e.mouseDown},style:e.conf.fade?"":"transform: translate3d("+e.currentTranslation+"%, 0, 0)"},[e.slides.count&&e.clones[0]?s("vueper-slide",{staticClass:"vueperslides__slide--clone",style:e.clones[0].style,attrs:{clone:0,title:e.clones[0].title,content:e.clones[0].content,image:e.clones[0].image}}):e._e(),e._t("default",null,{currentSlide:e.slides.current}),e.slides.count&&e.clones[1]?s("vueper-slide",{staticClass:"vueperslides__slide--clone",style:e.clones[1].style,attrs:{clone:1,title:e.clones[1].title,content:e.clones[1].content,image:e.clones[1].image}}):e._e()],2)])]),e.$slots.pausedIcon?s("div",{staticClass:"vueperslides__paused"},[e._t("pausedIcon")],2):e._e(),e.conf.arrows&&e.slides.count>1&&!e.disable?s("div",{staticClass:"vueperslides__arrows"},[s("button",{directives:[{name:"show",rawName:"v-show",value:!e.arrowPrevDisabled,expression:"!arrowPrevDisabled"}],staticClass:"vueperslides__arrow vueperslides__arrow--prev",on:{click:function(t){e.onArrowClick(!1)}}},[e._t("arrowLeft",[s("svg",{attrs:{viewBox:"0 0 24 24"}},[s("path",{attrs:{d:"M16.2,21c0.3,0,0.5-0.1,0.7-0.3c0.4-0.4,0.4-1,0-1.4L9.6,12L17,4.7c0.4-0.4,0.4-1,0-1.4c-0.4-0.4-1-0.4-1.4,0L6.8,12l8.8,8.7C15.7,20.9,16,21,16.2,21z"}})])])],2),s("button",{directives:[{name:"show",rawName:"v-show",value:!e.arrowNextDisabled,expression:"!arrowNextDisabled"}],staticClass:"vueperslides__arrow vueperslides__arrow--next",on:{click:function(t){e.onArrowClick()}}},[e._t("arrowRight",[s("svg",{attrs:{viewBox:"0 0 24 24"}},[s("path",{attrs:{d:"M7.8,21c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l7.4-7.3L7,4.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l8.8,8.7l-8.8,8.7C8.3,20.9,8,21,7.8,21z"}})])])],2)]):e._e()]),e.conf.bullets&&e.slides.count>1&&!e.disable?s("div",{staticClass:"vueperslides__bullets",class:{"vueperslides__bullets--outside":e.conf.bulletsOutside}},e._l(e.slides.list,function(t,i){return s("button",{key:i,ref:"bullet",refInFor:!0,staticClass:"vueperslides__bullet",class:{"vueperslides__bullet--active":e.slides.current===i},on:{click:function(t){e.goToSlide(i)},keyup:[function(t){return"button"in t||!e._k(t.keyCode,"left",37,t.key,["Left","ArrowLeft"])?"button"in t&&0!==t.button?null:void e.onArrowClick(!1):null},function(t){return"button"in t||!e._k(t.keyCode,"right",39,t.key,["Right","ArrowRight"])?"button"in t&&2!==t.button?null:void e.onArrowClick():null}]}},[s("span",[e._v(e._s(i+1))])])})):e._e()])},staticRenderFns:[],name:"vueper-slides",components:{VueperSlide:s},props:{initSlide:{type:Number,default:1},slideRatio:{type:Number,default:1/3},arrows:{type:Boolean,default:!0},disableArrowsOnEdges:{type:[Boolean,String],default:!1},bullets:{type:Boolean,default:!0},bulletsOutside:{type:Boolean,default:!1},fade:{type:Boolean,default:!1},slideContentOutside:{type:Boolean,default:!1},slideContentOutsideClass:{type:String,default:""},autoplay:{type:Boolean,default:!1},speed:{type:[Number,String],default:4e3},pauseOnHover:{type:Boolean,default:!0},infinite:{type:Boolean,default:!0},parallax:{type:Boolean,default:!1},touchable:{type:Boolean,default:!0},draggingDistance:{type:Number,default:null},disable:{type:Boolean,default:!1},breakpoints:{type:Object,default:function(){return{}}}},data:function(){return{isReady:!1,container:null,slides:{list:[],count:0,activeUid:null,current:0,clones:[]},clones:[],mouseDown:!1,mouseOver:!1,touch:{enabled:!0,dragging:!1,dragStartX:0,dragAmount:0,goNext:!0},currentTranslation:0,timer:null,arrowPrevDisabled:!1,arrowNextDisabled:!1,breakpointsData:{list:[],current:null},parallaxData:{translation:0,slideshowOffsetTop:null},conf:null}},created:function(){this.conf=i({},this.$props),delete this.conf.breakpoints},mounted:function(){this.init()},methods:{init:function(){this.emit("before-init",!1),this.slides.count=this.slides.list.length,this.container=this.$refs.vueperslides,Object.keys(this.breakpoints).length&&(this.setBreakpointsList(),this.setBreakpointConfig(this.getCurrentBreakpoint())),this.touch.enabled=this.conf.touchable,this.conf.infinite&&!this.conf.fade&&this.cloneSlides(),this.goToSlide(this.conf.initSlide-1),this.bindEvents(),this.isReady=!0,this.emit("ready")},emit:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],s=arguments.length>2&&void 0!==arguments[2]&&arguments[2],i=[e];if((t||"number"==typeof s)&&(i[1]={},t&&this.slides.activeUid&&(i[1].currentSlide={index:this.slides.current,title:this.slides.list[this.slides.current].title,content:this.slides.list[this.slides.current].content}),"number"==typeof s)){var n=this.getSlideInRange(s).nextSlide;i[1].nextSlide={index:n,title:this.slides.list[n].title,content:this.slides.list[n].content}}this.$emit.apply(this,[e].concat(i))},setBreakpointsList:function(){this.breakpointsData.list=[99999].concat(n(Object.keys(this.breakpoints))).sort(function(e,t){return parseInt(e)<parseInt(t)})},getCurrentBreakpoint:function(){var e=window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth,t=[e].concat(n(this.breakpointsData.list)).sort(function(e,t){return parseInt(e)<parseInt(t)});return this.breakpointsData.list[t.indexOf(e)-1]},hasBreakpointChanged:function(e){return this.breakpointsData.current!==e},setBreakpointConfig:function(e){this.breakpointsData.current=e,this.conf=i({},this.$props,this.$props.breakpoints[e]||{})},cloneSlides:function(){var e=this.$slots.default[0].tag,t=this.$slots.default[e?0:1].elm,s=this.$slots.default[this.$slots.default.length-1].elm;this.clones[0]={title:this.slides.list[this.slides.count-1].title,content:this.slides.list[this.slides.count-1].content,image:this.slides.list[this.slides.count-1].image,style:s&&s.attributes.style?s.attributes.style.value:""},this.clones[1]={title:this.slides.list[0].title,content:this.slides.list[0].content,image:this.slides.list[0].image,style:t&&s.attributes.style?t.attributes.style.value:""}},bindEvents:function(){var e="ontouchstart"in window;this.touch.enabled&&(this.$refs.track.addEventListener(e?"touchstart":"mousedown",this.onMouseDown),document.addEventListener(e?"touchmove":"mousemove",this.onMouseMove),document.addEventListener(e?"touchend":"mouseup",this.onMouseUp)),this.conf.pauseOnHover&&!e&&this.conf.autoplay&&(this.container.addEventListener("mouseover",this.onMouseIn),this.container.addEventListener("mouseout",this.onMouseOut)),(this.breakpointsData.list.length||this.parallax)&&window.addEventListener("resize",this.onResize),this.parallax&&document.addEventListener("scroll",this.onScroll)},getSlideshowOffsetTop:function(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0];if(null===this.parallaxData.slideshowOffsetTop||e){for(var t=this.container,s=t.offsetTop;t=t.offsetParent;)s+=t.offsetTop;this.parallaxData.slideshowOffsetTop=s}return this.parallaxData.slideshowOffsetTop},onScroll:function(e){var t=document.documentElement,s=(window.pageYOffset||t.scrollTop)-(t.clientTop||0),i=window.innerHeight||document.documentElement.clientHeight||document.body.clientHeight,n=this.container.clientHeight,o=this.getSlideshowOffsetTop(),l=o+n-s;if(l>0&&i+s-o>0){var r=100-100*l/(i+n);this.parallaxData.translation=50-r/2}},onResize:function(){if(this.breakpointsData.list.length){var e=this.getCurrentBreakpoint();this.hasBreakpointChanged(e)&&this.setBreakpointConfig(e)}this.parallax&&this.getSlideshowOffsetTop(!0)},onMouseIn:function(){this.mouseOver=!0,this.conf.pauseOnHover&&this.conf.autoplay&&this.clearTimer()},onMouseOut:function(){this.mouseOver=!1,this.conf.pauseOnHover&&this.conf.autoplay&&this.setTimer()},onMouseDown:function(e){if(this.touch.enabled&&!this.disable)if(e.touches||e.preventDefault(),this.mouseDown=!0,this.draggingDistance)this.touch.dragStartX="ontouchstart"in window?e.touches[0].clientX:e.clientX;else{var t=this.getDragPercentage(e);this.touch.goNext=t>=.5,this.currentTranslation=-100*(this.slides.current+(this.touch.goNext?1:0)+(this.clones.length?1:0)-t)}},onMouseMove:function(e){if(this.mouseDown||this.touch.dragging)if(this.mouseDown=!1,this.touch.dragging=!0,this.draggingDistance){this.touch.dragAmount=this.getDragAmount(e);var t=this.touch.dragAmount/this.container.clientWidth;this.currentTranslation=-100*(this.slides.current+(this.clones.length?1:0)-t)}else{var s=this.getDragPercentage(e);this.currentTranslation=-100*(this.slides.current+(this.touch.goNext?1:0)+(this.clones.length?1:0)-s)}},onMouseUp:function(e){if(this.mouseDown||this.touch.dragging){this.mouseDown=!1,this.touch.dragging=!1;var t=void 0;if(this.draggingDistance){var s=this.touch.dragAmount;this.container.clientWidth;t=this.slides.current,Math.abs(s)>=this.draggingDistance&&(t+=s>0?-1:1)}else t=-(Math.round(this.currentTranslation/100)+(this.clones.length?1:0));var i=this.getSlideInRange(t).nextSlide;this.arrowNextDisabled&&this.conf.autoplay&&0===i&&(i=this.slides.count-1),i!==this.slides.current?this.goToSlide(t):this.currentTranslation=100*-(this.slides.current+(this.clones.length?1:0)),this.touch.dragStartX=null,this.touch.dragAmount=null,this.enableScroll()}},getDragPercentage:function(e){return(("ontouchstart"in window?e.touches[0].clientX:e.clientX)-this.container.offsetLeft)/this.container.clientWidth},getDragAmount:function(e){return("ontouchstart"in window?e.touches[0].clientX:e.clientX)-this.touch.dragStartX},disableScroll:function(){document.ontouchmove=function(e){e.preventDefault()}},enableScroll:function(){document.ontouchmove=function(){return!0}},clearTimer:function(){clearTimeout(this.timer),this.timer=0},setTimer:function(){var e=this;this.timer=setTimeout(function(){e.goToSlide(e.slides.current+1,!0,!0)},this.conf.speed)},onArrowClick:function(){var e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0];this.goToSlide(this.slides.current+(e?1:-1))},getSlideInRange:function(e){var t=null;return this.clones.length?e<0?(e=this.slides.count-1,t=0):e>this.slides.count-1&&(e=0,t=1):e<0?e=this.conf.disableArrowsOnEdges?0:this.slides.count-1:e>this.slides.count-1&&(e=this.conf.disableArrowsOnEdges?this.conf.autoplay?0:this.slides.count-1:0),{nextSlide:e,clone:t}},goToSlide:function(e){var t=this,s=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],i=arguments.length>2&&void 0!==arguments[2]&&arguments[2];if(this.slides.count&&!this.disable){this.conf.autoplay&&this.clearTimer();var n=this.getSlideInRange(e),o=n.nextSlide,l=n.clone;this.isReady&&this.emit("before-slide",!0,o),this.conf.arrows&&this.conf.disableArrowsOnEdges&&(this.arrowPrevDisabled=0===o,this.arrowNextDisabled=o===this.slides.count-1),this.$refs.track.classList[s?"remove":"add"]("vueperslides__track--no-animation"),null!==l&&setTimeout(function(){t.goToSlide(l?0:t.slides.count-1,!1,i)},400),this.slides.current=o,this.conf.fade||(this.currentTranslation=null!==l?-100*(l?this.slides.count+1:0):-100*(this.slides.current+(this.clones.length?1:0))),this.slides.activeUid=this.slides.list[this.slides.current]._uid,this.conf.autoplay&&!this.mouseOver&&this.setTimer(),this.slides.count&&(this.$slots.default[this.slides.current]&&this.isReady&&this.emit("slide"),this.isReady&&!i&&this.$refs.bullet[this.slides.current]&&this.$refs.bullet[this.slides.current].focus())}},addSlide:function(e){var t=this,s=this.conf.infinite&&!this.conf.fade&&this.isReady&&!e.clone;null!==e.clone?this.clones[e.clone]=e:(this.slides.list.push(e),this.slides.count=this.slides.list.length),this.slides.count>1&&this.touchable&&(this.touch.enabled=!0),s&&this.$nextTick(function(){return t.cloneSlides()})},removeSlide:function(e){var t=this,s=!1;this.slides.list.some(function(i,n){if(i._uid===e)return t.slides.list.splice(n,1),t.slides.count=t.slides.list.length,e===t.slides.activeUid&&(t.slides.activeUid=null,t.goToSlide(n-1,!0,!0)),t.slides.count<=1&&(t.touch.enabled=!1),t.clones.length&&t.isReady&&!i.clone&&(s=!0),!0}),this.slides.count&&s&&this.cloneSlides()}}};"undefined"!=typeof window&&window.Vue&&(window.Vue.component("vueper-slides",o),window.Vue.component("vueper-slide",s)),e.VueperSlides=o,e.VueperSlide=s,Object.defineProperty(e,"__esModule",{value:!0})});
 //# sourceMappingURL=vueperslides.min.js.map

package.json

 {
   "name": "vueperslides",
-  "version": "1.2.1",
+  "version": "1.3.0",
   "description": "A touch ready & responsive slideshow for Vue JS.",
@@ -5,0 +5,0 @@ "repository": "https://github.com/antoniandre/vueper-slides",

No alert changes

Improved metrics

Total package byte prevSize

169871

increased by9.75%

Lines of code

693

increased by9.13%

No dependency changes