// ### Cabinet Functions ###
function drawCabinet(){
	resizeCabinetCanvas();
	clearCabinetConnections();
	crawlCabinet();
	drawCabinetTrunks();
	drawCabinetConnections();
}

function crawlCabinet(){
	
	var pathSourceArray = {
		'selected': $(document).data('selectedPort'),
		'hovered': $(document).data('hoveredPort')
	};
	
	var sourceTypeMap = {
		'selected': ['cabinetSelectedConnections', 'cabinetSelectedTrunks'],
		'hovered': ['cabinetHoveredConnections', 'cabinetHoveredTrunks']
	}
	
	$.each(pathSourceArray, function(pathSourceType, pathSource){
		
		if(pathSource !== undefined && pathSource !== false) {
			var testConnectionArray = crawlCabinetConnections($(pathSource));
			var testTrunkArray = crawlCabinetTrunks($(pathSource));
		} else {
			var testConnectionArray = [];
			var testTrunkArray = [];
		}
		
		$(document).data(sourceTypeMap[pathSourceType][0], testConnectionArray);
		$(document).data(sourceTypeMap[pathSourceType][1], testTrunkArray);
	});
}

function crawlCabinetConnections(localPort, connectionArray = [], visitedPortArray = []){
	
	var localPortID = $(localPort).attr('id');
	
	// Prevent loops
	if(!visitedPortArray.includes(localPortID)) {
		
		connectionArray.push([localPort]);
	
		visitedPortArray.push(localPortID);
	
		// Gather local peer ports
		var localRemotePortString = $(localPort).data('connectedGlobalId');
		var localRemotePortArray = JSON.parse(atob(localRemotePortString));
		
		// Loop over each local peer port
		$.each(localRemotePortArray, function(localRemotePortIndex, localRemotePort){
			
			// Does peer port exist?
			var remotePort = $('#'+localRemotePort);
			if($(remotePort).length) {
				
				// Add connection peers to connectionArray
				connectionArray.push([localPort, remotePort]);
				
				// Gather remote peer ports
				var remoteRemotePortString = $(remotePort).data('connectedGlobalId');
				var remoteRemoteConnectedArray = JSON.parse(atob(remoteRemotePortString));
				
				// Loop over each remote peer port
				$.each(remoteRemoteConnectedArray, function(remoteRemotePortIndex, remoteRemotePort){
					crawlCabinetConnections($('#'+remoteRemotePort), connectionArray, visitedPortArray);
				});
				
				// Store remote partition trunk peer ID
				var remotePartition = $(remotePort).closest('.partition');
				var remotePartitionTrunkPeerID = $(remotePartition).data('peerGlobalId');
				
				// Does remote partition trunk peer exist?
				if($('#'+remotePartitionTrunkPeerID).length) {
					
					// Extract remote partition trunk peer ID, Face, & Depth
					var remotePartitionTrunkPeerIDArray = remotePartitionTrunkPeerID.split('-');
					var peerID = remotePartitionTrunkPeerIDArray[2];
					var peerFace = remotePartitionTrunkPeerIDArray[3];
					var peerDepth = remotePartitionTrunkPeerIDArray[4];
					
					// Extract localRemote
					var localRemotePortIDArray = localRemotePort.split('-');
					var peerPort = localRemotePortIDArray[5];
					var trunkPeerPort = 'port-4-'+peerID+'-'+peerFace+'-'+peerDepth+'-'+peerPort;
					crawlCabinetConnections($('#'+trunkPeerPort), connectionArray, visitedPortArray);
				}
			}
		});
		
		// Store local partition trunk peer ID
		var localPartition = $(localPort).closest('.partition');
		var localPartitionPeerID = $(localPartition).data('peerGlobalId');
		
		// Does local partition trunk peer exist?
		if($('#'+localPartitionPeerID).length) {
			
			// Extract remote partition trunk peer ID, Face, & Depth
			var localPartitionPeerIDArray = localPartitionPeerID.split('-');
			var peerID = localPartitionPeerIDArray[2];
			var peerFace = localPartitionPeerIDArray[3];
			var peerDepth = localPartitionPeerIDArray[4];
			
			// Extract localRemote
			var localPortIDArray = localPortID.split('-');
			var peerPort = localPortIDArray[5];
			var trunkPeerPort = 'port-4-'+peerID+'-'+peerFace+'-'+peerDepth+'-'+peerPort;
			crawlCabinetConnections($('#'+trunkPeerPort), connectionArray, visitedPortArray);
		}
	}
	
	return connectionArray;
}

