var airports = new Array();

var circleColor = "#C0C0C0";
var stroke = 2;
var cWidth = 16;
var cHeight = 16;

var circleCoordinates = new Array();
circleCoordinates[0] = new Array(50,30);//left,top
circleCoordinates[1] = new Array(50,60);
circleCoordinates[2] = new Array(50,90);
circleCoordinates[3] = new Array(50,120);
circleCoordinates[4] = new Array(50,150);
circleCoordinates[5] = new Array(50,180);
circleCoordinates[6] = new Array(50,210);

var lineColor = "#990000";
var lineCoordinates = new Array();
lineCoordinates[0] = new Array(58,38);//left,top
lineCoordinates[1] = new Array(58,68);
lineCoordinates[2] = new Array(58,98);
lineCoordinates[3] = new Array(58,128);
lineCoordinates[4] = new Array(58,158);
lineCoordinates[5] = new Array(58,188);
lineCoordinates[6] = new Array(58,218);

var num = new Array();
num[0] = new Array();
num[1] =  new Array("2", 70, 76);//left,top
num[2] =  new Array("3", 70, 106);
num[3] =  new Array("4", 70, 136);
num[4] = new Array("5", 70, 166);
num[5] =  new Array("6", 70, 196);
num[6] =  new Array("7", 70, 226);

var firstTime = 0;
var hop_id = 0;
var found = 0;
function drawGraph( airport1 , airport2 , date_ , time_ ){
	if( firstTime == 0 ){
		//draw circles
		iIndex = drawFirstTimeGraph( airport1 , airport2 , date_ , time_ );
		//alert(iIndex);
		
		//save airports to array
		airports[0] = airport1;
		airports[1] = airport2;
		//increase counters
		firstTime++;
		hop_id = 2;//2 circles r drawn already, so, start from 2 //alert(airports.length);
	}else{
		//drawSequentialGraph();
		found = 0;
		for( i=0 ; i<airports.length ; i++ ){
			if( airport2 == airports[i] ){
				//direct to existing node
				//alert("exist");
				found = 1;
				break;
			//}else{
				//draw new node
				//alert("does not exist");
			}
		}
		//if( found == 0 ){//not found, draw new circle
			//save airport to array
			airports[hop_id] = airport2;
			
			drawNewNode( airport1 , airport2 , date_ , time_ );
		//}else{//found, redirect
			//alert("exist");
		//}
	}
}
function drawNewNode( airport1 , airport2 , date_ , time_ ){//alert(hop_id);
	var startingIndex = document.getElementById('num_hops');
	
	//lon lat array index
	var lon_lat_array = +startingIndex.value+1;
	
	var airport2_ = '<a href="#" class="BigMapTextOrange" onclick="showMSVirtMaps(\''+airport2+'\','+lon_lat_array+');return false;"><b>'+airport2.toUpperCase()+'</b></a>';
	var jg = new jsGraphics("graph");
	jg.setColor(circleColor);
	jg.setStroke(stroke);
	jg.drawEllipse(circleCoordinates[hop_id][0],circleCoordinates[hop_id][1],cWidth,cHeight);//x1+15 - y1+15
	jg.setColor(lineColor);
	jg.drawLine(lineCoordinates[hop_id-1][0],lineCoordinates[hop_id-1][1],lineCoordinates[hop_id][0],lineCoordinates[hop_id][1]);//x1,y1,x2,y2
	jg.setColor("green");
	jg.setFont("Tahoma", "10px", Font.PLAIN);
	jg.drawString(airport2_, circleCoordinates[hop_id][0]-25, circleCoordinates[hop_id][1]);//x1+10,y1
	//jg.drawString('<a href="#" class="BigMapTextOrange" style="font-size:9px;" onclick="showEdit('+startingIndex.value+');return false;">'+num[hop_id-1][0]+' edit</a>',num[hop_id-1][1],num[hop_id-1][2]);
    //jg.drawString('<a href="#" class="BigMapTextOrange" style="font-size:9px;" onclick="showEdit('+startingIndex.value+');return false;">edit</a>-<span id=d>'+date_+'</span> <span id=t>'+time_+'</span>',num[hop_id-1][1],num[hop_id-1][2]);	
    jg.drawString('<span id=d>'+date_+'</span> <span id=t>'+time_+'</span>',num[hop_id-1][1],num[hop_id-1][2]);	
	jg.paint();
	hop_id++;
}
function drawFirstTimeGraph( airport1 , airport2 , date_ , time_ ){
	var startingIndex = document.getElementById('num_hops');
		
	//lon lat array index
	//index 0
	var lon_lat_array_0 = +startingIndex.value;
	//index 1
	var lon_lat_array_1 = +startingIndex.value+1;
	
	var airport1_ = '<a href="#" class="BigMapTextOrange" onclick="showMSVirtMaps(\''+airport1+'\','+lon_lat_array_0+');return false;"><b>'+airport1.toUpperCase()+'</b></a>';
	var airport2_ = '<a href="#" class="BigMapTextOrange" onclick="showMSVirtMaps(\''+airport2+'\','+lon_lat_array_1+');return false;"><b>'+airport2.toUpperCase()+'</b></a>';
	var jg = new jsGraphics("graph");
	jg.setColor(circleColor);
	jg.setStroke(stroke);
	jg.drawEllipse(circleCoordinates[0][0],circleCoordinates[0][1],cWidth,cHeight);//x1+15 - y1+15
	jg.drawEllipse(circleCoordinates[1][0],circleCoordinates[1][1],cWidth,cHeight);//x1+15 - y1+15
	jg.setColor(lineColor);
	jg.drawLine(lineCoordinates[0][0],lineCoordinates[0][1],lineCoordinates[1][0],lineCoordinates[1][1]);//x1,y1,x2,y2
	jg.setColor("green");
	jg.setFont("Tahoma", "10px", Font.PLAIN);
	jg.drawString(airport1_, circleCoordinates[0][0]-25, circleCoordinates[0][1]);//x1+10,y1
	jg.drawString(airport2_, circleCoordinates[1][0]-25, circleCoordinates[1][1]);//x1+10,y1
	//jg.drawString('<a href="#" class="BigMapTextOrange" style="font-size:9px;" onclick="showEdit('+startingIndex.value+');return false;">edit</a>-<span id=d>'+date_+'</span> <span id=t>'+time_+'</span>', 70, 46);//x1+55,y1-17 //Find pattern ???
jg.drawString('<span id=d>'+date_+'</span> <span id=t>'+time_+'</span>', 70, 46);//x1+55,y1-17 //Find pattern ???	
	jg.paint();
	
	//get lastIndex to start from it next time
	lastIndex = lineCoordinates[1];
	return lastIndex;
}