
var Timeline = {
	
	oTimeline: null,
	oTimelineLabels: null,
	oMoonRing: null,
	oTableWrapper: null,
	oTableInside: null,
	oTable: null,
	
	iStep: 40,
	iDelta: 0.22,
	
	iCurrentPosition: 1,
	iTimer: 0,
	
	iFromPos: 0,
	iToPos: 0,

	iTableTdWidth: 0,
	iTableTdCount: 0,
	iTableHeight: 0,
	
	iFromPosTable: 0,
	iToPosTable: 0,
	
	listenKeys: function(oEvent)
	{
		var oEvent = getEvent(oEvent);
		var iKeyCode = getEventKeyCode(oEvent);
		
		if (oEvent.ctrlKey && (iKeyCode == 39 || iKeyCode == 37)) {
			stopEvent(oEvent); //зачем у opera preventdefault, если она его игнорирует... http://www.quirksmode.org/dom/events/keys.html
		} else {
			return;
		}

		var bRightPressed = false;
		var bLeftPressed = false;

		if (iKeyCode == 39) {
			bRightPressed = true;	
		} else if (iKeyCode == 37) {
			bLeftPressed = true;
		}
		
		var iActivePos = parseInt(Timeline.iCurrentPosition);
		if (bLeftPressed && !bRightPressed && iActivePos != 1) {
			var sPrevId = $$('prev-label').getElementsByTagName('p')[0].getElementsByTagName('span')[0].id;
			sPrevId = sPrevId.replace(/c/, 'y');
			if ($$(sPrevId)) {
				if (document.createEvent) {
					 var oTempEvent = document.createEvent('MouseEvents');
					 oTempEvent.initMouseEvent('click', true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
					 $$(sPrevId).dispatchEvent(oTempEvent);
				} else {
					var oTempEvent = document.createEventObject();
					$$(sPrevId).fireEvent('onclick', oTempEvent);
				}
			}
		}
		if (bRightPressed && !bLeftPressed && iActivePos != Timeline.iTableTdCount) {
			var sNextId = $$('next-label').getElementsByTagName('p')[0].getElementsByTagName('span')[0].id;
			sNextId = sNextId.replace(/c/, 'y');
			if ($$(sNextId)) {
				if (document.createEvent) {
					 var oTempEvent = document.createEvent('MouseEvents');
					 oTempEvent.initMouseEvent('click', true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
					 $$(sNextId).dispatchEvent(oTempEvent);
				} else {
					var oTempEvent = document.createEventObject();
					$$(sNextId).fireEvent('onclick', oTempEvent);
				}
			}
		}
	},
	
	changeAddNavigation: function()
	{
		var iActivePos = parseInt(Timeline.iCurrentPosition);

		var iPrev = (iActivePos - 1);
		var oPrev = $$('prev-label').getElementsByTagName('p')[0].getElementsByTagName('span')[0];
		if (iActivePos == 1) {
			$$('prev-label').className = '';
			$$('prev-label').getElementsByTagName('div')[0].innerHTML = '&#160;';
			oPrev.setAttribute('id', 'c' + iActivePos);
			removeEvent($$('c' + iActivePos), 'click', Timeline.pseudoShow);
		} else {
			var sPrevTitle = $$('y' + iPrev).getAttribute('title');
			$$('prev-label').getElementsByTagName('div')[0].innerHTML = sPrevTitle;
			$$('prev-label').className = 'selected';
			oPrev.setAttribute('id', 'c' + iPrev);
			addEvent(oPrev, 'click', Timeline.pseudoShow);
		}

		var iNext = (iActivePos + 1);
		var oNext = $$('next-label').getElementsByTagName('p')[0].getElementsByTagName('span')[0];
		if (iActivePos == Timeline.iTableTdCount) {
			$$('next-label').className = '';
			$$('next-label').getElementsByTagName('div')[0].innerHTML = '&#160;';
			oNext.setAttribute('id', 'c' + iActivePos);
			removeEvent($$('c' + iActivePos), 'click', Timeline.pseudoShow);
		} else {
			var sNextTitle = $$('y' + iNext).getAttribute('title');
			$$('next-label').getElementsByTagName('div')[0].innerHTML = sNextTitle;
			$$('next-label').className = 'selected';
			oNext.setAttribute('id', 'c' + iNext);
			addEvent(oNext, 'click', Timeline.pseudoShow);
		}
	},
	
	pseudoShow: function(oEvent)
	{
		var oEvent = getEvent(oEvent);
		stopEvent(oEvent);
		
		var oFromElement = getEventElement(oEvent);
		var oToElement = $$('y' + oFromElement.id.replace(/[^\d]+/g, ''));

		var sEventType = oEvent.type;

		if (document.createEvent) {
			 var oTempEvent = document.createEvent('MouseEvents');
			 oTempEvent.initMouseEvent(sEventType, true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
			 oToElement.dispatchEvent(oTempEvent);
		} else {
			var oTempEvent = document.createEventObject();
			oToElement.fireEvent('on' + sEventType, oTempEvent);
		}
	},

	init: function()
	{
		if (!!(window.opera && opera.buildNumber)) {
			$$('ctrl-label').innerHTML += '&#160;+ Shift'; //предложим нажимать shift, иначе загуляет по истории
		}
		
		if ($$('timeline-russia')) {
			Timeline.iStep = 80;		
		}
		
		Timeline.oTimeline = $$('timeline');
		Timeline.oMoonRing = $$('moon-ring');
		Timeline.oTableWrapper = $$('timeline-data-wrap');
		Timeline.oTableInside = $$('timeline-data-inside');
		Timeline.oTable = $$('timeline-data');
		
		var aTimelineLabels = Timeline.oTimeline.getElementsByTagName('span');
		Timeline.iTableTdCount = aTimelineLabels.length;

		for (var i = 1; i < Timeline.iTableTdCount; i++) { //игнорируем первый элемент 
			var oLabel = aTimelineLabels[i];
			addEvent(oLabel, 'click', Timeline.show);
			if ($$('c' + i)) {
				addEvent($$('c' + i), 'click', Timeline.pseudoShow); //дополнительная навигация
			}
		}

		Timeline.iTableTdWidth = Timeline.oTableWrapper.offsetWidth;
		Timeline.oTable.style.width = (Timeline.iTableTdWidth * Timeline.iTableTdCount) + 'px';

		var aTd = Timeline.oTable.getElementsByTagName('td');
		for (var i = 0; i < aTd.length; i++) {
			if (aTd[i].parentNode.parentNode.parentNode == Timeline.oTable) {
				aTd[i].style.width = Timeline.iTableTdWidth + 'px';
			}
		}

		Timeline.iTableHeight = Timeline.oTable.offsetHeight;

		Timeline.oTableWrapper.style.height = Timeline.iTableHeight + 'px';
		Timeline.oTableInside.style.height = Timeline.iTableHeight + 'px';

		Timeline.oTable.style.visibility = 'visible';
	},

	show: function(oEvent)
	{
		var oEvent = oEvent || window.event;
		var oLabel = oEvent.srcElement || oEvent.target;
		var iId = oLabel.id.replace(/[^\d]+/g, '');
		var iWTFDelta = Math.ceil((iId - 1) / 4);

		Timeline.iToPos = (Timeline.iFromPos + ((iId - 1) * Timeline.iStep) + iWTFDelta);
		Timeline.iToPosTable = ((iId - 1) * Timeline.iTableTdWidth);

		Timeline.prepare();

		$$('y' + Timeline.iCurrentPosition).className = '';
		addEvent($$('y' + Timeline.iCurrentPosition), 'click', Timeline.show);

		oLabel.className = 'nopl';
		removeEvent(oLabel, 'click', Timeline.show);
		
		if ($$('timeline-world') && Timeline.iCurrentPosition == 18) { //если уезжаем из №18
			Timeline.changeMoon(false);	
		}

		Timeline.iCurrentPosition = iId;
	},

	prepare: function()
	{
		Timeline.stop();
		Timeline.iTimer = setInterval(Timeline.play, 10);
	},
	
	stop: function()
	{
		if (Timeline.iTimer) {
			clearTimeout(Timeline.iTimer);
		}
		Timeline.iTimer = 0;
	},
	
	changeMoon: function(bLookFromNorth)
	{
		if (bLookFromNorth) { //большая луна
			Timeline.oMoonRing.className = 'moon-like-scandinavian';
		} else {
			Timeline.oMoonRing.className = 'moon-like-european';	
		}
	},
	
	play: function()
	{
		var iCurPos = Math.round(Timeline.oMoonRing.style.left.replace(/px/, ''));
		var iCurPosTable = Math.round(Timeline.oTable.style.left.replace(/[-px]+/g, ''));

		var bGoLeft = Timeline.iToPos > iCurPos ? false : true;
		
		var iStep = Math.abs(Timeline.iToPos - iCurPos) * Timeline.iDelta;
		var iStepTable = Math.abs(Timeline.iToPosTable - iCurPosTable) * Timeline.iDelta;

		iStep = iStep < 1 ? 1 : iStep;
		iStepTable = iStepTable < 1 ? 1 : iStepTable;

		var oMoonRingLeft = Timeline.iToPos;
		var oTableLeft = Timeline.iToPosTable;

		if ((Timeline.iToPosTable > iCurPosTable + iStepTable) && !bGoLeft) { //считаем по таблице
			oMoonRingLeft = (iCurPos + iStep);
			oTableLeft = (iCurPosTable + iStepTable);
		} else if ((Timeline.iToPosTable < iCurPosTable - iStepTable) && bGoLeft) {
			oMoonRingLeft = (iCurPos - iStep);
			oTableLeft = (iCurPosTable - iStepTable);
		} else {
			Timeline.stop();
			Timeline.changeAddNavigation();
			if ($$('timeline-world') && Timeline.iCurrentPosition == 18) { //если приехали в №18
				Timeline.changeMoon(true);	
			}
		}
		
		Timeline.oMoonRing.style.left = oMoonRingLeft + 'px';
		Timeline.oTable.style.left = (oTableLeft * -1) + 'px';
	}
	
}

addEvent(window, 'load', Timeline.init);
addEvent(document, 'keydown', Timeline.listenKeys); //нужен именно document