UNPKG

@scandit/web-datacapture-barcode

Version:

Scandit Data Capture SDK for the Web

1 lines 16 kB
import {a as a$7}from'./chunk-ZPCWOA3Y.js';import {a as a$6}from'./chunk-MHOUYN7K.js';import {a}from'./chunk-HDLJOQJY.js';import {a as a$9}from'./chunk-KMEGIFKL.js';import {a as a$5}from'./chunk-QRG4J3CL.js';import {b as b$1}from'./chunk-33EFB3RJ.js';import {b}from'./chunk-OH47PSIL.js';import {a as a$1}from'./chunk-I53W7VSB.js';import {a as a$8}from'./chunk-O5SUMSOC.js';import {a as a$2}from'./chunk-5JT5U4EK.js';import {a as a$4}from'./chunk-I3PK5YW4.js';import {a as a$3}from'./chunk-EWBTYHV5.js';import {Anchor,DataCaptureView,Direction,Point,Size}from'@scandit/web-datacapture-core';import {Backdrop}from'@scandit/web-datacapture-core/build/js/private/ui/atoms/Backdrop.js';import {ScanditHTMLElement}from'@scandit/web-datacapture-core/build/js/private/utils/ScanditHTMLElement.js';import {css}from'@scandit/web-datacapture-core/build/js/private/utils/css.js';import {defineCustomElements}from'@scandit/web-datacapture-core/build/js/private/utils/defineCustomElements.js';import {calculateArea,calculateWidth,calculateHeight}from'@scandit/web-datacapture-core/build/js/private/utils/quadrilateralUtils.js';import {Timeout}from'@scandit/web-datacapture-core/build/js/private/utils/timeout.js';import {TorchSwitchIconButton}from'@scandit/web-datacapture-core/build/js/private/ui/molecules/TorchSwitchIconButton.js';var W={async highlightForBarcode(E,T){let t=a$9.create(E);T(t);}},c=class c extends ScanditHTMLElement{constructor(){super(...arguments);this.torchSwitchIconButton=null;this.cameraSwitchButton=null;this.zoomButton=null;this._shouldShowTorchControl=false;this._isTorchAvailable=false;this.onTorchButtonClickHandler=this.onTorchButtonClick.bind(this);this.onCameraSwitchButtonHandler=this.onCameraSwitchButtonClick.bind(this);this.onZoomButtonHandler=this.onZoomButtonClick.bind(this);this.onLayoutPointerDownHandler=this.onLayoutPointerDown.bind(this);this.onInfoAnnotationTapHandler=this.onInfoAnnotationTap.bind(this);this.pendingDeletionTimeout=null;}set shouldShowZoomControl(t){this.zoomButton&&(this.zoomButton.hidden=!t);}get shouldShowZoomControl(){return this.zoomButton===null?false:!this.zoomButton.hidden}set shouldShowCameraSwitchControl(t){this.cameraSwitchButton&&(this.cameraSwitchButton.hidden=!t);}get shouldShowCameraSwitchControl(){return this.cameraSwitchButton===null?false:!this.cameraSwitchButton.hidden}set shouldShowTorchControl(t){this.torchSwitchIconButton!==null&&(this._shouldShowTorchControl=t,this.torchSwitchIconButton.hidden=!(t&&this._isTorchAvailable));}get shouldShowTorchControl(){return this._shouldShowTorchControl}set torchControlPosition(t){var o;(o=this.torchSwitchIconButton)==null||o.setAttribute("slot",`controls-${t===Anchor.Center?Anchor.TopLeft:t}`);}get torchControlPosition(){var o,e;let t=(e=(o=this.torchSwitchIconButton)==null?void 0:o.getAttribute("slot"))!=null?e:"";return t===""?Anchor.TopLeft:t.replace("controls-","")}set zoomControlPosition(t){var o;(o=this.zoomButton)==null||o.setAttribute("slot",`controls-${t===Anchor.Center?Anchor.BottomRight:t}`);}get zoomControlPosition(){var o,e;let t=(e=(o=this.zoomButton)==null?void 0:o.getAttribute("slot"))!=null?e:"";return t===""?Anchor.BottomRight:t.replace("controls-","")}set cameraSwitchControlPosition(t){var o;(o=this.cameraSwitchButton)==null||o.setAttribute("slot",`controls-${t===Anchor.Center?Anchor.TopRight:t}`);}get cameraSwitchControlPosition(){var o,e;let t=(e=(o=this.zoomButton)==null?void 0:o.getAttribute("slot"))!=null?e:"";return t===""?Anchor.TopRight:t.replace("controls-","")}static async createWithSettings(t,o,e,i,n){c.register();let r=document.createElement(c.tag);return r.barcodeArViewSettings=i,r.layout=a.create(),r.append(r.layout),a$1(t)?(r.dataCaptureView=t,r.dataCaptureView.containerElement.prepend(r),await t.setContext(o)):(r.dataCaptureView=await DataCaptureView.forContext(o),r.dataCaptureView.connectToElement(t),r.dataCaptureView.containerElement.prepend(r)),r.presenter=new a$2(r,o,e,i,n!=null?n:a$3.createRecommendedCameraSettings()),await r.presenter.prepare(),r}static async create(t,o,e){return c.createWithSettings(t,o,e,new a$4)}static register(){defineCustomElements({[a.tag]:a,[a$7.tag]:a$7,[a$6.tag]:a$6,[TorchSwitchIconButton.tag]:TorchSwitchIconButton,[c.tag]:c,[Backdrop.tag]:Backdrop,[a$5.tag]:a$5});}static createStyleElement(){return css`[data-could-be-deleted=true]{display:none!important}[data-on-foreground=true]{z-index:3}${c.tag}{inset:0;position:absolute;z-index:1}`}getHighlightForBarcode(t){return this.queryHighlightByDataId(a$8(t))}getAnnotationForBarcode(t){return this.queryAnnotationByDataId(a$8(t))}async start(){return this.presenter.startSearching()}async stop(){return this.presenter.stopSearching()}async pause(){return this.presenter.pauseSearching()}reset(){this.deletePendingViews(),this.deleteAllViews();}getNotificationPresenter(){return this.dataCaptureView.getNotificationPresenter()}setTorchAvailable(t){this._isTorchAvailable=t,this.torchSwitchIconButton!==null&&(this.torchSwitchIconButton.hidden=!(this._shouldShowTorchControl&&this._isTorchAvailable));}toggleTorchIcon(t){this.torchSwitchIconButton!==null&&(this.torchSwitchIconButton.state=t);}onTorchButtonClick(){this.presenter.onTorchButtonClicked();}onCameraSwitchButtonClick(){this.presenter.onCameraSwitchButtonClicked();}onZoomButtonClick(){this.presenter.onZoomButtonClicked();}changeZoomButtonIcon(t){this.zoomButton&&(this.zoomButton.zoom=`${t}x`);}connectedCallback(){this.torchSwitchIconButton=TorchSwitchIconButton.create(),this.torchSwitchIconButton.shadow=true,this.torchSwitchIconButton.size=36,this.torchSwitchIconButton.slot=`controls-${this.torchControlPosition}`,this.torchSwitchIconButton.hidden=true,this.torchSwitchIconButton.addEventListener("pointerdown",this.onTorchButtonClickHandler),this.cameraSwitchButton=a$7.create(),this.cameraSwitchButton.slot=`controls-${this.cameraSwitchControlPosition}`,this.cameraSwitchButton.hidden=true,this.cameraSwitchButton.addEventListener("pointerdown",this.onCameraSwitchButtonHandler),this.zoomButton=a$6.create(),this.zoomButton.slot=`controls-${this.zoomControlPosition}`,this.zoomButton.hidden=true,this.zoomButton.addEventListener("pointerdown",this.onZoomButtonHandler),this.layout.append(this.torchSwitchIconButton,this.cameraSwitchButton,this.zoomButton),this.layout.addEventListener("pointerdown",this.onLayoutPointerDownHandler),this.layout.addEventListener("BarcodeArInfoAnnotationEventTap",this.onInfoAnnotationTapHandler),this.backdrop=Backdrop.create(),this.layout.append(this.backdrop),this.pendingDeletionTimeout=new Timeout(1e3,()=>{this.deletePendingViews();}),this.prepend(c.createStyleElement());}disconnectedCallback(){var t,o,e;this.deleteAllViews(),(t=this.torchSwitchIconButton)==null||t.removeEventListener("pointerdown",this.onTorchButtonClickHandler),(o=this.cameraSwitchButton)==null||o.removeEventListener("pointerdown",this.onCameraSwitchButtonHandler),(e=this.zoomButton)==null||e.removeEventListener("pointerdown",this.onZoomButtonHandler),this.layout.removeEventListener("pointerdown",this.onLayoutPointerDownHandler),this.layout.removeEventListener("BarcodeArInfoAnnotationEventTap",this.onInfoAnnotationTapHandler);}isPopoverAnnotation(t){return t instanceof b}isAnnotation(t){var o;return ((o=t.dataset)==null?void 0:o.identifier)==null?false:t.dataset.identifier.endsWith("-annotation")}areMultiplePopoverAllowed(){for(let t of this.layout.querySelectorAll("[data-identifier$='-annotation']"))if(t&&this.isPopoverAnnotation(t)&&t.annotationTrigger==="highlightTapAndBarcodeScan")return true;return false}async onLayoutPointerDown(t){let o=t.target,e=o==null?void 0:o.closest("[data-identifier$='-highlight']"),i=o==null?void 0:o.closest(b.tag);if((e==null?void 0:e.dataset.id)!=null){await this.handleHighlightClick(e);return}if((i==null?void 0:i.dataset.id)!=null){await this.handleAnnotationClick(i);return}await this.handleClickOutside();}async handleHighlightClick(t){var e;this.presenter.emitTappedFeedback(),(e=this.listener)==null||e.didTapHighlightForBarcode(this.presenter.barcodeAr,t.barcode,t);let o=this.queryAnnotationByDataIdentifier(t.dataset.identifier.replace("-highlight",""));!o||o.annotationTrigger==="barcodeScan"||(this.isPopoverAnnotation(o)?await this.handlePopoverHighlightClick(o,t):o.hidden=!o.hidden);}async handlePopoverHighlightClick(t,o){var e;if(!this.areMultiplePopoverAllowed()){let i=this.layout.querySelector(`${b.tag}[data-on-foreground="true"]`),n=(e=i==null?void 0:i.dataset.identifier)==null?void 0:e.replace("-annotation","-highlight"),r=this.layout.querySelector(`[data-identifier="${n}"]`);i!=null&&r!=null&&await this.hideBarcodeArPopover(i,r,false);}await this.toggleBarcodeArPopover(t,o);}async handleAnnotationClick(t){var i;let o=(i=t.dataset.identifier)==null?void 0:i.replace("-annotation","-highlight"),e=this.layout.querySelector(`[data-identifier="${o}"]`);e&&await this.toggleBarcodeArPopover(t,e);}async handleClickOutside(){var i;if(this.areMultiplePopoverAllowed())return;let t=this.layout.querySelector(`${b.tag}[data-on-foreground="true"]`);if(!t)return;let o=(i=t.dataset.identifier)==null?void 0:i.replace("-annotation","-highlight"),e=this.layout.querySelector(`[data-identifier="${o}"]`);e&&await this.hideBarcodeArPopover(t,e);}onInfoAnnotationTap(){this.presenter.emitTappedFeedback();}async showBarcodeArPopover(t,o){t.dataset.onForeground="true",t.hidden=false,o.dataset.onForeground="true",this.backdrop.open=true;}async hideBarcodeArPopover(t,o,e=true){t.dataset.onForeground="false",t.hidden=true,o&&(o.dataset.onForeground="false"),e&&this.hideBackdropIfNoPopovers();}hideBackdropIfNoPopovers(){[...this.layout.querySelectorAll(`${b.tag}`)].every(o=>o.hidden)&&(this.backdrop.open=false);}async toggleBarcodeArPopover(t,o){t.hidden?await this.showBarcodeArPopover(t,o):await this.hideBarcodeArPopover(t,o);}deleteAllViews(){for(let t of this.layout.querySelectorAll("[data-identifier]"))t.remove();}deletePendingViews(){for(let t of this.layout.querySelectorAll("[data-could-be-deleted='true']"))t.remove();this.hideBackdropIfNoPopovers();}identifierForHighlight(t){return `${t}-highlight`}identifierForAnnotation(t){return `${t}-annotation`}async onHighlightsOrAnnotationForTrackedBarcode(t){var o,e,i;await((e=(o=this.highlightProvider)!=null?o:W)==null?void 0:e.highlightForBarcode(t.barcode,async n=>this.onHighlight(t,n))),await((i=this.annotationProvider)==null?void 0:i.annotationForBarcode(t.barcode,async n=>this.onAnnotation(t,n)));}async onAnnotation(t,o){let e=o,i=a$8(t.barcode);this.updateExistingAnnotation(i)||(await this.setupNewAnnotation(e,i,t),this.updateAnnotationPosition(t,e));}updateExistingAnnotation(t){let o=this.queryAnnotationByDataId(t);return o?(o.dataset.couldBeDeleted="false",true):false}async setupNewAnnotation(t,o,e){if(t.dataset.id=o,t.dataset.identifier=this.identifierForAnnotation(e.identifier),t.hidden=true,this.layout.append(t),this.isPopoverAnnotation(t)){if(t.direction=Direction.Vertical,t.anchor==null&&(t.anchor="bottom-center"),this.areMultiplePopoverAllowed()||t.annotationTrigger==="highlightTapAndBarcodeScan"){let i=this.queryHighlightByDataId(o);i&&await this.showBarcodeArPopover(t,i);}}else t.hidden=t.annotationTrigger==="highlightTap";}getAnnotationVariationForQuad(t,o){let e=Math.max(0,Math.min(1,o)),i=t.anchorPositions,n=calculateArea(i),r=this.dataCaptureView.width,l=this.dataCaptureView.height,d=r*l;if(n<=0||d<=0)return 0;let u=n/d;return Math.max(0,Math.min(1,u))<=e?2:1}async onHighlight(t,o){let e=a$8(t.barcode),i=this.queryHighlightByDataId(e);i?i.dataset.couldBeDeleted="false":(o.dataset.id=e,o.dataset.identifier=this.identifierForHighlight(t.identifier),this.updateHighlightPosition(t,o),this.layout.append(o));}queryHighlightByDataIdentifier(t){return this.layout.querySelector(`[data-identifier$="${t}-highlight"]`)}queryAnnotationByDataIdentifier(t){return this.layout.querySelector(`[data-identifier$="${t}-annotation"]`)}queryHighlightByDataId(t){return this.layout.querySelector(`[data-identifier$="-highlight"][data-id="${t}"]`)}queryAnnotationByDataId(t){return this.layout.querySelector(`[data-identifier$="-annotation"][data-id="${t}"]`)}updateRemovedTrackedBarcodes(t){var i,n,r,l,d;let o=this.querySelectorAll("[data-identifier]");if(Object.keys(t.allTrackedBarcodes).length===0){for(let u of o)u.dataset.couldBeDeleted="true";(i=this.pendingDeletionTimeout)!=null&&i.running||(n=this.pendingDeletionTimeout)==null||n.start();return}let e=new Set(t.removedTrackedBarcodes);for(let u of o){let p=(r=u.dataset.identifier)==null?void 0:r.replace("-highlight","").replace("-annotation","");p!=null&&e.has(p)&&(u.dataset.couldBeDeleted="true");}(l=this.pendingDeletionTimeout)!=null&&l.running||(d=this.pendingDeletionTimeout)==null||d.start();}render(t){for(let[o,e]of Object.entries(t.allTrackedBarcodes)){t.addedTrackedBarcodes[o]!=null&&this.onHighlightsOrAnnotationForTrackedBarcode(e);let i=a$8(e.barcode),n=this.queryAnnotationByDataId(i),r=this.queryHighlightByDataId(i);r&&(this.updateBrushSize(r,e),this.updateHighlightPosition(e,r)),n&&this.updateAnnotationPosition(e,n,r);}this.updateRemovedTrackedBarcodes(t);}updateHighlightPosition(t,o,e="center"){if(o.hidden)return;let i=this.dataCaptureView.viewAnchorPositionsForFrameAnchorPositions(t.anchorPositions),n=this.normalizedViewPointFromFrameAnchorPositions(i,e);o.updatePosition(n,new Point(-50,-50),this.calculateRotationAngle(i.topLeft,i.topRight));}updateBrushSize(t,o){if(t.width==null||t.height==null)return;let e=this.dataCaptureView.viewAnchorPositionsForFrameAnchorPositions(o.anchorPositions),i=Math.round(calculateWidth(e)),n=Math.round(calculateHeight(e));t.width!==i&&(t.width=i),t.height!==n&&(t.height=n);}getTransformOrigin(t){return {"top-center":new Point(-50,0),"bottom-center":new Point(-50,-100),"left-center":new Point(0,-50),"right-center":new Point(-100,-50)}[t]}calculateAnnotationPosition(t,o,e){var p,f;let n=t.orderVerticesByPosition(),r=this.normalizedViewPointFromFrameAnchorPositions(t,"center"),d={"bottom-center":()=>{let s=this.normalizedViewPointFromFrameAnchorPositions(n,"topCenter");return new Point(s.x,s.y-7)},"top-center":()=>{let s=this.normalizedViewPointFromFrameAnchorPositions(n,"bottomCenter");return new Point(s.x,s.y+7)},"right-center":()=>{let s=this.normalizedViewPointFromFrameAnchorPositions(n,"centerLeft");return new Point(s.x-7,s.y)},"left-center":()=>{let s=this.normalizedViewPointFromFrameAnchorPositions(n,"centerRight");return new Point(s.x+7,s.y)}}[o]();return e?e instanceof b$1?(p={"bottom-center":new Point(r.x,r.y-7-e.clientHeight/2),"top-center":new Point(r.x,r.y+7+e.clientHeight/2),"right-center":new Point(r.x-7-e.clientWidth/2,r.y),"left-center":new Point(r.x+7+e.clientWidth/2,r.y)}[o])!=null?p:d:(f={"bottom-center":new Point(r.x,r.y-7-e.clientHeight/2),"top-center":new Point(r.x,r.y+7+e.clientHeight/2),"right-center":new Point(r.x-7-e.clientWidth/2,r.y),"left-center":new Point(r.x+7+e.clientWidth/2,r.y)}[o])!=null?f:d:d}updateAnnotationPosition(t,o,e){let i=this.dataCaptureView.viewAnchorPositionsForFrameAnchorPositions(t.anchorPositions);if(o.anchor||(o.anchor="top-center"),o.annotationVariation!=null){let l=this.getAnnotationVariationForQuad(t,a$5.threshold);o.annotationVariation=l;}let n=this.getTransformOrigin(o.anchor),r=this.calculateAnnotationPosition(i,o.anchor,e);o.updatePosition(r,n,this.calculateRotationAngle(i.topLeft,i.topRight));}normalizedViewPointFromFrameAnchorPositions(t,o="center"){let e=this.presenter.currentCamera.getMirrorImageEnabled(),i=new Size(this.dataCaptureView.width,this.dataCaptureView.height);if(e){let r=t[{centerLeft:"centerRight",centerRight:"centerLeft",center:"center",topCenter:"topCenter",bottomCenter:"bottomCenter"}[o]];return Point.mirrorX(r,i)}return t[o]}calculateRotationAngle(t,o){let e=o.x-t.x,n=this.presenter.isCameraMirrored()?-(o.y-t.y):o.y-t.y,r=Math.atan2(n,e);return Math.round(r*(180/Math.PI))}};c.tag="scandit-barcode-ar-view";var k=c;export{k as a};