322 lines
431 KiB
JavaScript
322 lines
431 KiB
JavaScript
|
|
function Bs(r,e){(e==null||e>r.length)&&(e=r.length);for(var t=0,a=Array(e);t<e;t++)a[t]=r[t];return a}function ec(r){if(Array.isArray(r))return r}function rc(r){if(Array.isArray(r))return Bs(r)}function ht(r,e){if(!(r instanceof e))throw new TypeError("Cannot call a class as a function")}function tc(r,e){for(var t=0;t<e.length;t++){var a=e[t];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(r,jl(a.key),a)}}function gt(r,e,t){return e&&tc(r.prototype,e),Object.defineProperty(r,"prototype",{writable:!1}),r}function kr(r,e){var t=typeof Symbol<"u"&&r[Symbol.iterator]||r["@@iterator"];if(!t){if(Array.isArray(r)||(t=Xs(r))||e){t&&(r=t);var a=0,n=function(){};return{s:n,n:function(){return a>=r.length?{done:!0}:{done:!1,value:r[a++]}},e:function(l){throw l},f:n}}throw new TypeError(`Invalid attempt to iterate non-iterable instance.
|
||
|
|
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}var i,s=!0,o=!1;return{s:function(){t=t.call(r)},n:function(){var l=t.next();return s=l.done,l},e:function(l){o=!0,i=l},f:function(){try{s||t.return==null||t.return()}finally{if(o)throw i}}}}function Jl(r,e,t){return(e=jl(e))in r?Object.defineProperty(r,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):r[e]=t,r}function ac(r){if(typeof Symbol<"u"&&r[Symbol.iterator]!=null||r["@@iterator"]!=null)return Array.from(r)}function nc(r,e){var t=r==null?null:typeof Symbol<"u"&&r[Symbol.iterator]||r["@@iterator"];if(t!=null){var a,n,i,s,o=[],l=!0,u=!1;try{if(i=(t=t.call(r)).next,e===0){if(Object(t)!==t)return;l=!1}else for(;!(l=(a=i.call(t)).done)&&(o.push(a.value),o.length!==e);l=!0);}catch(v){u=!0,n=v}finally{try{if(!l&&t.return!=null&&(s=t.return(),Object(s)!==s))return}finally{if(u)throw n}}return o}}function ic(){throw new TypeError(`Invalid attempt to destructure non-iterable instance.
|
||
|
|
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}function sc(){throw new TypeError(`Invalid attempt to spread non-iterable instance.
|
||
|
|
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}function Je(r,e){return ec(r)||nc(r,e)||Xs(r,e)||ic()}function mn(r){return rc(r)||ac(r)||Xs(r)||sc()}function oc(r,e){if(typeof r!="object"||!r)return r;var t=r[Symbol.toPrimitive];if(t!==void 0){var a=t.call(r,e);if(typeof a!="object")return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(r)}function jl(r){var e=oc(r,"string");return typeof e=="symbol"?e:e+""}function ar(r){"@babel/helpers - typeof";return ar=typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?function(e){return typeof e}:function(e){return e&&typeof Symbol=="function"&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},ar(r)}function Xs(r,e){if(r){if(typeof r=="string")return Bs(r,e);var t={}.toString.call(r).slice(8,-1);return t==="Object"&&r.constructor&&(t=r.constructor.name),t==="Map"||t==="Set"?Array.from(r):t==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?Bs(r,e):void 0}}var rr=typeof window>"u"?null:window,To=rr?rr.navigator:null;rr&&rr.document;var uc=ar(""),ev=ar({}),lc=ar(function(){}),vc=typeof HTMLElement>"u"?"undefined":ar(HTMLElement),La=function(e){return e&&e.instanceString&&Ue(e.instanceString)?e.instanceString():null},ge=function(e){return e!=null&&ar(e)==uc},Ue=function(e){return e!=null&&ar(e)===lc},_e=function(e){return!Dr(e)&&(Array.isArray?Array.isArray(e):e!=null&&e instanceof Array)},Le=function(e){return e!=null&&ar(e)===ev&&!_e(e)&&e.constructor===Object},fc=function(e){return e!=null&&ar(e)===ev},ae=function(e){return e!=null&&ar(e)===ar(1)&&!isNaN(e)},cc=function(e){return ae(e)&&Math.floor(e)===e},bn=function(e){if(vc!=="undefined")return e!=null&&e instanceof HTMLElement},Dr=function(e){return Ia(e)||rv(e)},Ia=function(e){return La(e)==="collection"&&e._private.single},rv=function(e){return La(e)==="collection"&&!e._private.single},Ys=function(e){return La(e)==="core"},tv=function(e){return La(e)==="stylesheet"},dc=function(e){return La(e)==="event"},ut=function(e){return e==null?!0:!!(e===""||e.match(/^\s+$/))},hc=function(e){return typeof HTMLElement>"u"?!1:e instanceof HTMLElement},gc=function(e){return Le(e)&&ae(e.x1)&&ae(e.x2)&&ae(e.y1)&&ae(e.y2)},pc=function(e){return fc(e)&&Ue(e.then)},yc=function(){return To&&To.userAgent.match(/msie|trident|edge/i)},Qt=function(e,t){t||(t=function(){if(arguments.length===1)return arguments[0];if(arguments.length===0)return"undefined";for(var i=[],s=0;s<arguments.length;s++)i.push(arguments[s]);return i.join("$")});var a=function(){var i=this,s=arguments,o,l=t.apply(i,s),u=a.cache;return(o=u[l])||(o=u[l]=e.apply(i,s)),o};return a.cache={},a},Zs=Qt(function(r){return r.replace(/([A-Z])/g,function(e){return"-"+e.toLowerCase()})}),Mn=Qt(function(r){return r.replace(/(-\w)/g,function(e){return e[1].toUpperCase()})}),av=Qt(function(r,e){return r+e[0].toUpperCase()+e.substring(1)},function(r,e){return r+"$"+e}),So=function(e){return ut(e)?e:e.charAt(0).toUpperCase()+e.substring(1)},at=function(e,t){return e.slice(-1*t.length)===t},tr="(?:[-+]?(?:(?:\\d+|\\d*\\.\\d+)(?:[Ee][+-]?\\d+)?))",mc="rgb[a]?\\(("+tr+"[%]?)\\s*,\\s*("+tr+"[%]?)\\s*,\\s*("+tr+"[%]?)(?:\\s*,\\s*("+tr+"))?\\)",bc="rgb[a]?\\((?:"+tr+"[%]?)\\s*,\\s*(?:"+tr+"[%]?)\\s*,\\s*(?:"+tr+"[%]?)(?:\\s*,\\s*(?:"+tr+"))?\\)",wc="hsl[a]?\\(("+tr+")\\s*,\\s*("+tr+"[%])\\s*,\\s*("+tr+"[%])(?:\\s*,\\s*("+tr+"))?\\)",xc="hsl[a]?\\((?:"+tr+")\\s*,\\s*(?:"+tr+"[%])\\s*,\\s*(?:"+tr+"[%])(?:\\s*,\\s*(?:"+tr+"))?\\)",Ec="\\#[0-9a-fA-F]{3}",Cc="\\#[0-9a-fA-F]{6}",nv=function(e,t){return e<t?-1:e>t?1:0},Tc=function(e,t){return-1*nv(e,t)},be=Object.assign!=null?Object.assign.bind(Object):function(r){for(var e=arguments,t=1;t<e.length;t++){var a=e[t];if(a!=null)for(var n=Object.keys(a),i=0;i<n.length;i++){var s=n[i];r[s]=a[s]}}return r},Sc=function(e){if(!(!(e.length===4||e.length===7)||e[0]!=="#")){var t=e.length===4,a,n,i,s=16;return t?(a=parseInt(e[1]+e[1],s),n=parseInt(e[2]+e[2],s),i=parseInt(e[3]+e[3],s)):(a=parseInt(e[1]+e[2],s),n=parseInt(e[3]+e[4],s),i=parseInt(e[5]+e[6],s)),[
|
||
|
|
`),f=r.pstyle("text-max-width").pfValue,c=r.pstyle("text-overflow-wrap").value,h=c==="anywhere",d=[],y=/[\s\u200b]+|$/g,g=0;g<v.length;g++){var p=v[g],m=this.calculateLabelDimensions(r,p),b=m.width;if(h){var w=p.split("").join(u);p=w}if(b>f){var E=p.matchAll(y),C="",x=0,T=kr(E),k;try{for(T.s();!(k=T.n()).done;){var D=k.value,B=D[0],P=p.substring(x,D.index);x=D.index+B.length;var A=C.length===0?P:C+P+B,R=this.calculateLabelDimensions(r,A),L=R.width;L<=f?C+=P+B:(C&&d.push(C),C=P+B)}}catch(F){T.e(F)}finally{T.f()}C.match(/^[\s\u200b]+$/)||d.push(C)}else d.push(p)}s("labelWrapCachedLines",d),n=s("labelWrapCachedText",d.join(`
|
||
|
|
`)),s("labelWrapKey",l)}else if(o==="ellipsis"){var I=r.pstyle("text-max-width").pfValue,M="",O="…",V=!1;if(this.calculateLabelDimensions(r,n).width<I)return n;for(var G=0;G<n.length;G++){var N=this.calculateLabelDimensions(r,M+n[G]+O).width;if(N>I)break;M+=n[G],G===n.length-1&&(V=!0)}return V||(M+=O),M}return n};Gr.getLabelJustification=function(r){var e=r.pstyle("text-justification").strValue,t=r.pstyle("text-halign").strValue;if(e==="auto")if(r.isNode())switch(t){case"left":return"right";case"right":return"left";default:return"center"}else return"center";else return e};Gr.calculateLabelDimensions=function(r,e){var t=this,a=t.cy.window(),n=a.document,i=0,s=r.pstyle("font-style").strValue,o=r.pstyle("font-size").pfValue,l=r.pstyle("font-family").strValue,u=r.pstyle("font-weight").strValue,v=this.labelCalcCanvas,f=this.labelCalcCanvasContext;if(!v){v=this.labelCalcCanvas=n.createElement("canvas"),f=this.labelCalcCanvasContext=v.getContext("2d");var c=v.style;c.position="absolute",c.left="-9999px",c.top="-9999px",c.zIndex="-1",c.visibility="hidden",c.pointerEvents="none"}f.font="".concat(s," ").concat(u," ").concat(o,"px ").concat(l);for(var h=0,d=0,y=e.split(`
|
||
|
|
`),g=0;g<y.length;g++){var p=y[g],m=f.measureText(p),b=Math.ceil(m.width),w=o;h=Math.max(b,h),d+=w}return h+=i,d+=i,{width:h,height:d}};Gr.calculateLabelAngle=function(r,e){var t=r._private,a=t.rscratch,n=r.isEdge(),i=e?e+"-":"",s=r.pstyle(i+"text-rotation"),o=s.strValue;return o==="none"?0:n&&o==="autorotate"?a.labelAutoAngle:o==="autorotate"?0:s.pfValue};Gr.calculateLabelAngles=function(r){var e=this,t=r.isEdge(),a=r._private,n=a.rscratch;n.labelAngle=e.calculateLabelAngle(r),t&&(n.sourceLabelAngle=e.calculateLabelAngle(r,"source"),n.targetLabelAngle=e.calculateLabelAngle(r,"target"))};var wf={},Ll=28,Il=!1;wf.getNodeShape=function(r){var e=this,t=r.pstyle("shape").value;if(t==="cutrectangle"&&(r.width()<Ll||r.height()<Ll))return Il||(Ve("The `cutrectangle` node shape can not be used at small sizes so `rectangle` is used instead"),Il=!0),"rectangle";if(r.isParent())return t==="rectangle"||t==="roundrectangle"||t==="round-rectangle"||t==="cutrectangle"||t==="cut-rectangle"||t==="barrel"?t:"rectangle";if(t==="polygon"){var a=r.pstyle("shape-polygon-points").value;return e.nodeShapes.makePolygon(a).name}return t};var Xn={};Xn.registerCalculationListeners=function(){var r=this.cy,e=r.collection(),t=this,a=function(s){var o=arguments.length>1&&arguments[1]!==void 0?arguments[1]:!0;if(e.merge(s),o)for(var l=0;l<s.length;l++){var u=s[l],v=u._private,f=v.rstyle;f.clean=!1,f.cleanConnected=!1}};t.binder(r).on("bounds.* dirty.*",function(s){var o=s.target;a(o)}).on("style.* background.*",function(s){var o=s.target;a(o,!1)});var n=function(s){if(s){var o=t.onUpdateEleCalcsFns;e.cleanStyle();for(var l=0;l<e.length;l++){var u=e[l],v=u._private.rstyle;u.isNode()&&!v.cleanConnected&&(a(u.connectedEdges()),v.cleanConnected=!0)}if(o)for(var f=0;f<o.length;f++){var c=o[f];c(s,e)}t.recalculateRenderedStyle(e),e=r.collection()}};t.flushRenderedStyleQueue=function(){n(!0)},t.beforeRender(n,t.beforeRenderPriorities.eleCalcs)};Xn.onUpdateEleCalcs=function(r){var e=this.onUpdateEleCalcsFns=this.onUpdateEleCalcsFns||[];e.push(r)};Xn.recalculateRenderedStyle=function(r,e){var t=function(w){return w._private.rstyle.cleanConnected};if(r.length!==0){var a=[],n=[];if(!this.destroyed){e===void 0&&(e=!0);for(var i=0;i<r.length;i++){var s=r[i],o=s._private,l=o.rstyle;s.isEdge()&&(!t(s.source())||!t(s.target()))&&(l.clean=!1),s.isEdge()&&s.isBundledBezier()&&s.parallelEdges().some(function(b){return!b._private.rstyle.clean&&b.isBundledBezier()})&&(l.clean=!1),!(e&&l.clean||s.removed())&&s.pstyle("display").value!=="none"&&(o.group==="nodes"?n.push(s):a.push(s),l.clean=!0)}for(var u=0;u<n.length;u++){var v=n[u],f=v._private,c=f.rstyle,h=v.position();this.recalculateNodeLabelProjection(v),c.nodeX=h.x,c.nodeY=h.y,c.nodeW=v.pstyle("width").pfValue,c.nodeH=v.pstyle("height").pfValue}this.recalculateEdgeProjections(a);for(var d=0;d<a.length;d++){var y=a[d],g=y._private,p=g.rstyle,m=g.rscratch;p.srcX=m.arrowStartX,p.srcY=m.arrowStartY,p.tgtX=m.arrowEndX,p.tgtY=m.arrowEndY,p.midX=m.midX,p.midY=m.midY,p.labelAngle=m.labelAngle,p.sourceLabelAngle=m.sourceLabelAngle,p.targetLabelAngle=m.targetLabelAngle}}}};var Yn={};Yn.updateCachedGrabbedEles=function(){var r=this.cachedZSortedEles;if(r){r.drag=[],r.nondrag=[];for(var e=[],t=0;t<r.length;t++){var a=r[t],n=a._private.rscratch;a.grabbed()&&!a.isParent()?e.push(a):n.inDragLayer?r.drag.push(a):r.nondrag.push(a)}for(var t=0;t<e.length;t++){var a=e[t];r.drag.push(a)}}};Yn.invalidateCachedZSortedEles=function(){this.cachedZSortedEles=null};Yn.getCachedZSortedEles=function(r){if(r||!this.cachedZSortedEles){var e=this.cy.mutableElements().toArray();e.sort(ef),e.interactive=e.filter(function(t){return t.interactive()}),this.cachedZSortedEles=e,this.updateCachedGrabbedEles()}else e=this.cachedZSortedEles;return e};var xf={};[Mt,Bn,yr,Ga,yo,Gr,wf,Xn,Yn].forEach(function(r){be(xf,r)});var Ef={};Ef.getCachedImage=function(r,e,t){var a=this,n=a.imageCache=a.imageCache||{},i=n[r];if(i)return i.image.complete||i.image.addEventListener("load",t),i.image;i=n[r]=n[r]||{};var s=i.image=new Image;s.addEventListener("load",t),s.addEv
|
||
|
|
float circleSD(vec2 p, float r) {
|
||
|
|
return distance(vec2(0), p) - r; // signed distance
|
||
|
|
}
|
||
|
|
`,um=`
|
||
|
|
float rectangleSD(vec2 p, vec2 b) {
|
||
|
|
vec2 d = abs(p)-b;
|
||
|
|
return distance(vec2(0),max(d,0.0)) + min(max(d.x,d.y),0.0);
|
||
|
|
}
|
||
|
|
`,lm=`
|
||
|
|
float roundRectangleSD(vec2 p, vec2 b, vec4 cr) {
|
||
|
|
cr.xy = (p.x > 0.0) ? cr.xy : cr.zw;
|
||
|
|
cr.x = (p.y > 0.0) ? cr.x : cr.y;
|
||
|
|
vec2 q = abs(p) - b + cr.x;
|
||
|
|
return min(max(q.x, q.y), 0.0) + distance(vec2(0), max(q, 0.0)) - cr.x;
|
||
|
|
}
|
||
|
|
`,vm=`
|
||
|
|
float ellipseSD(vec2 p, vec2 ab) {
|
||
|
|
p = abs( p ); // symmetry
|
||
|
|
|
||
|
|
// find root with Newton solver
|
||
|
|
vec2 q = ab*(p-ab);
|
||
|
|
float w = (q.x<q.y)? 1.570796327 : 0.0;
|
||
|
|
for( int i=0; i<5; i++ ) {
|
||
|
|
vec2 cs = vec2(cos(w),sin(w));
|
||
|
|
vec2 u = ab*vec2( cs.x,cs.y);
|
||
|
|
vec2 v = ab*vec2(-cs.y,cs.x);
|
||
|
|
w = w + dot(p-u,v)/(dot(p-u,u)+dot(v,v));
|
||
|
|
}
|
||
|
|
|
||
|
|
// compute final point and distance
|
||
|
|
float d = length(p-ab*vec2(cos(w),sin(w)));
|
||
|
|
|
||
|
|
// return signed distance
|
||
|
|
return (dot(p/ab,p/ab)>1.0) ? d : -d;
|
||
|
|
}
|
||
|
|
`,Ea={SCREEN:{name:"screen",screen:!0},PICKING:{name:"picking",picking:!0}},An={IGNORE:1,USE_BB:2},Cs=0,Kl=1,Xl=2,Ts=3,_t=4,sn=5,ga=6,pa=7,fm=(function(){function r(e,t,a){ht(this,r),this.r=e,this.gl=t,this.maxInstances=a.webglBatchSize,this.atlasSize=a.webglTexSize,this.bgColor=a.bgColor,this.debug=a.webglDebug,this.batchDebugInfo=[],a.enableWrapping=!0,a.createTextureCanvas=Hy,this.atlasManager=new im(e,a),this.batchManager=new sm(a),this.simpleShapeOptions=new Map,this.program=this._createShaderProgram(Ea.SCREEN),this.pickingProgram=this._createShaderProgram(Ea.PICKING),this.vao=this._createVAO()}return gt(r,[{key:"addAtlasCollection",value:function(t,a){this.atlasManager.addAtlasCollection(t,a)}},{key:"addTextureAtlasRenderType",value:function(t,a){this.atlasManager.addRenderType(t,a)}},{key:"addSimpleShapeRenderType",value:function(t,a){this.simpleShapeOptions.set(t,a)}},{key:"invalidate",value:function(t){var a=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{},n=a.type,i=this.atlasManager;return n?i.invalidate(t,{filterType:function(o){return o===n},forceRedraw:!0}):i.invalidate(t)}},{key:"gc",value:function(){this.atlasManager.gc()}},{key:"_createShaderProgram",value:function(t){var a=this.gl,n=`#version 300 es
|
||
|
|
precision highp float;
|
||
|
|
|
||
|
|
uniform mat3 uPanZoomMatrix;
|
||
|
|
uniform int uAtlasSize;
|
||
|
|
|
||
|
|
// instanced
|
||
|
|
in vec2 aPosition; // a vertex from the unit square
|
||
|
|
|
||
|
|
in mat3 aTransform; // used to transform verticies, eg into a bounding box
|
||
|
|
in int aVertType; // the type of thing we are rendering
|
||
|
|
|
||
|
|
// the z-index that is output when using picking mode
|
||
|
|
in vec4 aIndex;
|
||
|
|
|
||
|
|
// For textures
|
||
|
|
in int aAtlasId; // which shader unit/atlas to use
|
||
|
|
in vec4 aTex; // x/y/w/h of texture in atlas
|
||
|
|
|
||
|
|
// for edges
|
||
|
|
in vec4 aPointAPointB;
|
||
|
|
in vec4 aPointCPointD;
|
||
|
|
in vec2 aLineWidth; // also used for node border width
|
||
|
|
|
||
|
|
// simple shapes
|
||
|
|
in vec4 aCornerRadius; // for round-rectangle [top-right, bottom-right, top-left, bottom-left]
|
||
|
|
in vec4 aColor; // also used for edges
|
||
|
|
in vec4 aBorderColor; // aLineWidth is used for border width
|
||
|
|
|
||
|
|
// output values passed to the fragment shader
|
||
|
|
out vec2 vTexCoord;
|
||
|
|
out vec4 vColor;
|
||
|
|
out vec2 vPosition;
|
||
|
|
// flat values are not interpolated
|
||
|
|
flat out int vAtlasId;
|
||
|
|
flat out int vVertType;
|
||
|
|
flat out vec2 vTopRight;
|
||
|
|
flat out vec2 vBotLeft;
|
||
|
|
flat out vec4 vCornerRadius;
|
||
|
|
flat out vec4 vBorderColor;
|
||
|
|
flat out vec2 vBorderWidth;
|
||
|
|
flat out vec4 vIndex;
|
||
|
|
|
||
|
|
void main(void) {
|
||
|
|
int vid = gl_VertexID;
|
||
|
|
vec2 position = aPosition; // TODO make this a vec3, simplifies some code below
|
||
|
|
|
||
|
|
if(aVertType == `.concat(Cs,`) {
|
||
|
|
float texX = aTex.x; // texture coordinates
|
||
|
|
float texY = aTex.y;
|
||
|
|
float texW = aTex.z;
|
||
|
|
float texH = aTex.w;
|
||
|
|
|
||
|
|
if(vid == 1 || vid == 2 || vid == 4) {
|
||
|
|
texX += texW;
|
||
|
|
}
|
||
|
|
if(vid == 2 || vid == 4 || vid == 5) {
|
||
|
|
texY += texH;
|
||
|
|
}
|
||
|
|
|
||
|
|
float d = float(uAtlasSize);
|
||
|
|
vTexCoord = vec2(texX / d, texY / d); // tex coords must be between 0 and 1
|
||
|
|
|
||
|
|
gl_Position = vec4(uPanZoomMatrix * aTransform * vec3(position, 1.0), 1.0);
|
||
|
|
}
|
||
|
|
else if(aVertType == `).concat(_t," || aVertType == ").concat(pa,`
|
||
|
|
|| aVertType == `).concat(sn," || aVertType == ").concat(ga,`) { // simple shapes
|
||
|
|
|
||
|
|
// the bounding box is needed by the fragment shader
|
||
|
|
vBotLeft = (aTransform * vec3(0, 0, 1)).xy; // flat
|
||
|
|
vTopRight = (aTransform * vec3(1, 1, 1)).xy; // flat
|
||
|
|
vPosition = (aTransform * vec3(position, 1)).xy; // will be interpolated
|
||
|
|
|
||
|
|
// calculations are done in the fragment shader, just pass these along
|
||
|
|
vColor = aColor;
|
||
|
|
vCornerRadius = aCornerRadius;
|
||
|
|
vBorderColor = aBorderColor;
|
||
|
|
vBorderWidth = aLineWidth;
|
||
|
|
|
||
|
|
gl_Position = vec4(uPanZoomMatrix * aTransform * vec3(position, 1.0), 1.0);
|
||
|
|
}
|
||
|
|
else if(aVertType == `).concat(Kl,`) {
|
||
|
|
vec2 source = aPointAPointB.xy;
|
||
|
|
vec2 target = aPointAPointB.zw;
|
||
|
|
|
||
|
|
// adjust the geometry so that the line is centered on the edge
|
||
|
|
position.y = position.y - 0.5;
|
||
|
|
|
||
|
|
// stretch the unit square into a long skinny rectangle
|
||
|
|
vec2 xBasis = target - source;
|
||
|
|
vec2 yBasis = normalize(vec2(-xBasis.y, xBasis.x));
|
||
|
|
vec2 point = source + xBasis * position.x + yBasis * aLineWidth[0] * position.y;
|
||
|
|
|
||
|
|
gl_Position = vec4(uPanZoomMatrix * vec3(point, 1.0), 1.0);
|
||
|
|
vColor = aColor;
|
||
|
|
}
|
||
|
|
else if(aVertType == `).concat(Xl,`) {
|
||
|
|
vec2 pointA = aPointAPointB.xy;
|
||
|
|
vec2 pointB = aPointAPointB.zw;
|
||
|
|
vec2 pointC = aPointCPointD.xy;
|
||
|
|
vec2 pointD = aPointCPointD.zw;
|
||
|
|
|
||
|
|
// adjust the geometry so that the line is centered on the edge
|
||
|
|
position.y = position.y - 0.5;
|
||
|
|
|
||
|
|
vec2 p0, p1, p2, pos;
|
||
|
|
if(position.x == 0.0) { // The left side of the unit square
|
||
|
|
p0 = pointA;
|
||
|
|
p1 = pointB;
|
||
|
|
p2 = pointC;
|
||
|
|
pos = position;
|
||
|
|
} else { // The right side of the unit square, use same approach but flip the geometry upside down
|
||
|
|
p0 = pointD;
|
||
|
|
p1 = pointC;
|
||
|
|
p2 = pointB;
|
||
|
|
pos = vec2(0.0, -position.y);
|
||
|
|
}
|
||
|
|
|
||
|
|
vec2 p01 = p1 - p0;
|
||
|
|
vec2 p12 = p2 - p1;
|
||
|
|
vec2 p21 = p1 - p2;
|
||
|
|
|
||
|
|
// Find the normal vector.
|
||
|
|
vec2 tangent = normalize(normalize(p12) + normalize(p01));
|
||
|
|
vec2 normal = vec2(-tangent.y, tangent.x);
|
||
|
|
|
||
|
|
// Find the vector perpendicular to p0 -> p1.
|
||
|
|
vec2 p01Norm = normalize(vec2(-p01.y, p01.x));
|
||
|
|
|
||
|
|
// Determine the bend direction.
|
||
|
|
float sigma = sign(dot(p01 + p21, normal));
|
||
|
|
float width = aLineWidth[0];
|
||
|
|
|
||
|
|
if(sign(pos.y) == -sigma) {
|
||
|
|
// This is an intersecting vertex. Adjust the position so that there's no overlap.
|
||
|
|
vec2 point = 0.5 * width * normal * -sigma / dot(normal, p01Norm);
|
||
|
|
gl_Position = vec4(uPanZoomMatrix * vec3(p1 + point, 1.0), 1.0);
|
||
|
|
} else {
|
||
|
|
// This is a non-intersecting vertex. Treat it like a mitre join.
|
||
|
|
vec2 point = 0.5 * width * normal * sigma * dot(normal, p01Norm);
|
||
|
|
gl_Position = vec4(uPanZoomMatrix * vec3(p1 + point, 1.0), 1.0);
|
||
|
|
}
|
||
|
|
|
||
|
|
vColor = aColor;
|
||
|
|
}
|
||
|
|
else if(aVertType == `).concat(Ts,` && vid < 3) {
|
||
|
|
// massage the first triangle into an edge arrow
|
||
|
|
if(vid == 0)
|
||
|
|
position = vec2(-0.15, -0.3);
|
||
|
|
if(vid == 1)
|
||
|
|
position = vec2( 0.0, 0.0);
|
||
|
|
if(vid == 2)
|
||
|
|
position = vec2( 0.15, -0.3);
|
||
|
|
|
||
|
|
gl_Position = vec4(uPanZoomMatrix * aTransform * vec3(position, 1.0), 1.0);
|
||
|
|
vColor = aColor;
|
||
|
|
}
|
||
|
|
else {
|
||
|
|
gl_Position = vec4(2.0, 0.0, 0.0, 1.0); // discard vertex by putting it outside webgl clip space
|
||
|
|
}
|
||
|
|
|
||
|
|
vAtlasId = aAtlasId;
|
||
|
|
vVertType = aVertType;
|
||
|
|
vIndex = aIndex;
|
||
|
|
}
|
||
|
|
`),i=this.batchManager.getIndexArray(),s=`#version 300 es
|
||
|
|
precision highp float;
|
||
|
|
|
||
|
|
// declare texture unit for each texture atlas in the batch
|
||
|
|
`.concat(i.map(function(u){return"uniform sampler2D uTexture".concat(u,";")}).join(`
|
||
|
|
`),`
|
||
|
|
|
||
|
|
uniform vec4 uBGColor;
|
||
|
|
uniform float uZoom;
|
||
|
|
|
||
|
|
in vec2 vTexCoord;
|
||
|
|
in vec4 vColor;
|
||
|
|
in vec2 vPosition; // model coordinates
|
||
|
|
|
||
|
|
flat in int vAtlasId;
|
||
|
|
flat in vec4 vIndex;
|
||
|
|
flat in int vVertType;
|
||
|
|
flat in vec2 vTopRight;
|
||
|
|
flat in vec2 vBotLeft;
|
||
|
|
flat in vec4 vCornerRadius;
|
||
|
|
flat in vec4 vBorderColor;
|
||
|
|
flat in vec2 vBorderWidth;
|
||
|
|
|
||
|
|
out vec4 outColor;
|
||
|
|
|
||
|
|
`).concat(om,`
|
||
|
|
`).concat(um,`
|
||
|
|
`).concat(lm,`
|
||
|
|
`).concat(vm,`
|
||
|
|
|
||
|
|
vec4 blend(vec4 top, vec4 bot) { // blend colors with premultiplied alpha
|
||
|
|
return vec4(
|
||
|
|
top.rgb + (bot.rgb * (1.0 - top.a)),
|
||
|
|
top.a + (bot.a * (1.0 - top.a))
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
vec4 distInterp(vec4 cA, vec4 cB, float d) { // interpolate color using Signed Distance
|
||
|
|
// scale to the zoom level so that borders don't look blurry when zoomed in
|
||
|
|
// note 1.5 is an aribitrary value chosen because it looks good
|
||
|
|
return mix(cA, cB, 1.0 - smoothstep(0.0, 1.5 / uZoom, abs(d)));
|
||
|
|
}
|
||
|
|
|
||
|
|
void main(void) {
|
||
|
|
if(vVertType == `).concat(Cs,`) {
|
||
|
|
// look up the texel from the texture unit
|
||
|
|
`).concat(i.map(function(u){return"if(vAtlasId == ".concat(u,") outColor = texture(uTexture").concat(u,", vTexCoord);")}).join(`
|
||
|
|
else `),`
|
||
|
|
}
|
||
|
|
else if(vVertType == `).concat(Ts,`) {
|
||
|
|
// mimics how canvas renderer uses context.globalCompositeOperation = 'destination-out';
|
||
|
|
outColor = blend(vColor, uBGColor);
|
||
|
|
outColor.a = 1.0; // make opaque, masks out line under arrow
|
||
|
|
}
|
||
|
|
else if(vVertType == `).concat(_t,` && vBorderWidth == vec2(0.0)) { // simple rectangle with no border
|
||
|
|
outColor = vColor; // unit square is already transformed to the rectangle, nothing else needs to be done
|
||
|
|
}
|
||
|
|
else if(vVertType == `).concat(_t," || vVertType == ").concat(pa,`
|
||
|
|
|| vVertType == `).concat(sn," || vVertType == ").concat(ga,`) { // use SDF
|
||
|
|
|
||
|
|
float outerBorder = vBorderWidth[0];
|
||
|
|
float innerBorder = vBorderWidth[1];
|
||
|
|
float borderPadding = outerBorder * 2.0;
|
||
|
|
float w = vTopRight.x - vBotLeft.x - borderPadding;
|
||
|
|
float h = vTopRight.y - vBotLeft.y - borderPadding;
|
||
|
|
vec2 b = vec2(w/2.0, h/2.0); // half width, half height
|
||
|
|
vec2 p = vPosition - vec2(vTopRight.x - b[0] - outerBorder, vTopRight.y - b[1] - outerBorder); // translate to center
|
||
|
|
|
||
|
|
float d; // signed distance
|
||
|
|
if(vVertType == `).concat(_t,`) {
|
||
|
|
d = rectangleSD(p, b);
|
||
|
|
} else if(vVertType == `).concat(pa,` && w == h) {
|
||
|
|
d = circleSD(p, b.x); // faster than ellipse
|
||
|
|
} else if(vVertType == `).concat(pa,`) {
|
||
|
|
d = ellipseSD(p, b);
|
||
|
|
} else {
|
||
|
|
d = roundRectangleSD(p, b, vCornerRadius.wzyx);
|
||
|
|
}
|
||
|
|
|
||
|
|
// use the distance to interpolate a color to smooth the edges of the shape, doesn't need multisampling
|
||
|
|
// we must smooth colors inwards, because we can't change pixels outside the shape's bounding box
|
||
|
|
if(d > 0.0) {
|
||
|
|
if(d > outerBorder) {
|
||
|
|
discard;
|
||
|
|
} else {
|
||
|
|
outColor = distInterp(vBorderColor, vec4(0), d - outerBorder);
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
if(d > innerBorder) {
|
||
|
|
vec4 outerColor = outerBorder == 0.0 ? vec4(0) : vBorderColor;
|
||
|
|
vec4 innerBorderColor = blend(vBorderColor, vColor);
|
||
|
|
outColor = distInterp(innerBorderColor, outerColor, d);
|
||
|
|
}
|
||
|
|
else {
|
||
|
|
vec4 outerColor;
|
||
|
|
if(innerBorder == 0.0 && outerBorder == 0.0) {
|
||
|
|
outerColor = vec4(0);
|
||
|
|
} else if(innerBorder == 0.0) {
|
||
|
|
outerColor = vBorderColor;
|
||
|
|
} else {
|
||
|
|
outerColor = blend(vBorderColor, vColor);
|
||
|
|
}
|
||
|
|
outColor = distInterp(vColor, outerColor, d - innerBorder);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
else {
|
||
|
|
outColor = vColor;
|
||
|
|
}
|
||
|
|
|
||
|
|
`).concat(t.picking?`if(outColor.a == 0.0) discard;
|
||
|
|
else outColor = vIndex;`:"",`
|
||
|
|
}
|
||
|
|
`),o=Gy(a,n,s);o.aPosition=a.getAttribLocation(o,"aPosition"),o.aIndex=a.getAttribLocation(o,"aIndex"),o.aVertType=a.getAttribLocation(o,"aVertType"),o.aTransform=a.getAttribLocation(o,"aTransform"),o.aAtlasId=a.getAttribLocation(o,"aAtlasId"),o.aTex=a.getAttribLocation(o,"aTex"),o.aPointAPointB=a.getAttribLocation(o,"aPointAPointB"),o.aPointCPointD=a.getAttribLocation(o,"aPointCPointD"),o.aLineWidth=a.getAttribLocation(o,"aLineWidth"),o.aColor=a.getAttribLocation(o,"aColor"),o.aCornerRadius=a.getAttribLocation(o,"aCornerRadius"),o.aBorderColor=a.getAttribLocation(o,"aBorderColor"),o.uPanZoomMatrix=a.getUniformLocation(o,"uPanZoomMatrix"),o.uAtlasSize=a.getUniformLocation(o,"uAtlasSize"),o.uBGColor=a.getUniformLocation(o,"uBGColor"),o.uZoom=a.getUniformLocation(o,"uZoom"),o.uTextures=[];for(var l=0;l<this.batchManager.getMaxAtlasesPerBatch();l++)o.uTextures.push(a.getUniformLocation(o,"uTexture".concat(l)));return o}},{key:"_createVAO",value:function(){var t=[0,0,1,0,1,1,0,0,1,1,0,1];this.vertexCount=t.length/2;var a=this.maxInstances,n=this.gl,i=this.program,s=n.createVertexArray();return n.bindVertexArray(s),Qy(n,"vec2",i.aPosition,t),this.transformBuffer=Jy(n,a,i.aTransform),this.indexBuffer=Fr(n,a,"vec4",i.aIndex),this.vertTypeBuffer=Fr(n,a,"int",i.aVertType),this.atlasIdBuffer=Fr(n,a,"int",i.aAtlasId),this.texBuffer=Fr(n,a,"vec4",i.aTex),this.pointAPointBBuffer=Fr(n,a,"vec4",i.aPointAPointB),this.pointCPointDBuffer=Fr(n,a,"vec4",i.aPointCPointD),this.lineWidthBuffer=Fr(n,a,"vec2",i.aLineWidth),this.colorBuffer=Fr(n,a,"vec4",i.aColor),this.cornerRadiusBuffer=Fr(n,a,"vec4",i.aCornerRadius),this.borderColorBuffer=Fr(n,a,"vec4",i.aBorderColor),n.bindVertexArray(null),s}},{key:"buffers",get:function(){var t=this;return this._buffers||(this._buffers=Object.keys(this).filter(function(a){return at(a,"Buffer")}).map(function(a){return t[a]})),this._buffers}},{key:"startFrame",value:function(t){var a=arguments.length>1&&arguments[1]!==void 0?arguments[1]:Ea.SCREEN;this.panZoomMatrix=t,this.renderTarget=a,this.batchDebugInfo=[],this.wrappedCount=0,this.simpleCount=0,this.startBatch()}},{key:"startBatch",value:function(){this.instanceCount=0,this.batchManager.startBatch()}},{key:"endFrame",value:function(){this.endBatch()}},{key:"_isVisible",value:function(t,a){return t.visible()?a&&a.isVisible?a.isVisible(t):!0:!1}},{key:"drawTexture",value:function(t,a,n){var i=this.atlasManager,s=this.batchManager,o=i.getRenderTypeOpts(n);if(this._isVisible(t,o)&&!(t.isEdge()&&!this._isValidEdge(t))){if(this.renderTarget.picking&&o.getTexPickingMode){var l=o.getTexPickingMode(t);if(l===An.IGNORE)return;if(l==An.USE_BB){this.drawPickingRectangle(t,a,n);return}}var u=i.getAtlasInfo(t,n),v=kr(u),f;try{for(v.s();!(f=v.n()).done;){var c=f.value,h=c.atlas,d=c.tex1,y=c.tex2;s.canAddToCurrentBatch(h)||this.endBatch();for(var g=s.getAtlasIndexForBatch(h),p=0,m=[[d,!0],[y,!1]];p<m.length;p++){var b=Je(m[p],2),w=b[0],E=b[1];if(w.w!=0){var C=this.instanceCount;this.vertTypeBuffer.getView(C)[0]=Cs;var x=this.indexBuffer.getView(C);qt(a,x);var T=this.atlasIdBuffer.getView(C);T[0]=g;var k=this.texBuffer.getView(C);k[0]=w.x,k[1]=w.y,k[2]=w.w,k[3]=w.h;var D=this.transformBuffer.getMatrixView(C);this.setTransformMatrix(t,D,o,c,E),this.instanceCount++,E||this.wrappedCount++,this.instanceCount>=this.maxInstances&&this.endBatch()}}}}catch(B){v.e(B)}finally{v.f()}}}},{key:"setTransformMatrix",value:function(t,a,n,i){var s=arguments.length>4&&arguments[4]!==void 0?arguments[4]:!0,o=0;if(n.shapeProps&&n.shapeProps.padding&&(o=t.pstyle(n.shapeProps.padding).pfValue),i){var l=i.bb,u=i.tex1,v=i.tex2,f=u.w/(u.w+v.w);s||(f=1-f);var c=this._getAdjustedBB(l,o,s,f);this._applyTransformMatrix(a,c,n,t)}else{var h=n.getBoundingBox(t),d=this._getAdjustedBB(h,o,!0,1);this._applyTransformMatrix(a,d,n,t)}}},{key:"_applyTransformMatrix",value:function(t,a,n,i){var s,o;$l(t);var l=n.getRotation?n.getRotation(i):0;if(l!==0){var u=n.getRotationPoint(i),v=u.x,f=u.y;yn(t,t,[v,f]),Ul(t,t,l);var c=n.getRotationOffset(i);s=c.x+(a.xOffset||0),o=c.y+(a.yOffset||0)}else s=a.x1,o=a.y1;yn
|