function crawlCabinetTrunks(localPort, trunkArray = [], visitedPartitionArray = []){
	
	// Store partition
	var localPortID = $(localPort).attr('id');
	var localPartition = $(localPort).closest('.partition');
	var localPartitionID = $(localPartition).attr('id');
	
	// Prevent loops
	if(!visitedPartitionArray.includes(localPartitionID)) {
	
		// Append local partition ID to visitedPartitionArray
		visitedPartitionArray.push(localPartitionID);
	
		// Gather local trunk peer
		var localRemotePartitionID = $(localPartition).data('peerGlobalId');
		
		// Does trunk peer exist?
		var remotePartition = $('#'+localRemotePartitionID);
		if($(remotePartition).length) {
			
			// Add trunk pair to trunkArray
			trunkArray.push([localPartition, remotePartition]);
			
			// Append remote partition ID to visitedPartitionArray
			visitedPartitionArray.push(localRemotePartitionID);
			
			// Extract remote partition ID, Face, & Depth
			var localRemotePartitionIDArray = localRemotePartitionID.split('-');
			var peerID = localRemotePartitionIDArray[2];
			var peerFace = localRemotePartitionIDArray[3];
			var peerDepth = localRemotePartitionIDArray[4];
			
			// Extract local port ID
			var localPortIDArray = localPortID.split('-');
			var peerPort = localPortIDArray[5];
			
			// Store trunk peer port
			var remotePartitionPortID = 'port-4-'+peerID+'-'+peerFace+'-'+peerDepth+'-'+peerPort;
			
			// Does remote partition port exist?
			var remotePartitionPort = $('#'+remotePartitionPortID);
			if($(remotePartitionPort).length) {
				
				// Gather remote partition port peer ports
				var remotePartitionPortPeerPortString = $(remotePartitionPort).data('connectedGlobalId');
				var remotePartitionPortPeerPortArray = JSON.parse(atob(remotePartitionPortPeerPortString));
				
				// Loop over each local peer port
				$.each(remotePartitionPortPeerPortArray, function(remotePartitionPortPeerPortIndex, remotePartitionPortPeerPort){
					// Does port exist?
					var remotePort = $('#'+remotePartitionPortPeerPort);
					if($(remotePort).length) {
						crawlCabinetTrunks(remotePort, trunkArray, visitedPartitionArray);
					}
				});
			}
		} else if(localRemotePartitionID.toLowerCase() != 'none') {
			trunkArray.push([localPartition, localRemotePartitionID]);
		}
		
		// Gather local peer ports
		var localRemotePortString = $(localPort).data('connectedGlobalId');
		var localRemotePortArray = JSON.parse(atob(localRemotePortString));
		
		// Loop over each local peer port
		$.each(localRemotePortArray, function(localRemotePortIndex, localRemotePort){
			
			// Does peer port exist?
			var remotePort = $('#'+localRemotePort);
			if($(remotePort).length) {
				crawlCabinetTrunks(remotePort, trunkArray, visitedPartitionArray);
			}
		});
	}
	
	return trunkArray;
}

function drawCabinetConnections(){
	
	pathDataTypeArray = [
		'cabinetSelectedConnections',
		'cabinetHoveredConnections'
	];
	
	cabinetCtx.strokeStyle = connectionLineColor;
	cabinetCtx.lineWidth = connectionLineWidth;
	cabinetCtx.beginPath();
	
	$.each(pathDataTypeArray, function(pathDataTypeIndex, pathDataType){
		
		var pathData = $(document).data(pathDataType);
		
		$.each(pathData, function(index, element){
			
			// Is pathData element a pair of ports?
			if(element.length == 2) {
				var elemA = element[0];
				var elemB = element[1];
				
				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);
					}
				} 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);
				}
			}
			
			// Highlight ports
			$.each(element, function(portIndex, portObject){
				if(typeof portObject == 'object') {
					highlightElement(portObject, connectionLineColor);
				}
			});
		});
	});
	cabinetCtx.stroke();
}

