UNPKG

uikit

Version:

UIkit is a lightweight and modular front-end framework for developing fast and powerful web interfaces.

getuikit.com

uikit/uikit

3 lines (2 loc) • 13.8 kB
1
2
3
/*! UIkit 3.6.19 | https://www.getuikit.com | (c) 2014 - 2021 YOOtheme | MIT License */ !function(t,i){"object"==typeof exports&&"undefined"!=typeof module?module.exports=i(require("uikit-util")):"function"==typeof define&&define.amd?define("uikitslider",["uikit-util"],i):(t="undefined"!=typeof globalThis?globalThis:t||self).UIkitSlider=i(t.UIkit.util)}(this,function(v){"use strict";function s(t){return.5*t+300}function g(t,i){return void 0===t&&(t=0),void 0===i&&(i="%"),t+=t?i:"",v.isIE?"translateX("+t+")":"translate3d("+t+", 0, 0)"}function h(t,i,e){var s=p(t,i);return e?s-(e=t,t=i,v.dimensions(t).width/2-v.dimensions(e).width/2):Math.min(s,n(i))}function n(t){return Math.max(0,e(t)-v.dimensions(t).width)}function e(t){return v.children(t).reduce(function(t,i){return v.dimensions(i).width+t},0)}function p(t,i){return t&&(v.position(t).left+(v.isRtl?v.dimensions(t).width-v.dimensions(i).width:0))*(v.isRtl?-1:1)||0}function o(e,s){var n=--s+v.dimensions(e).width+2;return v.children(e).filter(function(t){var i=p(t,e),t=i+v.dimensions(t).width;return s<=i&&t<=n})}function m(t,i,e){v.trigger(t,v.createEvent(i,!1,!1,e))}var t={mixins:[{connected:function(){v.hasClass(this.$el,this.$name)||v.addClass(this.$el,this.$name)}},{mixins:[{props:{autoplay:Boolean,autoplayInterval:Number,pauseOnHover:Boolean},data:{autoplay:!1,autoplayInterval:7e3,pauseOnHover:!0},connected:function(){this.autoplay&&this.startAutoplay()},disconnected:function(){this.stopAutoplay()},update:function(){v.attr(this.slides,"tabindex","-1")},events:[{name:"visibilitychange",el:function(){return document},filter:function(){return this.autoplay},handler:function(){document.hidden?this.stopAutoplay():this.startAutoplay()}}],methods:{startAutoplay:function(){var t=this;this.stopAutoplay(),this.interval=setInterval(function(){return(!t.draggable||!v.$(":focus",t.$el))&&(!t.pauseOnHover||!v.matches(t.$el,":hover"))&&!t.stack.length&&t.show("next")},this.autoplayInterval)},stopAutoplay:function(){this.interval&&clearInterval(this.interval)}}},{props:{draggable:Boolean},data:{draggable:!0,threshold:10},created:function(){var s=this;["start","move","end"].forEach(function(t){var e=s[t];s[t]=function(t){var i=v.getEventPos(t).x*(v.isRtl?-1:1);s.prevPos=i!==s.pos?s.pos:s.prevPos,s.pos=i,e(t)}})},events:[{name:v.pointerDown,delegate:function(){return this.selSlides},handler:function(t){var i;!this.draggable||!v.isTouch(t)&&(!(i=t.target).children.length&&i.childNodes.length)||v.closest(t.target,v.selInput)||0<t.button||this.length<2||this.start(t)}},{name:"dragstart",handler:function(t){t.preventDefault()}}],methods:{start:function(){this.drag=this.pos,this._transitioner?(this.percent=this._transitioner.percent(),this.drag+=this._transitioner.getDistance()*this.percent*this.dir,this._transitioner.cancel(),this._transitioner.translate(this.percent),this.dragging=!0,this.stack=[]):this.prevIndex=this.index,v.on(document,v.pointerMove,this.move,{passive:!1}),v.on(document,v.pointerUp+" "+v.pointerCancel+" input",this.end,!0),v.css(this.list,"userSelect","none")},move:function(t){var i=this,e=this.pos-this.drag;if(!(0==e||this.prevPos===this.pos||!this.dragging&&Math.abs(e)<this.threshold)){v.css(this.list,"pointerEvents","none"),t.cancelable&&t.preventDefault(),this.dragging=!0,this.dir=e<0?1:-1;for(var s=this.slides,n=this.prevIndex,r=Math.abs(e),h=this.getIndex(n+this.dir,n),o=this._getDistance(n,h)||s[n].offsetWidth;h!==n&&o<r;)this.drag-=o*this.dir,n=h,r-=o,h=this.getIndex(n+this.dir,n),o=this._getDistance(n,h)||s[n].offsetWidth;this.percent=r/o;var d,a=s[n],t=s[h],e=this.index!==h,c=n===h;[this.index,this.prevIndex].filter(function(t){return!v.includes([h,n],t)}).forEach(function(t){v.trigger(s[t],"itemhidden",[i]),c&&(d=!0,i.prevIndex=n)}),(this.index===n&&this.prevIndex!==n||d)&&v.trigger(s[this.index],"itemshown",[this]),e&&(this.prevIndex=n,this.index=h,c||v.trigger(a,"beforeitemhide",[this]),v.trigger(t,"beforeitemshow",[this])),this._transitioner=this._translate(Math.abs(this.percent),a,!c&&t),e&&(c||v.trigger(a,"itemhide",[this]),v.trigger(t,"itemshow",[this]))}},end:function(){var t;v.off(document,v.pointerMove,this.move,{passive:!1}),v.off(document,v.pointerUp+" "+v.pointerCancel+" input",this.end,!0),this.dragging&&(this.dragging=null,this.index===this.prevIndex?(this.percent=1-this.percent,this.dir*=-1,this._show(!1,this.index,!0),this._transitioner=null):(t=(v.isRtl?this.dir*(v.isRtl?1:-1):this.dir)<0==this.prevPos>this.pos,this.index=t?this.index:this.prevIndex,t&&(this.percent=1-this.percent),this.show(0<this.dir&&!t||this.dir<0&&t?"next":"previous",!0))),v.css(this.list,{userSelect:"",pointerEvents:""}),this.drag=this.percent=null}}},{data:{selNav:!1},computed:{nav:function(t,i){t=t.selNav;return v.$(t,i)},selNavItem:function(t){t=t.attrItem;return"["+t+"],[data-"+t+"]"},navItems:function(t,i){return v.$$(this.selNavItem,i)}},update:{write:function(){var e=this;this.nav&&this.length!==this.nav.children.length&&v.html(this.nav,this.slides.map(function(t,i){return"<li "+e.attrItem+'="'+i+'"><a href></a></li>'}).join("")),this.navItems.concat(this.nav).forEach(function(t){return t&&(t.hidden=!e.maxIndex)}),this.updateNav()},events:["resize"]},events:[{name:"click",delegate:function(){return this.selNavItem},handler:function(t){t.preventDefault(),this.show(v.data(t.current,this.attrItem))}},{name:"itemshow",handler:"updateNav"}],methods:{updateNav:function(){var e=this,s=this.getValidIndex();this.navItems.forEach(function(t){var i=v.data(t,e.attrItem);v.toggleClass(t,e.clsActive,v.toNumber(i)===s),v.toggleClass(t,"uk-invisible",e.finite&&("previous"===i&&0===s||"next"===i&&s>=e.maxIndex))})}}}],props:{clsActivated:Boolean,easing:String,index:Number,finite:Boolean,velocity:Number,selSlides:String},data:function(){return{easing:"ease",finite:!1,velocity:1,index:0,prevIndex:-1,stack:[],percent:0,clsActive:"uk-active",clsActivated:!1,Transitioner:!1,transitionOptions:{}}},connected:function(){this.prevIndex=-1,this.index=this.getValidIndex(this.$props.index),this.stack=[]},disconnected:function(){v.removeClass(this.slides,this.clsActive)},computed:{duration:function(t,i){t=t.velocity;return s(i.offsetWidth/t)},list:function(t,i){t=t.selList;return v.$(t,i)},maxIndex:function(){return this.length-1},selSlides:function(t){return t.selList+" "+(t.selSlides||"> *")},slides:{get:function(){return v.$$(this.selSlides,this.$el)},watch:function(){this.$reset()}},length:function(){return this.slides.length}},events:{itemshown:function(){this.$update(this.list)}},methods:{show:function(t,i){var e=this;if(void 0===i&&(i=!1),!this.dragging&&this.length){var s=this.stack,n=i?0:s.length,r=function(){s.splice(n,1),s.length&&e.show(s.shift(),!0)};if(s[i?"unshift":"push"](t),!i&&1<s.length)2===s.length&&this._transitioner.forward(Math.min(this.duration,200));else{var h,o=this.getIndex(this.index),d=v.hasClass(this.slides,this.clsActive)&&this.slides[o],a=this.getIndex(t,this.index),c=this.slides[a];if(d!==c){if(this.dir=(h=o,"next"!==(t=t)&&("previous"===t||t<h)?-1:1),this.prevIndex=o,this.index=a,d&&!v.trigger(d,"beforeitemhide",[this])||!v.trigger(c,"beforeitemshow",[this,d]))return this.index=this.prevIndex,void r();i=this._show(d,c,i).then(function(){return d&&v.trigger(d,"itemhidden",[e]),v.trigger(c,"itemshown",[e]),new v.Promise(function(t){v.fastdom.write(function(){s.shift(),s.length?e.show(s.shift(),!0):e._transitioner=null,t()})})});return d&&v.trigger(d,"itemhide",[this]),v.trigger(c,"itemshow",[this]),i}r()}}},getIndex:function(t,i){return void 0===t&&(t=this.index),void 0===i&&(i=this.index),v.clamp(v.getIndex(t,this.slides,i,this.finite),0,this.maxIndex)},getValidIndex:function(t,i){return void 0===t&&(t=this.index),void 0===i&&(i=this.prevIndex),this.getIndex(t,i)},_show:function(t,i,e){if(this._transitioner=this._getTransitioner(t,i,this.dir,v.assign({easing:e?i.offsetWidth<600?"cubic-bezier(0.25, 0.46, 0.45, 0.94)":"cubic-bezier(0.165, 0.84, 0.44, 1)":this.easing},this.transitionOptions)),!e&&!t)return this._translate(1),v.Promise.resolve();t=this.stack.length;return this._transitioner[1<t?"forward":"show"](1<t?Math.min(this.duration,75+75/(t-1)):this.duration,this.percent)},_getDistance:function(t,i){return this._getTransitioner(t,t!==i&&i).getDistance()},_translate:function(t,i,e){void 0===i&&(i=this.prevIndex),void 0===e&&(e=this.index);e=this._getTransitioner(i!==e&&i,e);return e.translate(t),e},_getTransitioner:function(t,i,e,s){return void 0===t&&(t=this.prevIndex),void 0===i&&(i=this.index),void 0===e&&(e=this.dir||1),void 0===s&&(s=this.transitionOptions),new this.Transitioner(v.isNumber(t)?this.slides[t]:t,v.isNumber(i)?this.slides[i]:i,e*(v.isRtl?-1:1),s)}}},{update:{write:function(){var t;this.stack.length||this.dragging||(t=this.getValidIndex(this.index),~this.prevIndex&&this.index===t||this.show(t))},events:["resize"]}}],props:{center:Boolean,sets:Boolean},data:{center:!1,sets:!1,attrItem:"uk-slider-item",selList:".uk-slider-items",selNav:".uk-slider-nav",clsContainer:"uk-slider-container",Transitioner:function(a,c,l,t){var s=t.center,n=t.easing,u=t.list,r=new v.Deferred,i=a?h(a,u,s):h(c,u,s)+v.dimensions(c).width*l,f=c?h(c,u,s):i+v.dimensions(a).width*l*(v.isRtl?-1:1);return{dir:l,show:function(t,i,e){void 0===i&&(i=0);e=e?"linear":n;return t-=Math.round(t*v.clamp(i,-1,1)),this.translate(i),i=a?i:v.clamp(i,0,1),m(this.getItemIn(),"itemin",{percent:i,duration:t,timing:e,dir:l}),a&&m(this.getItemIn(!0),"itemout",{percent:1-i,duration:t,timing:e,dir:l}),v.Transition.start(u,{transform:g(-f*(v.isRtl?-1:1),"px")},t,e).then(r.resolve,v.noop),r.promise},cancel:function(){v.Transition.cancel(u)},reset:function(){v.css(u,"transform","")},forward:function(t,i){return void 0===i&&(i=this.percent()),v.Transition.cancel(u),this.show(t,i,!0)},translate:function(r){var t=this.getDistance()*l*(v.isRtl?-1:1);v.css(u,"transform",g(v.clamp(t-t*r-f,-e(u),v.dimensions(u).width)*(v.isRtl?-1:1),"px"));var h=this.getActives(),o=this.getItemIn(),d=this.getItemIn(!0);r=a?v.clamp(r,-1,1):0,v.children(u).forEach(function(t,i){var e=v.includes(h,t),s=t===o,n=t===d;m(t,"itemtranslate"+(s||!n&&(e||l*(v.isRtl?-1:1)==-1^p(t,u)>p(a||c))?"in":"out"),{dir:l,percent:n?1-r:s?r:e?1:0})})},percent:function(){return Math.abs((v.css(u,"transform").split(",")[4]*(v.isRtl?-1:1)+i)/(f-i))},getDistance:function(){return Math.abs(f-i)},getItemIn:function(t){void 0===t&&(t=!1);var i=this.getActives(),e=o(u,h(c||a,u,s));return t&&(t=i,i=e,e=t),e[v.findIndex(e,function(t){return!v.includes(i,t)})]},getActives:function(){return o(u,h(a||c,u,s))}}}},computed:{avgWidth:function(){return e(this.list)/this.length},finite:function(t){return t.finite||Math.ceil(e(this.list))<v.dimensions(this.list).width+(t=this.list,Math.max.apply(Math,[0].concat(v.children(t).map(function(t){return v.dimensions(t).width}))))+this.center},maxIndex:function(){if(!this.finite||this.center&&!this.sets)return this.length-1;if(this.center)return v.last(this.sets);var i=0,e=n(this.list),t=v.findIndex(this.slides,function(t){return e<=i||void(i+=v.dimensions(t).width)});return~t?t:this.length-1},sets:function(t){var n=this;if(t=t.sets){var r=v.dimensions(this.list).width/(this.center?2:1),h=0,o=r,d=0,t=v.sortBy(this.slides,"offsetLeft").reduce(function(t,i,e){var s=v.dimensions(i).width;return h<d+s&&(!n.center&&e>n.maxIndex&&(e=n.maxIndex),v.includes(t,e)||(i=n.slides[e+1],n.center&&i&&s<o-v.dimensions(i).width/2?o-=s:(o=r,t.push(e),h=d+r+(n.center?s/2:0)))),d+=s,t},[]);return!v.isEmpty(t)&&t}},transitionOptions:function(){return{center:this.center,list:this.list}}},connected:function(){v.toggleClass(this.$el,this.clsContainer,!v.$("."+this.clsContainer,this.$el))},update:{write:function(){var e=this;this.navItems.forEach(function(t){var i=v.toNumber(v.data(t,e.attrItem));!1!==i&&(t.hidden=!e.maxIndex||i>e.maxIndex||e.sets&&!v.includes(e.sets,i))}),!this.length||this.dragging||this.stack.length||(this.reorder(),this._translate(1));var i=this._getTransitioner(this.index).getActives();this.slides.forEach(function(t){return v.toggleClass(t,e.clsActive,v.includes(i,t))}),!this.clsActivated||this.sets&&!v.includes(this.sets,v.toFloat(this.index))||this.slides.forEach(function(t){return v.toggleClass(t,e.clsActivated||"",v.includes(i,t))})},events:["resize"]},events:{beforeitemshow:function(t){!this.dragging&&this.sets&&this.stack.length<2&&!v.includes(this.sets,this.index)&&(this.index=this.getValidIndex());var i=Math.abs(this.index-this.prevIndex+(0<this.dir&&this.index<this.prevIndex||this.dir<0&&this.index>this.prevIndex?(this.maxIndex+1)*this.dir:0));if(!this.dragging&&1<i){for(var e=0;e<i;e++)this.stack.splice(1,0,0<this.dir?"next":"previous");t.preventDefault()}else{t=this.dir<0||!this.slides[this.prevIndex]?this.index:this.prevIndex;this.duration=s(this.avgWidth/this.velocity)*(v.dimensions(this.slides[t]).width/this.avgWidth),this.reorder()}},itemshow:function(){~this.prevIndex&&v.addClass(this._getTransitioner().getItemIn(),this.clsActive)}},methods:{reorder:function(){var e=this;if(this.finite)v.css(this.slides,"order","");else{var s=0<this.dir&&this.slides[this.prevIndex]?this.prevIndex:this.index;if(this.slides.forEach(function(t,i){return v.css(t,"order",0<e.dir&&i<s?1:e.dir<0&&i>=e.index?-1:"")}),this.center)for(var t=this.slides[s],i=v.dimensions(this.list).width/2-v.dimensions(t).width/2,n=0;0<i;){var r=this.getIndex(--n+s,s),h=this.slides[r];v.css(h,"order",s<r?-2:-1),i-=v.dimensions(h).width}}},getValidIndex:function(t,i){if(void 0===t&&(t=this.index),void 0===i&&(i=this.prevIndex),t=this.getIndex(t,i),!this.sets)return t;var e;do{if(v.includes(this.sets,t))return t}while(e=t,(t=this.getIndex(t+this.dir,i))!==e);return t}}};return"undefined"!=typeof window&&window.UIkit&&window.UIkit.component("slider",t),t});