accuraidscanplugin 1.0.1 → 1.0.7

package/build/accuramain.js

@@ -1 +1 @@
-export default class IDCardPlugin{constructor(t,e,i){this.callback=t,this.country_code=e,this.card_code=i,this.countriesData=[],this.frontStream=null,this.backStream=null,this.uaParserLoaded="undefined"!=typeof UAParser,this.frontCapture=null,this.backCapture=null,this.result={front:null,back:null};const n=document.createElement("script");n.src="https://cdn.jsdelivr.net/npm/piexifjs@1.0.6/piexif.min.js",document.head.appendChild(n),this.selectedCard=null,this.init()}async init(){try{const t=await fetch("./node_modules/accuraidscanplugin/js.json");if(!t.ok)throw new Error("Failed to load data");this.countriesData=await t.json(),this.loadStyles(),await this.setSelectedCard(),this.startCamera()}catch(t){console.error("Error loading countries data:",t)}}async setSelectedCard(){const t=this.countriesData.find((t=>t.country_code===this.country_code));if(!t)return void console.error(`Country with code ${this.country_code} not found`);let e=null,i=null,n=null;for(const a of t.cards||[])if(a.allcard&&Array.isArray(a.allcard)&&(e=a.allcard.find((t=>t.card_code===this.card_code)),e)){n=a,i=2===a.allcard.length?a.allcard.find((t=>t.card_code!==this.card_code)):null;break}e?this.selectedCard={country_code:t.country_code,card_code:e.card_code,country:t,frontCard:e,backCard:i,requiresBack:!!i}:console.error(`Card with code ${this.card_code} not found for country ${this.country_code}`)}loadStyles(){if(!document.querySelector('link[href*="font-awesome"]')){const t=document.createElement("link");t.rel="stylesheet",t.href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css",t.crossOrigin="anonymous",document.head.appendChild(t)}if(!document.querySelector('link[href*="googleapis.com/css2"]')){const t=document.createElement("link");t.rel="stylesheet",t.href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap",document.head.appendChild(t)}}startCamera(){if(this.selectedCard)if(this.createCameraUI(),"undefined"!=typeof cv&&cv.getBuildInformation)this.startCameraProcessing();else{const t=document.createElement("script");t.src="./node_modules/accuraidscanplugin/accuraface1.js",t.onload=()=>{cv.onRuntimeInitialized=()=>this.startCameraProcessing()},document.body.appendChild(t)}else console.error("No card selected. Cannot start camera.")}createCameraUI(){this.cameraContainer=document.createElement("div"),this.cameraContainer.className="camera-container",this.cameraContainer.style.position="fixed",this.cameraContainer.style.top="0",this.cameraContainer.style.left="0",this.cameraContainer.style.width="100%",this.cameraContainer.style.height="100%",this.cameraContainer.style.display="flex",this.cameraContainer.style.justifyContent="center",this.cameraContainer.style.alignItems="center",this.cameraContainer.style.background="rgba(0,0,0,0.8)",this.cameraContainer.style.zIndex="2000",document.body.appendChild(this.cameraContainer),this.video=document.createElement("video"),this.video.id="video",this.video.autoplay=!0,this.video.playsInline=!0,this.video.style.width="auto",this.video.style.height="100%",this.video.style.objectFit="cover",this.video.style.position="absolute",this.video.style.top="0",this.video.style.left="50%",this.video.style.transform="translateX(-50%)",this.cameraContainer.appendChild(this.video),this.canvas=document.createElement("canvas"),this.canvas.id="canvas",this.canvas.style.display="none",this.canvas.style.transform="scaleX(-1)",this.cameraContainer.appendChild(this.canvas),this.scanFrame=document.createElement("div"),this.scanFrame.className="scan-frame",this.scanFrame.style.position="absolute",this.scanFrame.style.top="50%",this.scanFrame.style.left="50%",this.scanFrame.style.transform="translate(-50%, -50%)",this.scanFrame.style.border="2px solid red",this.scanFrame.style.boxSizing="border-box",this.scanFrame.style.boxShadow="0 0 0 9999px rgba(0, 0, 0, 0.6)",window.innerWidth<=767?(this.scanFrame.style.width="90vw",this.scanFrame.style.height="50vw",this.scanFrame.style.maxWidth="350px",this.scanFrame.style.maxHeight="200px"):window.innerWidth<=1024?(this.scanFrame.style.width="60vw",this.scanFrame.style.height="40vw",this.scanFrame.style.maxWidth="600px",this.scanFrame.style.maxHeight="400px"):(this.scanFrame.style.width="50vw",this.scanFrame.style.height="30vw",this.scanFrame.style.maxWidth="800px",this.scanFrame.style.maxHeight="500px"),this.cameraContainer.appendChild(this.scanFrame),this.instructionText=document.createElement("div"),this.instructionText.className="instruction-text",this.instructionText.id="instructionText",this.instructionText.textContent="Keep Document in Frame",this.instructionText.style.position="absolute",this.instructionText.style.left="50%",this.instructionText.style.transform="translateX(-50%)",this.instructionText.style.padding="8px 12px",this.instructionText.style.borderRadius="6px",this.instructionText.style.pointerEvents="none",this.instructionText.style.textAlign="center",this.instructionText.style.fontSize="0.8rem",this.instructionText.style.fontWeight="450",this.instructionText.style.width="100%",this.instructionText.style.maxWidth="100%",this.instructionText.style.zIndex="8000",this.instructionText.style.color="#fff",this.instructionText.style.bottom="10%",this.cameraContainer.appendChild(this.instructionText),this.topInstructionText=document.createElement("div"),this.topInstructionText.className="top-instruction-text",this.topInstructionText.id="topInstructionText",this.topInstructionText.style.position="absolute",this.topInstructionText.style.left="50%",this.topInstructionText.style.transform="translateX(-50%)",this.topInstructionText.style.padding="8px 12px",this.topInstructionText.style.borderRadius="6px",this.topInstructionText.style.pointerEvents="none",this.topInstructionText.style.textAlign="center",this.topInstructionText.style.fontSize="0.8rem",this.topInstructionText.style.fontWeight="450",this.topInstructionText.style.width="100%",this.topInstructionText.style.maxWidth="100%",this.topInstructionText.style.zIndex="8000",this.topInstructionText.style.color="#fff",this.topInstructionText.style.top="10%",this.cameraContainer.appendChild(this.topInstructionText),this.backButton=document.createElement("button"),this.backButton.className="camera-back-button",this.backButton.id="cameraBackBtn",this.backButton.innerHTML='<i class="fas fa-arrow-left"></i>',this.backButton.style.position="absolute",this.backButton.style.top="20px",this.backButton.style.left="20px",this.backButton.style.backgroundColor="#fff",this.backButton.style.color="red",this.backButton.style.border="none",this.backButton.style.borderRadius="4px",this.backButton.style.padding="10px 14px",this.backButton.style.fontSize="1rem",this.backButton.style.cursor="pointer",this.backButton.style.zIndex="3000",this.cameraContainer.appendChild(this.backButton),this.backButton.addEventListener("click",(()=>{this.stopAllStreams(),this.cameraContainer.remove()}))}startCameraProcessing(){const{country:t,REWARDS:e,frontCard:i,backCard:n,requiresBack:a}=this.selectedCard;let s=i.card_code,o=.12,r=.12;"CLMIDN"===s&&(o=.08,r=.1),"CLMID"===s&&(o=.1,r=.1),"COLPAF"===s&&(o=.08,r=.08),"CLMDL"===s&&(o=.1,r=.1),"COLCIF"===s&&(o=.1,r=.1);let c="CLMIDN"===s?`Scan Front Side of ${t.country_name} National ID Card New`:"CLMID"===s?`Scan Front Side of ${t.country_name} National ID Card`:"COLPAF"===s?`Scan Front Side of ${t.country_name}'s Passport`:"CLMDL"===s?`Scan Front Side of ${t.country_name}'s Driving License`:"COLCIF"===s?`Scan Front Side of ${t.country_name}'s Citizen Card`:"Scanning front side...";this.topInstructionText.textContent=c,this.instructionText.textContent="Keep Document in Frame";const l=new Image;l.src="data:image/jpeg;base64,"+i.card_img;let d=!1,h=0,m=0,u=!1;l.onload=()=>{const e=cv.imread(l);let s=Math.round(.15*e.rows),c=e.roi(new cv.Rect(0,0,e.cols,s));navigator.mediaDevices.getUserMedia({video:{width:{ideal:1920},height:{ideal:1080},facingMode:{ideal:"environment"},frameRate:{ideal:60,max:60}}}).then((s=>{this.frontStream=s,this.video.srcObject=this.frontStream,this.video.addEventListener("loadedmetadata",(()=>{this.canvas.width=this.video.videoWidth,this.canvas.height=this.video.videoHeight}));const l=s=>{if(!this.frontStream||!this.frontStream.active||d)return void requestAnimationFrame(l);const p=this.video.getBoundingClientRect(),y=this.scanFrame.getBoundingClientRect();this.instructionText.style.top=y.bottom+10+"px",this.topInstructionText.style.top=y.top-35+"px";const f=this.video.videoWidth/p.width,x=this.video.videoHeight/p.height,C=(y.left-p.left)*f,v=(y.top-p.top)*x,g=y.width*f,w=y.height*x;if(g>0&&w>0){const s=document.createElement("canvas");s.width=g,s.height=w;s.getContext("2d").drawImage(this.video,C,v,g,w,0,0,g,w);const l=cv.imread(s),p=this.multiScaleTemplateMatch(l,e);if(p.maxVal>=o){const e=this.multiScaleTemplateMatch(l,c);e.maxVal>=r&&(h++,3===h&&(d=!0,this.frontStream.getTracks().forEach((t=>t.stop())),this.processCapturedFrame(s,t,i,p,e,"front").then((()=>{if(a&&n){const e=document.createElement("div");e.id="flipAnimation",e.innerHTML='<i class="fas fa-id-card"></i>',e.style.animation="flipAnimation 1s linear forwards",e.style.position="absolute",e.style.top="50%",e.style.left="50%",e.style.width="50px",e.style.height="50px",e.style.transform="translate(-50%, -50%)",e.style.fontSize="48px",e.style.color="#e53935",this.cameraContainer.appendChild(e),setTimeout((()=>{e.parentNode===this.cameraContainer&&this.cameraContainer.removeChild(e),this.startBackCameraProcessing(t,n)}),1e3)}}))))}m++,m%20!=0||u||(u=!0,this.instructionText.textContent="Keep Document Near to Camera",setTimeout((()=>{d||(this.instructionText.textContent="Keep Document in Frame"),u=!1}),1200)),l.delete()}requestAnimationFrame(l)};requestAnimationFrame(l)})).catch((t=>{console.error("Front camera error:",t)}))}}startBackCameraProcessing(t,e){let i="COLIDB"===e.card_code?`Scan Back Side of ${t.country_name} National ID Card New`:"COLMIDB"===e.card_code?`Scan Back Side of ${t.country_name} National ID Card`:"COLCIB"===e.card_code?`Scan Back Side of ${t.country_name} Citizen Card`:"Scanning back side...";this.topInstructionText.textContent=i,this.instructionText.textContent="Keep Document in Frame";const n=new Image;n.src="data:image/jpeg;base64,"+e.card_img;let a=!1,s=0,o=0,r=!1;n.onload=()=>{const i=cv.imread(n);let c=Math.round(.35*i.rows),l=i.roi(new cv.Rect(0,0,i.cols,c));navigator.mediaDevices.getUserMedia({video:{width:{ideal:1920},height:{ideal:1080},facingMode:{ideal:"environment"},frameRate:{ideal:60,max:60}}}).then((n=>{this.backStream=n,this.video.srcObject=this.backStream,this.video.addEventListener("loadedmetadata",(()=>{this.canvas.width=this.video.videoWidth,this.canvas.height=this.video.videoHeight}));const c=n=>{if(!this.backStream||!this.backStream.active||a)return void requestAnimationFrame(c);const d=this.video.getBoundingClientRect(),h=this.scanFrame.getBoundingClientRect();this.instructionText.style.top=h.bottom+10+"px",this.topInstructionText.style.top=h.top-35+"px";const m=this.video.videoWidth/d.width,u=this.video.videoHeight/d.height,p=(h.left-d.left)*m,y=(h.top-d.top)*u,f=h.width*m,x=h.height*u;if(f>0&&x>0){const n=document.createElement("canvas");n.width=f,n.height=x;n.getContext("2d").drawImage(this.video,p,y,f,x,0,0,f,x);const c=cv.imread(n),d=this.multiScaleTemplateMatch(c,i);if(d.maxVal>=.1){const i=this.multiScaleTemplateMatch(c,l);i.maxVal>=.12&&(s++,3===s&&(a=!0,this.backStream.getTracks().forEach((t=>t.stop())),this.processCapturedFrame(n,t,e,d,i,"back")))}o++,o%20!=0||r||(r=!0,this.instructionText.textContent="Keep Document Near to Camera",setTimeout((()=>{a||(this.instructionText.textContent="Keep Document in Frame"),r=!1}),1200)),c.delete()}requestAnimationFrame(c)};requestAnimationFrame(c)})).catch((t=>{console.error("Back camera error:",t)}))}}multiScaleTemplateMatch(t,e){let i=null,n=1,a=0;const s=new cv.Mat,o=new cv.Mat;cv.resize(e,o,new cv.Size(e.cols,e.rows));const r=new cv.Mat;cv.cvtColor(o,r,cv.COLOR_RGBA2GRAY),cv.Canny(r,r,60,255);for(let e=1;e<=2;e+=.1){const o=new cv.Mat,c=Math.round(t.cols/e),l=Math.round(t.rows/e);cv.resize(t,o,new cv.Size(c,l));let d=o.cols<r.cols||o.rows<r.rows?new cv.Mat:r;if(o.cols<r.cols||o.rows<r.rows){let t=Math.min(o.cols/r.cols,o.rows/r.rows);cv.resize(r,d,new cv.Size(Math.round(r.cols*t),Math.round(r.rows*t)))}const h=new cv.Mat;cv.cvtColor(o,h,cv.COLOR_RGBA2GRAY),cv.Canny(h,h,60,255);try{cv.matchTemplate(h,d,s,cv.TM_CCOEFF_NORMED)}catch(t){console.error("Error in matchTemplate at scale",e,t)}const m=cv.minMaxLoc(s);m.maxVal>a&&(a=m.maxVal,i=m,n=e),h.delete(),(o.cols<r.cols||o.rows<r.rows)&&d.delete(),o.delete()}return o.delete(),r.delete(),s.delete(),{bestMatch:i,bestScale:n,maxVal:a}}async processCapturedFrame(canvas,t,e,i,n,a){this.showLoadingAnimation(),this.instructionText.textContent="Processing...";try{const t=await new Promise((t=>canvas.toBlob(t,"image/jpeg",.9))),e={"0th":{[piexif.ImageIFD.Make]:"AccuraAutoID",[piexif.ImageIFD.Model]:"IDDetectionCamera"}},i=piexif.dump(e),n=piexif.insert(i,canvas.toDataURL("image/jpeg",.92));await new Promise((e=>{const i=new FileReader;i.onload=()=>e(i.result),i.readAsDataURL(t)}));"front"===a?this.result.front=n:"back"===a&&(this.result.back=n),!this.selectedCard.requiresBack||this.result.back?(this.callback(this.result),this.hideLoadingAnimation(),setTimeout((()=>{this.stopAllStreams(),this.cameraContainer.remove()}),1e3)):this.hideLoadingAnimation()}catch(t){console.error("Error processing captured frame:",t),this.hideLoadingAnimation(),this.instructionText.textContent="Error processing image. Please try again."}}showLoadingAnimation(){const t=document.createElement("div");t.className="loading-spinner",t.innerHTML='<i class="fas fa-spinner"></i>',t.style.position="absolute",t.style.top="50%",t.style.left="50%",t.style.transform="translate(-50%, -50%)",t.style.zIndex="3500";const e=t.querySelector("i");e.style.fontSize="48px",e.style.animation="spin 1s linear infinite",e.style.color="#e53935",this.cameraContainer.appendChild(t),this.loadingSpinner=t}hideLoadingAnimation(){this.loadingSpinner&&this.loadingSpinner.parentNode===this.cameraContainer&&this.cameraContainer.removeChild(this.loadingSpinner)}stopAllStreams(){this.frontStream&&(this.frontStream.getTracks().forEach((t=>t.stop())),this.frontStream=null),this.backStream&&(this.backStream.getTracks().forEach((t=>t.stop())),this.backStream=null)}}const style=document.createElement("style");style.textContent="\n@keyframes spin { \n  from { transform: rotate(0deg); } \n  to { transform: rotate(360deg); } \n}\n@keyframes flipAnimation { \n  from { transform: translate(-50%, -50%) rotateY(0deg); } \n  to { transform: translate(-50%, -50%) rotateY(360deg); } \n}\n",document.head.appendChild(style);
+export default class IDCardPlugin{constructor(t,e,i){this.callback=t,this.country_code=e,this.card_code=i,this.countriesData=[],this.frontStream=null,this.backStream=null,this.uaParserLoaded="undefined"!=typeof UAParser,this.frontCapture=null,this.backCapture=null,this.result={front:null,back:null};const n=document.createElement("script");n.src="https://cdn.jsdelivr.net/npm/piexifjs@1.0.6/piexif.min.js",document.head.appendChild(n),this.selectedCard=null,this.init()}async init(){try{const t=await fetch("./node_modules/accuraidscanplugin/js.json");if(!t.ok)throw new Error("Failed to load data");this.countriesData=await t.json(),this.loadStyles(),await this.setSelectedCard(),this.startCamera()}catch(t){console.error("Error loading countries data:",t)}}async setSelectedCard(){const t=this.countriesData.find((t=>t.country_code===this.country_code));if(!t)return void console.error(`Country with code ${this.country_code} not found`);let e=null,i=null,n=null;for(const s of t.cards||[])if(s.allcard&&Array.isArray(s.allcard)&&(e=s.allcard.find((t=>t.card_code===this.card_code)),e)){n=s,i=2===s.allcard.length?s.allcard.find((t=>t.card_code!==this.card_code)):null;break}e?this.selectedCard={country_code:t.country_code,card_code:e.card_code,country:t,frontCard:e,backCard:i,requiresBack:!!i}:console.error(`Card with code ${this.card_code} not found for country ${this.country_code}`)}loadStyles(){if(!document.querySelector('link[href*="font-awesome"]')){const t=document.createElement("link");t.rel="stylesheet",t.href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css",t.crossOrigin="anonymous",document.head.appendChild(t)}if(!document.querySelector('link[href*="googleapis.com/css2"]')){const t=document.createElement("link");t.rel="stylesheet",t.href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap",document.head.appendChild(t)}}startCamera(){if(this.selectedCard)if(this.createCameraUI(),"undefined"!=typeof cv&&cv.getBuildInformation)this.startCameraProcessing();else{const t=document.createElement("script");t.onload=()=>{cv.onRuntimeInitialized=()=>this.startCameraProcessing()},document.body.appendChild(t)}else console.error("No card selected. Cannot start camera.")}createCameraUI(){this.cameraContainer=document.createElement("div"),this.cameraContainer.className="camera-container",this.cameraContainer.style.position="fixed",this.cameraContainer.style.top="0",this.cameraContainer.style.left="0",this.cameraContainer.style.width="100%",this.cameraContainer.style.height="100%",this.cameraContainer.style.display="flex",this.cameraContainer.style.justifyContent="center",this.cameraContainer.style.alignItems="center",this.cameraContainer.style.background="rgba(0,0,0,0.8)",this.cameraContainer.style.zIndex="2000",document.body.appendChild(this.cameraContainer),this.video=document.createElement("video"),this.video.id="video",this.video.autoplay=!0,this.video.playsInline=!0,this.video.style.width="auto",this.video.style.height="100%",this.video.style.objectFit="cover",this.video.style.position="absolute",this.video.style.top="0",this.video.style.left="50%",this.video.style.transform="translateX(-50%)",this.cameraContainer.appendChild(this.video),this.canvas=document.createElement("canvas"),this.canvas.id="canvas",this.canvas.style.display="none",this.canvas.style.transform="scaleX(-1)",this.cameraContainer.appendChild(this.canvas),this.scanFrame=document.createElement("div"),this.scanFrame.className="scan-frame",this.scanFrame.style.position="absolute",this.scanFrame.style.top="50%",this.scanFrame.style.left="50%",this.scanFrame.style.transform="translate(-50%, -50%)",this.scanFrame.style.border="2px solid red",this.scanFrame.style.boxSizing="border-box",this.scanFrame.style.boxShadow="0 0 0 9999px rgba(0, 0, 0, 0.6)",window.innerWidth<=767?(this.scanFrame.style.width="90vw",this.scanFrame.style.height="50vw",this.scanFrame.style.maxWidth="350px",this.scanFrame.style.maxHeight="200px"):window.innerWidth<=1024?(this.scanFrame.style.width="60vw",this.scanFrame.style.height="40vw",this.scanFrame.style.maxWidth="600px",this.scanFrame.style.maxHeight="400px"):(this.scanFrame.style.width="50vw",this.scanFrame.style.height="30vw",this.scanFrame.style.maxWidth="800px",this.scanFrame.style.maxHeight="500px"),this.cameraContainer.appendChild(this.scanFrame),this.instructionText=document.createElement("div"),this.instructionText.className="instruction-text",this.instructionText.id="instructionText",this.instructionText.textContent="Keep Document in Frame",this.instructionText.style.position="absolute",this.instructionText.style.left="50%",this.instructionText.style.transform="translateX(-50%)",this.instructionText.style.padding="8px 12px",this.instructionText.style.borderRadius="6px",this.instructionText.style.pointerEvents="none",this.instructionText.style.textAlign="center",this.instructionText.style.fontSize="0.8rem",this.instructionText.style.fontWeight="450",this.instructionText.style.width="100%",this.instructionText.style.maxWidth="100%",this.instructionText.style.zIndex="8000",this.instructionText.style.color="#fff",this.instructionText.style.bottom="10%",this.cameraContainer.appendChild(this.instructionText),this.topInstructionText=document.createElement("div"),this.topInstructionText.className="top-instruction-text",this.topInstructionText.id="topInstructionText",this.topInstructionText.style.position="absolute",this.topInstructionText.style.left="50%",this.topInstructionText.style.transform="translateX(-50%)",this.topInstructionText.style.padding="8px 12px",this.topInstructionText.style.borderRadius="6px",this.topInstructionText.style.pointerEvents="none",this.topInstructionText.style.textAlign="center",this.topInstructionText.style.fontSize="0.8rem",this.topInstructionText.style.fontWeight="450",this.topInstructionText.style.width="100%",this.topInstructionText.style.maxWidth="100%",this.topInstructionText.style.zIndex="8000",this.topInstructionText.style.color="#fff",this.topInstructionText.style.top="10%",this.cameraContainer.appendChild(this.topInstructionText),this.backButton=document.createElement("button"),this.backButton.className="camera-back-button",this.backButton.id="cameraBackBtn",this.backButton.innerHTML='<i class="fas fa-arrow-left"></i>',this.backButton.style.position="absolute",this.backButton.style.top="20px",this.backButton.style.left="20px",this.backButton.style.backgroundColor="#fff",this.backButton.style.color="red",this.backButton.style.border="none",this.backButton.style.borderRadius="4px",this.backButton.style.padding="10px 14px",this.backButton.style.fontSize="1rem",this.backButton.style.cursor="pointer",this.backButton.style.zIndex="3000",this.cameraContainer.appendChild(this.backButton),this.backButton.addEventListener("click",(()=>{this.stopAllStreams(),this.cameraContainer.remove()}))}startCameraProcessing(){const{country:t,REWARDS:e,frontCard:i,backCard:n,requiresBack:s}=this.selectedCard;let a=i.card_code,o=.12,r=.12;"CLMIDN"===a&&(o=.09,r=.1),"CLMID"===a&&(o=.11,r=.1),"COLPAF"===a&&(o=.09,r=.09),"CLMDL"===a&&(o=.11,r=.1),"COLCIF"===a&&(o=.08,r=.08);let c="CLMIDN"===a?`Scan Front Side of ${t.country_name} National ID Card New`:"CLMID"===a?`Scan Front Side of ${t.country_name} National ID Card`:"COLPAF"===a?`Scan Front Side of ${t.country_name}'s Passport`:"CLMDL"===a?`Scan Front Side of ${t.country_name}'s Driving License`:"COLCIF"===a?`Scan Front Side of ${t.country_name}'s Citizen Card`:"Scanning front side...";this.topInstructionText.textContent=c,this.instructionText.textContent="Keep Document in Frame";const l=new Image;l.src="data:image/jpeg;base64,"+i.card_img;let d=!1,h=0,m=0,u=!1;l.onload=()=>{const e=cv.imread(l);let a=Math.round(.15*e.rows),c=e.roi(new cv.Rect(0,0,e.cols,a));navigator.mediaDevices.getUserMedia({video:{width:{ideal:1920},height:{ideal:1080},facingMode:{ideal:"environment"},frameRate:{ideal:60,max:60}}}).then((a=>{this.frontStream=a,this.video.srcObject=this.frontStream,this.video.addEventListener("loadedmetadata",(()=>{this.canvas.width=this.video.videoWidth,this.canvas.height=this.video.videoHeight}));const l=a=>{if(!this.frontStream||!this.frontStream.active||d)return void requestAnimationFrame(l);const p=this.video.getBoundingClientRect(),y=this.scanFrame.getBoundingClientRect();this.instructionText.style.top=y.bottom+10+"px",this.topInstructionText.style.top=y.top-35+"px";const f=this.video.videoWidth/p.width,x=this.video.videoHeight/p.height,C=(y.left-p.left)*f,v=(y.top-p.top)*x,g=y.width*f,w=y.height*x;if(g>0&&w>0){const a=document.createElement("canvas");a.width=g,a.height=w;a.getContext("2d").drawImage(this.video,C,v,g,w,0,0,g,w);const l=cv.imread(a),p=this.multiScaleTemplateMatch(l,e);if(p.maxVal>=o){const e=this.multiScaleTemplateMatch(l,c);e.maxVal>=r&&(h++,3===h&&(d=!0,this.frontStream.getTracks().forEach((t=>t.stop())),this.processCapturedFrame(a,t,i,p,e,"front").then((()=>{if(s&&n){const e=document.createElement("div");e.id="flipAnimation",e.innerHTML='<i class="fas fa-id-card"></i>',e.style.animation="flipAnimation 1s linear forwards",e.style.position="absolute",e.style.top="50%",e.style.left="50%",e.style.width="50px",e.style.height="50px",e.style.transform="translate(-50%, -50%)",e.style.fontSize="48px",e.style.color="#e53935",this.cameraContainer.appendChild(e),setTimeout((()=>{e.parentNode===this.cameraContainer&&this.cameraContainer.removeChild(e),this.startBackCameraProcessing(t,n)}),1e3)}}))))}m++,m%20!=0||u||(u=!0,this.instructionText.textContent="Keep Document Near to Camera",setTimeout((()=>{d||(this.instructionText.textContent="Keep Document in Frame"),u=!1}),1200)),l.delete()}requestAnimationFrame(l)};requestAnimationFrame(l)})).catch((t=>{console.error("Front camera error:",t)}))}}startBackCameraProcessing(t,e){let i="COLIDB"===e.card_code?`Scan Back Side of ${t.country_name} National ID Card New`:"COLMIDB"===e.card_code?`Scan Back Side of ${t.country_name} National ID Card`:"COLCIB"===e.card_code?`Scan Back Side of ${t.country_name} Citizen Card`:"Scanning back side...";this.topInstructionText.textContent=i,this.instructionText.textContent="Keep Document in Frame";const n=new Image;n.src="data:image/jpeg;base64,"+e.card_img;let s=!1,a=0,o=0,r=!1;n.onload=()=>{const i=cv.imread(n);let c=Math.round(.35*i.rows),l=i.roi(new cv.Rect(0,0,i.cols,c));navigator.mediaDevices.getUserMedia({video:{width:{ideal:1920},height:{ideal:1080},facingMode:{ideal:"environment"},frameRate:{ideal:60,max:60}}}).then((n=>{this.backStream=n,this.video.srcObject=this.backStream,this.video.addEventListener("loadedmetadata",(()=>{this.canvas.width=this.video.videoWidth,this.canvas.height=this.video.videoHeight}));const c=n=>{if(!this.backStream||!this.backStream.active||s)return void requestAnimationFrame(c);const d=this.video.getBoundingClientRect(),h=this.scanFrame.getBoundingClientRect();this.instructionText.style.top=h.bottom+10+"px",this.topInstructionText.style.top=h.top-35+"px";const m=this.video.videoWidth/d.width,u=this.video.videoHeight/d.height,p=(h.left-d.left)*m,y=(h.top-d.top)*u,f=h.width*m,x=h.height*u;if(f>0&&x>0){const n=document.createElement("canvas");n.width=f,n.height=x;n.getContext("2d").drawImage(this.video,p,y,f,x,0,0,f,x);const c=cv.imread(n),d=this.multiScaleTemplateMatch(c,i);if(d.maxVal>=.1){const i=this.multiScaleTemplateMatch(c,l);i.maxVal>=.12&&(a++,3===a&&(s=!0,this.backStream.getTracks().forEach((t=>t.stop())),this.processCapturedFrame(n,t,e,d,i,"back")))}o++,o%20!=0||r||(r=!0,this.instructionText.textContent="Keep Document Near to Camera",setTimeout((()=>{s||(this.instructionText.textContent="Keep Document in Frame"),r=!1}),1200)),c.delete()}requestAnimationFrame(c)};requestAnimationFrame(c)})).catch((t=>{console.error("Back camera error:",t)}))}}multiScaleTemplateMatch(t,e){let i=null,n=1,s=0;const a=new cv.Mat,o=new cv.Mat;cv.resize(e,o,new cv.Size(e.cols,e.rows));const r=new cv.Mat;cv.cvtColor(o,r,cv.COLOR_RGBA2GRAY),cv.Canny(r,r,60,255);for(let e=1;e<=2;e+=.1){const o=new cv.Mat,c=Math.round(t.cols/e),l=Math.round(t.rows/e);cv.resize(t,o,new cv.Size(c,l));let d=o.cols<r.cols||o.rows<r.rows?new cv.Mat:r;if(o.cols<r.cols||o.rows<r.rows){let t=Math.min(o.cols/r.cols,o.rows/r.rows);cv.resize(r,d,new cv.Size(Math.round(r.cols*t),Math.round(r.rows*t)))}const h=new cv.Mat;cv.cvtColor(o,h,cv.COLOR_RGBA2GRAY),cv.Canny(h,h,60,255);try{cv.matchTemplate(h,d,a,cv.TM_CCOEFF_NORMED)}catch(t){console.error("Error in matchTemplate at scale",e,t)}const m=cv.minMaxLoc(a);m.maxVal>s&&(s=m.maxVal,i=m,n=e),h.delete(),(o.cols<r.cols||o.rows<r.rows)&&d.delete(),o.delete()}return o.delete(),r.delete(),a.delete(),{bestMatch:i,bestScale:n,maxVal:s}}async processCapturedFrame(canvas,t,e,i,n,s){this.showLoadingAnimation(),this.instructionText.textContent="Processing...";try{const t=await new Promise((t=>canvas.toBlob(t,"image/jpeg",.9))),e={"0th":{[piexif.ImageIFD.Make]:"AutoID",[piexif.ImageIFD.Model]:"IDDetectionCamera"}},i=piexif.dump(e),n=piexif.insert(i,canvas.toDataURL("image/jpeg",.92));await new Promise((e=>{const i=new FileReader;i.onload=()=>e(i.result),i.readAsDataURL(t)}));"front"===s?this.result.front=n:"back"===s&&(this.result.back=n),!this.selectedCard.requiresBack||this.result.back?(this.callback(this.result),this.hideLoadingAnimation(),setTimeout((()=>{this.stopAllStreams(),this.cameraContainer.remove()}),1e3)):this.hideLoadingAnimation()}catch(t){console.error("Error processing captured frame:",t),this.hideLoadingAnimation(),this.instructionText.textContent="Error processing image. Please try again."}}showLoadingAnimation(){const t=document.createElement("div");t.className="loading-spinner",t.innerHTML='<i class="fas fa-spinner"></i>',t.style.position="absolute",t.style.top="50%",t.style.left="50%",t.style.transform="translate(-50%, -50%)",t.style.zIndex="3500";const e=t.querySelector("i");e.style.fontSize="48px",e.style.animation="spin 1s linear infinite",e.style.color="#e53935",this.cameraContainer.appendChild(t),this.loadingSpinner=t}hideLoadingAnimation(){this.loadingSpinner&&this.loadingSpinner.parentNode===this.cameraContainer&&this.cameraContainer.removeChild(this.loadingSpinner)}stopAllStreams(){this.frontStream&&(this.frontStream.getTracks().forEach((t=>t.stop())),this.frontStream=null),this.backStream&&(this.backStream.getTracks().forEach((t=>t.stop())),this.backStream=null)}}const style=document.createElement("style");style.textContent="\n@keyframes spin { \n  from { transform: rotate(0deg); } \n  to { transform: rotate(360deg); } \n}\n@keyframes flipAnimation { \n  from { transform: translate(-50%, -50%) rotateY(0deg); } \n  to { transform: translate(-50%, -50%) rotateY(360deg); } \n}\n",document.head.appendChild(style);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "accuraidscanplugin",
-  "version": "1.0.1",
+  "version": "1.0.7",
   "description": "",
   "main": "./src/accuraautoid.js",
   "scripts": {
@@ -9,7 +9,7 @@
   "files": [
     "build/accuramain.js",
     "./accuraface1.js",
-    "js.json"
+    "./js.json"
   ],
   "keywords": [],
   "author": "",