xactsize-webcomponents 1.0.4 → 1.0.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/README.md CHANGED
@@ -49,7 +49,7 @@ npm install xactsize-webcomponent
49
49
 
50
50
  ```html
51
51
  <body-measurer culture="pt-BR" product-name="Calça Legging" skus='[{"dimensions":{"Size":"S"},"measures":{"height":39,"length":78,"width":78}},{"dimensions":{"Size":"M"},"measures":{"height":40,"length":82,"width":82}}]'></body-measurer>
52
- <script type="module" src="https://cdn.jsdelivr.net/npm/xactsize-webcomponents@1.0.3/dist/body-measurer.es.js"></script>
52
+ <script type="module" src="https://cdn.jsdelivr.net/npm/xactsize-webcomponents@1.0.4/dist/body-measurer.es.js"></script>
53
53
 
54
54
  <script>
55
55
  // Select the body-measurer element
@@ -826,7 +826,7 @@ let u = class extends Z {
826
826
  s.key === "Escape" && this.showModal && this.closeModal();
827
827
  }
828
828
  openModal() {
829
- this.showModal = !0, this.step = 3, this.height = 0, this.recommendedSize = "", this.measurements = {}, this.errorMessage = "", this.instructionMessage = "Position yourself in front of the camera";
829
+ this.showModal = !0, this.step = 1, this.height = 0, this.recommendedSize = "", this.measurements = {}, this.errorMessage = "", this.instructionMessage = "Position yourself in front of the camera";
830
830
  }
831
831
  closeModal() {
832
832
  this.showModal = !1, this.stopPolling(), this.dispatchEvent(new CustomEvent("measurementCanceled", { detail: {} }));
@@ -68,7 +68,7 @@
68
68
  * @license
69
69
  * Copyright 2021 Google LLC
70
70
  * SPDX-License-Identifier: BSD-3-Clause
71
- */function re(o){window.dispatchEvent(new CustomEvent(oe,{detail:o}))}let H="",ne,ke,O,ae,Qe,I=new Ie;I.resolve();let W=0;const At=o=>(nt((e,t)=>gt(Qe,e,t)),H=ke=o.sourceLocale,O=new Set(o.targetLocales),O.add(o.sourceLocale),ae=o.loadLocale,{getLocale:yt,setLocale:wt}),yt=()=>H,wt=o=>{if(o===(ne??H))return I.promise;if(!O||!ae)throw new Error("Internal error");if(!O.has(o))throw new Error("Invalid locale code");W++;const e=W;return ne=o,I.settled&&(I=new Ie),re({status:"loading",loadingLocale:o}),(o===ke?Promise.resolve({templates:void 0}):ae(o)).then(s=>{W===e&&(H=o,ne=void 0,Qe=s.templates,re({status:"ready",readyLocale:o}),I.resolve())},s=>{W===e&&(re({status:"error",errorLocale:o,errorMessage:s.toString()}),I.reject(s))}),I.promise},le="en",vt=["pt-BR"];var Et=Object.defineProperty,xt=Object.getOwnPropertyDescriptor,g=(o,e,t,s)=>{for(var i=s>1?void 0:s?xt(e,t):e,r=o.length-1,n;r>=0;r--)(n=o[r])&&(i=(s?n(e,t,i):n(i))||i);return s&&i&&Et(e,t,i),i};const{getLocale:St,setLocale:N}=At({sourceLocale:le,targetLocales:vt,loadLocale:o=>Q(Object.assign({"./generated/locales/pt-BR.ts":()=>Promise.resolve().then(()=>bt)}),`./generated/locales/${o}.ts`,4)});c.BodyMeasurer=class extends R{constructor(){super(),this.apiKey="",this._culture="en",this._isLocaleLoading=!1,this.skus=[],this.productName="",this.showModal=!1,this.step=1,this.height=0,this.recommendedSize="",this.measurements={},this.errorMessage="",this.instructionMessage="Position yourself in front of the camera",this.shouldStartMeasurement=!1,this.videoElement=null,this.stream=null,this.pollingInterval=null,this.poolingTimeout=null,this.isFetching=!1;try{N(this.culture)}catch(e){console.error("Failed to set locale:",e),N(le)}}get culture(){return this._culture}set culture(e){const t=this._culture;this._culture=e,this.requestUpdate("culture",t),this._applyLocale(e).catch(console.error)}async _applyLocale(e){try{this._isLocaleLoading=!0,this.requestUpdate(),await N(e)}catch(t){console.error("Failed to load locale",e,t),await N(le)}finally{this._isLocaleLoading=!1,this.requestUpdate()}}connectedCallback(){super.connectedCallback(),document.addEventListener("keydown",this.handleEscKey.bind(this))}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("keydown",this.handleEscKey.bind(this)),this.stopPolling()}handleEscKey(e){e.key==="Escape"&&this.showModal&&this.closeModal()}openModal(){this.showModal=!0,this.step=3,this.height=0,this.recommendedSize="",this.measurements={},this.errorMessage="",this.instructionMessage="Position yourself in front of the camera"}closeModal(){this.showModal=!1,this.stopPolling(),this.dispatchEvent(new CustomEvent("measurementCanceled",{detail:{}}))}async startMeasurement(){this.step=2,this.errorMessage="",this.shouldStartMeasurement=!0}updated(e){super.updated(e),e.has("step")&&this.step===2&&this.shouldStartMeasurement&&(this.initializeMeasurement(),this.shouldStartMeasurement=!1)}async initializeMeasurement(){this.videoElement=this.shadowRoot.querySelector("video");try{this.stream=await navigator.mediaDevices.getUserMedia({video:!0}),this.videoElement&&(this.videoElement.srcObject=this.stream,await this.videoElement.play(),this.startPolling())}catch{this.errorMessage="Error accessing webcam."}}async startPolling(){const e=async()=>{if(!this.videoElement||!this.stream||this.isFetching)return;const t=document.createElement("canvas");t.width=this.videoElement.videoWidth,t.height=this.videoElement.videoHeight;const s=t.getContext("2d");s==null||s.drawImage(this.videoElement,0,0,t.width,t.height);const i=await new Promise(n=>t.toBlob(l=>n(l),"image/jpeg")),r=new FormData;r.append("image",i,"frame.jpg"),r.append("height",this.height.toString()),r.append("type","shirt"),r.append("skus",JSON.stringify(this.skus));try{this.isFetching=!0,this.poolingTimeout&&clearTimeout(this.poolingTimeout);const l=await(await fetch("https://xactsize-api-923169850574.southamerica-east1.run.app/api/measurer/measure/body",{method:"POST",body:r})).json();this.isFetching=!1,l.success?(this.measurements=l.measurements,this.recommendedSize=l.chosenSize,this.instructionMessage=u("Measurement successful!"),this.stopPolling(),this.step=3):(this.instructionMessage=l.message,setTimeout(()=>{this.recommendedSize||(this.instructionMessage=u("Position yourself in front of the camera"))},5e3))}catch{this.instructionMessage="Error processing measurement",setTimeout(()=>{this.recommendedSize||(this.instructionMessage="Position yourself in front of the camera")},2e3)}};this.pollingInterval=window.setInterval(e,5e3),await e()}stopPolling(){this.pollingInterval&&(clearInterval(this.pollingInterval),this.pollingInterval=null),this.stream&&(this.stream.getTracks().forEach(e=>e.stop()),this.stream=null)}acceptMeasurement(){console.log("DISPATCHING EVENT"),this.dispatchEvent(new CustomEvent("measurementAccepted",{detail:{size:this.recommendedSize}})),this.showModal=!1,this.stopPolling()}resetMeasurement(){this.step=1,this.height=0,this.recommendedSize="",this.measurements={},this.stopPolling()}stopMeasurement(){this.resetMeasurement(),this.showModal=!1}render(){return this._isLocaleLoading?b`<div hidden></div>`:b`
71
+ */function re(o){window.dispatchEvent(new CustomEvent(oe,{detail:o}))}let H="",ne,ke,O,ae,Qe,I=new Ie;I.resolve();let W=0;const At=o=>(nt((e,t)=>gt(Qe,e,t)),H=ke=o.sourceLocale,O=new Set(o.targetLocales),O.add(o.sourceLocale),ae=o.loadLocale,{getLocale:yt,setLocale:wt}),yt=()=>H,wt=o=>{if(o===(ne??H))return I.promise;if(!O||!ae)throw new Error("Internal error");if(!O.has(o))throw new Error("Invalid locale code");W++;const e=W;return ne=o,I.settled&&(I=new Ie),re({status:"loading",loadingLocale:o}),(o===ke?Promise.resolve({templates:void 0}):ae(o)).then(s=>{W===e&&(H=o,ne=void 0,Qe=s.templates,re({status:"ready",readyLocale:o}),I.resolve())},s=>{W===e&&(re({status:"error",errorLocale:o,errorMessage:s.toString()}),I.reject(s))}),I.promise},le="en",vt=["pt-BR"];var Et=Object.defineProperty,xt=Object.getOwnPropertyDescriptor,g=(o,e,t,s)=>{for(var i=s>1?void 0:s?xt(e,t):e,r=o.length-1,n;r>=0;r--)(n=o[r])&&(i=(s?n(e,t,i):n(i))||i);return s&&i&&Et(e,t,i),i};const{getLocale:St,setLocale:N}=At({sourceLocale:le,targetLocales:vt,loadLocale:o=>Q(Object.assign({"./generated/locales/pt-BR.ts":()=>Promise.resolve().then(()=>bt)}),`./generated/locales/${o}.ts`,4)});c.BodyMeasurer=class extends R{constructor(){super(),this.apiKey="",this._culture="en",this._isLocaleLoading=!1,this.skus=[],this.productName="",this.showModal=!1,this.step=1,this.height=0,this.recommendedSize="",this.measurements={},this.errorMessage="",this.instructionMessage="Position yourself in front of the camera",this.shouldStartMeasurement=!1,this.videoElement=null,this.stream=null,this.pollingInterval=null,this.poolingTimeout=null,this.isFetching=!1;try{N(this.culture)}catch(e){console.error("Failed to set locale:",e),N(le)}}get culture(){return this._culture}set culture(e){const t=this._culture;this._culture=e,this.requestUpdate("culture",t),this._applyLocale(e).catch(console.error)}async _applyLocale(e){try{this._isLocaleLoading=!0,this.requestUpdate(),await N(e)}catch(t){console.error("Failed to load locale",e,t),await N(le)}finally{this._isLocaleLoading=!1,this.requestUpdate()}}connectedCallback(){super.connectedCallback(),document.addEventListener("keydown",this.handleEscKey.bind(this))}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("keydown",this.handleEscKey.bind(this)),this.stopPolling()}handleEscKey(e){e.key==="Escape"&&this.showModal&&this.closeModal()}openModal(){this.showModal=!0,this.step=1,this.height=0,this.recommendedSize="",this.measurements={},this.errorMessage="",this.instructionMessage="Position yourself in front of the camera"}closeModal(){this.showModal=!1,this.stopPolling(),this.dispatchEvent(new CustomEvent("measurementCanceled",{detail:{}}))}async startMeasurement(){this.step=2,this.errorMessage="",this.shouldStartMeasurement=!0}updated(e){super.updated(e),e.has("step")&&this.step===2&&this.shouldStartMeasurement&&(this.initializeMeasurement(),this.shouldStartMeasurement=!1)}async initializeMeasurement(){this.videoElement=this.shadowRoot.querySelector("video");try{this.stream=await navigator.mediaDevices.getUserMedia({video:!0}),this.videoElement&&(this.videoElement.srcObject=this.stream,await this.videoElement.play(),this.startPolling())}catch{this.errorMessage="Error accessing webcam."}}async startPolling(){const e=async()=>{if(!this.videoElement||!this.stream||this.isFetching)return;const t=document.createElement("canvas");t.width=this.videoElement.videoWidth,t.height=this.videoElement.videoHeight;const s=t.getContext("2d");s==null||s.drawImage(this.videoElement,0,0,t.width,t.height);const i=await new Promise(n=>t.toBlob(l=>n(l),"image/jpeg")),r=new FormData;r.append("image",i,"frame.jpg"),r.append("height",this.height.toString()),r.append("type","shirt"),r.append("skus",JSON.stringify(this.skus));try{this.isFetching=!0,this.poolingTimeout&&clearTimeout(this.poolingTimeout);const l=await(await fetch("https://xactsize-api-923169850574.southamerica-east1.run.app/api/measurer/measure/body",{method:"POST",body:r})).json();this.isFetching=!1,l.success?(this.measurements=l.measurements,this.recommendedSize=l.chosenSize,this.instructionMessage=u("Measurement successful!"),this.stopPolling(),this.step=3):(this.instructionMessage=l.message,setTimeout(()=>{this.recommendedSize||(this.instructionMessage=u("Position yourself in front of the camera"))},5e3))}catch{this.instructionMessage="Error processing measurement",setTimeout(()=>{this.recommendedSize||(this.instructionMessage="Position yourself in front of the camera")},2e3)}};this.pollingInterval=window.setInterval(e,5e3),await e()}stopPolling(){this.pollingInterval&&(clearInterval(this.pollingInterval),this.pollingInterval=null),this.stream&&(this.stream.getTracks().forEach(e=>e.stop()),this.stream=null)}acceptMeasurement(){console.log("DISPATCHING EVENT"),this.dispatchEvent(new CustomEvent("measurementAccepted",{detail:{size:this.recommendedSize}})),this.showModal=!1,this.stopPolling()}resetMeasurement(){this.step=1,this.height=0,this.recommendedSize="",this.measurements={},this.stopPolling()}stopMeasurement(){this.resetMeasurement(),this.showModal=!1}render(){return this._isLocaleLoading?b`<div hidden></div>`:b`
72
72
  <button class="xactsize-btn" @click=${this.openModal}>${u("Get your Xactsize")}</button>
73
73
 
74
74
  ${this.showModal?b`
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "xactsize-webcomponents",
3
- "version": "1.0.4",
3
+ "version": "1.0.5",
4
4
  "description": "A web component for body measurements and size recommendations",
5
5
  "main": "dist/body-measurer.umd.js",
6
6
  "module": "dist/body-measurer.es.js",