UNPKG

scandit-web-datacapture-barcode

Version:

Scandit Data Capture SDK for the Web

25 lines (22 loc) 11 kB
import { b } from './chunk-RXBMWTD7.js'; import { a as a$7 } from './chunk-E5SBML3G.js'; import { a as a$2 } from './chunk-GFKB3KIK.js'; import { a as a$6 } from './chunk-6OEQNNOX.js'; import { b as b$1 } from './chunk-3QBWYNKZ.js'; import { a } from './chunk-D63TUKHR.js'; import { a as a$1 } from './chunk-SXQSY4LD.js'; import { a as a$5 } from './chunk-GDJIQ3LO.js'; import { a as a$3 } from './chunk-ENRQUC2S.js'; import { a as a$4 } from './chunk-POONUNDO.js'; import { b as b$2 } from './chunk-JHKM35ES.js'; import { b as b$3 } from './chunk-TRWFJYCT.js'; import { ScanditHTMLElement, Anchor, Localization, html, DataCaptureView, defineCustomElements, Size, Point } from 'scandit-web-datacapture-core'; import { ShutterButton } from 'scandit-web-datacapture-core/build/js/private/ui/atoms/ShutterButton.js'; var d={FinishButton:a$2.tag,ShutterButton:ShutterButton.tag,ProgressBarWithLabel:a.tag,CardListContainer:b$1.tag,TorchIconButton:a$1.tag};function E(P){return P instanceof DataCaptureView}var c=class c extends ScanditHTMLElement{constructor(){super(...arguments);this.shouldShowCarousel=!0;this.shouldShowPauseButton=!0;this.shouldShowFinishButton=!0;this.shouldShowProgressBar=!0;this.shouldShowTorchControl=!1;this.torchControlPosition=Anchor.TopLeft;this.textForItemListUpdatedWhenPausedHint=null;this.textForItemListUpdatedHint=null;this.textForTapShutterToResumeSearchHint=null;this.textForTapShutterToPauseScreenHint=null;this.textForMoveCloserToBarcodesHint=null;this.textForPointAtBarcodesToSearchHint=null;this.textForAllItemsFoundSuccessfullyHint=null;this.textForCollapseCardsButton=Localization.getInstance().get("barcode.find.view.textForCollapseCardsButton");this.barcodeFindViewUiListener=null;this.shutterButton=null;this.finishButton=null;this.progressBar=null;this.cardList=null;this.onShutterButtonClickedHandler=this.onShutterButtonClicked.bind(this);this.onFinishButtonClickedHandler=this.onFinishButtonClicked.bind(this);this.onTorchButtonClickedHandler=this.onTorchButtonClicked.bind(this);this.torchIconButton=null;this.onDotClickHandler=this.onDotClick.bind(this);}get camera(){return this.presenter.context.frameSource}static async createWithSettings(t,o,i,s,r){let e=document.createElement(c.tag);return e.barcodeFindViewSettings=s,e.layout=b.create(),e.layout.innerHTML=html` <${a.tag} slot="progress" value="0" max="1" ${e.shouldShowProgressBar?"":"hidden"}></${a.tag}> <${a$1.tag} slot="top-controls-left" ${e.shouldShowTorchControl?"":"hidden"}></${a$1.tag}> <${b$1.tag} slot="card-list" hidden text-for-collapse-cards-button=${e.textForCollapseCardsButton}></${b$1.tag}> <${ShutterButton.tag} slot="bottom-controls-center" variant="play" ${e.shouldShowPauseButton?"":"hidden"}></${ShutterButton.tag}> <${a$2.tag} slot="bottom-controls-right" ${e.shouldShowFinishButton?"":"hidden"}></${a$2.tag}> `,e.append(e.layout),E(t)?(e.dataCaptureView=t,t.htmlElement.prepend(e),await o.addMode(i),await t.setContext(o)):(e.dataCaptureView=await DataCaptureView.forContext(o),e.dataCaptureView.connectToElement(t),t.prepend(e)),e.presenter=new b$2(e,o,i,s,r!=null?r:a$3.recommendedCameraSettings),await e.presenter.prepare(),e.barcodeFindBasicOverlay=await a$4.withBarcodeFind(i,e.dataCaptureView),e}static async create(t,o,i){return c.createWithSettings(t,o,i,b$3.BarcodeFind.BarcodeFindViewSettings.settings,a$3.recommendedCameraSettings)}static register(){defineCustomElements({[c.tag]:c});}async startSearching(){return this.onShutterButtonClickedHandler()}async stopSearching(){return this.presenter.stopSearching()}async pauseSearching(){return this.onShutterButtonClickedHandler()}setListener(t){this.barcodeFindViewUiListener=t,this.presenter.barcodeFindViewUiListener=this.barcodeFindViewUiListener;}async setShouldShowUserGuidanceView(t){return this.shouldShowUserGuidance=t,this.barcodeFindBasicOverlay.setUserGuidanceEnabled(this.shouldShowUserGuidance)}async setShouldShowHints(t){return this.shouldShowHints=t,this.barcodeFindBasicOverlay.setShouldShowHint(this.shouldShowHints)}setShouldShowCarousel(t){this.shouldShowCarousel=t,this.layout.toggleVisibility(d.CardListContainer,t);}setShouldShowPauseButton(t){this.shouldShowPauseButton=t,this.layout.toggleVisibility(d.ShutterButton,t);}setShouldShowFinishButton(t){this.shouldShowFinishButton=t,this.layout.toggleVisibility(d.FinishButton,t);}setShouldShowProgressBar(t){this.shouldShowProgressBar=t,this.layout.toggleVisibility(d.ProgressBarWithLabel,t);}setShouldShowTorchControl(t){this.shouldShowTorchControl=this.presenter.isTorchAvailable?t:!1,this.layout.toggleVisibility(d.TorchIconButton,this.shouldShowTorchControl);}setTorchControlPosition(t){var i;this.torchControlPosition=t,[Anchor.TopCenter,Anchor.TopLeft,Anchor.TopRight,Anchor.BottomLeft].includes(t)||(this.torchControlPosition=Anchor.TopLeft);let o={[Anchor.TopCenter]:"top-controls-center",[Anchor.TopLeft]:"top-controls-left",[Anchor.TopRight]:"top-controls-right",[Anchor.BottomLeft]:"bottom-controls-left"}[this.torchControlPosition];(i=this.torchIconButton)==null||i.setAttribute("slot",o);}setTextForCollapseCardsButton(t){this.textForCollapseCardsButton=t,this.cardList!=null&&(this.cardList["text-for-collapse-cards-button"]=t);}async setTextForAllItemsFoundSuccessfullyHint(t){return this.textForAllItemsFoundSuccessfullyHint=t,this.barcodeFindBasicOverlay.setTextForAllItemsFoundSuccessfullyHint(this.textForAllItemsFoundSuccessfullyHint)}async setTextForPointAtBarcodesToSearchHint(t){return this.textForPointAtBarcodesToSearchHint=t,this.barcodeFindBasicOverlay.setTextForPointAtBarcodesToSearchHint(this.textForPointAtBarcodesToSearchHint)}async setTextForMoveCloserToBarcodesHint(t){return this.textForMoveCloserToBarcodesHint=t,this.barcodeFindBasicOverlay.setTextForPointAtBarcodesToSearchHint(this.textForMoveCloserToBarcodesHint)}async setTextForTapShutterToPauseScreenHint(t){return this.textForTapShutterToPauseScreenHint=t,this.barcodeFindBasicOverlay.setTextForPointAtBarcodesToSearchHint(this.textForTapShutterToPauseScreenHint)}async setTextForTapShutterToResumeSearchHint(t){return this.textForTapShutterToResumeSearchHint=t,this.barcodeFindBasicOverlay.setTextForTapShutterToResumeScreenHint(this.textForTapShutterToResumeSearchHint)}async setTextForItemListUpdatedWhenPausedHint(t){return this.textForItemListUpdatedWhenPausedHint=t,this.barcodeFindBasicOverlay.setTextForItemListUpdatedWhenPausedHint(this.textForItemListUpdatedWhenPausedHint)}async setTextForItemListUpdatedHint(t){return this.textForItemListUpdatedHint=t,this.barcodeFindBasicOverlay.setTextForItemListUpdatedWhenPausedHint(this.textForItemListUpdatedHint)}connectedCallback(){var t,o,i;this.shutterButton=this.layout.querySelector(d.ShutterButton),this.finishButton=this.layout.querySelector(d.FinishButton),this.progressBar=this.layout.querySelector(d.ProgressBarWithLabel),this.cardList=this.layout.querySelector(d.CardListContainer),this.torchIconButton=this.layout.querySelector(d.TorchIconButton),(t=this.torchIconButton)==null||t.addEventListener("pointerdown",this.onTorchButtonClickedHandler),(o=this.shutterButton)==null||o.addEventListener("pointerdown",this.onShutterButtonClickedHandler),(i=this.finishButton)==null||i.addEventListener("pointerdown",this.onFinishButtonClickedHandler),this.layout.addEventListener("onlayouttap",this.onDotClickHandler);}disconnectedCallback(){var t,o,i;(t=this.shutterButton)==null||t.removeEventListener("pointerdown",this.onShutterButtonClickedHandler),(o=this.torchIconButton)==null||o.addEventListener("pointerdown",this.onTorchButtonClickedHandler),(i=this.finishButton)==null||i.removeEventListener("pointerdown",this.onFinishButtonClickedHandler),this.layout.removeEventListener("onlayouttap",this.onDotClickHandler),this.presenter.dispose();}async onShutterButtonClicked(){this.presenter.onShutterButtonClicked();}async onTorchButtonClicked(){this.presenter.onTorchButtonClicked();}updateProgressBar(t,o){this.progressBar&&(this.progressBar.value!==t&&(this.progressBar.value=t),o!=null&&this.progressBar.max!==o&&(this.progressBar.max=o));}setShutterButtonPulse(t){this.shutterButton!=null&&(this.shutterButton.pulse=t);}switchToPaused(t,o){var s,r;let i=[];for(let e of t){let l=a$5.create();if(l.id=`${String(e.uid)}`,l.title=e.searchOptions.barcodeData,o.some(n=>n.searchOptions.barcodeData===e.searchOptions.barcodeData)){let n=a$6.create();n.slot="right",l.append(n);}i.push(l);}(s=this.cardList)==null||s.renderCards(i),(r=this.cardList)==null||r.removeAttribute("hidden"),this.shutterButton.variant="play",this.shutterButton.pulse=!1,this.toggleDotPulse(!1);}moveCardOnTheFront(t){var i,s;if(!t)return;let o=(i=this.cardList)==null?void 0:i.getCardBySelector(`${a$5.tag}#${t.uid}`);o!=null&&((s=this.cardList)==null||s.unshiftCard(o));}switchToStarted(){var t;this.clearDots(),(t=this.cardList)==null||t.setAttribute("hidden",""),this.shutterButton.variant="pause";}toggleTorchIcon(t){this.torchIconButton&&(this.torchIconButton.state=t);}onFinishButtonClicked(){this.presenter.onFinishButtonClicked();}clearDots(){let t=this.layout.querySelectorAll("[data-identifier]");for(let o of t)o.remove();}toggleDotPulse(t){let o=[...this.layout.querySelectorAll("[data-identifier]")];for(let i of o)i.pulse=t;}pointTransformation(t){return `translate3d(calc(${t.x}px - 50%), calc(${t.y}px - 50%), 0px)`}onDotClick(t){let o=t.detail.target;if(o.dataset.identifier!=null){for(let i of this.layout.querySelectorAll(a$7.tag))i.pulse=!1,o===i&&o.variant==="target"&&(o.pulse=!0);this.presenter.onDotClick(o.dataset.identifier);}}renderDots(t){var o,i,s;for(let r of t.removedTrackedBarcodes){let e=this.layout.querySelector(`[data-identifier="${r}"]`);e==null||e.remove();}if(t.addedTrackedBarcodes.length>0){let r=document.createDocumentFragment();for(let e of t.addedTrackedBarcodes){let l=this.dataCaptureView.viewAnchorPositionsForFrameAnchorPositions(e.anchorPositions),n=a$7.createWithColors(this.barcodeFindViewSettings.inListItemColor,this.barcodeFindViewSettings.notInListItemColor);n.style.setProperty("position","absolute"),n.style.setProperty("transform",this.pointTransformation(l.center)),n.dataset.identifier=`${e.identifier}`,e.barcode.data!=null&&((o=t.foundTrackedBarcodesInLastProcessedFrame[`${e.identifier}`])==null?void 0:o.barcode.data)===e.barcode.data&&(n.setAttribute("variant","target"),n.pulse=!0),r.append(n);}this.layout.append(r);}for(let r of t.updatedTrackedBarcodes){let e=this.layout.querySelector(`[data-identifier="${r.identifier}"]`),{center:l}=this.dataCaptureView.viewAnchorPositionsForFrameAnchorPositions(r.anchorPositions);if(e){let n=(s=(i=this.camera)==null?void 0:i.getMirrorImageEnabled())!=null?s:!1,L=new Size(this.dataCaptureView.width,this.dataCaptureView.height);e.style.setProperty("position","absolute");let H=n?Point.mirrorX(l,L):l;e.style.setProperty("transform",this.pointTransformation(H));}}}};c.tag="scandit-barcode-find-view";var S=c;S.register(); export { S as a };