function drawCabinetTrunks(){
	
	pathDataTypeArray = [
		'cabinetSelectedTrunks',
		'cabinetHoveredTrunks'
	];
	
	cabinetCtx.strokeStyle = trunkLineColor;
	cabinetCtx.lineWidth = trunkLineWidth;
	cabinetCtx.beginPath();
	
	$.each(pathDataTypeArray, function(pathDataTypeIndex, pathDataType){
		
		var pathData = $(document).data(pathDataType);
		
		$.each(pathData, function(index, element){
			
			var vertical = canvasInset + (5*index);
			
			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);
			highlightElement(elemA, trunkLineColor);
			
			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);
				highlightElement(elemB, trunkLineColor);
				
				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(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);
				
				var left = elemACabinetDimensions.rightOrig + vertical;
				var top = elemACabinetDimensions.topOrig - vertical;
				addCabButton(left, top, elemB);
			}
			
		});
	});
	cabinetCtx.stroke();
}

function clearCabinetConnections(){
	
	var canvasHeight = $('#canvasCabinet').height();
	var canvasWidth = $('#canvasCabinet').width();
	cabinetCtx.clearRect(0, 0, canvasWidth, canvasHeight);
	$('a.addCabButton').remove();
}


// ### Path Functions ###
function drawPath(){
	
	resizePathCanvas();
	clearPathConnections();
	crawlPathConnections();
	crawlPathTrunks();
	drawPathTrunks();
	drawPathConnections();
}

function crawlPathConnections(){
	
	$.each(pathArray, function(pathName, path){
		var pathConnections = [];
		var workingPathConnections = {};
		var connectorElementArray = $(path['container']).find('.port');
		
		// Group connection peers
		$.each(connectorElementArray, function(index, element){
			var connectionPairID = $(element).data('connectionPairId');
			if(workingPathConnections[connectionPairID] === undefined) {
				workingPathConnections[connectionPairID] = [];
			}
			workingPathConnections[connectionPairID].push($(element));
		});
		
		// Filter out singles
		$.each(workingPathConnections, function(index, element){
			if(element.length == 2) {
				pathConnections.push(element);
			}
		});
		
		// Store path connection data
		pathArray[pathName]['connections'] = pathConnections;
	});
}

function crawlPathTrunks(){
	
	$.each(pathArray, function(pathName, path){
		var pathTrunks = [];
		var workingPathTrunks = {};
		var connectorElementArray = $(path['container']).find('.objectBox');
		
		// Group trunk peers
		$.each(connectorElementArray, function(index, element){
			var trunkPairID = $(element).data('trunkPairId');
			if(workingPathTrunks[trunkPairID] === undefined) {
				workingPathTrunks[trunkPairID] = [];
			}
			workingPathTrunks[trunkPairID].push($(element));
		});
		
		// Filter out singles
		$.each(workingPathTrunks, function(index, element){
			if(element.length == 2) {
				pathTrunks.push(element);
			}
		});
		
		// Store path trunk data
		pathArray[pathName]['trunks'] = pathTrunks;
	});
}

function drawPathConnections(){
	
	$.each(pathArray, function(pathName, path){
		
		var canvas = path['canvas'];
		var connections = path['connections'];
		pathArray[pathName]['context'].strokeStyle = connectionLineColor;
		pathArray[pathName]['context'].lineWidth = connectionLineWidth;
		pathArray[pathName]['context'].beginPath();
		
		$.each(connections, function(index, element){
			var elemA = element[0];
			var elemB = element[1];
			
			var elemADimensions = getDimensions(elemA, canvas);
			var elemBDimensions = getDimensions(elemB, canvas);
			
			pathArray[pathName]['context'].moveTo(elemADimensions.centerX, elemADimensions.bottom);
			pathArray[pathName]['context'].bezierCurveTo(elemADimensions.centerX + 20, elemADimensions.bottom, elemBDimensions.centerX + 20, elemBDimensions.top, elemBDimensions.centerX, elemBDimensions.top);
			
		});
		pathArray[pathName]['context'].stroke();
	});
}

