/*
 * ebazaar.js
 * 
 * @author: Alexander Myadzel <aem@teletype.ru>
 * @modified: 04/09/2009 22:44
 *
 */

var Ebazaar = {

	/*IMPORTANT: don't change init values, or synchronize with HTML*/
	
	/*stitch id*/
	iCurrentId: 5,

	iCurrentA: 22,
	iCurrentB: 2,
	iCurrentC: 2,
	
	bFormFilled: false,
	aRequiredFields: [],

	aDiares: [
		{id: 1, title: 'Report', name: 'report', trans: 'Рипорт', parts: 2},
		{id: 2, title: 'Empire', name: 'empire', trans: 'Эмпайр', parts: 2},
		{id: 3, title: 'Orion', name: 'orion', trans: 'Орион', parts: 2},
		{id: 4, title: 'Flag', name: 'flag', trans: 'Флаг', parts: 3},
		{id: 5, title: 'Eclipse', name: 'eclipse', trans: 'Эклипс', parts: 2},		
		{id: 6, title: 'Ret X', name: 'ret-x', trans: 'Рэт Икс', parts: 2},
		{id: 7, title: 'Cross', name: 'cross', trans: 'Крос', parts: 2},
		{id: 8, title: 'Flash', name: 'flash', trans: 'Флэш', parts: 2},
		{id: 9, title: 'Link', name: 'link', trans: 'Линк', parts: 2},	
		{id: 10, title: 'Tibet-1', name: 'tibet-1', trans: 'Тибет-1', parts: 2},	
		{id: 11, title: 'Tibet-2', name: 'tibet-2', trans: 'Тибет-2', parts: 2},	
		{id: 12, title: 'Dol-Y', name: 'dol-y', trans: 'Дол-Уай', parts: 2}			
	],

	aColors: [
		{id: 1, title: 'Бежевый'},
		{id: 2, title: 'Белый'},
		{id: 3, title: 'Бургунди'},
		{id: 4, title: 'Желтый'},
		{id: 5, title: 'Зеленый'},
		{id: 6, title: 'Каштановый'},
		{id: 7, title: 'Коралловый'},
		{id: 8, title: 'Коричневый'},
		{id: 9, title: 'Красный'},
		{id: 10, title: 'Лаванда'},
		{id: 11, title: 'Оранжевый'},
		{id: 12, title: 'Светло-зеленый'},
		{id: 13, title: 'Светло-коричневый'},
		{id: 14, title: 'Светло-синий'},
		{id: 15, title: 'Серебряный'},
		{id: 16, title: 'Серый'},
		{id: 17, title: 'Синий'},
		{id: 18, title: 'Темно-зеленый'},
		{id: 19, title: 'Темно-коричневый'},
		{id: 20, title: 'Темно-серый'},
		{id: 21, title: 'Темно-синий'},
		{id: 21, title: 'Черный'}
	],

	init: function()
	{
		/*add events to stitches preview*/
		for (var i = 0, j = 1; i < Ebazaar.aDiares.length; i++, j++) {
			if (Ebazaar.iCurrentId != j) { /*skip current preview*/
				addEvent($$('n' + j), 'click', Ebazaar.changeByClick);
			}	
		}

		/*init required filled elements events*/
		Ebazaar.initFormEvents();
		
		/*set events for color selector*/
		var aDivColors = $$('colors').getElementsByTagName('div');
		for (var i = 0; i < aDivColors.length; i++) {
			var oElement = aDivColors[i];
			var iRowId = oElement.parentNode.className.replace(/[\D]+/g, '');
			
			oElement.title = (Ebazaar.aColors[iRowId - 1]).title;
			addEvent(oElement, 'click', Ebazaar.colorizeABC);
		}

		addEvent($$('v2'), 'click', Ebazaar.setV2);
		
		addEvent($$('ctrl-left'), 'click', Ebazaar.prevGo);
		addEvent($$('ctrl-right'), 'click', Ebazaar.nextGo);
		
		addEvent(document, 'keydown', Ebazaar.listenKeys);
		
		Ebazaar.fixOperaCtrl();
		
		$$('rand-chooser').className = 'visible';
		addEvent($$('rand-chooser'), 'click', Ebazaar.randomChoice);
		
		Ebazaar.proceedSendOk();
		
		$$('dl-link').className = '';
		$$('top-dl-link').className = '';
	},
	
	prevGo: function()
	{
		var iId = $$('ctrl-left').className.replace(/ct/, '');
		Ebazaar.changeById('n' + iId);
	},
	
	nextGo: function()
	{
		var iId = $$('ctrl-right').className.replace(/ct/, '');
		Ebazaar.changeById('n' + iId);
	},
	
	listenKeys: function(oEvent)
	{
		var oEvent = getEvent(oEvent);
		var iKeyCode = getEventKeyCode(oEvent);

		if (oEvent.ctrlKey && (iKeyCode == 39 || iKeyCode == 37)) {
			stopEvent(oEvent); 
		} else {
			return true;
		}

		var bRightPressed = false;
		var bLeftPressed = false;

		if (iKeyCode == 39) {
			bRightPressed = true;	
		} else if (iKeyCode == 37) {
			bLeftPressed = true;
		}

		if (bLeftPressed && !bRightPressed) {
			Ebazaar.prevGo();
			return;
		}
		if (bRightPressed && !bLeftPressed) {
			Ebazaar.nextGo();
			return;
		}
	},
	
	fixOperaCtrl: function()
	{
		if (window.opera && typeof opera.version == 'function') {
			$$('ctrl-opera').style.display = 'inline-block';
		} 
	},
	
	proceedSendOk: function()
	{	
		if ($$('send-ok-row')) {
			addEvent($$('send-ok'), 'click', Ebazaar.hideSendOk);
			setTimeout(Ebazaar.hideSendOk,(1000 * 10));
		}
	},
	
	hideSendOk: function()
	{
		$$('send-ok').className = 'none';
	},
	
	randomChoice: function()
	{
		Ebazaar.setNewColor('a', Ebazaar.iCurrentA, (Math.floor(Math.random() * 22) + 1));
		Ebazaar.setNewColor('b', Ebazaar.iCurrentB, (Math.floor(Math.random() * 22) + 1));
		Ebazaar.setNewColor('c', Ebazaar.iCurrentC, (Math.floor(Math.random() * 22) + 1));

		Ebazaar.changeById('n' + (Math.floor(Math.random() * Ebazaar.aDiares.length) + 1));
		
		Ebazaar.changeFormValues();
	},
	
	changeStitches: function()
	{
		$sBGName = Ebazaar.aDiares[(Ebazaar.iCurrentId - 1)].name;
		$$('stitch').style.background = "url('i/diary/stitches/" + $sBGName + ".png') left top no-repeat";
		$$('stitch').style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/diary/stitches/" + $sBGName + ".png', sizingMethod='crop')";

		var oDIVs = $$('colorer').getElementsByTagName('div');
		
		oDIVs[0].style.background = "url('i/diary/colors/" + $sBGName + "-a-" + Ebazaar.iCurrentA + ".png') left top no-repeat";
		oDIVs[0].style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/diary/colors/" + $sBGName + "-a-" + Ebazaar.iCurrentA + ".png', sizingMethod='crop')";

		oDIVs[1].style.background = "url('i/diary/colors/" + $sBGName + "-b-" + Ebazaar.iCurrentB + ".png') left top no-repeat";
		oDIVs[1].style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/diary/colors/" + $sBGName + "-b-" + Ebazaar.iCurrentB + ".png', sizingMethod='crop')";
		
		/*clear third div by default*/
		oDIVs[2].style.background = '';
		oDIVs[2].style.filter = '';
		if (Ebazaar.aDiares[(Ebazaar.iCurrentId - 1)].parts == 3) {/*apply color to third div if need*/
			oDIVs[2].style.background = "url('i/diary/colors/" + $sBGName + "-c-" + Ebazaar.iCurrentC + ".png') left top no-repeat";
			oDIVs[2].style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/diary/colors/" + $sBGName + "-c-" + Ebazaar.iCurrentC + ".png', sizingMethod='crop')";
		}
		
		Ebazaar.changeFormValues($sBGName);
	},
	
	changeFormValues: function()
	{
		/*change color chooser for form*/
		var sColorsChoose = 'A' + Ebazaar.iCurrentA + '-B' + Ebazaar.iCurrentB;
		if (Ebazaar.aDiares[(Ebazaar.iCurrentId - 1)].parts == 3) {
			sColorsChoose += '-C' + Ebazaar.iCurrentC;
		}
		$$('pc').innerHTML = sColorsChoose;
		
		/*hidden fields*/
		$$('qf-individual').value = $$('pst').className == 'block' ? '0' : '1';
		$$('qf-stitch').value = Ebazaar.aDiares[(Ebazaar.iCurrentId - 1)].title;
		$$('qf-color').value = sColorsChoose;
		
		
		var sLinkDiary = Ebazaar.aDiares[(Ebazaar.iCurrentId - 1)].title;
		sLinkDiary = sLinkDiary.toLowerCase(); 
		
		var sLinkColors = sColorsChoose.toLowerCase();
		sLinkColors = sLinkColors.replace(/-/g, '_');
		sLinkColors = sLinkColors.replace(/([a-z]+)/g, '$1-');

		var sLink = '/result/' + sLinkDiary + '_' + sLinkColors + '.jpg'
		
		$$('dl-link').href = sLink;
		$$('top-dl-link').href = sLink;
		
		$$('form-dl-link').value = sLink;
	},
	
	change: function(oElement)
	{
		/*save previous stetch preview element*/
		var oPreviousStetchPreview = $$('n' + Ebazaar.iCurrentId);

		addEvent(oPreviousStetchPreview, 'click', Ebazaar.changeByClick);
		oPreviousStetchPreview.className = 'pics';
		oPreviousStetchPreview.childNodes[0].childNodes[0].className = null;
		
		/*set new stetch id*/
		Ebazaar.iCurrentId = Math.abs(oElement.id.replace(/n/, ''));

		$$('colors').className = (Ebazaar.aDiares[(Ebazaar.iCurrentId - 1)].parts == 3) ? 'abc-colors' : 'ab-colors';

		Ebazaar.changeStitches();

		/*update titles*/
		$$('selected-title').innerHTML = $$('pt').innerHTML = Ebazaar.aDiares[(Ebazaar.iCurrentId - 1)].title;
		$$('selected-trans').innerHTML = '(' + Ebazaar.aDiares[(Ebazaar.iCurrentId - 1)].trans + ')';
		
		var iPrevId = (Ebazaar.iCurrentId - 1) < 1 ? Ebazaar.aDiares.length : (Ebazaar.iCurrentId - 1);
		$$('ctrl-left').innerHTML = Ebazaar.aDiares[iPrevId - 1].title;
		$$('ctrl-left').className = 'ct' + iPrevId;
		
		var iNextId = (Ebazaar.iCurrentId + 1) > Ebazaar.aDiares.length ? 1 : (Ebazaar.iCurrentId + 1);
		$$('ctrl-right').innerHTML = Ebazaar.aDiares[iNextId - 1].title;
		$$('ctrl-right').className = 'ct' + iNextId;
		
		/*clear previous stetch preview element*/
		removeEvent(oElement, 'click', Ebazaar.changeByClick);
		oElement.className = 'text';
		oElement.childNodes[0].childNodes[0].className = 'green';
	},
	
	changeById: function(sId)
	{
		Ebazaar.change($$(sId));
	},

	changeByClick: function(oEvent)
	{
		var oEvent = getEvent(oEvent);
		var oEventElement = getEventElement(oEvent);

		while (oEventElement.parentNode) {
			if (oEventElement.parentNode.tagName.toLowerCase() != 'td') {
				oEventElement = oEventElement.parentNode;
			} else {
				break;
			}
		}
		
		Ebazaar.change(oEventElement);
	},
	
	setV1: function()
	{
		$$('pst').className = 'block';
		$$('v2').className = null;
		$$('v1').className = 'selected';

		$$('v1-cite').className = 'block';
		$$('v2-cite').className = 'none';
		
		$$('attachment').className = 'none';

		removeEvent($$('v1'), 'click', Ebazaar.setV1);
		addEvent($$('v2'), 'click', Ebazaar.setV2);
		
		Ebazaar.changeFormValues();
	},

	setV2: function()
	{
		$$('pst').className = 'none';
		
		$$('v1').className = null;
		$$('v2').className = 'selected';
		
		$$('v1-cite').className = 'none';
		$$('v2-cite').className = 'block';
		
		$$('attachment').className = 'file block';
		
		removeEvent($$('v2'), 'click', Ebazaar.setV2);
		addEvent($$('v1'), 'click', Ebazaar.setV1);
		
		Ebazaar.changeFormValues();
	},
	
	/*non (o|u)ptimized form validator ;-)*/
	validateForm: function()
	{
		Ebazaar.bFormFilled = true;
		for (var i = 0; i < Ebazaar.aRequiredFields.length; i++) {
			var oElement = Ebazaar.aRequiredFields[i];
			if ('' == trim(oElement.value)) {
				Ebazaar.bFormFilled = false;
				break;
			} else if (oElement.id == 'qf-mail') {
				if (!isEmail(oElement.value)) {
					Ebazaar.bFormFilled = false;
					break;
				}
			}
		}
		Ebazaar.proceedForm();
	},
	
	proceedForm: function()
	{
		if (Ebazaar.bFormFilled) {
			$$('qf-submit').disabled = '';
			$$('qf-submit-help').className = 'hidden';
			$$('fill-flag').className = 'fill-yes';
		} else {
			$$('qf-submit').disabled = 'disabled';
			$$('qf-submit-help').className = 'visible';
			$$('fill-flag').className = 'fill-no';
		}
	},
	
	/*set events for required input elements*/
	initFormEvents: function()
	{
		Ebazaar.aRequiredFields = getElementsByClassName('req', $$('qf'));
		for (var i = 0; i < Ebazaar.aRequiredFields.length; i++) {
			var oElement = Ebazaar.aRequiredFields[i];
			addEvent(oElement, 'keydown', Ebazaar.validateForm);
			addEvent(oElement, 'keyup', Ebazaar.validateForm);
		}
	},
	
	
	setNewColor: function(sColumnKey/*a, b or c*/, iOldRowId/*1-22*/, iNewRowId/*1-22*/)
	{
		var sColumnKey = sColumnKey.toLowerCase();
		var oParentElement = $$('colors');
		
		var sClassNameForClear = sColumnKey + iOldRowId;
		var aElementsToClear = getElementsByClassName(sClassNameForClear, oParentElement);
		if (aElementsToClear.length) {
			var aElementsChildToClear = aElementsToClear[0].getElementsByTagName('div');
			if (aElementsChildToClear.length) {
				aElementsChildToClear[0].className = null;
			}
		}
		
		var sClassNameForSet = sColumnKey + iNewRowId;
		var aElementsToSet = getElementsByClassName(sClassNameForSet, oParentElement);
		if (aElementsToSet.length) {
			var aElementsChildToSet = aElementsToSet[0].getElementsByTagName('div');
			if (aElementsChildToSet.length) {
				aElementsChildToSet[0].className = sColumnKey + '-color';
			}
		}
		
		switch (sColumnKey) {
			case 'a':
				Ebazaar.iCurrentA = iNewRowId;
				break;
			case 'b':
				Ebazaar.iCurrentB = iNewRowId;
				break;
			case 'c':
				Ebazaar.iCurrentC = iNewRowId;
				break;
		}
	},
	
	colorizeABC: function(oEvent)
	{
		var oEvent = getEvent(oEvent);
		var oEventElement = getEventElement(oEvent);
		var sEventType = oEvent.type;
		
		var sColor = 'c-color';
		var sLetter = 'c';
		
		if (oEventElement.parentNode.className.replace(/[\d\s]+/g, '') == 'aa') {
			sColor = 'a-color';
			sLetter = 'a';
		} else if (oEventElement.parentNode.className.replace(/[\d\s]+/g, '') == 'bb') {
			sColor = 'b-color';
			sLetter = 'b';
		}
		
		if (oEventElement.className == sColor && sEventType != 'click') {
			return;
		}
		
		/*find current colors interselection*/
		if (oEventElement.className != sColor && sEventType == 'click') {
			var bIsVisibleColor = false;
			var iOldRowId;
			
			switch (sLetter) {
				case 'a':
					iOldRowId = Ebazaar.iCurrentA;
					bIsVisibleColor = true;
					break;
				case 'b':
					iOldRowId = Ebazaar.iCurrentB;
					bIsVisibleColor = true;
					break;
				case 'c':
					iOldRowId = Ebazaar.iCurrentC;
					if (Ebazaar.aDiares[(Ebazaar.iCurrentId - 1)].parts == 3) {
						bIsVisibleColor = true;
					}
					break;
			}
			
			if (bIsVisibleColor) {
			//alert(oEventElement.parentNode.className.replace(/[\D]+/g, ''));
				Ebazaar.setNewColor(sLetter, iOldRowId, oEventElement.parentNode.className.replace(/[\D]+/g, ''));
				Ebazaar.changeStitches();
			}
		}
		
		/*change over-out only for visible*/
		if (bIsVisibleColor && sEventType != 'click') {
			/*deprecated*/
		}
	}
} 

addEvent(window, 'load', Ebazaar.init);