UNPKG

uikit

Version:

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

3 lines (2 loc) • 6.05 kB
/*! UIkit 3.6.19 | https://www.getuikit.com | (c) 2014 - 2021 YOOtheme | MIT License */ !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("uikit-util")):"function"==typeof define&&define.amd?define("uikitslider_parallax",["uikit-util"],e):(t="undefined"!=typeof globalThis?globalThis:t||self).UIkitSlider_parallax=e(t.UIkit.util)}(this,function(b){"use strict";var t={props:{media:Boolean},data:{media:!1},computed:{matchMedia:function(){var t=function(t){if(b.isString(t))if("@"===t[0]){var e="breakpoint-"+t.substr(1);t=b.toFloat(b.getCssVar(e))}else if(isNaN(t))return t;return!(!t||isNaN(t))&&"(min-width: "+t+"px)"}(this.media);return!t||window.matchMedia(t).matches}}};b.memoize(function(r){return new b.Promise(function(e,t){r?b.startsWith(r,"data:")?e(decodeURIComponent(r.split(",")[1])):b.ajax(r).then(function(t){return e(t.response)},function(){return t("SVG not found.")}):t()})});var e=["x","y","bgx","bgy","rotate","scale","color","backgroundColor","borderColor","opacity","blur","hue","grayscale","invert","saturate","sepia","fopacity","stroke"];function h(t,e){var r=t.length-1,n=Math.min(Math.floor(r*e),r-1),n=t.slice(n,n+2);return n.push(1===e?1:e%(1/r)*r),n}t={mixins:[{mixins:[t],props:e.reduce(function(t,e){return t[e]="list",t},{}),data:e.reduce(function(t,e){return t[e]=void 0,t},{}),computed:{props:function(p,m){var g=this;return e.reduce(function(t,e){if(b.isUndefined(p[e]))return t;var r,n,i=e.match(/color/i),a=i||"opacity"===e,s=p[e].slice();a&&b.css(m,e,""),s.length<2&&s.unshift(("scale"===e?1:a?b.css(m,e):0)||0);var o,c,u,l,d,f,a=s.reduce(function(t,e){return b.isString(e)&&e.replace(/-|\d/g,"").trim()||t},"");if(i?(f=m.style.color,s=s.map(function(t){return e=m,t=t,b.css(b.css(e,"color",t),"color").split(/[(),]/g).slice(1,-1).concat(1).slice(0,4).map(b.toFloat);var e}),m.style.color=f):b.startsWith(e,"bg")?(o="bgy"===e?"height":"width",s=s.map(function(t){return b.toPx(t,o,g.$el)}),b.css(m,"background-position-"+e[2],""),n=b.css(m,"backgroundPosition").split(" ")["x"===e[2]?0:1],r=g.covers?(c=Math.min.apply(Math,s),u=Math.max.apply(Math,s),l=s.indexOf(c)<s.indexOf(u),d=u-c,s=s.map(function(t){return t-(l?c:u)}),(l?-d:0)+"px"):n):s=s.map(b.toFloat),"stroke"===e){if(!s.some(function(t){return t}))return t;var h=(f=g.$el,Math.ceil(Math.max.apply(Math,[0].concat(b.$$("[stroke]",f).map(function(t){try{return t.getTotalLength()}catch(t){return 0}})))));b.css(m,"strokeDasharray",h),s=(s="%"===a?s.map(function(t){return t*h/100}):s).reverse(),e="strokeDashoffset"}return t[e]={steps:s,unit:a,pos:r,bgPos:n,diff:d},t},{})},bgProps:function(){var e=this;return["bgx","bgy"].filter(function(t){return t in e.props})},covers:function(t,e){return n=(r=e).style.backgroundSize,e="cover"===b.css(b.css(r,"backgroundSize",""),"backgroundSize"),r.style.backgroundSize=n,e;var r,n}},disconnected:function(){delete this._image},update:{read:function(t){var e,r,o,c,u,l=this;this.matchMedia&&(t.image||!this.covers||!this.bgProps.length||(e=b.css(this.$el,"backgroundImage").replace(/^none|url\(["']?(.+?)["']?\)$/,"$1"))&&((r=new Image).src=e,(t.image=r).naturalWidth||(r.onload=function(){return l.$update()})),(r=t.image)&&r.naturalWidth&&(o={width:this.$el.offsetWidth,height:this.$el.offsetHeight},c={width:r.naturalWidth,height:r.naturalHeight},u=b.Dimensions.cover(c,o),this.bgProps.forEach(function(t){var e,r=l.props[t],n=r.diff,i=r.bgPos,a=r.steps,r="bgy"===t?"height":"width",s=u[r]-o[r];s<n?o[r]=u[r]+n-s:n<s&&((e=o[r]/b.toPx(i,r,l.$el))&&(l.props[t].steps=a.map(function(t){return t-(s-n)/e}))),u=b.Dimensions.cover(c,o)}),t.dim=u))},write:function(t){t=t.dim;this.matchMedia?t&&b.css(this.$el,{backgroundSize:t.width+"px "+t.height+"px",backgroundRepeat:"no-repeat"}):b.css(this.$el,{backgroundSize:"",backgroundRepeat:""})},events:["resize"]},methods:{reset:function(){var r=this;b.each(this.getCss(0),function(t,e){return b.css(r.$el,e,"")})},getCss:function(d){var f=this.props;return Object.keys(f).reduce(function(t,e){var r=f[e],n=r.steps,i=r.unit,a=r.pos,s=function(t,e,r){void 0===r&&(r=2);var n=h(t,e),t=n[0],e=n[1],n=n[2];return(b.isNumber(t)?t+Math.abs(t-e)*n*(t<e?1:-1):+e).toFixed(r)}(n,d);switch(e){case"x":case"y":i=i||"px",t.transform+=" translate"+b.ucfirst(e)+"("+b.toFloat(s).toFixed("px"===i?0:2)+i+")";break;case"rotate":i=i||"deg",t.transform+=" rotate("+(s+i)+")";break;case"scale":t.transform+=" scale("+s+")";break;case"bgy":case"bgx":t["background-position-"+e[2]]="calc("+a+" + "+s+"px)";break;case"color":case"backgroundColor":case"borderColor":var o=h(n,d),c=o[0],u=o[1],l=o[2];t[e]="rgba("+c.map(function(t,e){return t+=l*(u[e]-t),3===e?b.toFloat(t):parseInt(t,10)}).join(",")+")";break;case"blur":i=i||"px",t.filter+=" blur("+(s+i)+")";break;case"hue":i=i||"deg",t.filter+=" hue-rotate("+(s+i)+")";break;case"fopacity":i=i||"%",t.filter+=" opacity("+(s+i)+")";break;case"grayscale":case"invert":case"saturate":case"sepia":i=i||"%",t.filter+=" "+e+"("+(s+i)+")";break;default:t[e]=s}return t},{transform:"",filter:""})}}}],data:{selItem:"!li"},computed:{item:function(t,e){t=t.selItem;return b.query(t,e)}},events:[{name:"itemin itemout",self:!0,el:function(){return this.item},handler:function(t){var r=this,n=t.type,t=t.detail,i=t.percent,a=t.duration,s=t.timing,o=t.dir;b.fastdom.read(function(){var t=r.getCss(u(n,o,i)),e=r.getCss(c(n)?.5:0<o?1:0);b.fastdom.write(function(){b.css(r.$el,t),b.Transition.start(r.$el,e,a,s).catch(b.noop)})})}},{name:"transitioncanceled transitionend",self:!0,el:function(){return this.item},handler:function(){b.Transition.cancel(this.$el)}},{name:"itemtranslatein itemtranslateout",self:!0,el:function(){return this.item},handler:function(t){var e=this,r=t.type,t=t.detail,n=t.percent,i=t.dir;b.fastdom.read(function(){var t=e.getCss(u(r,i,n));b.fastdom.write(function(){return b.css(e.$el,t)})})}}]};function c(t){return b.endsWith(t,"in")}function u(t,e,r){return r/=2,c(t)?e<0?1-r:r:e<0?r:1-r}return"undefined"!=typeof window&&window.UIkit&&window.UIkit.component("sliderParallax",t),t});