var axMilestone;
var aMilestone;
var bMilestoneReady = false;
var aArrIntWidth;
var aArrIntHeight;
var windowWidth, windowHeight;
var aPosition = getScrollXY();
	
function showInstruction() {
	opacity("trInstruction", 0, 100, 200);
}
	
function prepareInstruction(){
	var trInstruction = document.getElementById("trInstruction");
	trInstruction.style.MozOpacity = 0;
	trInstruction.style.filter = "alpha(opacity=0)";		
	trInstruction.style.display = '';
}	
	
function openContent(iCurrIdx){
	var sOut = "loading ... ";
	var oItem = new Object();
	

	if (bMilestoneReady) {
		for(var i=0;i<aMilestone.length;i++){
			if (iCurrIdx == aMilestone[i].id) {
				oItem = aMilestone[i];
				break;
			}		
		}
		
		sOut = '<table width="550"  border="0" cellspacing="3" cellpadding="2">';
		sOut += '<tr><td colspan="4" align="right"><img src="/global_images/citi50/pics/btn_close.gif" width="19" height="19" border="0" onMouseOver="this.style.cursor=\'pointer\';" onClick="closeContent();"></td></tr>';
		//sOut += '<tr><td width="10">&nbsp;</td><td width="150">&nbsp;</td><td>&nbsp;</td><td width="10">&nbsp;</td></tr>';
		sOut += '<tr><td width="10">&nbsp;</td><td width="150" align="center" valign="top"><img src="/global_images/citi50/assets/milestone/'+oItem.imgpath+'"></td>';
		sOut += '<td valign="top" class="content"><font class="title">'+oItem.title+'</font><br><br>'+oItem.desc+'</td><td width="10">&nbsp;</td></tr>';
		sOut += '<tr><td width="10">&nbsp;</td><td width="150" height="20">&nbsp;</td><td height="20">&nbsp;</td><td width="10">&nbsp;</td></tr></table>';
		
		document.getElementById('milestone_detail').innerHTML = sOut;		
		setContentPos();
		var syear = oItem.id.split("_")[0].split("content")[1];
		track('milestone>'+syear+'>'+replace(oItem.title,' ','_'));
	}else{
		openContent(iCurrIdx);
	}
}

function thisMovie(movieName) {
    if (navigator.appName.indexOf("Microsoft") != -1) {
        return window[movieName];
    } else {
        return document[movieName];
    }
}
 
function closeContent(){
	document.getElementById('milestone').style.display = 'none';
	document.getElementById('milestone_bg').style.display = 'none';
	 thisMovie("citi50").enableFlashMouseDetection();
}



function setContentPos(){
	var milestone_bg = document.getElementById("milestone_bg");
	var milestone = document.getElementById("milestone");
		
	if (self.innerHeight) {	 
		windowWidth = self.innerWidth;
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) {  
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) {  
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}	
	
	if( typeof( window.pageYOffset ) == 'number' ) {
		milestone_bg.style.width = (document.body.scrollWidth)+'px';
		milestone_bg.style.height = (document.body.scrollHeight)+'px';
	}else{
		milestone_bg.style.width = document.body.offsetWidth;
		milestone_bg.style.height = document.body.offsetHeight;
	}
	
	
	milestone_bg.style.MozOpacity = 0;
	milestone_bg.style.filter = "alpha(opacity=0)";
	milestone_bg.style.display = '';	
	milestone.style.MozOpacity = 0;
	milestone.style.filter = "alpha(opacity=0)";
	milestone.style.display = '';
	milestone.style.height="auto";
		
	if (document.all) milestone.style.height=milestone.offsetHeight+"px";
	else milestone.style.height=(milestone.offsetHeight+10)+"px";

	milestone.style.top = aPosition[1] + ((parseInt(windowHeight)/2)-(parseInt(milestone.style.height))/2)+'px';
	milestone.style.left = aPosition[0] + ((parseInt(windowWidth)/2)-(parseInt(milestone.style.width))/2)+'px';
	
	opacity("milestone_bg", 0, 70, 50);
	opacity("milestone", 0, 100, 75);
	setTimeout("showContent()", 100);
}

