var UpStreamColour = "#87ab8f" ;
var DownStreamColour = "#beb574" ;
var UpDownStreamOverlapColour = "#d95963" ;
var NegativeValueColour = "#7b7bc1" ;


function DisableEnableTable( TableId, CheckStatus)
{
	if(CheckStatus == true)
	{
		document.getElementById(TableId).bgColor = "lightgrey";
	}
	else
	{
		document.getElementById(TableId).bgColor = "";
	}
	
}

var offset = 1;
var BandNumber = 1;
var USBandNumber = 1;
var DSBandNumber = 1;

function InsertRow( Direction, StartVal , EndVal )
{
	var CreateNewRow = 1;
	var Number = 0;
	var UStd  = "";
	var DStd  = "";

	if( Direction == "UpStream")
	{
		if( BandNumber > USBandNumber)
		{
			Number = USBandNumber;
		}
		else
		{
			Number = BandNumber;
			USBandNumber++;
		}
			
		UStd  = " <table  border=0  width=100% name=USBandTable" + Number  + " id=USBandTable" + Number  + "> " +
			 " <tr align=left> " 			+
			 "	<td  width=25% align=center ><font class=subtitle >Band " + Number +" </font></td> "  +
			 "	<td  width=25% align=center ><input type=text size=6  name=USStartBand" + Number +
			 								" id=USStartBand" + Number +
								" OnChange=\"ChangeGraphBand('US'," + Number + " )\"" +
			 								" value=" +  StartVal + "></input></td> " +
			 "	<td  width=25% align=center ><input type=text size=6  name=USEndBand" + Number +
			 								" id=USEndBand" + Number +
								" OnChange=\"ChangeGraphBand('US'," + Number + " )\"" +
			 								" value=" +  EndVal + "></input></td> " +
			"	<td  width=25% align=center ><input type=checkbox  name=DisableUSBand" + Number +
											"  id=DisableUSBand" + Number +
									" onClick=\"DisableEnableTable('USBandTable" + Number  +"' , this.checked ); " +
								" ChangeGraphBand('US'," + Number + " )\"" +
									"  value=off  > </input></td>" +
			"</tr>" +
		      " </table> " ;
		      
		DStd  = " ";

		if( BandNumber > USBandNumber)
		{
			CreateNewRow = 0;
			 document.getElementById("USBand" +  Number).innerHTML = UStd ;
			USBandNumber++;
		}
	}
	else
	{
		 
		if( BandNumber > DSBandNumber)
		{
			Number = DSBandNumber;
		}
		else
		{
			Number = BandNumber;
			DSBandNumber++;
		}
		DStd  =  " <table  border=0  width=100% name=DSBandTable" + Number  + " id=DSBandTable" + Number  + "> " +
			 " <tr align=left> " 			+
			 "	<td  width=25% align=center ><font class=subtitle >Band " + Number +" </font></td> "  +
			 "	<td  width=25% align=center ><input type=text size=6  name=DSStartBand" + Number +
			 								" id=DSStartBand" + Number +
								" OnChange=\"ChangeGraphBand('DS'," + Number + " )\"" +
			 								" value=" +  StartVal + "></input></td> " +
			 "	<td  width=25% align=center ><input type=text size=6  name=DSEndBand" + Number +
			 								" id=DSEndBand" + Number +
								" OnChange=\"ChangeGraphBand('DS'," + Number + " )\"" +
			 								" value=" +  EndVal + "></input></td> " +
			"	<td  width=25% align=center ><input type=checkbox  name=DisableDSBand" + Number +
											"  id=DisableUSBand" + Number +
									" onClick=\"DisableEnableTable('DSBandTable" + Number  +"' , this.checked ); " +
								" ChangeGraphBand('DS'," + Number + " )\"" +
									"  value=off  > </input></td>" +
			"</tr>" +
		      " </table> " ;
		UStd  = " ";
		if( BandNumber > DSBandNumber)
		{
			CreateNewRow = 0;
			 document.getElementById("DSBand" +  Number).innerHTML = DStd ;
			DSBandNumber++;
		}
	}

	if (CreateNewRow == 1)
	{
		var xx=document.getElementById('BandInfoTable');
		var x=xx.insertRow(Number + offset);
		var y=x.insertCell(0);
		var z=x.insertCell(1);
		y.innerHTML="<table border=1 width=100%><tr><td>234</td></tr></table>"
		z.innerHTML="<table border=1><tr><td>234</td></tr></table>"
		var td    = " " ;
		y.id = "USBand" +  Number;
		z.id = "DSBand" + Number;
		y.width = "50%";
		z.width = "50%";
		y.innerHTML = UStd ;
		z.innerHTML = DStd ;
		BandNumber++;
	}
}

