timeline = {
	init: function(){
		this.top = $('timeline');
		this.top.empty();
		this.yearWidth = 11;
		this.header =  new Element('div', {'class':'header'}).injectInside(this.top);
		this.rH = (timelineData.length*26) +39;
		new Element('div', {'class':'blank'}).injectInside(this.header);
		timelineHeader.each(function(year,i){
			new Element('div', {'html':year, 'styles':{'height':this.rH+'px'}}).injectInside(this.header);
		},timeline);
		
		this.timelineBody =  new Element('div', {'id':'timelineBody'}).injectInside(this.top);
		this.prodRO = new Array();
		this.prodNA = new Array();
		this.prodTL = new Array();
		this.prodIM = new Array();
		this.prodIA = new Array();
		timelineData.each(function(row,i){
			this.prodRO[i] = new Element('div', {'class':'row'}).injectInside(this.timelineBody);
			this.prodNA[i] = new Element('div', {'class':'first', 'html':row[3]}).injectInside(this.prodRO[i]);
			myStart = ((row[4] - 1970)*this.yearWidth)+103;
			myLength = row[5] * this.yearWidth;
			this.prodTL[i] = new Element('div', {'class':'tla', 'styles':{'left':myStart+'px','width':myLength+'px'}}).injectInside(this.prodRO[i]);
			if(row[6]) this.prodTL[i].addClass(row[6]);
			this.prodNA[i].onclick = this.clickProd.pass(i,timeline);
			this.prodNA[i].onmouseover = this.showImage.pass(i,timeline);
			this.prodNA[i].onmouseout = this.hideImage.pass(i,timeline);
		//	this.prodTL[i].onmouseover = this.showImage.pass(i,timeline);
		//	this.prodTL[i].onmouseout = this.hideImage.pass(i,timeline);
			this.prodNA[i].cords = this.prodNA[i].getCoordinates($('timelineBody'));
			
			if(!row[0]){
				this.prodNA[i].setStyle('cursor','default');	
			}
			this.createImage(i);
		},timeline);
		this.lastRow = new Element('div', {'class':'row'}).injectInside(this.timelineBody);
		this.over = 0;
		this.overID = -1;
		
	},
	
	createImage: function(id){
		myTop = this.prodNA[id].cords.top + this.prodNA[id].cords.height;
		if((myTop+400)>this.rH){
			myTop = this.rH-393;
		}
		myLeft = this.prodNA[id].cords.left+this.prodNA[id].cords.width;
		this.prodIM[id] = new Element('div', {'id':'image'+id, 'class':'quickView','styles':{'top':myTop+'px','left':myLeft+'px'}}).injectInside(this.top);
		this.prodIM[id].onmouseover = this.imageOver.pass(id,timeline);
		this.prodIM[id].onmouseout = this.imageOut.pass(id,timeline);
		
		image = imageBase + timelineData[id][1] + imageSize + timelineData[id][2] + imageEnd;
		if(timelineData[id][1]){
			this.prodIA[id] = new Element('img', {'src':image}).injectInside(this.prodIM[id]);
		}else{
			this.prodIA[id] = new Element('p', {'html':'<img src="/siteflow/jpeg/no_image.jpg" alt="There is no image for this product">'}).injectInside(this.prodIM[id]);
		}
		if(!timelineData[id][0]){
			this.prodIM[id].setStyle('cursor','default');	
		}
		this.prodIA[id].onclick = this.clickProd.pass(id,timeline);
		this.prodIM[id].onclick = this.clickProd.pass(id,timeline);
	},
	
	showImage: function(i){
		if(this.overID>-1){
			this.hideImageNow();
		}
		this.overID = i;
		this.over = 1;
		this.prodIM[i].setStyle('display','block');
	},
	
	hideImage: function(i){
		this.hideImageDelay.delay(500,timeline,i);
		this.over = 0;
	},
	
	hideImageDelay: function(i){
		if(!this.over){
			this.prodIM[i].setStyle('display','none');
		}
	},
	
	hideImageNow: function(i){
		this.prodIM[this.overID].setStyle('display','none');
	},
	
	imageOver: function(i){
		this.over=1;
	},
	
	imageOut: function(i){
		this.hideImage(i);
	},
	
	clickProd: function(i){
		if(timelineData[i][0]){
			mylocation = linkBase + timelineData[i][0] + linkEnd;
			location = mylocation;
		}
	}
	
};


timelineHeader = new Array("1970","1975","1980","1985","1990","1995","2000","2005","2010","2015");

linkBase = "/cms/products/";
linkEnd = "/index.html";
imageBase = "/cms/resource_library/images/";
imageSize = "/med/";
imageEnd = ".jpg";


// id of html page, id of image, image name, product name, product first year, # of product years
timelineData = new Array(
	new Array("","19e99604215a4648","bh200","BH200","1972","8","legacy"),
	new Array("","d0c406516fd8b42b","bh200_6","BH200-6","1980","3","legacy"),
	new Array("","7f0e7baec45a676e","bh2000","BH2000","1982","18","legacy"),
	new Array("","3c8b6122a1e214cc","bh2300","BH2300","1986","13","legacy"),
	new Array("","911a96a17b19634a","bh2500u","BH2500U","1993","4","legacy"),
	new Array("","cf7701ca80eeb431","bh2600","BH2600","1998","6","legacy"),
	new Array("","7fd624f91ed35b32","bh2600u","BH2600U","1999","6","legacy"),
	new Array("","","","BH2900","1991","3","legacy"),
	new Array("","97049d517db93712","bh212","BH212","1975","16","legacy"),
	new Array("","4d5f84a832df77a9","bh3000","BH3000","1991","19","current"),
	new Array("","545b269fe08eefb7","bh7000","BH7000","1988","12","legacy"),
	new Array("489ccdb00734247c","b31884aa1cc9af5c","bh8000_labeler","BH8000S","1991","19","current"),
	new Array("","","","BH8000","1994","9","legacy"),
	new Array("3507be66d847f672","dc5a63c6eb07dbfb","bh8000u","BH8000U","1994","16","current"),
	new Array("","","","BH8000G","1995","5","legacy"),
	new Array("a3d34f9da3685d04","5c2045e69dd7072b","bh1600","BH1600","1996","14","current"),
	new Array("","15ae07468b04e7bd","marathon_sl_picture","Marathon SL","2002","7","legacy"),
	new Array("","1a9db402d737aa44","marathon_xl","Marathon XL","2003","6","legacy"),
	new Array("","51e120bba5cbb100","image_0723","Marathon XLU","2004","5","legacy"),
	new Array("db0daffd66cc8862","37cba96e022de854","marathon_sla","Marathon SLA","2007","3","current"),
	new Array("5f7e96b21f21e6b3","1256b4f33f47d029","image_0827","Marathon XLA","2007","3","current"),
	new Array("4405a0976e931ac0","3a0ec6ca51c6f34d","marathon_xlua","Marathon XLUA","2007","3","current"),
	new Array("63c7c771e91c1847","50773ee28e2daa7d","bh700","BH700","1991","19","current"),
	new Array("ffe5037046c2a900","e53790c2e5452031","endura_system","Endura Sleeve System","2006","4","current"),
	new Array("ecdd96c846bf661b","8a9bb15f8fabd165","endura_slt","Endura SLT","2006","4","current")
);

window.addEvent('domready', function(){
	timeline.init();
});