https://gloveleya.com/cdn/shop/t/54/assets/yg-script.js?v=76879490741506690971791098914

1class YGScriptLoader extends HTMLElement{loadScript(url,fn){if(url){let loadScript=document.createElement("script");loadScript.src=url,document.body.appendChild(loadScript),loadScript.onload=()=>{fn()},loadScript.onerror=()=>{console.error("Script load error")}}}loadArtTemplate(templateID,HTMLClass,data){let html=template(templateID,data);document.getElementById(HTMLClass).innerHTML=html;let handler={set(target,key,value){target[key]=value;let html2=template(templateID,data);return document.getElementById(HTMLClass).innerHTML=html2,!0}};return new Proxy(data,handler)}toggleImage(imageClass,radioID,objTitle,text){let image=this.querySelector(imageClass);this.querySelector(radioID).querySelectorAll(".yg-doll-radio").forEach(radio=>{radio.checked&&(image.src=radio.getAttribute("data-image"),text=="none"||!text?YGArtTemplate.orderNote[objTitle]="":YGArtTemplate.orderNote[objTitle]=text+`(${radio.value})`),radio.addEventListener("change",function(e){image.src=e.target.getAttribute("data-image"),text=="none"||!text?YGArtTemplate.orderNote[objTitle]="":YGArtTemplate.orderNote[objTitle]=text+`(${radio.value})`})})}addImageText(text){let addTextBox=this.querySelector(".yg-image-add-text-box"),addText=this.querySelector(".yg-image-add-text"),fontSize=100;addText.innerHTML=text,YGArtTemplate.textObj.text=text;do fontSize--,YGArtTemplate.textObj.fontSize=fontSize+"px",addText.style.fontSize=fontSize+"px";while(addText.offsetWidth>addTextBox.offsetWidth||addText.offsetHeight>addTextBox.offsetHeight)}undataOffset(checkedItem){let addTextBox=this.querySelector(".yg-image-add-text-box"),imageBoxWidth=this.querySelector(".yg-image-list").offsetWidth,imageBoxHeight=this.querySelector(".yg-image-list").offsetHeight;addTextBox.style.left=`${checkedItem.getAttribute("data-offset-x")}%`,addTextBox.style.top=`${checkedItem.getAttribute("data-offset-y")}%`,addTextBox.style.height=`${checkedItem.getAttribute("data-height")}%`,addTextBox.style.width=`${checkedItem.getAttribute("data-width")}%`,YGArtTemplate.textObj.x=checkedItem.getAttribute("data-offset-x")/100*imageBoxWidth,YGArtTemplate.textObj.y=(checkedItem.getAttribute("data-offset-y")*1+checkedItem.getAttribute("data-height")*1)/100*imageBoxHeight}filterData(data,templateID,htmlID){let dollBody=YGArtTemplate.bodyValue,dollBodyLength=YGArtTemplate.bodyLengthValue,dollExpression=YGArtTemplate.expressionValue,filterData=data;filterData=Object.keys(filterData).filter(key=>filterData[key].which_expression?filterData[key].which_doll_body.toLowerCase().replace(/\s+/g,"-").replace(/[^a-z0-9-]/g,"")==dollBody&&filterData[key].which_doll_length==dollBodyLength&&filterData[key].which_expression.includes(dollExpression):(filterData[key].handle=htmlID,filterData[key].which_doll_body.toLowerCase().replace(/\s+/g,"-").replace(/[^a-z0-9-]/g,"")==dollBody&&filterData[key].which_doll_length==dollBodyLength)).map(key=>filterData[key]);let newFilterData={filterData};return newFilterData=this.loadArtTemplate(templateID,htmlID,newFilterData),newFilterData}undateColor(filterData,checkedValue,templateID,htmlID,priceBox){let totalPriceList=this.querySelectorAll(".yg-total-prices");if(checkedValue=="none"){priceBox&&this.querySelector(`.${priceBox}`)&&(YGArtTemplate.priceObj[htmlID]=0,this.querySelector(`.${priceBox}`).innerText="0",totalPriceList.forEach(totalPrice=>{totalPrice.innerHTML=` $${this.undataPrice()}`}));return}filterData=filterData.filterData?filterData.filterData:filterData;let filterColorData=Object.keys(filterData).filter(key=>(filterData[key].handle=htmlID,filterData[key].name.toLowerCase().replace(/\s+/g,"-").replace(/[^a-z0-9-]/g,"")==checkedValue.toLowerCase().replace(/\s+/g,"-").replace(/[^a-z0-9-]/g,""))).map(key=>filterData[key]);return YGArtTemplate.priceObj[htmlID]=filterColorData[0].price?filterColorData[0].price:0,priceBox&&this.querySelector(`.${priceBox}`)&&(this.querySelector(`.${priceBox}`).innerText=`$${filterColorData[0].price}`),totalPriceList.forEach(totalPrice=>{totalPrice.innerHTML=` $${this.undataPrice()}`}),this.loadArtTemplate(templateID,htmlID,filterColorData[0])}undataPrice(){let price=0;for(let key in YGArtTemplate.priceObj)typeof parseFloat(YGArtTemplate.priceObj[key])=="number"&&(price+=parseFloat(YGArtTemplate.priceObj[key]));if(this.querySelector(".add-your-text").value.trim()!==""){let textPrice=YGArtTemplate.customData.text_gift_card.price;return price+parseFloat(textPrice)}return price}async canvasImage(){const canvas=this.querySelector(".yg-canvas"),ctx=canvas.getContext("2d"),imgSources=[];let canvasWidth=1024;this.querySelectorAll(".yg-main-image img").forEach((img,index)=>{window.getComputedStyle(img).getPropertyValue("display")!="none"&&(imgSources.push(img.src),console.log(img.src))});const imgElements=[],promises=imgSources.map(function(src,index){return new Promise((resolve,reject)=>{const img=new Image;img.crossOrigin="anonymous",img.src=src+"?"+Date.now(),img.onload=()=>{imgElements[index]=img,console.log(img.src),resolve()},img.onerror=error=>{reject(error)}})});let imageBase64=Promise.all(promises).then(()=>{canvas.width=canvasWidth,canvas.height=canvasWidth;let drawPromise=Promise.resolve();

1return imgElements.forEach((img,index)=>{drawPromise=drawPromise.then(()=>drawImageOnCanvas(img,0,0,canvasWidth,canvasWidth))}),drawPromise.then(()=>(YGArtTemplate.textObj.text&&(ctx.font=`400 ${YGArtTemplate.textObj.fontSize} ${YGArtTemplate.textObj.fontFamily}`,ctx.fillStyle=`${YGArtTemplate.textObj.color}`,ctx.fillText(YGArtTemplate.textObj.text,YGArtTemplate.textObj.x,YGArtTemplate.textObj.y)),window.YGImageBese64=canvas.toDataURL(),canvas.toDataURL()))}).catch(error=>{console.error("An error occurred while loading images: ",error)});function drawImageOnCanvas(image,x,y,width,height){return new Promise((resolve,reject)=>{image.complete?(ctx.drawImage(image,x,y,width,height),resolve()):(image.onload=()=>{ctx.drawImage(image,x,y,width,height),resolve()},image.onerror=error=>{reject(error)})})}return imageBase64}requestProductData(price,image){fetch("https://play.personalized-gift.com/personalized/api/product/customzation",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({title:"Customized Product",price,image,domain:"gloveleya-doll.myshopify.com"})}).then(response=>response.json()).then(result=>{if(result.result==="success"){const variantId=result.variant_id;this.ygAddToCart(variantId)}else{const reason=result.reason||"\u672A\u63D0\u4F9B\u9519\u8BEF\u539F\u56E0";console.log("\u8BF7\u6C42\u5931\u8D25\u3002\u5931\u8D25\u539F\u56E0\uFF1A",reason)}}).catch(error=>{console.error("\u8BF7\u6C42\u51FA\u73B0\u95EE\u9898: ",error)})}ygAddToCart(variantID){YGArtTemplate.textObj.text&&(YGArtTemplate.orderNote.Text=YGArtTemplate.textObj.text,YGArtTemplate.orderNote["Text Font"]=YGArtTemplate.textObj.fontSize+" "+YGArtTemplate.textObj.fontFamily+"("+YGArtTemplate.textObj.color+")");let message=document.querySelector("#add-your-message");message.value&&(YGArtTemplate.orderNote["Gift Card"]=document.querySelector('.yg-doll-radio[name="doll_gift_card"]:checked').value,YGArtTemplate.orderNote.Message=message.value);let formData={items:[{quantity:1,id:variantID,properties:YGArtTemplate.orderNote}]};fetch(window.Shopify.routes.root+"cart/add.js",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(formData)}).then(response=>{this.querySelector(".yg-add-button").classList.remove("yg-animation");let href=window.Shopify.routes.root+"cart";return window.location.href=href,response.json()}).catch(error=>{console.error("Error:",error)})}}class YGArtTemplate extends YGScriptLoader{static Data=document.querySelector(".yg-data.hide-pc.hide-mobile")?.value;static customData=YGArtTemplate.Data?JSON.parse(YGArtTemplate.Data):null;static dollBodyData=YGArtTemplate.customData?YGArtTemplate.customData.doll.doll_body:null;static dollExpressionData=YGArtTemplate.customData?YGArtTemplate.customData.doll.doll_expression:null;static dollHairData=YGArtTemplate.customData?YGArtTemplate.customData.product_hair:null;static dollSkirtData=YGArtTemplate.customData?YGArtTemplate.customData.product_skirt:null;static dollLeftHeaddressData=YGArtTemplate.customData?YGArtTemplate.customData.product_headdress.product_left_headdress:null;static dollRightHeaddressData=YGArtTemplate.customData?YGArtTemplate.customData.product_headdress.product_right_headdress:null;static filterExpressionData=null;static filterHairData=null;static filterSkirtData=null;static filterLetfHeaddressData=null;static filterRightHeaddressData=null;static bodyValue=null;static bodyLengthValue=null;static expressionValue=null;static priceObj={};static textObj={};static orderNote={};constructor(){super(),this.init();const url=this.getAttribute("data-load-script");this.loadScript(url,()=>{this.changeBody()})}init(){this.toggleTag(),this.changeText(),this.initStyle(),this.addToCart(),this.togglePopup()}toggleTag(){let tabTitleList=this.querySelectorAll(".yg-tab"),tabContetnList=this.querySelectorAll(".yg-right-main-content>.yg-content");tabTitleList.forEach((tabTitle,index)=>{tabTitle.addEventListener("click",function(){tabTitleList?.forEach(tabTitle2=>{tabTitle2.classList.remove("active")}

1),tabTitle.classList.add("active"),tabContetnList?.forEach(tabContetn=>{tabContetn.style.transform,tabContetn.style.transform=`translateX(-${index*100}%)`})})})}changeBody(){let _this=this;this.querySelectorAll('.yg-doll-radio[name="doll_body"]').forEach(bodyRadio=>{bodyRadio.checked&&(YGArtTemplate.bodyValue=bodyRadio.value.toLowerCase().replace(/\s+/g,"-").replace(/[^a-z0-9-]/g,""),undateDollBody(),this.changeBodyLength()),bodyRadio.addEventListener("change",e=>{YGArtTemplate.bodyValue=e.target.value.toLowerCase().replace(/\s+/g,"-").replace(/[^a-z0-9-]/g,""),undateDollBody(),this.changeBodyLength()})});function undateDollBody(){let dollBody=YGArtTemplate.dollBodyData[YGArtTemplate.bodyValue];dollBody.handle=YGArtTemplate.bodyValue,dollBody=_this.loadArtTemplate("doll-length-template","doll-body-length",dollBody)}}changeBodyLength(){let bodySelect=this.querySelector("#doll-body-length");console.log("123"),bodySelect.addEventListener("change",()=>{YGArtTemplate.bodyLengthValue=bodySelect.value.toLowerCase().replace(/\s+/g,"-").replace(/[^a-z0-9-]/g,""),this.undateColor(YGArtTemplate.dollBodyData[YGArtTemplate.bodyValue].doll_length,YGArtTemplate.bodyLengthValue,"doll-color-template","doll-body-color","yg-body-price"),this.toggleImage(".yg-doll-body-image","#doll-body-color","Body",`${YGArtTemplate.bodyValue} - ${YGArtTemplate.bodyLengthValue}`),YGArtTemplate.filterExpressionData=this.filterData(YGArtTemplate.dollExpressionData,"doll-radio-template","doll-expression"),this.changeExpression(YGArtTemplate.filterExpressionData),YGArtTemplate.filterHairData=this.filterData(YGArtTemplate.dollHairData,"doll-radio-template","doll-hair"),this.changeHair(YGArtTemplate.filterHairData),YGArtTemplate.filterSkirtData=this.filterData(YGArtTemplate.dollSkirtData,"doll-radio-template","doll-skirt"),this.changeSkirt(YGArtTemplate.filterSkirtData),YGArtTemplate.filterLetfHeaddressData=this.filterData(YGArtTemplate.dollLeftHeaddressData,"doll-radio-template","doll-left-headdress"),this.changeLeftHeaddress(YGArtTemplate.filterLetfHeaddressData),YGArtTemplate.filterRightHeaddressData=this.filterData(YGArtTemplate.dollRightHeaddressData,"doll-radio-template","doll-right-headdress"),this.changeRightHeaddress(YGArtTemplate.filterRightHeaddressData)}),bodySelect.dispatchEvent(new Event("change"))}changeExpression(filterData){this.querySelectorAll('.yg-doll-radio[name="doll-expression"]').forEach(bodyRadio=>{bodyRadio.checked&&(YGArtTemplate.expressionValue=bodyRadio.value.toLowerCase().replace(/\s+/g,"-").replace(/[^a-z0-9-]/g,""),this.undateColor(filterData,YGArtTemplate.expressionValue,"doll-color-template","doll-expression-color","yg-expression-price"),this.toggleImage(".yg-doll-expression-image","#doll-expression-color","Expression",bodyRadio.value)),bodyRadio.addEventListener("change",e=>{YGArtTemplate.expressionValue=e.target.value.toLowerCase().replace(/\s+/g,"-").replace(/[^a-z0-9-]/g,""),this.undateColor(filterData,YGArtTemplate.expressionValue,"doll-color-template","doll-expression-color","yg-expression-price"),this.toggleImage(".yg-doll-expression-image","#doll-expression-color","Expression",bodyRadio.value)})})}changeHair(filterData){this.querySelectorAll('.yg-doll-radio[name="doll-hair"]').forEach(bodyRadio=>{bodyRadio.checked&&(this.undateColor(filterData,bodyRadio.value,"doll-color-template","doll-hair-color","yg-hair-price"),this.toggleImage(".yg-doll-hair-image","#doll-hair-color","Hair",bodyRadio.value)),bodyRadio.addEventListener("change",e=>{this.undateColor(filterData,e.target.value,"doll-color-template","doll-hair-color","yg-hair-price"),this.toggleImage(".yg-doll-hair-image","#doll-hair-color","Hair",bodyRadio.value)})})}changeSkirt(filterData){this.querySelectorAll('.yg-doll-radio[name="doll-skirt"]').forEach(bodyRadio=>{bodyRadio.checked&&(this.undateColor(filterData,bodyRadio.value,"doll-color-template","doll-skirt-color","yg-skirt-price"),this.toggleImage(".yg-doll-skirt-image","#doll-skirt-color","Skirt",bodyRadio.value),this.undataOffset(bodyRadio)),bodyRadio.addEventListener("change",e=>{this.undateColor(filterData,e.target.value,"doll-color-template","doll-skirt-color","yg-skirt-price"),this.toggleImage(".yg-doll-skirt-image","#doll-skirt-color","Skirt",bodyRadio.value),this.undataOffset(e.target)})})}changeLeftHeaddress(filterData){this.querySelectorAll('.yg-doll-radio[name="doll-left-headdress"]').forEach(bodyRadio=>

1{bodyRadio.checked&&(this.undateColor(filterData,bodyRadio.value,"doll-color-template","doll-left-headdress-color","yg-left-headdress-price"),this.toggleImage(".yg-doll-left-headdress-image","#doll-left-headdress-color","Left Headdress",bodyRadio.value)),bodyRadio.addEventListener("change",e=>{this.undateColor(filterData,e.target.value,"doll-color-template","doll-left-headdress-color","yg-left-headdress-price"),this.toggleImage(".yg-doll-left-headdress-image","#doll-left-headdress-color","Left Headdress",bodyRadio.value)})})}changeRightHeaddress(filterData){this.querySelectorAll('.yg-doll-radio[name="doll-right-headdress"]').forEach(bodyRadio=>{bodyRadio.checked&&(this.undateColor(filterData,bodyRadio.value,"doll-color-template","doll-right-headdress-color","yg-right-headdress-price"),this.toggleImage(".yg-doll-right-headdress-image","#doll-right-headdress-color","Right Headdress",bodyRadio.value)),bodyRadio.addEventListener("change",e=>{this.undateColor(filterData,e.target.value,"doll-color-template","doll-right-headdress-color","yg-right-headdress-price"),this.toggleImage(".yg-doll-right-headdress-image","#doll-right-headdress-color","Right Headdress",bodyRadio.value)})})}changeText(){let addTextBox=this.querySelector(".yg-image-add-text-box"),addTextInput=this.querySelector(".add-your-text"),textLength=this.querySelector(".yg-add-text .yg-text-length"),textPriceBox=this.querySelector(".yg-add-text-price");addTextInput.addEventListener("input",()=>{this.addImageText(addTextInput.value),textLength.innerText=addTextInput.value.length,textLength.innerText=="0"?textPriceBox.innerText="0":textPriceBox.innerText=`$${YGArtTemplate.customData.text_gift_card.price}`,this.querySelectorAll(".yg-total-prices").forEach(totalPrice=>{totalPrice.innerHTML=` $${this.undataPrice()}`})});let familyData=this.querySelector("#doll-text-family"),textColorRadios=this.querySelectorAll('.yg-doll-radio[name="doll-text-color"]'),addText=this.querySelector(".yg-image-add-text");textColorRadios.forEach(colorRadio=>{colorRadio.checked&&(addText.style.color=colorRadio.value,YGArtTemplate.textObj.color=colorRadio.value),colorRadio.addEventListener("change",e=>{addText.style.color=e.target.value,YGArtTemplate.textObj.color=e.target.value})}),familyData.addEventListener("change",e=>{addText.style.fontFamily=familyData.value,YGArtTemplate.textObj.fontFamily=familyData.value}),familyData.dispatchEvent(new Event("change"));let addMessage=this.querySelector(".add-your-message"),messageLength=this.querySelector(".yg-add-message .yg-text-length");addMessage.addEventListener("input",function(){messageLength.innerText=addMessage.value.length})}addToCart(){let addToCart=this.querySelector(".yg-add-button");addToCart.addEventListener("click",()=>{addToCart.classList.add("yg-animation"),this.requestProductData(this.undataPrice(),window.YGImageBese64)})}togglePopup(){let $videoPopup=this.querySelector(".yg-popup-box"),$popupButton=this.querySelector(".yg-toggle-popup-button"),$popupImage=this.querySelector(".yg-popup-image");$popupButton.addEventListener("click",()=>{$popupButton.classList.add("yg-animation"),this.canvasImage().then(value=>{$popupImage.src=value,openPopup(),$popupButton.classList.remove("yg-animation")}).catch(error=>{console.log("error",error)})}),$videoPopup.addEventListener("click",e=>{closePopup(e)});function openPopup(){document.querySelector("body").style.overflow="hidden",$videoPopup.style.display="flex"}function closePopup(e){(e.target.className=="yg-popup-box-close"||e.target.className=="yg-popup-box")&&($videoPopup.style.display="none",document.querySelector("body").style.overflow="auto")}}initStyle(){window.addEventListener("resize",()=>{this.querySelector(".yg-right-content").style.height=`${this.querySelector(".yg-left-produtct").getBoundingClientRect().height}px`}),window.dispatchEvent(new Event("resize"))}}window.customElements.get("yg-art-template")||window.customElements.define("yg-art-template",YGArtTemplate);
2//# sourceMappingURL=/cdn/shop/t/54/assets/yg-script.js.map?v=76879490741506690971791098914