// begin variable definitions

// styles used:
// a.MenuOption - link in the menu dropdowns
// a.MenuOption:hover - link hover


// run the writeMenu() function to build the navigation.

var clearGif = "images/spacer.gif";

// sets initial states for menu dropdown. 
var items = new Array("none","none","none","none");

// this holds the xy position of each dropdown menu
// when using variable width menus, this array is used to calculate menu width

var positionx = new Array();
// new

// 
positionx[0] = 265;
positionx[1] = 393;
positionx[2] = 521;


var positiony = 78;

// sets dropdown menu width at 120px. - only used if menuwidth is not variable (see below)
var menuWidth = 127;
var NSmenuWidth = 127;

function doIt(){
openPopUpWindow('#');
}
// The menu items array defines all the menu options and their associated links, using one sub-array for each drop-down.
// The image rollovers are defined in a separate javascript (menuHeaders_x.js)
menuItems = new Array();
// new below

menuItems[0] = new Array;
menuItems[0][0] = new Array("bus_channels_01.htm","TV Channels");
menuItems[0][1] = new Array("bus_tvsales_01.htm","TV Sales");
menuItems[0][2] = new Array("bus_mag_01.htm","Magazines");
menuItems[0][3] = new Array("bus_homeenter_01.htm","Home Entertainment");
menuItems[0][4] = new Array("bus_child_01.htm","Children's");
menuItems[0][5] = new Array("bus_newmedia_01.htm","New Media");
// 
menuItems[1] = new Array;
menuItems[1][0] = new Array("board_board_01.htm","BBC Worldwide Board");
menuItems[1][1] = new Array("board_fairtrade_01.htm","BBC Worldwide's Commitment to Fair Trading");
menuItems[1][2] = new Array("board_bbcwtrade_01.htm","How BBC Worldwide Trades");
// 
menuItems[2] = new Array;
menuItems[2][0] = new Array("finance_overview_01.htm","Overview");
menuItems[2][1] = new Array("finance_traderesults_01.htm","Trading Results");
//


var timer;	// timeOut varibale
var hideBox;
var delayItemNo; // the reason for this and hideBox is that local variables don't work in a timeout call.
var isIE;
var isNS;

curBrowVer = String(navigator.appVersion);
curBrowVer = curBrowVer.substring( 0 , curBrowVer.indexOf( " " ));



if (document.all) {
	isIE=true;
	isNS=false;
} else {
	 if ( curBrowVer.indexOf("4.") == -1 && curBrowVer.indexOf("3.") == -1 ) {
		isIE=true;
		isNS=false;
	
	} else {
		isIE=false;
		isNS=true;
	}
	/*isIE=false;
	isNS=true;*/
}

var optionColor_off = "#AFC3DB"; // un-highlited menu option
var optionColor_over = "#8CA6C9"; // highlighted menu option
var borderColor = "images/blank.gif"; //border colour. 


// end variable definitions

function wln(str){
 document.writeln(str);
}

// drops the menu
function openIt(itemNo) {

if ( items[ itemNo ] != "disable" ) {
	items[itemNo] = "block";
	for (var i=0; i<items.length; i++){
		if ( items[ i ] != "disable" ) {
		if (isIE) {

			var newId = "item" + i + "box";
			var showBox = document.all(newId);
			window.clearTimeout(timer);
			showBox.style.display = items[i];
			}
		else {
			var layerName = "item"+i+"box";
			var showBox = document.layers[layerName];
			window.clearTimeout(timer);
			if (items[i] == "block") {showBox.visibility = "show";}
			else {showBox.visibility = "hide";}
			}
		   }
		}
	}
}
// closes the menu. It sets a timeout on this action so if another part of the menu is rolled over it stays open.
function closeIt(itemNo) {
if ( items[ itemNo ] != "disable" ) {
	items[itemNo] = "none";
	if (isIE) {
		var newId = "item" + itemNo + "box";
		hideBox = document.all(newId);
		delayItemNo = itemNo;
		timer = window.setTimeout('hideBox.style.display = "none";',150);

		}
	else {
		var layerName = "item"+itemNo+"box";
		hideBox = document.layers[layerName];
		delayItemNo = itemNo;
		timer = window.setTimeout('hideBox.visibility = "hide";',150);
		}
	} 

}

function highlight(objectName,on){
if (on) { objectName.bgColor = optionColor_over;}
else { objectName.bgColor = optionColor_off;}
}


