UNPKG

@scandit/web-datacapture-core

Version:

Scandit Data Capture SDK for the Web

21 lines 24.9 kB
import {b as b$4}from'./chunk-EKY4M37S.js';import {a as a$a}from'./chunk-RMKJUHZW.js';import {d as d$2,c,b as b$5}from'./chunk-NPIPIS7X.js';import {a as a$g}from'./chunk-7CQVGY6N.js';import {a as a$2}from'./chunk-N5YZEC56.js';import {a as a$c}from'./chunk-FSWALUUO.js';import {b as b$1,a as a$3}from'./chunk-5S537AFM.js';import {a as a$e}from'./chunk-46WJFV3I.js';import {a as a$h}from'./chunk-DMOXDUF6.js';import {a as a$b}from'./chunk-JVZYXEYO.js';import {a as a$d}from'./chunk-3BBG6EVS.js';import {a as a$9}from'./chunk-KYNYQBNF.js';import {a as a$8}from'./chunk-ZKROZLQ4.js';import {a as a$5}from'./chunk-5FUZURCZ.js';import {b as b$2}from'./chunk-457L5N2F.js';import {a as a$6}from'./chunk-3MEGNPVU.js';import {a as a$1}from'./chunk-VJB527QZ.js';import {a as a$7}from'./chunk-NMX4VHW2.js';import {a}from'./chunk-7XQ3GHYH.js';import {d as d$1}from'./chunk-UGUDXT2N.js';import {a as a$f}from'./chunk-XR65N6EG.js';import {d}from'./chunk-QM37NXPY.js';import {a as a$4,b as b$3,i,f}from'./chunk-77BBIAZE.js';import {a as a$i}from'./chunk-WUHKODFA.js';var b="core.camera.recovery",q=class Y{constructor(){this.focusGesture=d.DataCaptureView.focusGesture;this.zoomGesture=d.DataCaptureView.zoomGesture;this._scanAreaMargins=d.DataCaptureView.scanAreaMargins;this._pointOfInterest=d.DataCaptureView.pointOfInterest;this._logoStyle=d.DataCaptureView.logoStyle;this._logoAnchor=d.DataCaptureView.logoAnchor;this._logoOffset=d.DataCaptureView.logoOffset;this._context=null;this.overlays=new Set;this.controls=[];this.controlWidgets=new WeakMap;this.frozenFrameCanvas=document.createElement("canvas");this.listeners=[];this.isVideoElementDetached=false;this.orientation="portrait";this.hiddenProperties={stopVideoTracksOnVisibilityChange:true,freezeFrameWhenStoppingFrameSource:true};this.orientationObserver=new b$1;this.onOrientationChangeListener=this.onOrientationChange.bind(this);this.onHintPresenterUpdateHandler=this.onHintPresenterUpdate.bind(this);this.onBeforeShowToastsHandler=this.onBeforeShowToasts.bind(this);this.onWorkerMessageHandler=this.onWorkerMessage.bind(this);this.htmlElementDidChangeHandler=this.htmlElementDidChange.bind(this);this.htmlElementDisconnectedHandler=this.htmlElementDisconnected.bind(this);this.notificationPresenter=null;this.visibilityListener=this.onVisibilityChange.bind(this),this.cameraRecoveryListener=this.cameraRecovery.bind(this),a.getInstance().updateIfMissing(a$1);}get scanAreaMargins(){return this._scanAreaMargins}set scanAreaMargins(e){var t;this._scanAreaMargins=e,(t=this.privateContext)==null||t.update();}get pointOfInterest(){return this._pointOfInterest}set pointOfInterest(e){var t;this._pointOfInterest=e,(t=this.privateContext)==null||t.update();}get logoStyle(){return this._logoStyle}set logoStyle(e){var t;this._logoStyle=e,(t=this.privateContext)==null||t.update();}get logoAnchor(){return this._logoAnchor}set logoAnchor(e){var t;this._logoAnchor=e,(t=this.privateContext)==null||t.update();}get logoOffset(){return this._logoOffset}set logoOffset(e){var t;this._logoOffset=e,(t=this.privateContext)==null||t.update();}get cameraRecoveryText(){return a.getInstance().get(b)}get width(){var e,t;return Math.round((t=(e=this.htmlElementState)==null?void 0:e.width)!=null?t:0)}get height(){var e,t;return Math.round((t=(e=this.htmlElementState)==null?void 0:e.height)!=null?t:0)}get canvasDrawer(){return !this._canvasDrawer&&this.canvasElement!=null&&(this._canvasDrawer=new b$2(this.canvasElement),this._canvasDrawer.startObservingCanvasResize()),this._canvasDrawer}get privateContext(){return this._context}static async forContext(e){let t=new Y;return await t.setContext(e),t}showProgressBar(){var e;(e=this.loadingOverlay)==null||e.show();}hideProgressBar(){var e;(e=this.loadingOverlay)==null||e.hide();}setProgressBarPercentage(e){this.loadingOverlay&&(this.loadingOverlay.progress=e);}setProgressBarMessage(e){this.loadingOverlay&&(this.loadingOverlay.message=e);}getContext(){return this._context}async setContext(e){var t,i,n;if(this._context=e,e){if(this.overlays.size>0&&((t=this.privateContext)==null?void 0:t.modes.size)===0)throw new Error(["Cannot assign this view to this context. This view has overlays but the context does not have any mode attached matching these overlays.","Remove the overlays first before attaching the view to the context, or add the corresponding mode to the context before attaching this view."].join(" "));await e.setView(this),(i=this.privateContext)==null||i.subscribeToWorkerMessages(this.onWorkerMessageHandler),(n=this._context)!=null&&n.frameSource&&await this.onFrameSourceChange(this._context.frameSource);}}connectToElement(e){var t,i,n;this.orientationObserver.register(),this.setupHtmlElement(e),(t=this.canvasDrawer)==null||t.startObservingCanvasResize(),this.htmlElementDidChange(),a$2.add(this),this.orientation=this.orientationObserver.orientation.value,this.orientationObserver.addEventListener(a$3,this.onOrientationChangeListener),(i=this.hintPresenter)==null||i.addEventListener("hintpresenterupdate",this.onHintPresenterUpdateHandler),(n=this.hintPresenter)==null||n.addEventListener("willshow",this.onBeforeShowToastsHandler),this.localizationSubscription=a.getInstance().subscribe(r=>{r[b]!=null&&(this.cameraRecoveryElement.textContent=r[b]);});}detachFromElement(){var e,t,i,n,r,o,l,d;(e=this.htmlElementState)==null||e.removeListeners(),this.removeStyles(),(t=this.canvasDrawer)==null||t.endObservingCanvasResize(),document.removeEventListener("visibilitychange",this.visibilityListener);for(let h of ["touchend","mousedown"])this.cameraRecoveryElement.removeEventListener(h,this.cameraRecoveryListener);(i=this.loadingOverlay)==null||i.remove(),(n=this.customLocationsView)==null||n.unmount(),this.notificationPresenter=null,this.htmlElementDidChange(),(r=this.gestureRecognizer)==null||r.removeAllListeners(),this.clearHtmlElementContent(),a$2.delete(this),this.orientationObserver.unregister(),this.orientationObserver.removeEventListener(a$3,this.onOrientationChangeListener),(o=this.hintPresenter)==null||o.removeEventListener("hintpresenterupdate",this.onHintPresenterUpdateHandler),(l=this.hintPresenter)==null||l.removeEventListener("willshow",this.onBeforeShowToastsHandler),(d=this.localizationSubscription)==null||d.cancel();}async addOverlay(e){var t;this.overlays.has(e)||(this.overlays.add(e),await((t=this.privateContext)==null?void 0:t.update([{type:"addOverlay",newValue:e}])));}async removeOverlay(e){var t;this.overlays.has(e)&&(await((t=this.privateContext)==null?void 0:t.update([{type:"removeOverlay",newValue:e}])),this.overlays.delete(e));}addListener(e){this.listeners.includes(e)||this.listeners.push(e);}removeListener(e){this.listeners.includes(e)&&this.listeners.splice(this.listeners.indexOf(e),1);}viewPointForFramePoint(e){var v,O,P,L,V,D,R,A;let t={width:(O=(v=this.htmlElementState)==null?void 0:v.width)!=null?O:0,height:(L=(P=this.htmlElementState)==null?void 0:P.height)!=null?L:0},i={width:(D=(V=this.videoElement)==null?void 0:V.videoWidth)!=null?D:0,height:(A=(R=this.videoElement)==null?void 0:R.videoHeight)!=null?A:0},n=t.width/t.height,r=i.width/i.height,o=n>r?t.width/i.width:t.height/i.height,l={x:e.x*o,y:e.y*o},d=(i.width*o-t.width)/2,h=(i.height*o-t.height)/2;return new a$4(l.x-d,l.y-h)}viewQuadrilateralForFrameQuadrilateral(e){let t=this.viewPointForFramePoint(e.topLeft),i=this.viewPointForFramePoint(e.topRight),n=this.viewPointForFramePoint(e.bottomLeft),r=this.viewPointForFramePoint(e.bottomRight);return new b$3(t,i,r,n)}addControl(e){var t;this.controls.includes(e)||(e.view=this,this.controls.push(e),this.controlsUpdated(),(t=this.privateContext)==null||t.update([{type:"addControl",newValue:e}]));}removeControl(e){var t;if(this.controls.includes(e)){e.view=null;let i=this.controls.splice(this.controls.indexOf(e),1);this.getControlWidget(i[0]).remove(true),this.controlsUpdated(),(t=this.privateContext)==null||t.update([{type:"removeControl",newValue:e}]);}}toJSONObject(){var e;return {scanAreaMargins:this.scanAreaMargins.toJSONObject(),pointOfInterest:this.pointOfInterest.toJSONObject(),logoAnchor:this.logoAnchor,logoOffset:this.logoOffset.toJSONObject(),logoHidden:(e=this.logoHidden)!=null?e:false,logoStyle:this.logoStyle,overlays:[...this.overlays].map(t=>t.toJSONObject()),controls:this.controls.map(t=>t.toJSONObject()),focusGesture:this.focusGesture?this.focusGesture.toJSONObject():null,zoomGesture:this.zoomGesture?this.zoomGesture.toJSONObject():null}}isCameraRecoveryVisible(){return !this.cameraRecoveryElement.hidden}setCameraRecoveryVisible(e){this.cameraRecoveryElement.hidden=!e;}async allowPictureInPicture(e){await d$1.instance().allowPictureInPicture(e);}viewAnchorPositionsForFrameAnchorPositions(e){let t=this.viewPointForFramePoint(e.topLeft),i=this.viewPointForFramePoint(e.topRight),n=this.viewPointForFramePoint(e.bottomLeft),r=this.viewPointForFramePoint(e.bottomRight),o=this.viewPointForFramePoint(e.centerLeft),l=this.viewPointForFramePoint(e.centerRight),d=this.viewPointForFramePoint(e.topCenter),h=this.viewPointForFramePoint(e.bottomCenter),v=this.viewPointForFramePoint(e.center);return new a$5(t,i,r,n,o,d,l,h,v)}setDidTapCustomLocationsViewListener(e){this.customLocationsView&&this.customLocationsView.listener===null&&(this.customLocationsView.listener=e);}renderCustomLocationsView(e){this.customLocationsView!=null&&(this.customLocationsView.setMirrored(d$1.instance().isMirrorImageEnabled()),Object.keys(e).includes("removedIds")?this.customLocationsView.render(e):this.customLocationsView.renderDomView(e));}getNotificationPresenter(){var e;if(!this.notificationPresenter){let t=(e=this.htmlElement)==null?void 0:e.querySelector(b$4.tag);if(!t)throw new Error("Notification presenter cannot be found. Please ensure the DataCaptureView is connected.");this.notificationPresenter=new a$6(t);}return this.notificationPresenter}removeStyles(){for(let e of document.querySelectorAll("style[scandit]"))e.remove();}onHintPresenterUpdate(e){var t;(t=this.privateContext)==null||t.workerCommand("hintPresenterV2update",{});}clearHtmlElementContent(){var e;this.htmlElement&&((e=this.canvasDrawer)==null||e.endObservingCanvasResize(),this.htmlElement.innerHTML="",this.cameraPaintboardElement=void 0,this.singleImageUploaderPaintboardElement=void 0,this.htmlElement=void 0);}setupHtmlElement(e){var o,l,d;this.createStyles(),this.htmlElement=e,b$4.register();let t=` <div class="${a$7.CONTAINER_CLASS_NAME}"> <div class="${a$7.PAINTBOARDS_CONTAINER_CLASS_NAME}"> <div data-js-id="loading-overlay"></div> <div class="${a$7.PAINTBOARD_CLASS_NAME}" data-js-id="camera-paintboard"> <video autoplay="autoplay" playsinline="true" muted="muted" poster="${a$8}" style="opacity: 0;"></video> <img class="${a$7.FROZEN_FRAME}" data-js-id="frozen-frame" alt="frozen-frame" hidden /> <canvas></canvas> <div data-js-id="${a$9.CUSTOM_VIEW_CONTAINER}"></div> <div class="${a$7.HINT_CONTAINER_CLASS_NAME}"> <div class="${a$7.HINT_CLASS_NAME}" hidden></div> </div> <${b$4.tag}></${b$4.tag}> <div class="${a$7.CONTROLS_CLASS_NAME}"></div> <div class="${a$7.CAMERA_RECOVERY_CLASS_NAME}" hidden>${this.cameraRecoveryText}</div> <div class="${a$7.ERROR_CLASS_NAME}" hidden></div> </div> <div class="${a$7.PAINTBOARD_CLASS_NAME}" data-js-id="singleimage-paintboard"></div> </div> </div> `;this.htmlElement.innerHTML=t,this.hintPresenter=this.htmlElement.querySelector(b$4.tag),this.notificationPresenter=this.hintPresenter?new a$6(this.hintPresenter):null,this.loadingOverlay&&this.loadingOverlay.remove(),this.loadingOverlay=a$a.create(),this.loadingOverlay.hide(),(o=this.htmlElement.querySelector('[data-js-id="loading-overlay"]'))==null||o.replaceWith(this.loadingOverlay),this.customLocationsView&&this.customLocationsView.unmount(),this.customLocationsView=new a$b,this.customLocationsView.mount(this.htmlElement.querySelector(`[data-js-id="${a$9.CUSTOM_VIEW_CONTAINER}"]`)),this.customLocationsView.mapViewAnchorPositionsForFramePoint=h=>this.viewAnchorPositionsForFrameAnchorPositions(h),this.containerElement=this.htmlElement.querySelector(`.${a$7.CONTAINER_CLASS_NAME}`),this.cameraPaintboardElement=this.containerElement.querySelector('[data-js-id="camera-paintboard"]'),this.singleImageUploaderPaintboardElement=this.containerElement.querySelector('[data-js-id="singleimage-paintboard"]');let i=this.cameraPaintboardElement.querySelector("canvas");this.canvasElement==null?this.canvasElement=i:i.replaceWith(this.canvasElement);let n=this.cameraPaintboardElement.querySelector('[data-js-id="frozen-frame"]');this.frozenFrame==null?this.frozenFrame=n:n.replaceWith(this.frozenFrame),this.controlsElement=this.cameraPaintboardElement.querySelector(`.${a$7.CONTROLS_CLASS_NAME}`),this.cameraRecoveryElement=this.cameraPaintboardElement.querySelector(`.${a$7.CAMERA_RECOVERY_CLASS_NAME}`),this.errorElement=this.cameraPaintboardElement.querySelector(`.${a$7.ERROR_CLASS_NAME}`),this.hintContainerElement=this.cameraPaintboardElement.querySelector(`.${a$7.HINT_CONTAINER_CLASS_NAME}`),this.hintElement=this.cameraPaintboardElement.querySelector(`.${a$7.HINT_CLASS_NAME}`);let r=this.cameraPaintboardElement.querySelector("video");this.videoElement?r.replaceWith(this.videoElement):(this.videoElement=r,this.videoPauseListener=this.handleVideoPause.bind(this),this.videoElement.addEventListener("pause",this.videoPauseListener)),this.lastFrameSourceState!=null&&((d=(l=this._context)==null?void 0:l.frameSource)==null||d.switchToDesiredState(this.lastFrameSourceState)),document.addEventListener("visibilitychange",this.visibilityListener);for(let h of ["touchend","mousedown"])this.cameraRecoveryElement.addEventListener(h,this.cameraRecoveryListener);this.htmlElementState&&this.htmlElementState.removeListeners(),this.htmlElementState=new a$c(this.htmlElement),this.htmlElementState.onStateChanged(this.htmlElementDidChangeHandler),this.htmlElementState.onDisconnected(this.htmlElementDisconnectedHandler),this.gestureRecognizer=new a$d(this.htmlElement),this.gestureRecognizer.addListener({onTap:async h=>{var v;(v=this.privateContext)==null||v.workerCommand("onTap",{point:h.toJSONObject()});}});}setupHtmlElementSingleImageUploader(e){var i;if(this.singleImageUploaderPaintboardElement==null)return;this.singleImageUploaderView&&this.singleImageUploaderView.unmount(),this.singleImageUploaderView=new a$e(e),this.singleImageUploaderView.mount(this.containerElement.querySelector('[data-js-id="singleimage-paintboard"]'));let t=(i=this._context)==null?void 0:i.frameSource;this.singleImageUploaderView.onInputCheck(n=>{t.getCurrentState()!=="starting"&&n.preventDefault();}),this.singleImageUploaderView.onBeforeFileRead(()=>{t._context&&this.singleImageUploaderView&&(this.singleImageUploaderView.canUploadFile=t._context.hasEnabledMode());}),this.singleImageUploaderView.onImageLoadError(()=>{t.currentState="starting",a$f.log(a$f.Level.Error,"Could not load image from selected file");}),this.singleImageUploaderView.onFileReaderError(n=>{var o,l;let r=n.target;t.currentState="starting",a$f.log(a$f.Level.Error,`Error while reading the file: ${(l=(o=r.error)==null?void 0:o.toString())!=null?l:""}`);}),this.singleImageUploaderView.onCaptureReady(async n=>{await t.processUploadedFileCapture(n);}),this.singleImageUploaderView.setButtonState(t.getCurrentState()==="starting"?"enabled":"disabled"),t.addView(this.singleImageUploaderView);}setupHtmlElementVisibility(e){this.cameraPaintboardElement!=null&&(this.cameraPaintboardElement.hidden=e!=="camera"),this.singleImageUploaderPaintboardElement!=null&&(this.singleImageUploaderPaintboardElement.hidden=e!=="singleImageUploader");}createStyles(){if(document.querySelector("style[scandit]")===null){let e=a$g();for(let[t,i]of Object.entries(e))i.setAttribute("scandit",`data-capture-sdk-${t}`),document.head.append(i);}}async onOrientationChange(e){var t,i;this.orientation=e.detail.value,await((i=this.privateContext)==null?void 0:i.update([{type:"viewChange",newValue:{...(t=this.htmlElementState)==null?void 0:t.toJSONObject(),orientation:this.orientation}}]));}htmlElementDidChange(){var i$1,n;if(!this.htmlElementState)return;let e=this.htmlElementState,t=e.toJSONObject();if(!a$c.areEquivalentJSONStates(this.lastHtmlElementState,t)){this.orientation=this.orientationObserver.orientation.value,(i$1=this.privateContext)==null||i$1.update([{type:"viewChange",newValue:{...e.toJSONObject(),orientation:this.orientation}}]),this.lastHtmlElementState=t,(n=this.canvasDrawer)==null||n.updateCanvasSizeAttributes(this.width,this.height),this.handleVideoDisplay(t.visible);for(let r of this.listeners)typeof r.didChangeSize=="function"&&r.didChangeSize(this,new i(t.size.width.value,t.size.height.value),this.orientation);}}async htmlElementDisconnected(){var e,t,i,n,r,o,l;this.isVideoElementDetached=false,(e=this.videoElement)==null||e.remove(),this.lastFrameSourceState=(i=(t=this._context)==null?void 0:t.frameSource)==null?void 0:i.getCurrentState(),await((r=(n=this._context)==null?void 0:n.frameSource)==null?void 0:r.switchToDesiredState("off")),await((l=this.privateContext)==null?void 0:l.update([{type:"viewChange",newValue:{...(o=this.htmlElementState)==null?void 0:o.toJSONObject(),orientation:this.orientation}}]));}handleVideoDisplay(e){this.videoElement==null||this.cameraPaintboardElement==null||(!e&&!this.isVideoElementDetached?(this.videoElement.width=0,this.videoElement.height=0,this.videoElement.style.opacity="0",this.videoElement.style.visibility="hidden",document.body.append(this.videoElement),this.isVideoElementDetached=true):e&&this.isVideoElementDetached&&(this.cameraPaintboardElement.insertAdjacentElement("afterbegin",this.videoElement),this.isVideoElementDetached=false,this.videoElement.style.removeProperty("visibility"),this.videoElement.removeAttribute("width"),this.videoElement.removeAttribute("height"),this.videoElement.style.removeProperty("opacity")));}isCanvasDrawerWithMetrics(e){return e instanceof a$h}onWorkerMessage(e){var t,i;switch(e.type){case "draw":{this.drawEngineCommands(e.payload);break}case "performanceMetricsReport":{let n=this._canvasDrawer;n!=null&&this.isCanvasDrawerWithMetrics(n)&&n.setPerformanceMetrics(e.payload);break}case "contextDidChangeStatus":{let n=a$i.fromJSON(e.payload);(t=this.loadingOverlay)==null||t.hide(),n.isValid?this.clearError():this.displayError(n);break}case "showHint":{this.displayHint(e.payload.text,e.payload.style);break}case "updateHint":{this.updateHint(e.payload.style);break}case "hideHint":{this.hideHint();break}default:{(i=this.hintPresenter)==null||i.handleMessage(e);break}}}async onBeforeShowToasts(){var t,i$1;let e=await((t=this._context)==null?void 0:t.workerCommand("getViewfinderInfo",{}));if((e==null?void 0:e.rect)!=null){if(e.rect.origin.x===0&&e.rect.origin.y===0&&e.rect.size.width===0&&e.rect.size.height===0)return;(i$1=this.hintPresenter)==null||i$1.setViewFinderRect(new f(new a$4(e.rect.origin.x,e.rect.origin.y),new i(e.rect.size.width,e.rect.size.height)));}}drawEngineCommands(e){var t;(t=this.canvasDrawer)==null||t.draw(e);}displayError(e){this.errorElement.textContent=`Error ${e.code}: ${e.message}`,this.errorElement.hidden=false;}clearError(){this.errorElement.textContent="",this.errorElement.hidden=true;}displayHint(e,t){this.hintElement.textContent=e,this.hintElement.hidden=false,this.updateHint(t);}hideHint(){this.hintElement.textContent="",this.hintElement.hidden=true;}updateHint(e){this.hintElement.style.background=e.backgroundColor,this.hintElement.style.color=e.textColor,this.hintElement.style.fontSize=e.font==="body"?"1.25rem":"1rem",this.hintElement.style.borderRadius=e.hintCornerStyle==="rounded"?"5px":"0px",e.hintHeight==="taller"&&(this.hintElement.style.paddingTop="1.25em",this.hintElement.style.paddingBottom="1.25em"),e.hintWidth==="wider"&&(this.hintElement.style.paddingLeft="1.25em",this.hintElement.style.paddingRight="1.25em"),this.updateAnchor(e);}updateAnchor(e){let t=`${e.verticalOffsetRatio*100}vh`;switch(e.anchor){case "topLeft":{this.hintContainerElement.style.placeContent="start left",this.hintElement.style.transform=`translateY(${t})`;break}case "topCenter":{this.hintContainerElement.style.placeContent="start center",this.hintElement.style.transform=`translateY(${t})`;break}case "topRight":{this.hintContainerElement.style.placeContent="start right",this.hintElement.style.transform=`translateY(${t})`;break}case "centerLeft":{this.hintContainerElement.style.placeContent="center start";break}case "center":{this.hintContainerElement.style.placeContent="center";break}case "centerRight":{this.hintContainerElement.style.placeContent="center end";break}case "bottomLeft":{this.hintContainerElement.style.placeContent="end left";break}case "bottomCenter":{this.hintContainerElement.style.placeContent="end center";break}case "bottomRight":{this.hintContainerElement.style.placeContent="end right";break}}}controlsUpdated(){var e;this.redrawControls(),(e=this.privateContext)==null||e.update();}redrawControls(){var t;let e=(t=this._context)==null?void 0:t.frameSource;for(let i of this.controls){let n=this.getControlWidget(i);e==null||e.desiredState==="off"||e.desiredState==="standby"||e.desiredState==="stopping"?n.remove():n.install();}}registerControlWidget(e,t){let i=new t(e,this.controlsElement);return this.controlWidgets.set(e,i),i}getControlWidget(e){let t=this.controlWidgets.get(e);if(t)return t;let{type:i}=e,n;switch(i){case "torch":{n=new b$5(e,this.controlsElement),this.controlWidgets.set(e,n);break}case "camera":{n=new c(e,this.controlsElement),this.controlWidgets.set(e,n);break}case "camera-fov":{n=new d$2(e,this.controlsElement),this.controlWidgets.set(e,n);break}}return n}async onFrameSourceChange(e){let t=e==null?void 0:e.type;if(this.setupHtmlElementVisibility(t),t==="camera"){let i=e==null?void 0:e.getCurrentState();i!=null&&await this.onCameraStateChanged(i);}else t==="singleImageUploader"&&this.setupHtmlElementSingleImageUploader(e.settings);}async onCameraStateChanged(e){var t;switch((t=this.cameraPaintboardElement)==null||t.classList.toggle(a$7.PAINTBOARD_CLASS_NAME_STATE_ON,e==="on"),e){case "stopping":{this.hiddenProperties.freezeFrameWhenStoppingFrameSource&&this.freezeFrame(),this.setVideoElementOpacity("0");return}case "starting":case "bootingUp":case "wakingUp":{if(!this.htmlElement){a$f.log(a$f.Level.Error,"cannot set frame source stream before connecting view to an HTML element");return}this.videoElement&&(d$1.instance().videoElement=this.videoElement,d$1.instance().gui.isCameraRecoveryVisible=this.isCameraRecoveryVisible.bind(this),d$1.instance().gui.setCameraRecoveryVisible=this.setCameraRecoveryVisible.bind(this),this.setVideoElementOpacity("0"));return}case "off":{this.setVideoElementOpacity("0"),this.redrawControls();return}case "on":{await d$1.instance().waitForCapabilities(),this.redrawControls(),this.unfreezeFrame(),this.setVideoElementOpacity("1");break}case "goingToSleep":{this.freezeFrame();break}}}setVideoElementOpacity(e){this.videoElement&&(this.videoElement.style.opacity=e),this.canvasElement&&(this.canvasElement.style.opacity=e);}onSingleImageUploaderSettingsChange(e){this.setupHtmlElementSingleImageUploader(e);}handleVideoPause(){d$1.instance().playVideo();}setHiddenProperty(e,t){this.hiddenProperties[e]=t;}async onVisibilityChange(){var t,i;let e=(t=this.videoElement)==null?void 0:t.srcObject;if(this.hiddenProperties.stopVideoTracksOnVisibilityChange&&(document.visibilityState==="hidden"&&d$1.instance().stopVideoTracks(),document.visibilityState==="visible"&&d$1.instance().activeCamera!=null&&e!=null))if(!e.active||(i=e.getVideoTracks()[0])!=null&&i.muted)try{a$f.debug('Detected visibility change ("visible") event with inactive video source, try to reinitialize camera'),await d$1.instance().reinitializeCamera();}catch(n){}else a$f.debug('Detected visibility change ("visible") event with active video source, replay video'),d$1.instance().playVideo();}async cameraRecovery(e){e.preventDefault(),d$1.instance().activeCamera=d$1.instance().selectedCamera,await d$1.instance().reinitializeCamera();}freezeFrame(){var i;if(!this.frozenFrame)return;let e=d$1.instance().getCurrentFrame();if(!e)return;let t=new ImageData(e.data,e.width,e.height);this.frozenFrameCanvas.width=t.width,this.frozenFrameCanvas.height=t.height,this.frozenFrame.width=t.width,this.frozenFrame.height=t.height,(i=this.frozenFrameCanvas.getContext("2d"))==null||i.putImageData(t,0,0),this.frozenFrame.src=this.frozenFrameCanvas.toDataURL("image/jpeg",.4),this.frozenFrame.classList.toggle(a$7.MIRRORED_CLASS_NAME,d$1.instance().isMirrorImageEnabled()),this.frozenFrame.hidden=false;}unfreezeFrame(){this.frozenFrame&&(this.frozenFrame.src="",this.frozenFrame.hidden=true);}};export{q as a};