@phin-tech/dottie 0.5.2 → 0.5.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/compile.js +1 -1
- package/dist/dottie-compile.mjs +2 -2
- package/dist/dottie-player.js +2 -2
- package/dist/dottie-player.min.js +2 -2
- package/dist/dottie.js +2 -2
- package/dist/types/index.d.ts +1 -1
- package/package.json +1 -1
package/dist/compile.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/*! dottie.js 0.5.
|
|
1
|
+
/*! dottie.js 0.5.4 | Apache-2.0 | https://github.com/phin-tech/dottie */
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
3
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
4
4
|
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
package/dist/dottie-compile.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
#!/usr/bin/env node
|
|
2
|
-
/*! dottie.js 0.5.
|
|
2
|
+
/*! dottie.js 0.5.4 | Apache-2.0 | https://github.com/phin-tech/dottie */
|
|
3
3
|
var __defProp = Object.defineProperty;
|
|
4
4
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
5
5
|
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
@@ -491,7 +491,7 @@ function compile(source2, runtime, options2 = {}) {
|
|
|
491
491
|
}
|
|
492
492
|
|
|
493
493
|
// src/index.ts
|
|
494
|
-
var VERSION = "0.5.
|
|
494
|
+
var VERSION = "0.5.4";
|
|
495
495
|
|
|
496
496
|
// src/cli.ts
|
|
497
497
|
var usage = `dottie-compile ${VERSION}: a Dottie drawing as one script that plays it on any page.
|
package/dist/dottie-player.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/*! dottie.js 0.5.
|
|
1
|
+
/*! dottie.js 0.5.4 | Apache-2.0 | https://github.com/phin-tech/dottie */
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
3
|
var __defNormalProp = (obj, key, value2) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value: value2 }) : obj[key] = value2;
|
|
4
4
|
var __export = (target, all) => {
|
|
@@ -3611,7 +3611,7 @@ function render(source, options = {}) {
|
|
|
3611
3611
|
function isFile(v) {
|
|
3612
3612
|
return typeof v === "object" && v !== null && Array.isArray(v.pages) && Array.isArray(v.warnings);
|
|
3613
3613
|
}
|
|
3614
|
-
var VERSION = "0.5.
|
|
3614
|
+
var VERSION = "0.5.4";
|
|
3615
3615
|
|
|
3616
3616
|
// src/player-entry.ts
|
|
3617
3617
|
definePlayer();
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/*! dottie.js 0.5.
|
|
1
|
+
/*! dottie.js 0.5.4 | Apache-2.0 | https://github.com/phin-tech/dottie */
|
|
2
2
|
"use strict";(()=>{var nn=Object.defineProperty;var xi=(t,e,n)=>e in t?nn(t,e,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[e]=n;var ki=(t,e)=>{for(var n in e)nn(t,n,{get:e[n],enumerable:!0})};var P=(t,e,n)=>xi(t,typeof e!="symbol"?e+"":e,n);var tn={};ki(tn,{BOIL_DRAWINGS:()=>ke,DottieFormatError:()=>Q,DottiePlayer:()=>Rt,KINDS:()=>on,KNOWN_FIELDS:()=>sn,MAX_DURATION:()=>gt,MAX_MARCH:()=>be,Playback:()=>Yt,SUPPORTED_VERSION:()=>Or,VERSION:()=>Lr,allowedURL:()=>Ht,black:()=>ut,bounds:()=>tt,cameraView:()=>Mt,clampFPS:()=>xt,clampMarch:()=>ln,clampTime:()=>C,clear:()=>an,cloneElement:()=>V,definePlayer:()=>fe,elementIndex:()=>Mi,frameTimes:()=>ee,inkOnDark:()=>cn,inspect:()=>bi,inspectFrame:()=>Ze,inspectPage:()=>Je,isAutomaticInk:()=>we,luminance:()=>kt,orderedElements:()=>ht,pageIndex:()=>Bt,parseDottie:()=>St,plan:()=>At,posterTime:()=>at,render:()=>Ir,repeatIsValid:()=>jt,resolved:()=>U,sameColor:()=>bt,sampleTimes:()=>Qe,sceneAt:()=>Yn,stableSortBy:()=>Nt,still:()=>zn,svg:()=>de,svgParts:()=>ct,themeNamed:()=>pt,themes:()=>Ke,transientElements:()=>Bn,withRoughness:()=>Gt});var Or=2,on=["rectangle","ellipse","diamond","text","connector","freehand","path","note","image","symbol"],wi=["linear","easeIn","easeOut","easeInOut","hold","spring","bounce","elastic"],sn={file:["version","pages","images"],page:["id","name","layers","elements","theme","guidesX","guidesY","guidesLocked","timeline","symbols"],symbol:["id","name","width","height","layers","elements","timeline","button","params"],layer:["id","name","visible","locked"],rgba:["r","g","b","a"],style:["stroke","fill","fillStyle","strokeWidth","dash","roughness","bowing","fontSize","gridSize","opacity","dashOffset"],element:["id","kind","x","y","width","height","style","seed","layerID","text","connector","groupID","points","path","subpaths","evenOdd","rotation","link","anchor","click","hover","symbol","playback","offset","args","image","reveal"],strokePoint:["x","y"],subpath:["closed","coords"],inlineImage:["data","format"],endpoint:["elementID","port","x","y"],connector:["start","end","routing","startHead","endHead"],timeline:["fps","duration","boil","settle","poster","tracks","camera","markers"],track:["element","keys","boil","follow","repeats","march"],keyframe:["t","x","y","width","height","rotation","strokeWidth","stroke","fill","visible","reveal","opacity","ease"],follow:["path","start","end","ease","reverse","orient","laps"],repeat:["start","end","count"],cameraKey:["t","x","y","width","height","ease"],marker:["t","name"],click:["scene","url"],hover:["stroke","fill","opacity"]},gt=3600,be=1e4,ln=t=>t===void 0||!Number.isFinite(t)||t===0?null:Math.min(Math.max(t,-be),be),ke=3,ut={r:.12,g:.12,b:.13,a:1},an={r:0,g:0,b:0,a:0},cn={r:.93,g:.93,b:.94,a:1},Q=class extends Error{},S=t=>typeof t=="object"&&t!==null&&!Array.isArray(t),v=t=>typeof t=="number"&&Number.isFinite(t)?t:void 0,$=t=>typeof t=="string"?t:void 0,rn=t=>S(t)&&Object.values(t).every(e=>typeof e=="string")?{...t}:null,z=t=>typeof t=="boolean"?t:void 0,Y=t=>typeof t=="string"?t.toUpperCase():void 0;function C(t){return Number.isFinite(t)?Math.min(Math.max(t,0),gt):t===1/0?gt:0}function xt(t){return Number.isFinite(t)?Math.min(Math.max(t,1),60):12}function Ht(t){let e=t.trim();return!/^(https?:\/\/|mailto:)/i.test(e)||[...e].length<=7||/[\u0000-\u001f\u007f-\u009f]/.test(e)?null:e}function yt(t){if(!S(t))return;let e=v(t.r),n=v(t.g),i=v(t.b);if(!(e===void 0||n===void 0||i===void 0))return{r:e,g:n,b:i,a:v(t.a)??1}}var xe=class{constructor(){P(this,"warnings",[]);P(this,"seen",new Set)}warn(e){this.seen.has(e)||(this.seen.add(e),this.warnings.push(e))}fields(e,n){let i=sn[n];for(let r of Object.keys(e))i.includes(r)||this.warn(`Unknown field "${r}" on ${n}, ignored`)}style(e){let n=S(e)?e:{};this.fields(n,"style");let i=$(n.fillStyle)??"solid",r=$(n.dash)??"solid";return["solid","hachure","crossHatch","grid"].includes(i)||this.warn(`Unknown fill style "${i}", drawn solid`),["solid","dashed","dotted"].includes(r)||this.warn(`Unknown dash "${r}", drawn solid`),{stroke:yt(n.stroke)??{...ut},fill:yt(n.fill)??{...an},fillStyle:["solid","hachure","crossHatch","grid"].includes(i)?i:"solid",strokeWidth:v(n.strokeWidth)??2,dash:["solid","dashed","dotted"].includes(r)?r:"solid",roughness:v(n.roughness)??1,bowing:v(n.bowing)??1,fontSize:v(n.fontSize)??18,gridSize:v(n.gridSize)??null,opacity:v(n.opacity)??null,dashOffset:v(n.dashOffset)??null}}endpoint(e){let n=S(e)?e:{},i=$(n.port);return{elementID:Y(n.elementID)??null,port:i&&["top","right","bottom","left"].includes(i)?i:null,x:v(n.x)??0,y:v(n.y)??0}}connector(e){if(!S(e))return null;this.fields(e,"connector");let n=(r,o)=>{let s=$(r);return s&&["none","arrow","triangle","dot","bar"].includes(s)?s:o},i=$(e.routing);return{start:this.endpoint(e.start),end:this.endpoint(e.end),routing:i&&["straight","curved","elbow"].includes(i)?i:"straight",startHead:n(e.startHead,"none"),endHead:n(e.endHead,"arrow")}}image(e,n){if(!S(e))return null;let i=$(e.ref);if(i!==void 0)return n[i]??{data:"",format:"png"};let r=$(e.data);return r===void 0?null:this.picture(r,$(e.format))}picture(e,n){return Pi.test(e)?{data:e.replace(/\s+/g,""),format:n==="jpeg"?"jpeg":"png"}:(this.warn("Skipped a picture whose data isn't base64"),{data:"",format:"png"})}element(e,n){if(!S(e))return null;this.fields(e,"element");let i=Y(e.id),r=$(e.kind),o=Y(e.layerID);if(!i||!r||!o)return this.warn("Skipped an element without an id, kind or layer"),null;on.includes(r)||this.warn(`Unknown element kind "${r}", drawn as a placeholder`);let s=Array.isArray(e.subpaths)?e.subpaths.filter(S).map(l=>({closed:z(l.closed)??!1,coords:Array.isArray(l.coords)?l.coords.filter(a=>typeof a=="number"):[]})):null;return{id:i,kind:r,layerID:o,x:v(e.x)??0,y:v(e.y)??0,width:v(e.width)??0,height:v(e.height)??0,style:this.style(e.style),seed:(v(e.seed)??1)>>>0,text:$(e.text)??null,connector:this.connector(e.connector),groupID:Y(e.groupID)??null,points:Array.isArray(e.points)?e.points.filter(S).map(l=>({x:v(l.x)??0,y:v(l.y)??0})):null,path:Array.isArray(e.path)?e.path.filter(l=>typeof l=="number"):null,subpaths:s,evenOdd:z(e.evenOdd)??null,rotation:v(e.rotation)??null,link:Y(e.link)??null,anchor:$(e.anchor)??null,click:this.click(e.click),hover:this.hover(e.hover),symbol:Y(e.symbol)??null,playback:this.playback(e.playback),offset:v(e.offset)??null,args:rn(e.args),image:this.image(e.image,n),reveal:v(e.reveal)??null}}click(e){if(!S(e))return null;this.fields(e,"click");let n=$(e.url),i=n===void 0?null:Ht(n);return n!==void 0&&i===null&&this.warn("Skipped a click link that isn't http, https or mailto"),{scene:$(e.scene)??null,url:i}}playback(e){let n=$(e);return n===void 0?null:["loop","once","still","click"].includes(n)?n:"loop"}symbol(e,n){if(!S(e))return null;this.fields(e,"symbol");let i=Y(e.id);if(!i)return this.warn("Skipped a symbol without an id"),null;let r=s=>{let l=v(s);return Math.max(1,l??100)},o=(Array.isArray(e.layers)?e.layers:[]).filter(S).flatMap(s=>{let l=Y(s.id);return l?[{id:l,name:$(s.name)??"",visible:z(s.visible)??!0,locked:z(s.locked)??!1}]:[]});return o.length===0&&o.push({id:`${i}-LAYER`,name:"Layer 1",visible:!0,locked:!1}),{id:i,name:$(e.name)??"Symbol",width:r(e.width),height:r(e.height),layers:o,elements:(Array.isArray(e.elements)?e.elements:[]).map(s=>this.element(s,n)).filter(s=>s!==null),timeline:this.timeline(e.timeline),button:z(e.button)??null,params:rn(e.params)}}hover(e){return S(e)?(this.fields(e,"hover"),{stroke:yt(e.stroke)??null,fill:yt(e.fill)??null,opacity:v(e.opacity)??null}):null}ease(e){let n=$(e);return n===void 0?null:wi.includes(n)?n:(this.warn(`Unknown ease "${n}", played linear`),null)}keyframe(e){if(!S(e))return null;this.fields(e,"keyframe");let n=v(e.t);if(n===void 0)return null;let i={t:n};for(let a of["x","y","width","height","rotation","strokeWidth","reveal","opacity"]){let u=v(e[a]);u!==void 0&&(i[a]=u)}let r=yt(e.stroke),o=yt(e.fill),s=z(e.visible),l=this.ease(e.ease);return r&&(i.stroke=r),o&&(i.fill=o),s!==void 0&&(i.visible=s),l&&(i.ease=l),i}track(e){if(!S(e))return null;this.fields(e,"track");let n=Y(e.element);if(!n)return null;let i=(Array.isArray(e.keys)?e.keys:[]).map(s=>this.keyframe(s)).filter(s=>s!==null&&s.t>=0&&s.t<=gt);Nt(i,s=>s.t);let r=Array.isArray(e.follow)?e.follow.filter(S).flatMap(s=>{let l=Y(s.path),a=v(s.start),u=v(s.end);return!l||a===void 0||u===void 0||a<0||u>gt?[]:[{path:l,start:a,end:u,ease:this.ease(s.ease),reverse:z(s.reverse)??null,orient:z(s.orient)??null,laps:v(s.laps)??null}]}):null,o=Array.isArray(e.repeats)?e.repeats.filter(S).flatMap(s=>{let l=v(s.start),a=v(s.end);if(l===void 0||a===void 0)return[];let u=v(s.count),c={start:l,end:a,count:u===void 0?null:Math.trunc(u)};return jt(c)?[c]:[]}):null;return{element:n,keys:i,boil:z(e.boil)??null,follow:r,repeats:o,march:ln(v(e.march))}}timeline(e){if(!S(e))return null;this.fields(e,"timeline");let n=v(e.boil),i=Array.isArray(e.camera)?e.camera.filter(S).flatMap(s=>{let l=v(s.t),a=v(s.x),u=v(s.y),c=v(s.width),h=v(s.height);return l===void 0||a===void 0||u===void 0||c===void 0||h===void 0?[]:c>1&&h>1&&l>=0?[{t:l,x:a,y:u,width:c,height:h,ease:this.ease(s.ease)}]:[]}):null;i&&Nt(i,s=>s.t);let r=Array.isArray(e.markers)?e.markers.filter(S).flatMap(s=>{let l=v(s.t);return l!==void 0&&l>=0?[{t:l,name:$(s.name)??""}]:[]}):null;r&&Nt(r,s=>s.t);let o=v(e.poster);return{fps:xt(v(e.fps)??12),duration:C(v(e.duration)??0),boil:n!==void 0&&Number.isInteger(n)&&n>0?Math.min(n,1e4):null,settle:z(e.settle)??null,poster:o===void 0?null:C(o),tracks:(Array.isArray(e.tracks)?e.tracks:[]).map(s=>this.track(s)).filter(s=>s!==null),camera:i,markers:r}}page(e,n,i){if(!S(e))throw new Q(`Page ${i} is not an object`);this.fields(e,"page");let r=(Array.isArray(e.layers)?e.layers:[]).filter(S).flatMap(o=>{let s=Y(o.id);return s?[{id:s,name:$(o.name)??"",visible:z(o.visible)??!0,locked:z(o.locked)??!1}]:[]});return r.length===0&&(this.warn(`Page ${i} has no layers`),r.push({id:"LAYER",name:"Layer 1",visible:!0,locked:!1})),{id:Y(e.id)??`PAGE-${i}`,name:$(e.name)??`Page ${i}`,layers:r,elements:(Array.isArray(e.elements)?e.elements:[]).map(o=>this.element(o,n)).filter(o=>o!==null),theme:$(e.theme)??null,timeline:this.timeline(e.timeline),symbols:Array.isArray(e.symbols)?e.symbols.map(o=>this.symbol(o,n)).filter(o=>o!==null):null}}},Pi=/^[A-Za-z0-9+/=\s]*$/;function jt(t){return Number.isFinite(t.start)&&Number.isFinite(t.end)&&t.start>=0&&t.end-t.start>.001&&t.end<=gt&&(t.count===null||t.count>=1&&t.count<=1e4)}function Nt(t,e){let n=t.map((i,r)=>[i,r]);n.sort((i,r)=>e(i[0])-e(r[0])||i[1]-r[1]);for(let i=0;i<t.length;i++)t[i]=n[i][0]}function St(t){let e=t;if(typeof t=="string")try{e=JSON.parse(t)}catch(s){throw new Q(`Not JSON: ${s.message}`)}if(!S(e))throw new Q("Not a Dottie drawing");let n=v(e.version);if(n===void 0)throw new Q("Not a Dottie drawing (no version)");if(!Array.isArray(e.pages)||e.pages.length===0)throw new Q("A drawing needs at least one page");let i=new xe;i.fields(e,"file"),n>2&&i.warn(`File version ${n} is newer than this player knows (2); some things may not show`);let r={};if(S(e.images))for(let[s,l]of Object.entries(e.images))S(l)&&typeof l.data=="string"&&(r[s]=i.picture(l.data,$(l.format)));let o=e.pages.map((s,l)=>i.page(s,r,l+1));if(new Set(o.map(s=>s.id)).size!==o.length)throw new Q("Two pages share an id");return{version:n,pages:o,warnings:i.warnings}}function kt(t){return .2126*t.r+.7152*t.g+.0722*t.b}function bt(t,e){return t.r===e.r&&t.g===e.g&&t.b===e.b&&t.a===e.a}function we(t){return bt(t,ut)||bt(t,cn)}function V(t){return{...t,style:{...t.style,stroke:{...t.style.stroke},fill:{...t.style.fill}},connector:t.connector?{...t.connector,start:{...t.connector.start},end:{...t.connector.end}}:null}}function ht(t){if(t.layers.length<=1)return t.elements;let e=new Map;t.layers.forEach((i,r)=>{e.has(i.id)||e.set(i.id,r)});let n=t.layers.map(()=>[]);for(let i of t.elements)n[e.get(i.layerID)??0].push(i);return n.flat()}function Mi(t){let e=new Map;for(let n of t.elements)e.has(n.id)||e.set(n.id,n);return e}var un=.5522847498307936,E=class t{constructor(){P(this,"segments",[])}get isEmpty(){return this.segments.length===0}moveTo(e){return this.segments.push({op:"M",p:e}),this}lineTo(e){return this.segments.push({op:"L",p:e}),this}quadTo(e,n){return this.segments.push({op:"Q",c:n,p:e}),this}curveTo(e,n,i){return this.segments.push({op:"C",c1:n,c2:i,p:e}),this}close(){return this.segments.push({op:"Z"}),this}addPath(e){return this.segments.push(...e.segments),this}addLines(e){return e.forEach((n,i)=>i===0?this.moveTo(n):this.lineTo(n)),this}static rect(e){return new t().addLines([{x:e.x,y:e.y},{x:e.x+e.width,y:e.y},{x:e.x+e.width,y:e.y+e.height},{x:e.x,y:e.y+e.height}]).close()}addEllipse(e){let n=e.x+e.width/2,i=e.y+e.height/2,r=e.width/2,o=e.height/2,s=r*un,l=o*un;return this.moveTo({x:n+r,y:i}),this.curveTo({x:n,y:i+o},{x:n+r,y:i+l},{x:n+s,y:i+o}),this.curveTo({x:n-r,y:i},{x:n-s,y:i+o},{x:n-r,y:i+l}),this.curveTo({x:n,y:i-o},{x:n-r,y:i-l},{x:n-s,y:i-o}),this.curveTo({x:n+r,y:i},{x:n+s,y:i-o},{x:n+r,y:i-l}),this.close()}static ellipse(e){return new t().addEllipse(e)}translated(e,n){let i=o=>({x:o.x+e,y:o.y+n}),r=new t;return r.segments=this.segments.map(o=>{switch(o.op){case"M":case"L":return{op:o.op,p:i(o.p)};case"Q":return{op:"Q",c:i(o.c),p:i(o.p)};case"C":return{op:"C",c1:i(o.c1),c2:i(o.c2),p:i(o.p)};case"Z":return o}}),r}contours(){let e=[],n=[],i={x:0,y:0};for(let r of this.segments){let o=n.length?n[n.length-1]:i;switch(r.op){case"M":n.length>1&&e.push(n),i=r.p,n=[r.p];break;case"L":n.push(r.p);break;case"Q":for(let s=1;s<=12;s++){let l=s/12,a=1-l;n.push({x:a*a*o.x+2*a*l*r.c.x+l*l*r.p.x,y:a*a*o.y+2*a*l*r.c.y+l*l*r.p.y})}break;case"C":for(let s=1;s<=16;s++){let l=s/16,a=1-l;n.push({x:a*a*a*o.x+3*a*a*l*r.c1.x+3*a*l*l*r.c2.x+l*l*l*r.p.x,y:a*a*a*o.y+3*a*a*l*r.c1.y+3*a*l*l*r.c2.y+l*l*l*r.p.y})}break;case"Z":n.push(i),n.length>1&&e.push(n),n=[i];break}}return n.length>1&&e.push(n),e}trimmed(e){let n=this.contours().map(o=>new wt(o)),i=Math.min(Math.max(e,0),1)*n.reduce((o,s)=>o+s.length,0),r=new t;for(let o of n){if(!(i>0))break;r.moveTo(o.points[0]);for(let s=1;s<o.points.length;s++){let l=o.lengths[s]-o.lengths[s-1];if(l<=i){r.lineTo(o.points[s]),i-=l;continue}let a=o.points[s-1],u=o.points[s],c=i/l;r.lineTo({x:a.x+(u.x-a.x)*c,y:a.y+(u.y-a.y)*c}),i=0;break}}return r}data(){let e=[];for(let n of this.segments)switch(n.op){case"M":e.push(`M${x(n.p.x)} ${x(n.p.y)}`);break;case"L":e.push(`L${x(n.p.x)} ${x(n.p.y)}`);break;case"Q":e.push(`Q${x(n.c.x)} ${x(n.c.y)} ${x(n.p.x)} ${x(n.p.y)}`);break;case"C":e.push(`C${x(n.c1.x)} ${x(n.c1.y)} ${x(n.c2.x)} ${x(n.c2.y)} ${x(n.p.x)} ${x(n.p.y)}`);break;case"Z":e.push("Z");break}return e.join(" ")}};function It(t){return t<0?-Math.round(-t):Math.round(t)}function x(t){let e=It(t*100)/100;return Number.isInteger(e)?String(e===0?0:e):String(e)}var wt=class{constructor(e){P(this,"points");P(this,"lengths");this.points=e;let n=0;this.lengths=e.map((i,r)=>(r>0&&(n+=Math.hypot(i.x-e[r-1].x,i.y-e[r-1].y)),n))}get length(){return this.lengths.length?this.lengths[this.lengths.length-1]:0}point(e){if(this.points.length<=1||!(this.length>0))return this.points[0]??{x:0,y:0};let n=Math.min(Math.max(e,0),1)*this.length,i=1;for(;i<this.lengths.length-1&&this.lengths[i]<n;)i++;let r=this.lengths[i]-this.lengths[i-1],o=r>0?(n-this.lengths[i-1])/r:0,s=this.points[i-1],l=this.points[i];return{x:s.x+(l.x-s.x)*o,y:s.y+(l.y-s.y)*o}}},N=t=>t.x+t.width/2,H=t=>t.y+t.height/2,G=t=>t.x+t.width,F=t=>t.y+t.height;function Pe(t,e){if(!t)return{...e};let n=Math.min(t.x,e.x),i=Math.min(t.y,e.y);return{x:n,y:i,width:Math.max(G(t),G(e))-n,height:Math.max(F(t),F(e))-i}}function Pt(t,e,n){return{x:t.x+e,y:t.y+n,width:t.width-2*e,height:t.height-2*n}}function nt(t,e,n){if(n===0)return t;let i=t.x-e.x,r=t.y-e.y;return{x:e.x+i*Math.cos(n)-r*Math.sin(n),y:e.y+i*Math.sin(n)+r*Math.cos(n)}}function vi(t,e){let n=1-e;return{x:t[0].x*(n*n*n)+t[1].x*(3*e*n*n)+t[2].x*(3*e*e*n)+t[3].x*(e*e*e),y:t[0].y*(n*n*n)+t[1].y*(3*e*n*n)+t[2].y*(3*e*e*n)+t[3].y*(e*e*e)}}function hn(t,e){let n=[t[0]];for(let i=0;i<Math.floor((t.length-1)/3);i++){let r=t.slice(3*i,3*i+4),o=0;for(let l=1;l<r.length;l++)o+=Math.hypot(r[l].x-r[l-1].x,r[l].y-r[l-1].y);let s=Math.min(400,Math.max(4,Math.ceil(o/Math.max(e,.5))));for(let l=1;l<=s;l++)n.push(vi(r,l/s))}return n}var L=t=>({x:t.x,y:t.y,width:t.width,height:t.height}),W=t=>t.rotation??0,$t=t=>({x:t.x+t.width/2,y:t.y+t.height/2}),it=(t,e)=>nt(e,$t(t),W(t)),mn=(t,e)=>nt(e,$t(t),-W(t));function dn(t){let e=L(t);if(W(t)===0)return e;let n=[{x:e.x,y:e.y},{x:G(e),y:e.y},{x:G(e),y:F(e)},{x:e.x,y:F(e)}].map(l=>it(t,l)),i=n.map(l=>l.x),r=n.map(l=>l.y),o=Math.min(...i),s=Math.min(...r);return{x:o,y:s,width:Math.max(...i)-o,height:Math.max(...r)-s}}function fn(t,e){if(!we(t.style.stroke))return t;let n=V(t),r=(t.style.fillStyle==="solid"||t.style.fillStyle==="grid")&&t.style.fill.a>=.5&&kt(t.style.fill)>.5;return n.style.stroke=kt(e)>.5&&r?{...ut}:{...e},n}function _t(t){if(t.kind!=="path"||!t.subpaths)return[];let e=[];for(let n of t.subpaths){if(n.coords.length<8||(n.coords.length-2)%6!==0)continue;let i=[];for(let r=0;r<n.coords.length;r+=2)i.push({x:t.x+n.coords[r]*t.width,y:t.y+n.coords[r+1]*t.height});e.push({closed:n.closed,points:i})}return e}function Me(t){let e=new E;for(let n of _t(t)){e.moveTo(n.points[0]);for(let i=0;i<(n.points.length-1)/3;i++)e.curveTo(n.points[3*i+3],n.points[3*i+1],n.points[3*i+2]);n.closed&&e.close()}return e}function Ai(t,e){let n=L(t),i=e==="top"?{x:N(n),y:n.y}:e==="right"?{x:G(n),y:H(n)}:e==="bottom"?{x:N(n),y:F(n)}:{x:n.x,y:H(n)};return it(t,i)}function Ri(t,e){let n=L(t),i=$t(t),r=mn(t,e),o=r.x-i.x,s=r.y-i.y;if(!((o!==0||s!==0)&&n.width>0&&n.height>0))return i;let l=n.width/2,a=n.height/2,u;return t.kind==="ellipse"?u=1/Math.sqrt(o*o/(l*l)+s*s/(a*a)):t.kind==="diamond"?u=1/(Math.abs(o)/l+Math.abs(s)/a):u=Math.min(o!==0?l/Math.abs(o):1/0,s!==0?a/Math.abs(s):1/0),it(t,{x:i.x+o*u,y:i.y+s*u})}function pn(t,e){let n=t.elementID?e.get(t.elementID):void 0;return n?$t(n):{x:t.x,y:t.y}}function yn(t,e,n){let i=t.elementID?n.get(t.elementID):void 0;return i?t.port?Ai(i,t.port):Ri(i,e):{x:t.x,y:t.y}}function Z(t,e){let n=t.connector;return n?[yn(n.start,pn(n.end,e),e),yn(n.end,pn(n.start,e),e)]:[{x:0,y:0},{x:0,y:0}]}function rt(t){if(t.kind==="polyline")return t.points;let e=[];for(let n=0;n<=24;n++){let i=n/24,r=1-i;e.push({x:r*r*r*t.a.x+3*r*r*i*t.b.x+3*r*i*i*t.c.x+i*i*i*t.d.x,y:r*r*r*t.a.y+3*r*r*i*t.b.y+3*r*i*i*t.c.y+i*i*i*t.d.y})}return e}function ot(t,e){let n=t.connector;if(!n)return{kind:"polyline",points:[]};let[i,r]=Z(t,e),o=r.x-i.x,s=r.y-i.y,l=Math.abs(o)>=Math.abs(s);switch(n.routing){case"straight":return{kind:"polyline",points:[i,r]};case"curved":return l?{kind:"cubic",a:i,b:{x:i.x+o/2,y:i.y},c:{x:r.x-o/2,y:r.y},d:r}:{kind:"cubic",a:i,b:{x:i.x,y:i.y+s/2},c:{x:r.x,y:r.y-s/2},d:r};case"elbow":{let a=h=>h===null?null:h==="top"||h==="bottom",u=a(n.start.port)??!l,c=a(n.end.port)??!l;if(u&&c){let h=i.y+s/2;return{kind:"polyline",points:[i,{x:i.x,y:h},{x:r.x,y:h},r]}}if(!u&&!c){let h=i.x+o/2;return{kind:"polyline",points:[i,{x:h,y:i.y},{x:h,y:r.y},r]}}return u?{kind:"polyline",points:[i,{x:i.x,y:r.y},r]}:{kind:"polyline",points:[i,{x:r.x,y:i.y},r]}}}}function gn(t,e,n){let i=Math.atan2(t.y-e.y,t.x-e.x),r=Math.PI/7,o=s=>({x:t.x-n*Math.cos(i+s),y:t.y-n*Math.sin(i+s)});return[o(r),o(-r)]}function bn(t,e){let n=rt(ot(t,e));if(n.length===0)return{x:0,y:0,width:0,height:0};let i=n[0].x,r=n[0].y,o=i,s=r;for(let l of n)i=Math.min(i,l.x),r=Math.min(r,l.y),o=Math.max(o,l.x),s=Math.max(s,l.y);return{x:i,y:r,width:o-i,height:s-r}}function xn(t,e){let n=rt(ot(t,e));if(n.length<=1)return n[0]??{x:0,y:0};let i=[],r=0;for(let s=0;s<n.length-1;s++){let l=Math.hypot(n[s+1].x-n[s].x,n[s+1].y-n[s].y);i.push(l),r+=l}let o=r/2;for(let s=0;s<i.length;s++){let l=i[s];if(o<=l||s===i.length-1){let a=l===0?0:o/l;return{x:n[s].x+(n[s+1].x-n[s].x)*a,y:n[s].y+(n[s+1].y-n[s].y)*a}}o-=l}return n[0]}function q(t){let e=new Map;for(let n of t.elements)e.has(n.id)||e.set(n.id,n);return e}function Ae(t,e,n){let i=t[1]+n>>>0,r=i<t[1]?1:0;return[t[0]+e+r>>>0,i]}function Ti(t,e){let n=t&65535,i=t>>>16,r=e&65535,o=e>>>16,s=n*r,l=n*o,a=i*r,u=i*o,c=l+a,h=s+c%65536*65536;return[u+Math.floor(c/65536)+Math.floor(h/4294967296)>>>0,h>>>0]}function Re(t,e,n){let i=Ti(t[1],n);return[i[0]+Math.imul(t[0],n)+Math.imul(t[1],e)>>>0,i[1]]}function ve(t,e){let n=(t[1]>>>e|t[0]<<32-e)>>>0;return[(t[0]^t[0]>>>e)>>>0,(t[1]^n)>>>0]}function kn(t){return t=Re(ve(t,30),3210233709,484763065),t=Re(ve(t,27),2496678331,321982955),ve(t,31)}var st=class{constructor(e){P(this,"state");this.state=Ae([0,e>>>0],2654435769,2135587861)}next(){return this.state=Ae(this.state,2654435769,2135587861),kn(this.state)}top53(){let[e,n]=this.next();return e*2097152+(n>>>11)}signed(){return Math.floor(this.top53())/2**52-1}unit(){return this.top53()/2**53}};function qt(t,e){let n=Ae([0,t>>>0],...Ei(e));return n=kn(n),Math.max(1,n[1]>>>0)}function Ei(t){let e=Re([0,t>>>0],2654435769,2135587861);return[e[0],e[1]]}var wn=(t,e,n)=>t.signed()*e*n;function J(t,e,n,i,r,o,s){let l=Math.hypot(e.x-t.x,e.y-t.y);if(!(l>.5))return;let a=l<200?1:l>500?.4:-.0016668*l+1.233334,u=l<20?l/10:2;for(let c=0;c<2;c++){let h=(c===0?1:.5)*a,f=()=>wn(n,u,i)*h,d=n.unit()*.4+.3,m=wn(n,l/60,i)*r*a,p=e.x-t.x,b=e.y-t.y,M=-b/l,w=p/l,y=o?t:{x:t.x+f(),y:t.y+f()},R=o?e:{x:e.x+f(),y:e.y+f()},A=t.x+p*d*.66+M*m+f()*.5,k=t.y+b*d*.66+w*m+f()*.5,g=t.x+p*(.5+d*.5)+M*m+f()*.5,T=t.y+b*(.5+d*.5)+w*m+f()*.5;s.moveTo(y),s.curveTo(R,{x:A,y:k},{x:g,y:T})}}function Te(t,e,n,i){let r=new E;for(let o=0;o<t.length;o++)J(t[o],t[(o+1)%t.length],e,n,i,!1,r);return r}function Pn(t,e,n){let i=new E,r=t.x+t.width/2,o=t.y+t.height/2,s=t.width/2,l=t.height/2;if(!(s>.5&&l>.5))return i;let a=Math.max(8,Math.min(24,Math.trunc((s+l)/6))),u=Math.min(2.5,(s+l)/25)*n;for(let c=0;c<2;c++){let h=e.unit()*2*Math.PI,f=2*Math.PI*(c===0?1:1.04),d=Math.trunc(a*f/(2*Math.PI))+1,m=[];for(let p=0;p<d;p++){let b=h+f*p/a,M=e.signed()*u,w=e.signed()*u;m.push({x:r+s*Math.cos(b)+M,y:o+l*Math.sin(b)+w})}Si(m,i)}return i}function Si(t,e){if(!(t.length<=2)){e.moveTo(t[0]);for(let n=0;n<t.length-1;n++){let i=t[Math.max(n-1,0)],r=t[n],o=t[n+1],s=t[Math.min(n+2,t.length-1)];e.curveTo(o,{x:r.x+(o.x-i.x)/6,y:r.y+(o.y-i.y)/6},{x:o.x-(s.x-r.x)/6,y:o.y-(s.y-r.y)/6})}}}var Ee=-41*Math.PI/180;function Mn(t,e,n){if(!(n>0))return[];let i=Math.cos(e),r=Math.sin(e),o=t.filter(f=>f.length>=3).map(f=>f.map(d=>({x:d.x*i+d.y*r,y:-d.x*r+d.y*i}))),s=o.flat();if(s.length===0)return[];let l=1/0,a=-1/0;for(let f of s)l=Math.min(l,f.y),a=Math.max(a,f.y);let u=(f,d)=>({x:f*i-d*r,y:f*r+d*i}),c=[],h=l+n/2;for(;h<a;){let f=[];for(let d of o)for(let m=0;m<d.length;m++){let p=d[m],b=d[(m+1)%d.length];(p.y<=h&&h<b.y||b.y<=h&&h<p.y)&&f.push(p.x+(h-p.y)/(b.y-p.y)*(b.x-p.x))}f.sort((d,m)=>d-m);for(let d=0;d+1<f.length;d+=2)f[d+1]-f[d]>.5&&c.push([u(f[d],h),u(f[d+1],h)]);h+=n}return c}var Tn=2,Se=.75,Ii=.8,An=.6;function En(t,e){return[...Rn(t,e,!1),...Rn(t,e,!0)]}function Rn(t,e,n){if(!(e>0))return[];let i=u=>n?{x:u.y,y:u.x}:u,r=t.filter(u=>u.length>=3).map(u=>u.map(i)),o=r.flat().map(u=>u.y);if(o.length===0)return[];let s=Math.min(...o),l=Math.max(...o),a=[];for(let u=Math.floor(s/e)*e;u<l-.5;u+=e){if(!(u>s+.5))continue;let c=[];for(let h of r)for(let f=0;f<h.length;f++){let d=h[f],m=h[(f+1)%h.length];(d.y<=u&&u<m.y||m.y<=u&&u<d.y)&&c.push(d.x+(u-d.y)/(m.y-d.y)*(m.x-d.x))}c.sort((h,f)=>h-f);for(let h=0;h+1<c.length;h+=2)c[h+1]-c[h]>.5&&a.push([i({x:c[h],y:u}),i({x:c[h+1],y:u})])}return a}function Sn(t){return .2126*t.r+.7152*t.g+.0722*t.b>.5?{r:t.r*.84,g:t.g*.84,b:t.b*.8,a:t.a}:{r:t.r+(1-t.r)*.25,g:t.g+(1-t.g)*.25,b:t.b+(1-t.b)*.25,a:t.a}}function Ie(t){return t.style.fillStyle==="grid"&&t.style.fill.a>0&&["rectangle","ellipse","diamond","path"].includes(t.kind)}function Kt(t,e,n){let i=(Math.imul(t,668265261)^Math.imul(e,374761393)^Math.imul(n,2654435761))>>>0;return i=Math.imul(i^i>>>15,2246822507)>>>0,i=Math.imul(i^i>>>13,3266489909)>>>0,i=(i^i>>>16)>>>0,i/4294967296}function In(t,e,n){let i=n/Tn;return{x:(t+.5+(Kt(t,e,1)-.5)*An)*i,y:(e+.5+(Kt(t,e,2)-.5)*An)*i}}function $i(t,e,n,i){let r=1/0;for(let o=-1;o<=1;o++)for(let s=-1;s<=1;s++){if(o===0&&s===0)continue;let l=In(t+o,e+s,i);r=Math.min(r,Math.hypot(l.x-n.x,l.y-n.y))}return r*Ii}function Li(t,e,n){let i=Math.cos(e),r=Math.sin(e),o=n*.8,s=n*.5;return[-1,0,1].map(l=>{let a=t.x-r*s*l,u=t.y+i*s*l;return[{x:a-i*o,y:u-r*o},{x:a+i*o,y:u+r*o}]})}function Di(t,e){let n=!1;for(let i of t){if(i.length<3)continue;let r=i.length-1;for(let o=0;o<i.length;o++){let s=i[o],l=i[r];s.y>e.y!=l.y>e.y&&e.x<(l.x-s.x)*(e.y-s.y)/(l.y-s.y)+s.x&&(n=!n),r=o}}return n}function Oi(t,e){let n=1/0;for(let i of e)if(!(i.length<2))for(let r=0;r<i.length;r++){let o=i[r],s=i[(r+1)%i.length],l=s.x-o.x,a=s.y-o.y,u=l*l+a*a,c=u>0?Math.max(0,Math.min(1,((t.x-o.x)*l+(t.y-o.y)*a)/u)):0;n=Math.min(n,Math.hypot(t.x-(o.x+c*l),t.y-(o.y+c*a)))}return n}var Ci=(t,e)=>e.x>=t.x&&e.x<t.x+t.width&&e.y>=t.y&&e.y<t.y+t.height,Ut=new Map;function $n(t){if(t.length===0)return[];let e=t.map(r=>[r.kind,r.x,r.y,r.width,r.height,r.rotation??0,mt(r),JSON.stringify(r.subpaths??null),r.style.stroke.r,r.style.stroke.g,r.style.stroke.b,r.style.stroke.a,r.style.roughness,r.style.strokeWidth].join(",")).join(";"),n=Ut.get(e);if(n)return n;let i=Vi(t);return Ut.size>=16&&Ut.clear(),Ut.set(e,i),i}function Vi(t){let e=t.map(o=>{let s=$e(o).map(d=>d.map(m=>it(o,m))),l=s.flat(),a=l.map(d=>d.x),u=l.map(d=>d.y),c=a.length?Math.min(...a):0,h=u.length?Math.min(...u):0,f={x:c,y:h,width:(a.length?Math.max(...a):0)-c,height:(u.length?Math.max(...u):0)-h};return{contours:s,box:f,cell:mt(o),element:o}}),n=e.map(()=>[]),i=new Set;for(let o of e){let s=o.cell/Tn,l=Pt(o.box,-o.cell,-o.cell),a=Math.floor(l.x/s),u=Math.ceil((l.x+l.width)/s),c=Math.floor(l.y/s),h=Math.ceil((l.y+l.height)/s),f=Se*o.cell;for(let d=a;d<u;d++)for(let m=c;m<h;m++){let p=`${o.cell}|${d}|${m}`;if(i.has(p))continue;i.add(p);let b=In(d,m,o.cell),M=1/0,w=-1;for(let k=0;k<e.length;k++){let g=e[k];if(!Ci(Pt(g.box,-f,-f),b))continue;if(Di(g.contours,b)){M=0;break}let T=Oi(b,g.contours);T<M&&(M=T,w=k)}if(!(M>0&&M<=f&&w>=0))continue;let y=Kt(d,m,3)*Math.PI,R=$i(d,m,b,o.cell),A=Math.trunc(Kt(d,m,4)*4294967296)>>>0;for(let[k,g]of Li(b,y,R))n[w].push([k,g,A])}}let r=[];return e.forEach((o,s)=>{if(n[s].length===0)return;let l=o.element,a=new E;for(let[u,c,h]of n[s])l.style.roughness<=0?a.moveTo(u).lineTo(c):J(u,c,new st(h),l.style.roughness*.35,.2,!1,a);r.push({ink:{...l.style.stroke,a:l.style.stroke.a*.6},width:Math.max(.8,l.style.strokeWidth*.45),path:a})}),r}var Xt=class{constructor(e=6e3){P(this,"map",new Map);P(this,"limit");this.limit=e}get(e,n){let i=this.map.get(e);if(i!==void 0)return i;let r=n();return this.map.size>=this.limit&&this.map.clear(),this.map.set(e,r),r}},Dn=new Xt,Wi=new Xt;function On(t,e){let n=t.style;return[e,t.kind,t.x,t.y,t.width,t.height,t.seed,n.roughness,n.bowing,n.strokeWidth,n.fillStyle,n.fillStyle==="grid"?mt(t):0,t.path?t.path.join(","):t.subpaths?JSON.stringify(t.subpaths):""].join("|")}var mt=t=>Math.max(8,t.style.gridSize??50);function dt(t){return t.kind==="freehand"&&t.path===null?Ln(t):Dn.get(On(t,0),()=>Ln(t))}function Cn(t){return[{x:t.x,y:t.y},{x:G(t),y:t.y},{x:G(t),y:F(t)},{x:t.x,y:F(t)}]}function Qt(t){return[{x:N(t),y:t.y},{x:G(t),y:H(t)},{x:N(t),y:F(t)},{x:t.x,y:H(t)}]}function Ln(t){let e=L(t),n=new st(t.seed),i=t.style.roughness;switch(t.kind){case"ellipse":return i<=0?E.ellipse(e):Pn(e,n,i);case"diamond":return i<=0?new E().addLines(Qt(e)).close():Te(Qt(e),n,i,t.style.bowing);case"text":case"connector":return E.rect(e);case"freehand":return Yi(t);case"path":return i<=0?Me(t):zi(t,n);default:return i<=0?E.rect(e):Te(Cn(e),n,i,t.style.bowing)}}function zi(t,e){let n=t.style.roughness,i=new E;for(let r of _t(t)){let o=r.points;for(let s=0;s<(o.length-1)/3;s++){let l=o[3*s],a=o[3*s+1],u=o[3*s+2],c=o[3*s+3];if(a.x===l.x&&a.y===l.y&&u.x===c.x&&u.y===c.y){J(l,c,e,n,t.style.bowing,!0,i);continue}let h=Math.hypot(a.x-l.x,a.y-l.y)+Math.hypot(u.x-a.x,u.y-a.y)+Math.hypot(c.x-u.x,c.y-u.y),f=Math.min(2.5,h/30)*n;for(let d=0;d<2;d++){let m=d===0?1:.5,p=()=>e.signed()*f*m;i.moveTo(l);let b=a.x+p(),M=a.y+p(),w=u.x+p(),y=u.y+p();i.curveTo(c,{x:b,y:M},{x:w,y})}}}return i}function Yi(t){let e=L(t),n=t.path;if(n&&n.length>=8&&(n.length-2)%6===0){let o=l=>({x:e.x+n[2*l]*e.width,y:e.y+n[2*l+1]*e.height}),s=new E().moveTo(o(0));for(let l=0;l<Math.floor((n.length/2-1)/3);l++)s.curveTo(o(3*l+3),o(3*l+1),o(3*l+2));return s}let i=(t.points??[]).map(o=>({x:e.x+o.x*e.width,y:e.y+o.y*e.height})),r=new E;if(i.length===0)return r;if(r.moveTo(i[0]),i.length===1)return r.lineTo(i[0]);if(i.length===2)return r.lineTo(i[1]);for(let o=1;o<i.length-1;o++)r.quadTo({x:(i[o].x+i[o+1].x)/2,y:(i[o].y+i[o+1].y)/2},i[o]);return r.lineTo(i[i.length-1])}function $e(t){return t.kind!=="path"?[Bi(t)]:_t(t).map(e=>hn(e.points,3))}function Bi(t){let e=L(t);if(t.kind==="ellipse"){let n=[];for(let i=0;i<48;i++){let r=2*Math.PI*i/48;n.push({x:N(e)+e.width/2*Math.cos(r),y:H(e)+e.height/2*Math.sin(r)})}return n}return t.kind==="diamond"?Qt(e):Cn(e)}function Zt(t){let e=L(t);return t.kind==="ellipse"?E.ellipse(e):t.kind==="path"?Me(t):t.kind==="diamond"?new E().addLines(Qt(e)).close():E.rect(e)}function Le(t){return t.style.fillStyle==="solid"||["freehand","connector","text","image"].includes(t.kind)?new E:Dn.get(On(t,1),()=>Gi(t))}function Gi(t){let e=$e(t),n=new st((t.seed^1540483477)>>>0),i=new E;if(t.style.fillStyle==="grid"){for(let[s,l]of En(e,mt(t)))t.style.roughness<=0?i.moveTo(s).lineTo(l):J(s,l,n,t.style.roughness*.3,.3,!1,i);return i}let r=Math.max(4,t.style.strokeWidth*4),o=[Ee];t.style.fillStyle==="crossHatch"&&o.push(Ee+Math.PI/2);for(let s of o)for(let[l,a]of Mn(e,s,r))t.style.roughness<=0?i.moveTo(l).lineTo(a):J(l,a,n,t.style.roughness*.6,.5,!1,i);return i}function Jt(t,e){switch(t){case"solid":return null;case"dashed":return[Math.max(8,e*4),Math.max(6,e*3)];case"dotted":return[.01,Math.max(5,e*2.6)]}}function De(t,e){let n=t.connector;if(!n)return[new E,new E];let[i,r]=Z(t,e),o=[t.seed,t.style.roughness,t.style.bowing,t.style.strokeWidth,n.routing,n.startHead,n.endHead,n.start.port,n.end.port,i.x,i.y,r.x,r.y].join("|");return Wi.get(o,()=>Fi(t,e))}function Fi(t,e){let n=t.connector,i=new st(t.seed),r=t.style.roughness,o=t.style.bowing,s=new E,l=new E,a=ot(t,e);if(a.kind==="polyline"){let d=a.points;for(let m=0;m<Math.max(d.length-1,0);m++)r<=0?s.moveTo(d[m]).lineTo(d[m+1]):J(d[m],d[m+1],i,r,o,!0,s)}else{s.moveTo(a.a);let d=r*3,m=()=>i.signed()*d,p=a.b.x+m(),b=a.b.y+m(),M=a.c.x+m(),w=a.c.y+m();s.curveTo(a.d,{x:p,y:b},{x:M,y:w})}let u=rt(a),c=Math.max(10,t.style.strokeWidth*5),h=(d,m)=>{r<=0?s.moveTo(d).lineTo(m):J(d,m,i,r*.5,0,!0,s)},f=(d,m,p)=>{let[b,M]=gn(m,p,c);switch(d){case"arrow":h(b,m),h(M,m);break;case"triangle":h(b,m),h(M,m),h(b,M),l.moveTo(m).lineTo(b).lineTo(M).close();break;case"dot":{let w=c*.32,y=Math.atan2(m.y-p.y,m.x-p.x),R=m.x-w*Math.cos(y),A=m.y-w*Math.sin(y);l.addEllipse({x:R-w,y:A-w,width:2*w,height:2*w});break}case"bar":{let w=Math.atan2(m.y-p.y,m.x-p.x)+Math.PI/2,y=c*.5;h({x:m.x-y*Math.cos(w),y:m.y-y*Math.sin(w)},{x:m.x+y*Math.cos(w),y:m.y+y*Math.sin(w)});break}}};return u.length>1&&(f(n.endHead,u[u.length-1],u[u.length-2]),f(n.startHead,u[0],u[1])),[s,l]}function Ve(t,e){switch(t){case"linear":return e;case"easeIn":return e*e*e;case"easeOut":return 1-Math.pow(1-e,3);case"easeInOut":return e<.5?4*e*e*e:1-Math.pow(-2*e+2,3)/2;case"hold":return 0;case"spring":return Ni(e);case"bounce":return Hi(e);case"elastic":return ji(e)}}function Ni(t){if(t<=0)return 0;if(t>=1)return 1;let e=n=>1-Math.exp(-6*n)*(Math.cos(3*Math.PI*n)+6/(3*Math.PI)*Math.sin(3*Math.PI*n));return e(t)+t*(1-e(1))}function Hi(t){if(t<=0)return 0;if(t>=1)return 1;let e=7.5625,n=2.75;if(t<1/n)return e*t*t;if(t<2/n){let r=t-1.5/n;return e*r*r+.75}if(t<2.5/n){let r=t-2.25/n;return e*r*r+.9375}let i=t-2.625/n;return e*i*i+.984375}function ji(t){return t<=0?0:t>=1?1:Math.pow(2,-10*t)*Math.sin((t*10-.75)*(2*Math.PI/3))+1}var Lt=(t,e)=>t%e;function Dt(t,e){let n=(t.repeats??[]).filter(jt).slice().sort((i,r)=>i.start-r.start);if(n.length===0)return e;for(let i of n){if(!(e>=i.end))continue;let r=i.end-i.start;if(i.count===null)return i.start+Lt(e-i.start,r);let o=r*i.count;if(e<i.start+o)return i.start+Lt(e-i.start,r);e-=o-r}return e}function Oe(t,e,n,i,r){e=Dt(t,e);let o,s;for(let c of t.keys)if(n(c)!==void 0)if(c.t<=e)o=c;else{s=c;break}if(!o&&!s)return i;if(o&&!s)return n(o);if(!o&&s)return n(s);let l=o,a=s,u=a.t-l.t>0?(e-l.t)/(a.t-l.t):1;return r(n(l),n(a),Ve(l.ease??"linear",u))}var _i=(t,e,n)=>t+(e-t)*n,te=(t,e,n)=>Math.min(Math.max(t+(e-t)*n,0),1),Vn=(t,e,n)=>({r:te(t.r,e.r,n),g:te(t.g,e.g,n),b:te(t.b,e.b,n),a:te(t.a,e.a,n)});function lt(t,e,n,i){return Oe(t,e,r=>r[n],i,_i)}function qi(t,e){e=Dt(t,e);let n=(r,o)=>{let s;for(let a of t.keys)a.t<=e&&r(a)!==void 0&&(s=a);let l=t.keys.find(a=>a.t>e&&r(a)!==void 0);return!s||!l?!1:s.ease!=="hold"&&!o(r(s),r(l))},i=r=>n(o=>o[r],(o,s)=>o===s);return i("x")||i("y")||i("width")||i("height")||i("rotation")||i("strokeWidth")||n(r=>r.stroke,bt)||n(r=>r.fill,bt)||i("reveal")||i("opacity")}function Ce(t,e){e=Dt(t,e);let n=t.keys.filter(r=>r.visible!==void 0);if(n.length===0)return!0;let i;for(let r of n)r.t<=e&&(i=r);return i?i.visible:!n[0].visible}function Ui(t,e,n){if(e=V(e),t.keys.some(i=>i.reveal!==void 0)){let i=lt(t,n,"reveal",e.reveal??1);e.reveal=i>=1?null:Math.max(0,i)}if(t.keys.some(i=>i.opacity!==void 0)){let i=Math.min(Math.max(lt(t,n,"opacity",e.style.opacity??1),0),1);e.style.opacity=i>=1?null:i}return e.kind==="connector"||(e.x=lt(t,n,"x",e.x),e.y=lt(t,n,"y",e.y),e.width=Math.max(0,lt(t,n,"width",e.width)),e.height=Math.max(0,lt(t,n,"height",e.height)),t.keys.some(i=>i.rotation!==void 0)&&(e.rotation=lt(t,n,"rotation",W(e))),e.style.strokeWidth=Math.max(0,lt(t,n,"strokeWidth",e.style.strokeWidth)),e.style.stroke=Oe(t,n,i=>i.stroke,e.style.stroke,Vn),e.style.fill=Oe(t,n,i=>i.fill,e.style.fill,Vn)),e}function Ki(t,e){e=Dt(t,e);let n=null;for(let r of t.follow??[])r.start<=e&&(n===null||r.start>n.start)&&(n=r);if(!n)return null;let i=n;return t.keys.some(r=>r.t>=i.end&&r.t<=e&&(r.x!==void 0||r.y!==void 0))?null:n}function Xi(t,e){if(t.kind==="connector")return new wt(rt(ot(t,q(e))));let n=V(t);n.style.roughness=0;let i=dt(n).contours()[0]??[];return new wt(W(t)===0?i:i.map(r=>it(t,r)))}function Qi(t,e,n,i){let r=Ki(t,n);if(!r)return e;n=Dt(t,n);let o=i.elements.find(h=>h.id===r.path);if(!o||o.id===e.id)return e;let s=Xi(o,i),l=r.end-r.start,a=Math.min(Math.max(Ve(r.ease??"easeInOut",l>0?Math.min(1,(n-r.start)/l):1),0),1)*(r.laps??1);a>1&&(a=Lt(a,1)===0?1:Lt(a,1)),r.reverse===!0&&(a=1-a);let u=s.point(a),c=V(e);if(c.x=u.x-e.width/2,c.y=u.y-e.height/2,r.orient===!0){let h=r.reverse===!0?-.01:.01,f=s.point(a-h/2),d=s.point(a+h/2);(f.x!==d.x||f.y!==d.y)&&(c.rotation=Math.atan2(d.y-f.y,d.x-f.x))}return c}function Zi(t,e,n,i){if(!(n>0))return 0;let r=C(t.duration);if(r>0){let s=It(e*r/n);s!==0&&(e=s*n/r)}let o=Lt(e*i,n);return o<0?-o:o===0?0:n-o}function Ji(t){let e=new Map;for(let n of t.tracks)e.has(n.element)||e.set(n.element,n);return e}function U(t,e){return j(Ot(t,e),C(e))}function Ot(t,e){let n=t.timeline;if(!n)return t;e=C(e);let i=Ji(n),r=n.boil===null?null:Math.trunc(Math.floor(e*xt(n.fps)+1e-9)/Math.max(1,n.boil))%ke>>>0,o=new Set;for(let d of i.values())Ce(d,e)||o.add(d.element);let s=null;if(n.settle===!0){s=new Set;for(let d of i.values())qi(d,e)&&s.add(d.element)}let l=d=>{let m=i.get(d.id)?.boil;return m??(s?d.connector?[d.connector.start.elementID,d.connector.end.elementID].some(p=>p!==null&&s.has(p)):s.has(d.id):!0)},a=t.elements.map(d=>{let m=i.get(d.id),p=m?Ui(m,d,e):d;r!==null&&r>0&&l(d)&&(p===d&&(p=V(d)),p.seed=qt(d.seed,r));let b=m?.march!=null?Jt(p.style.dash,p.style.strokeWidth):null;return m?.march!=null&&b&&(p===d&&(p=V(d)),p.style.dashOffset=Zi(n,m.march,b.reduce((M,w)=>M+w,0),e)),p});a=a.map((d,m)=>o.has(d.id)?t.elements[m]:d);let u={...t,elements:a,timeline:null};a=a.map(d=>{let m=i.get(d.id);return m?Qi(m,d,e,u):d});let c={...t,elements:a,timeline:null},h=q(c),f=new Set(o);return a=a.map(d=>{let m=d.connector;if(!m||![m.start.elementID,m.end.elementID].some(w=>w!==null&&o.has(w)))return d;if(!(i.get(d.id)?.keys.some(w=>w.visible!==void 0)??!1))return f.add(d.id),d;let[p,b]=Z(d,h),M=V(d);return M.connector.start={elementID:null,port:m.start.port,x:p.x,y:p.y},M.connector.end={elementID:null,port:m.end.port,x:b.x,y:b.y},M}),{...t,elements:a.filter(d=>!f.has(d.id)),timeline:null}}function at(t){return t.timeline?t.timeline.poster??t.timeline.duration:0}function zn(t){return t.timeline?U(t,at(t)):j(t,0)}function tr(t,e){let n=t.camera??[];if(n.length===0)return null;let i;for(let l of n)l.t<=e&&(i=l);let r=n.find(l=>l.t>e);if(!i)return Wn(n[0]);if(!r)return Wn(i);let o=Ve(i.ease??"easeInOut",(e-i.t)/Math.max(r.t-i.t,1e-9)),s=(l,a)=>l+(a-l)*o;return{x:s(i.x,r.x),y:s(i.y,r.y),width:Math.max(1,s(i.width,r.width)),height:Math.max(1,s(i.height,r.height))}}var Wn=t=>({x:t.x,y:t.y,width:t.width,height:t.height});function Mt(t,e){let n=t.camera?.[0],i=tr(t,e);return!n||!i||!(i.width>0&&i.height>0)?null:er(i,n.width/n.height)}function er(t,e){if(!(t.width>0&&t.height>0&&e>0))return t;let n=t.width,i=t.height;return t.width/t.height<e?n=t.height*e:i=t.width/e,{x:t.x+t.width/2-n/2,y:t.y+t.height/2-i/2,width:n,height:i}}function nr(t){return Math.max(1,Math.ceil(C(t.duration)*xt(t.fps)))}function ee(t){let e=xt(t.fps),n=[];for(let r=0;r<nr(t);r++)n.push(r/e);let i=n[n.length-1];return t.duration-i>1e-6&&n.push(t.duration),n}function Yn(t,e){let n=-1;return(t.markers??[]).forEach((i,r)=>{i.t<=e&&(n=r)}),n}function Bn(t){let e=t.timeline;if(!e)return new Set;let n=e.poster??e.duration;return new Set(e.tracks.filter(i=>!Ce(i,0)&&!Ce(i,n)).map(i=>i.element))}var ir=8,rr=2e4,We=1e-9;function ne(t,e){let n=(t.timeline?.markers??[]).find(i=>i.name.toLowerCase()===e);return n?Math.min(Math.max(n.t,0),C(t.timeline?.duration??0)):null}function Vt(t,e){switch(e){case"up":return ne(t,"up")??0;case"over":return ne(t,"over")??Vt(t,"up");case"down":return ne(t,"down")??Vt(t,"over");default:return ne(t,"hit")}}function or(t,e,n,i){let r=C(t.timeline?.duration??0);if(t.button===!0)return Vt(t,"up")??0;let o=i!==null&&Number.isFinite(i)?i:0;switch(n??"loop"){case"still":return Math.min(t.timeline?.poster??r,r);case"click":return Math.min(Math.max(o,0),r);case"once":return Math.min(Math.max(e+o,0),r);default:{if(r<=0)return 0;let s=e+o,l=s%r;return l<0&&(l+=r),s>We&&(l<We||r-l<We)?r:l}}}function sr(t,e){let n=t.params;if(!n||Object.keys(n).length===0)return t;let i=new Map(Object.entries(n));for(let[o,s]of Object.entries(e??{}))i.has(o)&&i.set(o,s);let r=o=>o.includes("{{")?o.replace(/\{\{\s*([^{}]*?)\s*\}\}/g,(s,l)=>i.get(l)??s):o;return{...t,elements:t.elements.map(o=>{if(o.text===null&&o.args===null)return o;let s=V(o);return s.text!==null&&(s.text=r(s.text)),s.args!==null&&(s.args=Object.fromEntries(Object.entries(s.args).map(([l,a])=>[l,r(a)]))),s})}}function lr(t){return{id:t.id,name:t.name,layers:t.layers,elements:t.elements,theme:null,timeline:t.timeline,symbols:null}}function ie(t){return t.elements.some(e=>e.kind==="symbol")}function j(t,e,n=!0,i=new Map){if(!ie(t))return t;let r={left:rr};return{...t,elements:Fn(t.elements,t,e,Be(t),[],n,r,i)}}function Be(t){let e=new Map;for(let n of t.symbols??[])e.has(n.id)||e.set(n.id,n);return e}function Fn(t,e,n,i,r,o,s,l=new Map){let a=new Set(t.filter(h=>h.kind==="symbol").map(h=>h.id));if(a.size===0)return s.left-=t.length,t;let u=q(e),c=[];for(let h of t){if(s.left<=0)break;let f=h.connector;if(h.kind==="connector"&&f&&[f.start.elementID,f.end.elementID].some(A=>A!==null&&a.has(A))){let[A,k]=Z(h,u),g=V(h);f.start.elementID!==null&&a.has(f.start.elementID)&&(g.connector.start={elementID:null,port:f.start.port,x:A.x,y:A.y}),f.end.elementID!==null&&a.has(f.end.elementID)&&(g.connector.end={elementID:null,port:f.end.port,x:k.x,y:k.y}),c.push(g),s.left-=1;continue}if(h.kind!=="symbol"){c.push(h),s.left-=1;continue}s.left-=1;let d=h.symbol,m=d===null?void 0:i.get(d);if(d===null||!m||r.includes(d)||r.length>=ir)continue;let p=r.length===0?l.get(h.id):void 0,b=p!==void 0?Math.min(Math.max(p,0),C(m.timeline?.duration??0)):or(m,n,h.playback,h.offset),M=lr(sr(m,h.args)),w=o?Ot(M,b):M,y=new Set(w.layers.filter(A=>A.visible).map(A=>A.id)),R={...w,elements:ht(w).filter(A=>y.has(A.layerID)),layers:[{id:h.layerID,name:"",visible:!0,locked:!1}]};for(let A of Fn(R.elements,R,b,i,[...r,d],o,s))c.push(ar(A,h,m))}return c}function ar(t,e,n){let i={x:e.x,y:e.y,width:e.width,height:e.height},r=i.width/n.width,o=i.height/n.height,s=Math.sqrt(Math.abs(r*o)),l={x:i.x+i.width/2,y:i.y+i.height/2},a=W(e),u=d=>nt({x:i.x+d.x*r,y:i.y+d.y*o},l,a),c=V(t);c.id=Ye(e.id,t.id),c.layerID=e.layerID,c.groupID=null,c.link=t.link===null?null:Ye(e.id,t.link),c.seed=qt(t.seed,e.seed),c.click=null,c.hover=null;let h={x:i.x+t.x*r,y:i.y+t.y*o,width:t.width*r,height:t.height*o},f=nt({x:h.x+h.width/2,y:h.y+h.height/2},l,a);if(c.x=f.x-h.width/2,c.y=f.y-h.height/2,c.width=h.width,c.height=h.height,(a!==0||t.rotation!==null)&&(c.rotation=W(t)+a),c.style.strokeWidth=t.style.strokeWidth*s,c.style.fontSize=t.style.fontSize*s,t.style.gridSize!==null&&(c.style.gridSize=t.style.gridSize*s),e.style.opacity!==null&&(c.style.opacity=(t.style.opacity??1)*e.style.opacity),t.connector){let d=m=>{if(m.elementID!==null)return{elementID:Ye(e.id,m.elementID),port:m.port,x:m.x,y:m.y};let p=u(m);return{elementID:null,port:m.port,x:p.x,y:p.y}};c.connector={...t.connector,start:d(t.connector.start),end:d(t.connector.end)}}return c}var ze=(1n<<64n)-1n;function Ct(t){let e=t+0x9e3779b97f4a7c15n&ze;return e=(e^e>>30n)*0xbf58476d1ce4e5b9n&ze,e=(e^e>>27n)*0x94d049bb133111ebn&ze,e^e>>31n}function Gn(t){let e=t.replace(/-/g,"").padStart(32,"0").slice(-32);return[BigInt(`0x${e.slice(0,16)}`),BigInt(`0x${e.slice(16)}`)]}function Ye(t,e){let[n,i]=Gn(t),[r,o]=Gn(e),s=Ct(Ct(Ct(Ct(n)^i)^r)^o),l=Ct(s^0x6a09e667f3bcc909n),a=s.toString(16).padStart(16,"0")+l.toString(16).padStart(16,"0");return`${a.slice(0,8)}-${a.slice(8,12)}-${a.slice(12,16)}-${a.slice(16,20)}-${a.slice(20)}`.toUpperCase()}function cr(t,e){let n=e.findIndex(i=>i.name===t);return n>=0?n:e.findIndex(i=>i.name.toLowerCase()===t.toLowerCase())}function Nn(t,e){let n=t.timeline?.markers??[],i=new Map,r=null;for(let o of t.elements){let s=o.click;if(s?.scene){let a=cr(s.scene,n);if(a>=0){i.set(o.id,{scene:a});continue}}let l=s?.url?Ht(s.url):null;if(l){i.set(o.id,{url:l});continue}if(o.link&&e&&e.pages.length>1){r||(r=new Map,e.pages.forEach((u,c)=>{for(let h of u.elements)r.has(h.id)||r.set(h.id,c)}));let a=r.get(o.link);a!==void 0&&e.pages[a]!==t&&i.set(o.id,{page:a})}}return i}function ur(t){let e=t.hover;if(!e)return t;let n={...t.style};if(e.stroke&&(n.stroke=e.stroke),e.fill&&(n.fill=e.fill),e.opacity!==null&&Number.isFinite(e.opacity)){let i=Math.min(Math.max(e.opacity,0),1);n.opacity=i>=1?null:i}return{...t,style:n}}function Hn(t,e){return{...t,elements:t.elements.map(n=>e.has(n.id)?ur(n):n)}}function jn(t){return!!t.hover&&(t.hover.stroke!==null||t.hover.fill!==null||t.hover.opacity!==null)}function _n(t,e){let n=(t.text??"").split(`
|
|
3
3
|
`).find(i=>i.length>0);return n||(t.anchor?t.anchor:e||t.kind)}function qn(t,e){let n=new Map;for(let i of t.elements){if(!e.has(i.id)||i.kind!=="symbol")continue;let r={...t,layers:[{id:i.layerID,name:"",visible:!0,locked:!1}],elements:[i]};for(let o of j(r,0,!1).elements)n.set(o.id,i.id)}return n}var Un=`
|
|
4
4
|
.dottie-a { cursor: pointer; outline: none; }
|
|
@@ -80,4 +80,4 @@ ${w}</g>
|
|
|
80
80
|
<button class="next" aria-label="Next scene" hidden>\u23ED</button>
|
|
81
81
|
<input class="scrub" type="range" min="0" max="0" value="0" aria-label="Frame">
|
|
82
82
|
<output class="time">0.0s</output>
|
|
83
|
-
</div>`;let n=i=>this.root.querySelector(i);this.stage=n(".stage"),this.bar=n(".bar"),this.playButton=n(".play"),this.scrub=n(".scrub"),this.time=n(".time"),this.sceneLabel=n(".scene"),this.prev=n(".prev"),this.next=n(".next"),this.playButton.onclick=()=>{let i=this.playback;i&&!this.playing&&i.scenes.length&&i.frame>=i.frameCount-1&&i.show(0),this.setPlaying(!this.playing)},this.scrub.oninput=()=>{this.setPlaying(!1),this.playback?.show(Number(this.scrub.value))},this.next.onclick=()=>this.nextScene(),this.prev.onclick=()=>this.prevScene(),this.stage.addEventListener("click",i=>{let r=pi(i.target);r&&this.activate(r.getAttribute("data-a")??"")}),this.addEventListener("keydown",i=>this.key(i))}connectedCallback(){this.hasAttribute("tabindex")||(this.tabIndex=0),"IntersectionObserver"in window&&(this.observer=new IntersectionObserver(n=>{this.visible=n.some(i=>i.isIntersecting),this.schedule()}),this.observer.observe(this)),this.load()}disconnectedCallback(){cancelAnimationFrame(this.raf),this.raf=0,this.observer?.disconnect()}attributeChangedCallback(n,i,r){i===r||!this.isConnected||(n==="src"?this.load():n==="label"?this.stage.setAttribute("aria-label",r??""):this.file&&this.mount())}async load(){let n=++this.loadToken;try{let i,r=this.getAttribute("src");if(r){let o=await fetch(r);if(!o.ok)throw new Error(`${r}: ${o.status} ${o.statusText}`);i=await o.text()}else{let o=this.querySelector('script[type="application/json"], script[type="application/vnd.dottie+json"]');if(!o)return;i=o.textContent??""}if(n!==this.loadToken)return;this.setFile(St(i))}catch(i){if(n!==this.loadToken)return;this.stage.innerHTML="";let r=document.createElement("div");r.className="error",r.textContent=`Couldn't show this drawing: ${i.message}`,this.stage.append(r),this.dispatchEvent(new CustomEvent("error",{detail:i}))}}setFile(n){this.file=n;for(let i of n.warnings)console.warn(`dottie-player: ${i}`);this.mount(),this.dispatchEvent(new CustomEvent("load",{detail:{file:n}}))}mount(){let n=this.file,i=n.pages[Bt(n,this.getAttribute("page"))],r=new Yt(i,this.stage,{clean:this.hasAttribute("clean"),file:n});this.playback=r,this.style.setProperty("--dottie-page",O(r.background)),this.style.setProperty("--dottie-ink",O(r.ink)),this.style.colorScheme=kt(r.background)<.5?"dark":"light",this.stage.setAttribute("aria-label",this.getAttribute("label")??i.name);let o=this.getAttribute("at"),s=i.timeline!==null&&r.frameCount>1&&o===null;this.bar.hidden=!s||this.hasAttribute("no-controls");let l=r.scenes.length>0;if(this.prev.hidden=this.next.hidden=this.sceneLabel.hidden=!l,this.scrub.max=String(r.frameCount-1),r.onFrame=u=>{if(this.scrub.value=String(u),this.time.textContent=`${r.plan.times[u].toFixed(1)}s`,l){let c=r.sceneAt(u);this.sceneLabel.textContent=c<0?"":r.sceneNames[c]}this.dispatchEvent(new CustomEvent("frame",{detail:{frame:u,time:r.plan.times[u]}}))},!s){r.drawAt(o!==null?Number(o)||0:at(i),o!==null?yi(r,Number(o)||0):r.posterFrame),this.setPlaying(!1);return}if(r.show(0),typeof matchMedia=="function"&&matchMedia("(prefers-reduced-motion: reduce)").matches){r.show(r.posterFrame),this.setPlaying(!1);return}this.setPlaying(!this.hasAttribute("no-autoplay")&&!r.scenes.includes(0))}get paused(){return!this.playing}get currentTime(){let n=this.playback;return n&&n.frame>=0?n.plan.times[n.frame]:0}set currentTime(n){let i=this.playback;i&&(this.setPlaying(!1),i.show(yi(i,n)))}get duration(){return this.playback?.page.timeline?.duration??0}play(){this.setPlaying(!0)}pause(){this.setPlaying(!1)}nextScene(){let n=this.playback;n&&(n.frame>=n.frameCount-1&&n.show(0),this.setPlaying(!0))}prevScene(){let n=this.playback;if(!n)return;let i=n.sceneAt(n.frame);i>=0&&n.scenes[i]===n.frame&&(i-=1),this.setPlaying(!1),n.show(i>=0?n.scenes[i]:0)}activate(n){let i=this.playback,r=i?.clicks.get(n),o=i?.replays.has(n)??!1;if(!i||!r&&!o)return;let s={element:n,...r??{},...o?{replay:!0}:{}};if(!this.dispatchEvent(new CustomEvent("action",{detail:s,cancelable:!0})))return;let l=typeof matchMedia=="function"&&matchMedia("(prefers-reduced-motion: reduce)").matches;if(o){let a=performance.now();i.replay(n,l?a-i.replays.get(n)*1e3:a),i.redraw(),this.scheduleReplay()}r&&("url"in r?/^(https?:|mailto:)/i.test(r.url)&&window.open(r.url,"_blank","noopener"):"page"in r?this.setAttribute("page",String(r.page+1)):r.scene>=0&&r.scene<i.scenes.length&&(l||this.hasAttribute("at")||i.frameCount<2?(this.setPlaying(!1),i.show(r.scene+1<i.scenes.length?i.scenes[r.scene+1]:i.frameCount-1)):(i.show(i.scenes[r.scene]),this.setPlaying(!0))))}scheduleReplay(){if(this.replayRaf)return;let n=()=>{this.replayRaf=0;let i=this.playback;!i||!this.isConnected||(this.playing||i.redraw(),i.replaying()?this.replayRaf=requestAnimationFrame(n):this.playing||i.redraw())};this.replayRaf=requestAnimationFrame(n)}setPlaying(n){let i=this.playback;this.playing=n&&!!i&&i.frameCount>1&&i.page.timeline!==null,this.playButton.textContent=this.playing?"\u275A\u275A":"\u25B6",this.playButton.setAttribute("aria-label",this.playing?"Pause":"Play"),this.last=0,this.acc=0,this.schedule()}schedule(){this.playing&&this.visible&&!this.raf&&this.isConnected&&(this.raf=requestAnimationFrame(n=>this.tick(n)))}tick(n){this.raf=0;let i=this.playback;if(!this.playing||!i)return;let r=1e3/(i.page.timeline?.fps??12);this.last&&(this.acc+=Math.min(n-this.last,1e3)),this.last=n;let o=!1;for(;this.playing&&this.acc>=r;){this.acc-=r;let s=i.frame+1;if(s>=i.frameCount&&(i.scenes.length||this.hasAttribute("no-loop"))){this.setPlaying(!1);break}if(i.frame=s%i.frameCount,o=!0,i.scenes.includes(i.frame)){this.setPlaying(!1);break}}o&&i.show(i.frame),this.playing&&!this.visible&&(this.last=0),this.schedule()}key(n){let i=this.playback,r=n.composedPath()[0],o=pi(r);if(i&&o&&(n.key==="Enter"||n.key===" ")){n.preventDefault(),this.activate(o.getAttribute("data-a")??"");return}if(!i||i.page.timeline===null||i.frameCount<=1||this.hasAttribute("at")||r===this.scrub&&n.key!==" ")return;let s=i.scenes.length>0,l=!0;n.key===" "?s?this.playing?this.setPlaying(!1):this.nextScene():this.setPlaying(!this.playing):n.key==="ArrowRight"?s?this.nextScene():(this.setPlaying(!1),i.show(i.frame+1)):n.key==="ArrowLeft"?s?this.prevScene():(this.setPlaying(!1),i.show(i.frame-1)):n.key==="."?(this.setPlaying(!1),i.show(i.frame+1)):n.key===","?(this.setPlaying(!1),i.show(i.frame-1)):l=!1,l&&n.preventDefault()}};P(Rt,"observedAttributes",["src","page","at","clean","no-controls","label"]);function pi(t){let e=t;return e&&typeof e.closest=="function"?e.closest(".dottie-a"):null}function yi(t,e){let n=0;return t.plan.times.forEach((i,r)=>{Math.abs(i-e)<Math.abs(t.plan.times[n]-e)&&(n=r)}),n}function fe(t="dottie-player"){typeof customElements<"u"&&!customElements.get(t)&&customElements.define(t,class extends Rt{})}var I=t=>{let e=It(t*1e4)/1e4;return e===0?0:e},Xe=t=>[I(t.x),I(t.y)],Ft=t=>[I(t.x),I(t.y),I(t.width),I(t.height)],gi=t=>[I(t.r),I(t.g),I(t.b),I(t.a)];function Qe(t){let e=t.timeline;if(!e)return[0];let n=e.duration,i=[0,n];for(let r=1;r<16;r++)i.push(n*(r+.37)/16);for(let r of e.markers??[])i.push(r.t);return e.poster!==null&&i.push(e.poster),[...new Set(i.map(I))].filter(r=>r>=0&&r<=n).sort((r,o)=>r-o)}function Ze(t,e){let n=U(t,e),i=q(n),r=new Set(n.layers.filter(l=>l.visible).map(l=>l.id)),o={t:I(e)},s=t.timeline;if(s){let l=Mt(s,e);o.view=l?Ft(l):null;let a=-1;(s.markers??[]).forEach((u,c)=>{u.t<=e&&(a=c)}),o.scene=a}return s?.camera?.length||(o.bounds=Ft(tt(n))),o.elements=ht(n).map((l,a)=>{let u={id:l.id,kind:l.kind,z:a,seed:l.seed,frame:Ft({x:l.x,y:l.y,width:l.width,height:l.height})};if(r.has(l.layerID)||(u.hiddenLayer=!0),l.rotation!==null&&(u.rotation=I(l.rotation)),l.style.opacity!==null&&(u.opacity=I(l.style.opacity)),l.reveal!==null&&(u.reveal=I(l.reveal)),l.style.dashOffset!==null&&(u.dashOffset=I(l.style.dashOffset)),u.strokeWidth=I(l.style.strokeWidth),u.stroke=gi(l.style.stroke),u.fill=gi(l.style.fill),l.kind==="connector"){let[c,h]=Z(l,i);u.start=Xe(c),u.end=Xe(h),u.route=rt(ot(l,i)).map(Xe)}return u}),o}function Je(t,e,n){let i={page:e+1,name:t.name,id:t.id},r=t.timeline;if(r){let o=At(t);i.duration=I(r.duration),i.fps=I(r.fps),i.frameCount=o.times.length,i.poster=I(r.poster??r.duration),i.size=[I(o.size.width),I(o.size.height)],r.camera?.length||(i.bounds=Ft(o.rects[0])),i.markers=(r.markers??[]).map(s=>({t:I(s.t),name:s.name}))}else i.bounds=Ft(tt(t));return i.frames=n.map(o=>Ze(t,o)),i}function bi(t,e){return{version:t.version,pages:t.pages.map((n,i)=>Je(n,i,e??Qe(n)))}}function Ir(t,e={}){let n=$r(t)?t:St(t),i=n.pages[Bt(n,e.page===void 0?null:String(e.page))];return i=U(i,e.at??at(i)),e.clean&&(i=Gt(i,0)),de(i,e.background===void 0?{r:1,g:1,b:1,a:1}:e.background)}function $r(t){return typeof t=="object"&&t!==null&&Array.isArray(t.pages)&&Array.isArray(t.warnings)}var Lr="0.5.
|
|
83
|
+
</div>`;let n=i=>this.root.querySelector(i);this.stage=n(".stage"),this.bar=n(".bar"),this.playButton=n(".play"),this.scrub=n(".scrub"),this.time=n(".time"),this.sceneLabel=n(".scene"),this.prev=n(".prev"),this.next=n(".next"),this.playButton.onclick=()=>{let i=this.playback;i&&!this.playing&&i.scenes.length&&i.frame>=i.frameCount-1&&i.show(0),this.setPlaying(!this.playing)},this.scrub.oninput=()=>{this.setPlaying(!1),this.playback?.show(Number(this.scrub.value))},this.next.onclick=()=>this.nextScene(),this.prev.onclick=()=>this.prevScene(),this.stage.addEventListener("click",i=>{let r=pi(i.target);r&&this.activate(r.getAttribute("data-a")??"")}),this.addEventListener("keydown",i=>this.key(i))}connectedCallback(){this.hasAttribute("tabindex")||(this.tabIndex=0),"IntersectionObserver"in window&&(this.observer=new IntersectionObserver(n=>{this.visible=n.some(i=>i.isIntersecting),this.schedule()}),this.observer.observe(this)),this.load()}disconnectedCallback(){cancelAnimationFrame(this.raf),this.raf=0,this.observer?.disconnect()}attributeChangedCallback(n,i,r){i===r||!this.isConnected||(n==="src"?this.load():n==="label"?this.stage.setAttribute("aria-label",r??""):this.file&&this.mount())}async load(){let n=++this.loadToken;try{let i,r=this.getAttribute("src");if(r){let o=await fetch(r);if(!o.ok)throw new Error(`${r}: ${o.status} ${o.statusText}`);i=await o.text()}else{let o=this.querySelector('script[type="application/json"], script[type="application/vnd.dottie+json"]');if(!o)return;i=o.textContent??""}if(n!==this.loadToken)return;this.setFile(St(i))}catch(i){if(n!==this.loadToken)return;this.stage.innerHTML="";let r=document.createElement("div");r.className="error",r.textContent=`Couldn't show this drawing: ${i.message}`,this.stage.append(r),this.dispatchEvent(new CustomEvent("error",{detail:i}))}}setFile(n){this.file=n;for(let i of n.warnings)console.warn(`dottie-player: ${i}`);this.mount(),this.dispatchEvent(new CustomEvent("load",{detail:{file:n}}))}mount(){let n=this.file,i=n.pages[Bt(n,this.getAttribute("page"))],r=new Yt(i,this.stage,{clean:this.hasAttribute("clean"),file:n});this.playback=r,this.style.setProperty("--dottie-page",O(r.background)),this.style.setProperty("--dottie-ink",O(r.ink)),this.style.colorScheme=kt(r.background)<.5?"dark":"light",this.stage.setAttribute("aria-label",this.getAttribute("label")??i.name);let o=this.getAttribute("at"),s=i.timeline!==null&&r.frameCount>1&&o===null;this.bar.hidden=!s||this.hasAttribute("no-controls");let l=r.scenes.length>0;if(this.prev.hidden=this.next.hidden=this.sceneLabel.hidden=!l,this.scrub.max=String(r.frameCount-1),r.onFrame=u=>{if(this.scrub.value=String(u),this.time.textContent=`${r.plan.times[u].toFixed(1)}s`,l){let c=r.sceneAt(u);this.sceneLabel.textContent=c<0?"":r.sceneNames[c]}this.dispatchEvent(new CustomEvent("frame",{detail:{frame:u,time:r.plan.times[u]}}))},!s){r.drawAt(o!==null?Number(o)||0:at(i),o!==null?yi(r,Number(o)||0):r.posterFrame),this.setPlaying(!1);return}if(r.show(0),typeof matchMedia=="function"&&matchMedia("(prefers-reduced-motion: reduce)").matches){r.show(r.posterFrame),this.setPlaying(!1);return}this.setPlaying(!this.hasAttribute("no-autoplay")&&!r.scenes.includes(0))}get paused(){return!this.playing}get currentTime(){let n=this.playback;return n&&n.frame>=0?n.plan.times[n.frame]:0}set currentTime(n){let i=this.playback;i&&(this.setPlaying(!1),i.show(yi(i,n)))}get duration(){return this.playback?.page.timeline?.duration??0}play(){this.setPlaying(!0)}pause(){this.setPlaying(!1)}nextScene(){let n=this.playback;n&&(n.frame>=n.frameCount-1&&n.show(0),this.setPlaying(!0))}prevScene(){let n=this.playback;if(!n)return;let i=n.sceneAt(n.frame);i>=0&&n.scenes[i]===n.frame&&(i-=1),this.setPlaying(!1),n.show(i>=0?n.scenes[i]:0)}activate(n){let i=this.playback,r=i?.clicks.get(n),o=i?.replays.has(n)??!1;if(!i||!r&&!o)return;let s={element:n,...r??{},...o?{replay:!0}:{}};if(!this.dispatchEvent(new CustomEvent("action",{detail:s,cancelable:!0})))return;let l=typeof matchMedia=="function"&&matchMedia("(prefers-reduced-motion: reduce)").matches;if(o){let a=performance.now();i.replay(n,l?a-i.replays.get(n)*1e3:a),i.redraw(),this.scheduleReplay()}r&&("url"in r?/^(https?:|mailto:)/i.test(r.url)&&window.open(r.url,"_blank","noopener"):"page"in r?this.setAttribute("page",String(r.page+1)):r.scene>=0&&r.scene<i.scenes.length&&(l||this.hasAttribute("at")||i.frameCount<2?(this.setPlaying(!1),i.show(r.scene+1<i.scenes.length?i.scenes[r.scene+1]:i.frameCount-1)):(i.show(i.scenes[r.scene]),this.setPlaying(!0))))}scheduleReplay(){if(this.replayRaf)return;let n=()=>{this.replayRaf=0;let i=this.playback;!i||!this.isConnected||(this.playing||i.redraw(),i.replaying()?this.replayRaf=requestAnimationFrame(n):this.playing||i.redraw())};this.replayRaf=requestAnimationFrame(n)}setPlaying(n){let i=this.playback;this.playing=n&&!!i&&i.frameCount>1&&i.page.timeline!==null,this.playButton.textContent=this.playing?"\u275A\u275A":"\u25B6",this.playButton.setAttribute("aria-label",this.playing?"Pause":"Play"),this.last=0,this.acc=0,this.schedule()}schedule(){this.playing&&this.visible&&!this.raf&&this.isConnected&&(this.raf=requestAnimationFrame(n=>this.tick(n)))}tick(n){this.raf=0;let i=this.playback;if(!this.playing||!i)return;let r=1e3/(i.page.timeline?.fps??12);this.last&&(this.acc+=Math.min(n-this.last,1e3)),this.last=n;let o=!1;for(;this.playing&&this.acc>=r;){this.acc-=r;let s=i.frame+1;if(s>=i.frameCount&&(i.scenes.length||this.hasAttribute("no-loop"))){this.setPlaying(!1);break}if(i.frame=s%i.frameCount,o=!0,i.scenes.includes(i.frame)){this.setPlaying(!1);break}}o&&i.show(i.frame),this.playing&&!this.visible&&(this.last=0),this.schedule()}key(n){let i=this.playback,r=n.composedPath()[0],o=pi(r);if(i&&o&&(n.key==="Enter"||n.key===" ")){n.preventDefault(),this.activate(o.getAttribute("data-a")??"");return}if(!i||i.page.timeline===null||i.frameCount<=1||this.hasAttribute("at")||r===this.scrub&&n.key!==" ")return;let s=i.scenes.length>0,l=!0;n.key===" "?s?this.playing?this.setPlaying(!1):this.nextScene():this.setPlaying(!this.playing):n.key==="ArrowRight"?s?this.nextScene():(this.setPlaying(!1),i.show(i.frame+1)):n.key==="ArrowLeft"?s?this.prevScene():(this.setPlaying(!1),i.show(i.frame-1)):n.key==="."?(this.setPlaying(!1),i.show(i.frame+1)):n.key===","?(this.setPlaying(!1),i.show(i.frame-1)):l=!1,l&&n.preventDefault()}};P(Rt,"observedAttributes",["src","page","at","clean","no-controls","label"]);function pi(t){let e=t;return e&&typeof e.closest=="function"?e.closest(".dottie-a"):null}function yi(t,e){let n=0;return t.plan.times.forEach((i,r)=>{Math.abs(i-e)<Math.abs(t.plan.times[n]-e)&&(n=r)}),n}function fe(t="dottie-player"){typeof customElements<"u"&&!customElements.get(t)&&customElements.define(t,class extends Rt{})}var I=t=>{let e=It(t*1e4)/1e4;return e===0?0:e},Xe=t=>[I(t.x),I(t.y)],Ft=t=>[I(t.x),I(t.y),I(t.width),I(t.height)],gi=t=>[I(t.r),I(t.g),I(t.b),I(t.a)];function Qe(t){let e=t.timeline;if(!e)return[0];let n=e.duration,i=[0,n];for(let r=1;r<16;r++)i.push(n*(r+.37)/16);for(let r of e.markers??[])i.push(r.t);return e.poster!==null&&i.push(e.poster),[...new Set(i.map(I))].filter(r=>r>=0&&r<=n).sort((r,o)=>r-o)}function Ze(t,e){let n=U(t,e),i=q(n),r=new Set(n.layers.filter(l=>l.visible).map(l=>l.id)),o={t:I(e)},s=t.timeline;if(s){let l=Mt(s,e);o.view=l?Ft(l):null;let a=-1;(s.markers??[]).forEach((u,c)=>{u.t<=e&&(a=c)}),o.scene=a}return s?.camera?.length||(o.bounds=Ft(tt(n))),o.elements=ht(n).map((l,a)=>{let u={id:l.id,kind:l.kind,z:a,seed:l.seed,frame:Ft({x:l.x,y:l.y,width:l.width,height:l.height})};if(r.has(l.layerID)||(u.hiddenLayer=!0),l.rotation!==null&&(u.rotation=I(l.rotation)),l.style.opacity!==null&&(u.opacity=I(l.style.opacity)),l.reveal!==null&&(u.reveal=I(l.reveal)),l.style.dashOffset!==null&&(u.dashOffset=I(l.style.dashOffset)),u.strokeWidth=I(l.style.strokeWidth),u.stroke=gi(l.style.stroke),u.fill=gi(l.style.fill),l.kind==="connector"){let[c,h]=Z(l,i);u.start=Xe(c),u.end=Xe(h),u.route=rt(ot(l,i)).map(Xe)}return u}),o}function Je(t,e,n){let i={page:e+1,name:t.name,id:t.id},r=t.timeline;if(r){let o=At(t);i.duration=I(r.duration),i.fps=I(r.fps),i.frameCount=o.times.length,i.poster=I(r.poster??r.duration),i.size=[I(o.size.width),I(o.size.height)],r.camera?.length||(i.bounds=Ft(o.rects[0])),i.markers=(r.markers??[]).map(s=>({t:I(s.t),name:s.name}))}else i.bounds=Ft(tt(t));return i.frames=n.map(o=>Ze(t,o)),i}function bi(t,e){return{version:t.version,pages:t.pages.map((n,i)=>Je(n,i,e??Qe(n)))}}function Ir(t,e={}){let n=$r(t)?t:St(t),i=n.pages[Bt(n,e.page===void 0?null:String(e.page))];return i=U(i,e.at??at(i)),e.clean&&(i=Gt(i,0)),de(i,e.background===void 0?{r:1,g:1,b:1,a:1}:e.background)}function $r(t){return typeof t=="object"&&t!==null&&Array.isArray(t.pages)&&Array.isArray(t.warnings)}var Lr="0.5.4";fe();globalThis.Dottie??(globalThis.Dottie=tn);})();
|
package/dist/dottie.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/*! dottie.js 0.5.
|
|
1
|
+
/*! dottie.js 0.5.4 | Apache-2.0 | https://github.com/phin-tech/dottie */
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
3
|
var __defNormalProp = (obj, key, value2) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value: value2 }) : obj[key] = value2;
|
|
4
4
|
var __publicField = (obj, key, value2) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value2);
|
|
@@ -3555,7 +3555,7 @@ function render(source, options = {}) {
|
|
|
3555
3555
|
function isFile(v) {
|
|
3556
3556
|
return typeof v === "object" && v !== null && Array.isArray(v.pages) && Array.isArray(v.warnings);
|
|
3557
3557
|
}
|
|
3558
|
-
var VERSION = "0.5.
|
|
3558
|
+
var VERSION = "0.5.4";
|
|
3559
3559
|
export {
|
|
3560
3560
|
BOIL_DRAWINGS,
|
|
3561
3561
|
DottieFormatError,
|
package/dist/types/index.d.ts
CHANGED
|
@@ -18,4 +18,4 @@ export interface RenderOptions {
|
|
|
18
18
|
/** One page of a drawing as an SVG document, as Dottie's own SVG export draws it. */
|
|
19
19
|
export declare function render(source: string | DottieFile | unknown, options?: RenderOptions): string;
|
|
20
20
|
/** The library's version. */
|
|
21
|
-
export declare const VERSION = "0.5.
|
|
21
|
+
export declare const VERSION = "0.5.4";
|