yamlover 0.3.22 → 0.3.24

package/dist/client/assets/imagemap-b1Kpzcjf.js

@@ -0,0 +1 @@
+import{j as g,b as H,u as W,a as q,r as a,D as z,f as K,e as V,c as X,i as Y,k as _}from"./index-DGta_4EZ.js";import{L as d,w as Q,O as ee}from"./openable-BA6YbLif.js";const y=t=>Number(t)||0,B=t=>t.replace(/[&<>"]/g,o=>({"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;"})[o]);function te(t){return t.map(o=>{const s=Y({name:o.label,color:o.color});return _(o.path)?`<span class="tagswatch" style="--tag:${s}" title="${B(o.label)}"></span>`:`<span class="tagtag" style="--tag:${s}">${B(o.label)}</span>`}).join("")}function ne(t,o,s,n,c){if(!t||n<=0||c<=0)return;const r=document.createElement("canvas");r.width=n,r.height=c;const p=r.getContext("2d");if(p){p.drawImage(t,o,s,n,c,0,0,n,c);try{return r.toDataURL("image/png")}catch{return}}}function oe(t,o){const s=new Map;for(const n of t){if(n.selector?.type!=="rect")continue;const c=JSON.stringify(n.selector);let r=s.get(c);r||(r={x:y(n.selector.x),y:y(n.selector.y),w:y(n.selector.w),h:y(n.selector.h),title:n.description,color:X(n),ann:V(n)?n:void 0,id:n.fragmentSlug?K(o,n.fragmentSlug):void 0,tags:[]},s.set(c,r)),n.tag&&r.tags.push({path:n.tag.path,label:n.tag.name,color:n.tag.color})}return[...s.values()]}function re({src:t,className:o,regions:s,onSelectRegion:n,onRegionClick:c,selectColor:r}){const p=a.useRef(null),w=a.useRef(null),f=a.useRef(null),b=a.useRef(null),v=a.useRef({w:1,h:1}),j=a.useRef(n),C=a.useRef(c),N=a.useRef(r),[O,k]=a.useState(null),[I,P]=a.useState(0),T=JSON.stringify(s??[]),L=!!n;a.useEffect(()=>{j.current=n,C.current=c,N.current=r}),a.useEffect(()=>{let l=!1,h=null;k(null);const e=new Image;return e.onload=()=>{if(l||!p.current)return;const m=e.naturalWidth||1,R=e.naturalHeight||1;v.current={w:m,h:R},b.current=e;const i=d.map(p.current,{crs:d.CRS.Simple,minZoom:-8,attributionControl:!1,zoomSnap:0}),x=[[0,0],[R,m]];d.imageOverlay(t,x).addTo(i),i.fitBounds(x),f.current=d.layerGroup().addTo(i),w.current=i,h=Q(i,{color:()=>N.current?.()??z,onSelect:L?(u,E)=>{const{h:F}=v.current,M=u.getWest(),G=u.getEast(),J=u.getSouth(),A=u.getNorth(),D=Math.round(M),U=Math.round(F-A),Z=Math.round(G-M),$=Math.round(A-J);j.current?.({type:"rect",x:D,y:U,w:Z,h:$},E,ne(b.current,D,U,Z,$))}:void 0}),P(u=>u+1)},e.onerror=()=>{l||k("could not load image")},e.src=t,()=>{l=!0,h?.(),w.current?.remove(),w.current=null,f.current=null}},[t]);const S=a.useRef(new Map);return a.useEffect(()=>{const l=f.current;if(!l)return;l.clearLayers(),S.current.clear();const{h}=v.current;for(const e of s??[]){const m=e.color||z,R=[[h-e.y,e.x],[h-(e.y+e.h),e.x+e.w]],i=d.rectangle(R,{className:"yo-region",color:m,weight:3,fillColor:m,fillOpacity:.25});if(e.title&&i.bindTooltip(e.title),e.ann){const x=e.ann,u=E=>{d.DomEvent.stop(E),C.current?.(x,{x:E.originalEvent.clientX,y:E.originalEvent.clientY})};i.on("click",u),i.on("contextmenu",u)}if(i.addTo(l),e.tags&&e.tags.length){const x=d.latLng(h-(e.y+e.h),e.x),u=d.divIcon({className:"yo-region-tags",html:te(e.tags),iconAnchor:[0,0]});d.marker(x,{icon:u,interactive:!1,keyboard:!1}).addTo(l)}e.id&&S.current.set(e.id,{rect:i,bounds:R})}},[T,I]),a.useEffect(()=>{const l=()=>{const h=w.current,e=decodeURIComponent(window.location.hash.slice(1)),m=e?S.current.get(e):void 0;!h||!m||(h.fitBounds(m.bounds,{maxZoom:h.getZoom(),padding:[40,40]}),m.rect.setStyle({weight:6,fillOpacity:.45}),window.setTimeout(()=>m.rect.setStyle({weight:3,fillOpacity:.25}),1e3))};return l(),window.addEventListener("hashchange",l),()=>window.removeEventListener("hashchange",l)},[T,I]),g.jsxs(g.Fragment,{children:[O&&g.jsxs("div",{className:"error",children:["image: ",O]}),g.jsx("div",{ref:p,className:o+(L?" yo-selectable":"")})]})}function le({node:t}){const o=W(t.path),{openCreate:s,openEdit:n,palette:c,preview:r,color:p}=q(o,t.path),w=oe(o.annotations,t.path);if(r?.selector.type==="rect"){const f=r.selector;w.push({x:y(f.x),y:y(f.y),w:y(f.w),h:y(f.h),color:r.color})}return g.jsxs("div",{className:"text",children:[t.title&&g.jsx("h1",{className:"chapter-title",children:t.title}),t.description&&g.jsx("p",{className:"chapter-subtitle",children:t.description}),g.jsx(re,{src:H(t.path),regions:w,onSelectRegion:(f,b,v)=>s(f,b,void 0,v),onRegionClick:n,selectColor:()=>p,className:"filemap fileimagemap"}),c]})}function se({src:t,path:o,onNavigate:s}){return g.jsx(ee,{path:o,onNavigate:s,title:"Open image on its own page",children:g.jsx("img",{className:"chunk-image",src:t,alt:"",loading:"lazy"})})}function ie({chunk:t,onNavigate:o}){return g.jsx(se,{src:H(t.path),path:t.path,onNavigate:o})}export{ie as ImageChunk,le as ImageView,re as PanZoomImage,se as StaticImageChunk};