function showContent(){
	var obj_detail = document.getElementById("milestone_detail");
	obj_detail.style.display = '';
	//opacity("milestone_detail_container", 0, 100, 100);
}






function chDimensionH(id, iStart, iEnd, millisec){
	var speed = Math.round(millisec / 100); 
    var timer = 0; 
	var iInt = 0;
	aArrIntHeight = new Array();
	
	if(iStart > iEnd) { 
        for(i = iStart; i >= iEnd; i--){ 
            iInt = setTimeout("changeDimension('height'," + i + ",'" + id + "')",(timer * speed));
            aArrIntHeight.push(iInt);
			timer++; 
        } 
    } else if(iStart < iEnd) { 
        for(i = iStart; i <= iEnd; i++){ 
           	iInt = setTimeout("changeDimension('height'," + i + ",'" + id + "')",(timer * speed)); 
            aArrIntHeight.push(iInt);
			timer++; 
        } 
    } 
}


function chDimensionW(id, iStart, iEnd, millisec){
	var speed = Math.round(millisec / 100); 
    var timer = 0; 
	var iInt = 0;
	aArrIntWidth = new Array();
	
	if(iStart > iEnd) { 
        for(i = iStart; i >= iEnd; i--){ 
            iInt = setTimeout("changeDimension('width'," + i + ",'" + id + "')",(timer * speed));
            aArrIntWidth.push(iInt);
			timer++; 
        } 
    } else if(iStart < iEnd) { 
        for(i = iStart; i <= iEnd; i++){ 
           	iInt = setTimeout("changeDimension('width'," + i + ",'" + id + "')",(timer * speed)); 
            aArrIntWidth.push(iInt);
			timer++; 
        } 
    } 
}

function changeDimension(dir, size, id){
	var object = document.getElementById(id).style; 
	if (dir == "width") object.width = size+'px';
	else if (dir == "height") object.height = size+'px';
	
	object.top = aPosition[1] + ((parseInt(windowHeight)/2)-(parseInt(object.height))/2)+'px';
	object.left = aPosition[0] + ((parseInt(windowWidth)/2)-(parseInt(object.width))/2)+'px';
	
	
}




function opacity(id, opacStart, opacEnd, millisec) { 
    //speed for each frame 
    var speed = Math.round(millisec / 100); 
    var timer = 0; 
	var iIntOpacity = 0;
	aArrIntOpacity = new Array();
	
    //determine the direction for the blending, if start and end are the same nothing happens 
    if(opacStart > opacEnd) { 
        for(i = opacStart; i >= opacEnd; i--){ 
            iIntOpacity = setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            aArrIntOpacity.push(iIntOpacity);
			timer++; 
        } 
    } else if(opacStart < opacEnd) { 
        for(i = opacStart; i <= opacEnd; i++){ 
           	iIntOpacity = setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed)); 
            aArrIntOpacity.push(iIntOpacity);
			timer++; 
        } 
    } 
} 

function changeOpac(opacity, id) { 
	var object = document.getElementById(id).style; 
	if (object.opacity != opacity){
		object.opacity = (opacity / 100); 
		object.MozOpacity = (opacity / 100); 
		object.KhtmlOpacity = (opacity / 100); 
		object.filter = "alpha(opacity=" + opacity + ")"; 
	}
} 


function getScrollXY() {
	var scrOfX = 0, scrOfY = 0;
	if( typeof( window.pageYOffset ) == 'number' ) {
		//Netscape compliant
		scrOfY = window.pageYOffset;
		scrOfX = window.pageXOffset;
	} else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
		//DOM compliant
		scrOfY = document.body.scrollTop;
		scrOfX = document.body.scrollLeft;
	} else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
		//IE6 standards compliant mode
		scrOfY = document.documentElement.scrollTop;
		scrOfX = document.documentElement.scrollLeft;
	}
	return [ scrOfX, scrOfY ];
}






