nodality 1.0.0-beta.3 → 1.0.0-beta.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bundle.umd.js +1 -1
- package/dist/designer.cjs.js +1 -1
- package/dist/designer.esm.js +1 -1
- package/dist/elementMapper.cjs.js +1 -1
- package/dist/elementMapper.esm.js +1 -1
- package/dist/finalresult.esm.js +1 -1
- package/dist/index.cjs.js +1 -1
- package/dist/index.esm.js +1 -1
- package/dist/sideNavBar.cjs.js +1 -1
- package/dist/sideNavBar.esm.js +1 -1
- package/layout/sideNavBar.js +2 -2
- package/lib/elementMapper.js +1 -1
- package/package.json +1 -1
package/dist/sideNavBar.cjs.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(()=>{"use strict";var t={d:(e,s)=>{for(var i in s)t.o(s,i)&&!t.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:s[i]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};t.r(e),t.d(e,{SideNav:()=>i});class s{constructor(){this.state={isExpanded:!1,isMovedUp:!1,isMovedDown:!1}}keySet(t){return this.temporaryVal=1,this.res.style[t.key]=t.value,this}onScroll(t){"opacity"===t.value?this.res.style.opacity=t.valMin:"scale"===t.value&&(this.res.style.transform=`scale(${t.valMax})`),window.addEventListener("scroll",(()=>{let e=this.smartRange(window.scrollY,{min:t.from,max:t.to},{min:t.valMin,max:t.valMax});"opacity"===t.value?this.res.style.opacity=e:"scale"===t.value&&(this.res.style.transform=`scale(${e})`)}))}setAny(t){this[Object.keys(t)[0]]=[Object.values(t)[0]]}setID(t){this.id=t}setPrevText(t){this.prevText=t}getCSS(){return this.css}getPX(t){return{xs:"0px",sm:"576px",md:"768px",lg:"992px",xl:"1200px",xxl:"1400px",mxxl:"1800px"}[t]||"Invalid breakpoint"}respad(t){const e=()=>{this.pad(t[0].values);for(let e=0;e<t.length;e++){let s=t[e].breakpoint;window.matchMedia(`(min-width: ${this.getPX(s)}`).matches&&this.pad(t[e].values)}};window.addEventListener("resize",e),e()}resmar(t){const e=()=>{this.mar(t[0].values);for(let e=0;e<t.length;e++){let s=t[e].breakpoint;window.matchMedia(`(max-width: ${this.getPX(s)}`).matches&&this.mar(t[e].values)}};window.addEventListener("resize",e),e()}resprop(t){this.prevBackground=this.res.style.background,this.prevWidth=this.res.style.width,this.prevHeight=this.res.style.height,this.prevBorder=this.res.style.border;const e=()=>{this.res.style.background=this.prevBackground,this.res.style.width=this.prevWidth,this.res.style.height=this.prevHeight,this.res.style.border=this.prevBorder;for(let e=0;e<t.length;e++){let s=t[e].breakpoint;if(window.matchMedia(`(max-width: ${this.getPX(s)}`).matches){const s={};for(const i in t[e])"breakpoint"!==i&&(s[i]=t[e][i]);this.set(s)}}};window.addEventListener("resize",e),e()}isNumber(t){return"number"==typeof t&&!isNaN(t)}pad(t){for(let e=0;e<t.length;e++){let s=Object.keys(t[e]);for(let i=0;i<s.length;i++){let r=s[i],o=t[e][r];for(let t=0;t<r.length;t++)switch(r[t]){case"a":this.res.style.padding=this.isNumber(o)?`${o}px`:o;break;case"t":this.res.style.paddingTop=this.isNumber(o)?`${o}px`:o;break;case"l":this.res.style.paddingLeft=this.isNumber(o)?`${o}px`:o;break;case"r":this.res.style.paddingRight=this.isNumber(o)?`${o}px`:o;break;case"b":this.res.style.paddingBottom=this.isNumber(o)?`${o}px`:o}}}return this}as(t){return this.res.style.alignSelf=t,this}mar(t){for(let e=0;e<t.length;e++){let s=Object.keys(t[e]);for(let i=0;i<s.length;i++){let r=s[i],o=t[e][r];for(let t=0;t<r.length;t++){switch(r[t]){case"a":this.res.style.margin=this.isNumber(o)?`${o}px`:o;break;case"t":this.res.style.marginTop=this.isNumber(o)?`${o}px`:o;break;case"l":this.res.style.marginLeft=this.isNumber(o)?`${o}px`:o;break;case"r":this.res.style.marginRight=this.isNumber(o)?`${o}px`:o;break;case"b":this.res.style.marginBottom=this.isNumber(o)?`${o}px`:o}"auto"===r[t]&&(this.res.style.marginLeft="auto",this.res.style.marginRight="auto")}}}return this}smartRange(t,e,s){t<e.min&&(t=e.min),t>e.max&&(t=e.max);let i=(t-e.min)/(e.max-e.min);e.min>e.max&&(i=(t-e.max)/(e.min-e.max));let r=(s.min-s.max)*i-s.min;if(r=Math.abs(r),s.min<s.max){let t=(s.max+Math.abs(s.min))*i;r=s.min+t}return r}gpos(t){return this.res.style.gridColumn=t.col,this.res.style.gridRow=t.row,this}fluidCopy(t){if(t instanceof Object){this.prevStylex=this.res.style,this.res=document.createElement("h1"),this.res.style.cssText=this.prevStylex.cssText;let e=document.createTextNode(this.text);return this.res.appendChild(e),this.res.style.fontSize=t.exact,this}if("S1"===t){this.prevStylex=this.res.style,this.res=document.createElement("h1"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.625rem + 5.075vw)"}if("S2"===t){this.prevStylex=this.res.style,this.res=document.createElement("h2"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.500rem + 4.3vw)"}if("S3"===t){this.prevStylex=this.res.style,this.res=document.createElement("h3"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.375rem + 3.525vw)"}if("S4"===t){this.prevStylex=this.res.style,this.res=document.createElement("h4"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.250rem + 2.75vw)"}if("S5"===t){this.prevStylex=this.res.style,this.res=document.createElement("h5"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.125rem + 1.975vw)"}return"S6"===t&&(this.res.style.fontSize="calc(1rem + 0.5vw)"),this}setIndex(t){this.index=t}borderObj(t){let e=t.type??"solid";return this.res.style.border=`${t.width} ${e} ${t.color}`,this.res.style.borderRadius=t.radius,this}protoReact(t,e){t.sort(((t,e)=>parseInt(t.range[0])-parseInt(e.range[0])));const s=()=>{const s=window.innerWidth;let i="";this.storedQueries=t.map((t=>t.target)).filter((t=>null!=t));for(const o of t){this.counterIndex++;const[t,a]=o.range,n=parseInt(t),l=parseInt(a);let h=!0;if(o.target){h=!1;for(var r=0;r<o.target.length;r++)o.target[r]===e&&(h=!0)}s>=n&&s<=l&&h&&("gradient"===o.log&&(i+="gradient"),"blast"===o.log&&(i+="blast"),"animation"===o.log&&(i+="animation"),"shadow"===o.log&&(i+="shadow"),"span"===o.log&&(i+="span"),"filter"===o.log&&(i+="filter"),"background"===o.log&&(i+="background"))}this.res.style.margin="";let o=this.res.style.color;for(t.map((t=>t.log)).filter((t=>null!=t)).includes("gradient")&&(this.res.style.WebkitBackgroundClip="",this.res.style.background=""),this.res.style["-webkit-text-stroke"]="",this.res.style.filter="",this.res.style.textShadow="",this.res.style.border="";this.res.firstChild;)this.res.removeChild(this.res.firstChild);if(this.res.textContent=this.text,""===i&&(this.res.style["-webkit-text-fill-color"]="",this.res.style.color=o),"blast"===i){for(r=0;r<t.length;r++){const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}for(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke"]=this.globalBlast,r=0;r<t.length;r++){const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}}if("gradient"===i&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["-webkit-background-clip"]="text",this.res.style.border="1px solid orange"),"background"===i&&(this.res.style.background="orange"),"gradientblast"===i&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["-webkit-background-clip"]="text",this.res.style["-webkit-text-stroke"]=this.globalBlast),"gradientanimation"===i&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["-webkit-background-clip"]="text"),"gradientanimationshadow"===i&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["-webkit-background-clip"]="text",this.res.style.textShadow=this.globalShadow),"animationshadow"===i&&(this.res.style["-webkit-text-fill-color"]="",this.res.style.textShadow=this.globalShadow),"shadow"===i&&(this.res.style["-webkit-text-fill-color"]="",this.res.style.textShadow=this.globalShadow),"span"===i&&this.options.span){let t;for(t=Array.isArray(this.options.span)?this.options.span.filter((t=>"span"===t.op.name))[0]:this.options.span,this.res.textContent="",r=0;r<t.op.parts.length;r++){let e=t.op.parts[r].style,s=new Text(t.op.parts[r].text).setup({type:"span"}).set(e).render();this.res.appendChild(s)}}if("filter"===i){let t=this.options.filtera.op.filter;this.res.style.filter=t,this.res.style.border="8px solid orange"}};window.addEventListener("resize",s),s()}setPref(t){this.preffersId=t}setClass(t){this.class=t}betaReact(t,e){this.ap=!1,this.cta=0,this.once=!1,t.sort(((t,e)=>parseInt(t.range[0])-parseInt(e.range[0])));const s=()=>{const s=window.innerWidth;let i="";this.resCopy=this.res,this.storedQueries=t.map((t=>t.target)).filter((t=>null!=t));for(const o of t){this.counterIndex++;const[t,a]=o.range,n=parseInt(t),l=parseInt(a);let h=!0;if(o.target){h=!1;for(var r=0;r<o.target.length;r++)o.target[r]===e&&(h=!0)}s>=n&&s<=l&&h&&("blast"===o.log&&(i+="blast"),"shadow"===o.log&&(i+="shadow"),"background"===o.log&&(i+="background"),"gradient"===o.log&&(i+="gradient"),"spana"===o.log&&(i+="spana"),"layout"===o.log&&(i+="layout"),"margin"===o.log&&(i+="margin"),o.op&&o.op.margin&&(this.useMargin=o.op.margin))}if(this.res.style.background="",this.res.style.backgroundColor="",this.res.style.textShadow="",this.res.style.border="",this.res.style.margin="",this.res.style["-webkit-text-fill-color"]="",this.res.style["-webkit-text-stroke"]="",this.res.style["-webkit-text-stroke-width"]="","background"===i&&(this.res.style.backgroundColor="green"),"margin"===i)for(r=0;r<t.length;r++){if(!t[r].op)continue;const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}if("blastbackgroundmargin"===i){for(r=0;r<t.length;r++){if(!t[r].op)continue;const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}this.res.style.backgroundColor="green","FlexRowLayoutElement"===this.getType()?this.res.style.border="1px solid orange":(this.res.textContent=this.text,this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"),this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"}if("blastbackground"===i){for(r=0;r<t.length;r++){if(!t[r].op)continue;const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}this.res.style.backgroundColor="green",this.useMargin?this.res.style.margin="1rem":this.res.setAttribute("id","iofhwoiefhoih"),"FlexRowLayoutElement"===this.getType()?this.res.style.border="1px solid orange":(this.res.textContent=this.text,this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"),this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"}if("layout"===i&&(this.res.style.alignSelf="start",this.res.style.border="1px solid purple"),"blast"===i){for(r=0;r<t.length;r++){if(!t[r].op)continue;const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}"FlexRowLayoutElement"===this.getType()?this.res.style.border="1px solid orange":(this.res.textContent=this.text,this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-background-clip"]="text",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"),this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"}"blastgradientbackground"===i&&(this.res.style.border="1px solid yellow",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"),"gradient"===i&&(this.res.style.background="linear-gradient(to left, #3498db, #1abc9c)","FlexRowLayoutElement"===this.getType()||(this.res.children[0]&&this.res.removeChild(this.res.children[0]),this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-background-clip"]="text",this.res.textContent=this.text)),"shadow"===i&&("FlexRowLayoutElement"===this.getType()||(this.res.children[0]&&this.res.removeChild(this.res.children[0]),this.res.style["-webkit-text-fill-color"]="",this.res.style["-webkit-text-fill-color"]="",this.res.style.textShadow="#1abc9cff -6px 6px , #1abc9c40 -12px 12px",this.res.textContent=this.text))};window.addEventListener("resize",s),s()}cssGen(t,e,s,i){return this.css=[""],[""]}chainReact(t,e,s){this.cssGen(t,e,this.class,void 0!==this.class),this.ap=!1,this.cta=0,this.once=!1;for(let e of t)e.range||(e.range=["0px","999999px"]);t.sort(((t,e)=>parseInt(t.range[0])-parseInt(e.range[0])));const i=()=>{const i=window.visualViewport.width;let r=[],o=[];this.resCopy=this.res,this.storedQueries=t.map((t=>t.target)).filter((t=>null!=t));for(const s of t){this.counterIndex++;const[t,n]=s.range,l=parseInt(t),h=parseInt(n);let d=!0;if(s.target){d=!1;for(var a=0;a<s.target.length;a++)s.target[a]===e&&(d=!0)}i>=l&&i<=h&&d&&(r.push(s.log),o.push(s),s.op&&s.op.margin&&(this.useMargin=s.op.margin))}if(s&&!s.includes("background")&&(this.res.style.background="",this.res.style.backgroundColor=""),this.res.style.textShadow="",s&&!s.includes("border")&&(this.res.style.border=""),s&&!s.includes("margin")&&(this.res.style.margin=""),this.res.style["-webkit-text-fill-color"]="",this.res.style["-webkit-text-stroke-color"]="",this.res.style["-webkit-text-stroke-width"]="",this.res.style.filter="",(r.includes("gradient")||r.includes("shadow"))&&(this.res.style.position="relative",this.res.style.zIndex=-1),r.includes("blast")){let t=o.filter((t=>"blast"===t.log))[0].op.color,e=o.filter((t=>"blast"===t.log))[0].op.width??"1px";"FlexRowLayoutElement"===this.getType()?this.res.style.border=`${e}px solid orange`:(this.res.textContent=this.text,this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]=t,this.res.style["-webkit-text-stroke-width"]=`${e}`)}if(r.includes("filter")){let t=o.filter((t=>"filter"===t.log))[0].op.filter;this.res.style.filter=t}if(r.includes("background")&&(this.res.style.backgroundColor="green"),r.includes("gradient")&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["background-clip"]="text"),r.includes("shadow"))if("FlexRowLayoutElement"===this.getType());else{let t="",e=0;for(a=0;a<this.options.shadow.op.steps;a++)e+=3,t+=`drop-shadow(${e}px ${e}px ${e}px gray) `;this.res.style.filter=t}if(r.includes("margin"))for(a=0;a<t.length;a++){if(!t[a].op)continue;const e=t[a].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}if(r.includes("animation")){if(this.options.animation&&!this.hasAnimated&&!this.options.animation.op.fireAt){this.hasAnimated=!0;let t=this.options.animation.op;this.res.animate(t.keyframesClose,{duration:0,fill:"forwards"}),this.res.animate(t.keyframesOpen,t.openOptions)}if(this.options.animation&&this.options.animation.op.fireAt&&this.options.animation.op.fireAt.endsWith("px")){let t=this.options.animation.op;this.res.animate(t.keyframesClose,{duration:0,fill:"forwards"});const e=()=>{window.scrollY>parseFloat(t.fireAt)&&(this.res.animate(t.keyframesOpen,t.openOptions),window.removeEventListener("scroll",e))};window.addEventListener("scroll",e)}if(this.options.animation&&this.options.animation.op.fireAt&&"inview"===this.options.animation.op.fireAt){let t=this.options.animation.op;this.res.animate(t.keyframesClose,{duration:0,fill:"forwards"}),new IntersectionObserver(((e,s)=>{e.forEach((e=>{e.isIntersecting&&(this.res.animate(t.keyframesOpen,t.openOptions),s.disconnect())}))})).observe(this.res)}}};window.addEventListener("resize",i),i()}reactOnTransform=t=>{if(t.transform||t.op&&t.op.transform){let e=t.transform;t.transform||(e=t.op.transform),e.duration||(e.duration="3s-ease-in-out"),this.setDefault=(t,e="0px")=>0===t.length?e+" ":t;const s=t=>{const e=t.match(/rotate\(([^)]+)\)/);if(!e)return t;const s=e[1].split(",").map((t=>t.trim()));return 1===s.length?`rotate(${s[0]})`:2===s.length?`rotateX(${s[0]}) rotateY(${s[1]})`:3===s.length?`rotateX(${s[0]}) rotateY(${s[1]}) rotate(${s[2]})`:t},i=()=>{let i="",r="",o="",a="",n="",l="",h="",d="",p="";if(0===e.values.length)return;e.values.forEach((t=>{t.startsWith("tx:")&&(i=t.replace("tx:","")),t.startsWith("ty:")&&(r=t.replace("ty:","")),t.startsWith("tz:")?o=t.replace("tz:",""):t.startsWith("scale(")?a=t:t.startsWith("skew(")?n=t:t.startsWith("rotate(")?l=s(t):t.startsWith("perspective(")?h=t:t.startsWith("matrix(")?d=t:t.startsWith("opacity:")&&(p=t.replace("opacity:",""))})),i=this.setDefault(i),r=this.setDefault(r),o=this.setDefault(o);let c="";if("0px"!=r&&"0px"!=i&&"0px"!=o?c+=`translate3d(${i}, ${r}, ${o})`:"0px"==r&&"0px"==i||(c+=`translate(${i}, ${r})`),a&&(c+=` ${a}`),l&&(c+=` ${l}`),n&&(c+=` ${n}`),h&&(c+=` ${h}`),d&&(c+=` ${d}`),c){if(t.op.transform.duration){let e=t.op.transform.duration.replace(/^(\d+)(s)-/,((t,e,s)=>e/2+s+" ")),s=`transform ${e}, opacity ${e}`;this.res.style.transition=s}else this.res.style.transition="transform 3s ease-in-out, opacity 3s ease-in-out";this.res.style.transform=c,this.res.style.opacity=p}};e.on?this.res.addEventListener(e.on,(()=>{e.delay?setTimeout((()=>{i()}),e.delay):i()})):window.addEventListener("load",(()=>{e.delay?setTimeout((()=>{i()}),e.delay):i()}));const r=()=>{let t="";e.values.forEach((e=>{e.startsWith("tx:")?t+="translateX(0) ":e.startsWith("ty:")?t+="translateY(0) ":e.startsWith("tz:")?t+="translateZ(0) ":e.startsWith("scale(")?t+="scale(1) ":e.startsWith("skew(")?t+="skew(0, 0) ":e.startsWith("rotate(")?t+="rotate(0) ":e.startsWith("perspective(")?t+="perspective(0) ":e.startsWith("matrix(")&&(t+="matrix(1, 0, 0, 1, 0, 0) "),this.res.style.opacity="1"})),t&&(this.res.style.transform=t.trim())};if(e.on)this.res.addEventListener("mouseout",(()=>{e.keep||r()}));else{let t=1e3*parseFloat(e.duration),s=e.closeAfter?e.closeAfter:0;setTimeout((()=>{e.keep||r()}),t/2+s)}}};maxWidth(t){return this.res.style.maxWidth=t,this}removeQuotesFromFirstWord(t){return t.replace(/"([^"]+)":/g,"$1:")}arrayMargin(t,e){return t.includes("left")&&(this.res.style.marginLeft=e),t.includes("right")&&(this.res.style.marginRight=e),t.includes("top")&&(this.res.style.marginTop=e),t.includes("bottom")&&(this.res.style.marginBottom=e),t.includes("all")&&(this.res.style.margin=e),e||(this.res.style.marginBottom=t),this}navBarExpand(){return this.res.style.backgroundColor="green",this.res.animate([{transform:"scaleY(3.0)"}],{duration:2e3,iterations:1,fill:"both"}),this}scrollFade(t,e){return this.res.style.visibility="hidden",this.faden(t,e,"scroll"),this}expand(t){return!1===this.state.isExpanded?"click"===t.on?this.res.addEventListener("click",(()=>{this.innerExpand(t)})):this.innerExpand(t):this.innerExpandBack(t),this.state.isExpanded=!this.state.isExpanded,this}move(t){return"click"===t.on?this.res.addEventListener("click",(()=>{this.moveUpa(t)})):("up"===t.direction&&this.moveUpa(t),"down"===t.direction&&this.moveDowna(t),this.state.isMovedUp=!this.state.isMovedUp,"left"===t.direction&&this.moveLeft(t)),this}moveLeft(t){return this.res.animate([{transform:"translateX(0px)"},{transform:`translateX(-${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play(),this}moveUpa(t){return!1===this.state.isMovedUp?this.res.animate([{transform:"translateX(0px)"},{transform:`translateY(-${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play():this.res.animate([{transform:"translateX(0px)"},{transform:`translateY(${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play(),this}moveDowna(t){return!1===this.state.isMovedDown?this.res.animate([{transform:"translateX(0px)"},{transform:`translateY(${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play():this.res.animate([{transform:"translateX(0px)"},{transform:`translateY(-${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play(),this}moveUpaBack(t){return this.res.animate([{transform:"translateX(0px)"}],{duration:900,iterations:t.iterations,fill:"both"}).play(),this}innerExpandBack(t){this.res.animate([{width:this.prevWidth,height:this.prevHeight}],{duration:900,iterations:t.iterations,fill:"both"})}innerExpand(t){return this.prevWidth=this.res.style.width,this.prevHeight=this.res.style.height,this.res.animate([{width:this.prevWidth,height:this.prevHeight},{width:t.width??this.prevWidth,height:t.height??this.prevHeight}],{duration:900,iterations:t.iterations,fill:"both"}),this}fade(t){return this.res.style.visibility="hidden",this.faden(t.duration,t.from,"load"),t.finalOpacity&&(this.finalOpacity=t.finalOpacity),this}faden(t,e,s){return this.res.style.visibility="hidden",this.scrolled=!1,window.addEventListener(s,(()=>{this.res.style.visibility="visible";var i=window.innerHeight;(this.res.getBoundingClientRect().top-i<=0||"load"==s)&&0==this.scrolled&&("left"==e&&this.res.animate([{transform:"translateX(-30px)"},{transform:"translateX(0px)"}],{duration:t,iterations:1}),"right"==e&&this.res.animate([{transform:"translateX(30px)"},{transform:"translateX(0px)"}],{duration:t,iterations:1}),"top"==e&&this.res.animate([{transform:"translateY(-30px)"},{transform:"translateY(0px)"}],{duration:t,iterations:1}),"bottom"==e&&this.res.animate([{transform:"translateY(30px)"},{transform:"translateY(0px)"}],{duration:t,iterations:1}),this.res.animate([{opacity:"0.0"},{opacity:"1.0"}],{duration:t,iterations:1}),this.scrolled=!0)})),this}}class i extends s{constructor(){super()}setup(t){return this.obj=t,this.animate=void 0===this.obj.animate||this.obj.animate,this.res=this.createSideNav(t),this.res.style.position="relative",this.res.style.zIndex=3,this.closed=!0,this}toggleSideNav(t){this.closed=!this.closed;let e=this.res.children[0];if(this.closed)if(e.style.overflowX="hidden",t.style.opacity=1,this.animate){e.animate([{transform:"translateX(0)"},{transform:"translateX(100%)"}],{duration:300,fill:"forwards"});let t=-1;for(let s of e.children)if(t+=1,this.masterEL[t])for(let e of s.children){let s=this.masterEL[t].options.animation;s&&this.mappedIDS.includes(e.id)&&e.animate(s.op.keyframesClose,s.op.closeOptions)}}else e.style.display="none";else{e.style.overflowX="none",e.children[1].style.border="1px solid orange";let s=-1;for(let t of e.children){s+=1;for(let e of t.children)if(this.mappedIDS.includes(e.id)&&void 0!==this.masterEL[0]){let t=this.masterEL[s].options.animation;if(t){console.log("OPEN KEYFRAMES"),console.log(t.op.keyframesOpen);let s=t.op.openOptions;s.delay||(s.delay=1),s.duration||(s.duration=300),console.log(s),e.animate(t.op.keyframesOpen,s)}}}t.style.opacity=0,this.animate?(e.style.display="flex",e.animate([{transform:"translateX(100%)"},{transform:"translateX(0)"}],{duration:300,fill:"forwards"})):e.style.display="flex"}}createToggleButton(t){const e=document.createElement("button");return e.innerText="☰",e.style.padding="10px 20px",e.style.backgroundColor="transparent",e.style.color=t??"#3498db",e.style.border="none",e.style.borderRadius="5px",e.style.cursor="pointer",e.style.zIndex=1,e.style.fontSize="1.6rem",e}createCloseButton(t){const e=document.createElement("button");return e.innerText="×",e.style.fontSize="1.6rem",e.style.padding="10px 20px",e.style.backgroundColor="transparent",e.style.color=t??"black",e.style.border="none",e.style.borderRadius="5px",e.style.cursor="pointer",e.style.zIndex=1,e.style.alignSelf="flex-end",e}createSideNav(t){const e=document.createElement("div");e.style.display="flex",e.style.justifyContent="flex-end";const s=document.createElement("div");s.style.display="none",s.style.background=this.obj.background||"#1abc9c",s.style.height="100%",window.matchMedia("(max-device-width: 415px)").matches?s.style.width="100%":s.style.width=this.obj.width||"400px",s.style.position="fixed",s.style.right=0,this.animate&&(s.style.transform="translateX(100%)"),s.style.flexDirection="column",s.style.justifyContent="flex-start";const i=this.createToggleButton(this.obj.hamColour.opened),r=this.createCloseButton(this.obj.hamColour.closed);return i.addEventListener("click",(()=>this.toggleSideNav(i))),r.addEventListener("click",(()=>this.toggleSideNav(i))),s.appendChild(r),e.appendChild(s),e.appendChild(i),e}items(t){this.masterEL=t.items.filter((t=>void 0!==t.link)),console.log("EXTRACT IDs"),console.log(t);let e=t.items.filter((t=>void 0===t.items)).map((t=>t.id));if(this.mappedIDS=e,this.item=t,this.res.children[0].appendChild(t.render()),void 0!==this.masterEL[0]){console.log("ANNAX"),console.log(this.masterEL[0]);let t=this.masterEL[0].options.animation;if(t)for(let e of this.res.children[0].children)for(let s of e.children)if(this.mappedIDS.includes(s.id)){let e=t.op.closeOptions;e.delay=0,console.log("ANNAX"),console.log("SETTING INITIAL STATE ZEROING THE DELAY"),console.log(t.op.keyframesClose),console.log(e),s.animate(t.op.keyframesClose,t.op.closeOptions)}}return this}toCode(){let t=`new SideNav().setup(${this.formatObj(this.obj)}, ${this.animate})`;if(this.item){let e=this.item.toCode?this.item.toCode().join(""):this.formatObj(this.item);e=e.replace(/,\s*(\.set\(|\.add\()/g,"\n $1"),t+=`.items(${e})`}return t}formatObj(t){return JSON.stringify(t,null,2).replace(/"(\w+)"\s*:/g,"$1:")}render(t){return t&&document.querySelector(t).appendChild(this.res),this.res}}module.exports=e})();
|
|
1
|
+
(()=>{"use strict";var t={d:(e,s)=>{for(var i in s)t.o(s,i)&&!t.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:s[i]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};t.r(e),t.d(e,{SideNav:()=>i});class s{constructor(){this.state={isExpanded:!1,isMovedUp:!1,isMovedDown:!1}}keySet(t){return this.temporaryVal=1,this.res.style[t.key]=t.value,this}onScroll(t){"opacity"===t.value?this.res.style.opacity=t.valMin:"scale"===t.value&&(this.res.style.transform=`scale(${t.valMax})`),window.addEventListener("scroll",(()=>{let e=this.smartRange(window.scrollY,{min:t.from,max:t.to},{min:t.valMin,max:t.valMax});"opacity"===t.value?this.res.style.opacity=e:"scale"===t.value&&(this.res.style.transform=`scale(${e})`)}))}setAny(t){this[Object.keys(t)[0]]=[Object.values(t)[0]]}setID(t){this.id=t}setPrevText(t){this.prevText=t}getCSS(){return this.css}getPX(t){return{xs:"0px",sm:"576px",md:"768px",lg:"992px",xl:"1200px",xxl:"1400px",mxxl:"1800px"}[t]||"Invalid breakpoint"}respad(t){const e=()=>{this.pad(t[0].values);for(let e=0;e<t.length;e++){let s=t[e].breakpoint;window.matchMedia(`(min-width: ${this.getPX(s)}`).matches&&this.pad(t[e].values)}};window.addEventListener("resize",e),e()}resmar(t){const e=()=>{this.mar(t[0].values);for(let e=0;e<t.length;e++){let s=t[e].breakpoint;window.matchMedia(`(max-width: ${this.getPX(s)}`).matches&&this.mar(t[e].values)}};window.addEventListener("resize",e),e()}resprop(t){this.prevBackground=this.res.style.background,this.prevWidth=this.res.style.width,this.prevHeight=this.res.style.height,this.prevBorder=this.res.style.border;const e=()=>{this.res.style.background=this.prevBackground,this.res.style.width=this.prevWidth,this.res.style.height=this.prevHeight,this.res.style.border=this.prevBorder;for(let e=0;e<t.length;e++){let s=t[e].breakpoint;if(window.matchMedia(`(max-width: ${this.getPX(s)}`).matches){const s={};for(const i in t[e])"breakpoint"!==i&&(s[i]=t[e][i]);this.set(s)}}};window.addEventListener("resize",e),e()}isNumber(t){return"number"==typeof t&&!isNaN(t)}pad(t){for(let e=0;e<t.length;e++){let s=Object.keys(t[e]);for(let i=0;i<s.length;i++){let r=s[i],o=t[e][r];for(let t=0;t<r.length;t++)switch(r[t]){case"a":this.res.style.padding=this.isNumber(o)?`${o}px`:o;break;case"t":this.res.style.paddingTop=this.isNumber(o)?`${o}px`:o;break;case"l":this.res.style.paddingLeft=this.isNumber(o)?`${o}px`:o;break;case"r":this.res.style.paddingRight=this.isNumber(o)?`${o}px`:o;break;case"b":this.res.style.paddingBottom=this.isNumber(o)?`${o}px`:o}}}return this}as(t){return this.res.style.alignSelf=t,this}mar(t){for(let e=0;e<t.length;e++){let s=Object.keys(t[e]);for(let i=0;i<s.length;i++){let r=s[i],o=t[e][r];for(let t=0;t<r.length;t++){switch(r[t]){case"a":this.res.style.margin=this.isNumber(o)?`${o}px`:o;break;case"t":this.res.style.marginTop=this.isNumber(o)?`${o}px`:o;break;case"l":this.res.style.marginLeft=this.isNumber(o)?`${o}px`:o;break;case"r":this.res.style.marginRight=this.isNumber(o)?`${o}px`:o;break;case"b":this.res.style.marginBottom=this.isNumber(o)?`${o}px`:o}"auto"===r[t]&&(this.res.style.marginLeft="auto",this.res.style.marginRight="auto")}}}return this}smartRange(t,e,s){t<e.min&&(t=e.min),t>e.max&&(t=e.max);let i=(t-e.min)/(e.max-e.min);e.min>e.max&&(i=(t-e.max)/(e.min-e.max));let r=(s.min-s.max)*i-s.min;if(r=Math.abs(r),s.min<s.max){let t=(s.max+Math.abs(s.min))*i;r=s.min+t}return r}gpos(t){return this.res.style.gridColumn=t.col,this.res.style.gridRow=t.row,this}fluidCopy(t){if(t instanceof Object){this.prevStylex=this.res.style,this.res=document.createElement("h1"),this.res.style.cssText=this.prevStylex.cssText;let e=document.createTextNode(this.text);return this.res.appendChild(e),this.res.style.fontSize=t.exact,this}if("S1"===t){this.prevStylex=this.res.style,this.res=document.createElement("h1"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.625rem + 5.075vw)"}if("S2"===t){this.prevStylex=this.res.style,this.res=document.createElement("h2"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.500rem + 4.3vw)"}if("S3"===t){this.prevStylex=this.res.style,this.res=document.createElement("h3"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.375rem + 3.525vw)"}if("S4"===t){this.prevStylex=this.res.style,this.res=document.createElement("h4"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.250rem + 2.75vw)"}if("S5"===t){this.prevStylex=this.res.style,this.res=document.createElement("h5"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.125rem + 1.975vw)"}return"S6"===t&&(this.res.style.fontSize="calc(1rem + 0.5vw)"),this}setIndex(t){this.index=t}borderObj(t){let e=t.type??"solid";return this.res.style.border=`${t.width} ${e} ${t.color}`,this.res.style.borderRadius=t.radius,this}protoReact(t,e){t.sort(((t,e)=>parseInt(t.range[0])-parseInt(e.range[0])));const s=()=>{const s=window.innerWidth;let i="";this.storedQueries=t.map((t=>t.target)).filter((t=>null!=t));for(const o of t){this.counterIndex++;const[t,a]=o.range,n=parseInt(t),l=parseInt(a);let h=!0;if(o.target){h=!1;for(var r=0;r<o.target.length;r++)o.target[r]===e&&(h=!0)}s>=n&&s<=l&&h&&("gradient"===o.log&&(i+="gradient"),"blast"===o.log&&(i+="blast"),"animation"===o.log&&(i+="animation"),"shadow"===o.log&&(i+="shadow"),"span"===o.log&&(i+="span"),"filter"===o.log&&(i+="filter"),"background"===o.log&&(i+="background"))}this.res.style.margin="";let o=this.res.style.color;for(t.map((t=>t.log)).filter((t=>null!=t)).includes("gradient")&&(this.res.style.WebkitBackgroundClip="",this.res.style.background=""),this.res.style["-webkit-text-stroke"]="",this.res.style.filter="",this.res.style.textShadow="",this.res.style.border="";this.res.firstChild;)this.res.removeChild(this.res.firstChild);if(this.res.textContent=this.text,""===i&&(this.res.style["-webkit-text-fill-color"]="",this.res.style.color=o),"blast"===i){for(r=0;r<t.length;r++){const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}for(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke"]=this.globalBlast,r=0;r<t.length;r++){const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}}if("gradient"===i&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["-webkit-background-clip"]="text",this.res.style.border="1px solid orange"),"background"===i&&(this.res.style.background="orange"),"gradientblast"===i&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["-webkit-background-clip"]="text",this.res.style["-webkit-text-stroke"]=this.globalBlast),"gradientanimation"===i&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["-webkit-background-clip"]="text"),"gradientanimationshadow"===i&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["-webkit-background-clip"]="text",this.res.style.textShadow=this.globalShadow),"animationshadow"===i&&(this.res.style["-webkit-text-fill-color"]="",this.res.style.textShadow=this.globalShadow),"shadow"===i&&(this.res.style["-webkit-text-fill-color"]="",this.res.style.textShadow=this.globalShadow),"span"===i&&this.options.span){let t;for(t=Array.isArray(this.options.span)?this.options.span.filter((t=>"span"===t.op.name))[0]:this.options.span,this.res.textContent="",r=0;r<t.op.parts.length;r++){let e=t.op.parts[r].style,s=new Text(t.op.parts[r].text).setup({type:"span"}).set(e).render();this.res.appendChild(s)}}if("filter"===i){let t=this.options.filtera.op.filter;this.res.style.filter=t,this.res.style.border="8px solid orange"}};window.addEventListener("resize",s),s()}setPref(t){this.preffersId=t}setClass(t){this.class=t}betaReact(t,e){this.ap=!1,this.cta=0,this.once=!1,t.sort(((t,e)=>parseInt(t.range[0])-parseInt(e.range[0])));const s=()=>{const s=window.innerWidth;let i="";this.resCopy=this.res,this.storedQueries=t.map((t=>t.target)).filter((t=>null!=t));for(const o of t){this.counterIndex++;const[t,a]=o.range,n=parseInt(t),l=parseInt(a);let h=!0;if(o.target){h=!1;for(var r=0;r<o.target.length;r++)o.target[r]===e&&(h=!0)}s>=n&&s<=l&&h&&("blast"===o.log&&(i+="blast"),"shadow"===o.log&&(i+="shadow"),"background"===o.log&&(i+="background"),"gradient"===o.log&&(i+="gradient"),"spana"===o.log&&(i+="spana"),"layout"===o.log&&(i+="layout"),"margin"===o.log&&(i+="margin"),o.op&&o.op.margin&&(this.useMargin=o.op.margin))}if(this.res.style.background="",this.res.style.backgroundColor="",this.res.style.textShadow="",this.res.style.border="",this.res.style.margin="",this.res.style["-webkit-text-fill-color"]="",this.res.style["-webkit-text-stroke"]="",this.res.style["-webkit-text-stroke-width"]="","background"===i&&(this.res.style.backgroundColor="green"),"margin"===i)for(r=0;r<t.length;r++){if(!t[r].op)continue;const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}if("blastbackgroundmargin"===i){for(r=0;r<t.length;r++){if(!t[r].op)continue;const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}this.res.style.backgroundColor="green","FlexRowLayoutElement"===this.getType()?this.res.style.border="1px solid orange":(this.res.textContent=this.text,this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"),this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"}if("blastbackground"===i){for(r=0;r<t.length;r++){if(!t[r].op)continue;const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}this.res.style.backgroundColor="green",this.useMargin?this.res.style.margin="1rem":this.res.setAttribute("id","iofhwoiefhoih"),"FlexRowLayoutElement"===this.getType()?this.res.style.border="1px solid orange":(this.res.textContent=this.text,this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"),this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"}if("layout"===i&&(this.res.style.alignSelf="start",this.res.style.border="1px solid purple"),"blast"===i){for(r=0;r<t.length;r++){if(!t[r].op)continue;const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}"FlexRowLayoutElement"===this.getType()?this.res.style.border="1px solid orange":(this.res.textContent=this.text,this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-background-clip"]="text",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"),this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"}"blastgradientbackground"===i&&(this.res.style.border="1px solid yellow",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"),"gradient"===i&&(this.res.style.background="linear-gradient(to left, #3498db, #1abc9c)","FlexRowLayoutElement"===this.getType()||(this.res.children[0]&&this.res.removeChild(this.res.children[0]),this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-background-clip"]="text",this.res.textContent=this.text)),"shadow"===i&&("FlexRowLayoutElement"===this.getType()||(this.res.children[0]&&this.res.removeChild(this.res.children[0]),this.res.style["-webkit-text-fill-color"]="",this.res.style["-webkit-text-fill-color"]="",this.res.style.textShadow="#1abc9cff -6px 6px , #1abc9c40 -12px 12px",this.res.textContent=this.text))};window.addEventListener("resize",s),s()}cssGen(t,e,s,i){return this.css=[""],[""]}chainReact(t,e,s){this.cssGen(t,e,this.class,void 0!==this.class),this.ap=!1,this.cta=0,this.once=!1;for(let e of t)e.range||(e.range=["0px","999999px"]);t.sort(((t,e)=>parseInt(t.range[0])-parseInt(e.range[0])));const i=()=>{const i=window.visualViewport.width;let r=[],o=[];this.resCopy=this.res,this.storedQueries=t.map((t=>t.target)).filter((t=>null!=t));for(const s of t){this.counterIndex++;const[t,n]=s.range,l=parseInt(t),h=parseInt(n);let d=!0;if(s.target){d=!1;for(var a=0;a<s.target.length;a++)s.target[a]===e&&(d=!0)}i>=l&&i<=h&&d&&(r.push(s.log),o.push(s),s.op&&s.op.margin&&(this.useMargin=s.op.margin))}if(s&&!s.includes("background")&&(this.res.style.background="",this.res.style.backgroundColor=""),this.res.style.textShadow="",s&&!s.includes("border")&&(this.res.style.border=""),s&&!s.includes("margin")&&(this.res.style.margin=""),this.res.style["-webkit-text-fill-color"]="",this.res.style["-webkit-text-stroke-color"]="",this.res.style["-webkit-text-stroke-width"]="",this.res.style.filter="",(r.includes("gradient")||r.includes("shadow"))&&(this.res.style.position="relative",this.res.style.zIndex=-1),r.includes("blast")){let t=o.filter((t=>"blast"===t.log))[0].op.color,e=o.filter((t=>"blast"===t.log))[0].op.width??"1px";"FlexRowLayoutElement"===this.getType()?this.res.style.border=`${e}px solid orange`:(this.res.textContent=this.text,this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]=t,this.res.style["-webkit-text-stroke-width"]=`${e}`)}if(r.includes("filter")){let t=o.filter((t=>"filter"===t.log))[0].op.filter;this.res.style.filter=t}if(r.includes("background")&&(this.res.style.backgroundColor="green"),r.includes("gradient")&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["background-clip"]="text"),r.includes("shadow"))if("FlexRowLayoutElement"===this.getType());else{let t="",e=0;for(a=0;a<this.options.shadow.op.steps;a++)e+=3,t+=`drop-shadow(${e}px ${e}px ${e}px gray) `;this.res.style.filter=t}if(r.includes("margin"))for(a=0;a<t.length;a++){if(!t[a].op)continue;const e=t[a].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}if(r.includes("animation")){if(this.options.animation&&!this.hasAnimated&&!this.options.animation.op.fireAt){this.hasAnimated=!0;let t=this.options.animation.op;this.res.animate(t.keyframesClose,{duration:0,fill:"forwards"}),this.res.animate(t.keyframesOpen,t.openOptions)}if(this.options.animation&&this.options.animation.op.fireAt&&this.options.animation.op.fireAt.endsWith("px")){let t=this.options.animation.op;this.res.animate(t.keyframesClose,{duration:0,fill:"forwards"});const e=()=>{window.scrollY>parseFloat(t.fireAt)&&(this.res.animate(t.keyframesOpen,t.openOptions),window.removeEventListener("scroll",e))};window.addEventListener("scroll",e)}if(this.options.animation&&this.options.animation.op.fireAt&&"inview"===this.options.animation.op.fireAt){let t=this.options.animation.op;this.res.animate(t.keyframesClose,{duration:0,fill:"forwards"}),new IntersectionObserver(((e,s)=>{e.forEach((e=>{e.isIntersecting&&(this.res.animate(t.keyframesOpen,t.openOptions),s.disconnect())}))})).observe(this.res)}}};window.addEventListener("resize",i),i()}reactOnTransform=t=>{if(t.transform||t.op&&t.op.transform){let e=t.transform;t.transform||(e=t.op.transform),e.duration||(e.duration="3s-ease-in-out"),this.setDefault=(t,e="0px")=>0===t.length?e+" ":t;const s=t=>{const e=t.match(/rotate\(([^)]+)\)/);if(!e)return t;const s=e[1].split(",").map((t=>t.trim()));return 1===s.length?`rotate(${s[0]})`:2===s.length?`rotateX(${s[0]}) rotateY(${s[1]})`:3===s.length?`rotateX(${s[0]}) rotateY(${s[1]}) rotate(${s[2]})`:t},i=()=>{let i="",r="",o="",a="",n="",l="",h="",d="",p="";if(0===e.values.length)return;e.values.forEach((t=>{t.startsWith("tx:")&&(i=t.replace("tx:","")),t.startsWith("ty:")&&(r=t.replace("ty:","")),t.startsWith("tz:")?o=t.replace("tz:",""):t.startsWith("scale(")?a=t:t.startsWith("skew(")?n=t:t.startsWith("rotate(")?l=s(t):t.startsWith("perspective(")?h=t:t.startsWith("matrix(")?d=t:t.startsWith("opacity:")&&(p=t.replace("opacity:",""))})),i=this.setDefault(i),r=this.setDefault(r),o=this.setDefault(o);let c="";if("0px"!=r&&"0px"!=i&&"0px"!=o?c+=`translate3d(${i}, ${r}, ${o})`:"0px"==r&&"0px"==i||(c+=`translate(${i}, ${r})`),a&&(c+=` ${a}`),l&&(c+=` ${l}`),n&&(c+=` ${n}`),h&&(c+=` ${h}`),d&&(c+=` ${d}`),c){if(t.op.transform.duration){let e=t.op.transform.duration.replace(/^(\d+)(s)-/,((t,e,s)=>e/2+s+" ")),s=`transform ${e}, opacity ${e}`;this.res.style.transition=s}else this.res.style.transition="transform 3s ease-in-out, opacity 3s ease-in-out";this.res.style.transform=c,this.res.style.opacity=p}};e.on?this.res.addEventListener(e.on,(()=>{e.delay?setTimeout((()=>{i()}),e.delay):i()})):window.addEventListener("load",(()=>{e.delay?setTimeout((()=>{i()}),e.delay):i()}));const r=()=>{let t="";e.values.forEach((e=>{e.startsWith("tx:")?t+="translateX(0) ":e.startsWith("ty:")?t+="translateY(0) ":e.startsWith("tz:")?t+="translateZ(0) ":e.startsWith("scale(")?t+="scale(1) ":e.startsWith("skew(")?t+="skew(0, 0) ":e.startsWith("rotate(")?t+="rotate(0) ":e.startsWith("perspective(")?t+="perspective(0) ":e.startsWith("matrix(")&&(t+="matrix(1, 0, 0, 1, 0, 0) "),this.res.style.opacity="1"})),t&&(this.res.style.transform=t.trim())};if(e.on)this.res.addEventListener("mouseout",(()=>{e.keep||r()}));else{let t=1e3*parseFloat(e.duration),s=e.closeAfter?e.closeAfter:0;setTimeout((()=>{e.keep||r()}),t/2+s)}}};maxWidth(t){return this.res.style.maxWidth=t,this}removeQuotesFromFirstWord(t){return t.replace(/"([^"]+)":/g,"$1:")}arrayMargin(t,e){return t.includes("left")&&(this.res.style.marginLeft=e),t.includes("right")&&(this.res.style.marginRight=e),t.includes("top")&&(this.res.style.marginTop=e),t.includes("bottom")&&(this.res.style.marginBottom=e),t.includes("all")&&(this.res.style.margin=e),e||(this.res.style.marginBottom=t),this}navBarExpand(){return this.res.style.backgroundColor="green",this.res.animate([{transform:"scaleY(3.0)"}],{duration:2e3,iterations:1,fill:"both"}),this}scrollFade(t,e){return this.res.style.visibility="hidden",this.faden(t,e,"scroll"),this}expand(t){return!1===this.state.isExpanded?"click"===t.on?this.res.addEventListener("click",(()=>{this.innerExpand(t)})):this.innerExpand(t):this.innerExpandBack(t),this.state.isExpanded=!this.state.isExpanded,this}move(t){return"click"===t.on?this.res.addEventListener("click",(()=>{this.moveUpa(t)})):("up"===t.direction&&this.moveUpa(t),"down"===t.direction&&this.moveDowna(t),this.state.isMovedUp=!this.state.isMovedUp,"left"===t.direction&&this.moveLeft(t)),this}moveLeft(t){return this.res.animate([{transform:"translateX(0px)"},{transform:`translateX(-${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play(),this}moveUpa(t){return!1===this.state.isMovedUp?this.res.animate([{transform:"translateX(0px)"},{transform:`translateY(-${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play():this.res.animate([{transform:"translateX(0px)"},{transform:`translateY(${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play(),this}moveDowna(t){return!1===this.state.isMovedDown?this.res.animate([{transform:"translateX(0px)"},{transform:`translateY(${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play():this.res.animate([{transform:"translateX(0px)"},{transform:`translateY(-${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play(),this}moveUpaBack(t){return this.res.animate([{transform:"translateX(0px)"}],{duration:900,iterations:t.iterations,fill:"both"}).play(),this}innerExpandBack(t){this.res.animate([{width:this.prevWidth,height:this.prevHeight}],{duration:900,iterations:t.iterations,fill:"both"})}innerExpand(t){return this.prevWidth=this.res.style.width,this.prevHeight=this.res.style.height,this.res.animate([{width:this.prevWidth,height:this.prevHeight},{width:t.width??this.prevWidth,height:t.height??this.prevHeight}],{duration:900,iterations:t.iterations,fill:"both"}),this}fade(t){return this.res.style.visibility="hidden",this.faden(t.duration,t.from,"load"),t.finalOpacity&&(this.finalOpacity=t.finalOpacity),this}faden(t,e,s){return this.res.style.visibility="hidden",this.scrolled=!1,window.addEventListener(s,(()=>{this.res.style.visibility="visible";var i=window.innerHeight;(this.res.getBoundingClientRect().top-i<=0||"load"==s)&&0==this.scrolled&&("left"==e&&this.res.animate([{transform:"translateX(-30px)"},{transform:"translateX(0px)"}],{duration:t,iterations:1}),"right"==e&&this.res.animate([{transform:"translateX(30px)"},{transform:"translateX(0px)"}],{duration:t,iterations:1}),"top"==e&&this.res.animate([{transform:"translateY(-30px)"},{transform:"translateY(0px)"}],{duration:t,iterations:1}),"bottom"==e&&this.res.animate([{transform:"translateY(30px)"},{transform:"translateY(0px)"}],{duration:t,iterations:1}),this.res.animate([{opacity:"0.0"},{opacity:"1.0"}],{duration:t,iterations:1}),this.scrolled=!0)})),this}}class i extends s{constructor(){super()}set(t){return this.obj=t,this.animate=void 0===this.obj.animate||this.obj.animate,this.res=this.createSideNav(t),this.res.style.position="relative",this.res.style.zIndex=3,this.closed=!0,this}toggleSideNav(t){this.closed=!this.closed;let e=this.res.children[0];if(this.closed)if(e.style.overflowX="hidden",t.style.opacity=1,this.animate){e.animate([{transform:"translateX(0)"},{transform:"translateX(100%)"}],{duration:300,fill:"forwards"});let t=-1;for(let s of e.children)if(t+=1,this.masterEL[t])for(let e of s.children){let s=this.masterEL[t].options.animation;s&&this.mappedIDS.includes(e.id)&&e.animate(s.op.keyframesClose,s.op.closeOptions)}}else e.style.display="none";else{e.style.overflowX="none",e.children[1].style.border="1px solid orange";let s=-1;for(let t of e.children){s+=1;for(let e of t.children)if(this.mappedIDS.includes(e.id)&&void 0!==this.masterEL[0]){let t=this.masterEL[s].options.animation;if(t){console.log("OPEN KEYFRAMES"),console.log(t.op.keyframesOpen);let s=t.op.openOptions;s.delay||(s.delay=1),s.duration||(s.duration=300),console.log(s),e.animate(t.op.keyframesOpen,s)}}}t.style.opacity=0,this.animate?(e.style.display="flex",e.animate([{transform:"translateX(100%)"},{transform:"translateX(0)"}],{duration:300,fill:"forwards"})):e.style.display="flex"}}createToggleButton(t){const e=document.createElement("button");return e.innerText="☰",e.style.padding="10px 20px",e.style.backgroundColor="transparent",e.style.color=t??"#3498db",e.style.border="none",e.style.borderRadius="5px",e.style.cursor="pointer",e.style.zIndex=1,e.style.fontSize="1.6rem",e}createCloseButton(t){const e=document.createElement("button");return e.innerText="×",e.style.fontSize="1.6rem",e.style.padding="10px 20px",e.style.backgroundColor="transparent",e.style.color=t??"black",e.style.border="none",e.style.borderRadius="5px",e.style.cursor="pointer",e.style.zIndex=1,e.style.alignSelf="flex-end",e}createSideNav(t){const e=document.createElement("div");e.style.display="flex",e.style.justifyContent="flex-end";const s=document.createElement("div");s.style.display="none",s.style.background=this.obj.background||"#1abc9c",s.style.height="100%",window.matchMedia("(max-device-width: 415px)").matches?s.style.width="100%":s.style.width=this.obj.width||"400px",s.style.position="fixed",s.style.right=0,this.animate&&(s.style.transform="translateX(100%)"),s.style.flexDirection="column",s.style.justifyContent="flex-start";const i=this.createToggleButton(this.obj.hamColour.opened),r=this.createCloseButton(this.obj.hamColour.closed);return i.addEventListener("click",(()=>this.toggleSideNav(i))),r.addEventListener("click",(()=>this.toggleSideNav(i))),s.appendChild(r),e.appendChild(s),e.appendChild(i),e}items(t){this.masterEL=t.items.filter((t=>void 0!==t.link)),console.log("EXTRACT IDs"),console.log(t);let e=t.items.filter((t=>void 0===t.items)).map((t=>t.id));if(this.mappedIDS=e,this.item=t,this.res.children[0].appendChild(t.render()),void 0!==this.masterEL[0]){console.log("ANNAX"),console.log(this.masterEL[0]);let t=this.masterEL[0].options.animation;if(t)for(let e of this.res.children[0].children)for(let s of e.children)if(this.mappedIDS.includes(s.id)){let e=t.op.closeOptions;e.delay=0,console.log("ANNAX"),console.log("SETTING INITIAL STATE ZEROING THE DELAY"),console.log(t.op.keyframesClose),console.log(e),s.animate(t.op.keyframesClose,t.op.closeOptions)}}return this}toCode(){let t=`new SideNav().set(${this.formatObj(this.obj)})`;if(this.item){let e=this.item.toCode?this.item.toCode().join(""):this.formatObj(this.item);e=e.replace(/,\s*(\.set\(|\.add\()/g,"\n $1"),t+=`.items(${e})`}return t}formatObj(t){return JSON.stringify(t,null,2).replace(/"(\w+)"\s*:/g,"$1:")}render(t){return t&&document.querySelector(t).appendChild(this.res),this.res}}module.exports=e})();
|
package/dist/sideNavBar.esm.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
class t{constructor(){this.state={isExpanded:!1,isMovedUp:!1,isMovedDown:!1}}keySet(t){return this.temporaryVal=1,this.res.style[t.key]=t.value,this}onScroll(t){"opacity"===t.value?this.res.style.opacity=t.valMin:"scale"===t.value&&(this.res.style.transform=`scale(${t.valMax})`),window.addEventListener("scroll",(()=>{let e=this.smartRange(window.scrollY,{min:t.from,max:t.to},{min:t.valMin,max:t.valMax});"opacity"===t.value?this.res.style.opacity=e:"scale"===t.value&&(this.res.style.transform=`scale(${e})`)}))}setAny(t){this[Object.keys(t)[0]]=[Object.values(t)[0]]}setID(t){this.id=t}setPrevText(t){this.prevText=t}getCSS(){return this.css}getPX(t){return{xs:"0px",sm:"576px",md:"768px",lg:"992px",xl:"1200px",xxl:"1400px",mxxl:"1800px"}[t]||"Invalid breakpoint"}respad(t){const e=()=>{this.pad(t[0].values);for(let e=0;e<t.length;e++){let s=t[e].breakpoint;window.matchMedia(`(min-width: ${this.getPX(s)}`).matches&&this.pad(t[e].values)}};window.addEventListener("resize",e),e()}resmar(t){const e=()=>{this.mar(t[0].values);for(let e=0;e<t.length;e++){let s=t[e].breakpoint;window.matchMedia(`(max-width: ${this.getPX(s)}`).matches&&this.mar(t[e].values)}};window.addEventListener("resize",e),e()}resprop(t){this.prevBackground=this.res.style.background,this.prevWidth=this.res.style.width,this.prevHeight=this.res.style.height,this.prevBorder=this.res.style.border;const e=()=>{this.res.style.background=this.prevBackground,this.res.style.width=this.prevWidth,this.res.style.height=this.prevHeight,this.res.style.border=this.prevBorder;for(let e=0;e<t.length;e++){let s=t[e].breakpoint;if(window.matchMedia(`(max-width: ${this.getPX(s)}`).matches){const s={};for(const i in t[e])"breakpoint"!==i&&(s[i]=t[e][i]);this.set(s)}}};window.addEventListener("resize",e),e()}isNumber(t){return"number"==typeof t&&!isNaN(t)}pad(t){for(let e=0;e<t.length;e++){let s=Object.keys(t[e]);for(let i=0;i<s.length;i++){let r=s[i],o=t[e][r];for(let t=0;t<r.length;t++)switch(r[t]){case"a":this.res.style.padding=this.isNumber(o)?`${o}px`:o;break;case"t":this.res.style.paddingTop=this.isNumber(o)?`${o}px`:o;break;case"l":this.res.style.paddingLeft=this.isNumber(o)?`${o}px`:o;break;case"r":this.res.style.paddingRight=this.isNumber(o)?`${o}px`:o;break;case"b":this.res.style.paddingBottom=this.isNumber(o)?`${o}px`:o}}}return this}as(t){return this.res.style.alignSelf=t,this}mar(t){for(let e=0;e<t.length;e++){let s=Object.keys(t[e]);for(let i=0;i<s.length;i++){let r=s[i],o=t[e][r];for(let t=0;t<r.length;t++){switch(r[t]){case"a":this.res.style.margin=this.isNumber(o)?`${o}px`:o;break;case"t":this.res.style.marginTop=this.isNumber(o)?`${o}px`:o;break;case"l":this.res.style.marginLeft=this.isNumber(o)?`${o}px`:o;break;case"r":this.res.style.marginRight=this.isNumber(o)?`${o}px`:o;break;case"b":this.res.style.marginBottom=this.isNumber(o)?`${o}px`:o}"auto"===r[t]&&(this.res.style.marginLeft="auto",this.res.style.marginRight="auto")}}}return this}smartRange(t,e,s){t<e.min&&(t=e.min),t>e.max&&(t=e.max);let i=(t-e.min)/(e.max-e.min);e.min>e.max&&(i=(t-e.max)/(e.min-e.max));let r=(s.min-s.max)*i-s.min;if(r=Math.abs(r),s.min<s.max){let t=(s.max+Math.abs(s.min))*i;r=s.min+t}return r}gpos(t){return this.res.style.gridColumn=t.col,this.res.style.gridRow=t.row,this}fluidCopy(t){if(t instanceof Object){this.prevStylex=this.res.style,this.res=document.createElement("h1"),this.res.style.cssText=this.prevStylex.cssText;let e=document.createTextNode(this.text);return this.res.appendChild(e),this.res.style.fontSize=t.exact,this}if("S1"===t){this.prevStylex=this.res.style,this.res=document.createElement("h1"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.625rem + 5.075vw)"}if("S2"===t){this.prevStylex=this.res.style,this.res=document.createElement("h2"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.500rem + 4.3vw)"}if("S3"===t){this.prevStylex=this.res.style,this.res=document.createElement("h3"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.375rem + 3.525vw)"}if("S4"===t){this.prevStylex=this.res.style,this.res=document.createElement("h4"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.250rem + 2.75vw)"}if("S5"===t){this.prevStylex=this.res.style,this.res=document.createElement("h5"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.125rem + 1.975vw)"}return"S6"===t&&(this.res.style.fontSize="calc(1rem + 0.5vw)"),this}setIndex(t){this.index=t}borderObj(t){let e=t.type??"solid";return this.res.style.border=`${t.width} ${e} ${t.color}`,this.res.style.borderRadius=t.radius,this}protoReact(t,e){t.sort(((t,e)=>parseInt(t.range[0])-parseInt(e.range[0])));const s=()=>{const s=window.innerWidth;let i="";this.storedQueries=t.map((t=>t.target)).filter((t=>null!=t));for(const o of t){this.counterIndex++;const[t,a]=o.range,n=parseInt(t),l=parseInt(a);let h=!0;if(o.target){h=!1;for(var r=0;r<o.target.length;r++)o.target[r]===e&&(h=!0)}s>=n&&s<=l&&h&&("gradient"===o.log&&(i+="gradient"),"blast"===o.log&&(i+="blast"),"animation"===o.log&&(i+="animation"),"shadow"===o.log&&(i+="shadow"),"span"===o.log&&(i+="span"),"filter"===o.log&&(i+="filter"),"background"===o.log&&(i+="background"))}this.res.style.margin="";let o=this.res.style.color;for(t.map((t=>t.log)).filter((t=>null!=t)).includes("gradient")&&(this.res.style.WebkitBackgroundClip="",this.res.style.background=""),this.res.style["-webkit-text-stroke"]="",this.res.style.filter="",this.res.style.textShadow="",this.res.style.border="";this.res.firstChild;)this.res.removeChild(this.res.firstChild);if(this.res.textContent=this.text,""===i&&(this.res.style["-webkit-text-fill-color"]="",this.res.style.color=o),"blast"===i){for(r=0;r<t.length;r++){const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}for(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke"]=this.globalBlast,r=0;r<t.length;r++){const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}}if("gradient"===i&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["-webkit-background-clip"]="text",this.res.style.border="1px solid orange"),"background"===i&&(this.res.style.background="orange"),"gradientblast"===i&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["-webkit-background-clip"]="text",this.res.style["-webkit-text-stroke"]=this.globalBlast),"gradientanimation"===i&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["-webkit-background-clip"]="text"),"gradientanimationshadow"===i&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["-webkit-background-clip"]="text",this.res.style.textShadow=this.globalShadow),"animationshadow"===i&&(this.res.style["-webkit-text-fill-color"]="",this.res.style.textShadow=this.globalShadow),"shadow"===i&&(this.res.style["-webkit-text-fill-color"]="",this.res.style.textShadow=this.globalShadow),"span"===i&&this.options.span){let t;for(t=Array.isArray(this.options.span)?this.options.span.filter((t=>"span"===t.op.name))[0]:this.options.span,this.res.textContent="",r=0;r<t.op.parts.length;r++){let e=t.op.parts[r].style,s=new Text(t.op.parts[r].text).setup({type:"span"}).set(e).render();this.res.appendChild(s)}}if("filter"===i){let t=this.options.filtera.op.filter;this.res.style.filter=t,this.res.style.border="8px solid orange"}};window.addEventListener("resize",s),s()}setPref(t){this.preffersId=t}setClass(t){this.class=t}betaReact(t,e){this.ap=!1,this.cta=0,this.once=!1,t.sort(((t,e)=>parseInt(t.range[0])-parseInt(e.range[0])));const s=()=>{const s=window.innerWidth;let i="";this.resCopy=this.res,this.storedQueries=t.map((t=>t.target)).filter((t=>null!=t));for(const o of t){this.counterIndex++;const[t,a]=o.range,n=parseInt(t),l=parseInt(a);let h=!0;if(o.target){h=!1;for(var r=0;r<o.target.length;r++)o.target[r]===e&&(h=!0)}s>=n&&s<=l&&h&&("blast"===o.log&&(i+="blast"),"shadow"===o.log&&(i+="shadow"),"background"===o.log&&(i+="background"),"gradient"===o.log&&(i+="gradient"),"spana"===o.log&&(i+="spana"),"layout"===o.log&&(i+="layout"),"margin"===o.log&&(i+="margin"),o.op&&o.op.margin&&(this.useMargin=o.op.margin))}if(this.res.style.background="",this.res.style.backgroundColor="",this.res.style.textShadow="",this.res.style.border="",this.res.style.margin="",this.res.style["-webkit-text-fill-color"]="",this.res.style["-webkit-text-stroke"]="",this.res.style["-webkit-text-stroke-width"]="","background"===i&&(this.res.style.backgroundColor="green"),"margin"===i)for(r=0;r<t.length;r++){if(!t[r].op)continue;const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}if("blastbackgroundmargin"===i){for(r=0;r<t.length;r++){if(!t[r].op)continue;const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}this.res.style.backgroundColor="green","FlexRowLayoutElement"===this.getType()?this.res.style.border="1px solid orange":(this.res.textContent=this.text,this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"),this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"}if("blastbackground"===i){for(r=0;r<t.length;r++){if(!t[r].op)continue;const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}this.res.style.backgroundColor="green",this.useMargin?this.res.style.margin="1rem":this.res.setAttribute("id","iofhwoiefhoih"),"FlexRowLayoutElement"===this.getType()?this.res.style.border="1px solid orange":(this.res.textContent=this.text,this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"),this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"}if("layout"===i&&(this.res.style.alignSelf="start",this.res.style.border="1px solid purple"),"blast"===i){for(r=0;r<t.length;r++){if(!t[r].op)continue;const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}"FlexRowLayoutElement"===this.getType()?this.res.style.border="1px solid orange":(this.res.textContent=this.text,this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-background-clip"]="text",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"),this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"}"blastgradientbackground"===i&&(this.res.style.border="1px solid yellow",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"),"gradient"===i&&(this.res.style.background="linear-gradient(to left, #3498db, #1abc9c)","FlexRowLayoutElement"===this.getType()||(this.res.children[0]&&this.res.removeChild(this.res.children[0]),this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-background-clip"]="text",this.res.textContent=this.text)),"shadow"===i&&("FlexRowLayoutElement"===this.getType()||(this.res.children[0]&&this.res.removeChild(this.res.children[0]),this.res.style["-webkit-text-fill-color"]="",this.res.style["-webkit-text-fill-color"]="",this.res.style.textShadow="#1abc9cff -6px 6px , #1abc9c40 -12px 12px",this.res.textContent=this.text))};window.addEventListener("resize",s),s()}cssGen(t,e,s,i){return this.css=[""],[""]}chainReact(t,e,s){this.cssGen(t,e,this.class,void 0!==this.class),this.ap=!1,this.cta=0,this.once=!1;for(let e of t)e.range||(e.range=["0px","999999px"]);t.sort(((t,e)=>parseInt(t.range[0])-parseInt(e.range[0])));const i=()=>{const i=window.visualViewport.width;let r=[],o=[];this.resCopy=this.res,this.storedQueries=t.map((t=>t.target)).filter((t=>null!=t));for(const s of t){this.counterIndex++;const[t,n]=s.range,l=parseInt(t),h=parseInt(n);let d=!0;if(s.target){d=!1;for(var a=0;a<s.target.length;a++)s.target[a]===e&&(d=!0)}i>=l&&i<=h&&d&&(r.push(s.log),o.push(s),s.op&&s.op.margin&&(this.useMargin=s.op.margin))}if(s&&!s.includes("background")&&(this.res.style.background="",this.res.style.backgroundColor=""),this.res.style.textShadow="",s&&!s.includes("border")&&(this.res.style.border=""),s&&!s.includes("margin")&&(this.res.style.margin=""),this.res.style["-webkit-text-fill-color"]="",this.res.style["-webkit-text-stroke-color"]="",this.res.style["-webkit-text-stroke-width"]="",this.res.style.filter="",(r.includes("gradient")||r.includes("shadow"))&&(this.res.style.position="relative",this.res.style.zIndex=-1),r.includes("blast")){let t=o.filter((t=>"blast"===t.log))[0].op.color,e=o.filter((t=>"blast"===t.log))[0].op.width??"1px";"FlexRowLayoutElement"===this.getType()?this.res.style.border=`${e}px solid orange`:(this.res.textContent=this.text,this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]=t,this.res.style["-webkit-text-stroke-width"]=`${e}`)}if(r.includes("filter")){let t=o.filter((t=>"filter"===t.log))[0].op.filter;this.res.style.filter=t}if(r.includes("background")&&(this.res.style.backgroundColor="green"),r.includes("gradient")&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["background-clip"]="text"),r.includes("shadow"))if("FlexRowLayoutElement"===this.getType());else{let t="",e=0;for(a=0;a<this.options.shadow.op.steps;a++)e+=3,t+=`drop-shadow(${e}px ${e}px ${e}px gray) `;this.res.style.filter=t}if(r.includes("margin"))for(a=0;a<t.length;a++){if(!t[a].op)continue;const e=t[a].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}if(r.includes("animation")){if(this.options.animation&&!this.hasAnimated&&!this.options.animation.op.fireAt){this.hasAnimated=!0;let t=this.options.animation.op;this.res.animate(t.keyframesClose,{duration:0,fill:"forwards"}),this.res.animate(t.keyframesOpen,t.openOptions)}if(this.options.animation&&this.options.animation.op.fireAt&&this.options.animation.op.fireAt.endsWith("px")){let t=this.options.animation.op;this.res.animate(t.keyframesClose,{duration:0,fill:"forwards"});const e=()=>{window.scrollY>parseFloat(t.fireAt)&&(this.res.animate(t.keyframesOpen,t.openOptions),window.removeEventListener("scroll",e))};window.addEventListener("scroll",e)}if(this.options.animation&&this.options.animation.op.fireAt&&"inview"===this.options.animation.op.fireAt){let t=this.options.animation.op;this.res.animate(t.keyframesClose,{duration:0,fill:"forwards"}),new IntersectionObserver(((e,s)=>{e.forEach((e=>{e.isIntersecting&&(this.res.animate(t.keyframesOpen,t.openOptions),s.disconnect())}))})).observe(this.res)}}};window.addEventListener("resize",i),i()}reactOnTransform=t=>{if(t.transform||t.op&&t.op.transform){let e=t.transform;t.transform||(e=t.op.transform),e.duration||(e.duration="3s-ease-in-out"),this.setDefault=(t,e="0px")=>0===t.length?e+" ":t;const s=t=>{const e=t.match(/rotate\(([^)]+)\)/);if(!e)return t;const s=e[1].split(",").map((t=>t.trim()));return 1===s.length?`rotate(${s[0]})`:2===s.length?`rotateX(${s[0]}) rotateY(${s[1]})`:3===s.length?`rotateX(${s[0]}) rotateY(${s[1]}) rotate(${s[2]})`:t},i=()=>{let i="",r="",o="",a="",n="",l="",h="",d="",p="";if(0===e.values.length)return;e.values.forEach((t=>{t.startsWith("tx:")&&(i=t.replace("tx:","")),t.startsWith("ty:")&&(r=t.replace("ty:","")),t.startsWith("tz:")?o=t.replace("tz:",""):t.startsWith("scale(")?a=t:t.startsWith("skew(")?n=t:t.startsWith("rotate(")?l=s(t):t.startsWith("perspective(")?h=t:t.startsWith("matrix(")?d=t:t.startsWith("opacity:")&&(p=t.replace("opacity:",""))})),i=this.setDefault(i),r=this.setDefault(r),o=this.setDefault(o);let c="";if("0px"!=r&&"0px"!=i&&"0px"!=o?c+=`translate3d(${i}, ${r}, ${o})`:"0px"==r&&"0px"==i||(c+=`translate(${i}, ${r})`),a&&(c+=` ${a}`),l&&(c+=` ${l}`),n&&(c+=` ${n}`),h&&(c+=` ${h}`),d&&(c+=` ${d}`),c){if(t.op.transform.duration){let e=t.op.transform.duration.replace(/^(\d+)(s)-/,((t,e,s)=>e/2+s+" ")),s=`transform ${e}, opacity ${e}`;this.res.style.transition=s}else this.res.style.transition="transform 3s ease-in-out, opacity 3s ease-in-out";this.res.style.transform=c,this.res.style.opacity=p}};e.on?this.res.addEventListener(e.on,(()=>{e.delay?setTimeout((()=>{i()}),e.delay):i()})):window.addEventListener("load",(()=>{e.delay?setTimeout((()=>{i()}),e.delay):i()}));const r=()=>{let t="";e.values.forEach((e=>{e.startsWith("tx:")?t+="translateX(0) ":e.startsWith("ty:")?t+="translateY(0) ":e.startsWith("tz:")?t+="translateZ(0) ":e.startsWith("scale(")?t+="scale(1) ":e.startsWith("skew(")?t+="skew(0, 0) ":e.startsWith("rotate(")?t+="rotate(0) ":e.startsWith("perspective(")?t+="perspective(0) ":e.startsWith("matrix(")&&(t+="matrix(1, 0, 0, 1, 0, 0) "),this.res.style.opacity="1"})),t&&(this.res.style.transform=t.trim())};if(e.on)this.res.addEventListener("mouseout",(()=>{e.keep||r()}));else{let t=1e3*parseFloat(e.duration),s=e.closeAfter?e.closeAfter:0;setTimeout((()=>{e.keep||r()}),t/2+s)}}};maxWidth(t){return this.res.style.maxWidth=t,this}removeQuotesFromFirstWord(t){return t.replace(/"([^"]+)":/g,"$1:")}arrayMargin(t,e){return t.includes("left")&&(this.res.style.marginLeft=e),t.includes("right")&&(this.res.style.marginRight=e),t.includes("top")&&(this.res.style.marginTop=e),t.includes("bottom")&&(this.res.style.marginBottom=e),t.includes("all")&&(this.res.style.margin=e),e||(this.res.style.marginBottom=t),this}navBarExpand(){return this.res.style.backgroundColor="green",this.res.animate([{transform:"scaleY(3.0)"}],{duration:2e3,iterations:1,fill:"both"}),this}scrollFade(t,e){return this.res.style.visibility="hidden",this.faden(t,e,"scroll"),this}expand(t){return!1===this.state.isExpanded?"click"===t.on?this.res.addEventListener("click",(()=>{this.innerExpand(t)})):this.innerExpand(t):this.innerExpandBack(t),this.state.isExpanded=!this.state.isExpanded,this}move(t){return"click"===t.on?this.res.addEventListener("click",(()=>{this.moveUpa(t)})):("up"===t.direction&&this.moveUpa(t),"down"===t.direction&&this.moveDowna(t),this.state.isMovedUp=!this.state.isMovedUp,"left"===t.direction&&this.moveLeft(t)),this}moveLeft(t){return this.res.animate([{transform:"translateX(0px)"},{transform:`translateX(-${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play(),this}moveUpa(t){return!1===this.state.isMovedUp?this.res.animate([{transform:"translateX(0px)"},{transform:`translateY(-${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play():this.res.animate([{transform:"translateX(0px)"},{transform:`translateY(${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play(),this}moveDowna(t){return!1===this.state.isMovedDown?this.res.animate([{transform:"translateX(0px)"},{transform:`translateY(${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play():this.res.animate([{transform:"translateX(0px)"},{transform:`translateY(-${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play(),this}moveUpaBack(t){return this.res.animate([{transform:"translateX(0px)"}],{duration:900,iterations:t.iterations,fill:"both"}).play(),this}innerExpandBack(t){this.res.animate([{width:this.prevWidth,height:this.prevHeight}],{duration:900,iterations:t.iterations,fill:"both"})}innerExpand(t){return this.prevWidth=this.res.style.width,this.prevHeight=this.res.style.height,this.res.animate([{width:this.prevWidth,height:this.prevHeight},{width:t.width??this.prevWidth,height:t.height??this.prevHeight}],{duration:900,iterations:t.iterations,fill:"both"}),this}fade(t){return this.res.style.visibility="hidden",this.faden(t.duration,t.from,"load"),t.finalOpacity&&(this.finalOpacity=t.finalOpacity),this}faden(t,e,s){return this.res.style.visibility="hidden",this.scrolled=!1,window.addEventListener(s,(()=>{this.res.style.visibility="visible";var i=window.innerHeight;(this.res.getBoundingClientRect().top-i<=0||"load"==s)&&0==this.scrolled&&("left"==e&&this.res.animate([{transform:"translateX(-30px)"},{transform:"translateX(0px)"}],{duration:t,iterations:1}),"right"==e&&this.res.animate([{transform:"translateX(30px)"},{transform:"translateX(0px)"}],{duration:t,iterations:1}),"top"==e&&this.res.animate([{transform:"translateY(-30px)"},{transform:"translateY(0px)"}],{duration:t,iterations:1}),"bottom"==e&&this.res.animate([{transform:"translateY(30px)"},{transform:"translateY(0px)"}],{duration:t,iterations:1}),this.res.animate([{opacity:"0.0"},{opacity:"1.0"}],{duration:t,iterations:1}),this.scrolled=!0)})),this}}class e extends t{constructor(){super()}setup(t){return this.obj=t,this.animate=void 0===this.obj.animate||this.obj.animate,this.res=this.createSideNav(t),this.res.style.position="relative",this.res.style.zIndex=3,this.closed=!0,this}toggleSideNav(t){this.closed=!this.closed;let e=this.res.children[0];if(this.closed)if(e.style.overflowX="hidden",t.style.opacity=1,this.animate){e.animate([{transform:"translateX(0)"},{transform:"translateX(100%)"}],{duration:300,fill:"forwards"});let t=-1;for(let s of e.children)if(t+=1,this.masterEL[t])for(let e of s.children){let s=this.masterEL[t].options.animation;s&&this.mappedIDS.includes(e.id)&&e.animate(s.op.keyframesClose,s.op.closeOptions)}}else e.style.display="none";else{e.style.overflowX="none",e.children[1].style.border="1px solid orange";let s=-1;for(let t of e.children){s+=1;for(let e of t.children)if(this.mappedIDS.includes(e.id)&&void 0!==this.masterEL[0]){let t=this.masterEL[s].options.animation;if(t){console.log("OPEN KEYFRAMES"),console.log(t.op.keyframesOpen);let s=t.op.openOptions;s.delay||(s.delay=1),s.duration||(s.duration=300),console.log(s),e.animate(t.op.keyframesOpen,s)}}}t.style.opacity=0,this.animate?(e.style.display="flex",e.animate([{transform:"translateX(100%)"},{transform:"translateX(0)"}],{duration:300,fill:"forwards"})):e.style.display="flex"}}createToggleButton(t){const e=document.createElement("button");return e.innerText="☰",e.style.padding="10px 20px",e.style.backgroundColor="transparent",e.style.color=t??"#3498db",e.style.border="none",e.style.borderRadius="5px",e.style.cursor="pointer",e.style.zIndex=1,e.style.fontSize="1.6rem",e}createCloseButton(t){const e=document.createElement("button");return e.innerText="×",e.style.fontSize="1.6rem",e.style.padding="10px 20px",e.style.backgroundColor="transparent",e.style.color=t??"black",e.style.border="none",e.style.borderRadius="5px",e.style.cursor="pointer",e.style.zIndex=1,e.style.alignSelf="flex-end",e}createSideNav(t){const e=document.createElement("div");e.style.display="flex",e.style.justifyContent="flex-end";const s=document.createElement("div");s.style.display="none",s.style.background=this.obj.background||"#1abc9c",s.style.height="100%",window.matchMedia("(max-device-width: 415px)").matches?s.style.width="100%":s.style.width=this.obj.width||"400px",s.style.position="fixed",s.style.right=0,this.animate&&(s.style.transform="translateX(100%)"),s.style.flexDirection="column",s.style.justifyContent="flex-start";const i=this.createToggleButton(this.obj.hamColour.opened),r=this.createCloseButton(this.obj.hamColour.closed);return i.addEventListener("click",(()=>this.toggleSideNav(i))),r.addEventListener("click",(()=>this.toggleSideNav(i))),s.appendChild(r),e.appendChild(s),e.appendChild(i),e}items(t){this.masterEL=t.items.filter((t=>void 0!==t.link)),console.log("EXTRACT IDs"),console.log(t);let e=t.items.filter((t=>void 0===t.items)).map((t=>t.id));if(this.mappedIDS=e,this.item=t,this.res.children[0].appendChild(t.render()),void 0!==this.masterEL[0]){console.log("ANNAX"),console.log(this.masterEL[0]);let t=this.masterEL[0].options.animation;if(t)for(let e of this.res.children[0].children)for(let s of e.children)if(this.mappedIDS.includes(s.id)){let e=t.op.closeOptions;e.delay=0,console.log("ANNAX"),console.log("SETTING INITIAL STATE ZEROING THE DELAY"),console.log(t.op.keyframesClose),console.log(e),s.animate(t.op.keyframesClose,t.op.closeOptions)}}return this}toCode(){let t=`new SideNav().setup(${this.formatObj(this.obj)}, ${this.animate})`;if(this.item){let e=this.item.toCode?this.item.toCode().join(""):this.formatObj(this.item);e=e.replace(/,\s*(\.set\(|\.add\()/g,"\n $1"),t+=`.items(${e})`}return t}formatObj(t){return JSON.stringify(t,null,2).replace(/"(\w+)"\s*:/g,"$1:")}render(t){return t&&document.querySelector(t).appendChild(this.res),this.res}}export{e as SideNav};
|
|
1
|
+
class t{constructor(){this.state={isExpanded:!1,isMovedUp:!1,isMovedDown:!1}}keySet(t){return this.temporaryVal=1,this.res.style[t.key]=t.value,this}onScroll(t){"opacity"===t.value?this.res.style.opacity=t.valMin:"scale"===t.value&&(this.res.style.transform=`scale(${t.valMax})`),window.addEventListener("scroll",(()=>{let e=this.smartRange(window.scrollY,{min:t.from,max:t.to},{min:t.valMin,max:t.valMax});"opacity"===t.value?this.res.style.opacity=e:"scale"===t.value&&(this.res.style.transform=`scale(${e})`)}))}setAny(t){this[Object.keys(t)[0]]=[Object.values(t)[0]]}setID(t){this.id=t}setPrevText(t){this.prevText=t}getCSS(){return this.css}getPX(t){return{xs:"0px",sm:"576px",md:"768px",lg:"992px",xl:"1200px",xxl:"1400px",mxxl:"1800px"}[t]||"Invalid breakpoint"}respad(t){const e=()=>{this.pad(t[0].values);for(let e=0;e<t.length;e++){let s=t[e].breakpoint;window.matchMedia(`(min-width: ${this.getPX(s)}`).matches&&this.pad(t[e].values)}};window.addEventListener("resize",e),e()}resmar(t){const e=()=>{this.mar(t[0].values);for(let e=0;e<t.length;e++){let s=t[e].breakpoint;window.matchMedia(`(max-width: ${this.getPX(s)}`).matches&&this.mar(t[e].values)}};window.addEventListener("resize",e),e()}resprop(t){this.prevBackground=this.res.style.background,this.prevWidth=this.res.style.width,this.prevHeight=this.res.style.height,this.prevBorder=this.res.style.border;const e=()=>{this.res.style.background=this.prevBackground,this.res.style.width=this.prevWidth,this.res.style.height=this.prevHeight,this.res.style.border=this.prevBorder;for(let e=0;e<t.length;e++){let s=t[e].breakpoint;if(window.matchMedia(`(max-width: ${this.getPX(s)}`).matches){const s={};for(const i in t[e])"breakpoint"!==i&&(s[i]=t[e][i]);this.set(s)}}};window.addEventListener("resize",e),e()}isNumber(t){return"number"==typeof t&&!isNaN(t)}pad(t){for(let e=0;e<t.length;e++){let s=Object.keys(t[e]);for(let i=0;i<s.length;i++){let r=s[i],o=t[e][r];for(let t=0;t<r.length;t++)switch(r[t]){case"a":this.res.style.padding=this.isNumber(o)?`${o}px`:o;break;case"t":this.res.style.paddingTop=this.isNumber(o)?`${o}px`:o;break;case"l":this.res.style.paddingLeft=this.isNumber(o)?`${o}px`:o;break;case"r":this.res.style.paddingRight=this.isNumber(o)?`${o}px`:o;break;case"b":this.res.style.paddingBottom=this.isNumber(o)?`${o}px`:o}}}return this}as(t){return this.res.style.alignSelf=t,this}mar(t){for(let e=0;e<t.length;e++){let s=Object.keys(t[e]);for(let i=0;i<s.length;i++){let r=s[i],o=t[e][r];for(let t=0;t<r.length;t++){switch(r[t]){case"a":this.res.style.margin=this.isNumber(o)?`${o}px`:o;break;case"t":this.res.style.marginTop=this.isNumber(o)?`${o}px`:o;break;case"l":this.res.style.marginLeft=this.isNumber(o)?`${o}px`:o;break;case"r":this.res.style.marginRight=this.isNumber(o)?`${o}px`:o;break;case"b":this.res.style.marginBottom=this.isNumber(o)?`${o}px`:o}"auto"===r[t]&&(this.res.style.marginLeft="auto",this.res.style.marginRight="auto")}}}return this}smartRange(t,e,s){t<e.min&&(t=e.min),t>e.max&&(t=e.max);let i=(t-e.min)/(e.max-e.min);e.min>e.max&&(i=(t-e.max)/(e.min-e.max));let r=(s.min-s.max)*i-s.min;if(r=Math.abs(r),s.min<s.max){let t=(s.max+Math.abs(s.min))*i;r=s.min+t}return r}gpos(t){return this.res.style.gridColumn=t.col,this.res.style.gridRow=t.row,this}fluidCopy(t){if(t instanceof Object){this.prevStylex=this.res.style,this.res=document.createElement("h1"),this.res.style.cssText=this.prevStylex.cssText;let e=document.createTextNode(this.text);return this.res.appendChild(e),this.res.style.fontSize=t.exact,this}if("S1"===t){this.prevStylex=this.res.style,this.res=document.createElement("h1"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.625rem + 5.075vw)"}if("S2"===t){this.prevStylex=this.res.style,this.res=document.createElement("h2"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.500rem + 4.3vw)"}if("S3"===t){this.prevStylex=this.res.style,this.res=document.createElement("h3"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.375rem + 3.525vw)"}if("S4"===t){this.prevStylex=this.res.style,this.res=document.createElement("h4"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.250rem + 2.75vw)"}if("S5"===t){this.prevStylex=this.res.style,this.res=document.createElement("h5"),this.res.style.cssText=this.prevStylex.cssText;let t=document.createTextNode(this.text);this.res.appendChild(t),this.res.style.fontSize="calc(1.125rem + 1.975vw)"}return"S6"===t&&(this.res.style.fontSize="calc(1rem + 0.5vw)"),this}setIndex(t){this.index=t}borderObj(t){let e=t.type??"solid";return this.res.style.border=`${t.width} ${e} ${t.color}`,this.res.style.borderRadius=t.radius,this}protoReact(t,e){t.sort(((t,e)=>parseInt(t.range[0])-parseInt(e.range[0])));const s=()=>{const s=window.innerWidth;let i="";this.storedQueries=t.map((t=>t.target)).filter((t=>null!=t));for(const o of t){this.counterIndex++;const[t,a]=o.range,n=parseInt(t),l=parseInt(a);let h=!0;if(o.target){h=!1;for(var r=0;r<o.target.length;r++)o.target[r]===e&&(h=!0)}s>=n&&s<=l&&h&&("gradient"===o.log&&(i+="gradient"),"blast"===o.log&&(i+="blast"),"animation"===o.log&&(i+="animation"),"shadow"===o.log&&(i+="shadow"),"span"===o.log&&(i+="span"),"filter"===o.log&&(i+="filter"),"background"===o.log&&(i+="background"))}this.res.style.margin="";let o=this.res.style.color;for(t.map((t=>t.log)).filter((t=>null!=t)).includes("gradient")&&(this.res.style.WebkitBackgroundClip="",this.res.style.background=""),this.res.style["-webkit-text-stroke"]="",this.res.style.filter="",this.res.style.textShadow="",this.res.style.border="";this.res.firstChild;)this.res.removeChild(this.res.firstChild);if(this.res.textContent=this.text,""===i&&(this.res.style["-webkit-text-fill-color"]="",this.res.style.color=o),"blast"===i){for(r=0;r<t.length;r++){const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}for(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke"]=this.globalBlast,r=0;r<t.length;r++){const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}}if("gradient"===i&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["-webkit-background-clip"]="text",this.res.style.border="1px solid orange"),"background"===i&&(this.res.style.background="orange"),"gradientblast"===i&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["-webkit-background-clip"]="text",this.res.style["-webkit-text-stroke"]=this.globalBlast),"gradientanimation"===i&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["-webkit-background-clip"]="text"),"gradientanimationshadow"===i&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["-webkit-background-clip"]="text",this.res.style.textShadow=this.globalShadow),"animationshadow"===i&&(this.res.style["-webkit-text-fill-color"]="",this.res.style.textShadow=this.globalShadow),"shadow"===i&&(this.res.style["-webkit-text-fill-color"]="",this.res.style.textShadow=this.globalShadow),"span"===i&&this.options.span){let t;for(t=Array.isArray(this.options.span)?this.options.span.filter((t=>"span"===t.op.name))[0]:this.options.span,this.res.textContent="",r=0;r<t.op.parts.length;r++){let e=t.op.parts[r].style,s=new Text(t.op.parts[r].text).setup({type:"span"}).set(e).render();this.res.appendChild(s)}}if("filter"===i){let t=this.options.filtera.op.filter;this.res.style.filter=t,this.res.style.border="8px solid orange"}};window.addEventListener("resize",s),s()}setPref(t){this.preffersId=t}setClass(t){this.class=t}betaReact(t,e){this.ap=!1,this.cta=0,this.once=!1,t.sort(((t,e)=>parseInt(t.range[0])-parseInt(e.range[0])));const s=()=>{const s=window.innerWidth;let i="";this.resCopy=this.res,this.storedQueries=t.map((t=>t.target)).filter((t=>null!=t));for(const o of t){this.counterIndex++;const[t,a]=o.range,n=parseInt(t),l=parseInt(a);let h=!0;if(o.target){h=!1;for(var r=0;r<o.target.length;r++)o.target[r]===e&&(h=!0)}s>=n&&s<=l&&h&&("blast"===o.log&&(i+="blast"),"shadow"===o.log&&(i+="shadow"),"background"===o.log&&(i+="background"),"gradient"===o.log&&(i+="gradient"),"spana"===o.log&&(i+="spana"),"layout"===o.log&&(i+="layout"),"margin"===o.log&&(i+="margin"),o.op&&o.op.margin&&(this.useMargin=o.op.margin))}if(this.res.style.background="",this.res.style.backgroundColor="",this.res.style.textShadow="",this.res.style.border="",this.res.style.margin="",this.res.style["-webkit-text-fill-color"]="",this.res.style["-webkit-text-stroke"]="",this.res.style["-webkit-text-stroke-width"]="","background"===i&&(this.res.style.backgroundColor="green"),"margin"===i)for(r=0;r<t.length;r++){if(!t[r].op)continue;const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}if("blastbackgroundmargin"===i){for(r=0;r<t.length;r++){if(!t[r].op)continue;const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}this.res.style.backgroundColor="green","FlexRowLayoutElement"===this.getType()?this.res.style.border="1px solid orange":(this.res.textContent=this.text,this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"),this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"}if("blastbackground"===i){for(r=0;r<t.length;r++){if(!t[r].op)continue;const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}this.res.style.backgroundColor="green",this.useMargin?this.res.style.margin="1rem":this.res.setAttribute("id","iofhwoiefhoih"),"FlexRowLayoutElement"===this.getType()?this.res.style.border="1px solid orange":(this.res.textContent=this.text,this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"),this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"}if("layout"===i&&(this.res.style.alignSelf="start",this.res.style.border="1px solid purple"),"blast"===i){for(r=0;r<t.length;r++){if(!t[r].op)continue;const e=t[r].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}"FlexRowLayoutElement"===this.getType()?this.res.style.border="1px solid orange":(this.res.textContent=this.text,this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-background-clip"]="text",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"),this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"}"blastgradientbackground"===i&&(this.res.style.border="1px solid yellow",this.res.style["-webkit-text-stroke-color"]="orange",this.res.style["-webkit-text-stroke-width"]="1px"),"gradient"===i&&(this.res.style.background="linear-gradient(to left, #3498db, #1abc9c)","FlexRowLayoutElement"===this.getType()||(this.res.children[0]&&this.res.removeChild(this.res.children[0]),this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-background-clip"]="text",this.res.textContent=this.text)),"shadow"===i&&("FlexRowLayoutElement"===this.getType()||(this.res.children[0]&&this.res.removeChild(this.res.children[0]),this.res.style["-webkit-text-fill-color"]="",this.res.style["-webkit-text-fill-color"]="",this.res.style.textShadow="#1abc9cff -6px 6px , #1abc9c40 -12px 12px",this.res.textContent=this.text))};window.addEventListener("resize",s),s()}cssGen(t,e,s,i){return this.css=[""],[""]}chainReact(t,e,s){this.cssGen(t,e,this.class,void 0!==this.class),this.ap=!1,this.cta=0,this.once=!1;for(let e of t)e.range||(e.range=["0px","999999px"]);t.sort(((t,e)=>parseInt(t.range[0])-parseInt(e.range[0])));const i=()=>{const i=window.visualViewport.width;let r=[],o=[];this.resCopy=this.res,this.storedQueries=t.map((t=>t.target)).filter((t=>null!=t));for(const s of t){this.counterIndex++;const[t,n]=s.range,l=parseInt(t),h=parseInt(n);let d=!0;if(s.target){d=!1;for(var a=0;a<s.target.length;a++)s.target[a]===e&&(d=!0)}i>=l&&i<=h&&d&&(r.push(s.log),o.push(s),s.op&&s.op.margin&&(this.useMargin=s.op.margin))}if(s&&!s.includes("background")&&(this.res.style.background="",this.res.style.backgroundColor=""),this.res.style.textShadow="",s&&!s.includes("border")&&(this.res.style.border=""),s&&!s.includes("margin")&&(this.res.style.margin=""),this.res.style["-webkit-text-fill-color"]="",this.res.style["-webkit-text-stroke-color"]="",this.res.style["-webkit-text-stroke-width"]="",this.res.style.filter="",(r.includes("gradient")||r.includes("shadow"))&&(this.res.style.position="relative",this.res.style.zIndex=-1),r.includes("blast")){let t=o.filter((t=>"blast"===t.log))[0].op.color,e=o.filter((t=>"blast"===t.log))[0].op.width??"1px";"FlexRowLayoutElement"===this.getType()?this.res.style.border=`${e}px solid orange`:(this.res.textContent=this.text,this.res.style["-webkit-text-fill-color"]="transparent",this.res.style["-webkit-text-stroke-color"]=t,this.res.style["-webkit-text-stroke-width"]=`${e}`)}if(r.includes("filter")){let t=o.filter((t=>"filter"===t.log))[0].op.filter;this.res.style.filter=t}if(r.includes("background")&&(this.res.style.backgroundColor="green"),r.includes("gradient")&&(this.res.style["-webkit-text-fill-color"]="transparent",this.res.style.background=this.globalGradient,this.res.style["background-clip"]="text"),r.includes("shadow"))if("FlexRowLayoutElement"===this.getType());else{let t="",e=0;for(a=0;a<this.options.shadow.op.steps;a++)e+=3,t+=`drop-shadow(${e}px ${e}px ${e}px gray) `;this.res.style.filter=t}if(r.includes("margin"))for(a=0;a<t.length;a++){if(!t[a].op)continue;const e=t[a].op.offsets;e&&void 0!==this.index&&(this.res.style.margin=e[Number(this.index)]+"px")}if(r.includes("animation")){if(this.options.animation&&!this.hasAnimated&&!this.options.animation.op.fireAt){this.hasAnimated=!0;let t=this.options.animation.op;this.res.animate(t.keyframesClose,{duration:0,fill:"forwards"}),this.res.animate(t.keyframesOpen,t.openOptions)}if(this.options.animation&&this.options.animation.op.fireAt&&this.options.animation.op.fireAt.endsWith("px")){let t=this.options.animation.op;this.res.animate(t.keyframesClose,{duration:0,fill:"forwards"});const e=()=>{window.scrollY>parseFloat(t.fireAt)&&(this.res.animate(t.keyframesOpen,t.openOptions),window.removeEventListener("scroll",e))};window.addEventListener("scroll",e)}if(this.options.animation&&this.options.animation.op.fireAt&&"inview"===this.options.animation.op.fireAt){let t=this.options.animation.op;this.res.animate(t.keyframesClose,{duration:0,fill:"forwards"}),new IntersectionObserver(((e,s)=>{e.forEach((e=>{e.isIntersecting&&(this.res.animate(t.keyframesOpen,t.openOptions),s.disconnect())}))})).observe(this.res)}}};window.addEventListener("resize",i),i()}reactOnTransform=t=>{if(t.transform||t.op&&t.op.transform){let e=t.transform;t.transform||(e=t.op.transform),e.duration||(e.duration="3s-ease-in-out"),this.setDefault=(t,e="0px")=>0===t.length?e+" ":t;const s=t=>{const e=t.match(/rotate\(([^)]+)\)/);if(!e)return t;const s=e[1].split(",").map((t=>t.trim()));return 1===s.length?`rotate(${s[0]})`:2===s.length?`rotateX(${s[0]}) rotateY(${s[1]})`:3===s.length?`rotateX(${s[0]}) rotateY(${s[1]}) rotate(${s[2]})`:t},i=()=>{let i="",r="",o="",a="",n="",l="",h="",d="",p="";if(0===e.values.length)return;e.values.forEach((t=>{t.startsWith("tx:")&&(i=t.replace("tx:","")),t.startsWith("ty:")&&(r=t.replace("ty:","")),t.startsWith("tz:")?o=t.replace("tz:",""):t.startsWith("scale(")?a=t:t.startsWith("skew(")?n=t:t.startsWith("rotate(")?l=s(t):t.startsWith("perspective(")?h=t:t.startsWith("matrix(")?d=t:t.startsWith("opacity:")&&(p=t.replace("opacity:",""))})),i=this.setDefault(i),r=this.setDefault(r),o=this.setDefault(o);let c="";if("0px"!=r&&"0px"!=i&&"0px"!=o?c+=`translate3d(${i}, ${r}, ${o})`:"0px"==r&&"0px"==i||(c+=`translate(${i}, ${r})`),a&&(c+=` ${a}`),l&&(c+=` ${l}`),n&&(c+=` ${n}`),h&&(c+=` ${h}`),d&&(c+=` ${d}`),c){if(t.op.transform.duration){let e=t.op.transform.duration.replace(/^(\d+)(s)-/,((t,e,s)=>e/2+s+" ")),s=`transform ${e}, opacity ${e}`;this.res.style.transition=s}else this.res.style.transition="transform 3s ease-in-out, opacity 3s ease-in-out";this.res.style.transform=c,this.res.style.opacity=p}};e.on?this.res.addEventListener(e.on,(()=>{e.delay?setTimeout((()=>{i()}),e.delay):i()})):window.addEventListener("load",(()=>{e.delay?setTimeout((()=>{i()}),e.delay):i()}));const r=()=>{let t="";e.values.forEach((e=>{e.startsWith("tx:")?t+="translateX(0) ":e.startsWith("ty:")?t+="translateY(0) ":e.startsWith("tz:")?t+="translateZ(0) ":e.startsWith("scale(")?t+="scale(1) ":e.startsWith("skew(")?t+="skew(0, 0) ":e.startsWith("rotate(")?t+="rotate(0) ":e.startsWith("perspective(")?t+="perspective(0) ":e.startsWith("matrix(")&&(t+="matrix(1, 0, 0, 1, 0, 0) "),this.res.style.opacity="1"})),t&&(this.res.style.transform=t.trim())};if(e.on)this.res.addEventListener("mouseout",(()=>{e.keep||r()}));else{let t=1e3*parseFloat(e.duration),s=e.closeAfter?e.closeAfter:0;setTimeout((()=>{e.keep||r()}),t/2+s)}}};maxWidth(t){return this.res.style.maxWidth=t,this}removeQuotesFromFirstWord(t){return t.replace(/"([^"]+)":/g,"$1:")}arrayMargin(t,e){return t.includes("left")&&(this.res.style.marginLeft=e),t.includes("right")&&(this.res.style.marginRight=e),t.includes("top")&&(this.res.style.marginTop=e),t.includes("bottom")&&(this.res.style.marginBottom=e),t.includes("all")&&(this.res.style.margin=e),e||(this.res.style.marginBottom=t),this}navBarExpand(){return this.res.style.backgroundColor="green",this.res.animate([{transform:"scaleY(3.0)"}],{duration:2e3,iterations:1,fill:"both"}),this}scrollFade(t,e){return this.res.style.visibility="hidden",this.faden(t,e,"scroll"),this}expand(t){return!1===this.state.isExpanded?"click"===t.on?this.res.addEventListener("click",(()=>{this.innerExpand(t)})):this.innerExpand(t):this.innerExpandBack(t),this.state.isExpanded=!this.state.isExpanded,this}move(t){return"click"===t.on?this.res.addEventListener("click",(()=>{this.moveUpa(t)})):("up"===t.direction&&this.moveUpa(t),"down"===t.direction&&this.moveDowna(t),this.state.isMovedUp=!this.state.isMovedUp,"left"===t.direction&&this.moveLeft(t)),this}moveLeft(t){return this.res.animate([{transform:"translateX(0px)"},{transform:`translateX(-${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play(),this}moveUpa(t){return!1===this.state.isMovedUp?this.res.animate([{transform:"translateX(0px)"},{transform:`translateY(-${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play():this.res.animate([{transform:"translateX(0px)"},{transform:`translateY(${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play(),this}moveDowna(t){return!1===this.state.isMovedDown?this.res.animate([{transform:"translateX(0px)"},{transform:`translateY(${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play():this.res.animate([{transform:"translateX(0px)"},{transform:`translateY(-${t.distance})`}],{duration:900,iterations:t.iterations,fill:"both"}).play(),this}moveUpaBack(t){return this.res.animate([{transform:"translateX(0px)"}],{duration:900,iterations:t.iterations,fill:"both"}).play(),this}innerExpandBack(t){this.res.animate([{width:this.prevWidth,height:this.prevHeight}],{duration:900,iterations:t.iterations,fill:"both"})}innerExpand(t){return this.prevWidth=this.res.style.width,this.prevHeight=this.res.style.height,this.res.animate([{width:this.prevWidth,height:this.prevHeight},{width:t.width??this.prevWidth,height:t.height??this.prevHeight}],{duration:900,iterations:t.iterations,fill:"both"}),this}fade(t){return this.res.style.visibility="hidden",this.faden(t.duration,t.from,"load"),t.finalOpacity&&(this.finalOpacity=t.finalOpacity),this}faden(t,e,s){return this.res.style.visibility="hidden",this.scrolled=!1,window.addEventListener(s,(()=>{this.res.style.visibility="visible";var i=window.innerHeight;(this.res.getBoundingClientRect().top-i<=0||"load"==s)&&0==this.scrolled&&("left"==e&&this.res.animate([{transform:"translateX(-30px)"},{transform:"translateX(0px)"}],{duration:t,iterations:1}),"right"==e&&this.res.animate([{transform:"translateX(30px)"},{transform:"translateX(0px)"}],{duration:t,iterations:1}),"top"==e&&this.res.animate([{transform:"translateY(-30px)"},{transform:"translateY(0px)"}],{duration:t,iterations:1}),"bottom"==e&&this.res.animate([{transform:"translateY(30px)"},{transform:"translateY(0px)"}],{duration:t,iterations:1}),this.res.animate([{opacity:"0.0"},{opacity:"1.0"}],{duration:t,iterations:1}),this.scrolled=!0)})),this}}class e extends t{constructor(){super()}set(t){return this.obj=t,this.animate=void 0===this.obj.animate||this.obj.animate,this.res=this.createSideNav(t),this.res.style.position="relative",this.res.style.zIndex=3,this.closed=!0,this}toggleSideNav(t){this.closed=!this.closed;let e=this.res.children[0];if(this.closed)if(e.style.overflowX="hidden",t.style.opacity=1,this.animate){e.animate([{transform:"translateX(0)"},{transform:"translateX(100%)"}],{duration:300,fill:"forwards"});let t=-1;for(let s of e.children)if(t+=1,this.masterEL[t])for(let e of s.children){let s=this.masterEL[t].options.animation;s&&this.mappedIDS.includes(e.id)&&e.animate(s.op.keyframesClose,s.op.closeOptions)}}else e.style.display="none";else{e.style.overflowX="none",e.children[1].style.border="1px solid orange";let s=-1;for(let t of e.children){s+=1;for(let e of t.children)if(this.mappedIDS.includes(e.id)&&void 0!==this.masterEL[0]){let t=this.masterEL[s].options.animation;if(t){console.log("OPEN KEYFRAMES"),console.log(t.op.keyframesOpen);let s=t.op.openOptions;s.delay||(s.delay=1),s.duration||(s.duration=300),console.log(s),e.animate(t.op.keyframesOpen,s)}}}t.style.opacity=0,this.animate?(e.style.display="flex",e.animate([{transform:"translateX(100%)"},{transform:"translateX(0)"}],{duration:300,fill:"forwards"})):e.style.display="flex"}}createToggleButton(t){const e=document.createElement("button");return e.innerText="☰",e.style.padding="10px 20px",e.style.backgroundColor="transparent",e.style.color=t??"#3498db",e.style.border="none",e.style.borderRadius="5px",e.style.cursor="pointer",e.style.zIndex=1,e.style.fontSize="1.6rem",e}createCloseButton(t){const e=document.createElement("button");return e.innerText="×",e.style.fontSize="1.6rem",e.style.padding="10px 20px",e.style.backgroundColor="transparent",e.style.color=t??"black",e.style.border="none",e.style.borderRadius="5px",e.style.cursor="pointer",e.style.zIndex=1,e.style.alignSelf="flex-end",e}createSideNav(t){const e=document.createElement("div");e.style.display="flex",e.style.justifyContent="flex-end";const s=document.createElement("div");s.style.display="none",s.style.background=this.obj.background||"#1abc9c",s.style.height="100%",window.matchMedia("(max-device-width: 415px)").matches?s.style.width="100%":s.style.width=this.obj.width||"400px",s.style.position="fixed",s.style.right=0,this.animate&&(s.style.transform="translateX(100%)"),s.style.flexDirection="column",s.style.justifyContent="flex-start";const i=this.createToggleButton(this.obj.hamColour.opened),r=this.createCloseButton(this.obj.hamColour.closed);return i.addEventListener("click",(()=>this.toggleSideNav(i))),r.addEventListener("click",(()=>this.toggleSideNav(i))),s.appendChild(r),e.appendChild(s),e.appendChild(i),e}items(t){this.masterEL=t.items.filter((t=>void 0!==t.link)),console.log("EXTRACT IDs"),console.log(t);let e=t.items.filter((t=>void 0===t.items)).map((t=>t.id));if(this.mappedIDS=e,this.item=t,this.res.children[0].appendChild(t.render()),void 0!==this.masterEL[0]){console.log("ANNAX"),console.log(this.masterEL[0]);let t=this.masterEL[0].options.animation;if(t)for(let e of this.res.children[0].children)for(let s of e.children)if(this.mappedIDS.includes(s.id)){let e=t.op.closeOptions;e.delay=0,console.log("ANNAX"),console.log("SETTING INITIAL STATE ZEROING THE DELAY"),console.log(t.op.keyframesClose),console.log(e),s.animate(t.op.keyframesClose,t.op.closeOptions)}}return this}toCode(){let t=`new SideNav().set(${this.formatObj(this.obj)})`;if(this.item){let e=this.item.toCode?this.item.toCode().join(""):this.formatObj(this.item);e=e.replace(/,\s*(\.set\(|\.add\()/g,"\n $1"),t+=`.items(${e})`}return t}formatObj(t){return JSON.stringify(t,null,2).replace(/"(\w+)"\s*:/g,"$1:")}render(t){return t&&document.querySelector(t).appendChild(this.res),this.res}}export{e as SideNav};
|
package/layout/sideNavBar.js
CHANGED
|
@@ -5,7 +5,7 @@ class SideNav extends Animator {
|
|
|
5
5
|
super();
|
|
6
6
|
}
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
set(obj) {
|
|
9
9
|
this.obj = obj; // this.obj.animate || true LOL this.obj.animate ? this.obj.animate : true
|
|
10
10
|
this.animate = this.obj.animate !== undefined ? this.obj.animate : true; // could be never false
|
|
11
11
|
this.res = this.createSideNav(obj);
|
|
@@ -282,7 +282,7 @@ class SideNav extends Animator {
|
|
|
282
282
|
|
|
283
283
|
toCode() {
|
|
284
284
|
// Convert object to string with JSON.stringify
|
|
285
|
-
let codeStr = `new SideNav().
|
|
285
|
+
let codeStr = `new SideNav().set(${this.formatObj(this.obj)})`;
|
|
286
286
|
|
|
287
287
|
if (this.item) {
|
|
288
288
|
let itemCode = this.item.toCode ? this.item.toCode().join("") : this.formatObj(this.item);
|
package/lib/elementMapper.js
CHANGED