vueperslides - npm Package Compare versions

Comparing version 1.4.0 to 1.5.0

dist/vueperslides.js

@@ -89,3 +89,3 @@ (function (global, factory) {
         style = document.createElement('style'),
-        css = ".vueperslides { position: relative; } .vueperslides__inner { position: relative; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; } .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--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__arrows { color: #fff; } .vueperslides__arrows--outside { color: #000; } .vueperslides__arrow { position: absolute; top: 50%; background-color: transparent; border: none; 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__arrows--outside .vueperslides__arrow--prev { left: -40px; } .vueperslides__arrows--outside .vueperslides__arrow--next { right: -40px; } .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; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; } .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 !important; } .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--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__arrows { color: #fff; } .vueperslides__arrows--outside { color: #000; } .vueperslides__arrow { position: absolute; top: 50%; background-color: transparent; border: none; 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__arrows--outside .vueperslides__arrow--prev { left: -40px; } .vueperslides__arrows--outside .vueperslides__arrow--next { right: -40px; } .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;
@@ -99,7 +99,7 @@ } 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--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('div', { 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].titleSlot ? _c('div', { staticClass: "slide-title", domProps: { "innerHTML": _vm._s(_vm.slides.list[_vm.slides.current].titleSlot) } }) : _vm._e(), _vm.slides.count && _vm.slides.list[_vm.slides.current].content ? _c('div', { staticClass: "slide-content", domProps: { "innerHTML": _vm._s(_vm.slides.list[_vm.slides.current].content) } }) : _vm._e(), _vm.slides.count && _vm.slides.list[_vm.slides.current].contentSlot ? _c('div', { staticClass: "slide-content", domProps: { "innerHTML": _vm._s(_vm.slides.list[_vm.slides.current].contentSlot) } }) : _vm._e()]) : _vm._e(), _c('div', { staticClass: "vueperslides__inner" }, [_c('div', { staticClass: "vueperslides__parallax-wrapper", style: 'padding-bottom:' + _vm.conf.slideRatio * 100 + '%' }, [_c('div', { staticClass: "vueperslides__track-wrapper", style: _vm.trackWrapperStyles }, [_c('div', { ref: "track", staticClass: "vueperslides__track", class: { 'vueperslides__track--dragging': _vm.touch.dragging, 'vueperslides__track--mousedown': _vm.mouseDown }, style: !_vm.conf.fade ? 'transform: translateX(' + _vm.currentTranslation + '%)' : '' }, [_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.clones[0].titleSlot ? _c('div', { attrs: { "slot": "slideTitle" }, domProps: { "innerHTML": _vm._s(_vm.clones[0].titleSlot) }, slot: "slideTitle" }) : _vm._e(), _vm.clones[0].contentSlot ? _c('div', { attrs: { "slot": "slideContent" }, domProps: { "innerHTML": _vm._s(_vm.clones[0].contentSlot) }, slot: "slideContent" }) : _vm._e()]) : _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.clones[1].titleSlot ? _c('div', { attrs: { "slot": "slideTitle" }, domProps: { "innerHTML": _vm._s(_vm.clones[1].titleSlot) }, slot: "slideTitle" }) : _vm._e(), _vm.clones[1].contentSlot ? _c('div', { attrs: { "slot": "slideContent" }, domProps: { "innerHTML": _vm._s(_vm.clones[1].contentSlot) }, slot: "slideContent" }) : _vm._e()]) : _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", class: { 'vueperslides__arrows--outside': _vm.conf.arrowsOutside } }, [_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, 'vueperslides--animated': true } }, [_vm.conf.slideContentOutside === 'top' ? _c('div', { staticClass: "vueperslides__slide-content vueperslides__slide-content--outside-top", class: _vm.conf.slideContentOutsideClass }, [_vm.slides.count && _vm.slides.list[_vm.slides.current].title ? _c('div', { 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].titleSlot ? _c('div', { staticClass: "slide-title", domProps: { "innerHTML": _vm._s(_vm.slides.list[_vm.slides.current].titleSlot) } }) : _vm._e(), _vm.slides.count && _vm.slides.list[_vm.slides.current].content ? _c('div', { staticClass: "slide-content", domProps: { "innerHTML": _vm._s(_vm.slides.list[_vm.slides.current].content) } }) : _vm._e(), _vm.slides.count && _vm.slides.list[_vm.slides.current].contentSlot ? _c('div', { staticClass: "slide-content", domProps: { "innerHTML": _vm._s(_vm.slides.list[_vm.slides.current].contentSlot) } }) : _vm._e()]) : _vm._e(), _c('div', { staticClass: "vueperslides__inner" }, [_c('div', { staticClass: "vueperslides__parallax-wrapper", style: 'padding-bottom:' + _vm.conf.slideRatio * 100 + '%' }, [_c('div', { staticClass: "vueperslides__track-wrapper", style: _vm.trackWrapperStyles }, [_c('div', { ref: "track", staticClass: "vueperslides__track", class: { 'vueperslides__track--dragging': _vm.touch.dragging, 'vueperslides__track--mousedown': _vm.mouseDown }, style: _vm.trackStyles }, [_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.clones[0].titleSlot ? _c('div', { attrs: { "slot": "slideTitle" }, domProps: { "innerHTML": _vm._s(_vm.clones[0].titleSlot) }, slot: "slideTitle" }) : _vm._e(), _vm.clones[0].contentSlot ? _c('div', { attrs: { "slot": "slideContent" }, domProps: { "innerHTML": _vm._s(_vm.clones[0].contentSlot) }, slot: "slideContent" }) : _vm._e()]) : _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.clones[1].titleSlot ? _c('div', { attrs: { "slot": "slideTitle" }, domProps: { "innerHTML": _vm._s(_vm.clones[1].titleSlot) }, slot: "slideTitle" }) : _vm._e(), _vm.clones[1].contentSlot ? _c('div', { attrs: { "slot": "slideContent" }, domProps: { "innerHTML": _vm._s(_vm.clones[1].contentSlot) }, slot: "slideContent" }) : _vm._e()]) : _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", class: { 'vueperslides__arrows--outside': _vm.conf.arrowsOutside } }, [_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);
         } } }, [_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) {
           _vm.onArrowClick();
-        } } }, [_vm._t("arrowRight", [_c('svg', { attrs: { "viewBox": "0 0 24 24" } }, [_c('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)]) : _vm._e()]), _vm.conf.bullets && _vm.slides.count > 1 && !_vm.disable ? _c('div', { staticClass: "vueperslides__bullets", class: { 'vueperslides__bullets--outside': _vm.conf.bulletsOutside } }, _vm._l(_vm.slides.list, function (item, i) {
+        } } }, [_vm._t("arrowRight", [_c('svg', { attrs: { "viewBox": "0 0 24 24" } }, [_c('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)]) : _vm._e(), _vm.conf.bullets && _vm.slides.count > 1 && !_vm.disable && !_vm.conf.bulletsOutside ? _c('div', { staticClass: "vueperslides__bullets" }, _vm._l(_vm.slides.list, function (item, i) {
       return _c('button', { key: i, ref: "bullet", refInFor: true, staticClass: "vueperslides__bullet", class: { 'vueperslides__bullet--active': _vm.slides.current === i }, on: { "click": function click($event) {
@@ -120,3 +120,19 @@ _vm.goToSlide(i);
           }] } }, [_c('span', [_vm._v(_vm._s(i + 1))])]);
-    })) : _vm._e()]);
+    })) : _vm._e()]), _vm.conf.bullets && _vm.slides.count > 1 && !_vm.disable && _vm.conf.bulletsOutside ? _c('div', { staticClass: "vueperslides__bullets vueperslides__bullets--outside" }, _vm._l(_vm.slides.list, function (item, i) {
+      return _c('button', { key: i, ref: "bullet", refInFor: true, staticClass: "vueperslides__bullet", class: { 'vueperslides__bullet--active': _vm.slides.current === i }, on: { "click": function click($event) {
+            _vm.goToSlide(i);
+          }, "keyup": [function ($event) {
+            if (!('button' in $event) && _vm._k($event.keyCode, "left", 37, $event.key, ["Left", "ArrowLeft"])) {
+              return null;
+            }if ('button' in $event && $event.button !== 0) {
+              return null;
+            }_vm.onArrowClick(false);
+          }, function ($event) {
+            if (!('button' in $event) && _vm._k($event.keyCode, "right", 39, $event.key, ["Right", "ArrowRight"])) {
+              return null;
+            }if ('button' in $event && $event.button !== 2) {
+              return null;
+            }_vm.onArrowClick();
+          }] } }, [_c('span', [_vm._v(_vm._s(i + 1))])]);
+    })) : _vm._e(), _vm.conf.slideContentOutside === 'bottom' ? _c('div', { staticClass: "vueperslides__slide-content vueperslides__slide-content--outside-bottom", class: _vm.conf.slideContentOutsideClass }, [_vm.slides.count && _vm.slides.list[_vm.slides.current].title ? _c('div', { 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].titleSlot ? _c('div', { staticClass: "slide-title", domProps: { "innerHTML": _vm._s(_vm.slides.list[_vm.slides.current].titleSlot) } }) : _vm._e(), _vm.slides.count && _vm.slides.list[_vm.slides.current].content ? _c('div', { staticClass: "slide-content", domProps: { "innerHTML": _vm._s(_vm.slides.list[_vm.slides.current].content) } }) : _vm._e(), _vm.slides.count && _vm.slides.list[_vm.slides.current].contentSlot ? _c('div', { staticClass: "slide-content", domProps: { "innerHTML": _vm._s(_vm.slides.list[_vm.slides.current].contentSlot) } }) : _vm._e()]) : _vm._e()]);
   }, staticRenderFns: [],