function drawPathTrunks(){
	
	$.each(pathArray, function(pathName, path){
		var pathTrunks = path['trunks'];
		var canvas = path['canvas'];
		pathArray[pathName]['context'].strokeStyle = trunkLineColor;
		pathArray[pathName]['context'].lineWidth = trunkLineWidth;
		pathArray[pathName]['context'].beginPath();
		
		$.each(pathTrunks, function(index, element){
			
			var pathOrientation = $('#pathOrientation').val();
			
			var elemA = element[0];
			var elemB = element[1];
			
			var elemADimensions = getDimensions(elemA, canvas);
			var elemBDimensions = getDimensions(elemB, canvas);
			
			if(elemADimensions.right > elemBDimensions.right) {
				var rightBoundary = elemADimensions.right;
			} else {
				var rightBoundary = elemBDimensions.right;
			}
			
			if(pathOrientation == "0") {
				
				// Patch Cable Adjacent
				pathArray[pathName]['context'].moveTo(elemADimensions.centerX, elemADimensions.bottom);
				pathArray[pathName]['context'].lineTo(elemADimensions.centerX, elemBDimensions.top);
				
			} else {
				
				// Patch Cable Inline
				pathArray[pathName]['context'].moveTo(elemADimensions.right, elemADimensions.centerY);
				pathArray[pathName]['context'].lineTo((rightBoundary + 20), elemADimensions.centerY);
				pathArray[pathName]['context'].lineTo((rightBoundary + 20), elemBDimensions.centerY);
				pathArray[pathName]['context'].lineTo(elemBDimensions.right, elemBDimensions.centerY);
				
			}
			
		});
		pathArray[pathName]['context'].stroke();
	});
}

function clearPathConnections(){
	
	$.each(pathArray, function(pathName, path){
		var canvas = path['canvas'];
		var canvasHeight = $(canvas).height();
		var canvasWidth = $(canvas).width();
		pathArray[pathName]['context'].clearRect(0, 0, canvasWidth, canvasHeight);
	});
}


// ### Common Functions ###
function resetConnectionData(){
	$(document).data('selectedPort', false);
	$(document).data('cabinetSelectedConnections', []);
	$(document).data('cabinetHoveredConnections', []);
	$(document).data('cabinetSelectedTrunks', []);
	$(document).data('cabinetHoveredTrunks', []);
	$.each(pathArray, function(pathName, path){
		pathArray[pathName]['connections'] = {};
		pathArray[pathName]['trunks'] = {};
	});
}

function getDimensions(elem, canvas=false){
	
	if(canvas == false) {
		var canvas = $('#canvasCabinet');
	}
	
	var canvasLeft = $(canvas).offset().left;
	var canvasTop = $(canvas).offset().top;
	var elemLeft = $(elem).offset().left;
	var elemTop = $(elem).offset().top;
	
	var elemLeftOrig = elemLeft;
	var elemTopOrig = elemTop;
	
	var elemWidth = $(elem).width();
	var elemHeight = $(elem).height();
	var elemCenterX = elemLeft - canvasLeft + (elemWidth / 2);
	var elemCenterY = elemTop - canvasTop  + (elemHeight / 2);
	var elemLeft = elemLeft - canvasLeft;
	var elemRight = elemLeft + elemWidth;
	var elemRightOrig = elemLeftOrig + elemWidth;
	var elemTop = elemTop - canvasTop;
	var elemBottom = elemTop + elemHeight;
	
	var dimensions = {
		leftOrig: elemLeftOrig,
		topOrig: elemTopOrig,
		rightOrig: elemRightOrig,
		left: elemLeft,
		right: elemRight,
		top: elemTop,
		bottom: elemBottom,
		centerX: elemCenterX,
		centerY: elemCenterY,
		width: elemWidth,
		height: elemHeight
	};
	return dimensions;
}

function addCabButton(left, top, globalID){
	var addCab = $('<a class="addCabButton" data-global-id="'+globalID+'" href="#"style="z-index:1001; position:absolute;"><i class="fa fa-plus" style="color:#039cfd; background-color:white;"></i></a>');
	$('#canvasCabinet').after(addCab);
	var left = left - ($(addCab).width()/2);
	var top = top - ($(addCab).height()/2);
	$(addCab).css({'left':left+'px', 'top':top+'px'});
	makeAddCabButtonClickable(addCab);
}

