From 72325a1aacf42ec755f642557c4ac4e2695ddece Mon Sep 17 00:00:00 2001 From: Garrett K Date: Sun, 24 Jan 2021 07:13:59 +0000 Subject: [PATCH] 0.3.12 --- assets/pages/jquery.drawConnections.js | 574 ++++++++++++------------- assets/pages/jquery.explore.js | 13 +- 2 files changed, 283 insertions(+), 304 deletions(-) diff --git a/assets/pages/jquery.drawConnections.js b/assets/pages/jquery.drawConnections.js index ee61816..2c58d1c 100755 --- a/assets/pages/jquery.drawConnections.js +++ b/assets/pages/jquery.drawConnections.js @@ -1,251 +1,286 @@ // ### Cabinet Functions ### -function crawlCabinetConnections(selectedPort){ - var portArray = []; - var connectionArray = []; - var trunkArray = []; - var partitionArray = []; - var selectedPeerID = $(selectedPort).data('peerGlobalId'); - var selectedPortOrig = selectedPort; - - for(x=0; x<2; x++) { - - if(x == 1) { - - // Crawl trunk peer - var selectedPartition = $(selectedPortOrig).closest('.partition'); - var selectedPartitionPeerID = $(selectedPartition).data('peerGlobalId'); - - if($('#'+selectedPartitionPeerID).length) { - var selectedPartitionPeer = $('#'+selectedPartitionPeerID); - trunkArray.push([selectedPartition, selectedPartitionPeer]); - partitionArray.push(selectedPartition, selectedPartitionPeer); - - var selectedPartitionPeerIDArray = selectedPartitionPeerID.split('-'); - var peerID = selectedPartitionPeerIDArray[2]; - var peerFace = selectedPartitionPeerIDArray[3]; - var peerDepth = selectedPartitionPeerIDArray[4]; - var peerPort = $(selectedPortOrig).data('portIndex'); - - var selectedPort = $('#port-4-'+peerID+'-'+peerFace+'-'+peerDepth+'-'+peerPort); - } else { - if(selectedPartitionPeerID != 'none') { - trunkArray.push([selectedPartition, selectedPartitionPeerID]); - } - var selectedPort = false; - } - } - - while($(selectedPort).length) { - portArray.push(selectedPort); - - // Crawl connection peer - var connectedPortIDString = $(selectedPort).data('connectedGlobalId'); - var connectedPortIDArray = JSON.parse(atob(connectedPortIDString)); - - if(connectedPortIDArray.length) { - var peerPortFound = false; - $.each(connectedPortIDArray, function(index, connectedPortID){ - var connectedPort = $('#'+connectedPortID); - if($(connectedPort).length) { - - portArray.push(connectedPort) - connectionArray.push([selectedPort, connectedPort]); - - var connectedPartition = $(connectedPort).closest('.partition'); - var connectedPartitionPeerID = $(connectedPartition).data('peerGlobalId'); - - if($('#'+connectedPartitionPeerID).length) { - - var connectedPartitionPeer = $('#'+connectedPartitionPeerID); - trunkArray.push([connectedPartition, connectedPartitionPeer]); - partitionArray.push(connectedPartition, connectedPartitionPeer); - - var connectedPartitionPeerIDArray = connectedPartitionPeerID.split('-'); - var peerID = connectedPartitionPeerIDArray[2]; - var peerFace = connectedPartitionPeerIDArray[3]; - var peerDepth = connectedPartitionPeerIDArray[4]; - - var connectedPortIDArray = connectedPortID.split('-'); - var peerPort = connectedPortIDArray[5]; - selectedPort = $('#port-4-'+peerID+'-'+peerFace+'-'+peerDepth+'-'+peerPort); - peerPortFound = true; - } else { - if(connectedPartitionPeerID != 'none') { - trunkArray.push([connectedPartition, connectedPartitionPeerID]); - } - } - - } else { - connectionArray.push([selectedPort, connectedPortID]); - } - }); - if(peerPortFound == false) { - selectedPort = false; - } - } else { - selectedPort = false; - } - } - } - - return { - 'partitionArray': partitionArray, - 'trunkArray': trunkArray, - 'portArray': portArray, - 'connectionArray': connectionArray - }; +function drawCabinet(){ + console.log('drawCabinet'); + resizeCanvas(); + clearCabinetConnections(); + crawlCabinet(); + drawCabinetConnections(); + drawCabinetTrunks(); } -function drawCabinetConnections(elementArray){ +function crawlCabinet(){ + console.log('crawlCabinet'); + var pathSourceArray = { + 'selected': $(document).data('selectedPort'), + 'hovered': $(document).data('hoveredPort') + }; + + var sourceTypeMap = { + 'selected': ['cabinetSelectedConnections', 'cabinetSelectedTrunks'], + 'hovered': ['cabinetHoveredConnections', 'cabinetHoveredTrunks'] + } + + $.each(pathSourceArray, function(pathSourceType, pathSource){ + var connectionArray = []; + var trunkArray = []; + + if(pathSource !== undefined && pathSource !== false) { + var selectedPort = $(pathSource); + + for(x=0; x<2; x++) { + if(x == 1) { + // Crawl trunk peer + var selectedPartition = $(pathSource).closest('.partition'); + var selectedPartitionPeerID = $(selectedPartition).data('peerGlobalId'); + + if($('#'+selectedPartitionPeerID).length) { + var selectedPartitionPeer = $('#'+selectedPartitionPeerID); + trunkArray.push([selectedPartition, selectedPartitionPeer]); + //partitionArray.push(selectedPartition, selectedPartitionPeer); + + var selectedPartitionPeerIDArray = selectedPartitionPeerID.split('-'); + var peerID = selectedPartitionPeerIDArray[2]; + var peerFace = selectedPartitionPeerIDArray[3]; + var peerDepth = selectedPartitionPeerIDArray[4]; + var peerPort = $(pathSource).data('portIndex'); + + var selectedPort = $('#port-4-'+peerID+'-'+peerFace+'-'+peerDepth+'-'+peerPort); + } else { + if(selectedPartitionPeerID != 'none') { + trunkArray.push([selectedPartition, selectedPartitionPeerID]); + } + var selectedPort = false; + } + } + + while($(selectedPort).length) { + + // Crawl connection peer + var connectedPortIDString = $(selectedPort).data('connectedGlobalId'); + var connectedPortIDArray = JSON.parse(atob(connectedPortIDString)); + + if(connectedPortIDArray.length) { + var peerPortFound = false; + $.each(connectedPortIDArray, function(index, connectedPortID){ + var connectedPort = $('#'+connectedPortID); + if($(connectedPort).length) { + + connectionArray.push([selectedPort, connectedPort]); + + var connectedPartition = $(connectedPort).closest('.partition'); + var connectedPartitionPeerID = $(connectedPartition).data('peerGlobalId'); + + if($('#'+connectedPartitionPeerID).length) { + + var connectedPartitionPeer = $('#'+connectedPartitionPeerID); + trunkArray.push([connectedPartition, connectedPartitionPeer]); + //partitionArray.push(connectedPartition, connectedPartitionPeer); + + var connectedPartitionPeerIDArray = connectedPartitionPeerID.split('-'); + var peerID = connectedPartitionPeerIDArray[2]; + var peerFace = connectedPartitionPeerIDArray[3]; + var peerDepth = connectedPartitionPeerIDArray[4]; + + var connectedPortIDArray = connectedPortID.split('-'); + var peerPort = connectedPortIDArray[5]; + selectedPort = $('#port-4-'+peerID+'-'+peerFace+'-'+peerDepth+'-'+peerPort); + peerPortFound = true; + } else { + if(connectedPartitionPeerID != 'none') { + trunkArray.push([connectedPartition, connectedPartitionPeerID]); + } + } + + } else { + connectionArray.push([selectedPort, connectedPortID]); + } + }); + if(peerPortFound == false) { + selectedPort = false; + } + } else { + selectedPort = false; + } + } + } + } + + $(document).data(sourceTypeMap[pathSourceType][0], connectionArray); + $(document).data(sourceTypeMap[pathSourceType][1], trunkArray); + }); +} + +function drawCabinetConnections(){ + console.log('drawCabinetConnections'); + pathDataTypeArray = [ + 'cabinetSelectedConnections', + 'cabinetHoveredConnections' + ]; + cabinetCtx.strokeStyle = 'LightSkyBlue'; cabinetCtx.lineWidth = 3; cabinetCtx.beginPath(); - //console.log('Debug (elementArray): '+JSON.stringify(elementArray)); - $.each(elementArray, function(index, element){ - var elemA = element[0]; - var elemB = element[1]; + $.each(pathDataTypeArray, function(pathDataTypeIndex, pathDataType){ - var connectionStyle = $('#connectionStyle').val(); + var pathData = $(document).data(pathDataType); - var elemACabinet = $(elemA).closest('.cabinetContainer'); - var elemACabinetID = $(elemACabinet).data('cabinetId'); - var elemACabinetDimensions = getDimensions(elemACabinet); - var elemADimensions = getDimensions(elemA); - var elemAPartition = $(elemA).closest('.partition'); - var elemAPartitionDimensions = getDimensions(elemAPartition); - - cabinetCtx.moveTo(elemADimensions.centerX, elemADimensions.centerY); - - if(typeof elemB == 'object') { - var elemBCabinet = $(elemB).closest('.cabinetContainer'); - var elemBCabinetID = $(elemBCabinet).data('cabinetId'); - var elemBCabinetDimensions = getDimensions(elemBCabinet); - var elemBDimensions = getDimensions(elemB); - var elemBPartition = $(elemB).closest('.partition'); - var elemBPartitionDimensions = getDimensions(elemBPartition); - - if(elemBDimensions.top >= elemADimensions.top) { - var elemAPartHBoundary = elemAPartitionDimensions.bottom; - var elemBPartHBoundary = elemBPartitionDimensions.top; - } else { - var elemAPartHBoundary = elemAPartitionDimensions.top; - var elemBPartHBoundary = elemBPartitionDimensions.bottom; - } + $.each(pathData, function(index, element){ + var elemA = element[0]; + var elemB = element[1]; - if(connectionStyle == 0) { - cabinetCtx.lineTo(elemADimensions.centerX, elemAPartHBoundary); - cabinetCtx.lineTo(elemACabinetDimensions.left - canvasInset, elemAPartHBoundary); - - if(elemACabinetID != elemBCabinetID) { - - // Ports are in different cabinets - if(elemACabinetDimensions.top >= elemBCabinetDimensions.top) { - - // Connection should be routed up - var elemACabinetHBoundary = elemACabinetDimensions.top - canvasInset; - } else { - - // Connection should be routed down - var elemACabinetHBoundary = elemACabinetDimensions.bottom + canvasInset; - } - - cabinetCtx.lineTo(elemACabinetDimensions.left - canvasInset, elemACabinetHBoundary); - cabinetCtx.lineTo(elemBCabinetDimensions.left - canvasInset, elemACabinetHBoundary); + var connectionStyle = $('#connectionStyle').val(); + + var elemACabinet = $(elemA).closest('.cabinetContainer'); + var elemACabinetID = $(elemACabinet).data('cabinetId'); + var elemACabinetDimensions = getDimensions(elemACabinet); + var elemADimensions = getDimensions(elemA); + var elemAPartition = $(elemA).closest('.partition'); + var elemAPartitionDimensions = getDimensions(elemAPartition); + + cabinetCtx.moveTo(elemADimensions.centerX, elemADimensions.centerY); + + if(typeof elemB == 'object') { + var elemBCabinet = $(elemB).closest('.cabinetContainer'); + var elemBCabinetID = $(elemBCabinet).data('cabinetId'); + var elemBCabinetDimensions = getDimensions(elemBCabinet); + var elemBDimensions = getDimensions(elemB); + var elemBPartition = $(elemB).closest('.partition'); + var elemBPartitionDimensions = getDimensions(elemBPartition); + if(elemBDimensions.top >= elemADimensions.top) { + var elemAPartHBoundary = elemAPartitionDimensions.bottom; + var elemBPartHBoundary = elemBPartitionDimensions.top; + } else { + var elemAPartHBoundary = elemAPartitionDimensions.top; + var elemBPartHBoundary = elemBPartitionDimensions.bottom; + } + + if(connectionStyle == 0) { + cabinetCtx.lineTo(elemADimensions.centerX, elemAPartHBoundary); + cabinetCtx.lineTo(elemACabinetDimensions.left - canvasInset, elemAPartHBoundary); + + if(elemACabinetID != elemBCabinetID) { + + // Ports are in different cabinets + if(elemACabinetDimensions.top >= elemBCabinetDimensions.top) { + + // Connection should be routed up + var elemACabinetHBoundary = elemACabinetDimensions.top - canvasInset; + } else { + + // Connection should be routed down + var elemACabinetHBoundary = elemACabinetDimensions.bottom + canvasInset; + } + + cabinetCtx.lineTo(elemACabinetDimensions.left - canvasInset, elemACabinetHBoundary); + cabinetCtx.lineTo(elemBCabinetDimensions.left - canvasInset, elemACabinetHBoundary); + + } + cabinetCtx.lineTo(elemBCabinetDimensions.left - canvasInset, elemBPartHBoundary); + cabinetCtx.lineTo(elemBDimensions.centerX, elemBPartHBoundary); + cabinetCtx.lineTo(elemBDimensions.centerX, elemBDimensions.centerY); + } else if(connectionStyle == 1) { + cabinetCtx.lineTo(elemBDimensions.centerX, elemBDimensions.centerY); + } else if(connectionStyle == 2) { + var arcSize = 30; + cabinetCtx.bezierCurveTo((elemADimensions.centerX - arcSize), elemADimensions.centerY, (elemBDimensions.centerX - arcSize), elemBDimensions.centerY, elemBDimensions.centerX, elemBDimensions.centerY); + } else { + cabinetCtx.lineTo(elemBDimensions.centerX, elemBDimensions.centerY); } - cabinetCtx.lineTo(elemBCabinetDimensions.left - canvasInset, elemBPartHBoundary); - cabinetCtx.lineTo(elemBDimensions.centerX, elemBPartHBoundary); - cabinetCtx.lineTo(elemBDimensions.centerX, elemBDimensions.centerY); - } else if(connectionStyle == 1) { - cabinetCtx.lineTo(elemBDimensions.centerX, elemBDimensions.centerY); - } else if(connectionStyle == 2) { - var arcSize = 30; - cabinetCtx.bezierCurveTo((elemADimensions.centerX - arcSize), elemADimensions.centerY, (elemBDimensions.centerX - arcSize), elemBDimensions.centerY, elemBDimensions.centerX, elemBDimensions.centerY); } else { - cabinetCtx.lineTo(elemBDimensions.centerX, elemBDimensions.centerY); + cabinetCtx.lineTo(elemADimensions.centerX, elemAPartitionDimensions.top); + cabinetCtx.lineTo(elemACabinetDimensions.left - canvasInset, elemAPartitionDimensions.top); + cabinetCtx.lineTo(elemACabinetDimensions.left - canvasInset, elemACabinetDimensions.top - canvasInset); + + var left = elemACabinetDimensions.leftOrig - canvasInset; + var top = elemACabinetDimensions.topOrig - canvasInset; + addCabButton(left, top, elemB); } - } else { - cabinetCtx.lineTo(elemADimensions.centerX, elemAPartitionDimensions.top); - cabinetCtx.lineTo(elemACabinetDimensions.left - canvasInset, elemAPartitionDimensions.top); - cabinetCtx.lineTo(elemACabinetDimensions.left - canvasInset, elemACabinetDimensions.top - canvasInset); - var left = elemACabinetDimensions.leftOrig - canvasInset; - var top = elemACabinetDimensions.topOrig - canvasInset; - addCabButton(left, top, elemB); - } - + }); }); cabinetCtx.stroke(); } -function drawCabinetTrunks(elementArray){ +function drawCabinetTrunks(){ + console.log('drawCabinetTrunks'); + pathDataTypeArray = [ + 'cabinetSelectedTrunks', + 'cabinetHoveredTrunks' + ]; + cabinetCtx.strokeStyle = 'MidnightBlue'; cabinetCtx.lineWidth = 3; cabinetCtx.beginPath(); - $.each(elementArray, function(index, element){ + $.each(pathDataTypeArray, function(pathDataTypeIndex, pathDataType){ - var vertical = canvasInset + (5*index); + var pathData = $(document).data(pathDataType); - var elemA = element[0]; - var elemB = element[1]; - - var canvasDimensions = getDimensions($('#canvasCabinet')); - var elemACabinet = $(elemA).closest('.cabinetContainer'); - var elemACabinetID = $(elemACabinet).data('cabinetId'); - var elemACabinetDimensions = getDimensions($(elemA).closest('.cabinetContainer')); - var elemADimensions = getDimensions(elemA); - - cabinetCtx.moveTo(elemADimensions.right, elemADimensions.centerY); - - if(typeof elemB == 'object') { + $.each(pathData, function(index, element){ - var elemBCabinet = $(elemB).closest('.cabinetContainer'); - var elemBCabinetID = $(elemBCabinet).data('cabinetId'); - var elemBCabinetDimensions = getDimensions($(elemB).closest('.cabinetContainer')); - var elemBDimensions = getDimensions(elemB); + var vertical = canvasInset + (5*index); - cabinetCtx.lineTo(elemACabinetDimensions.right + vertical, elemADimensions.centerY); + var elemA = element[0]; + var elemB = element[1]; + + var canvasDimensions = getDimensions($('#canvasCabinet')); + var elemACabinet = $(elemA).closest('.cabinetContainer'); + var elemACabinetID = $(elemACabinet).data('cabinetId'); + var elemACabinetDimensions = getDimensions($(elemA).closest('.cabinetContainer')); + var elemADimensions = getDimensions(elemA); - if(elemACabinetID != elemBCabinetID) { - if(elemACabinetDimensions.top <= elemBCabinetDimensions.top) { - elemBCabinetHBoundary = elemBCabinetDimensions.top - vertical; - } else { - elemBCabinetHBoundary = elemBCabinetDimensions.bottom + vertical; + cabinetCtx.moveTo(elemADimensions.right, elemADimensions.centerY); + + if(typeof elemB == 'object') { + + var elemBCabinet = $(elemB).closest('.cabinetContainer'); + var elemBCabinetID = $(elemBCabinet).data('cabinetId'); + var elemBCabinetDimensions = getDimensions($(elemB).closest('.cabinetContainer')); + var elemBDimensions = getDimensions(elemB); + + cabinetCtx.lineTo(elemACabinetDimensions.right + vertical, elemADimensions.centerY); + + if(elemACabinetID != elemBCabinetID) { + if(elemACabinetDimensions.top <= elemBCabinetDimensions.top) { + elemBCabinetHBoundary = elemBCabinetDimensions.top - vertical; + } else { + elemBCabinetHBoundary = elemBCabinetDimensions.bottom + vertical; + } + cabinetCtx.lineTo(elemACabinetDimensions.right + vertical, elemBCabinetHBoundary); + cabinetCtx.lineTo(elemBCabinetDimensions.right + vertical, elemBCabinetHBoundary); } - cabinetCtx.lineTo(elemACabinetDimensions.right + vertical, elemBCabinetHBoundary); - cabinetCtx.lineTo(elemBCabinetDimensions.right + vertical, elemBCabinetHBoundary); - } - cabinetCtx.lineTo(elemBCabinetDimensions.right + vertical, elemBDimensions.centerY); - cabinetCtx.lineTo(elemBDimensions.right, elemBDimensions.centerY); + cabinetCtx.lineTo(elemBCabinetDimensions.right + vertical, elemBDimensions.centerY); + cabinetCtx.lineTo(elemBDimensions.right, elemBDimensions.centerY); - } else { - cabinetCtx.lineTo(elemACabinetDimensions.right + vertical, elemADimensions.centerY); - cabinetCtx.lineTo(elemACabinetDimensions.right + vertical, elemACabinetDimensions.top - vertical); - cabinetCtx.strokeRect(elemADimensions.left, elemADimensions.top, elemADimensions.width, elemADimensions.height); + } else { + cabinetCtx.lineTo(elemACabinetDimensions.right + vertical, elemADimensions.centerY); + cabinetCtx.lineTo(elemACabinetDimensions.right + vertical, elemACabinetDimensions.top - vertical); + cabinetCtx.strokeRect(elemADimensions.left, elemADimensions.top, elemADimensions.width, elemADimensions.height); + + var left = elemACabinetDimensions.rightOrig + vertical; + var top = elemACabinetDimensions.topOrig - vertical; + addCabButton(left, top, elemB); + } - var left = elemACabinetDimensions.rightOrig + vertical; - var top = elemACabinetDimensions.topOrig - vertical; - addCabButton(left, top, elemB); - } - + }); }); cabinetCtx.stroke(); } function clearCabinetConnections(){ + console.log('clearCabinetConnections'); var canvasHeight = $('#canvasCabinet').height(); var canvasWidth = $('#canvasCabinet').width(); cabinetCtx.clearRect(0, 0, canvasWidth, canvasHeight); $('a.addCabButton').remove(); - drawPathConnections(); - drawPathTrunks(); } // ### Path Functions ### function drawPath(){ + console.log('drawPath'); resizeCanvas(); clearPathConnections(); crawlPathConnections(); @@ -255,13 +290,13 @@ function drawPath(){ } function crawlPathConnections(){ + console.log('crawlPathConnections'); var pathConnections = {}; var connectorElementArray = $('#containerFullPath').find('.port'); $.each(connectorElementArray, function(index, element){ if($(element).data('connectionPairId') !== undefined) { var connectionPairID = $(element).data('connectionPairId'); if(pathConnections[connectionPairID] === undefined) { - console.log('here3'); pathConnections[connectionPairID] = []; } pathConnections[connectionPairID].push($(element)); @@ -271,6 +306,7 @@ function crawlPathConnections(){ } function crawlPathTrunks(){ + console.log('crawlPathTrunks'); var pathTrunks = {}; var connectorElementArray = $('#containerFullPath').find('.objectBox'); @@ -290,6 +326,7 @@ function crawlPathTrunks(){ } function drawPathConnections(){ + console.log('drawPathConnections'); var pathConnections = $(document).data('pathConnections'); pathCtx.strokeStyle = 'LightSkyBlue'; pathCtx.lineWidth = 3; @@ -311,6 +348,7 @@ function drawPathConnections(){ } function drawPathTrunks(){ + console.log('drawPathTrunks'); var pathTrunks = $(document).data('pathTrunks'); pathCtx.strokeStyle = 'MidnightBlue'; pathCtx.lineWidth = 3; @@ -354,6 +392,7 @@ function drawPathTrunks(){ } function clearPathConnections(){ + console.log('clearPathConnections'); var canvasHeight = $('#canvasPath').height(); var canvasWidth = $('#canvasPath').width(); pathCtx.clearRect(0, 0, canvasWidth, canvasHeight); @@ -422,103 +461,50 @@ function highlightElement(elemArray, color){ } function makePortsHoverable(){ + console.log('makePortsHoverable'); - resizeCanvas(); - redraw(); + //resizeCanvas(); + //redraw(); $('#buildSpaceContent').find('.port').each(function(){ $(this).unbind('mouseenter mouseleave click.drawConnections'); }); $('#buildSpaceContent').find('.port').each(function(){ $(this).hover(function(){ - - var pathElementArray = crawlCabinetConnections(this); - - highlightElement(pathElementArray['partitionArray'], 'black'); - drawCabinetTrunks(pathElementArray['trunkArray']); - highlightElement(pathElementArray['portArray'], 'LightSkyBlue'); - drawCabinetConnections(pathElementArray['connectionArray']); - + $(document).data('hoveredPort', this); + drawCabinet(); }, function(){ - redraw(); + $(document).data('hoveredPort', false); + drawCabinet(); }); $(this).on('click.drawConnections', function(){ - if(typeof $(this).data('pathID') == 'undefined') { + + if($(document).data('selectedPort') !== undefined && $(document).data('selectedPort') !== false) { + // Gather previously and currently selected port IDs for comparison + var selectedPort = $(document).data('selectedPort'); + var selectedPortID = $(selectedPort).attr('id'); + var thisPortID = $(this).attr('id'); - var pathElementArray = crawlCabinetConnections(this); - - // Get pathID - // This allows persistant paths to accumulate - //pathID++; - // This allows only 1 persistant path at a time - pathID = 0; - if(typeof $(document).data('cabinetConnections')[pathID] != 'undefined') { - $.each($(document).data('cabinetConnections')[pathID]['portArray'], function(){ - $(this).removeData('pathID'); - }); + // Compare previously and currently selected port IDs + if(selectedPortID === thisPortID) { + // Unselect port + $(document).data('selectedPort', false); + } else { + // Select port + $(document).data('selectedPort', this); } - - // Associate ports to pathIDs - $.each(pathElementArray['portArray'], function(){ - $(this).data('pathID', pathID); - }); - - // Store connection path - var workingPathData = { - 'portArray': pathElementArray['portArray'], - 'connectionArray': pathElementArray['connectionArray'], - 'trunkArray': pathElementArray['trunkArray'], - 'partitionArray': pathElementArray['partitionArray'] - }; - $(document).data('cabinetConnections')[pathID] = workingPathData; - } else { - - // Clear pathIDs from ports - var thisPathID = $(this).data('pathID'); - $.each($(document).data('cabinetConnections')[thisPathID]['portArray'], function(){ - $(this).removeData('pathID'); - }); - - // Clear connection path - delete $(document).data('cabinetConnections')[thisPathID]; + $(document).data('selectedPort', this); } + + drawCabinet(); }); }); } -function refreshPathData(){ - var cabinetConnections = $(document).data('cabinetConnections'); - pathDataOrig = pathData; - $.each(pathDataOrig, function(pathID, path){ - $.each(path['portArray'], function(portIndex, port){ - var portID = $(port).attr('id'); - if($('#'+portID).length) { - var pathElementArray = crawlCabinetConnections($('#'+portID)); - - // Associate ports to pathIDs - $.each(pathElementArray['portArray'], function(){ - $(this).data('pathID', pathID); - }); - - // Store connection path - var workingCabinetConnections = { - 'portArray': pathElementArray['portArray'], - 'connectionArray': pathElementArray['connectionArray'], - 'trunkArray': pathElementArray['trunkArray'], - 'partitionArray': pathElementArray['partitionArray'] - }; - $(document).data('cabinetConnections', workingCabinetConnections); - - return false; - } - }); - }); -} - function makeCabArrowsClickable(){ $('.cabMoveArrow').unbind('click'); @@ -530,7 +516,8 @@ function makeCabArrowsClickable(){ } else { $(cabinet).insertAfter($(cabinet).next()); } - redraw(); + drawCabinet(); + //redraw(); }); } @@ -551,10 +538,11 @@ function makeCabCloseClickable(){ } }); - // Refresh all paths - refreshPathData(); + drawCabinet(); - redraw(); + // Refresh all paths + //refreshPathData(); + //redraw(); }); } @@ -566,19 +554,6 @@ function resizeCanvas() { $('#canvasPath').attr('height', $('#canvasPath').parent().height()); } -function redraw() { - clearCabinetConnections(); - var cabinetConnections = $(document).data('cabinetConnections'); - if(typeof cabinetConnections != 'undefined') { - $.each(cabinetConnections, function(pathID, path){ - drawCabinetTrunks(path['trunkArray']); - highlightElement(path['partitionArray'], 'MidnightBlue'); - drawCabinetConnections(path['connectionArray']); - highlightElement(path['portArray'], 'LightSkyBlue'); - }); - } -} - function initializeCanvas() { window.addEventListener('resize', resizeCanvas, false); @@ -589,7 +564,10 @@ function initializeCanvas() { // Cabinet connections cabinetCtx = canvasCabinet.getContext('2d'); cabinetCtx.lineWidth = lineWidth; - $(document).data('cabinetConnections', {}); + $(document).data('cabinetSelectedConnections', []); + $(document).data('cabinetHoveredConnections', []); + $(document).data('cabinetSelectedTrunks', []); + $(document).data('cabinetHoveredTrunks', []); canvasInset = 10; pathID = 0; diff --git a/assets/pages/jquery.explore.js b/assets/pages/jquery.explore.js index 9ed1dbe..64348d6 100755 --- a/assets/pages/jquery.explore.js +++ b/assets/pages/jquery.explore.js @@ -689,8 +689,9 @@ function postProcessCable(){ $('#checkboxPopulated').prop("disabled", true); retrievePortPath(objID, objFace, objDepth, objPort); retrievePortOptions(objID, objFace, objDepth, objPort); - refreshPathData(); - redraw(); + drawCabinet(); + //refreshPathData(); + //redraw(); $('#objTree').jstree('deselect_all'); $('#objectTreeModal').modal('hide'); @@ -714,8 +715,7 @@ $( document ).ready(function() { event.preventDefault(); $('#containerFullPath').parent().printThis({ canvas: true, - importStyle: true, - removeInline: true + importStyle: true }); }); @@ -1015,8 +1015,9 @@ $( document ).ready(function() { $('#checkboxPopulated').prop("disabled", false); retrievePortPath(objID, objFace, objDepth, objPort); retrievePortOptions(objID, objFace, objDepth, objPort); - refreshPathData(); - redraw(); + drawCabinet(); + //refreshPathData(); + //redraw(); $('#objTree').jstree('deselect_all'); $('#objectTreeModal').modal('hide');