https://bkvfirmenservice.de/wp-content/themes/bkv-ssr/js/image-slot.min.js?v=1787771987

1(()=>{const M=".image-slots.state.json",R=["image/png","image/jpeg","image/webp","image/avif"],u=new Set;let c={};const f=new Set;let b=!1,m=null;function S(){return m||(m=(typeof window!="undefined"&&window.BKV_SLOT_SIDECAR?fetch(M):Promise.resolve({ok:!1})).then(a=>a.ok?a.json():null).then(a=>{if(a&&typeof a=="object"){const t=Object.assign({},a,c);for(const e in c)t[e]&&!t[e].u&&a[e]&&(t[e].u=typeof a[e]=="string"?a[e]:a[e].u);for(const e of f)delete t[e];c=t}f.clear()}).catch(()=>{}).then(()=>{b=!0,u.forEach(a=>a())}),m)}let y=!1,w=!1;function x(){if(y){w=!0;return}const a=window.omelette&&window.omelette.writeFile;a&&(y=!0,Promise.resolve(a(M,JSON.stringify(c))).catch(()=>{}).then(()=>{y=!1,w&&(w=!1,x())}))}const X=5,A=a=>Math.max(1,Math.min(X,a));function N(a){const t=c[a];return t?typeof t=="string"?{u:t,s:1,x:0,y:0}:t:null}function E(a,t){a&&(t?(c[a]=t,f.delete(a)):(delete c[a],b||f.add(a)),u.forEach(e=>e()),b?x():S().then(x))}async function j(a,t){const e=await createImageBitmap(a);try{const i=Math.min(1200,Math.max(1,Math.round(t*2))||1200),r=Math.min(1,i/Math.max(e.width,e.height)),s=Math.max(1,Math.round(e.width*r)),o=Math.max(1,Math.round(e.height*r)),n=document.createElement("canvas");return n.width=s,n.height=o,n.getContext("2d").drawImage(e,0,0,s,o),n.toDataURL("image/webp",.85)}finally{e.close&&e.close()}}const W=":host{display:inline-block;position:relative;vertical-align:top;  font:13px/1.3 system-ui,-apple-system,sans-serif;color:rgba(0,0,0,.55);width:240px;height:160px}.frame{position:absolute;inset:0;overflow:hidden;background:rgba(0,0,0,.04)}.frame img{position:absolute;max-width:none;transform:translate(-50%,-50%);  -webkit-user-drag:none;user-select:none;touch-action:none}.spill{position:absolute;transform:translate(-50%,-50%);display:none;z-index:1;  cursor:grab;touch-action:none}:host([data-panning]) .spill{cursor:grabbing}.spill .ghost{position:absolute;inset:0;width:100%;height:100%;opacity:.35;  pointer-events:none;-webkit-user-drag:none;user-select:none;  box-shadow:0 0 0 1px rgba(0,0,0,.2),0 12px 32px rgba(0,0,0,.2)}.spill .handle{position:absolute;width:12px;height:12px;border-radius:50%;  background:#fff;box-shadow:0 0 0 1.5px #c96442,0 1px 3px rgba(0,0,0,.3);  transform:translate(-50%,-50%)}.spill .handle[data-c=nw]{left:0;top:0;cursor:nwse-resize}.spill .handle[data-c=ne]{left:100%;top:0;cursor:nesw-resize}.spill .handle[data-c=sw]{left:0;top:100%;cursor:nesw-resize}.spill .handle[data-c=se]{left:100%;top:100%;cursor:nwse-resize}:host([data-reframe]){z-index:10}:host([data-reframe]) .spill{display:block}:host([data-reframe]) .frame{box-shadow:0 0 0 2px #c96442}.empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;  justify-content:center;gap:6px;text-align:center;padding:12px;box-sizing:border-box;  cursor:pointer;user-select:none}.empty svg{opacity:.45}.empty .cap{max-width:90%;font-weight:500;letter-spacing:.01em}.empty .sub{font-size:11px}.empty .sub u{text-underline-offset:2px;text-decoration-color:rgba(0,0,0,.25)}.empty:hover .sub u{color:rgba(0,0,0,.75);text-decoration-color:currentColor}:host([data-over]) .frame{outline:2px solid #c96442;outline-offset:-2px;  background:rgba(201,100,66,.10)}.ring{position:absolute;inset:0;pointer-events:none;border:0;  transition:border-color .12s}:host([data-over]) .ring{border-color:#c96442}:host([data-filled]) .ring{display:none}.ctl{position:absolute;top:100%;left:50%;transform:translateX(-50%);padding-top:8px;  display:flex;gap:6px;opacity:0;pointer-events:none;transition:opacity .12s;z-index:2;  white-space:nowrap}:host([data-filled][data-editable]:hover) .ctl,:host([data-reframe]) .ctl  {opacity:1;pointer-events:auto}.ctl button{appearance:none;border:0;border-radius:6px;padding:5px 10px;cursor:pointer;  background:rgba(0,0,0,.65);color:#fff;font:11px/1 system-ui,-apple-system,sans-serif;  backdrop-filter:blur(6px)}.ctl button:hover{background:rgba(0,0,0,.8)}.err{position:absolute;left:8px;bottom:8px;right:8px;color:#b3261e;font-size:11px;  background:rgba(255,255,255,.85);padding:4px 6px;border-radius:5px;pointer-events:none}",B='<svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><circle cx="8.5" cy="8.5" r="1.5"/>

1<path d="m21 15-5-5L5 21"/></svg>';class g extends HTMLElement{static get observedAttributes(){return["shape","radius","mask","fit","position","placeholder","src","id"]}constructor(){super();const t=this.attachShadow({mode:"open"});t.innerHTML="<style>"+W+'</style><div class="frame" part="frame">  <img part="image" alt="" draggable="false" style="display:none">  <div class="empty" part="empty">'+B+'    <div class="cap"></div>    <div class="sub">or <u>browse files</u></div></div>  <div class="ring" part="ring"></div></div><div class="spill">  <img class="ghost" alt="" draggable="false">  <div class="handle" data-c="nw"></div><div class="handle" data-c="ne"></div>  <div class="handle" data-c="sw"></div><div class="handle" data-c="se"></div></div><div class="ctl"><button data-act="replace" title="Replace image">Replace</button>  <button data-act="clear" title="Remove image">Remove</button></div><input type="file" accept="'+R.join(",")+'" hidden>';var e=function(){var i=this.getAttribute("alt")||this.getAttribute("aria-label")||"",r=t.querySelector('img[part="image"]');r&&r.setAttribute("alt",i)}.bind(this);e(),this._frame=t.querySelector(".frame"),this._ring=t.querySelector(".ring"),this._img=t.querySelector(".frame img"),this._empty=t.querySelector(".empty"),this._cap=t.querySelector(".cap"),this._sub=t.querySelector(".sub"),this._spill=t.querySelector(".spill"),this._ghost=t.querySelector(".ghost"),this._err=null,this._input=t.querySelector("input"),this._depth=0,this._gen=0,this._view={s:1,x:0,y:0},this._subFn=()=>this._render(),this._empty.addEventListener("click",()=>this._input.click()),t.addEventListener("click",i=>{const r=i.target&&i.target.getAttribute&&i.target.getAttribute("data-act");r==="replace"&&(this._exitReframe(!0),this._input.click()),r==="clear"&&(this._exitReframe(!1),this._gen++,this._local=null,this.id?E(this.id,null):this._render())}),this._input.addEventListener("change",()=>{const i=this._input.files&&this._input.files[0];i&&this._ingest(i),this._input.value=""}),this._img.addEventListener("load",()=>this._applyView()),this.addEventListener("dblclick",i=>{!this.hasAttribute("data-editable")||!this._reframes()||(i.preventDefault(),this.hasAttribute("data-reframe")?this._exitReframe(!0):this._enterReframe())}),this._spill.addEventListener("pointerdown",i=>{if(i.button!==0||!this.hasAttribute("data-reframe"))return;i.preventDefault(),i.stopPropagation(),this._spill.setPointerCapture(i.pointerId);const r=this.getBoundingClientRect(),s=r.width||1,o=r.height||1,n=i.target.getAttribute&&i.target.getAttribute("data-c");let l;if(n){const d=this._img.naturalWidth||1,p=this._img.naturalHeight||1,C=Math.max(s/d,o/p),P=n.includes("e")?1:-1,V=n.includes("s")?1:-1,_=this._view.s,k=d*C*_,L=p*C*_,H=(50+this._view.x)/100*s,O=(50+this._view.y)/100*o,D=H-P*k/2,F=O-V*L/2,v=Math.hypot(k,L),T=P*k/v,z=V*L/v;l=U=>{const Y=(U.clientX-r.left-D)*T+(U.clientY-r.top-F)*z,q=A(_*Y/v),I=v*q/_;this._view.s=q,this._view.x=(D+T*I/2)/s*100-50,this._view.y=(F+z*I/2)/o*100-50,this._clampView(),this._applyView()}}else{this.setAttribute("data-panning","");const d={px:i.clientX,py:i.clientY,x:this._view.x,y:this._view.y};l=p=>{this._view.x=d.x+(p.clientX-d.px)/s*100,this._view.y=d.y+(p.clientY-d.py)/o*100,this._clampView(),this._applyView()}}const h=()=>{try{this._spill.releasePointerCapture(i.pointerId)}catch(d){}this._spill.removeEventListener("pointermove",l),this._spill.removeEventListener("pointerup",h),this._spill.removeEventListener("pointercancel",h),this.removeAttribute("data-panning"),this._dragUp=null};this._dragUp=h,this._spill.addEventListener("pointermove",l),this._spill.addEventListener("pointerup",h),this._spill.addEventListener("pointercancel",h)}),this.addEventListener("wheel",i=>{if(!this.hasAttribute("data-reframe"))return;i.preventDefault();const r=this.getBoundingClientRect(),s=(i.clientX-r.left)/r.width*100-50,o=(i.clientY-r.top)/r.height*100-50,n=this._view.s,l=A(n*Math.pow(1.0015,-i.deltaY));if(l===n)return;const h=l/n;this._view.s=l,this._view.x=s*(1-h)+this._view.x*h,this._view.y=o*(1-h)+this._view.y*h,this._clampView(),this._applyView()},{passive:!1})}connectedCallback(){!this.id&&!g._warned&&(g._warned=!0,console.warn("<image-slot> without an id will not persist its dropped image.")),this.addEventListener("dragenter",this),this.addEventListener("dragover",this),this.addEventListener("dragleave",this),this.addEventListener("drop",this),u.add(this._subFn),this._ro=new ResizeObserver(()=>this._render()),this._ro.observe(this),S(),this._render()}disconnectedCallback(){u.delete(this._subFn),this.removeEventListener("dragenter",this),this.removeEventListener("dragover",this),this.removeEventListener("dragleave",this),this.removeEventListener("drop",this),this._ro&&(this._ro.disconnect(),this._ro=null),this._exitReframe(!1)}_enterReframe(){this.hasAttribute("data-reframe")||(this.setAttribute("data-reframe",""),this._applyView(),this._outside=t=>{t.composedPath&&t.composedPath().includes(this)||this._exitReframe(!0)},this._esc=t=>{t.key==="Escape"&&this._exitReframe(!0)},document.addEventListener("pointerdown",this._outside,!0),document.addEventListener("keydown",this._esc,!0))}_exitReframe(t){this.hasAttribute("data-reframe")&&(this._dragUp&&this._dragUp(),this.removeAttribute("data-reframe"),this.removeAttribute("data-panning"),this._outside&&document.removeEventListener("pointerdown",this._outside,!0),this._esc&&document.removeEventListener("keydown",this._esc,!0),this._outside=this._esc=null,t&&this._commitView())}attributeChangedCallback(){this.shadowRoot&&this._render()}handleEvent(t){if(t.type==="dragenter"||t.type==="dragover")t.preventDefault(),t.stopPropagation(),t.dataTransfer&&(t.dataTransfer.dropEffect="copy"),t.type==="dragenter"&&this._depth++,this.setAttribute("data-over","");else if(t.type==="dragleave")--this._depth<=0&&(this._depth=0,this.removeAttribute("data-over"));else if(t.type==="drop"){t.preventDefault(),t.stopPropagation(),this._depth=0,this.removeAttribute("data-over");const e=t.dataTransfer&&t.dataTransfer.files&&t.dataTransfer.files[0];e&&this._ingest(e)}}async _ingest(t){if(this._setError(null),!t||R.indexOf(t.type)<0){this._setError("Drop a PNG, JPEG, WebP, or AVIF image.");return}const e=++this._gen;try{const i=this.clientWidth||this.offsetWidth||1200,r=await j(t,i);if(e!==this._gen)return;this._exitReframe(!1);const s={u:r,s:1,x:0,y:0};E(this.id||"",s),this.id||(this._local=s,this._render())}catch(i){if(e!==this._gen)return;this._setError("Could not read that image."),console.warn("<image-slot> ingest failed:",i)}}_setError(t){if(this._err&&(this._err.remove(),this._err=null),!t)return;const e=document.createElement("div");e.className="err",e.textContent=t,this.shadowRoot.appendChild(e),this._err=e,setTimeout(()=>{this._err===e&&(e.remove(),this._err=null)},3e3)}_reframes(){return this.hasAttribute("data-filled")&&(this.getAttribute("fit")||"cover")==="cover"}

1_geom(){const t=this._img.naturalWidth,e=this._img.naturalHeight,i=this.clientWidth,r=this.clientHeight;return!t||!e||!i||!r?null:{iw:t,ih:e,fw:i,fh:r,base:Math.max(i/t,r/e)}}_clampView(){const t=this._geom();if(!t)return;const e=Math.max(0,(t.iw*t.base*this._view.s/t.fw-1)*50),i=Math.max(0,(t.ih*t.base*this._view.s/t.fh-1)*50);this._view.x=Math.max(-e,Math.min(e,this._view.x)),this._view.y=Math.max(-i,Math.min(i,this._view.y))}_applyView(){const t=this._geom(),e=this.getAttribute("fit")||"cover";if(e!=="cover"||!t){this._img.style.width="100%",this._img.style.height="100%",this._img.style.left="50%",this._img.style.top="50%",this._img.style.objectFit=e,this._img.style.objectPosition=this.getAttribute("position")||"50% 50%";return}const i=t.base*this._view.s,r=t.iw*i/t.fw*100+"%",s=t.ih*i/t.fh*100+"%",o=50+this._view.x+"%",n=50+this._view.y+"%";this._img.style.width=r,this._img.style.height=s,this._img.style.left=o,this._img.style.top=n,this._img.style.objectFit="",this._spill.style.width=r,this._spill.style.height=s,this._spill.style.left=o,this._spill.style.top=n}_commitView(){const t={s:this._view.s,x:this._view.x,y:this._view.y};this._userUrl&&(t.u=this._userUrl),this.id?E(this.id,t):this._local=t}_render(){const t=this.getAttribute("mask"),e=(this.getAttribute("shape")||"rounded").toLowerCase();let i="";if(e==="circle")i="50%";else if(e==="pill")i="9999px";else if(e==="rounded"){const l=parseFloat(this.getAttribute("radius"));i=(Number.isFinite(l)?l:12)+"px"}this._frame.style.borderRadius=t?"":i,this._frame.style.clipPath=t||"",this._ring.style.borderRadius=t?"":i,this._ring.style.display=t?"none":"";const r=!!(window.omelette&&window.omelette.writeFile);this.toggleAttribute("data-editable",r),this._sub.style.display=r?"":"none";let s=this.id?N(this.id):this._local;s&&s.u&&!/^data:image\//i.test(s.u)&&(s=null);const o=this.getAttribute("src")||"";this._userUrl=s&&s.u||null;const n=this._userUrl||o;this.hasAttribute("data-reframe")||(this._view={s:s&&Number.isFinite(s.s)?A(s.s):1,x:s&&Number.isFinite(s.x)?s.x:0,y:s&&Number.isFinite(s.y)?s.y:0}),this._cap.textContent=this.getAttribute("placeholder")||"Drop an image",n?(this._img.getAttribute("src")!==n&&(this._img.src=n,this._ghost.src=n),this._img.style.display="block",this._empty.style.display="none",this.setAttribute("data-filled",""),this._clampView(),this._applyView()):(this._img.style.display="none",this._img.removeAttribute("src"),this._ghost.removeAttribute("src"),this._empty.style.display="flex",this.removeAttribute("data-filled"))}}customElements.get("image-slot")||customElements.define("image-slot",g)})();