diff --git a/CHANGELOG.md b/CHANGELOG.md index a7b759f..95c7d2c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -6,6 +6,13 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ## [Unreleased] +## [0.3.0] - 2020-09-05 +### Added +- Dynamic slides support (#25) + +### Updated +- Dependencies + ## [0.2.0] - 2020-08-29 ### Added - VueLazy lib diff --git a/dist/vue-snap.esm.js b/dist/vue-snap.esm.js index 4e4cb3f..0f15e96 100644 --- a/dist/vue-snap.esm.js +++ b/dist/vue-snap.esm.js @@ -1 +1 @@ -import{polyfill as e}from"seamless-scroll-polyfill/dist/esm/Element.scrollBy";import"core-js/modules/es.array.find-index";import"core-js/modules/es.array.from";import"core-js/modules/es.array.map";import"core-js/modules/es.string.iterator";import t from"lodash.debounce";var i="undefined"==typeof document||"undefined"==typeof window,s=!i;i||"scrollBehavior"in document.documentElement.style||e();function n(e,t,i,s,n,r,o,a,c,d){"boolean"!=typeof o&&(c=a,a=o,o=!1);const l="function"==typeof i?i.options:i;let h;if(e&&e.render&&(l.render=e.render,l.staticRenderFns=e.staticRenderFns,l._compiled=!0,n&&(l.functional=!0)),s&&(l._scopeId=s),r?(h=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),t&&t.call(this,c(e)),e&&e._registeredComponents&&e._registeredComponents.add(r)},l._ssrRegister=h):t&&(h=o?function(e){t.call(this,d(e,this.$root.$options.shadowRoot))}:function(e){t.call(this,a(e))}),h)if(l.functional){const e=l.render;l.render=function(t,i){return h.call(i),e(t,i)}}else{const e=l.beforeCreate;l.beforeCreate=e?[].concat(e,h):[h]}return i}const r={props:{navigationArrows:{type:Boolean,default:!0}},data:function(){return{boundLeft:!0,boundRight:!1,slidesWidth:[],wrapperScrollWidth:0,wrapperVisibleWidth:0,currentPage:0,currentPos:0,maxPages:0,step:1}},mounted:function(){this.calcWrapperWidth(),this.calcSlidesWidth(),this.calcMaxPages(),s&&(this.$refs.vsWrapper.addEventListener("scroll",t(this.eventScroll,100)),window.addEventListener("resize",t(this.eventResize,410),!1))},beforeDestroy:function(){s&&(this.$refs.vsWrapper.removeEventListener("scroll",t(this.eventScroll,100)),window.removeEventListener("resize",t(this.eventResize,410),!1))},methods:{calcBounds:function(){this.boundLeft=0===this.currentPos,this.boundRight=this.wrapperScrollWidth-this.wrapperVisibleWidth===this.currentPos},calcWrapperWidth:function(){this.wrapperScrollWidth=this.$refs.vsWrapper.scrollWidth,this.wrapperVisibleWidth=this.$refs.vsWrapper.offsetWidth},calcSlidesWidth:function(){var e=Array.from(this.$refs.vsWrapper.childNodes);this.slidesWidth=e.map((function(e){return{offsetLeft:e.offsetLeft,width:e.offsetWidth}}))},calcCurrentPosition:function(){var e=this;this.currentPos=this.$refs.vsWrapper.scrollLeft,this.currentPage=this.slidesWidth.findIndex((function(t){var i,s,n,r=t.offsetLeft;return i=r,s=e.currentPos,n=1,Math.abs(i-s)<=n})),-1===this.currentPage&&(this.currentPage=this.maxPages)},calcMaxPages:function(){var e=this.wrapperScrollWidth-this.wrapperVisibleWidth;this.maxPages=this.slidesWidth.findIndex((function(t){return t.offsetLeft>e}))-1},calcNextWidth:function(e){var t=e>0?this.currentPage:this.currentPage+e;return this.slidesWidth[t].width*e},eventScroll:function(){this.calcCurrentPosition(),this.calcBounds()},eventResize:function(){this.calcWrapperWidth(),this.calcSlidesWidth(),this.calcCurrentPosition(),this.calcBounds(),this.calcMaxPages()},changeSlide:function(e){var t=-1===e&&this.boundLeft,i=1===e&&this.boundRight;if(!t&&!i){var s=this.calcNextWidth(e);this.scroll(s)}},scroll:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0;this.$refs.vsWrapper.scrollBy({left:e,behavior:"smooth"})}}};var o=function(){var e=this,t=e.$createElement,i=e._self._c||t;return i("div",{staticClass:"vs-carousel"},[i("div",{ref:"vsWrapper",staticClass:"vs-carousel__wrapper"},[e._t("default")],2),e._v(" "),e.navigationArrows?e._t("navigation",[i("button",{directives:[{name:"show",rawName:"v-show",value:!e.boundLeft,expression:"!boundLeft"}],staticClass:"\n vs-carousel__navigation\n vs-carousel__navigation--left\n ",attrs:{type:"button","aria-label":"Slide left"},on:{click:function(t){return e.changeSlide(-1)}}},[e._v("\n ←\n ")]),e._v(" "),i("button",{directives:[{name:"show",rawName:"v-show",value:!e.boundRight,expression:"!boundRight"}],staticClass:"\n vs-carousel__navigation\n vs-carousel__navigation--right\n ",attrs:{type:"button","aria-label":"Slide right"},on:{click:function(t){return e.changeSlide(1)}}},[e._v("\n →\n ")])]):e._e()],2)};o._withStripped=!0;const a=n({render:o,staticRenderFns:[]},undefined,r,undefined,false,undefined,!1,void 0,void 0,void 0);var c=function(){var e=this,t=e.$createElement;return(e._self._c||t)("div",{ref:"vsSlide",staticClass:"vs-carousel__slide",attrs:{tabindex:"0"}},[e._t("default")],2)};c._withStripped=!0;const d=n({render:c,staticRenderFns:[]},undefined,{},undefined,false,undefined,!1,void 0,void 0,void 0);var l={install:function(e){e.component("carousel",a),e.component("slide",d)}};export default l;export{a as Carousel,d as Slide}; +import{polyfill as t}from"seamless-scroll-polyfill/dist/esm/Element.scrollBy";import"core-js/modules/es.array.find-index";import"core-js/modules/es.array.from";import"core-js/modules/es.array.map";import"core-js/modules/es.string.iterator";import e from"lodash.debounce";var i="undefined"==typeof document||"undefined"==typeof window,s=!i;i||"scrollBehavior"in document.documentElement.style||t();function n(t,e,i,s,n,r,o,a,c,l){"boolean"!=typeof o&&(c=a,a=o,o=!1);const d="function"==typeof i?i.options:i;let h;if(t&&t.render&&(d.render=t.render,d.staticRenderFns=t.staticRenderFns,d._compiled=!0,n&&(d.functional=!0)),s&&(d._scopeId=s),r?(h=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),e&&e.call(this,c(t)),t&&t._registeredComponents&&t._registeredComponents.add(r)},d._ssrRegister=h):e&&(h=o?function(t){e.call(this,l(t,this.$root.$options.shadowRoot))}:function(t){e.call(this,a(t))}),h)if(d.functional){const t=d.render;d.render=function(e,i){return h.call(i),t(e,i)}}else{const t=d.beforeCreate;d.beforeCreate=t?[].concat(t,h):[h]}return i}const r={props:{navigationArrows:{type:Boolean,default:!0}},data:function(){return{boundLeft:!0,boundRight:!1,slidesWidth:[],wrapperScrollWidth:0,wrapperVisibleWidth:0,currentPage:0,currentPos:0,maxPages:0,step:1,observer:null}},mounted:function(){this.calcOnInit(),s&&(this.attachMutationObserver(),this.$refs.vsWrapper.addEventListener("scroll",e(this.calcOnScroll,100)),window.addEventListener("resize",e(this.calcOnInit,410),!1))},beforeDestroy:function(){s&&(this.observer.disconnect(),this.$refs.vsWrapper.removeEventListener("scroll",e(this.calcOnScroll,100)),window.removeEventListener("resize",e(this.calcOnInit,410),!1))},methods:{calcOnInit:function(){this.calcWrapperWidth(),this.calcSlidesWidth(),this.calcCurrentPosition(),this.calcBounds(),this.calcMaxPages()},calcOnScroll:function(){this.calcCurrentPosition(),this.calcBounds()},calcBounds:function(){this.boundLeft=0===this.currentPos,this.boundRight=this.wrapperScrollWidth-this.wrapperVisibleWidth===this.currentPos},calcWrapperWidth:function(){this.wrapperScrollWidth=this.$refs.vsWrapper.scrollWidth,this.wrapperVisibleWidth=this.$refs.vsWrapper.offsetWidth},calcSlidesWidth:function(){var t=Array.from(this.$refs.vsWrapper.childNodes);this.slidesWidth=t.map((function(t){return{offsetLeft:t.offsetLeft,width:t.offsetWidth}}))},calcCurrentPosition:function(){var t=this;this.currentPos=this.$refs.vsWrapper.scrollLeft||0,this.currentPage=this.slidesWidth.findIndex((function(e){return i=e.offsetLeft,s=t.currentPos,n=5,Math.abs(i-s)<=n;var i,s,n})),-1===this.currentPage&&(this.currentPage=this.maxPages)},calcMaxPages:function(){var t=this.wrapperScrollWidth-this.wrapperVisibleWidth;this.maxPages=this.slidesWidth.findIndex((function(e){return e.offsetLeft>t}))-1},calcNextWidth:function(t){var e=t>0?this.currentPage:this.currentPage+t,i=this.slidesWidth[e].width||0;if(i)return i*t},attachMutationObserver:function(){var t=this;this.observer=new MutationObserver((function(){t.calcOnInit()})),this.observer.observe(this.$el,{attributes:!0,childList:!0,characterData:!0,subtree:!0})},changeSlide:function(t){var e=-1===t&&this.boundLeft,i=1===t&&this.boundRight;if(!e&&!i){var s=this.calcNextWidth(t);s&&this.scrollTo(s)}},scrollTo:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0;this.$refs.vsWrapper.scrollBy({left:t,behavior:"smooth"})}}};var o=function(){var t=this,e=t.$createElement,i=t._self._c||e;return i("div",{staticClass:"vs-carousel"},[i("div",{ref:"vsWrapper",staticClass:"vs-carousel__wrapper"},[t._t("default")],2),t._v(" "),t.navigationArrows?t._t("navigation",[i("button",{directives:[{name:"show",rawName:"v-show",value:!t.boundLeft,expression:"!boundLeft"}],staticClass:"\n vs-carousel__navigation\n vs-carousel__navigation--left\n ",attrs:{type:"button","aria-label":"Slide left"},on:{click:function(e){return t.changeSlide(-1)}}},[t._v("\n ←\n ")]),t._v(" "),i("button",{directives:[{name:"show",rawName:"v-show",value:!t.boundRight,expression:"!boundRight"}],staticClass:"\n vs-carousel__navigation\n vs-carousel__navigation--right\n ",attrs:{type:"button","aria-label":"Slide right"},on:{click:function(e){return t.changeSlide(1)}}},[t._v("\n →\n ")])]):t._e()],2)};o._withStripped=!0;const a=n({render:o,staticRenderFns:[]},undefined,r,undefined,false,undefined,!1,void 0,void 0,void 0);var c=function(){var t=this,e=t.$createElement;return(t._self._c||e)("div",{ref:"vsSlide",staticClass:"vs-carousel__slide",attrs:{tabindex:"0"}},[t._t("default")],2)};c._withStripped=!0;const l=n({render:c,staticRenderFns:[]},undefined,{},undefined,false,undefined,!1,void 0,void 0,void 0);var d={install:function(t){t.component("carousel",a),t.component("slide",l)}};export default d;export{a as Carousel,l as Slide}; diff --git a/dist/vue-snap.js b/dist/vue-snap.js index 22d6701..f46a2cd 100644 --- a/dist/vue-snap.js +++ b/dist/vue-snap.js @@ -1 +1 @@ -var VueSnap=function(t){"use strict";const e=t=>.5*(1-Math.cos(Math.PI*t)),n=()=>(performance&&performance.now?performance:Date).now(),r=t=>{const o=(n()-t.timeStamp)/(t.duration||500);if(o>1)return t.method(t.targetX,t.targetY),void t.callback();const i=(t.timingFunc||e)(o),c=t.startX+(t.targetX-t.startX)*i,u=t.startY+(t.targetY-t.startY)*i;t.method(c,u),t.rafId=requestAnimationFrame(()=>{r(t)})};let o;const i=()=>(void 0===o&&(o=Element.prototype.scroll||Element.prototype.scrollTo||function(t,e){this.scrollLeft=t,this.scrollTop=e}),o),c=(t,e)=>{const o=(e.left||0)+t.scrollLeft,c=(e.top||0)+t.scrollTop;return((t,e)=>{const o=i().bind(t);if(void 0===e.left&&void 0===e.top)return;const c=t.scrollLeft,u=t.scrollTop,{left:a=c,top:s=u}=e;if("smooth"!==e.behavior)return o(a,s);const f=()=>{window.removeEventListener("wheel",p),window.removeEventListener("touchmove",p)},l={timeStamp:n(),duration:e.duration,startX:c,startY:u,targetX:a,targetY:s,rafId:0,method:o,timingFunc:e.timingFunc,callback:f},p=()=>{cancelAnimationFrame(l.rafId),f()};window.addEventListener("wheel",p,{passive:!0,once:!0}),window.addEventListener("touchmove",p,{passive:!0,once:!0}),r(l)})(t,{...e,left:o,top:c})},u=t=>{Element.prototype.scrollBy=function(){const[e=0,n=0]=arguments;if("number"==typeof e&&"number"==typeof n)return c(this,{left:e,top:n});if(Object(e)!==e)throw new TypeError("Failed to execute 'scrollBy' on 'Element': parameter 1 ('options') is not an object.");return c(this,{...e,...t})}};var a="undefined"==typeof document||"undefined"==typeof window,s=!a;a||"scrollBehavior"in document.documentElement.style||u();var f="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{};function l(t,e,n){return t(n={path:e,exports:{},require:function(t,e){return function(){throw new Error("Dynamic requires are not currently supported by @rollup/plugin-commonjs")}(null==e&&n.path)}},n.exports),n.exports}var p=function(t){return t&&t.Math==Math&&t},d=p("object"==typeof globalThis&&globalThis)||p("object"==typeof window&&window)||p("object"==typeof self&&self)||p("object"==typeof f&&f)||Function("return this")(),h=function(t){try{return!!t()}catch(t){return!0}},v=!h((function(){return 7!=Object.defineProperty({},1,{get:function(){return 7}})[1]})),y={}.propertyIsEnumerable,g=Object.getOwnPropertyDescriptor,m={f:g&&!y.call({1:2},1)?function(t){var e=g(this,t);return!!e&&e.enumerable}:y},b=function(t,e){return{enumerable:!(1&t),configurable:!(2&t),writable:!(4&t),value:e}},w={}.toString,S=function(t){return w.call(t).slice(8,-1)},_="".split,O=h((function(){return!Object("z").propertyIsEnumerable(0)}))?function(t){return"String"==S(t)?_.call(t,""):Object(t)}:Object,j=function(t){if(null==t)throw TypeError("Can't call method on "+t);return t},P=function(t){return O(j(t))},E=function(t){return"object"==typeof t?null!==t:"function"==typeof t},x=function(t,e){if(!E(t))return t;var n,r;if(e&&"function"==typeof(n=t.toString)&&!E(r=n.call(t)))return r;if("function"==typeof(n=t.valueOf)&&!E(r=n.call(t)))return r;if(!e&&"function"==typeof(n=t.toString)&&!E(r=n.call(t)))return r;throw TypeError("Can't convert object to primitive value")},A={}.hasOwnProperty,W=function(t,e){return A.call(t,e)},T=d.document,I=E(T)&&E(T.createElement),C=function(t){return I?T.createElement(t):{}},R=!v&&!h((function(){return 7!=Object.defineProperty(C("div"),"a",{get:function(){return 7}}).a})),L=Object.getOwnPropertyDescriptor,F={f:v?L:function(t,e){if(t=P(t),e=x(e,!0),R)try{return L(t,e)}catch(t){}if(W(t,e))return b(!m.f.call(t,e),t[e])}},$=function(t){if(!E(t))throw TypeError(String(t)+" is not an object");return t},M=Object.defineProperty,N={f:v?M:function(t,e,n){if($(t),e=x(e,!0),$(n),R)try{return M(t,e,n)}catch(t){}if("get"in n||"set"in n)throw TypeError("Accessors not supported");return"value"in n&&(t[e]=n.value),t}},k=v?function(t,e,n){return N.f(t,e,b(1,n))}:function(t,e,n){return t[e]=n,t},B=function(t,e){try{k(d,t,e)}catch(n){d[t]=e}return e},z="__core-js_shared__",X=d[z]||B(z,{}),Y=Function.toString;"function"!=typeof X.inspectSource&&(X.inspectSource=function(t){return Y.call(t)});var D,V,G,U=X.inspectSource,q=d.WeakMap,K="function"==typeof q&&/native code/.test(U(q)),H=l((function(t){(t.exports=function(t,e){return X[t]||(X[t]=void 0!==e?e:{})})("versions",[]).push({version:"3.6.5",mode:"global",copyright:"© 2020 Denis Pushkarev (zloirock.ru)"})})),J=0,Q=Math.random(),Z=function(t){return"Symbol("+String(void 0===t?"":t)+")_"+(++J+Q).toString(36)},tt=H("keys"),et=function(t){return tt[t]||(tt[t]=Z(t))},nt={},rt=d.WeakMap;if(K){var ot=new rt,it=ot.get,ct=ot.has,ut=ot.set;D=function(t,e){return ut.call(ot,t,e),e},V=function(t){return it.call(ot,t)||{}},G=function(t){return ct.call(ot,t)}}else{var at=et("state");nt[at]=!0,D=function(t,e){return k(t,at,e),e},V=function(t){return W(t,at)?t[at]:{}},G=function(t){return W(t,at)}}var st,ft={set:D,get:V,has:G,enforce:function(t){return G(t)?V(t):D(t,{})},getterFor:function(t){return function(e){var n;if(!E(e)||(n=V(e)).type!==t)throw TypeError("Incompatible receiver, "+t+" required");return n}}},lt=l((function(t){var e=ft.get,n=ft.enforce,r=String(String).split("String");(t.exports=function(t,e,o,i){var c=!!i&&!!i.unsafe,u=!!i&&!!i.enumerable,a=!!i&&!!i.noTargetGet;"function"==typeof o&&("string"!=typeof e||W(o,"name")||k(o,"name",e),n(o).source=r.join("string"==typeof e?e:"")),t!==d?(c?!a&&t[e]&&(u=!0):delete t[e],u?t[e]=o:k(t,e,o)):u?t[e]=o:B(e,o)})(Function.prototype,"toString",(function(){return"function"==typeof this&&e(this).source||U(this)}))})),pt=d,dt=function(t){return"function"==typeof t?t:void 0},ht=function(t,e){return arguments.length<2?dt(pt[t])||dt(d[t]):pt[t]&&pt[t][e]||d[t]&&d[t][e]},vt=Math.ceil,yt=Math.floor,gt=function(t){return isNaN(t=+t)?0:(t>0?yt:vt)(t)},mt=Math.min,bt=function(t){return t>0?mt(gt(t),9007199254740991):0},wt=Math.max,St=Math.min,_t=function(t){return function(e,n,r){var o,i=P(e),c=bt(i.length),u=function(t,e){var n=gt(t);return n<0?wt(n+e,0):St(n,e)}(r,c);if(t&&n!=n){for(;c>u;)if((o=i[u++])!=o)return!0}else for(;c>u;u++)if((t||u in i)&&i[u]===n)return t||u||0;return!t&&-1}},Ot={includes:_t(!0),indexOf:_t(!1)}.indexOf,jt=function(t,e){var n,r=P(t),o=0,i=[];for(n in r)!W(nt,n)&&W(r,n)&&i.push(n);for(;e.length>o;)W(r,n=e[o++])&&(~Ot(i,n)||i.push(n));return i},Pt=["constructor","hasOwnProperty","isPrototypeOf","propertyIsEnumerable","toLocaleString","toString","valueOf"],Et=Pt.concat("length","prototype"),xt={f:Object.getOwnPropertyNames||function(t){return jt(t,Et)}},At={f:Object.getOwnPropertySymbols},Wt=ht("Reflect","ownKeys")||function(t){var e=xt.f($(t)),n=At.f;return n?e.concat(n(t)):e},Tt=function(t,e){for(var n=Wt(e),r=N.f,o=F.f,i=0;ig;g++)if((c||g in h)&&(p=v(l=h[g],g,d),t))if(e)b[g]=p;else if(p)switch(t){case 3:return!0;case 5:return l;case 6:return g;case 2:Jt.call(b,l)}else if(o)return!1;return i?-1:r||o?o:b}},Zt={forEach:Qt(0),map:Qt(1),filter:Qt(2),some:Qt(3),every:Qt(4),find:Qt(5),findIndex:Qt(6)},te=Object.keys||function(t){return jt(t,Pt)},ee=v?Object.defineProperties:function(t,e){$(t);for(var n,r=te(e),o=r.length,i=0;o>i;)N.f(t,n=r[i++],e[n]);return t},ne=ht("document","documentElement"),re=et("IE_PROTO"),oe=function(){},ie=function(t){return"