https://www.fireclaytile.com/cdn/shop/t/18/assets/sqft-calculator.js?v=166766629827518171511781209124

1export function sqftToBoxes(sqft,overagePct,sqftPerBox){return Math.max(1,Math.ceil(sqft*(1+overagePct/100)/sqftPerBox))}export function boxesToSqft(boxes,overagePct,sqftPerBox){return Math.max(1,Math.floor(boxes*sqftPerBox/(1+overagePct/100)))}export function formatSqft(num){return String(Number(num.toFixed(2)))}class SqftCalculator extends HTMLElement{connectedCallback(){this._isSqft=this.getAttribute("data-is-sqft")||!1,this._isFt=this.getAttribute("data-is-ft")||!1,this._isItem=this.getAttribute("data-is-item")||!1,this._sqftInput=this.querySelector("[data-sqft-input]"),this._boxesInput=this.querySelector("[data-boxes-input]"),this._overageSelect=this.querySelector("[data-overage-select]"),this._totalSqftDisplay=this.querySelector("[data-total-sqft]"),this._quantityOutput=this.querySelector("[data-quantity-output]"),this._propSqft=this.querySelector("[data-prop-sqft]"),this._propOverage=this.querySelector("[data-prop-overage]"),this._totalPriceDisplay=this.querySelector("[data-total-price]"),this._mode=this.getAttribute("data-mode")||"sqft",this._currencyFormatter=new Intl.NumberFormat(Shopify.locale,{style:"currency",currency:this.getAttribute("data-currency")||Shopify.currency.active}),this._mode==="box"?(this._sqftPerBox=parseFloat(this.getAttribute("data-sqft-per-box"))||1,this._boxPrice=parseInt(this.getAttribute("data-box-price"),10)||0,this._boxPriceDetail=this.querySelector("[data-box-price-detail]"),this._propBoxes=this.querySelector("[data-prop-boxes]"),this._propSqftPerBox=this.querySelector("[data-prop-sqft-per-box]"),this._summarySubtotal=this.querySelector("[data-summary-subtotal]"),this._summaryOverage=this.querySelector("[data-summary-overage]"),this._summaryTotal=this.querySelector("[data-summary-total]"),this._summaryBoxes=this.querySelector("[data-summary-boxes]"),this._summarySqftIncluded=this.querySelector("[data-summary-sqft-included]")):this._unitPrice=parseInt(this.getAttribute("data-unit-price"),10)||0,this._mode==="box"?this._initBoxMode():(this._sqftInput&&this._sqftInput.addEventListener("input",()=>this._recalculate()),this._overageSelect&&this._overageSelect.addEventListener("change",()=>this._recalculate()),this._recalculate())}get sbfChargedQty(){return this._sbfChargedQty}_unitLabel(){return this._isSqft?"sqft":this._isFt?"lf":this._isItem?"pieces":""}_overagePct(){return parseInt(this._overageSelect?this._overageSelect.value:"",10)||0}_initBoxMode(){const seedSqft=parseInt(this._sqftInput&&this._sqftInput.value,10);Number.isFinite(seedSqft)&&seedSqft>0?(this._boxes=sqftToBoxes(seedSqft,this._overagePct(),this._sqftPerBox),this._boxesInput&&(this._boxesInput.value=String(this._boxes))):(this._boxes=Math.max(1,parseInt(this._boxesInput&&this._boxesInput.value,10)||1),this._boxesInput&&(this._boxesInput.value=String(this._boxes))),this._sqftInput&&this._sqftInput.addEventListener("input",()=>this._onSqftInput()),this._boxesInput&&(this._boxesInput.addEventListener("input",()=>this._onBoxesInput()),this._boxesInput.addEventListener("change",()=>this._onBoxesChange())),this._overageSelect&&this._overageSelect.addEventListener("change",()=>this._onSqftInput()),this._renderBox()}_onSqftInput(){const sqft=parseInt(this._sqftInput.value,10);!Number.isFinite(sqft)||sqft<=0||(this._boxes=sqftToBoxes(sqft,this._overagePct(),this._sqftPerBox),this._boxesInput&&(this._boxesInput.value=String(this._boxes)),this._renderBox())}_onBoxesInput(){const boxes=parseInt(this._boxesInput.value,10);if(!Number.isFinite(boxes)||boxes<=0)return;this._boxes=boxes;const sqft=boxesToSqft(boxes,this._overagePct(),this._sqftPerBox);this._sqftInput&&(this._sqftInput.value=String(sqft)),this._renderBox()}_onBoxesChange(){this._boxesInput.value!==String(this._boxes)&&(this._boxesInput.value=String(this._boxes),this._sqftInput&&(this._sqftInput.value=String(boxesToSqft(this._boxes,this._overagePct(),this._sqftPerBox))),this._renderBox())}_renderBox(){const boxes=this._boxes,overagePct=this._overagePct(),sqft=parseInt(this._sqftInput&&this._sqftInput.value,10)||0,overageSqft=Math.ceil(sqft*(overagePct/100)),totalSqft=Math.ceil(sqft*(1+overagePct/100)),sqftIncluded=boxes*this._sqftPerBox,unit=this._unitLabel(),boxLabel=boxes===1?"box":"boxes";if(this._summarySubtotal&&(this._summarySubtotal.textContent=`${formatSqft(sqft)} ${unit}`),this._summaryOverage&&(this._summaryOverage.textContent=`${formatSqft(overageSqft)} ${unit}`),this._summaryTotal&&(this._summaryTotal.textContent=`${formatSqft(totalSqft)} ${unit}`),this._summaryBoxes&&(this._summaryBoxes.textContent=`${boxes} ${boxLabel}`),this._summarySqftIncluded&&(this._summarySqftIncluded.textContent=`${formatSqft(sqftIncluded)} ${unit}`),this._propBoxes&&(this._propBoxes.value=String(boxes)),this._propSqft&&(this._propSqft.value=String(sqft)),this._propOverage&&(this._propOverage.value=overagePct>0?`${overagePct}%`:"None"),this._totalPriceDisplay&&(this._totalPriceDisplay.textContent=this._currencyFormatter.format(boxes*this._boxPrice/100)),this._boxPriceDetail){const formattedBoxPrice=this._currencyFormatter.format(this._boxPrice/100);this._boxPriceDetail.textContent=`${boxes} ${boxLabel} at ${formattedBoxPrice} per box`}this._sbfChargedQty=boxes*this._sqftPerBox,this.dispatchEvent(new CustomEvent("sqft:change",{bubbles:!0,detail:{sqft,overagePct,totalSqft,boxesNeeded:boxes,sbfChargedQty:this._sbfChargedQty}}))}_recalculate(){const sqftRaw=this._sqftInput?this._sqftInput.value:"",sqft=Math.max(1,parseInt(sqftRaw,10)||1),overagePct=this._overagePct(),totalSqft=Math.ceil(sqft*(1+overagePct/100));

1this._totalSqftDisplay&&(this._totalSqftDisplay.textContent=`${totalSqft} ${this._unitLabel()}`),this._propSqft&&(this._propSqft.value=String(sqft)),this._propOverage&&(this._propOverage.value=overagePct>0?`${overagePct}%`:"None"),this._recalculateSqft(sqft,overagePct,totalSqft,sqftRaw)}_recalculateSqft(sqft,overagePct,totalSqft,sqftRaw){this._quantityOutput&&(this._quantityOutput.value=String(totalSqft)),this._totalPriceDisplay&&(this._totalPriceDisplay.textContent=this._currencyFormatter.format(totalSqft*this._unitPrice/100));const entered=sqftRaw!=null&&String(sqftRaw).trim()!==""&&parseInt(sqftRaw,10)>0;this._sbfChargedQty=entered?totalSqft:0,this.dispatchEvent(new CustomEvent("sqft:change",{bubbles:!0,detail:{sqft,overagePct,totalSqft,sbfChargedQty:this._sbfChargedQty}}))}}window.customElements.get("sqft-calculator")||window.customElements.define("sqft-calculator",SqftCalculator);
2//# sourceMappingURL=/cdn/shop/t/18/assets/sqft-calculator.js.map?v=166766629827518171511781209124