text: !function(){"use strict";const t=[-.06405689286260563,.06405689286260563,-.1911188674736163,.1911188674736163,-.3150426796961634,.3150426796961634,-.4337935076260451,.4337935076260451,-.5454214713888396,.5454214713888396,-.6480936519369755,.6480936519369755,-.7401241915785544,.7401241915785544,-.820001985973903,.820001985973903,-.8864155270044011,.8864155270044011,-.9382745520027328,.9382745520027328,-.9747285559713095,.9747285559713095,-.9951872199970213,.9951872199970213],e=[.12793819534675216,.12793819534675216,.1258374563468283,.1258374563468283,.12167047292780339,.12167047292780339,.1155056680537256,.1155056680537256,.10744427011596563,.10744427011596563,.09761865210411388,.09761865210411388,.08619016153195327,.08619016153195327,.0733464814110803,.0733464814110803,.05929858491543678,.05929858491543678,.04427743881741981,.04427743881741981,.028531388628933663,.028531388628933663,.0123412297999872,.0123412297999872];function i(t,e){const i=e(t),s=i[0]*i[0]+i[1]*i[1];return Math.sqrt(s)}class s{constructor(t,e,i,s){this.points=[],this.dpoints=[],this._lut=[],this.order=3,this.points.push(t,e,i),s&&this.points.push(s),this.order=this.points.length-1,this.update()}update(){this._lut=[],this.dpoints=function(t){const e=[];for(let i=t,s=i.length,n=s-1;s>1;s--,n--){const t=[];let s=[0,0];for(let e=0;e<n;e++)s=[n*(i[e+1][0]-i[e][0]),n*(i[e+1][1]-i[e][1])],t.push(s);e.push(t),i=t}return e}(this.points)}length(){return function(s){let n=0;const r=t.length;for(let h=0;h<r;h++)n+=e[h]*i(.5*t[h]+.5,s);return.5*n}(this.derivative.bind(this))}derivative(t){const e=1-t;let i=0,s=0,n=0,r=this.dpoints[0];return 2===this.order?(r=[r[0],r[1],[0,0]],i=e,s=t):3===this.order&&(i=e*e,s=e*t*2,n=t*t),[i*r[0][0]+s*r[1][0]+n*r[2][0],i*r[0][1]+s*r[1][1]+n*r[2][1]]}getLUT(t=100){if(!t)return[];if(this._lut.length===t)return this._lut;this._lut=[],t--;for(let e=0;e<=t;e++)this._lut.push(this.compute(e/t));return this._lut}compute(t){return function(t,e){if(0===t)return e[0];const i=e.length-1;if(1===t)return e[i];let s=e;const n=1-t;if(0===i)return e[0];if(1===i)return[n*s[0][0]+t*s[1][0],n*s[0][1]+t*s[1][1]];if(i<4){const e=n*n,r=t*t;let h=0,o=0,a=0,l=0;return 2===i?(s=[s[0],s[1],s[2],[0,0]],o=e,a=n*t*2,l=r):3===i&&(o=e*n,a=e*t*3,l=n*r*3,h=t*r),[o*s[0][0]+a*s[1][0]+l*s[2][0]+h*s[3][0],o*s[0][1]+a*s[1][1]+l*s[2][1]+h*s[3][1]]}const r=JSON.parse(JSON.stringify(e));for(;r.length>1;){for(let e=0;e<r.length-1;e++)r[e]=[r[e][0]+(r[e+1][0]-r[e][0])*t,r[e][1]+(r[e+1][1]-r[e][1])*t];r.splice(r.length-1,1)}return r[0]}(t,this.points)}}const n=new Map;function r(t){const e=`${t.r}, ${t.g}, ${t.b}`;if(n.has(e))return n.get(e);let[i,s,r]=[t.r/255,t.g/255,t.b/255];i=i>.04045?Math.pow((i+.055)/1.055,2.4):i/12.92,s=s>.04045?Math.pow((s+.055)/1.055,2.4):s/12.92,r=r>.04045?Math.pow((r+.055)/1.055,2.4):r/12.92;let h=(.4124*i+.3576*s+.1805*r)/.95047,o=(.2126*i+.7152*s+.0722*r)/1,a=(.0193*i+.1192*s+.9505*r)/1.08883;h=h>.008856?Math.pow(h,1/3):7.787*h+16/116,o=o>.008856?Math.pow(o,1/3):7.787*o+16/116,a=a>.008856?Math.pow(a,1/3):7.787*a+16/116;const l={l:116*o-16,a:500*(h-o),b:200*(o-a)};return n.set(e,l),l}function h(t,e){if(e.length){const i=e.map((e=>({diff:function(t,e){const i=r(t),s=r(e);return Math.sqrt(Math.pow(s.l-i.l,2)+Math.pow(s.a-i.a,2)+Math.pow(s.b-i.b,2))}(t,e),color:e})));return i.sort(((t,e)=>t.diff-e.diff)),console.log(t,i[0]),i[0].color}return t}const o=new Map;function a(t,e,i,s){const{brickSize:n,color:r}=s;t.save(),t.fillStyle=r,t.shadowColor="rgba(0,0,0,0.5)",t.shadowBlur=3,t.shadowOffsetX=1,t.shadowOffsetY=1,t.beginPath(),t.rect(e,i,n,n),t.fill(),t.beginPath(),t.arc(e+n/2,i+n/2,function(t){if(o.has(t))return o.get(t);const e=Math.min(24,.5*t/2);return o.set(t,e),e}(n),0,2*Math.PI),t.fill(),t.restore()}function l(t,e,i,s){const n=s.brickSize;a(i,t*n,e*n,s)}function c(t,e,i,s=!1){s&&t.sort(((t,e)=>t[0]===e[0]?t[1]<e[1]?-1:t[1]>e[1]?1:0:t[0]<e[0]?-1:t[0]>e[0]?1:0));const n=i.brickSize;t.forEach((t=>{a(e,t[0]*n,t[1]*n,i)}))}function f(t,e,i,s,n=new Set){const r=[],h=t=>{const e=t.join(",");n.has(e)||(n.add(e),r.push(t))};if(t===i){const i=Math.min(e,s),n=Math.max(e,s);for(let e=i;e<=n;e++)h([t,e])}else{const n=s-e,r=i-t,o=n/r,a=e-o*t;if(Math.abs(r)>=Math.abs(n)){const e=Math.min(t,i),s=Math.max(t,i);for(let t=e;t<=s;t++)h([t,Math.round(o*t+a)])}else{const t=Math.min(e,s),i=Math.max(e,s);for(let e=t;e<=i;e++)h([Math.round((e-a)/o),e])}}return r}function u(t,e=new Set){let i=[];for(let s=0;s<t.length-1;s++){const[n,r]=t[s],[h,o]=t[s+1],a=f(n,r,h,o,e);i=[...i,...a]}return i}function d(t,e,i,s,n,r,h=!1){if(r.filled||h)for(let h=0;h<i;h++)for(let i=0;i<s;i++)l(t+h,e+i,n,r);else i>0&&s>0&&p([[t,e],[t+i-1,e],[t+i-1,e+s-1],[t,e+s-1],[t,e]],n,r)}function g(t,e,i,s,n,r){c(f(t,e,i,s),n,r)}function p(t,e,i){c(u(t),e,i,!0)}function _(t,e,i,s,n,r){let h=0,o=s;const a=i*i,l=s*s,f=-(a/4+i%2+l),u=-(l/4+s%2+a),g=-(l/4+s%2);let p=-a*o,_=2*l*h,w=-2*a*o;const y=2*l,m=2*a,M=()=>{h++,_+=y,p+=_},b=()=>{o--,w+=m,p+=w};if(r.filled){const c=[];let _=h,w=o,y=1,m=1;const k=(t,e,i,s)=>{s<0&&(e+=s+1,s=Math.abs(s)),c.push({x:t,y:e,width:i,height:s})};if(0===s)k(t-1,e,2*i+1,1);else{for(;o>=0&&h<=i;)p+l*h<=f||p+a*o<=g?(1===m||(2*w+1>2*(m-1)?(k(t-_,e-w,y,m-1),k(t-_,e+w,y,1-m),w-=m-1,m=1):(k(t-_,e-w,y,2*w+1),w-=w,m=1)),M(),_++,y+=2):p-a*o>u?(b(),m++):(2*w+1>2*m?(k(t-_,e-w,y,m),k(t-_,e+w,y,-m)):k(t-_,e-w,y,2*w+1),M(),b(),_++,y+=2,w-=m,m=1);w>m?(k(t-_,e-w,y,m),k(t-_,e+w+1,y,-m)):k(t-_,e-w,y,2*w+1)}c.forEach((t=>{t.height<0&&(t.y+=t.height+1,t.height=Math.abs(t.height))})),c.sort(((t,e)=>t.y-e.y)),c.forEach((t=>d(t.x,t.y,t.width,t.height,n,r,!0)))}else{const s=[];for(;o>=0&&h<=i;)s.push([t+h,e+o]),0===h&&0===o||s.push([t-h,e-o]),0!==h&&0!==o&&(s.push([t+h,e-o]),s.push([t-h,e+o])),p+l*h<=f||p+a*o<=g?M():(p-a*o>u||M(),b());c(s,n,r,!0)}}function w(t,e,i){if(0===t.length)return;if(1===t.length)return void l(t[0][0],t[0][1],e,i);if(2===t.length){const[[s,n],[r,h]]=t;return void g(s,n,r,h,e,i)}const s=[...t];if(s[0].join(",")!==s[s.length-1].join(",")&&s.push([s[0][0],s[0][1]]),i.filled){const t=new Set;let n=u(s,t);const r=[];for(let t=0;t<s.length-1;t++){const e=s[t],i=s[t+1];if(e[1]!==i[1]){const t=Math.min(e[1],i[1]);r.push({ymin:t,ymax:Math.max(e[1],i[1]),x:t===e[1]?e[0]:i[0],islope:(i[0]-e[0])/(i[1]-e[1])})}}r.sort(((t,e)=>t.ymin<e.ymin?-1:t.ymin>e.ymin?1:t.x<e.x?-1:t.x>e.x?1:t.ymax===e.ymax?0:(t.ymax-e.ymax)/Math.abs(t.ymax-e.ymax)));let h=[],o=r[0].ymin;for(;h.length||r.length;){if(r.length){let t=-1;for(let e=0;e<r.length&&!(r[e].ymin>o);e++)t=e;r.splice(0,t+1).forEach((t=>{h.push({s:o,edge:t})}))}if(h=h.filter((t=>t.edge.ymax!==o)),h.sort(((t,e)=>t.edge.x===e.edge.x?0:(t.edge.x-e.edge.x)/Math.abs(t.edge.x-e.edge.x))),h.length>1)for(let e=0;e<h.length;e+=2){const i=e+1;if(i>=h.length)break;const s=h[e].edge,r=h[i].edge;n=n.concat(f(Math.round(s.x),o,Math.round(r.x),o,t))}o++,h.forEach((t=>{t.edge.x=t.edge.x+t.edge.islope}))}c(n,e,i,!0)}else p(s,e,i)}class y{constructor(t,e=24,i){this.defaultOptions={brickSize:24,color:"#2196F3",filled:!1,palette:[]},this.ctx=t,this.defaultOptions.brickSize=e,i&&(i.color&&(this.defaultOptions.color=i.color),"boolean"==typeof i.filled&&(this.defaultOptions.filled=i.filled),i.palette&&(this.defaultOptions.palette=i.palette))}opt(t){return t?Object.assign({},this.defaultOptions,t):this.defaultOptions}line(t,e,i,s,n){g(t,e,i,s,this.ctx,this.opt(n))}linearPath(t,e){p(t,this.ctx,this.opt(e))}rectangle(t,e,i,s,n){d(t,e,i,s,this.ctx,this.opt(n))}circle(t,e,i,s){!function(t,e,i,s,n){_(t,e,i,i,s,n)}(t,e,i,this.ctx,this.opt(s))}ellipse(t,e,i,s,n){_(t,e,i,s,this.ctx,this.opt(n))}polygon(t,e){w(t,this.ctx,this.opt(e))}arc(t,e,i,s,n,r,h,o){!function(t,e,i,s,n,r,h,o,a){let l=Math.min(n,r),c=Math.max(n,r);if(l===c)return;if(i<=0||s<=0)return;c-l>2*Math.PI&&(l=0,c=2*Math.PI);const f=Math.round(2*Math.sqrt((i*i+s*s)/2)*(c-l)),u=(c-l)/f,d=new Set,g=[];for(let n=0;n<=f;n++){const r=l+n*u,h=Math.cos(r),o=Math.sin(r),a=i*s/Math.sqrt(s*s*h*h+i*i*o*o),c=[t+Math.round(a*h),e+Math.round(a*o)],f=c.join(",");d.has(f)||(d.add(f),g.push(c))}if(h){const i=[t,e],s=i.join(",");d.has(s)||(d.add(s),g.push(i)),w(g,o,a)}else p(g,o,a)}(t,e,i,s,n,r,h,this.ctx,this.opt(o))}bezierCurve(t,e,i,n,r,h,o,a,l){!function(t,e,i,n,r,h,o,a,l,c){const f=new s([t,e],[i,n],[r,h],[o,a]),u=f.getLUT(f.length()).map((t=>[Math.round(t[0]),Math.round(t[1])]));u.push([o,a]),c.filled?w(u,l,c):p(u,l,c)}(t,e,i,n,r,h,o,a,this.ctx,this.opt(l))}quadraticCurve(t,e,i,n,r,h,o){!function(t,e,i,n,r,h,o,a){const l=new s([t,e],[i,n],[r,h]),c=l.getLUT(l.length()).map((t=>[Math.round(t[0]),Math.round(t[1])]));c.push([r,h]),a.filled?w(c,o,a):p(c,o,a)}(t,e,i,n,r,h,this.ctx,this.opt(o))}drawImage(t,e,i,s,n,r){!function(t,e,i,s,n,r,o){const a=e.brickSize;r||(r=[0,0]),o||(o=[i.width,i.height]),n||(n=[Math.round(o[0]/a),Math.round(o[1]/a)]);const[c,f]=n,u="undefined"!=typeof OffscreenCanvas?new OffscreenCanvas(c,f):document.createElement("canvas");u.width=c,u.height=f;const d=u.getContext("2d");d.drawImage(i,r[0],r[1],o[0],o[1],0,0,n[0],n[1]);const g=d.getImageData(0,0,c,f),p=new Map;for(let i=0;i<f;i++)for(let n=0;n<c;n++){let r={r:g.data[i*c*4+4*n],g:g.data[i*c*4+4*n+1],b:g.data[i*c*4+4*n+2]};if(e.palette&&e.palette.length){const t=`${r.r},${r.g},${r.b}`;if(p.has(t))r=p.get(t);else{const i=h(r,e.palette);p.set(t,i),r=i}}const o={brickSize:a,color:`rgb(${r.r}, ${r.g}, ${r.b})`,filled:!1,palette:[]};l(s[0]+n,s[1]+i,t,o)}}(this.ctx,this.opt(r),t,e,i,s,n)}}class m extends HTMLElement{constructor(){super(),this._src="",this._n=0,this._r=3,this._c="#000000",this._sampling=50,this.refreshing=!1,this.messageHandler=t=>{if(this.worker){const{points:s,iteration:n}=t.data;if(this.stippleData=s,this.draw(),50===n){const t=this.worker;setTimeout((()=>{t===this.worker&&this.terminateWorker()}))}e=50===n?"load":"render",this.dispatchEvent(new CustomEvent(e,{bubbles:!0,composed:!0,detail:i}))}var e,i},this.root=this.attachShadow({mode:"open"}),this.root.innerHTML="\n    <style>\n      :host {\n        display: inline-block;\n        overflow: hidden;\n      }\n      canvas {\n        display: block;\n      }\n    </style>\n    <canvas></canvas>\n    "}static get observedAttributes(){return["width","height","src","points","color","radius","sampling"]}attributeChangedCallback(t,e,i){switch(t){case"width":this.width=+i;break;case"height":this.height=+i;break;case"points":this.points=+i;break;case"src":this.src=i;break;case"radius":this.radius=+i;break;case"color":this.color=i;break;case"sampling":this.sampling=+i}}connectedCallback(){this.refresh()}disconnectedCallback(){this.terminateWorker(),this._workerUrl&&(URL.revokeObjectURL(this._workerUrl),this._workerUrl=void 0)}get workerUrl(){if(!this._workerUrl){const t=new Blob(['\nvar stipple=function(t){"use strict";const i=Math.pow(2,-52),s=new Uint32Array(512);class n{static from(t,i=c,s=u){const e=t.length,h=new Float64Array(2*e);for(let n=0;n<e;n++){const e=t[n];h[2*n]=i(e),h[2*n+1]=s(e)}return new n(h)}constructor(t){const i=t.length>>1;if(i>0&&"number"!=typeof t[0])throw new Error("Expected coords to contain numbers.");this.coords=t;const s=Math.max(2*i-5,0);this._triangles=new Uint32Array(3*s),this._halfedges=new Int32Array(3*s),this._hashSize=Math.ceil(Math.sqrt(i)),this._hullPrev=new Uint32Array(i),this._hullNext=new Uint32Array(i),this._hullTri=new Uint32Array(i),this._hullHash=new Int32Array(this._hashSize).fill(-1),this._ids=new Uint32Array(i),this._dists=new Float64Array(i),this.update()}update(){const{coords:t,_hullPrev:s,_hullNext:n,_hullTri:h,_hullHash:l}=this,f=t.length>>1;let c=1/0,u=1/0,d=-1/0,_=-1/0;for(let i=0;i<f;i++){const s=t[2*i],n=t[2*i+1];s<c&&(c=s),n<u&&(u=n),s>d&&(d=s),n>_&&(_=n),this._ids[i]=i}const g=(c+d)/2,y=(u+_)/2;let w,A,M,p=1/0;for(let i=0;i<f;i++){const s=e(g,y,t[2*i],t[2*i+1]);s<p&&(w=i,p=s)}const b=t[2*w],k=t[2*w+1];p=1/0;for(let i=0;i<f;i++){if(i===w)continue;const s=e(b,k,t[2*i],t[2*i+1]);s<p&&s>0&&(A=i,p=s)}let x=t[2*A],m=t[2*A+1],S=1/0;for(let i=0;i<f;i++){if(i===w||i===A)continue;const s=a(b,k,x,m,t[2*i],t[2*i+1]);s<S&&(M=i,S=s)}let U=t[2*M],z=t[2*M+1];if(S===1/0){for(let i=0;i<f;i++)this._dists[i]=t[2*i]-t[0]||t[2*i+1]-t[1];o(this._ids,this._dists,0,f-1);const i=new Uint32Array(f);let s=0;for(let t=0,n=-1/0;t<f;t++){const e=this._ids[t];this._dists[e]>n&&(i[s++]=e,n=this._dists[e])}return this.hull=i.subarray(0,s),this.triangles=new Uint32Array(0),void(this.halfedges=new Uint32Array(0))}if(r(b,k,x,m,U,z)){const t=A,i=x,s=m;A=M,x=U,m=z,M=t,U=i,z=s}const I=function(t,i,s,n,e,h){const r=s-t,l=n-i,a=e-t,o=h-i,f=r*r+l*l,c=a*a+o*o,u=.5/(r*o-l*a);return{x:t+(o*f-l*c)*u,y:i+(r*c-a*f)*u}}(b,k,x,m,U,z);this._cx=I.x,this._cy=I.y;for(let i=0;i<f;i++)this._dists[i]=e(t[2*i],t[2*i+1],I.x,I.y);o(this._ids,this._dists,0,f-1),this._hullStart=w;let T=3;n[w]=s[M]=A,n[A]=s[w]=M,n[M]=s[A]=w,h[w]=0,h[A]=1,h[M]=2,l.fill(-1),l[this._hashKey(b,k)]=w,l[this._hashKey(x,m)]=A,l[this._hashKey(U,z)]=M,this.trianglesLen=0,this._addTriangle(w,A,M,-1,-1,-1);for(let e,a,o=0;o<this._ids.length;o++){const f=this._ids[o],c=t[2*f],u=t[2*f+1];if(o>0&&Math.abs(c-e)<=i&&Math.abs(u-a)<=i)continue;if(e=c,a=u,f===w||f===A||f===M)continue;let d=0;for(let t=0,i=this._hashKey(c,u);t<this._hashSize&&(d=l[(i+t)%this._hashSize],-1===d||d===n[d]);t++);d=s[d];let _,g=d;for(;_=n[g],!r(c,u,t[2*g],t[2*g+1],t[2*_],t[2*_+1]);)if(g=_,g===d){g=-1;break}if(-1===g)continue;let y=this._addTriangle(g,f,n[g],-1,-1,h[g]);h[f]=this._legalize(y+2),h[g]=y,T++;let p=n[g];for(;_=n[p],r(c,u,t[2*p],t[2*p+1],t[2*_],t[2*_+1]);)y=this._addTriangle(p,f,_,h[f],-1,h[p]),h[f]=this._legalize(y+2),n[p]=p,T--,p=_;if(g===d)for(;_=s[g],r(c,u,t[2*_],t[2*_+1],t[2*g],t[2*g+1]);)y=this._addTriangle(_,f,g,-1,h[g],h[_]),this._legalize(y+2),h[_]=y,n[g]=g,T--,g=_;this._hullStart=s[f]=g,n[g]=s[p]=f,n[f]=p,l[this._hashKey(c,u)]=f,l[this._hashKey(t[2*g],t[2*g+1])]=g}this.hull=new Uint32Array(T);for(let t=0,i=this._hullStart;t<T;t++)this.hull[t]=i,i=n[i];this.triangles=this._triangles.subarray(0,this.trianglesLen),this.halfedges=this._halfedges.subarray(0,this.trianglesLen)}_hashKey(t,i){return Math.floor(function(t,i){const s=t/(Math.abs(t)+Math.abs(i));return(i>0?3-s:1+s)/4}(t-this._cx,i-this._cy)*this._hashSize)%this._hashSize}_legalize(t){const{_triangles:i,_halfedges:n,coords:e}=this;let h=0,r=0;for(;;){const a=n[t],o=t-t%3;if(r=o+(t+2)%3,-1===a){if(0===h)break;t=s[--h];continue}const f=a-a%3,c=o+(t+1)%3,u=f+(a+2)%3,d=i[r],_=i[t],g=i[c],y=i[u];if(l(e[2*d],e[2*d+1],e[2*_],e[2*_+1],e[2*g],e[2*g+1],e[2*y],e[2*y+1])){i[t]=y,i[a]=d;const e=n[u];if(-1===e){let i=this._hullStart;do{if(this._hullTri[i]===u){this._hullTri[i]=t;break}i=this._hullPrev[i]}while(i!==this._hullStart)}this._link(t,e),this._link(a,n[r]),this._link(r,u);const l=f+(a+1)%3;h<s.length&&(s[h++]=l)}else{if(0===h)break;t=s[--h]}}return r}_link(t,i){this._halfedges[t]=i,-1!==i&&(this._halfedges[i]=t)}_addTriangle(t,i,s,n,e,h){const r=this.trianglesLen;return this._triangles[r]=t,this._triangles[r+1]=i,this._triangles[r+2]=s,this._link(r,n),this._link(r+1,e),this._link(r+2,h),this.trianglesLen+=3,r}}function e(t,i,s,n){const e=t-s,h=i-n;return e*e+h*h}function h(t,i,s,n,e,h){const r=(n-i)*(e-t),l=(s-t)*(h-i);return Math.abs(r-l)>=33306690738754716e-32*Math.abs(r+l)?r-l:0}function r(t,i,s,n,e,r){return(h(e,r,t,i,s,n)||h(t,i,s,n,e,r)||h(s,n,e,r,t,i))<0}function l(t,i,s,n,e,h,r,l){const a=t-r,o=i-l,f=s-r,c=n-l,u=e-r,d=h-l,_=f*f+c*c,g=u*u+d*d;return a*(c*g-_*d)-o*(f*g-_*u)+(a*a+o*o)*(f*d-c*u)<0}function a(t,i,s,n,e,h){const r=s-t,l=n-i,a=e-t,o=h-i,f=r*r+l*l,c=a*a+o*o,u=.5/(r*o-l*a),d=(o*f-l*c)*u,_=(r*c-a*f)*u;return d*d+_*_}function o(t,i,s,n){if(n-s<=20)for(let e=s+1;e<=n;e++){const n=t[e],h=i[n];let r=e-1;for(;r>=s&&i[t[r]]>h;)t[r+1]=t[r--];t[r+1]=n}else{let e=s+1,h=n;f(t,s+n>>1,e),i[t[s]]>i[t[n]]&&f(t,s,n),i[t[e]]>i[t[n]]&&f(t,e,n),i[t[s]]>i[t[e]]&&f(t,s,e);const r=t[e],l=i[r];for(;;){do{e++}while(i[t[e]]<l);do{h--}while(i[t[h]]>l);if(h<e)break;f(t,e,h)}t[s+1]=t[h],t[h]=r,n-e+1>=h-s?(o(t,i,e,n),o(t,i,s,h-1)):(o(t,i,s,h-1),o(t,i,e,n))}}function f(t,i,s){const n=t[i];t[i]=t[s],t[s]=n}function c(t){return t[0]}function u(t){return t[1]}function d(t,i,s){return[t+Math.sin(t+i)*s,i+Math.cos(t-i)*s]}class _{constructor(t,[i,s,e,h]){if(!((e=+e)>=(i=+i)&&(h=+h)>=(s=+s)))throw new Error("invalid bounds");this.points=t,this.delaunator=new n(t),this.inedges=new Int32Array(t.length/2),this.hullIndex=new Int32Array(t.length/2),this.init()}update(){this.delaunator.update(),this.init()}find(t,i,s=0){if((t=+t)!=t||(i=+i)!=i)return-1;const n=s;let e;for(;(e=this.step(s,t,i))>=0&&e!==s&&e!==n;)s=e;return e}init(){const t=this.delaunator,i=this.points;if(t.hull&&t.hull.length>2&&function(t){const{triangles:i,coords:s}=t;for(let t=0;t<i.length;t+=3){const n=2*i[t],e=2*i[t+1],h=2*i[t+2];if((s[h]-s[n])*(s[e+1]-s[n+1])-(s[e]-s[n])*(s[h+1]-s[n+1])>1e-10)return!1}return!0}(t)){this.collinear=Int32Array.from({length:i.length/2},(t,i)=>i).sort((t,s)=>i[2*t]-i[2*s]||i[2*t+1]-i[2*s+1]);const t=this.collinear[0],s=this.collinear[this.collinear.length-1],e=[i[2*t],i[2*t+1],i[2*s],i[2*s+1]],h=1e-8*Math.sqrt((e[3]-e[1])**2+(e[2]-e[0])**2);for(let t=0,s=i.length/2;t<s;++t){const s=d(i[2*t],i[2*t+1],h);i[2*t]=s[0],i[2*t+1]=s[1]}this.delaunator=new n(i)}else delete this.collinear;const s=this.halfedges=this.delaunator.halfedges,e=this.hull=this.delaunator.hull,h=this.triangles=this.delaunator.triangles,r=this.inedges.fill(-1),l=this.hullIndex.fill(-1);for(let t=0,i=s.length;t<i;++t){const i=h[t%3==2?t-2:t+1];-1!==s[t]&&-1!==r[i]||(r[i]=t)}for(let t=0,i=e.length;t<i;++t)l[e[t]]=t;e.length<=2&&e.length>0&&(this.triangles=new Int32Array(3).fill(-1),this.halfedges=new Int32Array(3).fill(-1),this.triangles[0]=e[0],this.triangles[1]=e[1],this.triangles[2]=e[1],r[e[0]]=1,2===e.length&&(r[e[1]]=0))}step(t,i,s){const{inedges:n,hullIndex:e,points:h}=this,r=this.triangles,l=this.halfedges,a=this.hull;if(-1===n[t]||!h.length)return(t+1)%(h.length>>1);let o=t,f=(i-h[2*t])**2+(s-h[2*t+1])**2;const c=n[t];let u=c;do{const n=r[u],c=(i-h[2*n])**2+(s-h[2*n+1])**2;if(c<f&&(f=c,o=n),u=u%3==2?u-2:u+1,r[u]!==t)break;if(u=l[u],-1===u){if(u=a[(e[t]+1)%a.length],u!==n&&(i-h[2*u])**2+(s-h[2*u+1])**2<f)return u;break}}while(u!==c);return o}}function g(t,i){const s=4*t;return 1-(.299*i[s]+.587*i[s+1]+.114*i[s+2])/254}return t.stipple=function(t,i,s,n,e,h){const r=n||i*s/50;e=e||[80];const l=Math.max(...e),a=new Float32Array(2*r),o=new Uint8ClampedArray(t),f=new Float64Array(2*r),c=new Float64Array(r);for(let t=0;t<r;++t)for(let n=0;n<60;++n){const n=a[2*t]=Math.floor(Math.random()*i),e=a[2*t+1]=Math.floor(Math.random()*s);if(Math.random()<g(e*i+n,o))break}const u=new _(a,[0,0,i,s]);for(let t=0;t<=l;++t){f.fill(0),c.fill(0);for(let t=0,n=0;t<s;++t)for(let s=0;s<i;++s){const e=g(t*i+s,o);n=u.find(s+.5,t+.5,n),c[n]+=e,f[2*n]+=e*(s+.5),f[2*n+1]+=e*(t+.5)}const n=10*Math.pow(t+1,-.8);for(let t=0;t<r;++t){const i=a[2*t],s=a[2*t+1],e=c[t]?f[2*t]/c[t]:i,h=c[t]?f[2*t+1]/c[t]:s;a[2*t]=i+1.8*(e-i)+(Math.random()-.5)*n,a[2*t+1]=s+1.8*(h-s)+(Math.random()-.5)*n}u.update(),h&&e.indexOf(t)>=0&&h({points:a,width:i,height:s,iteration:t})}return{points:a,width:i,height:s,iteration:l}},t}({});\n\nself.addEventListener(\'message\', (event) => {\n  const {buffer, width, height, pointCount} = event.data;\n  const iterations = [2, 5, 10, 15, 20, 25, 30, 35, 40, 45, 50];\n  stipple.stipple(\n    buffer,\n    width,\n    height,\n    pointCount,\n    iterations,\n    (info) => {\n      self.postMessage(info);\n    }\n  );\n});\n'],{type:"text/javascript"});this._workerUrl=URL.createObjectURL(t)}return this._workerUrl}get canvas(){return this.canvasElement||(this.canvasElement=this.root.querySelector("canvas")),this.canvasElement}get width(){return this._w||this._i&&this._i.width||0}get height(){return this._h||this._i&&this._i.height||0}set width(t){this._w!==t&&(this._w=t,this.refresh())}set height(t){this._h!==t&&(this._h=t,this.refresh())}get points(){return Math.min(2e4,this._n||this.width*this.height/this.sampling)}set points(t){t=Math.min(2e4,t),this._n!==t&&(this._n=t,this.refresh())}get src(){return this._src}set src(t){this._src!==t&&(this._src=t,this.refresh())}get color(){return this._c}set color(t){this._c!==t&&(this._c=t,this.draw())}get radius(){return this._r}set radius(t){this._r!==t&&(this._r=t,this.draw())}get sampling(){return this._sampling}set sampling(t){this._sampling!==t&&(this._sampling=t,this.refresh())}refresh(){this.refreshing||(this.refreshing=!0,this.doRefresh().then((()=>this.refreshing=!1)).catch((()=>this.refreshing=!1)))}async doRefresh(){if(this.terminateWorker(),!this._src)return;const t=this._i=await this.loadImage(this._src),{width:e,height:i}=this,s=this.createContext([e,i]);s.drawImage(t,0,0,t.width,t.height,0,0,e,i);const n=s.getImageData(0,0,e,i);this.canvas.width=e,this.canvas.height=i,this.worker=new Worker(this.workerUrl),this.worker.addEventListener("message",this.messageHandler),this.worker.postMessage({buffer:n.data.buffer,width:e,height:i,pointCount:this.points},[n.data.buffer])}async loadImage(t){return this._i&&this._i.src===t?this._i:new Promise(((e,i)=>{const s=new Image;s.crossOrigin="anonymous",s.onload=()=>e(s),s.onerror=()=>i(),s.onabort=()=>i(),s.src=t}))}createContext(t){const e="OffscreenCanvas"in window?new OffscreenCanvas(t[0],t[1]):document.createElement("canvas");return e.width=t[0],e.height=t[1],e.getContext("2d")}terminateWorker(){if(this.worker){this.worker.removeEventListener("message",this.messageHandler);try{this.worker.terminate()}catch(t){console.log(t)}this.worker=void 0}}draw(){const t=this.canvas;if(t){const e=this.canvas.getContext("2d");if(e.clearRect(0,0,t.width,t.height),!this.stippleData)return;e.fillStyle=this.color,e.beginPath();for(let t=0;t<this.stippleData.length-1;t+=2){const i=this.stippleData[t],s=this.stippleData[t+1];e.moveTo(i,s),e.arc(i,s,this.radius,0,2*Math.PI)}e.fill(),e.closePath()}}}customElements.define("stippled-image",m);const M=document.getElementById("range"),b=document.querySelector("#legraCanvas"),k=b.getContext("2d"),x=document.querySelector("#radioPanel"),v=document.querySelector("#rLego"),A=document.querySelector("#rNormal"),S=document.querySelector("stippled-image"),I=document.querySelector("#faceImage"),U=document.querySelector("#rangeContainer"),E=async()=>{try{const t=new y(k,M.value),e=await(async t=>new Promise(((e,i)=>{const s=new Image;s.crossOrigin="Anonymous",s.addEventListener("load",(()=>{e(s)})),s.addEventListener("error",(()=>{i(new Error("Failed to load image"))})),s.addEventListener("abort",(()=>{i(new Error("Image load aborted"))})),s.src=t})))("/stuff/face.jpg");k.clearRect(0,0,b.width,b.height),t.drawImage(e,[0,0],[Math.ceil(b.width/M.value),Math.ceil(b.height/M.value)])}catch(t){console.error(t)}};let z="normal";const C=()=>{switch(z){case"lego":E();break;case"stippled":(()=>{const t=95/24*M.value-18.75;S.src="/stuff/face.jpg",S.sampling=t})()}};A.checked=!0,x.addEventListener("change",(()=>{v.checked?(z="lego",b.style.display="block",S.style.display="none",I.style.display="none",U.style.visibility="visible"):A.checked?(z="normal",b.style.display="none",S.style.display="none",I.style.display="block",U.style.visibility="hidden"):(z="stippled",b.style.display="none",S.style.display="block",I.style.display="none",U.style.visibility="visible"),C()})),M.addEventListener("input",(()=>{C()}))}();
  