UNPKG

@scandit/web-datacapture-barcode

Version:

Scandit Data Capture SDK for the Web

2 lines 6.49 kB
import {a as a$1,b as b$3}from'./chunk-OPL5NVVM.js';import {b as b$1}from'./chunk-NZCSU4S2.js';import {b}from'./chunk-LGPC7KMW.js';import {a as a$2}from'./chunk-T2Y2C76P.js';import {e,f as f$1,a,b as b$2,d,c as c$1}from'./chunk-DVHTYKDX.js';import {f}from'./chunk-YBD5JYCX.js';import {Point}from'@scandit/web-datacapture-core';import {ScanditHTMLElement,defineCustomElements,safeCancelAnimation,html}from'@scandit/web-datacapture-core/build/js/private/utils/index.js';var c=class b$4 extends ScanditHTMLElement{constructor(){super(...arguments);this._pointerDownListener=this.onPointerDown.bind(this);this._pointerUpListener=this.onPointerUp.bind(this);this._longPressController=new b(this);this._longPressStartListener=this.onLongPressStart.bind(this);}get minimized(){return !this.hasAttribute("expanded")}set minimized(t){this.toggleAttribute("minimized",!t);}get expanded(){return this.hasAttribute("expanded")}set expanded(t){this.toggleAttribute("expanded",t),this._dragController&&(this._dragController.margin=t?new Point(-65,-65):new Point(0,0),this._dragController.repositionIfOutOfBounds());}get pressed(){return this.hasAttribute("pressed")}set pressed(t){this.toggleAttribute("pressed",t);}get visible(){return this.hasAttribute("visible")}set visible(t){this.toggleAttribute("visible",t);}set useViewportBounds(t){this._dragController&&(this._dragController.useViewportBounds=t);}static create(){return defineCustomElements({[f]:b$4}),document.createElement(f)}connectedCallback(){var t;this.render(),this._dragController=new b$1(this,(t=this.parentElement)==null?void 0:t.parentElement),this._dragController.connect(),this.addEventListener("pointerdown",this._pointerDownListener),this.addEventListener("pointerup",this._pointerUpListener),this.addEventListener("longpressstart",this._longPressStartListener),this._longPressController.connect(),this._longPressController.elementsAllowedToTriggerLongPressEvents.add(this),this._pulse=this.querySelector(".pulse"),this._pulseAnimation=new Animation(new KeyframeEffect(this._pulse,[{background:"rgba(0, 0, 0, 0)"},{background:`var(${e})`,transform:"translate(-50%, -50%) scale(1.1)"},{background:"rgba(0, 0, 0, 0)"}],{duration:1100,easing:"ease-out",iterations:Number.POSITIVE_INFINITY}));}disconnectedCallback(){var t;this.removeEventListener("pointerdown",this._pointerDownListener),this.removeEventListener("pointerup",this._pointerUpListener),this.removeEventListener("longpressstart",this._longPressStartListener),(t=this._dragController)==null||t.disconnect(),this._longPressController.disconnect(),this.innerHTML="";}repositionIfOutOfBounds(){var t;(t=this._dragController)==null||t.repositionIfOutOfBounds();}translateTo(t){var i;(i=this._dragController)==null||i.translateTo(t,false);}setImage(t){var n;let i=this.querySelector("div");(n=i.firstElementChild)==null||n.remove(),t&&i.append(t);}startPulsating(){var t;(t=this._pulseAnimation)==null||t.play();}stopPulsating(){this._pulseAnimation&&(safeCancelAnimation(this._pulseAnimation),this._pulseAnimation.currentTime=0);}render(){this.innerHTML=html`<div><div class="pulse"></div><svg width="49" height="26" viewBox="0 0 49 26" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="7.57422" y="-0.00390625" width="3.20017" height="25.7171" rx="0.5" fill="white" style="fill:var(${f$1})"/><path d="M44.8418 0.496094C44.8418 0.219952 45.0657 -0.00390625 45.3418 -0.00390625H48.001C48.2771 -0.00390625 48.501 0.219951 48.501 0.496094V25.2132C48.501 25.4894 48.2771 25.7132 48.001 25.7132H45.3418C45.0657 25.7132 44.8418 25.4894 44.8418 25.2132V0.496094Z" fill="white" style="fill:var(${f$1})"/><path d="M33.8271 0.896094C33.8271 0.399038 34.2301 -0.00390625 34.7271 -0.00390625H39.1368C39.6338 -0.00390625 40.0368 0.399038 40.0368 0.896094V24.8132C40.0368 25.3103 39.6338 25.7132 39.1368 25.7132H34.7271C34.2301 25.7132 33.8271 25.3103 33.8271 24.8132V0.896094Z" fill="white" style="fill:var(${f$1})"/><path d="M16.3154 0.746095C16.3154 0.331881 16.6512 -0.00390625 17.0654 -0.00390625H20.1879C20.6021 -0.00390625 20.9379 0.33188 20.9379 0.746094V24.9632C20.9379 25.3774 20.6021 25.7132 20.1879 25.7132H17.0654C16.6512 25.7132 16.3154 25.3774 16.3154 24.9632V0.746095Z" fill="white" style="fill:var(${f$1})"/><path d="M0.5 0.246094C0.5 0.108023 0.611929 -0.00390625 0.75 -0.00390625H2.2897C2.42777 -0.00390625 2.5397 0.108023 2.5397 0.246094V25.4632C2.5397 25.6013 2.42777 25.7132 2.2897 25.7132H0.75C0.611929 25.7132 0.5 25.6013 0.5 25.4632V0.246094Z" fill="white" style="fill:var(${f$1})"/><rect x="25.9688" y="-0.00390625" width="3.05794" height="25.7171" rx="0.5" fill="white" style="fill:var(${f$1})"/></svg></div><style>${f}{position:absolute;top:0;left:0;width:90px;height:90px;display:none;background:rgba(0,0,0,0);border-radius:50%;z-index:10}${f}[unconstrained]{position:fixed;z-index:9999}${f}[expanded]{width:220px;height:220px;margin-top:-65px;margin-left:-65px}${f}[visible]{display:flex;justify-content:center;align-items:center}${f} div{position:relative;width:90px;height:90px;background:var(${a});border-radius:50%;filter:drop-shadow(0px 2px 6px #${a$1.toJSON()}) drop-shadow(0px 1px 2px #${b$3.toJSON()});transition:filter .3s ease}${f} div .pulse{position:absolute;top:50%;left:50%;width:100%;height:100%;background:0 0;opacity:.3;pointer-events:none;transform:translate(-50%,-50%);z-index:-1}${f}[pressed] div{background:var(${b$2});filter:drop-shadow(0px 4px 4px #${a$1.toJSON()}) drop-shadow(0px 8px 12px #${b$3.toJSON()})}${f}[pressed][expanded] div{background:var(${d})}${f}[expanded] div{width:200px;height:200px;background:var(${c$1})}${f} div img,${f} div svg{position:absolute;top:50%;left:50%;width:100%;height:auto;max-width:48px;max-height:48px;transform:translate(-50%,-50%)}${f}[expanded] div img,${f}[expanded] div svg{max-width:64px;max-height:64px}</style>`;}onPointerDown(t){t instanceof PointerEvent&&(this._dragController&&(this._dragController.draggable=this.minimized),this._holdStart=Date.now(),this.setPointerCapture(t.pointerId));}onPointerUp(t){var i;if(t instanceof PointerEvent){let n=this._holdStart!=null&&Date.now()-this._holdStart<400,f=!((i=this._dragController)!=null&&i.pointerDownEvent)||!a$2(this._dragController.pointerDownEvent,t);n&&f&&this.dispatchEvent(new CustomEvent("tap")),this.pressed=false,this._holdStart=void 0,this.releasePointerCapture(t.pointerId);}}onLongPressStart(){this._dragController&&(this._dragController.draggable=true),this.pressed=true,this._holdStart=void 0;}}; export{c as a};