diff options
Diffstat (limited to 'main.js')
| -rw-r--r-- | main.js | 41 |
1 files changed, 29 insertions, 12 deletions
@@ -160,6 +160,13 @@ return destination; } + var setOpacity = function(color, opacity) { + if (color.substring(0, 5) == 'rgba(') { + color = color.replace(/,[^,]*\)$/, ',' + opacity + ')'); + } + return color; + } + var drawEdge = function(edge, pt1, pt2) { // edge: {source:Node, target:Node, length:#, data:{}} // pt1: {x:#, y:#} source position in screen coords @@ -182,13 +189,6 @@ } } - var setOpacity = function(color, opacity) { - if (color.substring(0, 5) == 'rgba(') { - color = color.replace(/,[^,]*\)$/, ',' + opacity + ')'); - } - return color; - } - if (mainNode && balloonNode) { if (edge.source.data.balloon || edge.target.data.balloon || (balloonNode != mainNode @@ -205,7 +205,7 @@ } }; - var drawImage = function(image, coords, color) { + var drawImage = function(image, coords, color, strokeColor) { if (!image.height) { image.height = image.width ? image.width * image.naturalHeight / image.naturalWidth : image.naturalHeight; } @@ -227,7 +227,7 @@ ctx.fill(); ctx.restore(); ctx.lineWidth = 3; - ctx.strokeStyle = 'rgba(255,255,255,0.7)'; + ctx.strokeStyle = strokeColor; ctx.beginPath(); ctx.arc(coords.x, coords.y, image.width / 2, 0, Math.PI * 2); ctx.stroke(); @@ -269,15 +269,32 @@ } if (node.data.image && node.data.width > 10) { + var isHighlighted = function(node) { + if (node.data.balloon) { + return true; + } + if (balloonNode && mainNode) { + if (node == mainNode) { + return true; + } + var targets = particleSystem.getEdgesFrom(node); + for (var t = 0; t < targets.length; t++) { + if (targets[t].target == balloonNode) { + return true; + } + } + } + } + var strokeColor = isHighlighted(node) ? setOpacity(node.data.color, 0.7) : 'rgba(255, 255, 255, 0.7)'; if (node.data.imageObject) { node.data.imageObject.width = node.data.width; node.data.imageObject.height = node.data.height; - drawImage(node.data.imageObject, pt, node.data.color); + drawImage(node.data.imageObject, pt, node.data.color, strokeColor); } else { var img = new Image(node.data.width, node.data.height); img.onload = function() { node.data.imageObject = img; - drawImage(node.data.imageObject, pt, node.data.color); + drawImage(node.data.imageObject, pt, node.data.color, strokeColor); }; img.src = '_img/' + node.data.image; } @@ -307,7 +324,7 @@ particleSystem.eachEdge(drawEdge); particleSystem.eachNode(drawNode); if (balloonNode) { - var selectedDimension = Math.max((balloonNode.data.image) ? 150 : 50, balloonNode.data.width); + var selectedDimension = Math.max((balloonNode.data.image) ? 100 : 50, balloonNode.data.width); balloonNode.data.oldWidth = balloonNode.data.width; balloonNode.data.width = selectedDimension; balloonNode.data.oldHeight = balloonNode.data.height; |