@@ -160,3 +176,3 @@ name: 'vueper-slides',
     slideContentOutside: {
-      type: Boolean,
+      type: [Boolean, String],
       default: false
@@ -176,2 +192,6 @@ },
     },
+    transitionSpeed: {
+      type: [Number, String],
+      default: 600
+    },
     pauseOnHover: {
@@ -219,3 +239,3 @@ type: Boolean,
       touch: { enabled: true, dragging: false, dragStartX: 0, dragAmount: 0, goNext: true },
-      currentTranslation: 0,
+      transition: { currentTranslation: 0, speed: 0 },
       timer: null,
@@ -239,2 +259,3 @@ arrowPrevDisabled: false,
       this.touch.enabled = this.conf.touchable;
+      this.transition.speed = this.conf.transitionSpeed;
 
@@ -457,3 +478,3 @@ if (Object.keys(this.breakpoints).length) {
 
-        this.currentTranslation = -100 * (this.slides.current + (this.touch.goNext ? 1 : 0) + (this.clones.length ? 1 : 0) - dragPercentage);
+        this.transition.currentTranslation = -100 * (this.slides.current + (this.touch.goNext ? 1 : 0) + (this.clones.length ? 1 : 0) - dragPercentage);
       }
@@ -470,6 +491,6 @@ },
 