function getMilestone() {
	if (window.XMLHttpRequest) { 
		axMilestone = new XMLHttpRequest();
	} else if (window.ActiveXObject) {
		axMilestone = new ActiveXObject("Microsoft.XMLHTTP");
	}
	
	var url = "xml/milestone.xml";
	axMilestone.open("GET", url, true);
	axMilestone.onreadystatechange = parseMilestone;
	axMilestone.send(null);
}

function parseMilestone() {
	if (axMilestone.readyState == 4) {
		if (axMilestone.status == 200) {
			var xmldoc = axMilestone.responseXML;
			var root = xmldoc.getElementsByTagName("list")[0];
			aMilestone = new Array();
			
			for (var i=0; i<root.childNodes.length; i++) {
				var nItem = root.childNodes.item(i);
				var oItem = new Object();
				
				if (nItem.nodeName == "item") {
					oItem.id =  nItem.getAttribute("id");
					oItem.date =  nItem.getAttribute("date");
					oItem.imgpath =  nItem.getAttribute("imgpath");
					
					for (var j=0; j<nItem.childNodes.length; j++) {
						var nItemSub = nItem.childNodes.item(j);
						switch (nItemSub.nodeName) {
							case "title":
								oItem.title =  nItemSub.firstChild.nodeValue;								
								break;
							case "desc":
								oItem.desc =  nItemSub.firstChild.nodeValue;								
								break;
						}
					}
					
					aMilestone.push(oItem);
				}
			}
			bMilestoneReady = true;
		}
	}
}


/*
function defaultPos(){
	var windowWidth, windowHeight;
	if (self.innerHeight) {	 
		windowWidth = self.innerWidth;
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) {  
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) {  
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}
	
//	var dPopupWidth = 1003;
	var dPopupWidth = 500;	
	var dPopupHeight = 649;
	var object = document.getElementById("milestone").style; 
	//object.position = "relative";
	object.position = "absolute";
	object.left = (windowWidth/2 - dPopupWidth/2)+"px"; 
	object.top = (windowHeight/2 - dPopupHeight/2)+"px"; 
}




function resizeContent(iDivBg_width,iDivBg_height){
	var iHeight = getBrowserSize("h");
	var iWidth = getBrowserSize("w");
	var objPreviewBg = document.getElementById("milestone_bg").style; 
	var objPreview = document.getElementById("milestone").style; 
	
	objPreviewBg.width = iWidth;
	objPreviewBg.height = iHeight;
	objPreviewBg.MozOpacity = 0.7;
	objPreviewBg.filter = "alpha(opacity=70)";
	objPreviewBg.display = '';
	
	objPreview.width = iDivBg_width;
	objPreview.height = iDivBg_height;
	objPreview.top = iHeight - ( (iHeight/2) + (iDivBg_height/2) + 50);
	objPreview.left = iWidth - ( (iWidth/2) + (iDivBg_width/2) );
	objPreview.display = '';
}











function getBrowserSize(sProperties){
	 var viewportwidth;
	 var viewportheight;
	 var aPosition = getScrollXY();
	
	
	 // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
	 if (typeof window.innerWidth != 'undefined'){
		  viewportwidth = window.innerWidth;
		  viewportheight = window.innerHeight;
	 } else if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientWidth != 'undefined' && document.documentElement.clientWidth != 0){
		 // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
		   viewportwidth = document.documentElement.clientWidth;
		   viewportheight = document.documentElement.clientHeight;
	 } else{ // older versions of IE
		   viewportwidth = document.getElementsByTagName('body')[0].clientWidth;
		   viewportheight = document.getElementsByTagName('body')[0].clientHeight;
	 }
	
	alert(getScrollHeight());
	
	if(sProperties == "h") return viewportheight+getScrollHeight();
	if(sProperties == "w") return viewportwidth;
}



*/