uikit
Version:
UIkit is a lightweight and modular front-end framework for developing fast and powerful web interfaces.
2 lines (1 loc) • 6.34 kB
JavaScript
/*! UIkit 3.14.1 | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */(function(r,m){typeof exports=="object"&&typeof module<"u"?module.exports=m(require("uikit-util")):typeof define=="function"&&define.amd?define("uikitparallax",["uikit-util"],m):(r=typeof globalThis<"u"?globalThis:r||self,r.UIkitParallax=m(r.UIkit.util))})(this,function(r){"use strict";var m={connected(){var e;this.registerObserver(r.observeResize(((e=this.$options.resizeTargets)==null?void 0:e.call(this))||this.$el,()=>this.$emit("resize")))}},B={connected(){V(this._uid,()=>this.$emit("scroll"))},disconnected(){q(this._uid)}};const y=new Map;let x;function V(e,t){x=x||r.on(window,"scroll",()=>y.forEach(n=>n()),{passive:!0,capture:!0}),y.set(e,t)}function q(e){y.delete(e),x&&!y.size&&(x(),x=null)}var H={props:{media:Boolean},data:{media:!1},connected(){const e=A(this.media);if(this.matchMedia=!0,e){this.mediaObj=window.matchMedia(e);const t=()=>{this.matchMedia=this.mediaObj.matches,r.trigger(this.$el,r.createEvent("mediachange",!1,!0,[this.mediaObj]))};this.offMediaObj=r.on(this.mediaObj,"change",()=>{t(),this.$emit("resize")}),t()}},disconnected(){var e;(e=this.offMediaObj)==null||e.call(this)}};function A(e){if(r.isString(e)){if(r.startsWith(e,"@")){const t="breakpoint-"+e.substr(1);e=r.toFloat(r.getCssVar(t))}else if(isNaN(e))return e}return e&&r.isNumeric(e)?"(min-width: "+e+"px)":""}r.memoize(async e=>e?r.startsWith(e,"data:")?decodeURIComponent(e.split(",")[1]):(await fetch(e)).text():Promise.reject());function G(e){return Math.ceil(Math.max(0,...r.$$("[stroke]",e).map(t=>{try{return t.getTotalLength()}catch{return 0}})))}const M={x:F,y:F,rotate:F,scale:F,color:j,backgroundColor:j,borderColor:j,blur:l,hue:l,fopacity:l,grayscale:l,invert:l,saturate:l,sepia:l,opacity:Q,stroke:X,bgx:C,bgy:C},{keys:S}=Object;var J={mixins:[H],props:L(S(M),"list"),data:L(S(M),void 0),computed:{props(e,t){return S(M).reduce((n,s)=>(r.isUndefined(e[s])||(n[s]=M[s](s,t,e[s].slice())),n),{})}},events:{load(){this.$emit()}},methods:{reset(){for(const e in this.getCss(0))r.css(this.$el,e,"")},getCss(e){const t={transform:"",filter:""};for(const n in this.props)this.props[n](t,e);return t}}};function F(e,t,n){let s=P(n)||{x:"px",y:"px",rotate:"deg"}[e]||"",o;return e==="x"||e==="y"?(e="translate"+r.ucfirst(e),o=a=>r.toFloat(r.toFloat(a).toFixed(s==="px"?0:6))):e==="scale"&&(s="",o=a=>P([a])?r.toPx(a,"width",t,!0)/t.offsetWidth:a),n.length===1&&n.unshift(e==="scale"?1:0),n=g(n,o),(a,c)=>{a.transform+=" "+e+"("+b(n,c)+s+")"}}function j(e,t,n){return n.length===1&&n.unshift(v(t,e,"")),n=g(n,s=>K(t,s)),(s,o)=>{const[a,c,i]=E(n,o),h=a.map((d,f)=>(d+=i*(c[f]-d),f===3?r.toFloat(d):parseInt(d,10))).join(",");s[e]="rgba("+h+")"}}function K(e,t){return v(e,"color",t).split(/[(),]/g).slice(1,-1).concat(1).slice(0,4).map(r.toFloat)}function l(e,t,n){n.length===1&&n.unshift(0);const s=P(n)||{blur:"px",hue:"deg"}[e]||"%";return e={fopacity:"opacity",hue:"hue-rotate"}[e]||e,n=g(n),(o,a)=>{const c=b(n,a);o.filter+=" "+e+"("+(c+s)+")"}}function Q(e,t,n){return n.length===1&&n.unshift(v(t,e,"")),n=g(n),(s,o)=>{s[e]=b(n,o)}}function X(e,t,n){n.length===1&&n.unshift(0);const s=P(n),o=G(t);return n=g(n.reverse(),a=>(a=r.toFloat(a),s==="%"?a*o/100:a)),n.some(a=>{let[c]=a;return c})?(r.css(t,"strokeDasharray",o),(a,c)=>{a.strokeDashoffset=b(n,c)}):r.noop}function C(e,t,n){n.length===1&&n.unshift(0),e=e.substr(-1);const s=e==="y"?"height":"width";n=g(n,a=>r.toPx(a,s,t));const o=v(t,"background-position-"+e,"");return v(t,"backgroundSize","")==="cover"?Y(e,t,n,o,s):D(e,n,o)}function Y(e,t,n,s,o){const a=Z(t);if(!a.width)return r.noop;const c=n.map(u=>{let[z]=u;return z}),i=Math.min(...c),h=Math.max(...c),d=c.indexOf(i)<c.indexOf(h),f=h-i;let R=(d?-f:0)-(d?i:h);const w={width:t.offsetWidth,height:t.offsetHeight},T=r.Dimensions.cover(a,w),O=T[o]-w[o];if(O<f)w[o]=T[o]+f-O;else if(O>f){const u=w[o]/r.toPx(s,o,t,!0);u&&(R-=(O-f)/u)}const _=r.Dimensions.cover(a,w),U=D(e,n,R+"px");return(u,z)=>{U(u,z),u.backgroundSize=_.width+"px "+_.height+"px",u.backgroundRepeat="no-repeat"}}function D(e,t,n){return function(s,o){s["background-position-"+e]="calc("+n+" + "+b(t,o)+"px)"}}const $={};function Z(e){const t=r.css(e,"backgroundImage").replace(/^none|url\(["']?(.+?)["']?\)$/,"$1");if($[t])return $[t];const n=new Image;return t&&(n.src=t,!n.naturalWidth)?(n.onload=()=>{$[t]=I(n),r.trigger(e,r.createEvent("load",!1))},I(n)):$[t]=I(n)}function I(e){return{width:e.naturalWidth,height:e.naturalHeight}}function g(e,t){t===void 0&&(t=r.toFloat);const n=[],{length:s}=e;let o=0;for(let a=0;a<s;a++){let[c,i]=r.isString(e[a])?e[a].trim().split(" "):[e[a]];if(c=t(c),i=i?r.toFloat(i)/100:null,a===0?i===null?i=0:i&&n.push([c,0]):a===s-1&&(i===null?i=1:i!==1&&(n.push([c,i]),i=1)),n.push([c,i]),i===null)o++;else if(o){const h=n[a-o-1][1],d=(i-h)/(o+1);for(let f=o;f>0;f--)n[a-f][1]=h+d*(o-f+1);o=0}}return n}function E(e,t){const n=r.findIndex(e.slice(1),s=>{let[,o]=s;return t<=o})+1;return[e[n-1][0],e[n][0],(t-e[n-1][1])/(e[n][1]-e[n-1][1])]}function b(e,t){const[n,s,o]=E(e,t);return r.isNumber(n)?n+Math.abs(n-s)*o*(n<s?1:-1):+s}const p=/^-?\d+(\S*)/;function P(e,t){for(const n of e){const s=n.match==null?void 0:n.match(p);if(s)return s[1]}return t}function v(e,t,n){const s=e.style[t],o=r.css(r.css(e,t,n),t);return e.style[t]=s,o}function L(e,t){return e.reduce((n,s)=>(n[s]=t,n),{})}var N={mixins:[J,m,B],props:{target:String,viewport:Number,easing:Number,start:String,end:String},data:{target:!1,viewport:1,easing:1,start:0,end:0},computed:{target(e,t){let{target:n}=e;return W(n&&r.query(n,t)||t)},start(e){let{start:t}=e;return r.toPx(t,"height",this.target,!0)},end(e){let{end:t,viewport:n}=e;return r.toPx(t||(n=(1-n)*100)&&n+"vh+"+n+"%","height",this.target,!0)}},update:{read(e,t){let{percent:n}=e;if(t.has("scroll")||(n=!1),!this.matchMedia)return;const s=n;return n=k(r.scrolledOver(this.target,this.start,this.end),this.easing),{percent:n,style:s===n?!1:this.getCss(n)}},write(e){let{style:t}=e;if(!this.matchMedia){this.reset();return}t&&r.css(this.$el,t)},events:["scroll","resize"]}};function k(e,t){return t>=0?Math.pow(e,t+1):1-Math.pow(1-e,-t+1)}function W(e){return e?"offsetTop"in e?e:W(r.parent(e)):document.documentElement}return typeof window<"u"&&window.UIkit&&window.UIkit.component("parallax",N),N});