-          this.currentTranslation = -100 * (this.slides.current + (this.clones.length ? 1 : 0) - dragAmountPercentage);
+          this.transition.currentTranslation = -100 * (this.slides.current + (this.clones.length ? 1 : 0) - dragAmountPercentage);
         } else {
           var dragPercentage = this.getDragPercentage(e);
-          this.currentTranslation = -100 * (this.slides.current + (this.touch.goNext ? 1 : 0) + (this.clones.length ? 1 : 0) - dragPercentage);
+          this.transition.currentTranslation = -100 * (this.slides.current + (this.touch.goNext ? 1 : 0) + (this.clones.length ? 1 : 0) - dragPercentage);
         }
@@ -495,3 +516,3 @@ }
           // Then finish the sliding toward that slide.
-          slideOnDragEnd = -(Math.round(this.currentTranslation / 100) + (this.clones.length ? 1 : 0));
+          slideOnDragEnd = -(Math.round(this.transition.currentTranslation / 100) + (this.clones.length ? 1 : 0));
         }
@@ -515,3 +536,3 @@
           // Apply transition to snap back to current slide.
-          this.currentTranslation = -(this.slides.current + (this.clones.length ? 1 : 0)) * 100;
+          this.transition.currentTranslation = -(this.slides.current + (this.clones.length ? 1 : 0)) * 100;
         }
@@ -619,4 +640,2 @@
 
-      this.$refs.track.classList[animation ? 'remove' : 'add']('vueperslides__track--no-animation');
-
       // Infinite sliding with cloned slides:
@@ -628,5 +647,18 @@ // When reaching last slide and going next the cloned slide of the first slide
       if (nextSlideIsClone !== null) {
+        // Gives clone id (0 or 1 or null).
         setTimeout(function () {
-          _this3.goToSlide(nextSlideIsClone ? 0 : _this3.slides.count - 1, false, autoSliding);
-        }, 400);
+          // inside the callback, also check if it is not too late to apply next slide
+          // (user may have slid fast multiple times) if so cancel callback.
+          var passedCloneBackward = i === -1 && _this3.slides.current !== _this3.slides.count - 1;
+          var passedCloneForward = i === _this3.slides.count && _this3.slides.current !== 0;
+          var tooLateToSetTimeout = passedCloneBackward || passedCloneForward;
+
+          if (!tooLateToSetTimeout) {
+            _this3.transition.speed = 0;
+            _this3.goToSlide(nextSlideIsClone ? 0 : _this3.slides.count - 1, false, autoSliding);
+            setTimeout(function () {
+              _this3.transition.speed = _this3.conf.transitionSpeed;
+            }, 10);
+          }
+        }, this.transition.speed - 50);
       }
@@ -639,4 +671,4 @@
         if (nextSlideIsClone !== null) {
-          this.currentTranslation = -100 * (nextSlideIsClone ? this.slides.count + 1 : 0);
-        } else this.currentTranslation = -100 * (this.slides.current + (this.clones.length ? 1 : 0));
+          this.transition.currentTranslation = -100 * (nextSlideIsClone ? this.slides.count + 1 : 0);
+        } else this.transition.currentTranslation = -100 * (this.slides.current + (this.clones.length ? 1 : 0));
       }
@@ -725,2 +757,13 @@
     },
