| 1 |
!function(){"use strict";class t{#t=null;#e=null;#i=null;#s=null;#n=null;#o=null;#a=null;#r=1440;#l=900;#c=[];#h=null;#u=[];#d={width:1440,height:900,orientation:"landscape",resolution:1,colorScheme:"light"};constructor(){this.#t=document.getElementById("bf-preview-frame"),this.#e=document.querySelectorAll(".bf-breakpoint-btn"),this.#i=document.getElementById("bf-width-input"),this.#s=document.getElementById("bf-copy-btn"),this.#n=document.getElementById("bf-shortcode"),this.#o=document.getElementById("bf-tooltip"),this.#a=document.querySelector(".bf-dummy-filler-btn");const t=document.body.dataset.bfCssUrls;if(t)try{this.#u=JSON.parse(t)}catch(t){this.#u=[]}this.#p()}async#p(){this.#m(),await this.#y(),this.#f(),this.#v(),this.#w(),this.#E(),this.#B(this.#r)}#E(){window.matchMedia&&window.matchMedia("(prefers-color-scheme: dark)").matches&&(this.#d.colorScheme="dark"),this.#d.resolution=window.devicePixelRatio||1}#m(){this.#h=document.createElement("style"),this.#h.id="bf-breakpoint-styles",document.head.appendChild(this.#h)}async#y(){if(0===this.#u.length)return;const t=this.#u.map(t=>fetch(t).then(t=>t.ok?t.text():"").catch(()=>""));(await Promise.all(t)).forEach(t=>{t&&this.#b(t)})}#b(t){t.split(/@media\s*/).forEach((t,e)=>{if(0===e)return;const i=t.match(/^\s*([^{]+)\s*\{/);if(!i)return;const s=i[1].trim();let n=0,o="",a=!1;for(let e=t.indexOf("{");e<t.length;e+=1)if("{"===t[e])a&&(o+=t[e]),n+=1,a=!0;else if("}"===t[e]){if(n-=1,0===n)break;o+=t[e]}else a&&(o+=t[e]);const r=this.#C(s);r&&this.#c.push({originalCondition:s,parsedCondition:r,content:o.trim()})})}#C(t){const e=t.split(/\s*,\s*/);if(e.length>1)return{type:"or",conditions:e.map(t=>this.#C(t)).filter(Boolean)};const i=t.match(/^\s*not\s+(.+)$/i);if(i){const t=this.#C(i[1]);return t?{type:"not",condition:t}:null}const s=t.split(/\s+and\s+/i);return s.length>1?{type:"and",conditions:s.map(t=>this.#g(t)).filter(Boolean)}:this.#g(t)}#g(t){const e=t.replace(/^\s*\(?\s*|\s*\)?\s*$/g,"").trim();if(/^(all|screen|print|speech)$/i.test(e))return{type:"mediaType",value:e.toLowerCase()};const i=e.match(/^([\w-]+)\s*:\s*(.+)$/i);if(i){const t=i[1].toLowerCase(),e=i[2].trim();return this.#k(t,e)}return/^[\w-]+$/.test(e)?{type:"boolean",feature:e.toLowerCase()}:null}#k(t,e){if(["width","min-width","max-width","height","min-height","max-height"].includes(t)){const i=this.#x(e);if(null!==i)return{type:"dimension",feature:t,value:i,originalValue:e}}if("orientation"===t)return{type:"orientation",value:e.toLowerCase()};if(["resolution","min-resolution","max-resolution"].includes(t)){const i=this.#S(e);if(null!==i)return{type:"resolution",feature:t,value:i,originalValue:e}}if("prefers-color-scheme"===t)return{type:"colorScheme",value:e.toLowerCase()};if(["aspect-ratio","min-aspect-ratio","max-aspect-ratio"].includes(t)){const i=e.match(/^(\d+)\s*\/\s*(\d+)$/);if(i)return{type:"aspectRatio",feature:t,value:parseInt(i[1],10)/parseInt(i[2],10),originalValue:e}}return{type:"other",feature:t,value:e}}#x(t){const e=t.match(/^([\d.]+)\s*(px|em|rem|vw|vh|%)?$/i);if(!e)return null;const i=parseFloat(e[1]);switch((e[2]||"px").toLowerCase()){case"px":default:return i;case"em":case"rem":return 16*i;case"vw":case"%":return i/100*this.#d.width;case"vh":return i/100*this.#d.height}}#S(t){const e=t.match(/^([\d.]+)\s*(dpi|dpcm|dppx|x)?$/i);if(!e)return null;const i=parseFloat(e[1]);switch((e[2]||"dppx").toLowerCase()){case"dpi":return i/96;case"dpcm":return i/37.79;default:return i}}#L(t){if(!t)return!1;switch(t.type){case"or":return t.conditions.some(t=>this.#L(t));case"and":return t.conditions.every(t=>this.#L(t));case"not":return!this.#L(t.condition);case"mediaType":return["all","screen"].includes(t.value);case"dimension":return this.#I(t);case"orientation":return this.#d.orientation===t.value;case"resolution":return this.#M(t);case"colorScheme":return this.#d.colorScheme===t.value;case"aspectRatio":return this.#R(t);case"boolean":return["color","hover","pointer","grid"].includes(t.feature);default:return!0}}#I(t){const{feature:e,value:i}=t,s=e.includes("height")?this.#d.height:this.#d.width;return e.startsWith("max-")?s<=i:e.startsWith("min-")?s>=i:Math.abs(s-i)<1}#M(t){const{feature:e,value:i}=t,s=this.#d.resolution;return"min-resolution"===e?s>=i:"max-resolution"===e?s<=i:Math.abs(s-i)<.1}#R(t){const{feature:e,value:i}=t,s=this.#d.width/this.#d.height;return"min-aspect-ratio"===e?s>=i:"max-aspect-ratio"===e?s<=i:Math.abs(s-i)<.01}#F(t){if(this.#d.width=t,this.#d.height=Math.round(.625*t),this.#d.orientation=t>this.#d.height?"landscape":"portrait",0===this.#c.length)return void(this.#h.textContent="");const e=[];this.#c.forEach(t=>{this.#L(t.parsedCondition)&&t.content&&e.push(t.content)});const i=e.map(t=>this.#W(t)).join("\n");this.#h.textContent=i}#W(t){return t.replace(/:\s*([^;{}]+);/g,(t,e)=>e.includes("!important")?t:`: ${e.trim()} !important;`)}#f(){this.#e&&this.#t&&this.#e.forEach(t=>{t.addEventListener("click",()=>{const e=parseInt(t.dataset.width,10);this.#e.forEach(t=>t.classList.remove("active")),t.classList.add("active"),this.#i&&(this.#i.value=e),this.#B(e)})})}#v(){this.#i&&this.#t&&(this.#i.addEventListener("input",t=>{const e=parseInt(t.target.value,10);e>=320&&e<=1920&&(this.#B(e),this.#T(e))}),this.#i.addEventListener("change",t=>{const e=t.target;let i=parseInt(e.value,10);i=Math.max(320,Math.min(1920,i||320)),e.value=i,this.#B(i),this.#T(i)}))}#B(t){this.#t&&(this.#r=t,this.#t.style.maxWidth=`${t}px`,this.#F(t))}#T(t){let e="desktop",i=1/0;this.#e.forEach(s=>{const n=parseInt(s.dataset.width,10),o=Math.abs(t-n);o<i&&(i=o,e=s.dataset.breakpoint)}),this.#e.forEach(t=>{t.classList.remove("active"),t.dataset.breakpoint===e&&t.classList.add("active")})}#$(){this.#a&&this.#a.addEventListener("click",()=>{const t=document.querySelector("form");t&&void 0!==window.bit_fake_filler&&new window.bit_fake_filler(t).fill()})}#w(){this.#s&&this.#n&&this.#s.addEventListener("click",async()=>{const t=this.#n.textContent;try{await navigator.clipboard.writeText(t),this.#V()}catch(e){this.#Q(t)}})}#V(){this.#s.classList.add("copied");const t=this.#s.innerHTML;this.#s.innerHTML='\n <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">\n <polyline points="20 6 9 17 4 12"></polyline>\n </svg>\n ',this.#U("Copied!",this.#s),setTimeout(()=>{this.#s.classList.remove("copied"),this.#s.innerHTML=t,this.#D()},1500)}#Q(t){const e=document.createElement("textarea");e.value=t,e.style.position="fixed",e.style.opacity="0",document.body.appendChild(e),e.select();try{document.execCommand("copy"),this.#V()}catch(t){}document.body.removeChild(e)}#U(t,e){if(!this.#o)return;const i=e.getBoundingClientRect();this.#o.textContent=t,this.#o.style.left=i.left+i.width/2-this.#o.offsetWidth/2+"px",this.#o.style.top=`${i.bottom+8}px`,this.#o.classList.add("show")}#D(){this.#o&&this.#o.classList.remove("show")}}document.addEventListener("DOMContentLoaded",()=>{new t})}(); |
