function goToByScroll(obejct){
	var id = obejct.innerHTML;
	$j('.horizontalTimelineContent').animate({scrollLeft: $j(".horizontalTimelineContent").scrollLeft()+Math.floor($j(".content"+id).offset().left)-170});
	$j('.horizontalTimeline').animate({scrollLeft: $j(".horizontalTimeline").scrollLeft()+Math.floor($j("."+id).offset().left)-616});
}

function timelineLayout() {
	var startYear = 0;
	var endYear = 0;
	var maxHeight = $j('.timeline').css('height');
	var maxWidth = $j('.timeline').css('w');
	var scrollFactor = 1;
	var history = new Element('div');
	var timeline = new Element('ul') ;

	
	if($j('.timeline')) {
		var listContaner = new Object();
		$j('.timeline ul li').each(function() {
			month = $j(this).attr('class').substring(0,2);
			year = $j(this).attr('class').substring(2,6);

			divTmpContaner = new Array();
			$j(this).children('div').each(function() {
				//			$j(this).css('display', 'none');
				$j(this).addClass(month+year);
				divTmpContaner.push(this);
			});

			listContaner[year+month] = divTmpContaner;

			startYear = (startYear==0)?year:Math.min(startYear, year);
			endYear = (endYear==0)?year:Math.max(endYear, year);
		});
		$j('.timeline').empty();
		
		var monthString = new Array('Jan.', 'Feb.', 'Mar.', 'Apr.', 'May', 'June',
			'July', 'Aug.', 'Sept.', 'Oct.', 'Nov.', 'Dec.');
	}

	if($j('.hTimeline')) {
		/* *** Years *** */
		if(startYear && endYear) {
			yearTabs = new Element('div');
			$j(yearTabs).attr('id', 'tab_buttons');
			list = new Element('ul');
			$j(list).addClass("button");

			for(var year = startYear; year <= endYear; year++) {
				listElement = new Element('li');
				link = new Element('a');
				$j(link).addClass("button green_button");
				link.innerHTML = year;
				$j(link).attr("href", "javascript:void(0)");
				$j(link).click(function() {goToByScroll(this);});
				$j(listElement).append(link);
				$j(list).append(listElement);
			}
			$j(yearTabs).append(list);
			$j('.timeline').append(yearTabs);
			$j('.timeline').append(new Element('hr'));
		}

		/* *** Timeline Content *** */
		var timelineContent = new Element('ul') ;
		var className = "";
		var div;

		var monthWidth = 239; /* 139px; */
		var yearWidth = 24;
		var heightBottomOffset = 5; /* 45 */

		$j(history).addClass('horizontalTimelineContent');
		for(var year = startYear; year <= endYear; year++) {
			for(var month = 1; month <= 12; month++) {
				if(month % 2) {
					className = "odd";
				} else {
					className  ="even";
				}
				if(month==1) {
					listElement = new Element('li');
					div = new Element('div');
					var rDiv =  new Element('div');

					$j(div).addClass('window blue');
					$j(rDiv).addClass('rotateLeft content'+year);


//					anchorElement = new Element('a');
//					$j(anchorElement).append(implode('<br />', String(year).split("")));
//					$j(anchorElement).attr("name", year);
//					$j(rDiv).append(anchorElement);

					rDiv.innerHTML = implode('<br />', String(year).split(""));
					$j(div).append(rDiv);

					$j(listElement).append(div);
					$j(listElement).addClass('year');
					$j(listElement).append(listContaner[year+dezInt(month,2)]);
					$j(timelineContent).append(listElement);
				}

				listElement = new Element('li');

				if(!listContaner[year+dezInt(month,2)]){
					div = new Element('div');
					$j(div).append(monthString[month-1]);
					$j(div).addClass('month');
					$j(listElement).append(div);
				}
				
				$j(listElement).addClass(dezInt(month,2)+year);
				$j(listElement).append(listContaner[year+dezInt(month,2)]);

				if(!listContaner[year+dezInt(month,2)]){
					$j(listElement).addClass('empty');
					div = new Element('div');
					div.innerHTML = '&nbsp;'
					$j(listElement).append(div);

				} else {
					$j(listElement).addClass('hightlight');
				}
				$j(listElement).addClass(className);
				$j(timelineContent).append(listElement);
			}
		}
		$j(history).append(timelineContent);

		/* *** Timeline *** */
		for(var year = startYear; year <= endYear; year++) {
			for(var month = 1; month <= 12; month++) {
				if(month==1) {
					listElement = new Element('li');
					divElement = new Element('div');
					$j(listElement).addClass('year');
					$j(divElement).addClass('window blue '+year);

					$j(divElement).append(implode('<br />', String(year).split("")));

					$j(listElement).append(divElement);
					$j(timeline).append(listElement);
				}

				if(month % 2) {
					className = "odd";
				} else {
					className  ="even";
				}

				listElement = new Element('li');
				divElement = new Element('div');
				$j(listElement).addClass(dezInt(month,2)+year);
				$j(listElement).append(divElement);
				if(!listContaner[year+dezInt(month,2)]){
					$j(listElement).addClass('empty').addClass(className);
				} else {
					$j(listElement).addClass('hightlight').addClass(className);
				}
				$j(timeline).append(listElement);
			}
		}
		var scrollContaner = new Element('div');
		maxWidth = timelineWidth = ((endYear-startYear+1) * 12 * 7)+((endYear-startYear+1)*16);
		$j(timeline).css('width', maxWidth);

		$j(scrollContaner).addClass('horizontalTimeline');
		$j(scrollContaner).append(timeline);
		$j('.timeline').append(scrollContaner);

		var scrollMargin = ($j('.horizontalTimeline').width()/2)-21;
		$j('.horizontalTimeline ul').css('margin', '0 '+scrollMargin+'px');
		$j('.horizontalTimeline ul').css('width', ($j('.horizontalTimeline ul').width()+scrollMargin-10)+'px');


		div = new Element('div');
		$j(div).addClass('area');
		$j(div).css('marginLeft', scrollMargin+'px');
		
		$j('.timeline').append(div);
		$j('.timeline').append(history);
		$j('.timeline a.fancybox').prepend('<span></span>');


		maxHeight = 0;
		maxWidth = timelineContentWidth = ((endYear-startYear+1) * 12 * (monthWidth+11))+((endYear-startYear+1)*30-(((endYear-startYear)/3)));
		$j(timelineContent).css('width', maxWidth);

		$j('.horizontalTimelineContent ul li').each(function() {
			maxHeight = Math.max(maxHeight, parseInt($j(this).height()));
		});
		$j('.horizontalTimelineContent ul li.year div.window').each(function() {
			$j(this).css('height', (maxHeight + heightBottomOffset + 10) + 'px'); /* 55 */
		});
		$j('.horizontalTimelineContent ul li').each(function() {
			$j(this).css('height', (maxHeight + heightBottomOffset) + 'px'); /* 45 */
		});
		$j('.horizontalTimelineContent ul li.year div.rotateLeft').each(function() {
			$j(this).css('padding-top', (((maxHeight + heightBottomOffset + 10) - $j(this).height())/2) + 'px'); /* 55 */
		});
		//$j('.timeline').css('height', (maxHeight + 60) + 'px');

		$j('.horizontalTimelineContent ul li.even div.window').each(function() {
			$j(this).removeClass('white');
			$j(this).addClass('lightblue');
		});

		/* *** scrollFactor *** */
//		scrollFactor = (history.scrollWidth-history.offsetWidth)/(scrollContaner.scrollWidth-scrollContaner.offsetWidth);
		scrollFactor = timelineContentWidth/timelineWidth;

		/* *** Mouse control *** */
		$j('.horizontalTimeline').mousedown(function (event) {
			$j(this)
			.data('down', true)
			.data('x', event.clientX)
			.data('scrollLeft', this.scrollLeft);
			return false;
		}).mouseup(function (event) {
			$j(this).data('down', false);
		}).mousemove(function (event) {
			if ($j(this).data('down') == true) {
				pos = this.scrollLeft = $j(this).data('scrollLeft') + $j(this).data('x') - event.clientX;
				$j(this).next().next()[0].scrollLeft = pos * scrollFactor;
			}
		}).mousewheel(function (event, delta) {
			pos = this.scrollLeft -= (delta * 30);
			$j(this).next().next()[0].scrollLeft = pos * scrollFactor;
		})

		$j('.horizontalTimelineContent').mousedown(function (event) {
			$j(this)
			.data('down', true)
			.data('x', event.clientX)
			.data('scrollLeft', this.scrollLeft);
			return false;
		}).mouseup(function (event) {
			$j(this).data('down', false);
		}).mousemove(function (event) {
			if ($j(this).data('down') == true) {
				pos = this.scrollLeft = $j(this).data('scrollLeft') + $j(this).data('x') - event.clientX;

				if($j(this).prev().prev()[0]) {
					$j(this).prev().prev()[0].scrollLeft = pos * (1/scrollFactor);
				}
			}
		}).mousewheel(function (event, delta) {
			pos = this.scrollLeft -= (delta * 500);
			if($j(this).prev().prev()[0]) {
				$j(this).prev().prev()[0].scrollLeft = pos * (1/scrollFactor);
			}
		})

		$j(window).mouseout(function (event) {
			if ($j('.horizontalTimelineContent').data('down')) {
				try {
					if (event.originalTarget.nodeName == 'BODY' || event.originalTarget.nodeName == 'HTML') {
						$j('.horizontalTimelineContent').data('down', false);
					}
				} catch (e) {}
			}
			if ($j('.horizontalTimelineContent').data('down')) {
				try {
					if (event.originalTarget.nodeName == 'BODY' || event.originalTarget.nodeName == 'HTML') {
						$j('.horizontalTimelineContent').data('down', false);
					}
				} catch (e) {}
			}
		});

	} else if($j('.vTimeline')) {
		/* *** Timeline *** */
		for(var year = startYear; year <= endYear; year++) {
			for(var month = 1; month <= 12; month++) {
				if(month==1) {
					listElement = new Element('li');
					divElement = new Element('div');
					$j(listElement).addClass('year');
					$j(divElement).addClass('window lightblue');
					$j(divElement).append(year);
					$j(listElement).append(divElement);
					$j(timeline).append(listElement);
				}

				listElement = new Element('li');
				divElement = new Element('div');
				$j(listElement).addClass(dezInt(month,2)+year);
				$j(listElement).append(divElement);
				if(!listContaner[year+dezInt(month,2)]){
					$j(listElement).addClass('empty');
				} else {
					$j(listElement).addClass('hightlight');
				}
				$j(timeline).append(listElement);
			}
		}
		var scrollContaner = new Element('div');
		$j(scrollContaner).css('height', maxHeight);

		$j(scrollContaner).addClass('verticalTimeline');
		$j(scrollContaner).append(timeline);
		$j('.timeline').append(scrollContaner);


		/* *** Timeline Content *** */
		$j(history).css('height', maxHeight);

		$j(history).addClass('verticalTimelineContent');
		for(var index in listContaner) {
			$j(history).append(listContaner[index]);
		}
		$j('.timeline').append(history);

		/* *** scrollFactor *** */
		scrollFactor = (history.scrollHeight-history.offsetHeight)/(scrollContaner.scrollHeight-scrollContaner.offsetHeight+((endYear-startYear)*10));

		/* *** Mouse control *** */
		$j('.verticalTimeline').mousedown(function (event) {
			$j(this)
			.data('down', true)
			.data('y', event.clientY)
			.data('scrollTop', this.scrollTop);
			return false;
		}).mouseup(function (event) {
			$j(this).data('down', false);
		}).mousemove(function (event) {
			if ($j(this).data('down') == true) {
				pos = this.scrollTop = $j(this).data('scrollTop') + $j(this).data('y') - event.clientY;
				$j(this).next()[0].scrollTop = pos * scrollFactor;
			}
		}).mousewheel(function (event, delta) {
			pos = this.scrollTop -= (delta * 30);
			$j(this).next()[0].scrollTop = pos * scrollFactor;
		})

		$j('.verticalTimelineContent').mousedown(function (event) {
			$j(this)
			.data('down', true)
			.data('y', event.clientY)
			.data('scrollTop', this.scrollTop);
			return false;
		}).mouseup(function (event) {
			$j(this).data('down', false);
		}).mousemove(function (event) {
			if ($j(this).data('down') == true) {
				pos = this.scrollTop = $j(this).data('scrollTop') + $j(this).data('y') - event.clientY;
				$j(this).prev()[0].scrollTop = pos * (1/scrollFactor);
			}
		}).mousewheel(function (event, delta) {
			pos = this.scrollTop -= (delta * 30);
			$j(this).prev()[0].scrollTop = pos * (1/scrollFactor);
		})

		$j(window).mouseout(function (event) {
			if ($j('.verticalTimelineContent').data('down')) {
				try {
					if (event.originalTarget.nodeName == 'BODY' || event.originalTarget.nodeName == 'HTML') {
						$j('.verticalTimelineContent').data('down', false);
					}
				} catch (e) {}
			}
			if ($j('.verticalTimelineContent').data('down')) {
				try {
					if (event.originalTarget.nodeName == 'BODY' || event.originalTarget.nodeName == 'HTML') {
						$j('.verticalTimelineContent').data('down', false);
					}
				} catch (e) {}
			}
		});
	}
	return false;
}

