https://www.originalgrain.com/cdn/shop/t/893/assets/engraving-type…?v=145760156967201638221790870198

1class EngravingTypesAndPreview extends HTMLElement{constructor(){super(),this.engravingData=this.getEngravingData(),this.currentProductEngravingOptions=this.engravingData?.currentProductEngravingOptions}connectedCallback(){this.initElements(),this.attachEventListeners(),this.initializeEngraving()}disconnectedCallback(){this.engravingTypesContainer.removeEventListener("input",event=>this.engravingTypesEventHandler(event))}initElements(){this.engravingTypesContainer=this.querySelector("#engraving-component--engraving-types"),this.engravingPreviewContainer=this.querySelector("#engraving-component--engraving-previews")}attachEventListeners(){this.engravingTypesContainer.addEventListener("input",event=>this.engravingTypesEventHandler(event)),document.addEventListener("engravingLineInput",this.handleEngravingLineInput.bind(this)),document.addEventListener("cartItemAddEngraving",event=>{this.currentProductEngravingOptions=event.detail.currentProductEngravingOptions,this.initializeEngraving()}),document.addEventListener("mainProductOpenModalEvent",()=>{this.currentProductEngravingOptions=this.engravingData?.currentProductEngravingOptions,this.initializeEngraving()}),document.addEventListener("cartItemEditEngraving",event=>{this.currentProductEngravingOptions=event.detail.currentProductEngravingOptions,this.initializeEngraving()})}engravingTypesEventHandler(event){const selectedEngravingType=event.target.value;this.hideAllElements(".engraving-preview-element"),this.showEngravingPreview(selectedEngravingType);const engravingTypeEvent=new CustomEvent("engravingTypeSelected",{detail:{engravingType:selectedEngravingType,engravingLines:this.getEngravingLines(selectedEngravingType)}});document.dispatchEvent(engravingTypeEvent)}initializeEngraving(){this.hideAllElements(".engraving-type-item"),this.hideAllElements(".engraving-preview-element");const defaultOption=this.getDefaultEngravingOption();defaultOption&&(this.showEngravingType(defaultOption.engravingType),this.showEngravingPreview(defaultOption.engravingType))}handleEngravingLineInput(event){const{line,value}=event.detail;this.engravingPreviewContainer.querySelectorAll(".engraving-preview-element").forEach(el=>{let engravingLine=el.querySelector(`[data-engraving-line="${line}"]`);engravingLine&&(engravingLine.innerHTML=value||`Engraving Line ${line}`)})}showEngravingType(type){const input=this.engravingTypesContainer.querySelector(`.engraving-type-item[data-engraving-type="${type}"] input[type="radio"]`);input&&(input.checked=!0),this.currentProductEngravingOptions.forEach(({engravingType})=>{const typeItem=this.engravingTypesContainer.querySelector(`.engraving-type-item[data-engraving-type="${engravingType}"]`);typeItem&&(typeItem.style.display="block")})}showEngravingPreview(type){const preview=this.engravingPreviewContainer.querySelector(`[data-engraving-preview-type="${type}"]`);preview&&(preview.style.display="block")}hideAllElements(selector){this.querySelectorAll(selector).forEach(el=>el.style.display="none")}getEngravingLines(engravingType){return this.currentProductEngravingOptions.find(option=>option.engravingType===engravingType).engravingLines}getEngravingData(){return JSON.parse(document.querySelector("#engraving-options-data").textContent)}getDefaultEngravingOption(){return this.currentProductEngravingOptions[0]||[]}getSelectedEngravingType(){return this.engravingTypesContainer.querySelector('input[name="engraving-type"]:checked').value}}customElements.define("engraving-types-and-preview-component",EngravingTypesAndPreview);
2//# sourceMappingURL=/cdn/shop/t/893/assets/engraving-types-and-preview-component.js.map?v=145760156967201638221790870198