function highlightElement(elem, color){
	
	// Store current line width
	var origLineWidth = cabinetCtx.lineWidth;
	
	// Set port highlight properties
	cabinetCtx.strokeStyle = color;
	cabinetCtx.lineWidth = connectionLineWidth;
	
	var elemDimensions = getDimensions(elem);
	cabinetCtx.strokeRect(elemDimensions.left, elemDimensions.top, elemDimensions.width, elemDimensions.height);
	
	// Restore line width
	cabinetCtx.lineWidth = origLineWidth;
}

function makePortsHoverable(clearPaths=true){
	
	if(clearPaths) {
		resetConnectionData();
		clearPathConnections();
		clearCabinetConnections();
	}
	
	$('#buildSpaceContent').find('.port').each(function(){
		$(this).unbind('mouseenter mouseleave click.drawConnections');
	});
	$('#buildSpaceContent').find('.port').each(function(){
		$(this).hover(function(){
			$(document).data('hoveredPort', this);
			drawCabinet();
		}, function(){
			$(document).data('hoveredPort', false);
			drawCabinet();
		});
		
		$(this).on('click.drawConnections', function(){
			
			
			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');
				
				// Compare previously and currently selected port IDs
				if(selectedPortID === thisPortID) {
					// Unselect port
					$(document).data('selectedPort', false);
				} else {
					// Select port
					$(document).data('selectedPort', this);
				}
			} else {
				$(document).data('selectedPort', this);
			}
			
			drawCabinet();
		});
	});

}

function makeCabArrowsClickable(){
	$('.cabMoveArrow').unbind('click');
	
	$('.cabMoveArrow').click(function(){
		var direction = $(this).data('cabMoveDirection');
		var cabinet = $(this).closest('.diagramCabinetContainer');
		if(direction == 'left') {
			$(cabinet).insertBefore($(cabinet).prev());
		} else {
			$(cabinet).insertAfter($(cabinet).next());
		}
		drawCabinet();
		
	});
}

function makeCabCloseClickable(){
	$('.cabClose').unbind('click');
	
	$('.cabClose').click(function(){
		var cabinet = $(this).closest('.diagramCabinetContainer');
		var locationBoxes = $(cabinet).parents('.diagramLocationBox');
		
		// Delete cabinet
		$(cabinet).remove();
		
		// Clean up empty location boxes
		$(locationBoxes).each(function(){
			if(!$(this).find('.diagramCabinetContainer').length) {
				$(this).remove();
			}
		});
		
		drawCabinet();

	});
}

function resizePathCanvas() {
	
	$.each(pathArray, function(pathName, path){
		
		var canvas = path['canvas'];
		$(canvas).attr('width', $(canvas).parent().width());
		$(canvas).attr('height', $(canvas).parent().height());
	});
}

function resizeCabinetCanvas() {
	
	var canvas = $('#canvasCabinet');
	
	if($(canvas).length) {
		$(canvas).attr('width', $(document).width());
		$(canvas).attr('height', $(document).height());
	}
}

function drawPathAndCabinet() {
	drawPath();
	drawCabinet();
}

function initializeCanvas() {
	
	window.addEventListener('resize', drawPathAndCabinet, false);
	connectionLineWidth = 3;
	connectionLineColor = 'LightSkyBlue';
	trunkLineWidth = 6;
	trunkLineColor = 'MidnightBlue';
	
	// Cabinet connections
	if($('#canvasCabinet').length) {
		canvasCabinet = document.getElementById('canvasCabinet');
		cabinetCtx = canvasCabinet.getContext('2d');
		$(document).data('cabinetSelectedConnections', []);
		$(document).data('cabinetHoveredConnections', []);
		$(document).data('cabinetSelectedTrunks', []);
		$(document).data('cabinetHoveredTrunks', []);
		canvasInset = 10;
	}
	
	// Path connections
	pathArray = {};
	if($('#canvasPath').length) {
		var canvas = $('#canvasPath');
		pathArray['path'] = {
			'context': $(canvas)[0].getContext('2d'),
			'canvas': canvas,
			'container' : $('#containerFullPath'),
			'connections': {},
			'trunks': {}
		};
	}
	
}

function initializeCanvasPathFinder(container) {
	var canvas = $('#canvasPathFinder');
	pathArray['pathFinder'] = {
		'context': $(canvas)[0].getContext('2d'),
		'canvas': canvas,
		'container' : container,
		'connections': {},
		'trunks': {}
	};
}