function ShowRawValuesInTable(doc, Title, UpSize, UpValueList ,  DownSize,  DownValueList , base )
{
	var MaxSize = 0;

	if( UpSize > DownSize)
	{
		MaxSize = UpSize;
	}	   
	else
	{
		MaxSize = DownSize;
	}	   

	var table = "<table border=1 >" ;

	table += "<tr>";
	table += " <td width=45 ></td> " ;
	table += " <td align=center bgcolor=" + UpStreamColour+ "  >UpStream " + Title + " </td> ";
	table += " <td align=center bgcolor=" + DownStreamColour + "  >DownStream " + Title + "  </td> ";
	table += "</tr>" ;

	table += "<tr><td width=45 bgcolor=pink >Tones</td> " ;
	table += "<td><table border=1 bgcolor=pink ><tr><td width=45 >1</td><td width=45 >2</td><td width=45 >3</td><td width=45 >4</td><td width=45 >5</td><td width=45 >6</td><td width=45 >7</td><td width=45 >8</td><td width=45 >9</td><td width=45 >10</td></tr></table></td>" ;
	table += "<td><table border=1 bgcolor=pink ><tr><td width=45 >1</td><td width=45 >2</td><td width=45 >3</td><td width=45 >4</td><td width=45 >5</td><td width=45 >6</td><td width=45 >7</td><td width=45 >8</td><td width=45 >9</td><td width=45 >10</td></tr></table></td>" ;
	table += "</tr>" ;

	var tr="";
	doc.write(table);

	for (i = 0; i < MaxSize; i +=10 )
	{
		tr = "<tr>" ;
		tr += "<td width=45 align=right bgcolor=pink >" + i + " </td>" ;
		tr += "<td><table border=1  ><tr>" ;
		for (j = 0; j < 10; j++ )
		{
			UpValue = parseInt(UpValueList[i+j], base);
			DownValue = parseInt(DownValueList[i+j], base);
			if( ( UpValue > 0) && ( ( DownValue > 0) || ( DownValue < 0) ) )
			{
			   tr += "<td width=45 bgcolor=" + UpDownStreamOverlapColour +"  > " + UpValue + "</td> "	    ;
			}
			else if( UpValue < 0)
			{
			   tr += "<td width=45 bgcolor=" + NegativeValueColour +" > " + UpValue + "</td> "	    ;
			}
			else
			{
			   tr += "<td width=45 bgcolor=" + UpStreamColour + " > " + UpValue + "</td> "	    ;
			}
		}
		tr += "</tr></table></td>" ;
		tr += "<td ><table border=1 ><tr>" ;
		for (j = 0; j < 10; j++ )
		{
			UpValue = parseInt(UpValueList[i+j], base);
			DownValue = parseInt(DownValueList[i+j], base);
			if( ( DownValue > 0) &&  ( ( UpValue > 0) || ( UpValue < 0) ) )
			{
			   tr += "<td width=45 bgcolor=" + UpDownStreamOverlapColour +"  > " + DownValue + "</td> "	    ;
			}
			else if( DownValue < 0)
			{
			   tr += "<td width=45 bgcolor=" + NegativeValueColour +" > " + DownValue + "</td> "	    ;
			}
			else
			{
			   tr += "<td width=45 bgcolor=" + DownStreamColour + " > " + DownValue + "</td> "	    ;
			}
		}
		tr += "</tr></table></td>" ;
		tr += "</tr>" ;
		doc.write(tr);
	}
	doc.write("</table>");
}  


function doCompleteBarGraph( doc, yTitle, xTitle, yDiff, xDiff, yFactor, xFactor, yMaxSize,  UpSize, UpValueList ,  DownSize,  DownValueList , base )
{
	var xMaxSize = 0;
	if( UpSize > DownSize)
	{
		xMaxSize = UpSize ;
	}	   
	else
	{
		xMaxSize = DownSize;
	}	   
	xFactorSize = xMaxSize* xFactor ;
	yFactorSize = yMaxSize* yFactor ;

	doBarGraphTop(doc, yTitle, xFactorSize);
	doBarGraphTableStart(doc, yTitle, xFactorSize , yFactorSize);
	doLeftBar(doc, "black", yMaxSize, yDiff, yFactor);
	doAllBarsWrite(doc, yFactor, xFactor, yMaxSize, UpSize, UpValueList ,  DownSize,  DownValueList , base );
	doBarGraphTableEnd(doc );
	doHorizantalBar(doc, "black", (xFactorSize+ xDiff),3 );
	doAxisWrite(doc, xTitle, xDiff, xMaxSize, xFactor );
}

