webgl2-sdf 0.0.5 → 0.0.6
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/browser/index.min.js +1 -1
- package/node/generate-sdf.js +7 -6
- package/node/generate-sdf.js.map +1 -1
- package/node/main-program.js +2 -3
- package/node/main-program.js.map +1 -1
- package/node/shaders/vertex.d.ts +1 -1
- package/node/shaders/vertex.js +1 -5
- package/node/shaders/vertex.js.map +1 -1
- package/node/types/gl-context.d.ts +1 -1
- package/node/webgl-utils/get-web-gl-context.js +6 -14
- package/node/webgl-utils/get-web-gl-context.js.map +1 -1
- package/package.json +1 -1
- package/src/debug-shaders.ts +4 -4
- package/src/generate-sdf.ts +8 -9
- package/src/main-program.ts +2 -3
- package/src/shaders/vertex.ts +1 -5
- package/src/types/gl-context.ts +1 -1
- package/src/webgl-utils/get-web-gl-context.ts +8 -18
package/browser/index.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
const n=32,e={};function t(n,e,t){const r=n.createShader(t);return n.shaderSource(r,e),n.compileShader(r),r}function r(n,e,t){const{gl:r,textures:o}=n;r.activeTexture(r.TEXTURE0+e);let s=o[t];return s?r.bindTexture(r.TEXTURE_2D,s.tex):(s=o[t]={tex:r.createTexture()},r.bindTexture(r.TEXTURE_2D,s.tex),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_MIN_FILTER,r.NEAREST),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_MAG_FILTER,r.NEAREST),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_WRAP_S,r.CLAMP_TO_EDGE),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_WRAP_T,r.CLAMP_TO_EDGE)),s}const{BYTE:o,UNSIGNED_BYTE:s,SHORT:i,UNSIGNED_SHORT:c,INT:l,UNSIGNED_INT:u,FLOAT:a,HALF_FLOAT:d,INT_2_10_10_10_REV:f,UNSIGNED_INT_2_10_10_10_REV:g}=WebGL2RenderingContext;function h(n){return(e,t,r)=>{const{gl:o,uniformBlocks:s,program:i}=n;let c=s[e];if(void 0===s[e]){const n=o.getUniformBlockIndex(i,e);o.uniformBlockBinding(i,n,t);const r=o.createBuffer();o.bindBuffer(o.UNIFORM_BUFFER,r),c={blockName:e,blockIndex:n,buf:r},s[e]=c}else o.bindBuffer(o.UNIFORM_BUFFER,c.buf);const{buf:l}=c;o.bufferData(o.UNIFORM_BUFFER,r,o.STATIC_DRAW),o.bindBufferBase(o.UNIFORM_BUFFER,t,l)}}function x(n){const e=n[0][0],t=n[0][1];for(let r=1;r<n.length;r++)if(e!==n[r][0]||t!==n[r][1])return!1;return!0}function I(n,e){if(0===e)return n[0];if(1===e)return n[n.length-1];if(4===n.length){const[[t,r],[o,s],[i,c],[l,u]]=n,a=t+(o-t)*e,d=o+(i-o)*e,f=a+(d-a)*e,g=r+(s-r)*e,h=s+(c-s)*e,x=g+(h-g)*e;return[f+(d+(i+(l-i)*e-d)*e-f)*e,x+(h+(c+(u-c)*e-h)*e-x)*e]}if(3===n.length){const[[t,r],[o,s],[i,c]]=n,l=t+(o-t)*e,u=r+(s-r)*e;return[l+(o+(i-o)*e-l)*e,u+(s+(c-s)*e-u)*e]}if(2===n.length){const[[t,r],[o,s]]=n;return[t+(o-t)*e,r+(s-r)*e]}if(1===n.length)return n[0];throw new Error("The given bezier curve must be of order <= 3.")}const{sqrt:_}=Math;function p(n,e){const t=n[0],r=n[1],o=e[0],s=e[1],i=r-s,c=o-t,l=t*s-o*r,u=_(i*i+c*c);return function(n){const e=n[0],o=n[1];return 0!==u?(i*e+c*o+l)/u:_((e-t)**2+(o-r)**2)}}{const n=[10,1];p([6,2],[6,2])(n)}function v(n,e,t){if(4===n.length)return function(n,e,t){return 0===e?1===t?n:function(n,e){const t=n[0],r=n[1],o=n[2],s=n[3],i=t[0],c=t[1],l=r[0],u=r[1],a=o[0],d=o[1],f=i-e*(i-l),g=l-e*(l-a),h=f-e*(f-g),x=c-e*(c-u),I=u-e*(u-d),_=x-e*(x-I);return[t,[f,x],[h,_],[h-e*(h-(g-e*(g-(a-e*(a-s[0]))))),_-e*(_-(I-e*(I-(d-e*(d-s[1])))))]]}(n,t):1===t?function(n,e){const t=n[0],r=n[1],o=n[2],s=n[3],i=t[0],c=t[1],l=r[0],u=r[1],a=o[0],d=o[1],f=i-e*(i-l),g=l-e*(l-a),h=a-e*(a-s[0]),x=f-e*(f-g),I=g-e*(g-h),_=c-e*(c-u),p=u-e*(u-d),v=d-e*(d-s[1]),m=_-e*(_-p),C=p-e*(p-v);return[[x-e*(x-I),m-e*(m-C)],[I,C],[h,v],s]}(n,e):function(n,e,t){const r=n[0],o=n[1],s=n[2],i=n[3],c=r[0],l=r[1],u=o[0],a=o[1],d=s[0],f=s[1],g=e*e,h=e*g,x=t*t,I=t*x,_=e*t,p=c-u,v=d-u,m=p+v,C=e*p,S=t*p,R=i[0]-c-3*v,E=l-a,T=f-a,b=E+T,w=e*E,A=t*E,P=i[1]-l-3*T;return[[h*R+(3*e*(e*m-p)+c),h*P+(3*e*(e*b-E)+l)],[_*(e*R+2*m)+(g*m+c-(S+2*C)),_*(e*P+2*b)+(g*b+l-(A+2*w))],[_*(t*R+2*m)+(x*m+c-(2*S+C)),_*(t*P+2*b)+(x*b+l-(2*A+w))],[I*R+(3*t*(t*m-p)+c),I*P+(3*t*(t*b-E)+l)]]}(n,e,t)}(n,e,t);if(3===n.length)return function(n,e,t){return 0===e?1===t?n:function(n,e){const t=n[0],r=n[1],o=n[2],s=t[0],i=t[1],c=r[0],l=r[1],u=e*e,a=s-c,d=i-l;return[t,[-e*a+s,-e*d+i],[u*(a+(o[0]-c))-(2*e*a-s),u*(d+(o[1]-l))-(2*e*d-i)]]}(n,t):1===t?function(n,e){const t=n[0],r=n[1],o=n[2],s=t[0],i=t[1],c=r[0],l=r[1],u=e*e,a=s-c,d=o[0]-c,f=i-l,g=o[1]-l;return[[u*(a+d)-(2*e*a-s),u*(f+g)-(2*e*f-i)],[e*d+c,e*g+l],o]}(n,e):function(n,e,t){const r=n[0],o=n[1],s=n[2],i=r[0],c=r[1],l=o[0],u=o[1],a=e*e,d=t*t,f=e*t,g=i-l,h=g+(s[0]-l),x=c-u,I=x+(s[1]-u);return[[a*h-(2*e*g-i),a*I-(2*e*x-c)],[f*h-(g*(t+e)-i),f*I-(x*(t+e)-c)],[d*h-(2*t*g-i),d*I-(2*t*x-c)]]}(n,e,t)}(n,e,t);throw new Error("The given bezier curve must be of order 2 or 3.")}function m(n,e){return[e[0]-n[0],e[1]-n[1]]}function C(n,e){return n[0]*e[0]+n[1]*e[1]}function S(n){const e=m(n[0],n[1]),t=m(n[1],n[3]),r=m(n[3],n[0]),o=m(n[0],n[2]),s=m(n[2],n[3]);return C(r,e)>0||C(t,r)>0||C(r,o)>0||C(s,r)>0}const{abs:R,max:E}=Math;function T(n){const e=p(n[0],n[3]),t=e(n[1]),r=e(n[2]);return(t*r<=0?4/9:3/4)*E(R(t),R(r))}function b(n){const e=m(n[0],n[1]),t=m(n[1],n[2]),r=m(n[2],n[0]);return C(r,e)>0||C(t,r)>0}const{abs:w}=Math;function A(n){if(n[0][0]===n[1][0]&&n[0][1]===n[1][1])return 0;const e=I(n,.5),t=p(n[0],n[2]);return w(t(e))}function P(n){const e=3===n.length?function(n){const e=[0],t=[1];for(;;){const r=e[e.length-1],o=t[t.length-1],s=v(n,r,o);if(!b(s)&&A(s)<=.5){if(e.push(t.pop()),1===o)return e;continue}const i=(r+o)/2;t.push(i)}}(n):function(n){const e=[0],t=[1];for(;;){const r=e[e.length-1],o=t[t.length-1],s=v(n,r,o);if(!S(s)&&T(s)<=.5){if(e.push(t.pop()),1===o)return e;continue}const i=(r+o)/2;t.push(i)}}(n),t=[];for(let r=0;r<e.length-1;r++){const o=I(n,e[r]),s=I(n,e[r+1]);t.push([o,s])}return t}function D(n){return Math.sqrt(n[0]*n[0]+n[1]*n[1])}const y=function(){const e=[{from:0,u:0,v:0}];for(let t=0;t<128;t++){e.push({from:t+.5,u:t+1,v:0}),e.push({from:t+.5,u:-t-1,v:0}),e.push({from:t+.5,u:0,v:t+1}),e.push({from:t+.5,u:0,v:-t-1});for(let r=0;r<n;r++){const n=D([.5+t,.5+r]),o=t+1,s=r+1;e.push({from:n,u:o,v:s}),0!==o&&e.push({from:n,u:-o,v:s}),0!==s&&e.push({from:n,u:o,v:-s}),0!==o&&0!==s&&e.push({from:n,u:-o,v:-s})}e.sort((n,e)=>n.from-e.from)}return e}(),{max:U,E:F}=Math;const{min:N,max:L,SQRT2:M}=Math;function k(e,t,r,o,s){const i=function(e,t,r,o,s){return function(i,c,l){let u=function(n){let e=function(n){let e=0,t=y.length-1,r=0;for(;e<=t;){r=e+t>>>1;const o=y[r].from;if(o===n)return r;n>o?e=r+1:t=r-1}return r}(n);if(n=U(0,n),0===e)return 0;for(;y[e].from===y[e-1].from;)e--;return e}((l-M*r)/r),a=Number.POSITIVE_INFINITY;for(;;){if(u>=y.length){a=r*(y[y.length-1].from-M);break}const{u:l,v:d,from:f}=y[u];if(r*f>o+M*r){a=r*(f-2*M);break}const g=l+i,h=d+c;if(g<0||g>=t+2*s||h<0||h>=n+2*s){u++;continue}const{lineSegs:x}=e[g][h];if(x.length>0){a=r*(f-M);break}u++}const{closeCells:d}=e[i][c];let f=L(0,u-1);for(;f<y.length;){const{from:l,u,v:g}=y[f];if(r*l>N(a,o)+2*M*r)break;const h=u+i,x=g+c;if(h<0||h>=t+2*s||x<0||x>=n+2*s){f++;continue}const{lineSegs:I}=e[h][x];I.length>0&&d.push((2*s+n)*h+x),f++}return a}}(e,t,r,o,s);let c=0,l=0;for(let e=s;e<t+s;e++){l=c;for(let t=s;t<n+s;t++)l=i(e,t,l),t===s&&(c=l)}}const{floor:O,ceil:B}=Math;function X(n,e,t,r,o,s){const i=r*s,[[c,l],[u,a]]=o,d=e+i,f=t+i,g=function(n,e){const[t,r]=n,[o,s]=t,[i,c]=r,[[l,u],[a,d]]=e,f=i-o,g=c-s,h=[];if(0!==f){const n=(l-o)/f;if(n>=0&&n<=1){const e=s+n*g;e>=u&&e<=d&&h.push({t:n,p:[l,e]})}const e=(a-o)/f;if(e>=0&&e<=1){const n=s+e*g;n>=u&&n<=d&&h.push({t:e,p:[a,n]})}}if(0!==g){const n=(u-s)/g;if(n>=0&&n<=1){const e=o+n*f;e>=l&&e<=a&&h.push({t:n,p:[e,u]})}const e=(d-s)/g;if(e>=0&&e<=1){const n=o+e*f;n>=l&&n<=a&&h.push({t:e,p:[n,d]})}}const x=new Set,I=h.filter(n=>{const{t:e}=n;return!x.has(e)&&(x.add(e),!0)});return I.sort((n,e)=>n.t-e.t).map(n=>n.p)}(o,[[-i,-i],[d,f]]),h=c>-i&&c<d&&l>-i&&l<f,x=u>-i&&u<d&&a>-i&&a<f;if(g.length<2&&!h&&!x)return;const I=u-c,_=a-l,p=u>c?r:-r,v=a>l?r:-r;let m=c,C=l,S=0;const R=p>0,E=v>0,T=R?O:B,b=E?O:B;for(;;){let e=r*T((m+p)/r),t=r*b((C+v)/r);const o=(e-c)/I,x=(t-l)/_,w=o<x&&0!==I||0===_,A=w?e:c+x*I,P=w?l+o*_:t;if((o>1||0===I)&&(x>1||0===_)){const e=O(u/r)+s,t=O(a/r)+s;n[e]?.[t]?.lineSegs.push([[m,C],[u,a]]);break}if(A<=-i||P<=-i||A>=d||P>=f){if(!h&&0===S){[m,C]=g[0],S++;continue}{const e=T(m/r)-(R?0:1)+s,t=b(C/r)-(E?0:1)+s,o=[[m,C],g[S]];n[e]?.[t]?.lineSegs.push(o);break}}const D=T(m/r)-(R?0:1)+s,y=b(C/r)-(E?0:1)+s;n[D]?.[y]?.lineSegs.push([[m,C],[A,P]]),m=A,C=P}}const G=256,{floor:Y,ceil:j}=Math;function Q(n,e,t){const r=e/n.length,[o,s]=t,i=function(n,e){const[t,r]=n,[o,s]=t,[i,c]=r,[l,u,a]=e,d=i-o,f=c-s,g=[],h=[];if(0!==d){const n=(l-o)/d;if(n>=0&&n<=1){const e=s+n*f;e>=u&&e<=a&&(g.push(n),h.push([l,e]))}}if(0!==f){const n=(u-s)/f;if(n>=0&&n<=1){const e=o+n*d;e<=l&&(g.push(n),h.push([e,u]))}const e=(a-s)/f;if(e>=0&&e<=1){const n=o+e*d;n<=l&&(g.push(e),h.push([n,a]))}}return 2===g.length?g[0]<g[1]?h:[h[1],h[0]]:h}(t,[0,0,e]),[c,l]=o,[u,a]=s,d=u-c,f=a-l,g=c<0&&l>0&&l<e,h=u<0&&a>0&&a<e;if(i.length<2&&!g&&!h&&(0!==c||0!==d||l<=0&&a<=0||l>=e&&a>=e))return;if(0===f)return;const x=a>l?r:-r;let I=c,_=l,p=0;const v=u>c,m=a>l,C=m?Y:j;for(;;){let t=v&&I<0||!v&&I>0?0:Number.NEGATIVE_INFINITY,o=r*C((_+x)/r);const u=(t-c)/d,a=(o-l)/f,h=u<a&&0!==d,S=h?0:c+a*d,R=h?l+u*f:o;if((u>1||0===d)&&a>1){const e=Y(s[1]/r);n[e]?.push([[I,_],s]);break}if(S>=0&&(0!==c||0!==d)||R<=0||R>=e){if(!g&&0===p){[I,_]=i[0],p++;continue}{const e=C(_/r)-(m?0:1),t=[[I,_],i[p]];n[e]?.push(t);break}}const E=C(_/r)-(m?0:1);n[E]?.push([[I,_],[S,R]]),I=S,_=R}}function V(e,t,o,s,i,c=1,l,u,f,g,I,_,p,v,m,C){const{gl:S}=e,R=[],E=.03125,T=.03125;R.push(0,0,E,0,0,T),R.push(E,0,E,T,0,T);const b=new Float32Array(R),w=(A=t,(n,e,...t)=>{const{gl:r,uniforms:o}=A,s=o[e]||(o[e]=r.getUniformLocation(A.program,e));r[`uniform${n}`](s,...t)});var A;const D=function(n){return(e,t,r,o,s,i=0,c=0,l=0)=>{const{gl:u,attributes:f}=n,g=f[e]=f[e]??{buf:u.createBuffer(),loc:u.getAttribLocation(n.program,e),data:null},{loc:h,buf:x}=g;u.bindBuffer(u.ARRAY_BUFFER,x),r===a||r===d?u.vertexAttribPointer(h,t,r,!1,c,l):u.vertexAttribIPointer(h,t,r,c,l),u.enableVertexAttribArray(h),0!==i&&u.vertexAttribDivisor(h,i),s!==g.data&&(u.bufferData(u.ARRAY_BUFFER,s,o),g.data=s)}}(t),{lineSegPtCoords_Arr:y,segIdxs_PerCell_Range_Arr:U,closeCellIdxs_PerCell_Arr:F,closeCellIdxs_PerCell_Range_Arr:N,crossCellIdxs_PerCell_Arr:L,crossCellIdxs_perCell_Range_Arr:M,segIdxs_PerStrip_Range_Arr:O}=function(e,t,r,o,s,i,c,l=[0,0,t,r],u=1){const a=function(n,e,t,r){if(0===n[0]&&0===n[1]&&n[2]===e&&n[3]===t)return r;const[o,s,i,c]=n,l=e/i,u=t/c,a=[];for(let n=0;n<r.length;n++){const e=r[n],t=[];for(let n=0;n<e.length;n++){const r=e[n],i=[];for(let n=0;n<r.length;n++){const[e,t]=r[n],c=l*e-o,a=u*t-s;i.push([c,a])}t.push(i)}a.push(t)}return a}(l,t,r/u,e),d=function(n){let e=[];for(let t=0;t<n.length;t++){const r=n[t];for(let n=0;n<r.length;n++){const t=r[n];if(x(t))continue;if(2===t.length){e.push(t);continue}const o=P(t);e.push(...o.filter(n=>!x(n)))}}return e}(a),f=function(e,t){const r=[];for(let o=0;o<e+2*t;o++){const e=[];for(let r=0;r<n+2*t;r++)e.push({lineSegs:[],closeCells:[],crossingCells:[]});r.push(e)}return r}(o,c),g=new Array(n).fill(void 0).map(n=>[]);for(let n=0;n<d.length;n++){const e=d[n];X(f,t,r,s,e,c),Q(g,r,e)}k(f,o,s,i,c),function(e,t,r){for(let o=r;o<t+r;o++)for(let t=r;t<n+r;t++){const s=e[o][t].crossingCells;for(let i=r;i<=o;i++)0!==e[i][t].lineSegs.length&&s.push((n+2*r)*i+t)}}(f,o,c);const h=[],I=[],_=[],p=[],v=[],m=[];let C=0,S=0,R=0;for(let e=0;e<o+2*c;e++)for(let t=0;t<n+2*c;t++){const r=f[e][t];if(e>=c&&e<o+c&&t>=c&&t<n+c){const{closeCells:n,crossingCells:e}=r,t=e.length;v.push(...e),m.push([C,t]),C+=t;const o=n.length;_.push(...n),p.push([S,o]),S+=o}const{lineSegs:s}=r,i=s.length;I.push([R,i]),R+=i,h.push(...s)}for(;_.length%G!==0;)_.push(0);for(;v.length%G!==0;)v.push(0);const E=[];for(let e=0;e<n;e++){const n=g[e],t=n.length;E.push([R,t]),R+=t,h.push(...n)}const T=new Float32Array(h.flat(2)),b=new Int32Array(I.flat()),w=new Int32Array(p.flat());return{lineSegPtCoords_Arr:T,segIdxs_PerCell_Range_Arr:b,closeCellIdxs_PerCell_Arr:new Int32Array(_),closeCellIdxs_PerCell_Range_Arr:w,crossCellIdxs_PerCell_Arr:new Int32Array(v),crossCellIdxs_perCell_Range_Arr:new Int32Array(m.flat()),segIdxs_PerStrip_Range_Arr:new Int32Array(E.flat())}}(o,f,g,I,_,i,m,s,C);D("aUV",2,S.FLOAT,S.STATIC_DRAW,b),D("aCrossIdxRangePerCell",2,S.INT,S.STATIC_DRAW,M,1),D("aCloseCellIdxRangePerCell",2,S.INT,S.STATIC_DRAW,N,1),w("2f","uOffset",l,u),w("2f","uWidthHeight",f,g),w("1f","uMaxDistance",i),w("1f","uExponent",c),w("1i","uIncl",(p?1:0)+(v?2:0)),h(t)("SegIdxRangePerCellBlock",0,U),h(t)("SegIdxRangePerStripBlock",1,O),r(e,0,"segs"),S.texImage2D(S.TEXTURE_2D,0,S.RGBA32F,y.length/4,1,0,S.RGBA,S.FLOAT,y);const B=S.getUniformLocation(t.program,"uSegs");S.uniform1i(B,0),r(e,1,"closeCellIdxsPerCell"),S.texImage2D(S.TEXTURE_2D,0,S.R32I,G,F.length/G,0,S.RED_INTEGER,S.INT,F);const Y=S.getUniformLocation(t.program,"uCloseCellIdxs");S.uniform1i(Y,1),r(e,2,"crossCellIdxsPerCell"),S.texImage2D(S.TEXTURE_2D,0,S.R32I,G,L.length/G,0,S.RED_INTEGER,S.INT,L);const j=S.getUniformLocation(t.program,"uCrossCellIdxs");S.uniform1i(j,2),C>1&&(S.enable(S.SCISSOR_TEST),S.scissor(0,0,f,g/C)),S.viewport(0,0,f,g),S.drawArraysInstanced(S.TRIANGLES,0,6,I*n),C>1&&S.disable(S.SCISSOR_TEST)}function z(n){const e=[n.p,n.initialPoint];return n.prev2ndCubicControlPoint=void 0,n.prev2ndQuadraticControlPoint=void 0,e}const W={c:function(n){const e=[n.p,[n.vals[0],n.vals[1]],[n.vals[2],n.vals[3]],[n.vals[4],n.vals[5]]];return n.prev2ndCubicControlPoint=e[2],n.prev2ndQuadraticControlPoint=void 0,e},h:function(n){const e=[n.p,[n.vals[0],n.p[1]]];return n.prev2ndCubicControlPoint=void 0,n.prev2ndQuadraticControlPoint=void 0,e},l:function(n){const e=[n.p,n.vals];return n.prev2ndCubicControlPoint=void 0,n.prev2ndQuadraticControlPoint=void 0,e},q:function(n){const e=[n.vals[0],n.vals[1]],t=[n.vals[2],n.vals[3]];return n.prev2ndCubicControlPoint=void 0,n.prev2ndQuadraticControlPoint=e,[n.p,e,t]},s:function(n){const e=n.prev2ndCubicControlPoint?[n.p[0]-n.prev2ndCubicControlPoint[0]+n.p[0],n.p[1]-n.prev2ndCubicControlPoint[1]+n.p[1]]:n.p,t=[n.p,e,[n.vals[0],n.vals[1]],[n.vals[2],n.vals[3]]];return n.prev2ndCubicControlPoint=t[2],n.prev2ndQuadraticControlPoint=void 0,t},t:function(n){const e=n.prev2ndQuadraticControlPoint?[n.p[0]-n.prev2ndQuadraticControlPoint[0]+n.p[0],n.p[1]-n.prev2ndQuadraticControlPoint[1]+n.p[1]]:n.p,t=[n.vals[0],n.vals[1]];return n.prev2ndCubicControlPoint=void 0,n.prev2ndQuadraticControlPoint=e,[n.p,e,t]},v:function(n){const e=[n.p,[n.p[0],n.vals[0]]];return n.prev2ndCubicControlPoint=void 0,n.prev2ndQuadraticControlPoint=void 0,e},z};function H(n){let e=0,t=0,r=1,o=0,s=1,i=1;const c=n._currentIndex;if(n._skipOptionalSpaces(),n._currentIndex<n._endIndex&&"+"===n._string[n._currentIndex]?n._currentIndex+=1:n._currentIndex<n._endIndex&&"-"===n._string[n._currentIndex]&&(n._currentIndex+=1,s=-1),n._currentIndex===n._endIndex||(n._string[n._currentIndex]<"0"||n._string[n._currentIndex]>"9")&&"."!==n._string[n._currentIndex])throw new Error("The first character of a number must be one of [0-9+-.].");const l=n._currentIndex;for(;n._currentIndex<n._endIndex&&n._string[n._currentIndex]>="0"&&n._string[n._currentIndex]<="9";)n._currentIndex+=1;if(n._currentIndex!==l){let e=n._currentIndex-1,r=1;for(;e>=l;)t+=r*(Number(n._string[e])-0),e-=1,r*=10}if(n._currentIndex<n._endIndex&&"."===n._string[n._currentIndex]){if(n._currentIndex+=1,n._currentIndex>=n._endIndex||n._string[n._currentIndex]<"0"||n._string[n._currentIndex]>"9")throw new Error("There must be a least one digit following the .");for(;n._currentIndex<n._endIndex&&n._string[n._currentIndex]>="0"&&n._string[n._currentIndex]<="9";)r*=10,o+=Number(n._string.charAt(n._currentIndex))/r,n._currentIndex+=1}if(n._currentIndex!==c&&n._currentIndex+1<n._endIndex&&("e"===n._string[n._currentIndex]||"E"===n._string[n._currentIndex])&&"x"!==n._string[n._currentIndex+1]&&"m"!==n._string[n._currentIndex+1]){if(n._currentIndex+=1,"+"===n._string[n._currentIndex]?n._currentIndex+=1:"-"===n._string[n._currentIndex]&&(n._currentIndex+=1,i=-1),n._currentIndex>=n._endIndex||n._string[n._currentIndex]<"0"||n._string[n._currentIndex]>"9")throw new Error("There must be an exponent.");for(;n._currentIndex<n._endIndex&&n._string[n._currentIndex]>="0"&&n._string[n._currentIndex]<="9";)e*=10,e+=Number(n._string[n._currentIndex]),n._currentIndex+=1}let u=t+o;if(u*=s,e&&(u*=Math.pow(10,i*e)),c===n._currentIndex)throw new Error("Internal error: startIndex === source._currentIndex");return n._skipOptionalSpacesOrDelimiter(),u}const q={Z:"Z",M:"M",L:"L",C:"C",Q:"Q",A:"A",H:"H",V:"V",S:"S",T:"T",z:"Z",m:"m",l:"l",c:"c",q:"q",a:"a",h:"h",v:"v",s:"s",t:"t"};class Z{_string;_currentIndex;_endIndex;_prevCommand;constructor(n){this._string=n,this._currentIndex=0,this._endIndex=this._string.length,this._prevCommand=void 0,this._skipOptionalSpaces()}parseSegment(){const n=this._string[this._currentIndex];let e,t=q[n];if(void 0===t){if(void 0===this._prevCommand)throw new Error("Implicit command not allowed for first commands.");if(!("+"===n||"-"===n||"."===n||n>="0"&&n<="9")||"Z"===this._prevCommand)throw new Error("Remaining coordinates not found for implicit command");t="M"===this._prevCommand?"L":"m"===this._prevCommand?"l":this._prevCommand}else this._currentIndex+=1;this._prevCommand=t;const r=t.toUpperCase();if("H"===r||"V"===r?e=[H(this)]:"M"===r||"L"===r||"T"===r?e=[H(this),H(this)]:"S"===r||"Q"===r?e=[H(this),H(this),H(this),H(this)]:"C"===r?e=[H(this),H(this),H(this),H(this),H(this),H(this)]:"A"===r?e=[H(this),H(this),H(this),this._parseArcFlag(),this._parseArcFlag(),H(this),H(this)]:"Z"===r&&(this._skipOptionalSpaces(),e=[]),void 0===e)throw new Error("Unknown command");return{type:t,values:e}}hasMoreData(){return this._currentIndex<this._endIndex}initialCommandIsMoveTo(){if(!this.hasMoreData())return!0;const n=q[this._string[this._currentIndex]];return"M"===n||"m"===n}_isCurrentSpace(){const n=this._string[this._currentIndex];return n<=" "&&(" "===n||"\n"===n||"\t"===n||"\r"===n||"\f"===n)}_skipOptionalSpaces(){for(;this._currentIndex<this._endIndex&&this._isCurrentSpace();)this._currentIndex+=1;return this._currentIndex<this._endIndex}_skipOptionalSpacesOrDelimiter(){return!(this._currentIndex<this._endIndex&&!this._isCurrentSpace()&&","!==this._string[this._currentIndex])&&(this._skipOptionalSpaces()&&this._currentIndex<this._endIndex&&","===this._string[this._currentIndex]&&(this._currentIndex+=1,this._skipOptionalSpaces()),this._currentIndex<this._endIndex)}_parseArcFlag(){if(this._currentIndex>=this._endIndex)throw new Error("Unable to parse arc flag");let n;const e=this._string[this._currentIndex];if(this._currentIndex+=1,"0"===e)n=0;else{if("1"!==e)throw new Error("Unable to parse arc flag - arc flag must be 0 or 1");n=1}return this._skipOptionalSpacesOrDelimiter(),n}}const{ceil:$,min:J,max:K}=Math;function nn(r,o,s,i,c,l,u=1,a=!0,d=!0,f=0,g=0,h=0){const x="string"==typeof o?function(n){if(0===n.length)return[];if("m"!==n[0].type.toLowerCase())throw new Error("Invalid SVG - every new path must start with an M or m.");const e={p:[0,0]},t=[];let r,o=[];for(let s=0;s<n.length;s++){const i=n[s],c=i.type.toLowerCase();if(e.vals=i.values,i.type===c)if("v"===c)e.vals[0]+=e.p[1];else if("a"===c)e.vals[5]+=e.p[0],e.vals[6]+=e.p[1];else for(let n=0;n<e.vals.length;n++)e.vals[n]+=e.p[n%2];if("m"===c){o.length&&("z"!==r&&o.push(z(e)),t.push(o),o=[]),e.initialPoint=e.p=e.vals,r=c;continue}const l=W[c];if(!l)throw new Error("Invalid SVG - command not recognized.");const u=l(e);e.p=u[u.length-1],o.push(u),r=c}return o.length>0&&("z"!==r&&o.push(z(e)),t.push(o)),t}(function(n){if(!n.length)return[];const e=new Z(n),t=[];if(!e.initialCommandIsMoveTo())throw new Error("Path must start with m or M");for(;e.hasMoreData();)t.push(e.parseSegment());return t}(o)):o,{onContextLoss:I}=r;let _=1;if(s/i>4){const n=s/4;_=n/i,i=n}const p=i/n,v=K(s,i),m=$(s/p),C=2*$(J(l,v)/p/2),S=function(n,e,r,o){const{gl:s,programs:i}=n;if(i[e])return i[e];const c=s.createProgram(),l=t(s,"#version 300 es\n\nprecision highp float;\n\nuniform vec2 uWidthHeight;\nuniform vec2 uOffset;\nin vec2 aUV;\nin ivec2 aCloseCellIdxRangePerCell;\nin ivec2 aCrossIdxRangePerCell;\nout vec2 vXY;\nflat out int instanceId;\nflat out ivec2 closeCellIdxRange;\nflat out ivec2 crossCellIdxRange;\n\n\nvoid main() {\n instanceId = gl_InstanceID;\n closeCellIdxRange = aCloseCellIdxRangePerCell;\n crossCellIdxRange = aCrossIdxRangePerCell;\n\n // drawn column-by-column\n float i = float(instanceId / 32); // column index\n float j = float(instanceId % 32); // row index\n\n vec2 trans = vec2(\n i / float(32),\n j / float(32)\n );\n\n vec2 uv = aUV + trans;\n\n float width = uWidthHeight.x;\n float height = uWidthHeight.y;\n\n vXY = vec2(\n height * uv.x,\n height * uv.y\n );\n\n float aspectRatio = width / height;\n\n float x = (uOffset.x / 2.0*width) - 1.0;\n float y = (uOffset.y / 2.0*height) - 1.0;\n\n gl_Position = vec4(\n vec2(\n (2.0*(uv.x / aspectRatio) - 1.0),\n (2.0*uv.y - 1.0)\n ) + vec2(x,y),\n 0.0, 1.0\n );\n}\n",s.VERTEX_SHADER),u=t(s,o,s.FRAGMENT_SHADER);return s.attachShader(c,l),s.attachShader(c,u),s.linkProgram(c),i[e]={gl:s,program:c,attributes:{},uniforms:{},uniformBlocks:{},vertexShader:l,fragmentShader:u},i[e]}(r,`main${m}-${C}`,0,function(t,r){const o=e[1024*t+r];if(void 0!==o)return o;const s=`#version 300 es\n\nprecision highp float;\n\nuniform float uMaxDistance;\nuniform float uExponent;\nuniform highp sampler2D uSegs;\nuniform highp isampler2D uCloseCellIdxs;\nuniform highp isampler2D uCrossCellIdxs;\nuniform int uIncl; // bit 0 -> incl inside, bit 1 -> incl outside\n\nuniform SegIdxRangePerCellBlock {\n ivec4 uSegIdxRangePerCell[${(n+2*r)*(t+2*r)/2}];\n};\nuniform SegIdxRangePerStripBlock {\n ivec4 uSegIdxRangePerStrip[16];\n};\n\nin vec2 vXY;\nflat in int instanceId;\nflat in ivec2 closeCellIdxRange;\nflat in ivec2 crossCellIdxRange;\nout vec4 FragColor;\n\n\nfloat absDistToSegment(vec2 point, vec2 lineA, vec2 lineB) {\n vec2 lineDir = lineB - lineA;\n float lenSq = dot(lineDir, lineDir);\n float t = clamp(dot(point - lineA, lineDir) / lenSq, 0.0, 1.0);\n vec2 linePt = lineA + t * lineDir;\n\n return distance(point, linePt);\n}\n\n\nvoid main() {\n ///////////////////////////////////////////////////////////////////////////\n // Project a ray to the left to check if it crosses the segment in order\n // to find the fragment's winding number to determine whether fragment\n // is inside or outside the shape.\n\n int crossIdxS = crossCellIdxRange.x;\n int crossLen = crossCellIdxRange.y;\n float winds = 0.0;\n // Iterate over all relevant cell indexes\n for (int i = crossIdxS; i < crossIdxS + crossLen; i++) {\n int crossIdx = texelFetch(uCrossCellIdxs, ivec2(i%256, i/256), 0).x;\n\n bool isEven = crossIdx % 2 == 0;\n\n ivec4 uSegIdxRange = uSegIdxRangePerCell[crossIdx / 2];\n int segIdx = isEven ? uSegIdxRange.x : uSegIdxRange.z;\n int segLen = isEven ? uSegIdxRange.y : uSegIdxRange.w;\n\n for (int j = segIdx; j < segIdx + segLen; j++) {\n // Fetch segment from texture\n vec4 seg = texelFetch(uSegs, ivec2(j, 0), 0);\n\n // line segment's min-y is excluded\n bool crossing =\n (seg.y > vXY.y != seg.w > vXY.y) &&\n (vXY.x > (seg.z - seg.x)*(vXY.y - seg.y) / (seg.w - seg.y) + seg.x);\n\n bool crossingUp = seg.y < seg.w;\n\n winds += crossing ? (crossingUp ? 1.0 : -1.0) : 0.0;\n }\n }\n\n {\n bool isEven = (instanceId % 32) % 2 == 0;\n\n ivec4 uSegIdxRange = uSegIdxRangePerStrip[(instanceId % 32) / 2];\n int segIdx = isEven ? uSegIdxRange.x : uSegIdxRange.z;\n int segLen = isEven ? uSegIdxRange.y : uSegIdxRange.w;\n\n for (int j = segIdx; j < segIdx + segLen; j++) {\n // Fetch segment from texture\n vec4 seg = texelFetch(uSegs, ivec2(j, 0), 0);\n\n // line segment's min-y is excluded\n bool crossing =\n (seg.y > vXY.y != seg.w > vXY.y) &&\n (vXY.x > (seg.z - seg.x)*(vXY.y - seg.y) / (seg.w - seg.y) + seg.x);\n\n bool crossingUp = seg.y < seg.w;\n\n winds += crossing ? (crossingUp ? 1.0 : -1.0) : 0.0;\n }\n }\n\n\n bool inside = winds != 0.0;\n ///////////////////////////////////////////////////////////////////////////\n\n ///////////////////////////////////////////////////////////////////////////\n float res = 1.0; // sdf result\n\n if ((inside && (uIncl % 2 != 0)) || (!inside && (uIncl > 1))) {\n int cellIdxS = closeCellIdxRange.x;\n int cellLen = closeCellIdxRange.y;\n // Iterate over all relevant cell indexes\n for (int i = cellIdxS; i < cellIdxS + cellLen; i++) {\n int cellIdx = texelFetch(uCloseCellIdxs, ivec2(i%256, i/256), 0).x;\n\n bool isEven = cellIdx % 2 == 0;\n ivec4 uSegIdxRange = uSegIdxRangePerCell[cellIdx / 2];\n int segIdx = isEven ? uSegIdxRange.x : uSegIdxRange.z;\n int segLen = isEven ? uSegIdxRange.y : uSegIdxRange.w;\n\n for (int j = segIdx; j < segIdx + segLen; j++) {\n // Fetch segment from texture\n vec4 seg = texelFetch(uSegs, ivec2(j, 0), 0);\n\n // Find unsigned distance to the segment; only the nearest will be kept\n float d = absDistToSegment(vXY, seg.xy, seg.zw);\n // Apply exponential transform TODO\n // val = pow(1.0 - clamp(d / uMaxDistance, 0.0, 1.0), uExponent) * 0.5;\n float val = clamp(d / uMaxDistance, 0.0, 1.0);\n res = min(res, val);\n }\n }\n }\n ///////////////////////////////////////////////////////////////////////////\n\n // DEBUG!\n // float alpha = ((instanceId + instanceId/32) % 2 == 0 ? 0.3 : 0.5);\n float alpha = res == 1.0 ? 0.0 : 0.5;\n\n float red = inside ? 0.2 : 0.8;\n float green = abs(sin(50.0 * res));\n float blue = 0.5;\n // float alpha = inside ? 0.5 : 0.0;\n\n FragColor = vec4(red, green, blue, alpha);\n}\n`;return e[1024*t+r]=s,s}(m,C)),{gl:R}=r;if(R.useProgram(S.program),V(r,S,x,c,l,u,f,g,s,i,m,p,a,d,C,_),R.isContextLost())throw I(),new Error("Webgl2 context lost.")}function en(n){if(void 0===n)return;const{gl:e,programs:t,textures:r}=n;for(let n in t){const{attributes:r,fragmentShader:o,vertexShader:s,uniformBlocks:i,program:c}=t[n];for(let n in i){const{buf:t}=i[n];e.deleteBuffer(t)}for(let n in r){const{buf:t}=r[n];e.deleteBuffer(t)}e.deleteShader(o),e.deleteShader(s),e.deleteProgram(c)}for(let n in r){const{tex:t}=r[n];e.deleteTexture(t)}}const tn=new WeakMap;function rn(n){{const e=tn.get(n);if(e)return e}const e={},t={};n.canvas.addEventListener("webglcontextlost",n=>{o(),n.preventDefault()},!1);const r={gl:n,onContextLoss:o,textures:t,programs:e};return tn.set(n,r),r;function o(){on(e),on(t)}}function on(n){Object.keys(n).forEach(e=>{delete n[e]})}export{en as freeGlContext,nn as generateSdf,rn as getWebGlContext};
|
|
1
|
+
const n=32,e={};function t(n,e,t){const r=n.createShader(t);return n.shaderSource(r,e),n.compileShader(r),r}function r(n,e,t){const{gl:r,textures:o}=n;r.activeTexture(r.TEXTURE0+e);let s=o[t];return s?r.bindTexture(r.TEXTURE_2D,s.tex):(s=o[t]={tex:r.createTexture()},r.bindTexture(r.TEXTURE_2D,s.tex),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_MIN_FILTER,r.NEAREST),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_MAG_FILTER,r.NEAREST),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_WRAP_S,r.CLAMP_TO_EDGE),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_WRAP_T,r.CLAMP_TO_EDGE)),s}const{BYTE:o,UNSIGNED_BYTE:s,SHORT:i,UNSIGNED_SHORT:c,INT:l,UNSIGNED_INT:u,FLOAT:a,HALF_FLOAT:d,INT_2_10_10_10_REV:f,UNSIGNED_INT_2_10_10_10_REV:g}=WebGL2RenderingContext;function h(n){return(e,t,r)=>{const{gl:o,uniformBlocks:s,program:i}=n;let c=s[e];if(void 0===s[e]){const n=o.getUniformBlockIndex(i,e);o.uniformBlockBinding(i,n,t);const r=o.createBuffer();o.bindBuffer(o.UNIFORM_BUFFER,r),c={blockName:e,blockIndex:n,buf:r},s[e]=c}else o.bindBuffer(o.UNIFORM_BUFFER,c.buf);const{buf:l}=c;o.bufferData(o.UNIFORM_BUFFER,r,o.STATIC_DRAW),o.bindBufferBase(o.UNIFORM_BUFFER,t,l)}}function x(n){const e=n[0][0],t=n[0][1];for(let r=1;r<n.length;r++)if(e!==n[r][0]||t!==n[r][1])return!1;return!0}function I(n,e){if(0===e)return n[0];if(1===e)return n[n.length-1];if(4===n.length){const[[t,r],[o,s],[i,c],[l,u]]=n,a=t+(o-t)*e,d=o+(i-o)*e,f=a+(d-a)*e,g=r+(s-r)*e,h=s+(c-s)*e,x=g+(h-g)*e;return[f+(d+(i+(l-i)*e-d)*e-f)*e,x+(h+(c+(u-c)*e-h)*e-x)*e]}if(3===n.length){const[[t,r],[o,s],[i,c]]=n,l=t+(o-t)*e,u=r+(s-r)*e;return[l+(o+(i-o)*e-l)*e,u+(s+(c-s)*e-u)*e]}if(2===n.length){const[[t,r],[o,s]]=n;return[t+(o-t)*e,r+(s-r)*e]}if(1===n.length)return n[0];throw new Error("The given bezier curve must be of order <= 3.")}const{sqrt:_}=Math;function p(n,e){const t=n[0],r=n[1],o=e[0],s=e[1],i=r-s,c=o-t,l=t*s-o*r,u=_(i*i+c*c);return function(n){const e=n[0],o=n[1];return 0!==u?(i*e+c*o+l)/u:_((e-t)**2+(o-r)**2)}}{const n=[10,1];p([6,2],[6,2])(n)}function v(n,e,t){if(4===n.length)return function(n,e,t){return 0===e?1===t?n:function(n,e){const t=n[0],r=n[1],o=n[2],s=n[3],i=t[0],c=t[1],l=r[0],u=r[1],a=o[0],d=o[1],f=i-e*(i-l),g=l-e*(l-a),h=f-e*(f-g),x=c-e*(c-u),I=u-e*(u-d),_=x-e*(x-I);return[t,[f,x],[h,_],[h-e*(h-(g-e*(g-(a-e*(a-s[0]))))),_-e*(_-(I-e*(I-(d-e*(d-s[1])))))]]}(n,t):1===t?function(n,e){const t=n[0],r=n[1],o=n[2],s=n[3],i=t[0],c=t[1],l=r[0],u=r[1],a=o[0],d=o[1],f=i-e*(i-l),g=l-e*(l-a),h=a-e*(a-s[0]),x=f-e*(f-g),I=g-e*(g-h),_=c-e*(c-u),p=u-e*(u-d),v=d-e*(d-s[1]),m=_-e*(_-p),C=p-e*(p-v);return[[x-e*(x-I),m-e*(m-C)],[I,C],[h,v],s]}(n,e):function(n,e,t){const r=n[0],o=n[1],s=n[2],i=n[3],c=r[0],l=r[1],u=o[0],a=o[1],d=s[0],f=s[1],g=e*e,h=e*g,x=t*t,I=t*x,_=e*t,p=c-u,v=d-u,m=p+v,C=e*p,S=t*p,R=i[0]-c-3*v,E=l-a,T=f-a,b=E+T,w=e*E,A=t*E,P=i[1]-l-3*T;return[[h*R+(3*e*(e*m-p)+c),h*P+(3*e*(e*b-E)+l)],[_*(e*R+2*m)+(g*m+c-(S+2*C)),_*(e*P+2*b)+(g*b+l-(A+2*w))],[_*(t*R+2*m)+(x*m+c-(2*S+C)),_*(t*P+2*b)+(x*b+l-(2*A+w))],[I*R+(3*t*(t*m-p)+c),I*P+(3*t*(t*b-E)+l)]]}(n,e,t)}(n,e,t);if(3===n.length)return function(n,e,t){return 0===e?1===t?n:function(n,e){const t=n[0],r=n[1],o=n[2],s=t[0],i=t[1],c=r[0],l=r[1],u=e*e,a=s-c,d=i-l;return[t,[-e*a+s,-e*d+i],[u*(a+(o[0]-c))-(2*e*a-s),u*(d+(o[1]-l))-(2*e*d-i)]]}(n,t):1===t?function(n,e){const t=n[0],r=n[1],o=n[2],s=t[0],i=t[1],c=r[0],l=r[1],u=e*e,a=s-c,d=o[0]-c,f=i-l,g=o[1]-l;return[[u*(a+d)-(2*e*a-s),u*(f+g)-(2*e*f-i)],[e*d+c,e*g+l],o]}(n,e):function(n,e,t){const r=n[0],o=n[1],s=n[2],i=r[0],c=r[1],l=o[0],u=o[1],a=e*e,d=t*t,f=e*t,g=i-l,h=g+(s[0]-l),x=c-u,I=x+(s[1]-u);return[[a*h-(2*e*g-i),a*I-(2*e*x-c)],[f*h-(g*(t+e)-i),f*I-(x*(t+e)-c)],[d*h-(2*t*g-i),d*I-(2*t*x-c)]]}(n,e,t)}(n,e,t);throw new Error("The given bezier curve must be of order 2 or 3.")}function m(n,e){return[e[0]-n[0],e[1]-n[1]]}function C(n,e){return n[0]*e[0]+n[1]*e[1]}function S(n){const e=m(n[0],n[1]),t=m(n[1],n[3]),r=m(n[3],n[0]),o=m(n[0],n[2]),s=m(n[2],n[3]);return C(r,e)>0||C(t,r)>0||C(r,o)>0||C(s,r)>0}const{abs:R,max:E}=Math;function T(n){const e=p(n[0],n[3]),t=e(n[1]),r=e(n[2]);return(t*r<=0?4/9:3/4)*E(R(t),R(r))}function b(n){const e=m(n[0],n[1]),t=m(n[1],n[2]),r=m(n[2],n[0]);return C(r,e)>0||C(t,r)>0}const{abs:w}=Math;function A(n){if(n[0][0]===n[1][0]&&n[0][1]===n[1][1])return 0;const e=I(n,.5),t=p(n[0],n[2]);return w(t(e))}function P(n){const e=3===n.length?function(n){const e=[0],t=[1];for(;;){const r=e[e.length-1],o=t[t.length-1],s=v(n,r,o);if(!b(s)&&A(s)<=.5){if(e.push(t.pop()),1===o)return e;continue}const i=(r+o)/2;t.push(i)}}(n):function(n){const e=[0],t=[1];for(;;){const r=e[e.length-1],o=t[t.length-1],s=v(n,r,o);if(!S(s)&&T(s)<=.5){if(e.push(t.pop()),1===o)return e;continue}const i=(r+o)/2;t.push(i)}}(n),t=[];for(let r=0;r<e.length-1;r++){const o=I(n,e[r]),s=I(n,e[r+1]);t.push([o,s])}return t}function D(n){return Math.sqrt(n[0]*n[0]+n[1]*n[1])}const y=function(){const e=[{from:0,u:0,v:0}];for(let t=0;t<128;t++){e.push({from:t+.5,u:t+1,v:0}),e.push({from:t+.5,u:-t-1,v:0}),e.push({from:t+.5,u:0,v:t+1}),e.push({from:t+.5,u:0,v:-t-1});for(let r=0;r<n;r++){const n=D([.5+t,.5+r]),o=t+1,s=r+1;e.push({from:n,u:o,v:s}),0!==o&&e.push({from:n,u:-o,v:s}),0!==s&&e.push({from:n,u:o,v:-s}),0!==o&&0!==s&&e.push({from:n,u:-o,v:-s})}e.sort((n,e)=>n.from-e.from)}return e}(),{max:U,E:F}=Math;const{min:N,max:M,SQRT2:L}=Math;function k(e,t,r,o,s){const i=function(e,t,r,o,s){return function(i,c,l){let u=function(n){let e=function(n){let e=0,t=y.length-1,r=0;for(;e<=t;){r=e+t>>>1;const o=y[r].from;if(o===n)return r;n>o?e=r+1:t=r-1}return r}(n);if(n=U(0,n),0===e)return 0;for(;y[e].from===y[e-1].from;)e--;return e}((l-L*r)/r),a=Number.POSITIVE_INFINITY;for(;;){if(u>=y.length){a=r*(y[y.length-1].from-L);break}const{u:l,v:d,from:f}=y[u];if(r*f>o+L*r){a=r*(f-2*L);break}const g=l+i,h=d+c;if(g<0||g>=t+2*s||h<0||h>=n+2*s){u++;continue}const{lineSegs:x}=e[g][h];if(x.length>0){a=r*(f-L);break}u++}const{closeCells:d}=e[i][c];let f=M(0,u-1);for(;f<y.length;){const{from:l,u,v:g}=y[f];if(r*l>N(a,o)+2*L*r)break;const h=u+i,x=g+c;if(h<0||h>=t+2*s||x<0||x>=n+2*s){f++;continue}const{lineSegs:I}=e[h][x];I.length>0&&d.push((2*s+n)*h+x),f++}return a}}(e,t,r,o,s);let c=0,l=0;for(let e=s;e<t+s;e++){l=c;for(let t=s;t<n+s;t++)l=i(e,t,l),t===s&&(c=l)}}const{floor:B,ceil:O}=Math;function X(n,e,t,r,o,s){const i=r*s,[[c,l],[u,a]]=o,d=e+i,f=t+i,g=function(n,e){const[t,r]=n,[o,s]=t,[i,c]=r,[[l,u],[a,d]]=e,f=i-o,g=c-s,h=[];if(0!==f){const n=(l-o)/f;if(n>=0&&n<=1){const e=s+n*g;e>=u&&e<=d&&h.push({t:n,p:[l,e]})}const e=(a-o)/f;if(e>=0&&e<=1){const n=s+e*g;n>=u&&n<=d&&h.push({t:e,p:[a,n]})}}if(0!==g){const n=(u-s)/g;if(n>=0&&n<=1){const e=o+n*f;e>=l&&e<=a&&h.push({t:n,p:[e,u]})}const e=(d-s)/g;if(e>=0&&e<=1){const n=o+e*f;n>=l&&n<=a&&h.push({t:e,p:[n,d]})}}const x=new Set,I=h.filter(n=>{const{t:e}=n;return!x.has(e)&&(x.add(e),!0)});return I.sort((n,e)=>n.t-e.t).map(n=>n.p)}(o,[[-i,-i],[d,f]]),h=c>-i&&c<d&&l>-i&&l<f,x=u>-i&&u<d&&a>-i&&a<f;if(g.length<2&&!h&&!x)return;const I=u-c,_=a-l,p=u>c?r:-r,v=a>l?r:-r;let m=c,C=l,S=0;const R=p>0,E=v>0,T=R?B:O,b=E?B:O;for(;;){let e=r*T((m+p)/r),t=r*b((C+v)/r);const o=(e-c)/I,x=(t-l)/_,w=o<x&&0!==I||0===_,A=w?e:c+x*I,P=w?l+o*_:t;if((o>1||0===I)&&(x>1||0===_)){const e=B(u/r)+s,t=B(a/r)+s;n[e]?.[t]?.lineSegs.push([[m,C],[u,a]]);break}if(A<=-i||P<=-i||A>=d||P>=f){if(!h&&0===S){[m,C]=g[0],S++;continue}{const e=T(m/r)-(R?0:1)+s,t=b(C/r)-(E?0:1)+s,o=[[m,C],g[S]];n[e]?.[t]?.lineSegs.push(o);break}}const D=T(m/r)-(R?0:1)+s,y=b(C/r)-(E?0:1)+s;n[D]?.[y]?.lineSegs.push([[m,C],[A,P]]),m=A,C=P}}const G=256,{floor:Y,ceil:j}=Math;function Q(n,e,t){const r=e/n.length,[o,s]=t,i=function(n,e){const[t,r]=n,[o,s]=t,[i,c]=r,[l,u,a]=e,d=i-o,f=c-s,g=[],h=[];if(0!==d){const n=(l-o)/d;if(n>=0&&n<=1){const e=s+n*f;e>=u&&e<=a&&(g.push(n),h.push([l,e]))}}if(0!==f){const n=(u-s)/f;if(n>=0&&n<=1){const e=o+n*d;e<=l&&(g.push(n),h.push([e,u]))}const e=(a-s)/f;if(e>=0&&e<=1){const n=o+e*d;n<=l&&(g.push(e),h.push([n,a]))}}return 2===g.length?g[0]<g[1]?h:[h[1],h[0]]:h}(t,[0,0,e]),[c,l]=o,[u,a]=s,d=u-c,f=a-l,g=c<0&&l>0&&l<e,h=u<0&&a>0&&a<e;if(i.length<2&&!g&&!h&&(0!==c||0!==d||l<=0&&a<=0||l>=e&&a>=e))return;if(0===f)return;const x=a>l?r:-r;let I=c,_=l,p=0;const v=u>c,m=a>l,C=m?Y:j;for(;;){let t=v&&I<0||!v&&I>0?0:Number.NEGATIVE_INFINITY,o=r*C((_+x)/r);const u=(t-c)/d,a=(o-l)/f,h=u<a&&0!==d,S=h?0:c+a*d,R=h?l+u*f:o;if((u>1||0===d)&&a>1){const e=Y(s[1]/r);n[e]?.push([[I,_],s]);break}if(S>=0&&(0!==c||0!==d)||R<=0||R>=e){if(!g&&0===p){[I,_]=i[0],p++;continue}{const e=C(_/r)-(m?0:1),t=[[I,_],i[p]];n[e]?.push(t);break}}const E=C(_/r)-(m?0:1);n[E]?.push([[I,_],[S,R]]),I=S,_=R}}function V(e,t,o,s,i,c=1,l,u,f,g,I,_,p,v,m,C){const{gl:S}=e,R=[],E=.03125,T=.03125;R.push(0,0,E,0,0,T),R.push(E,0,E,T,0,T);const b=new Float32Array(R),w=(A=t,(n,e,...t)=>{const{gl:r,uniforms:o}=A,s=o[e]||(o[e]=r.getUniformLocation(A.program,e));r[`uniform${n}`](s,...t)});var A;const D=function(n){return(e,t,r,o,s,i=0,c=0,l=0)=>{const{gl:u,attributes:f}=n,g=f[e]=f[e]??{buf:u.createBuffer(),loc:u.getAttribLocation(n.program,e),data:null},{loc:h,buf:x}=g;u.bindBuffer(u.ARRAY_BUFFER,x),r===a||r===d?u.vertexAttribPointer(h,t,r,!1,c,l):u.vertexAttribIPointer(h,t,r,c,l),u.enableVertexAttribArray(h),0!==i&&u.vertexAttribDivisor(h,i),s!==g.data&&(u.bufferData(u.ARRAY_BUFFER,s,o),g.data=s)}}(t),{lineSegPtCoords_Arr:y,segIdxs_PerCell_Range_Arr:U,closeCellIdxs_PerCell_Arr:F,closeCellIdxs_PerCell_Range_Arr:N,crossCellIdxs_PerCell_Arr:M,crossCellIdxs_perCell_Range_Arr:L,segIdxs_PerStrip_Range_Arr:B}=function(e,t,r,o,s,i,c,l=[0,0,t,r],u=1){const a=function(n,e,t,r){if(0===n[0]&&0===n[1]&&n[2]===e&&n[3]===t)return r;const[o,s,i,c]=n,l=e/i,u=t/c,a=[];for(let n=0;n<r.length;n++){const e=r[n],t=[];for(let n=0;n<e.length;n++){const r=e[n],i=[];for(let n=0;n<r.length;n++){const[e,t]=r[n],c=l*e-o,a=u*t-s;i.push([c,a])}t.push(i)}a.push(t)}return a}(l,t,r/u,e),d=function(n){let e=[];for(let t=0;t<n.length;t++){const r=n[t];for(let n=0;n<r.length;n++){const t=r[n];if(x(t))continue;if(2===t.length){e.push(t);continue}const o=P(t);e.push(...o.filter(n=>!x(n)))}}return e}(a),f=function(e,t){const r=[];for(let o=0;o<e+2*t;o++){const e=[];for(let r=0;r<n+2*t;r++)e.push({lineSegs:[],closeCells:[],crossingCells:[]});r.push(e)}return r}(o,c),g=new Array(n).fill(void 0).map(n=>[]);for(let n=0;n<d.length;n++){const e=d[n];X(f,t,r,s,e,c),Q(g,r,e)}k(f,o,s,i,c),function(e,t,r){for(let o=r;o<t+r;o++)for(let t=r;t<n+r;t++){const s=e[o][t].crossingCells;for(let i=r;i<=o;i++)0!==e[i][t].lineSegs.length&&s.push((n+2*r)*i+t)}}(f,o,c);const h=[],I=[],_=[],p=[],v=[],m=[];let C=0,S=0,R=0;for(let e=0;e<o+2*c;e++)for(let t=0;t<n+2*c;t++){const r=f[e][t];if(e>=c&&e<o+c&&t>=c&&t<n+c){const{closeCells:n,crossingCells:e}=r,t=e.length;v.push(...e),m.push([C,t]),C+=t;const o=n.length;_.push(...n),p.push([S,o]),S+=o}const{lineSegs:s}=r,i=s.length;I.push([R,i]),R+=i,h.push(...s)}for(;_.length%G!==0;)_.push(0);for(;v.length%G!==0;)v.push(0);const E=[];for(let e=0;e<n;e++){const n=g[e],t=n.length;E.push([R,t]),R+=t,h.push(...n)}const T=new Float32Array(h.flat(2)),b=new Int32Array(I.flat()),w=new Int32Array(p.flat());return{lineSegPtCoords_Arr:T,segIdxs_PerCell_Range_Arr:b,closeCellIdxs_PerCell_Arr:new Int32Array(_),closeCellIdxs_PerCell_Range_Arr:w,crossCellIdxs_PerCell_Arr:new Int32Array(v),crossCellIdxs_perCell_Range_Arr:new Int32Array(m.flat()),segIdxs_PerStrip_Range_Arr:new Int32Array(E.flat())}}(o,f,g,I,_,i,m,s,C);D("aUV",2,S.FLOAT,S.STATIC_DRAW,b),D("aCrossIdxRangePerCell",2,S.INT,S.STATIC_DRAW,L,1),D("aCloseCellIdxRangePerCell",2,S.INT,S.STATIC_DRAW,N,1),w("2f","uWidthHeight",f,g),w("1f","uMaxDistance",i),w("1f","uExponent",c),w("1i","uIncl",(p?1:0)+(v?2:0)),h(t)("SegIdxRangePerCellBlock",0,U),h(t)("SegIdxRangePerStripBlock",1,B),r(e,0,"segs"),S.texImage2D(S.TEXTURE_2D,0,S.RGBA32F,y.length/4,1,0,S.RGBA,S.FLOAT,y);const O=S.getUniformLocation(t.program,"uSegs");S.uniform1i(O,0),r(e,1,"closeCellIdxsPerCell"),S.texImage2D(S.TEXTURE_2D,0,S.R32I,G,F.length/G,0,S.RED_INTEGER,S.INT,F);const Y=S.getUniformLocation(t.program,"uCloseCellIdxs");S.uniform1i(Y,1),r(e,2,"crossCellIdxsPerCell"),S.texImage2D(S.TEXTURE_2D,0,S.R32I,G,M.length/G,0,S.RED_INTEGER,S.INT,M);const j=S.getUniformLocation(t.program,"uCrossCellIdxs");S.uniform1i(j,2),C>1&&(S.enable(S.SCISSOR_TEST),S.scissor(l,u,f,g/C)),S.viewport(l,u,f,g),S.drawArraysInstanced(S.TRIANGLES,0,6,I*n),C>1&&S.disable(S.SCISSOR_TEST)}function z(n){const e=[n.p,n.initialPoint];return n.prev2ndCubicControlPoint=void 0,n.prev2ndQuadraticControlPoint=void 0,e}const W={c:function(n){const e=[n.p,[n.vals[0],n.vals[1]],[n.vals[2],n.vals[3]],[n.vals[4],n.vals[5]]];return n.prev2ndCubicControlPoint=e[2],n.prev2ndQuadraticControlPoint=void 0,e},h:function(n){const e=[n.p,[n.vals[0],n.p[1]]];return n.prev2ndCubicControlPoint=void 0,n.prev2ndQuadraticControlPoint=void 0,e},l:function(n){const e=[n.p,n.vals];return n.prev2ndCubicControlPoint=void 0,n.prev2ndQuadraticControlPoint=void 0,e},q:function(n){const e=[n.vals[0],n.vals[1]],t=[n.vals[2],n.vals[3]];return n.prev2ndCubicControlPoint=void 0,n.prev2ndQuadraticControlPoint=e,[n.p,e,t]},s:function(n){const e=n.prev2ndCubicControlPoint?[n.p[0]-n.prev2ndCubicControlPoint[0]+n.p[0],n.p[1]-n.prev2ndCubicControlPoint[1]+n.p[1]]:n.p,t=[n.p,e,[n.vals[0],n.vals[1]],[n.vals[2],n.vals[3]]];return n.prev2ndCubicControlPoint=t[2],n.prev2ndQuadraticControlPoint=void 0,t},t:function(n){const e=n.prev2ndQuadraticControlPoint?[n.p[0]-n.prev2ndQuadraticControlPoint[0]+n.p[0],n.p[1]-n.prev2ndQuadraticControlPoint[1]+n.p[1]]:n.p,t=[n.vals[0],n.vals[1]];return n.prev2ndCubicControlPoint=void 0,n.prev2ndQuadraticControlPoint=e,[n.p,e,t]},v:function(n){const e=[n.p,[n.p[0],n.vals[0]]];return n.prev2ndCubicControlPoint=void 0,n.prev2ndQuadraticControlPoint=void 0,e},z};function H(n){let e=0,t=0,r=1,o=0,s=1,i=1;const c=n._currentIndex;if(n._skipOptionalSpaces(),n._currentIndex<n._endIndex&&"+"===n._string[n._currentIndex]?n._currentIndex+=1:n._currentIndex<n._endIndex&&"-"===n._string[n._currentIndex]&&(n._currentIndex+=1,s=-1),n._currentIndex===n._endIndex||(n._string[n._currentIndex]<"0"||n._string[n._currentIndex]>"9")&&"."!==n._string[n._currentIndex])throw new Error("The first character of a number must be one of [0-9+-.].");const l=n._currentIndex;for(;n._currentIndex<n._endIndex&&n._string[n._currentIndex]>="0"&&n._string[n._currentIndex]<="9";)n._currentIndex+=1;if(n._currentIndex!==l){let e=n._currentIndex-1,r=1;for(;e>=l;)t+=r*(Number(n._string[e])-0),e-=1,r*=10}if(n._currentIndex<n._endIndex&&"."===n._string[n._currentIndex]){if(n._currentIndex+=1,n._currentIndex>=n._endIndex||n._string[n._currentIndex]<"0"||n._string[n._currentIndex]>"9")throw new Error("There must be a least one digit following the .");for(;n._currentIndex<n._endIndex&&n._string[n._currentIndex]>="0"&&n._string[n._currentIndex]<="9";)r*=10,o+=Number(n._string.charAt(n._currentIndex))/r,n._currentIndex+=1}if(n._currentIndex!==c&&n._currentIndex+1<n._endIndex&&("e"===n._string[n._currentIndex]||"E"===n._string[n._currentIndex])&&"x"!==n._string[n._currentIndex+1]&&"m"!==n._string[n._currentIndex+1]){if(n._currentIndex+=1,"+"===n._string[n._currentIndex]?n._currentIndex+=1:"-"===n._string[n._currentIndex]&&(n._currentIndex+=1,i=-1),n._currentIndex>=n._endIndex||n._string[n._currentIndex]<"0"||n._string[n._currentIndex]>"9")throw new Error("There must be an exponent.");for(;n._currentIndex<n._endIndex&&n._string[n._currentIndex]>="0"&&n._string[n._currentIndex]<="9";)e*=10,e+=Number(n._string[n._currentIndex]),n._currentIndex+=1}let u=t+o;if(u*=s,e&&(u*=Math.pow(10,i*e)),c===n._currentIndex)throw new Error("Internal error: startIndex === source._currentIndex");return n._skipOptionalSpacesOrDelimiter(),u}const q={Z:"Z",M:"M",L:"L",C:"C",Q:"Q",A:"A",H:"H",V:"V",S:"S",T:"T",z:"Z",m:"m",l:"l",c:"c",q:"q",a:"a",h:"h",v:"v",s:"s",t:"t"};class Z{_string;_currentIndex;_endIndex;_prevCommand;constructor(n){this._string=n,this._currentIndex=0,this._endIndex=this._string.length,this._prevCommand=void 0,this._skipOptionalSpaces()}parseSegment(){const n=this._string[this._currentIndex];let e,t=q[n];if(void 0===t){if(void 0===this._prevCommand)throw new Error("Implicit command not allowed for first commands.");if(!("+"===n||"-"===n||"."===n||n>="0"&&n<="9")||"Z"===this._prevCommand)throw new Error("Remaining coordinates not found for implicit command");t="M"===this._prevCommand?"L":"m"===this._prevCommand?"l":this._prevCommand}else this._currentIndex+=1;this._prevCommand=t;const r=t.toUpperCase();if("H"===r||"V"===r?e=[H(this)]:"M"===r||"L"===r||"T"===r?e=[H(this),H(this)]:"S"===r||"Q"===r?e=[H(this),H(this),H(this),H(this)]:"C"===r?e=[H(this),H(this),H(this),H(this),H(this),H(this)]:"A"===r?e=[H(this),H(this),H(this),this._parseArcFlag(),this._parseArcFlag(),H(this),H(this)]:"Z"===r&&(this._skipOptionalSpaces(),e=[]),void 0===e)throw new Error("Unknown command");return{type:t,values:e}}hasMoreData(){return this._currentIndex<this._endIndex}initialCommandIsMoveTo(){if(!this.hasMoreData())return!0;const n=q[this._string[this._currentIndex]];return"M"===n||"m"===n}_isCurrentSpace(){const n=this._string[this._currentIndex];return n<=" "&&(" "===n||"\n"===n||"\t"===n||"\r"===n||"\f"===n)}_skipOptionalSpaces(){for(;this._currentIndex<this._endIndex&&this._isCurrentSpace();)this._currentIndex+=1;return this._currentIndex<this._endIndex}_skipOptionalSpacesOrDelimiter(){return!(this._currentIndex<this._endIndex&&!this._isCurrentSpace()&&","!==this._string[this._currentIndex])&&(this._skipOptionalSpaces()&&this._currentIndex<this._endIndex&&","===this._string[this._currentIndex]&&(this._currentIndex+=1,this._skipOptionalSpaces()),this._currentIndex<this._endIndex)}_parseArcFlag(){if(this._currentIndex>=this._endIndex)throw new Error("Unable to parse arc flag");let n;const e=this._string[this._currentIndex];if(this._currentIndex+=1,"0"===e)n=0;else{if("1"!==e)throw new Error("Unable to parse arc flag - arc flag must be 0 or 1");n=1}return this._skipOptionalSpacesOrDelimiter(),n}}const{ceil:$,min:J,max:K}=Math;function nn(r,o,s,i,c,l,u=1,a=!0,d=!0,f=0,g=0,h=0){const x="string"==typeof o?function(n){if(0===n.length)return[];if("m"!==n[0].type.toLowerCase())throw new Error("Invalid SVG - every new path must start with an M or m.");const e={p:[0,0]},t=[];let r,o=[];for(let s=0;s<n.length;s++){const i=n[s],c=i.type.toLowerCase();if(e.vals=i.values,i.type===c)if("v"===c)e.vals[0]+=e.p[1];else if("a"===c)e.vals[5]+=e.p[0],e.vals[6]+=e.p[1];else for(let n=0;n<e.vals.length;n++)e.vals[n]+=e.p[n%2];if("m"===c){o.length&&("z"!==r&&o.push(z(e)),t.push(o),o=[]),e.initialPoint=e.p=e.vals,r=c;continue}const l=W[c];if(!l)throw new Error("Invalid SVG - command not recognized.");const u=l(e);e.p=u[u.length-1],o.push(u),r=c}return o.length>0&&("z"!==r&&o.push(z(e)),t.push(o)),t}(function(n){if(!n.length)return[];const e=new Z(n),t=[];if(!e.initialCommandIsMoveTo())throw new Error("Path must start with m or M");for(;e.hasMoreData();)t.push(e.parseSegment());return t}(o)):o;let I=1;if(s/i>4){const n=s/4;I=n/i,i=n}const _=i/n,p=K(s,i),v=$(s/_),m=2*$(J(l,p)/_/2),C=function(n,e,r,o){const{gl:s,programs:i}=n;if(i[e])return i[e];const c=s.createProgram(),l=t(s,"#version 300 es\n\nprecision highp float;\n\nuniform vec2 uWidthHeight;\nin vec2 aUV;\nin ivec2 aCloseCellIdxRangePerCell;\nin ivec2 aCrossIdxRangePerCell;\nout vec2 vXY;\nflat out int instanceId;\nflat out ivec2 closeCellIdxRange;\nflat out ivec2 crossCellIdxRange;\n\n\nvoid main() {\n instanceId = gl_InstanceID;\n closeCellIdxRange = aCloseCellIdxRangePerCell;\n crossCellIdxRange = aCrossIdxRangePerCell;\n\n // drawn column-by-column\n float i = float(instanceId / 32); // column index\n float j = float(instanceId % 32); // row index\n\n vec2 trans = vec2(\n i / float(32),\n j / float(32)\n );\n\n vec2 uv = aUV + trans;\n\n float width = uWidthHeight.x;\n float height = uWidthHeight.y;\n\n vXY = vec2(\n height * uv.x,\n height * uv.y\n );\n\n float aspectRatio = width / height;\n\n gl_Position = vec4(\n vec2(\n (2.0*(uv.x / aspectRatio) - 1.0),\n (2.0*uv.y - 1.0)\n ),\n 0.0, 1.0\n );\n}\n",s.VERTEX_SHADER),u=t(s,o,s.FRAGMENT_SHADER);return s.attachShader(c,l),s.attachShader(c,u),s.linkProgram(c),i[e]={gl:s,program:c,attributes:{},uniforms:{},uniformBlocks:{},vertexShader:l,fragmentShader:u},i[e]}(r,`main${v}-${m}`,0,function(t,r){const o=e[1024*t+r];if(void 0!==o)return o;const s=`#version 300 es\n\nprecision highp float;\n\nuniform float uMaxDistance;\nuniform float uExponent;\nuniform highp sampler2D uSegs;\nuniform highp isampler2D uCloseCellIdxs;\nuniform highp isampler2D uCrossCellIdxs;\nuniform int uIncl; // bit 0 -> incl inside, bit 1 -> incl outside\n\nuniform SegIdxRangePerCellBlock {\n ivec4 uSegIdxRangePerCell[${(n+2*r)*(t+2*r)/2}];\n};\nuniform SegIdxRangePerStripBlock {\n ivec4 uSegIdxRangePerStrip[16];\n};\n\nin vec2 vXY;\nflat in int instanceId;\nflat in ivec2 closeCellIdxRange;\nflat in ivec2 crossCellIdxRange;\nout vec4 FragColor;\n\n\nfloat absDistToSegment(vec2 point, vec2 lineA, vec2 lineB) {\n vec2 lineDir = lineB - lineA;\n float lenSq = dot(lineDir, lineDir);\n float t = clamp(dot(point - lineA, lineDir) / lenSq, 0.0, 1.0);\n vec2 linePt = lineA + t * lineDir;\n\n return distance(point, linePt);\n}\n\n\nvoid main() {\n ///////////////////////////////////////////////////////////////////////////\n // Project a ray to the left to check if it crosses the segment in order\n // to find the fragment's winding number to determine whether fragment\n // is inside or outside the shape.\n\n int crossIdxS = crossCellIdxRange.x;\n int crossLen = crossCellIdxRange.y;\n float winds = 0.0;\n // Iterate over all relevant cell indexes\n for (int i = crossIdxS; i < crossIdxS + crossLen; i++) {\n int crossIdx = texelFetch(uCrossCellIdxs, ivec2(i%256, i/256), 0).x;\n\n bool isEven = crossIdx % 2 == 0;\n\n ivec4 uSegIdxRange = uSegIdxRangePerCell[crossIdx / 2];\n int segIdx = isEven ? uSegIdxRange.x : uSegIdxRange.z;\n int segLen = isEven ? uSegIdxRange.y : uSegIdxRange.w;\n\n for (int j = segIdx; j < segIdx + segLen; j++) {\n // Fetch segment from texture\n vec4 seg = texelFetch(uSegs, ivec2(j, 0), 0);\n\n // line segment's min-y is excluded\n bool crossing =\n (seg.y > vXY.y != seg.w > vXY.y) &&\n (vXY.x > (seg.z - seg.x)*(vXY.y - seg.y) / (seg.w - seg.y) + seg.x);\n\n bool crossingUp = seg.y < seg.w;\n\n winds += crossing ? (crossingUp ? 1.0 : -1.0) : 0.0;\n }\n }\n\n {\n bool isEven = (instanceId % 32) % 2 == 0;\n\n ivec4 uSegIdxRange = uSegIdxRangePerStrip[(instanceId % 32) / 2];\n int segIdx = isEven ? uSegIdxRange.x : uSegIdxRange.z;\n int segLen = isEven ? uSegIdxRange.y : uSegIdxRange.w;\n\n for (int j = segIdx; j < segIdx + segLen; j++) {\n // Fetch segment from texture\n vec4 seg = texelFetch(uSegs, ivec2(j, 0), 0);\n\n // line segment's min-y is excluded\n bool crossing =\n (seg.y > vXY.y != seg.w > vXY.y) &&\n (vXY.x > (seg.z - seg.x)*(vXY.y - seg.y) / (seg.w - seg.y) + seg.x);\n\n bool crossingUp = seg.y < seg.w;\n\n winds += crossing ? (crossingUp ? 1.0 : -1.0) : 0.0;\n }\n }\n\n\n bool inside = winds != 0.0;\n ///////////////////////////////////////////////////////////////////////////\n\n ///////////////////////////////////////////////////////////////////////////\n float res = 1.0; // sdf result\n\n if ((inside && (uIncl % 2 != 0)) || (!inside && (uIncl > 1))) {\n int cellIdxS = closeCellIdxRange.x;\n int cellLen = closeCellIdxRange.y;\n // Iterate over all relevant cell indexes\n for (int i = cellIdxS; i < cellIdxS + cellLen; i++) {\n int cellIdx = texelFetch(uCloseCellIdxs, ivec2(i%256, i/256), 0).x;\n\n bool isEven = cellIdx % 2 == 0;\n ivec4 uSegIdxRange = uSegIdxRangePerCell[cellIdx / 2];\n int segIdx = isEven ? uSegIdxRange.x : uSegIdxRange.z;\n int segLen = isEven ? uSegIdxRange.y : uSegIdxRange.w;\n\n for (int j = segIdx; j < segIdx + segLen; j++) {\n // Fetch segment from texture\n vec4 seg = texelFetch(uSegs, ivec2(j, 0), 0);\n\n // Find unsigned distance to the segment; only the nearest will be kept\n float d = absDistToSegment(vXY, seg.xy, seg.zw);\n // Apply exponential transform TODO\n // val = pow(1.0 - clamp(d / uMaxDistance, 0.0, 1.0), uExponent) * 0.5;\n float val = clamp(d / uMaxDistance, 0.0, 1.0);\n res = min(res, val);\n }\n }\n }\n ///////////////////////////////////////////////////////////////////////////\n\n // DEBUG!\n // float alpha = ((instanceId + instanceId/32) % 2 == 0 ? 0.3 : 0.5);\n float alpha = res == 1.0 ? 0.0 : 0.5;\n\n float red = inside ? 0.2 : 0.8;\n float green = abs(sin(50.0 * res));\n float blue = 0.5;\n // float alpha = inside ? 0.5 : 0.0;\n\n FragColor = vec4(red, green, blue, alpha);\n}\n`;return e[1024*t+r]=s,s}(v,m)),{gl:S}=r;if(S.useProgram(C.program),V(r,C,x,c,l,u,f,g,s,i,v,_,a,d,m,I),Math.random()>.995){const n=S.getExtension("WEBGL_lose_context");n&&n.loseContext()}}function en(n){if(void 0===n)return;const{gl:e,programs:t,textures:r}=n;for(let n in t){const{attributes:r,fragmentShader:o,vertexShader:s,uniformBlocks:i,program:c}=t[n];for(let n in i){const{buf:t}=i[n];e.deleteBuffer(t)}for(let n in r){const{buf:t}=r[n];e.deleteBuffer(t)}e.deleteShader(o),e.deleteShader(s),e.deleteProgram(c)}for(let n in r){const{tex:t}=r[n];e.deleteTexture(t)}}const tn=new WeakMap;function rn(n){{const e=tn.get(n);if(e)return e}const e={},t={},r={gl:n,textures:t,programs:e};return n.canvas.addEventListener("webglcontextlost",o=>{on(e),on(t),tn.delete(n),r.onContextLoss?.(o)},!1),tn.set(n,r),r}function on(n){Object.keys(n).forEach(e=>{delete n[e]})}export{en as freeGlContext,nn as generateSdf,rn as getWebGlContext};
|
package/node/generate-sdf.js
CHANGED
|
@@ -30,12 +30,10 @@ const { ceil, min, max } = Math;
|
|
|
30
30
|
* @param channel TODO
|
|
31
31
|
*/
|
|
32
32
|
function generateSdf(glContext, bezierCurves_or_svgStr, width, height, viewbox, maxDistance, sdfExponent = 1, inclInside = true, inclOutside = true, x = 0, y = 0, channel = 0) {
|
|
33
|
-
// debugShaders(gl); // comment for production
|
|
34
33
|
const psss = typeof bezierCurves_or_svgStr === 'string'
|
|
35
34
|
? getPathsFromStr(bezierCurves_or_svgStr)
|
|
36
35
|
: bezierCurves_or_svgStr;
|
|
37
36
|
// const glContext = getWebGLContext(gl);
|
|
38
|
-
const { onContextLoss } = glContext;
|
|
39
37
|
let stretch = 1;
|
|
40
38
|
const aspectRatio = width / height;
|
|
41
39
|
if (aspectRatio > MAX_ASPECT_RATIO_BEFORE_STRETCH) {
|
|
@@ -49,12 +47,15 @@ function generateSdf(glContext, bezierCurves_or_svgStr, width, height, viewbox,
|
|
|
49
47
|
const padCount = 2 * ceil(min(maxDistance, maxDim) / cellSize / 2);
|
|
50
48
|
const programMain = initProgram(glContext, `main${colCount}-${padCount}`, vertex, getFragment(colCount, padCount));
|
|
51
49
|
const { gl } = glContext;
|
|
50
|
+
// debugShaders(gl); // comment for production
|
|
52
51
|
gl.useProgram(programMain.program);
|
|
53
52
|
mainProgram(glContext, programMain, psss, viewbox, maxDistance, sdfExponent, x, y, width, height, colCount, cellSize, inclInside, inclOutside, padCount, stretch);
|
|
54
|
-
//
|
|
55
|
-
if (
|
|
56
|
-
|
|
57
|
-
|
|
53
|
+
// testing!!
|
|
54
|
+
if (Math.random() > 0.995) {
|
|
55
|
+
const loseContextExt = gl.getExtension('WEBGL_lose_context');
|
|
56
|
+
if (loseContextExt) {
|
|
57
|
+
loseContextExt.loseContext();
|
|
58
|
+
}
|
|
58
59
|
}
|
|
59
60
|
}
|
|
60
61
|
export { generateSdf };
|
package/node/generate-sdf.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"generate-sdf.js","sourceRoot":"","sources":["../src/generate-sdf.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAC9D,OAAO,EAAE,+BAA+B,EAAE,MAAM,sCAAsC,CAAC;AAEvF,qDAAqD;AAErD,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC;AAGhC;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,SAAS,WAAW,CACZ,SAAoB,EACpB,sBAAiD,EACjD,KAAa,EACb,MAAc,EACd,OAAsC,EACtC,WAAmB,EACnB,WAAW,GAAG,CAAC,EACf,UAAU,GAAG,IAAI,EACjB,WAAW,GAAG,IAAI,EAClB,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EACZ,OAAO,GAAG,CAAC;IAEf
|
|
1
|
+
{"version":3,"file":"generate-sdf.js","sourceRoot":"","sources":["../src/generate-sdf.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAC9D,OAAO,EAAE,+BAA+B,EAAE,MAAM,sCAAsC,CAAC;AAEvF,qDAAqD;AAErD,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC;AAGhC;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,SAAS,WAAW,CACZ,SAAoB,EACpB,sBAAiD,EACjD,KAAa,EACb,MAAc,EACd,OAAsC,EACtC,WAAmB,EACnB,WAAW,GAAG,CAAC,EACf,UAAU,GAAG,IAAI,EACjB,WAAW,GAAG,IAAI,EAClB,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EACZ,OAAO,GAAG,CAAC;IAEf,MAAM,IAAI,GAAG,OAAO,sBAAsB,KAAK,QAAQ;QACnD,CAAC,CAAC,eAAe,CAAC,sBAAsB,CAAC;QACzC,CAAC,CAAC,sBAAsB,CAAC;IAE7B,yCAAyC;IAEzC,IAAI,OAAO,GAAG,CAAC,CAAC;IAChB,MAAM,WAAW,GAAG,KAAK,GAAC,MAAM,CAAC;IACjC,IAAI,WAAW,GAAG,+BAA+B,EAAE,CAAC;QAChD,MAAM,CAAC,GAAG,KAAK,GAAC,+BAA+B,CAAC;QAChD,OAAO,GAAG,CAAC,GAAC,MAAM,CAAC;QACnB,MAAM,GAAG,CAAC,CAAC;IACf,CAAC;IAED,MAAM,QAAQ,GAAG,MAAM,GAAC,SAAS,CAAC;IAElC,MAAM,MAAM,GAAG,GAAG,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;IAClC,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,GAAC,QAAQ,CAAC,CAAC;IAEtC,MAAM,QAAQ,GAAG,CAAC,GAAC,IAAI,CAAC,GAAG,CAAC,WAAW,EAAE,MAAM,CAAC,GAAC,QAAQ,GAAC,CAAC,CAAC,CAAC;IAE7D,MAAM,WAAW,GAAG,WAAW,CAC3B,SAAS,EAAE,OAAO,QAAQ,IAAI,QAAQ,EAAE,EACxC,MAAM,EAAE,WAAW,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAC1C,CAAC;IAEF,MAAM,EAAE,EAAE,EAAE,GAAG,SAAS,CAAC;IAEzB,+CAA+C;IAE/C,EAAE,CAAC,UAAU,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;IACnC,WAAW,CACP,SAAS,EAAE,WAAW,EAAE,IAAI,EAC5B,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAChE,QAAQ,EAAE,UAAU,EAAE,WAAW,EAAE,QAAQ,EAAE,OAAO,CACvD,CAAC;IAEF,YAAY;IACZ,IAAI,IAAI,CAAC,MAAM,EAAE,GAAG,KAAK,EAAE,CAAC;QACxB,MAAM,cAAc,GAAG,EAAE,CAAC,YAAY,CAAC,oBAAoB,CAAC,CAAC;QAC7D,IAAI,cAAc,EAAE,CAAC;YACjB,cAAc,CAAC,WAAW,EAAE,CAAC;QACjC,CAAC;IACL,CAAC;AACL,CAAC;AAGD,OAAO,EAAE,WAAW,EAAE,CAAA"}
|
package/node/main-program.js
CHANGED
|
@@ -31,7 +31,6 @@ function mainProgram(glContext, programMain, psss, viewbox, maxDistance, sdfExpo
|
|
|
31
31
|
gl.INT, gl.STATIC_DRAW, closeCellIdxs_PerCell_Range_Arr, 1 // instance division (once per instance)
|
|
32
32
|
);
|
|
33
33
|
// Init/update uniforms
|
|
34
|
-
setUniform_('2f', 'uOffset', x, y);
|
|
35
34
|
setUniform_('2f', 'uWidthHeight', width, height);
|
|
36
35
|
setUniform_('1f', 'uMaxDistance', maxDistance);
|
|
37
36
|
setUniform_('1f', 'uExponent', sdfExponent); // TODO
|
|
@@ -87,9 +86,9 @@ function mainProgram(glContext, programMain, psss, viewbox, maxDistance, sdfExpo
|
|
|
87
86
|
///////////////////////////////////////////////
|
|
88
87
|
if (stretch > 1) {
|
|
89
88
|
gl.enable(gl.SCISSOR_TEST);
|
|
90
|
-
gl.scissor(
|
|
89
|
+
gl.scissor(x, y, width, height / stretch);
|
|
91
90
|
}
|
|
92
|
-
gl.viewport(
|
|
91
|
+
gl.viewport(x, y, width, height);
|
|
93
92
|
// draw a square colCount * ROW_COUNT times - 6 vertics
|
|
94
93
|
gl.drawArraysInstanced(gl.TRIANGLES, 0, 6, colCount * ROW_COUNT);
|
|
95
94
|
if (stretch > 1) {
|
package/node/main-program.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"main-program.js","sourceRoot":"","sources":["../src/main-program.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAC1D,OAAO,EAAE,eAAe,EAAE,MAAM,oCAAoC,CAAC;AAErE,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAG3C,MAAM,aAAa,GAAG,CAAC,CAAC;AACxB,MAAM,cAAc,GAAG,CAAC,CAAC;AACzB,MAAM,eAAe,GAAG,CAAC,CAAC;AAG1B,SAAS,WAAW,CACZ,SAAoB,EACpB,WAAoB,EACpB,IAAoB,EACpB,OAAsC,EACtC,WAAmB,EACnB,WAAW,GAAG,CAAC,EACf,CAAS,EACT,CAAS,EACT,KAAa,EACb,MAAc,EACd,QAAgB,EAChB,QAAgB,EAChB,UAAmB,EACnB,WAAoB,EACpB,QAAgB,EAChB,OAAe;IAEnB,MAAM,EAAE,EAAE,EAAE,GAAG,SAAS,CAAC;IAEzB,MAAM,QAAQ,GAAa,EAAE,CAAC;IAC9B,MAAM,EAAE,GAAG,CAAC,CAAC;IACb,MAAM,EAAE,GAAG,CAAC,CAAC;IACb,MAAM,EAAE,GAAG,CAAC,GAAC,SAAS,CAAC;IACvB,MAAM,EAAE,GAAG,CAAC,GAAC,SAAS,CAAC;IAEvB,QAAQ,CAAC,IAAI,CAAC,EAAE,EAAC,EAAE,EAAE,EAAE,EAAC,EAAE,EAAE,EAAE,EAAC,EAAE,CAAC,CAAC,CAAE,4CAA4C;IACjF,QAAQ,CAAC,IAAI,CAAC,EAAE,EAAC,EAAE,EAAE,EAAE,EAAC,EAAE,EAAE,EAAE,EAAC,EAAE,CAAC,CAAC,CAAE,6CAA6C;IAClF,MAAM,KAAK,GAAG,IAAI,YAAY,CAAC,QAAQ,CAAC,CAAC;IAEzC,MAAM,WAAW,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IAC5C,MAAM,aAAa,GAAG,YAAY,CAAC,WAAW,CAAC,CAAC;IAEhD,MAAM,EACF,mBAAmB,EAAE,yBAAyB,EAC9C,yBAAyB,EAAE,+BAA+B,EAC1D,yBAAyB,EAAE,+BAA+B,EAC1D,0BAA0B,EAC7B,GAAG,cAAc,CACd,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,WAAW,EACpD,QAAQ,EAAE,OAAO,EAAE,OAAO,CAC7B,CAAC;IAEF,yBAAyB;IACzB,aAAa,CACT,KAAK,EAAE,CAAC,EAAG,yCAAyC;IACpD,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,WAAW,EAAE,KAAK,CAClC,CAAC;IAEF,aAAa,CACT,uBAAuB,EACvB,CAAC,EAAG,QAAQ;IACZ,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,WAAW,EAAE,+BAA+B,EACvD,CAAC,CAAE,wCAAwC;KAC9C,CAAC;IAEF,aAAa,CACT,2BAA2B,EAC3B,CAAC,EAAG,QAAQ;IACZ,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,WAAW,EAAE,+BAA+B,EACvD,CAAC,CAAE,wCAAwC;KAC9C,CAAC;IAEF,uBAAuB;IACvB,WAAW,CAAC,IAAI,EAAE,
|
|
1
|
+
{"version":3,"file":"main-program.js","sourceRoot":"","sources":["../src/main-program.ts"],"names":[],"mappings":"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"}
|
package/node/shaders/vertex.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const vertex = "#version 300 es\n\nprecision highp float;\n\nuniform vec2 uWidthHeight;\
|
|
1
|
+
declare const vertex = "#version 300 es\n\nprecision highp float;\n\nuniform vec2 uWidthHeight;\nin vec2 aUV;\nin ivec2 aCloseCellIdxRangePerCell;\nin ivec2 aCrossIdxRangePerCell;\nout vec2 vXY;\nflat out int instanceId;\nflat out ivec2 closeCellIdxRange;\nflat out ivec2 crossCellIdxRange;\n\n\nvoid main() {\n instanceId = gl_InstanceID;\n closeCellIdxRange = aCloseCellIdxRangePerCell;\n crossCellIdxRange = aCrossIdxRangePerCell;\n\n // drawn column-by-column\n float i = float(instanceId / 32); // column index\n float j = float(instanceId % 32); // row index\n\n vec2 trans = vec2(\n i / float(32),\n j / float(32)\n );\n\n vec2 uv = aUV + trans;\n\n float width = uWidthHeight.x;\n float height = uWidthHeight.y;\n\n vXY = vec2(\n height * uv.x,\n height * uv.y\n );\n\n float aspectRatio = width / height;\n\n gl_Position = vec4(\n vec2(\n (2.0*(uv.x / aspectRatio) - 1.0),\n (2.0*uv.y - 1.0)\n ),\n 0.0, 1.0\n );\n}\n";
|
|
2
2
|
export { vertex };
|
package/node/shaders/vertex.js
CHANGED
|
@@ -4,7 +4,6 @@ const vertex = /*glsl*/ `#version 300 es
|
|
|
4
4
|
precision highp float;
|
|
5
5
|
|
|
6
6
|
uniform vec2 uWidthHeight;
|
|
7
|
-
uniform vec2 uOffset;
|
|
8
7
|
in vec2 aUV;
|
|
9
8
|
in ivec2 aCloseCellIdxRangePerCell;
|
|
10
9
|
in ivec2 aCrossIdxRangePerCell;
|
|
@@ -40,14 +39,11 @@ void main() {
|
|
|
40
39
|
|
|
41
40
|
float aspectRatio = width / height;
|
|
42
41
|
|
|
43
|
-
float x = (uOffset.x / 2.0*width) - 1.0;
|
|
44
|
-
float y = (uOffset.y / 2.0*height) - 1.0;
|
|
45
|
-
|
|
46
42
|
gl_Position = vec4(
|
|
47
43
|
vec2(
|
|
48
44
|
(2.0*(uv.x / aspectRatio) - 1.0),
|
|
49
45
|
(2.0*uv.y - 1.0)
|
|
50
|
-
)
|
|
46
|
+
),
|
|
51
47
|
0.0, 1.0
|
|
52
48
|
);
|
|
53
49
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"vertex.js","sourceRoot":"","sources":["../../src/shaders/vertex.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAE5C,MAAM,MAAM,GAAG,QAAQ,CAAA
|
|
1
|
+
{"version":3,"file":"vertex.js","sourceRoot":"","sources":["../../src/shaders/vertex.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAE5C,MAAM,MAAM,GAAG,QAAQ,CAAA;;;;;;;;;;;;;;;;;;;;mCAoBY,SAAS;mCACT,SAAS;;;oBAGxB,SAAS;oBACT,SAAS;;;;;;;;;;;;;;;;;;;;;;;CAuB5B,CAAC;AAGF,OAAO,EAAE,MAAM,EAAE,CAAA"}
|
|
@@ -15,23 +15,15 @@ function getWebGlContext(gl) {
|
|
|
15
15
|
}
|
|
16
16
|
const programs = {};
|
|
17
17
|
const textures = {};
|
|
18
|
-
gl
|
|
19
|
-
|
|
20
|
-
|
|
18
|
+
const glContext = { gl, textures, programs };
|
|
19
|
+
gl.canvas.addEventListener('webglcontextlost', event => {
|
|
20
|
+
deleteAllProps(programs);
|
|
21
|
+
deleteAllProps(textures);
|
|
22
|
+
cache.delete(gl);
|
|
23
|
+
glContext.onContextLoss?.(event);
|
|
21
24
|
}, false);
|
|
22
|
-
const glContext = {
|
|
23
|
-
gl,
|
|
24
|
-
onContextLoss,
|
|
25
|
-
textures,
|
|
26
|
-
programs
|
|
27
|
-
};
|
|
28
25
|
cache.set(gl, glContext);
|
|
29
26
|
return glContext;
|
|
30
|
-
////////////////////////
|
|
31
|
-
function onContextLoss() {
|
|
32
|
-
deleteAllProps(programs);
|
|
33
|
-
deleteAllProps(textures);
|
|
34
|
-
}
|
|
35
27
|
}
|
|
36
28
|
function deleteAllProps(o) {
|
|
37
29
|
Object.keys(o).forEach(key => { delete o[key]; });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-web-gl-context.js","sourceRoot":"","sources":["../../src/webgl-utils/get-web-gl-context.ts"],"names":[],"mappings":"AAKA,MAAM,KAAK,GAAG,IAAI,OAAO,EAAqC,CAAC;AAG/D;;;;;;GAMG;AACH,SAAS,eAAe,CAChB,EAA0B;IAE9B,CAAC;QACG,MAAM,SAAS,GAAG,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QAChC,IAAI,SAAS,EAAE,CAAC;YAAC,OAAO,SAAS,CAAC;QAAC,CAAC;IACxC,CAAC;IAED,MAAM,QAAQ,GAAgC,EAAE,CAAC;IACjD,MAAM,QAAQ,GAAgC,EAAE,CAAC;IAEjD,
|
|
1
|
+
{"version":3,"file":"get-web-gl-context.js","sourceRoot":"","sources":["../../src/webgl-utils/get-web-gl-context.ts"],"names":[],"mappings":"AAKA,MAAM,KAAK,GAAG,IAAI,OAAO,EAAqC,CAAC;AAG/D;;;;;;GAMG;AACH,SAAS,eAAe,CAChB,EAA0B;IAE9B,CAAC;QACG,MAAM,SAAS,GAAG,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QAChC,IAAI,SAAS,EAAE,CAAC;YAAC,OAAO,SAAS,CAAC;QAAC,CAAC;IACxC,CAAC;IAED,MAAM,QAAQ,GAAgC,EAAE,CAAC;IACjD,MAAM,QAAQ,GAAgC,EAAE,CAAC;IAEjD,MAAM,SAAS,GAAc,EAAE,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC;IAExD,EAAE,CAAC,MAAM,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,KAAK,CAAC,EAAE;QACnD,cAAc,CAAC,QAAQ,CAAC,CAAC;QACzB,cAAc,CAAC,QAAQ,CAAC,CAAC;QACzB,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;QAEjB,SAAS,CAAC,aAAa,EAAE,CAAC,KAAK,CAAC,CAAC;IACrC,CAAC,EAAE,KAAK,CAAC,CAAC;IAEV,KAAK,CAAC,GAAG,CAAC,EAAE,EAAE,SAAS,CAAC,CAAC;IAEzB,OAAO,SAAS,CAAC;AACrB,CAAC;AAGD,SAAS,cAAc,CAAC,CAA6B;IACjD,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,GAAG,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACtD,CAAC;AAGD,OAAO,EAAE,eAAe,EAAE,CAAA"}
|
package/package.json
CHANGED
package/src/debug-shaders.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { getFragment } from "./shaders/fragment.js";
|
|
2
|
+
import { vertex } from "./shaders/vertex.js";
|
|
3
3
|
|
|
4
4
|
|
|
5
5
|
/**
|
|
@@ -26,8 +26,8 @@ function debugShaders(
|
|
|
26
26
|
gl: WebGL2RenderingContext) {
|
|
27
27
|
|
|
28
28
|
try {
|
|
29
|
-
debugGlsl(gl, gl.VERTEX_SHADER,
|
|
30
|
-
debugGlsl(gl, gl.FRAGMENT_SHADER,
|
|
29
|
+
debugGlsl(gl, gl.VERTEX_SHADER, vertex);
|
|
30
|
+
debugGlsl(gl, gl.FRAGMENT_SHADER, getFragment(32,4));
|
|
31
31
|
} catch (e) {
|
|
32
32
|
console.log(e);
|
|
33
33
|
throw e;
|
package/src/generate-sdf.ts
CHANGED
|
@@ -46,16 +46,12 @@ function generateSdf(
|
|
|
46
46
|
x = 0, y = 0,
|
|
47
47
|
channel = 0) {
|
|
48
48
|
|
|
49
|
-
// debugShaders(gl); // comment for production
|
|
50
|
-
|
|
51
49
|
const psss = typeof bezierCurves_or_svgStr === 'string'
|
|
52
50
|
? getPathsFromStr(bezierCurves_or_svgStr)
|
|
53
51
|
: bezierCurves_or_svgStr;
|
|
54
52
|
|
|
55
53
|
// const glContext = getWebGLContext(gl);
|
|
56
54
|
|
|
57
|
-
const { onContextLoss } = glContext;
|
|
58
|
-
|
|
59
55
|
let stretch = 1;
|
|
60
56
|
const aspectRatio = width/height;
|
|
61
57
|
if (aspectRatio > MAX_ASPECT_RATIO_BEFORE_STRETCH) {
|
|
@@ -78,6 +74,8 @@ function generateSdf(
|
|
|
78
74
|
|
|
79
75
|
const { gl } = glContext;
|
|
80
76
|
|
|
77
|
+
// debugShaders(gl); // comment for production
|
|
78
|
+
|
|
81
79
|
gl.useProgram(programMain.program);
|
|
82
80
|
mainProgram(
|
|
83
81
|
glContext, programMain, psss,
|
|
@@ -85,11 +83,12 @@ function generateSdf(
|
|
|
85
83
|
cellSize, inclInside, inclOutside, padCount, stretch
|
|
86
84
|
);
|
|
87
85
|
|
|
88
|
-
//
|
|
89
|
-
if (
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
86
|
+
// testing!!
|
|
87
|
+
if (Math.random() > 0.995) {
|
|
88
|
+
const loseContextExt = gl.getExtension('WEBGL_lose_context');
|
|
89
|
+
if (loseContextExt) {
|
|
90
|
+
loseContextExt.loseContext();
|
|
91
|
+
}
|
|
93
92
|
}
|
|
94
93
|
}
|
|
95
94
|
|
package/src/main-program.ts
CHANGED
|
@@ -78,7 +78,6 @@ function mainProgram(
|
|
|
78
78
|
);
|
|
79
79
|
|
|
80
80
|
// Init/update uniforms
|
|
81
|
-
setUniform_('2f', 'uOffset', x, y);
|
|
82
81
|
setUniform_('2f', 'uWidthHeight', width, height);
|
|
83
82
|
setUniform_('1f', 'uMaxDistance', maxDistance);
|
|
84
83
|
setUniform_('1f', 'uExponent', sdfExponent); // TODO
|
|
@@ -144,10 +143,10 @@ function mainProgram(
|
|
|
144
143
|
|
|
145
144
|
if (stretch > 1) {
|
|
146
145
|
gl.enable(gl.SCISSOR_TEST);
|
|
147
|
-
gl.scissor(
|
|
146
|
+
gl.scissor(x, y, width, height/stretch)
|
|
148
147
|
}
|
|
149
148
|
|
|
150
|
-
gl.viewport(
|
|
149
|
+
gl.viewport(x, y, width, height);
|
|
151
150
|
|
|
152
151
|
// draw a square colCount * ROW_COUNT times - 6 vertics
|
|
153
152
|
gl.drawArraysInstanced(gl.TRIANGLES, 0, 6, colCount*ROW_COUNT);
|
package/src/shaders/vertex.ts
CHANGED
|
@@ -5,7 +5,6 @@ const vertex = /*glsl*/`#version 300 es
|
|
|
5
5
|
precision highp float;
|
|
6
6
|
|
|
7
7
|
uniform vec2 uWidthHeight;
|
|
8
|
-
uniform vec2 uOffset;
|
|
9
8
|
in vec2 aUV;
|
|
10
9
|
in ivec2 aCloseCellIdxRangePerCell;
|
|
11
10
|
in ivec2 aCrossIdxRangePerCell;
|
|
@@ -41,14 +40,11 @@ void main() {
|
|
|
41
40
|
|
|
42
41
|
float aspectRatio = width / height;
|
|
43
42
|
|
|
44
|
-
float x = (uOffset.x / 2.0*width) - 1.0;
|
|
45
|
-
float y = (uOffset.y / 2.0*height) - 1.0;
|
|
46
|
-
|
|
47
43
|
gl_Position = vec4(
|
|
48
44
|
vec2(
|
|
49
45
|
(2.0*(uv.x / aspectRatio) - 1.0),
|
|
50
46
|
(2.0*uv.y - 1.0)
|
|
51
|
-
)
|
|
47
|
+
),
|
|
52
48
|
0.0, 1.0
|
|
53
49
|
);
|
|
54
50
|
}
|
package/src/types/gl-context.ts
CHANGED
|
@@ -24,29 +24,19 @@ function getWebGlContext(
|
|
|
24
24
|
const programs: { [index:string]: Program } = {};
|
|
25
25
|
const textures: { [index:string]: Texture } = {};
|
|
26
26
|
|
|
27
|
-
gl
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
27
|
+
const glContext: GlContext = { gl, textures, programs };
|
|
28
|
+
|
|
29
|
+
gl.canvas.addEventListener('webglcontextlost', event => {
|
|
30
|
+
deleteAllProps(programs);
|
|
31
|
+
deleteAllProps(textures);
|
|
32
|
+
cache.delete(gl);
|
|
31
33
|
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
onContextLoss,
|
|
35
|
-
textures,
|
|
36
|
-
programs
|
|
37
|
-
};
|
|
34
|
+
glContext.onContextLoss?.(event);
|
|
35
|
+
}, false);
|
|
38
36
|
|
|
39
37
|
cache.set(gl, glContext);
|
|
40
38
|
|
|
41
39
|
return glContext;
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
////////////////////////
|
|
45
|
-
|
|
46
|
-
function onContextLoss() {
|
|
47
|
-
deleteAllProps(programs);
|
|
48
|
-
deleteAllProps(textures);
|
|
49
|
-
}
|
|
50
40
|
}
|
|
51
41
|
|
|
52
42
|
|