// this function writes the entire menu, including header graphics, dropdowns and menu items.
function writeMenu(){
var title;
var offset;
// new it was 4
for (var itemNo=0; itemNo < menuItems.length; itemNo++){
	// if you want variable menu width (fills space between menu headers), turn on the following line.
	// menuWidth = positionx[itemNo+1] - positionx[itemNo];

	// Netscape version uses layers only
	if (isNS) {
		
		wln('<layer name="item' + itemNo + 'box" width="' + (NSmenuWidth) + '" height="1" top="' + positiony+ '" left="'+positionx[itemNo] +'" onMouseover="openIt('+itemNo+')" onMouseout="closeIt('+itemNo+')" visibility="hidden">');
		offset = 0;
		for (var i=0; i<menuItems[itemNo].length; i++){
			// opHeight sets the height of each menu option.
			// this should correspond to the font size.
			// where the menu option wraps to the next line, the opHeight is increased (see if statement, below).
			if (menuItems[itemNo][i][1].length+2 > 28) {opHeight = 20;} 
			else {opHeight=18;}
			wln('<layer name="menu'+itemNo+'option'+i+'" left="" top="'+((i*(opHeight+1))+offset)+'" bgcolor="' + optionColor_off + '" width="' + NSmenuWidth + '" height="'+opHeight+'" onMouseover="highlight(this,true)" onMouseout="highlight(this,false)">');
			wln('<table cellpadding="0" cellspacing="0" border="0">');
			wln('<tr><td colspan="4"><img src="'+clearGif+'" width="' + NSmenuWidth + '" height="1" /></td></tr>');
			wln('<tr><td rowspan="2"><img src="'+clearGif+'" width="1" height="'+opHeight+'" /></td>');
			wln('<td valign="top" height="1"><img src="'+clearGif+'" width="5" height="1" /></td>');
			wln('<td valign="top" height="1"><img src="'+clearGif+'" width="' + (NSmenuWidth-7) + '" height="1" /></td>');
			wln('<td rowspan="2"><img src="'+clearGif+'" width="1" height="'+opHeight+'" /></td></tr>');
			wln('<tr><td></td><td valign="middle" align="right"><a href="' + menuItems[itemNo][i][0] + '" target="_top" class="MenuOption">' + menuItems[itemNo][i][1] + '</a></td></tr>');
			if (i == (menuItems[itemNo].length -1)) {
				wln('<tr><td colspan="4"><img src="'+clearGif+'" width="' + NSmenuWidth + '" height="1" /></td></tr>');
			}
			wln('</table>');
			wln('</layer>');
			if (menuItems[itemNo][i][1].length+2 > 28) offset = offset + 10;
		}
		wln('</layer>');
		}	

	
		// IE version uses absolutely poisitioned divs and tables
	else {
		
		wln('<table cellspacing="0" border="0" cellpadding="0" id="item' + itemNo + 'box" style="display:none; filter:alpha(Opacity=85, style=0); position:absolute; top:'+ positiony+'px; left:'+positionx[itemNo] +'px; width:' + menuWidth + 'px; height:24px" onMouseover="openIt(' + itemNo + ')" onMouseout="closeIt(' + itemNo + ')">');
		for (var i=0; i<menuItems[itemNo].length; i++){
			// border
			wln('<tr><td rowspan="2"><img src="'+clearGif+'" width="1" height="1" /></td><td><img src="'+clearGif+'" width="' + (menuWidth-2) + '" height="1" /></td><td rowspan="2"><img src="'+clearGif+'" width="1" height="1" /></td></tr>');
			// active cell
			wln('<tr><td id="menu'+itemNo+'option'+i+'" name="menu'+itemNo+'option'+i+'" align="right" bgcolor="'+optionColor_off+'" onMouseover="highlight(this,true)" onMouseout="highlight(this,false)">');
			wln('<table cellpadding="0" cellspacing="0" border="0"><tr>');
			//menu item
			wln('<td align="right" onclick="document.location.href=\''+menuItems[itemNo][i][0]+'\';" width="100%"><a href="' + menuItems[itemNo][i][0] + '" target="_top" class="MenuOption">' + menuItems[itemNo][i][1] + '</a></td>');
			//arrow
			wln('<td align="right" width="10"><img src="'+clearGif+'" width="5" height="20" /></td></tr></table>');
			wln('</td></tr>');
		}
		wln('<tr><td colspan="3"><img src="'+clearGif+'" width="' + (menuWidth-2) + '" height="1" /></td></tr>');
		wln('</table>');
		}
	}
}