+    trackStyles: function trackStyles() {
+      var styles = {};
+
+      styles.transitionDuration = this.transition.speed + 'ms';
+
+      if (!this.conf.fade) {
+        styles.transform = 'translateX(' + this.transition.currentTranslation + '%)';
+      }
+
+      return styles;
+    },
     trackWrapperStyles: function trackWrapperStyles() {
@@ -742,2 +785,3 @@ var styles = {};
 
+// Expose component to global scope.
 if (typeof window !== 'undefined' && window.Vue) {
@@ -744,0 +788,0 @@ window.Vue.component('vueper-slides', VueperSlides);

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},[s("div",{directives:[{name:"show",rawName:"v-show",value:!e.$parent.conf.slideContentOutside&&(e.title||e.hasTitleSlotData||e.content||e.hasContentSlotData),expression:"!$parent.conf.slideContentOutside && (title || hasTitleSlotData || content || hasContentSlotData)"}],staticClass:"vueperslides__slide-content"},[e.title||e.hasTitleSlotData?s("div",{staticClass:"slide-title"},[e._t("slideTitle"),e.title?s("div",{domProps:{innerHTML:e._s(e.title)}}):e._e()],2):e._e(),e.content||e.hasContentSlotData?s("div",{staticClass:"slide-content"},[e._t("slideContent"),e.content?s("div",{domProps:{innerHTML:e._s(e.content)}}):e._e()],2):e._e()])])},staticRenderFns:[],props:{clone:{type:Number,default:null},image:{type:String,default:""},title:{type:String,default:""},content:{type:String,default:""}},mounted:function(){this.hasTitleSlotData&&this.$parent.updateSlideContent(this._uid,"titleSlot",this.titleSlot),this.hasContentSlotData&&this.$parent.updateSlideContent(this._uid,"contentSlot",this.contentSlot)},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+")"})},hasTitleSlotData:function(){return this.$slots.slideTitle},hasContentSlotData:function(){return this.$slots.slideContent},titleSlot:function(){return this.hasTitleSlotData?this.$slots.slideTitle[0].elm.innerHTML:""},contentSlot:function(){return this.hasContentSlotData?this.$slots.slideContent[0].elm.innerHTML:""}}},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; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; } .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--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__arrows { color: #fff; } .vueperslides__arrows--outside { color: #000; } .vueperslides__arrow { position: absolute; top: 50%; background-color: transparent; border: none; 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__arrows--outside .vueperslides__arrow--prev { left: -40px; } .vueperslides__arrows--outside .vueperslides__arrow--next { right: -40px; } .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("div",{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].titleSlot?s("div",{staticClass:"slide-title",domProps:{innerHTML:e._s(e.slides.list[e.slides.current].titleSlot)}}):e._e(),e.slides.count&&e.slides.list[e.slides.current].content?s("div",{staticClass:"slide-content",domProps:{innerHTML:e._s(e.slides.list[e.slides.current].content)}}):e._e(),e.slides.count&&e.slides.list[e.slides.current].contentSlot?s("div",{staticClass:"slide-content",domProps:{innerHTML:e._s(e.slides.list[e.slides.current].contentSlot)}}):e._e()]):e._e(),s("div",{staticClass:"vueperslides__inner"},[s("div",{staticClass:"vueperslides__parallax-wrapper",style:"padding-bottom:"+100*e.conf.slideRatio+"%"},[s("div",{staticClass:"vueperslides__track-wrapper",style:e.trackWrapperStyles},[s("div",{ref:"track",staticClass:"vueperslides__track",class:{"vueperslides__track--dragging":e.touch.dragging,"vueperslides__track--mousedown":e.mouseDown},style:e.conf.fade?"":"transform: translateX("+e.currentTranslation+"%)"},[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.clones[0].titleSlot?s("div",{attrs:{slot:"slideTitle"},domProps:{innerHTML:e._s(e.clones[0].titleSlot)},slot:"slideTitle"}):e._e(),e.clones[0].contentSlot?s("div",{attrs:{slot:"slideContent"},domProps:{innerHTML:e._s(e.clones[0].contentSlot)},slot:"slideContent"}):e._e()]):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.clones[1].titleSlot?s("div",{attrs:{slot:"slideTitle"},domProps:{innerHTML:e._s(e.clones[1].titleSlot)},slot:"slideTitle"}):e._e(),e.clones[1].contentSlot?s("div",{attrs:{slot:"slideContent"},domProps:{innerHTML:e._s(e.clones[1].contentSlot)},slot:"slideContent"}):e._e()]):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",class:{"vueperslides__arrows--outside":e.conf.arrowsOutside}},[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},arrowsOutside:{type:Boolean,default:!1},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,Number],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,isVisible:!1}}},mounted:function(){this.init()},methods:{init:function(){var e=this;this.emit("before-init",!1),this.container=this.$refs.vueperslides,this.touch.enabled=this.conf.touchable,Object.keys(this.breakpoints).length&&(this.setBreakpointsList(),this.setBreakpointConfig(this.getCurrentBreakpoint())),this.conf.infinite&&!this.conf.fade&&(this.cloneSlides(),this.$nextTick(function(){return e.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].titleSlot?this.slides.list[this.slides.current].titleSlot:this.slides.list[this.slides.current].title,content:this.slides.list[this.slides.current].contentSlot?this.slides.list[this.slides.current].contentSlot: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].titleSlot?this.slides.list[n].titleSlot:this.slides.list[n].title,content:this.slides.list[n].contentSlot?this.slides.list[n].contentSlot: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},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,titleSlot:this.slides.list[this.slides.count-1].titleSlot||"",content:this.slides.list[this.slides.count-1].content,contentSlot:this.slides.list[this.slides.count-1].contentSlot||"",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,titleSlot:this.slides.list[0].titleSlot||"",content:this.slides.list[0].content,contentSlot:this.slides.list[0].contentSlot||"",image:this.slides.list[0].image,style:t&&t.attributes.style?t.attributes.style.value:""}},updateSlideContent:function(e,t,s){this.slides.list.some(function(i){return i._uid===e&&(i[t]=s),i._uid===e})},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.conf.parallax)&&window.addEventListener("resize",this.onResize),this.conf.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||t.clientHeight||document.body.clientHeight,n=this.container.clientHeight,o=this.getSlideshowOffsetTop(),l=o+n-s,r=i+s-o;if(this.parallaxData.isVisible=l>0&&r>0,this.parallaxData.isVisible){var a=100*l/(i+n),d=-1===this.conf.parallax?100-a:a;this.parallaxData.translation=-d/2}},onResize:function(){if(this.breakpointsData.list.length){var e=this.getCurrentBreakpoint();this.hasBreakpointChanged(e)&&this.setBreakpointConfig(e)}this.conf.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&&null===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()}},computed:{conf:function(){return i({},this.$props,this.$props.breakpoints&&this.$props.breakpoints[this.breakpointsData.current]||{})},trackWrapperStyles:function(){var e={};return this.conf.parallax&&(e.transform="translateY("+this.parallaxData.translation+"%)",e.willChange=this.parallaxData.isVisible?"transform":"auto"),e}}};"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(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t.VueperSlides=t.VueperSlides||{})}(this,function(t){"use strict";var e=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var s=arguments[e];for(var i in s)Object.prototype.hasOwnProperty.call(s,i)&&(t[i]=s[i])}return t};!function(){if("undefined"!=typeof document){var t=document.head||document.getElementsByTagName("head")[0],e=document.createElement("style");e.type="text/css",e.styleSheet?e.styleSheet.cssText="":e.appendChild(document.createTextNode("")),t.appendChild(e)}}();var s={render:function(){var t=this,e=t.$createElement,s=t._self._c||e;return s("div",{class:{vueperslides__slide:!0,"vueperslides__slide--active":t.$parent.slides.activeUid===t._uid},style:t.styles},[s("div",{directives:[{name:"show",rawName:"v-show",value:!t.$parent.conf.slideContentOutside&&(t.title||t.hasTitleSlotData||t.content||t.hasContentSlotData),expression:"!$parent.conf.slideContentOutside && (title || hasTitleSlotData || content || hasContentSlotData)"}],staticClass:"vueperslides__slide-content"},[t.title||t.hasTitleSlotData?s("div",{staticClass:"slide-title"},[t._t("slideTitle"),t.title?s("div",{domProps:{innerHTML:t._s(t.title)}}):t._e()],2):t._e(),t.content||t.hasContentSlotData?s("div",{staticClass:"slide-content"},[t._t("slideContent"),t.content?s("div",{domProps:{innerHTML:t._s(t.content)}}):t._e()],2):t._e()])])},staticRenderFns:[],props:{clone:{type:Number,default:null},image:{type:String,default:""},title:{type:String,default:""},content:{type:String,default:""}},mounted:function(){this.hasTitleSlotData&&this.$parent.updateSlideContent(this._uid,"titleSlot",this.titleSlot),this.hasContentSlotData&&this.$parent.updateSlideContent(this._uid,"contentSlot",this.contentSlot)},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 e({},this.image&&{backgroundImage:"url("+this.image+")"})},hasTitleSlotData:function(){return this.$slots.slideTitle},hasContentSlotData:function(){return this.$slots.slideContent},titleSlot:function(){return this.hasTitleSlotData?this.$slots.slideTitle[0].elm.innerHTML:""},contentSlot:function(){return this.hasContentSlotData?this.$slots.slideContent[0].elm.innerHTML:""}}},i=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var s=arguments[e];for(var i in s)Object.prototype.hasOwnProperty.call(s,i)&&(t[i]=s[i])}return t};function n(t){if(Array.isArray(t)){for(var e=0,s=Array(t.length);e<t.length;e++)s[e]=t[e];return s}return Array.from(t)}!function(){if("undefined"!=typeof document){var t=document.head||document.getElementsByTagName("head")[0],e=document.createElement("style"),s='.vueperslides { position: relative; } .vueperslides__inner { position: relative; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; } .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 !important; } .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--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__arrows { color: #fff; } .vueperslides__arrows--outside { color: #000; } .vueperslides__arrow { position: absolute; top: 50%; background-color: transparent; border: none; 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__arrows--outside .vueperslides__arrow--prev { left: -40px; } .vueperslides__arrows--outside .vueperslides__arrow--next { right: -40px; } .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; } ';e.type="text/css",e.styleSheet?e.styleSheet.cssText=s:e.appendChild(document.createTextNode(s)),t.appendChild(e)}}();var l={render:function(){var t=this,e=t.$createElement,s=t._self._c||e;return s("div",{ref:"vueperslides",staticClass:"vueperslides",class:{"vueperslides--ready":t.isReady,"vueperslides--fade":t.conf.fade,"vueperslides--parallax":t.conf.parallax,"vueperslides--touchable":t.touch.enabled&&!t.disable,"vueperslides--animated":!0}},["top"===t.conf.slideContentOutside?s("div",{staticClass:"vueperslides__slide-content vueperslides__slide-content--outside-top",class:t.conf.slideContentOutsideClass},[t.slides.count&&t.slides.list[t.slides.current].title?s("div",{staticClass:"slide-title",domProps:{innerHTML:t._s(t.slides.list[t.slides.current].title)}}):t._e(),t.slides.count&&t.slides.list[t.slides.current].titleSlot?s("div",{staticClass:"slide-title",domProps:{innerHTML:t._s(t.slides.list[t.slides.current].titleSlot)}}):t._e(),t.slides.count&&t.slides.list[t.slides.current].content?s("div",{staticClass:"slide-content",domProps:{innerHTML:t._s(t.slides.list[t.slides.current].content)}}):t._e(),t.slides.count&&t.slides.list[t.slides.current].contentSlot?s("div",{staticClass:"slide-content",domProps:{innerHTML:t._s(t.slides.list[t.slides.current].contentSlot)}}):t._e()]):t._e(),s("div",{staticClass:"vueperslides__inner"},[s("div",{staticClass:"vueperslides__parallax-wrapper",style:"padding-bottom:"+100*t.conf.slideRatio+"%"},[s("div",{staticClass:"vueperslides__track-wrapper",style:t.trackWrapperStyles},[s("div",{ref:"track",staticClass:"vueperslides__track",class:{"vueperslides__track--dragging":t.touch.dragging,"vueperslides__track--mousedown":t.mouseDown},style:t.trackStyles},[t.slides.count&&t.clones[0]?s("vueper-slide",{staticClass:"vueperslides__slide--clone",style:t.clones[0].style,attrs:{clone:0,title:t.clones[0].title,content:t.clones[0].content,image:t.clones[0].image}},[t.clones[0].titleSlot?s("div",{attrs:{slot:"slideTitle"},domProps:{innerHTML:t._s(t.clones[0].titleSlot)},slot:"slideTitle"}):t._e(),t.clones[0].contentSlot?s("div",{attrs:{slot:"slideContent"},domProps:{innerHTML:t._s(t.clones[0].contentSlot)},slot:"slideContent"}):t._e()]):t._e(),t._t("default",null,{currentSlide:t.slides.current}),t.slides.count&&t.clones[1]?s("vueper-slide",{staticClass:"vueperslides__slide--clone",style:t.clones[1].style,attrs:{clone:1,title:t.clones[1].title,content:t.clones[1].content,image:t.clones[1].image}},[t.clones[1].titleSlot?s("div",{attrs:{slot:"slideTitle"},domProps:{innerHTML:t._s(t.clones[1].titleSlot)},slot:"slideTitle"}):t._e(),t.clones[1].contentSlot?s("div",{attrs:{slot:"slideContent"},domProps:{innerHTML:t._s(t.clones[1].contentSlot)},slot:"slideContent"}):t._e()]):t._e()],2)])]),t.$slots.pausedIcon?s("div",{staticClass:"vueperslides__paused"},[t._t("pausedIcon")],2):t._e(),t.conf.arrows&&t.slides.count>1&&!t.disable?s("div",{staticClass:"vueperslides__arrows",class:{"vueperslides__arrows--outside":t.conf.arrowsOutside}},[s("button",{directives:[{name:"show",rawName:"v-show",value:!t.arrowPrevDisabled,expression:"!arrowPrevDisabled"}],staticClass:"vueperslides__arrow vueperslides__arrow--prev",on:{click:function(e){t.onArrowClick(!1)}}},[t._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:!t.arrowNextDisabled,expression:"!arrowNextDisabled"}],staticClass:"vueperslides__arrow vueperslides__arrow--next",on:{click:function(e){t.onArrowClick()}}},[t._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)]):t._e(),t.conf.bullets&&t.slides.count>1&&!t.disable&&!t.conf.bulletsOutside?s("div",{staticClass:"vueperslides__bullets"},t._l(t.slides.list,function(e,i){return s("button",{key:i,ref:"bullet",refInFor:!0,staticClass:"vueperslides__bullet",class:{"vueperslides__bullet--active":t.slides.current===i},on:{click:function(e){t.goToSlide(i)},keyup:[function(e){return"button"in e||!t._k(e.keyCode,"left",37,e.key,["Left","ArrowLeft"])?"button"in e&&0!==e.button?null:void t.onArrowClick(!1):null},function(e){return"button"in e||!t._k(e.keyCode,"right",39,e.key,["Right","ArrowRight"])?"button"in e&&2!==e.button?null:void t.onArrowClick():null}]}},[s("span",[t._v(t._s(i+1))])])})):t._e()]),t.conf.bullets&&t.slides.count>1&&!t.disable&&t.conf.bulletsOutside?s("div",{staticClass:"vueperslides__bullets vueperslides__bullets--outside"},t._l(t.slides.list,function(e,i){return s("button",{key:i,ref:"bullet",refInFor:!0,staticClass:"vueperslides__bullet",class:{"vueperslides__bullet--active":t.slides.current===i},on:{click:function(e){t.goToSlide(i)},keyup:[function(e){return"button"in e||!t._k(e.keyCode,"left",37,e.key,["Left","ArrowLeft"])?"button"in e&&0!==e.button?null:void t.onArrowClick(!1):null},function(e){return"button"in e||!t._k(e.keyCode,"right",39,e.key,["Right","ArrowRight"])?"button"in e&&2!==e.button?null:void t.onArrowClick():null}]}},[s("span",[t._v(t._s(i+1))])])})):t._e(),"bottom"===t.conf.slideContentOutside?s("div",{staticClass:"vueperslides__slide-content vueperslides__slide-content--outside-bottom",class:t.conf.slideContentOutsideClass},[t.slides.count&&t.slides.list[t.slides.current].title?s("div",{staticClass:"slide-title",domProps:{innerHTML:t._s(t.slides.list[t.slides.current].title)}}):t._e(),t.slides.count&&t.slides.list[t.slides.current].titleSlot?s("div",{staticClass:"slide-title",domProps:{innerHTML:t._s(t.slides.list[t.slides.current].titleSlot)}}):t._e(),t.slides.count&&t.slides.list[t.slides.current].content?s("div",{staticClass:"slide-content",domProps:{innerHTML:t._s(t.slides.list[t.slides.current].content)}}):t._e(),t.slides.count&&t.slides.list[t.slides.current].contentSlot?s("div",{staticClass:"slide-content",domProps:{innerHTML:t._s(t.slides.list[t.slides.current].contentSlot)}}):t._e()]):t._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},arrowsOutside:{type:Boolean,default:!1},disableArrowsOnEdges:{type:[Boolean,String],default:!1},bullets:{type:Boolean,default:!0},bulletsOutside:{type:Boolean,default:!1},fade:{type:Boolean,default:!1},slideContentOutside:{type:[Boolean,String],default:!1},slideContentOutsideClass:{type:String,default:""},autoplay:{type:Boolean,default:!1},speed:{type:[Number,String],default:4e3},transitionSpeed:{type:[Number,String],default:600},pauseOnHover:{type:Boolean,default:!0},infinite:{type:Boolean,default:!0},parallax:{type:[Boolean,Number],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},transition:{currentTranslation:0,speed:0},timer:null,arrowPrevDisabled:!1,arrowNextDisabled:!1,breakpointsData:{list:[],current:null},parallaxData:{translation:0,slideshowOffsetTop:null,isVisible:!1}}},mounted:function(){this.init()},methods:{init:function(){var t=this;this.emit("before-init",!1),this.container=this.$refs.vueperslides,this.touch.enabled=this.conf.touchable,this.transition.speed=this.conf.transitionSpeed,Object.keys(this.breakpoints).length&&(this.setBreakpointsList(),this.setBreakpointConfig(this.getCurrentBreakpoint())),this.conf.infinite&&!this.conf.fade&&(this.cloneSlides(),this.$nextTick(function(){return t.cloneSlides()})),this.goToSlide(this.conf.initSlide-1),this.bindEvents(),this.isReady=!0,this.emit("ready")},emit:function(t){var e=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],s=arguments.length>2&&void 0!==arguments[2]&&arguments[2],i=[t];if((e||"number"==typeof s)&&(i[1]={},e&&this.slides.activeUid&&(i[1].currentSlide={index:this.slides.current,title:this.slides.list[this.slides.current].titleSlot?this.slides.list[this.slides.current].titleSlot:this.slides.list[this.slides.current].title,content:this.slides.list[this.slides.current].contentSlot?this.slides.list[this.slides.current].contentSlot: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].titleSlot?this.slides.list[n].titleSlot:this.slides.list[n].title,content:this.slides.list[n].contentSlot?this.slides.list[n].contentSlot:this.slides.list[n].content}}this.$emit.apply(this,[t].concat(i))},setBreakpointsList:function(){this.breakpointsData.list=[99999].concat(n(Object.keys(this.breakpoints))).sort(function(t,e){return parseInt(t)<parseInt(e)})},getCurrentBreakpoint:function(){var t=window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth,e=[t].concat(n(this.breakpointsData.list)).sort(function(t,e){return parseInt(t)<parseInt(e)});return this.breakpointsData.list[e.indexOf(t)-1]},hasBreakpointChanged:function(t){return this.breakpointsData.current!==t},setBreakpointConfig:function(t){this.breakpointsData.current=t},cloneSlides:function(){var t=this.$slots.default[0].tag,e=this.$slots.default[t?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,titleSlot:this.slides.list[this.slides.count-1].titleSlot||"",content:this.slides.list[this.slides.count-1].content,contentSlot:this.slides.list[this.slides.count-1].contentSlot||"",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,titleSlot:this.slides.list[0].titleSlot||"",content:this.slides.list[0].content,contentSlot:this.slides.list[0].contentSlot||"",image:this.slides.list[0].image,style:e&&e.attributes.style?e.attributes.style.value:""}},updateSlideContent:function(t,e,s){this.slides.list.some(function(i){return i._uid===t&&(i[e]=s),i._uid===t})},bindEvents:function(){var t="ontouchstart"in window;this.touch.enabled&&(this.$refs.track.addEventListener(t?"touchstart":"mousedown",this.onMouseDown),document.addEventListener(t?"touchmove":"mousemove",this.onMouseMove),document.addEventListener(t?"touchend":"mouseup",this.onMouseUp)),this.conf.pauseOnHover&&!t&&this.conf.autoplay&&(this.container.addEventListener("mouseover",this.onMouseIn),this.container.addEventListener("mouseout",this.onMouseOut)),(this.breakpointsData.list.length||this.conf.parallax)&&window.addEventListener("resize",this.onResize),this.conf.parallax&&document.addEventListener("scroll",this.onScroll)},getSlideshowOffsetTop:function(){var t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];if(null===this.parallaxData.slideshowOffsetTop||t){for(var e=this.container,s=e.offsetTop;e=e.offsetParent;)s+=e.offsetTop;this.parallaxData.slideshowOffsetTop=s}return this.parallaxData.slideshowOffsetTop},onScroll:function(t){var e=document.documentElement,s=(window.pageYOffset||e.scrollTop)-(e.clientTop||0),i=window.innerHeight||e.clientHeight||document.body.clientHeight,n=this.container.clientHeight,l=this.getSlideshowOffsetTop(),o=l+n-s,r=i+s-l;if(this.parallaxData.isVisible=o>0&&r>0,this.parallaxData.isVisible){var a=100*o/(i+n),d=-1===this.conf.parallax?100-a:a;this.parallaxData.translation=-d/2}},onResize:function(){if(this.breakpointsData.list.length){var t=this.getCurrentBreakpoint();this.hasBreakpointChanged(t)&&this.setBreakpointConfig(t)}this.conf.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(t){if(this.touch.enabled&&!this.disable)if(t.touches||t.preventDefault(),this.mouseDown=!0,this.draggingDistance)this.touch.dragStartX="ontouchstart"in window?t.touches[0].clientX:t.clientX;else{var e=this.getDragPercentage(t);this.touch.goNext=e>=.5,this.transition.currentTranslation=-100*(this.slides.current+(this.touch.goNext?1:0)+(this.clones.length?1:0)-e)}},onMouseMove:function(t){if(this.mouseDown||this.touch.dragging)if(this.mouseDown=!1,this.touch.dragging=!0,this.draggingDistance){this.touch.dragAmount=this.getDragAmount(t);var e=this.touch.dragAmount/this.container.clientWidth;this.transition.currentTranslation=-100*(this.slides.current+(this.clones.length?1:0)-e)}else{var s=this.getDragPercentage(t);this.transition.currentTranslation=-100*(this.slides.current+(this.touch.goNext?1:0)+(this.clones.length?1:0)-s)}},onMouseUp:function(t){if(this.mouseDown||this.touch.dragging){this.mouseDown=!1,this.touch.dragging=!1;var e=void 0;if(this.draggingDistance){var s=this.touch.dragAmount;this.container.clientWidth;e=this.slides.current,Math.abs(s)>=this.draggingDistance&&(e+=s>0?-1:1)}else e=-(Math.round(this.transition.currentTranslation/100)+(this.clones.length?1:0));var i=this.getSlideInRange(e).nextSlide;this.arrowNextDisabled&&this.conf.autoplay&&0===i&&(i=this.slides.count-1),i!==this.slides.current?this.goToSlide(e):this.transition.currentTranslation=100*-(this.slides.current+(this.clones.length?1:0)),this.touch.dragStartX=null,this.touch.dragAmount=null,this.enableScroll()}},getDragPercentage:function(t){return(("ontouchstart"in window?t.touches[0].clientX:t.clientX)-this.container.offsetLeft)/this.container.clientWidth},getDragAmount:function(t){return("ontouchstart"in window?t.touches[0].clientX:t.clientX)-this.touch.dragStartX},disableScroll:function(){document.ontouchmove=function(t){t.preventDefault()}},enableScroll:function(){document.ontouchmove=function(){return!0}},clearTimer:function(){clearTimeout(this.timer),this.timer=0},setTimer:function(){var t=this;this.timer=setTimeout(function(){t.goToSlide(t.slides.current+1,!0,!0)},this.conf.speed)},onArrowClick:function(){var t=!(arguments.length>0&&void 0!==arguments[0])||arguments[0];this.goToSlide(this.slides.current+(t?1:-1))},getSlideInRange:function(t){var e=null;return this.clones.length?t<0?(t=this.slides.count-1,e=0):t>this.slides.count-1&&(t=0,e=1):t<0?t=this.conf.disableArrowsOnEdges?0:this.slides.count-1:t>this.slides.count-1&&(t=this.conf.disableArrowsOnEdges?this.conf.autoplay?0:this.slides.count-1:0),{nextSlide:t,clone:e}},goToSlide:function(t){var e=this,s=(!(arguments.length>1&&void 0!==arguments[1])||arguments[1],arguments.length>2&&void 0!==arguments[2]&&arguments[2]);if(this.slides.count&&!this.disable){this.conf.autoplay&&this.clearTimer();var i=this.getSlideInRange(t),n=i.nextSlide,l=i.clone;this.isReady&&this.emit("before-slide",!0,n),this.conf.arrows&&this.conf.disableArrowsOnEdges&&(this.arrowPrevDisabled=0===n,this.arrowNextDisabled=n===this.slides.count-1),null!==l&&setTimeout(function(){var i=-1===t&&e.slides.current!==e.slides.count-1,n=t===e.slides.count&&0!==e.slides.current;i||n||(e.transition.speed=0,e.goToSlide(l?0:e.slides.count-1,!1,s),setTimeout(function(){e.transition.speed=e.conf.transitionSpeed},10))},this.transition.speed-50),this.slides.current=n,this.conf.fade||(this.transition.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&&!s&&this.$refs.bullet[this.slides.current]&&this.$refs.bullet[this.slides.current].focus())}},addSlide:function(t){var e=this,s=this.conf.infinite&&!this.conf.fade&&this.isReady&&null===t.clone;null!==t.clone?this.clones[t.clone]=t:(this.slides.list.push(t),this.slides.count=this.slides.list.length),this.slides.count>1&&this.touchable&&(this.touch.enabled=!0),s&&this.$nextTick(function(){return e.cloneSlides()})},removeSlide:function(t){var e=this,s=!1;this.slides.list.some(function(i,n){if(i._uid===t)return e.slides.list.splice(n,1),e.slides.count=e.slides.list.length,t===e.slides.activeUid&&(e.slides.activeUid=null,e.goToSlide(n-1,!0,!0)),e.slides.count<=1&&(e.touch.enabled=!1),e.clones.length&&e.isReady&&!i.clone&&(s=!0),!0}),this.slides.count&&s&&this.cloneSlides()}},computed:{conf:function(){return i({},this.$props,this.$props.breakpoints&&this.$props.breakpoints[this.breakpointsData.current]||{})},trackStyles:function(){var t={};return t.transitionDuration=this.transition.speed+"ms",this.conf.fade||(t.transform="translateX("+this.transition.currentTranslation+"%)"),t},trackWrapperStyles:function(){var t={};return this.conf.parallax&&(t.transform="translateY("+this.parallaxData.translation+"%)",t.willChange=this.parallaxData.isVisible?"transform":"auto"),t}}};"undefined"!=typeof window&&window.Vue&&(window.Vue.component("vueper-slides",l),window.Vue.component("vueper-slide",s)),t.VueperSlides=l,t.VueperSlide=s,Object.defineProperty(t,"__esModule",{value:!0})});
 //# sourceMappingURL=vueperslides.min.js.map

package.json

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

README.md

@@ -28,2 +28,3 @@ # Vueper Slides
 
+- __Version 1.5.0__ Add transition speed param & slide content outside above or under slideshow
 - __Version 1.4.0__ Allow complex slide title & content
@@ -30,0 +31,0 @@ - __Version 1.3.2__ Add option to place arrows outside. The config is now vuejs-reactive

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

205774

increased by6.89%

Lines of code

812

increased by6.98%

Number of lines in readme file

36

increased by2.86%

No dependency changes