function doBarGraphColorInfo(doc, color,Title)
{
   var table = " ";
 
   table =  " <table bgcolor=" + color + "  border=0 cellspacing=0 cellpadding=0  width=200   height=5>" ;
   table += " <tr>" ;
   table += " <td valign=bottom  >" + Title + " </td>";
   table += " </tr>" ;
   table += "</table>" ;
   doc.write(table);
}

function doBGColorInfoStart(doc )
{
   var table = " ";
 
   table =  " <table  border=0 cellspacing=0 cellpadding=0  height=5>" ;
   table += " <tr>" ;
   table += " <td  width = " + 50 + " > </td>";
   doc.write(table);
}

function doBGColorInfo(doc, color,Title,width)
{
   var td = " ";
   td += " <td  bgcolor=" + color + " width = " + (width-10) + " > " + Title + " </td>";
   td += " <td  width = " + 10 + " > </td>";
   doc.write(td);
}

function doBGColorInfoEnd(doc, color,Title)
{
   var table = " ";
   table += " </tr>" ;
   table += "</table>" ;
   doc.write(table);
}

function doBarGraphTableStart(doc, yTitle, xFactorSize , yFactorSize)
{
   var table = " ";
   table = "<table name=" + yTitle +"BGTable id=" + yTitle + "BGTable" +
   			" border=0 cellspacing=0 cellpadding=0 width=" +
               xFactorSize + "  height=" + yFactorSize +" >";  
   doc.write(table);
}

function doBarGraphTableEnd(doc)
{
   doc.write("</table>");
}


function doBarGraphTop(doc, Title, Size)
{
	var table = " ";
	var TmpSize = 0;
	TmpSize =  Size +45;
	table =  " <table  border=0 cellspacing=0 cellpadding=0  width="  +
	              TmpSize  + "  height=5>" ;
	table += " <tr>" ;
	table += " <td valign=bottom  width=15 > </td>";
	table += " <td valign=bottom  >" + Title+ " </td>";
	table += " </tr>" ;
	table += "</table>" ;
	doc.write(table);
}

function doLeftBar(doc, color, height, diff, mulfactor)
{
	var td = " ";
	var difffactor = 0 ;
	var initheight = 0 ;
	var barheight = 0 ;
	var loop = 0 ;

	difffactor = (diff / mulfactor);
	ActualBarHeight = ( mulfactor * height);
	initheight =  (diff/ 2);
	loop        =  ( height / diff ) * mulfactor ;
	barheight = ActualBarHeight  + initheight;

	td = "<td valign=top align=right width=42 height=" +  barheight +
		" > <table border=0 cellspacing=0 cellpadding=0 width=40 > " ;
	for (i=loop; i>=1; i--) 
	{
		td += "<tr><td valign=middle align=right height=" + diff +" >" +(i* difffactor )+"-</td></tr>";
	}
	td += "<tr><td valign=bottom align=right height=" + initheight +" ></td></tr>";
	td += "</table>";
	td += "</td>";
	doc.write(td);

	td = "<td VAlign=bottom>";
	td +="<table bgcolor=" + color +
	      "  border=0 cellspacing=0 cellpadding=0 width=3 height=" +
	       barheight + " ><tr><td></td></tr></table>";
	td += "</td>";
	doc.write(td);
}


