@scandit/web-datacapture-barcode/build/js/chunks/chunk-4UNEYE55.js

Scandit Data Capture SDK for the Web

import {a as a$2}from'./chunk-LWUFGA5M.js';import {a as a$1}from'./chunk-RLWDCJ7V.js';import {a as a$5,b as b$2}from'./chunk-OPL5NVVM.js';import {a as a$6,b as b$3}from'./chunk-NZCSU4S2.js';import {b}from'./chunk-LGPC7KMW.js';import {h,g as g$2}from'./chunk-4PYZSS3H.js';import {g as g$1}from'./chunk-DVHTYKDX.js';import {a as a$3}from'./chunk-5Q3AHWJL.js';import {j,i,f,a,g,n}from'./chunk-4JEIREAU.js';import {c,e,a as a$4,b as b$1}from'./chunk-YBD5JYCX.js';import {Point}from'@scandit/web-datacapture-core';import {ScanditHTMLElement,defineCustomElements,safeAwaitAnimation,safeCancelAnimation,html,Timeout}from'@scandit/web-datacapture-core/build/js/private/utils/index.js';var q=(i=>(i.ResizeButton="resizeButton",i.ZoomButton="zoomButton",i.TorchButton="torchButton",i.CloseButton="closeButton",i))(q||{}),D=1200,w=class w extends ScanditHTMLElement{constructor(){super(...arguments);this.resizeButtonTapListener=this.onResizeButtonTap.bind(this);this.zoomButtonTapListener=this.onZoomButtonTap.bind(this);this.torchButtonTapListener=this.onTorchButtonTap.bind(this);this.closeButtonTapListener=this.onCloseButtonTap.bind(this);this.pointerDownListener=this.onPointerDown.bind(this);this.longPressStartListener=this.onLongPressStart.bind(this);this.toolbarVisibilityChangeListener=this.onToolbarVisibilityChange.bind(this);this.longPressEndListener=this.onLongPressEnd.bind(this);this.dragEndListener=this.onDragEnd.bind(this);this.fadeOutAnimation=new Animation(new KeyframeEffect(this,[{opacity:1},{opacity:0}],{duration:500,fill:"both"}));this.replayFadeOutTimeout=null;this.longPressController=new b(this);}get visible(){return this.hasAttribute("visible")}set visible(t){this.toggleAttribute("visible",t),this.dispatchEvent(new CustomEvent(h,{detail:{visible:t}}));}get size(){return this.expanded?"expanded":"regular"}set size(t){var i;this.toggleAttribute("expanded",t==="expanded");let o=this.getNextTranslate();(i=this.dragController)==null||i.translateTo(o,false).then(()=>{var n;return (n=this.dragController)==null?void 0:n.repositionIfOutOfBounds()});}get expanded(){return this.hasAttribute("expanded")}set useViewportBounds(t){this.dragController&&(this.dragController.useViewportBounds=t);}get[a](){var t;return Number((t=this.getAttribute(a))!=null?t:"1")}set[a](t){this.setAttribute(a,String(t));}get darkened(){return this.hasAttribute("darkened")}set darkened(t){this.toggleAttribute("darkened",t);}get orientation(){var t;return (t=this.getAttribute("orientation"))!=null?t:"portrait-primary"}set orientation(t){this.setAttribute("orientation",t);}get[g](){return this.hasAttribute(g)}set[g](t){this.toggleAttribute(g,t);}get[j](){return this.hasAttribute(j)}set[j](t){this.toggleAttribute(j,t);}get[i](){return this.hasAttribute(i)}set[i](t){this.toggleAttribute(i,t);}get[f](){return this.hasAttribute(f)}set[f](t){this.toggleAttribute(f,t);}get[n](){return this.hasAttribute(n)}set[n](t){this.toggleAttribute(n,t);}get cover(){return this.hasAttribute("cover")}set cover(t){this.toggleAttribute("cover",t);}get pressed(){return this.hasAttribute("pressed")}set pressed(t){this.toggleAttribute("pressed",t);}static create(){return defineCustomElements({[b$1]:w,[a$4]:a$3,[e]:a$2,[c]:a$1}),document.createElement(b$1)}repositionIfOutOfBounds(){var t;(t=this.dragController)==null||t.repositionIfOutOfBounds();}showToast(t,o,i){this.toast.show(t,o,i);}hideToast(){this.toast.hide();}zoomIn(){this.zoomButton&&(this[a]=2,this.zoomButton.textContent="2x",this.showToast("warning","2x zoom",1e3));}zoomOut(){this.zoomButton&&(this[a]=1,this.zoomButton.textContent="1x",this.showToast("info","1x zoom",1e3));}async fadeOut(){this.fadeOutAnimation.play(),await safeAwaitAnimation(this.fadeOutAnimation),this.visible=false;}cancelFadeOut(){var t;(t=this.replayFadeOutTimeout)==null||t.stop(),safeCancelAnimation(this.fadeOutAnimation);}async rewindAnimation(){var t,o;(((t=this.replayFadeOutTimeout)==null?void 0:t.running)===true||this.fadeOutAnimation.playState!=="idle")&&(this.cancelFadeOut(),(o=this.replayFadeOutTimeout)==null||o.start());}translateTo(t){var o;(o=this.dragController)==null||o.translateTo(t,false);}render(){var t,o,i$1,n$1,a$1,l,b;this.innerHTML=html`<spark-scan-view-toast></spark-scan-view-toast><div id="host"></div><div id="controls"><div id="button-container-list"><div class="button-container"><button id="torchButton" class="${b$1}__button"><spark-scan-view-icon icon="torchOff" fill="white" size="9"></spark-scan-view-icon></button><button id="closeButton" class="${b$1}__button"><spark-scan-view-icon icon="close" fill="white" size="9"></spark-scan-view-icon></button></div><div class="button-container"><button id="resizeButton" class="${b$1}__button"><spark-scan-view-icon icon="expand" fill="white" size="14"></spark-scan-view-icon></button><button id="zoomButton" class="${b$1}__button">${this[a]}x</button></div></div></div><spark-scan-view-toolbar></spark-scan-view-toolbar><div id="overlay"></div><style>${b$1}{position:absolute;top:0;left:0;display:none;background:var(${g$1});border-radius:16px;filter:drop-shadow(0px 2px 6px #${a$5.toJSON()}) drop-shadow(0px 1px 2px #${b$2.toJSON()});transition:filter .3s ease;z-index:100}${b$1}[unconstrained]{position:fixed;z-index:10000}${b$1},${b$1} #overlay{width:var(--dvw-half);height:var(--dvw-half);min-width:192px;min-height:192px;max-width:min(250px,var(--dvw-half));max-height:min(250px,var(--dvw-half))}@media (orientation:landscape){${b$1},${b$1} #overlay{width:var(--dvh-half);height:var(--dvh-half);max-width:min(250px,var(--dvh-half));max-height:min(250px,var(--dvh-half))}}@media screen (min-width:768px) and (orientation:portrait){${b$1},${b$1} #overlay{max-width:min(375px,var(--dvw-half));max-height:min(375px,var(--dvw-half))}}@media screen (min-width:768px) and (orientation:landscape){${b$1},${b$1} #overlay{max-width:min(375px,var(--dvh-half));max-height:min(375px,var(--dvh-half))}}${b$1}[visible]{display:flex;flex-flow:column}${b$1}[expanded],${b$1}[expanded] #overlay{width:calc(var(--dvw) - ${32}px);height:calc(var(--dvh-half) - ${32}px);max-width:min(400px,calc(var(--dvw) - ${32}px));max-height:min(400px,calc(var(--dvh-half) - ${32}px))}${b$1}[pressed]{filter:drop-shadow(0px 4px 4px #${b$2.toJSON()}) drop-shadow(0px 8px 12px #${a$5.toJSON()})}@media (orientation:landscape){${b$1}[expanded],${b$1}[expanded] #overlay{width:calc(var(--dvh-half) - ${32}px);height:calc(var(--dvh) - ${32}px);max-width:min(400px,calc(var(--dvh-half) - ${32}px));max-height:min(400px,calc(var(--dvh) - ${32}px))}}spark-scan-view-toast{position:absolute;top:16px;left:50%;transform:translateX(-50%);z-index:20}${b$1} #host,${b$1} #host *{width:100%;border-radius:16px}${b$1} #host{height:calc(100% - 48px);z-index:-10}${b$1}[cover] #host{height:100%}${b$1} #controls{position:absolute;top:0;width:100%;height:100%;display:grid;grid-template-rows:auto max-content;box-sizing:border-box}${b$1} #button-container-list{width:100%;height:calc(100% - 48px);display:flex;flex-flow:column;justify-content:space-between}${b$1}[cover] #button-container-list{height:100%}${b$1} .button-container{padding:12px;display:flex;justify-content:flex-end;align-items:center}${b$1}[${f}] .button-container:first-of-type,${b$1}[${j}] .button-container:nth-of-type(2){justify-content:space-between}.${b$1}__button{display:flex;justify-content:center;align-items:center;width:24px;height:24px;border:none;background:rgba(18,22,25,.5);color:#fff;font-family:Arial,Helvetica,sans-serif;font-size:14px;font-weight:500;border-radius:50%}${b$1} #torchButton,${b$1} #closeButton,${b$1} #resizeButton,${b$1} #zoomButton{display:none}${b$1}[${f}] #torchButton,${b$1}[${j}] #resizeButton{display:flex}${b$1}[${n}] #closeButton,${b$1}[${i}] #zoomButton{display:flex;align-self:end}${b$1} #overlay{position:absolute;z-index:10;top:0;left:0;background:#000;border-radius:16px;opacity:0;transition:opacity .3s ease;pointer-events:none}${b$1}[darkened] #overlay{opacity:.3}</style>`,this.toast=this.querySelector("spark-scan-view-toast"),this.host=this.querySelector("#host"),this.resizeButton=this.querySelector("#resizeButton"),(t=this.resizeButton)==null||t.addEventListener("pointerup",this.resizeButtonTapListener),this.resizeButtonIcon=(o=this.resizeButton)==null?void 0:o.querySelector("spark-scan-view-icon"),this.zoomButton=this.querySelector("#zoomButton"),(i$1=this.zoomButton)==null||i$1.addEventListener("pointerup",this.zoomButtonTapListener),this.torchButton=this.querySelector("#torchButton"),(n$1=this.torchButton)==null||n$1.addEventListener("pointerup",this.torchButtonTapListener),this.torchButtonIcon=(a$1=this.torchButton)==null?void 0:a$1.querySelector("spark-scan-view-icon"),this.closeButton=this.querySelector("#closeButton"),(l=this.closeButton)==null||l.addEventListener("pointerup",this.closeButtonTapListener),this.toolbar=this.querySelector(c),(b=this.toolbar)==null||b.addEventListener("toolbarvisibilitychange",this.toolbarVisibilityChangeListener),this.buttonContainerList=this.querySelector("#button-container-list");}onResizeButtonTap(t){t.stopPropagation(),this.size={regular:"expanded",expanded:"regular"}[this.size],this.resizeButtonIcon&&(this.resizeButtonIcon.icon=this.expanded?"shrink":"expand"),this.dispatchEvent(new CustomEvent(g$2,{detail:{tapped:"resizeButton",expanded:this.expanded}}));}onZoomButtonTap(t){switch(t.stopPropagation(),this[a]){case 1:{this.zoomIn();break}case 2:{this.zoomOut();break}}this.dispatchEvent(new CustomEvent(g$2,{detail:{tapped:"zoomButton",zoomFactor:this[a]}}));}onTorchButtonTap(t){t.stopPropagation(),this[g]=!this[g],this.torchButtonIcon&&(this.torchButtonIcon.icon=this[g]?"torchOn":"torchOff"),this.dispatchEvent(new CustomEvent(g$2,{detail:{tapped:"torchButton",enabled:this[g]}}));}onCloseButtonTap(t){t.stopPropagation(),this.dispatchEvent(new CustomEvent(g$2,{detail:{tapped:"closeButton"}}));}onPointerDown(){this.dragController&&(this.dragController.draggable=false),this.rewindAnimation();}onLongPressStart(){this.dragController&&(this.dragController.draggable=true),this.pressed=true;}onLongPressEnd(){this.pressed=false;}onDragEnd(t){t instanceof a$6&&(this.lastKnownTranslate=t.point);}onToolbarVisibilityChange(){this.cover=!this.toolbar||this.toolbar.hidden;}connectedCallback(){var t,o;this.rootElement=(t=this.parentElement)==null?void 0:t.parentElement,this.dragController=new b$3(this,this.rootElement),this.replayFadeOutTimeout=new Timeout(D,async()=>{await this.fadeOut();}),this.render(),this.addEventListener("pointerdown",this.pointerDownListener),this.addEventListener("longpressstart",this.longPressStartListener),this.addEventListener("longpressend",this.longPressEndListener),this.addEventListener("dragend",this.dragEndListener),this.dragController.connect(),this.longPressController.connect(),this.buttonContainerList&&((o=this.toolbar)!=null&&o.firstElementChild)&&(this.longPressController.elementsAllowedToTriggerLongPressEvents.add(this.buttonContainerList),this.longPressController.elementsAllowedToTriggerLongPressEvents.add(this.toolbar.firstElementChild)),this.dragController.margin=new Point(16,16);}disconnectedCallback(){var t,o,i,n,a,l,b;(t=this.resizeButton)==null||t.removeEventListener("pointerup",this.resizeButtonTapListener),(o=this.zoomButton)==null||o.removeEventListener("pointerup",this.zoomButtonTapListener),(i=this.torchButton)==null||i.removeEventListener("pointerup",this.torchButtonTapListener),(n=this.closeButton)==null||n.removeEventListener("pointerup",this.closeButtonTapListener),(a=this.toolbar)==null||a.removeEventListener("toolbarvisibilitychange",this.toolbarVisibilityChangeListener),this.removeEventListener("pointerdown",this.pointerDownListener),this.removeEventListener("longpressstart",this.longPressStartListener),this.removeEventListener("longpressend",this.longPressEndListener),this.removeEventListener("dragend",this.dragEndListener),safeCancelAnimation(this.fadeOutAnimation),(l=this.replayFadeOutTimeout)==null||l.stop(),(b=this.dragController)==null||b.disconnect(),this.longPressController.disconnect();}getNextTranslate(){var n,a,l;let t=((n=this.rootElement)==null?void 0:n.clientWidth)||document.body.clientWidth,o=((a=this.rootElement)==null?void 0:a.clientHeight)||document.body.clientHeight;if(!this.dragController)return new Point(0,0);if(this.size==="regular")return (l=this.lastKnownTranslate)!=null?l:this.dragController.translate;this.lastKnownTranslate=this.dragController.translate;let i=this.dragController.translate;return (this.orientation==="portrait-primary"||this.orientation==="portrait-secondary")&&this.dragController.translate.x>16&&(i=new Point(16,i.y)),(this.orientation==="landscape-primary"||this.orientation==="landscape-secondary")&&this.dragController.translate.x>t-this.clientWidth-16&&(i=new Point(t-this.clientWidth-16,i.y)),this.dragController.translate.y>o-this.clientHeight-16&&(i=new Point(i.x,o-this.clientHeight-16)),i}};w.observedAttributes=[j,i,f];var O=w;export{q as a,O as b};