CoolFace
Datasetpublic

basant307/AI_Governance_Project

sourceHugging Faceapache-2.0updated 2mo agoView on Hugging Face
0likes48downloads
drawing-elements.mjs219 linesDownload Raw Back to canvas
1import * as math from '../../../math.mjs';2 3let CRp = {};4 5CRp.drawElement = function( context, ele, shiftToOriginWithBb, showLabel, showOverlay, showOpacity ){6  let r = this;7 8  if( ele.isNode() ){9    r.drawNode( context, ele, shiftToOriginWithBb, showLabel, showOverlay, showOpacity );10  } else {11    r.drawEdge( context, ele, shiftToOriginWithBb, showLabel, showOverlay, showOpacity );12  }13};14 15CRp.drawElementOverlay = function( context, ele ){16  let r = this;17 18  if( ele.isNode() ){19    r.drawNodeOverlay( context, ele );20  } else {21    r.drawEdgeOverlay( context, ele );22  }23};24 25CRp.drawElementUnderlay = function( context, ele ){26  let r = this;27 28  if( ele.isNode() ){29    r.drawNodeUnderlay( context, ele );30  } else {31    r.drawEdgeUnderlay( context, ele );32  }33};34 35CRp.drawCachedElementPortion = function( context, ele, eleTxrCache, pxRatio, lvl, reason, getRotation, getOpacity ){36  let r = this;37  let bb = eleTxrCache.getBoundingBox(ele);38 39  if( bb.w === 0 || bb.h === 0 ){ return; } // ignore zero size case40 41  let eleCache = eleTxrCache.getElement( ele, bb, pxRatio, lvl, reason );42 43  if( eleCache != null ){44    let opacity = getOpacity(r, ele);45 46    if( opacity === 0 ){ return; }47 48    let theta = getRotation(r, ele);49    let { x1, y1, w, h } = bb;50    let x, y, sx, sy, smooth;51 52    if( theta !== 0 ){53      let rotPt = eleTxrCache.getRotationPoint(ele);54 55      sx = rotPt.x;56      sy = rotPt.y;57 58      context.translate(sx, sy);59      context.rotate(theta);60 61      smooth = r.getImgSmoothing(context);62 63      if( !smooth ){ r.setImgSmoothing(context, true); }64 65      let off = eleTxrCache.getRotationOffset(ele);66 67      x = off.x;68      y = off.y;69    } else {70      x = x1;71      y = y1;72    }73 74    let oldGlobalAlpha;75 76    if( opacity !== 1 ){77      oldGlobalAlpha = context.globalAlpha;78      context.globalAlpha = oldGlobalAlpha * opacity;79    }80 81    context.drawImage( eleCache.texture.canvas, eleCache.x, 0, eleCache.width, eleCache.height, x, y, w, h );82 83    if( opacity !== 1 ){84      context.globalAlpha = oldGlobalAlpha;85    }86 87    if( theta !== 0 ){88      context.rotate(-theta);89      context.translate(-sx, -sy);90 91      if( !smooth ){ r.setImgSmoothing(context, false); }92    }93  } else {94    eleTxrCache.drawElement( context, ele ); // direct draw fallback95  }96};97 98const getZeroRotation = () => 0;99const getLabelRotation = (r, ele) => r.getTextAngle(ele, null);100const getSourceLabelRotation = (r, ele) => r.getTextAngle(ele, 'source');101const getTargetLabelRotation = (r, ele) => r.getTextAngle(ele, 'target');102const getOpacity = (r, ele) => ele.effectiveOpacity();103const getTextOpacity = (e, ele) => ele.pstyle('text-opacity').pfValue * ele.effectiveOpacity();104 105CRp.drawCachedElement = function( context, ele, pxRatio, extent, lvl, requestHighQuality ){106  let r = this;107  let { eleTxrCache, lblTxrCache, slbTxrCache, tlbTxrCache } = r.data;108 109  let bb = ele.boundingBox();110  let reason = requestHighQuality === true ? eleTxrCache.reasons.highQuality : null;111 112  if( bb.w === 0 || bb.h === 0 || !ele.visible() ){ return; }113 114  if( !extent || math.boundingBoxesIntersect( bb, extent ) ){115    let isEdge = ele.isEdge();116    let badLine = ele.element()._private.rscratch.badLine;117 118    r.drawElementUnderlay( context, ele );119 120    r.drawCachedElementPortion( context, ele, eleTxrCache, pxRatio, lvl, reason, getZeroRotation, getOpacity );121    122    if( !isEdge || !badLine ){123      r.drawCachedElementPortion( context, ele, lblTxrCache, pxRatio, lvl, reason, getLabelRotation, getTextOpacity );124    }125 126    if( isEdge && !badLine ){127      r.drawCachedElementPortion( context, ele, slbTxrCache, pxRatio, lvl, reason, getSourceLabelRotation, getTextOpacity );128      r.drawCachedElementPortion( context, ele, tlbTxrCache, pxRatio, lvl, reason, getTargetLabelRotation, getTextOpacity );129    }130 131    r.drawElementOverlay( context, ele );132  }133};134 135CRp.drawElements = function( context, eles ){136  let r = this;137 138  for( let i = 0; i < eles.length; i++ ){139    let ele = eles[ i ];140 141    r.drawElement( context, ele );142  }143};144 145CRp.drawCachedElements = function( context, eles, pxRatio, extent ){146  let r = this;147 148  for( let i = 0; i < eles.length; i++ ){149    let ele = eles[ i ];150 151    r.drawCachedElement( context, ele, pxRatio, extent );152  }153};154 155CRp.drawCachedNodes = function( context, eles, pxRatio, extent ){156  let r = this;157 158  for( let i = 0; i < eles.length; i++ ){159    let ele = eles[ i ];160 161    if( !ele.isNode() ){ continue; }162 163    r.drawCachedElement( context, ele, pxRatio, extent );164  }165};166 167CRp.drawLayeredElements = function( context, eles, pxRatio, extent ){168  let r = this;169 170  let layers = r.data.lyrTxrCache.getLayers( eles, pxRatio );171 172  if( layers ){173    for( let i = 0; i < layers.length; i++ ){174      let layer = layers[i];175      let bb = layer.bb;176 177      if( bb.w === 0 || bb.h === 0 ){ continue; }178 179      context.drawImage( layer.canvas, bb.x1, bb.y1, bb.w, bb.h );180    }181  } else { // fall back on plain caching if no layers182    r.drawCachedElements( context, eles, pxRatio, extent );183  }184};185 186if( process.env.NODE_ENV !== 'production' ){187  CRp.drawDebugPoints = function( context, eles ){188    let draw = function( x, y, color ){189      context.fillStyle = color;190      context.fillRect( x - 1, y - 1, 3, 3 );191    };192 193    for( let i = 0; i < eles.length; i++ ){194      let ele = eles[i];195      let rs = ele._private.rscratch;196 197      if( ele.isNode() ){198        let p = ele.position();199 200        draw( rs.labelX, rs.labelY, 'red' );201        draw( p.x, p.y, 'magenta' );202      } else {203        let pts = rs.allpts;204 205        for( let j = 0; j + 1 < pts.length; j += 2 ){206          let x = pts[ j ];207          let y = pts[ j + 1 ];208 209          draw( x, y, 'cyan' );210        }211 212        draw( rs.midX, rs.midY, 'yellow' );213      }214    }215  };216}217 218export default CRp;219 
basant307/AI_Governance_Project · CoolFace