function doAllBarsWrite(doc, yFactor, xFactor, yMaxSize, UpSize, UpValueList ,  DownSize,  DownValueList , base )
{
	var UpValue = 0;	
	var DownValue = 0;	
	var xMaxSize = 0;	
	var xFactorSize = 0;	
	var yFactorSize = 0;	

	if( UpSize > DownSize)
	{
		xMaxSize = UpSize ;
	}	   
	else
	{
		xMaxSize = DownSize;
	}	   
	xFactorSize = xMaxSize* xFactor ;
	yFactorSize = yMaxSize* yFactor ;

	var width = 1;
	if ( xFactor > 1) 
	{
		width *= xFactor;
	}

	var Colour = " ";
	var Value = 0;

	for (i = 0; i < xMaxSize; i++)
	{
		if ( xFactor < 1) 
		{
			if( ( i % (1/xFactor) ) != 0) 
			{
				continue;
			}		
		}

		if((UpSize  > i) && (DownSize> i) )
		{
			UpValue = parseInt(UpValueList[i], base);
			DownValue = parseInt(DownValueList[i], base);
			if( (UpValue < 0) || (DownValue < 0) )
			{
				if(UpValue < DownValue)
				{
					Colour = NegativeValueColour;
					Value = UpValue * -1;
				}
				else
				{
					Colour = NegativeValueColour;
					Value = DownValue * -1  ;
				}
			}
			else if( (UpValue != 0) && (DownValue == 0) )
			{
				Colour = UpStreamColour;
				Value = UpValue  ;
			}
			else if( (UpValue == 0) && (DownValue != 0) )
			{
				Colour = DownStreamColour;
				Value = DownValue   ;
			}
			else if( UpValue >  DownValue )
			{
				Colour = UpDownStreamOverlapColour;
				Value = UpValue   ;
			}
			else 
			{
				Colour = UpDownStreamOverlapColour;
				Value = DownValue   ;
			}
		}
		else if(UpSize   > i)
		{
			UpValue = parseInt(UpValueList[i], base);
			if( UpValue < 0 )
			{
				Colour = NegativeValueColour;
				Value = UpValue * -1;
			}
			else	
			{
				Colour = UpStreamColour;
				Value = UpValue  ;
			}
		}
		else 
		{
			DownValue = parseInt(DownValueList[i], base);
			if( DownValue  < 0 )
			{
				Colour = NegativeValueColour;
				Value = DownValue  * -1;
			}
			else	
			{
				Colour = DownStreamColour ;
				Value = DownValue   ;
			}
		}
		doBarGraphWrite(doc, Colour, ((Value *yFactor) % (yFactorSize +1)), width);
	}
}

function doBarGraphWrite(doc, color,height,width)
{
   var td = " ";
   td += "<td VAlign=bottom><table bgcolor=" + color + 
         "  width=" + width +  "  height=" +  height + 
         "  border=0  cellspacing=0 cellpadding=0 ><tr><td></td></tr></table></td> ";			

   doc.write(td);
}

function doHorizantalBar(doc, color,width,height)
{
   var table = " ";
   var TmpWidth;
   TmpWidth = width +45;	
   table += "<table bgcolor=" + color +
            "  border=0 cellspacing=0 cellpadding=0 width=" +
            TmpWidth + "  height="+ height +"  ><tr><td></td></tr></table> ";
   doc.write(table);
}


function doAxisWrite(doc, xTitle, Gap, Size, xFactor )
{
	var td = " ";
	var table = " ";
	var i;
	var xFactorSize = Size * xFactor ;
	var TmpSize =  xFactorSize +45 + Gap ;
	var FactorGap = Gap *(1/xFactor);

	var loop = Size / FactorGap ;
	var r_loop = Math.round( loop ) ;

	if(loop >= r_loop )
	{
		loop = r_loop ;
	}
	else
	{
		loop = r_loop -1;
	}

	var RemainGap = ( (Size - (loop*FactorGap))* xFactor);
	var MiddlePosition = Math.round(loop/2);

	table  += "<table  border=0  " +
				 "cellspacing=0 cellpadding=0 width=" +
				 TmpSize + "  height=20 >"	

	doc.write(table);
	doc.write("<tr>");

	td = "<td width=40 >";
	td += "<table  border=0 cellspacing=0 cellpadding=0  width=40 ><tr><td>   </td></tr></table>";
	td += "</td>" ;
	doc.write(td);

	for (i=0; i< loop ;i++) 
	{
		td = "<td width=" + Gap + " align=left >";
		td += (i * FactorGap ) ;
		td += "</td>" ;
		doc.write(td);
	}

	if( (loop*FactorGap) < Size)
	{
		td = "<td width=" + RemainGap  + " align=left >";
		td +=  "  ";
		td += "</td>" ;
		doc.write(td);
	}   
	td = "<td width=" + Gap + " align=left >";
	td += Size ;
	td += "</td>" ;
	doc.write(td);
	doc.write("</tr>");

	doc.write("<tr>");
	td = "<td width=40 >";
	td += "<table   border=0 cellspacing=0 cellpadding=0  width=40 ><tr><td>   </td></tr></table>";
	td += "</td>" ;
	doc.write(td);

	for (i=0; i< loop ;i++) 
	{
		if( i == MiddlePosition )
		{
			td = "<td width=" + Gap + "  align=left >";
			td += xTitle ;
			td += "</td>" ;
			doc.write(td);
		}
		else
		{
			td = "<td width=" + Gap + "  align=left >";
			td += "</td>" ;
			doc.write(td);
		}
	}
	if( (loop*FactorGap) < Size)
	{
		td = "<td width=" + RemainGap  + " align=left >";
		td += "</td>" ;
		doc.write(td);
	}   
	td = "<td width=" + Gap + " align=left >";
	td += "</td>" ;
	doc.write(td);

	doc.write("</tr>");
	doc.write("</table>");
}