var currLayer   = 'home';
var currRef     = refsArray[0][0];
var showEffect  = 'none';
var blastersTimeout;
var effectTimeout;
var smallHackTimeout;
var fadeCurr = 0;
var fadeMax = 60;
var speedIn = 500;
var speedOut = 250;
var fadeStep = 5;
var stepInSpeed  = Math.round(speedIn*fadeStep/fadeMax);
var stepOutSpeed = Math.round(speedOut*fadeStep/fadeMax);
var e1;
var e2;
var currGallery;
var slideSpeed = 2500;
var slidesTimeout;
var slidePic;
var allPics = new Array();
var sCurrLeft = 0;
var sCurrTop = 0;
var sCurrContent= 0;

window.onload = loadInteractive;

function loadInteractive () {
// video effects
	e1 = $('ve_back'); 
	e2 = $('ve_front');
	e1.style.filter = 'alpha(opacity=0)';
	e2.style.filter = 'alpha(opacity=0)';
	e1.style.opacity = 0;
	e2.style.opacity = 0;
	e1.style.backgroundColor = 'black';
	e2.style.backgroundColor = 'black';
// corect CSS :)
	$('customers').style.overflowX = 'hidden';
	$('video_menu').style.overflowX = 'hidden';
	$('gi_left').style.overflowX = 'hidden';
	$('gi_right').style.overflowX = 'hidden';
	$('news').style.overflowX = 'hidden';
// customers layer
	showRefs ();
// menu layer
	showMenu ();
// init video layer
	startVideo ();
	showVideoThumbs ();
// init refs
	$('ref_holder').innerHTML = '<img id="ref_img" src="index_files/referenzii/' + currRef + '.jpg" alt="" width="347" height="495" />';
// init gallery
	showGallery ();
	initGalleryMenu ();
	initServices ();
}
function visible (id,value) {
	$(id).style.visibility = value;
}

function Over (object) {
	object.style.fontWeight='bold';
}

function menuOut (object) {
	if (!(currLayer == (object.id).slice(5))) {object.style.fontWeight='normal'};
}

function refOut (object) {
	if (!(currRef == (object.id).slice(4))) {object.style.fontWeight='normal'}
}

function servLOut (object) {
	var value = ('sL' + sCurrLeft);
	if (!(value == (object.id))) {object.style.fontWeight='normal'}
}

function servTOut (object) {
	var value = ('sT' + sCurrTop);
	if (!(value == (object.id))) {object.style.fontWeight='normal'}
}

function imageOver (object) {
	object.style.border = '1px white solid';
}

function imageOut (object) {
	object.style.border = '1px rgb(99,100,102) solid';
}

function toggleBlasters (toggle) {
	visible('blaster_left',toggle);
	visible('blaster_right',toggle);
//	visible('patch_right',toggle);
}

function toggleEffects (disable,id) {
	var stay = ((currLayer=='gallery')||(currLayer=='video'))&&((id=='gallery')||(id=='video'));
	var out  = ((currLayer=='gallery')||(currLayer=='video'))&&(!(id=='gallery'))&&(!(id=='video'));
	if (disable == 1) {					// effects off
		var toggle = 'visible';
		if (out) {
			clearTimeout(effectTimeout);
			smallHackTimeout = setTimeout('smallHack(\'none\')',speedIn);
			fadeOut ();
			}
		} 
		else {
			var toggle = 'hidden'; 		// effects on
			if (!stay) {
				smallHack('block');
				clearTimeout(effectTimeout);
				clearTimeout(smallHackTimeout);
				clearTimeout(blastersTimeout);
				fadeIn ()
				}
			};
	if (toggle == 'visible') {
		var timeLeft = (fadeCurr*stepOutSpeed/fadeStep);
		blastersTimeout = setTimeout("toggleBlasters('" + toggle + "')",timeLeft)
	}
		else {toggleBlasters(toggle)}
}

function clearLayer () {
	var button = $('menu_'+currLayer);
	visible(currLayer,'hidden');
	button.className = 'menu_item';
	button.style.fontWeight = 'normal';
}

function changeLayer (id) {
	if (id == currLayer) {return};
	if (id == 'gallery') {showTopGallery()} else {clearTimeout(slidesTimeout)};
	clearLayer();
	if (id == 'services') {visible('sContent'+sCurrContent,'visible')} else {visible('sContent'+sCurrContent,'hidden')};
	if (id == 'video' || id == 'gallery') {toggleEffects(0,id)} else {toggleEffects(1,id)};
	var button = $('menu_'+id);
	button.className = 'curr_item';	
	button.style.fontWeight = 'bold';
	currLayer = id;
	visible(id,'visible');
}

function clearRef () {
	var button = $('ref_' + currRef);
	button.className = 'ref_item';
	button.style.fontWeight = 'normal';
}

function changeRef (ref_id) {
	if (ref_id == currRef) {return};
	clearRef ();
	var holder = $('ref_img');
	var ref_button = $('ref_' + ref_id);
	var newImage = new Image();
	newImage.src = ('index_files/referenzii/' + ref_id + '.jpg');
	holder.src = newImage.src;
	ref_button.style.fontWeight = 'bold';
	ref_button.className = 'ref_curr_item';
	currRef = ref_id;
}

function showRefs () {
	var refMenuHtml = '';
	refMenuHtml += ('<div id="ref_' + refsArray[0][0] + '" class="ref_curr_item" onmouseover="Over(this)" onmouseout="refOut(this)" onclick="changeRef(&#39;' + refsArray[0][0] + '&#39;)">' + refsArray[0][1] + '</div>');
	for ( var i=1; i < refsCount; i++ ) {
		refMenuHtml += ('<div id="ref_' + refsArray[i][0] + '" class="ref_item" onmouseover="Over(this)" onmouseout="refOut(this)" onclick="changeRef(&#39;' + refsArray[i][0] + '&#39;)">' + refsArray[i][1] + '</div>');
	}
	$('ref_menu').innerHTML = refMenuHtml;
}

function showMenu () {
	var menuHtml = '';
	menuHtml += ('<div id="menu_' + menuArray[0][0] + '" class="curr_item" onmouseover="Over(this)" onmouseout="menuOut(this)" onclick="changeLayer(&#39;' + menuArray[0][0] + '&#39;)">' + menuArray[0][1] + '</div>');
	for ( var i=1; i < menuCount; i++ ) {
		menuHtml += ('<div id="menu_' + menuArray[i][0] + '" class="menu_item" onmouseover="Over(this)" onmouseout="menuOut(this)" onclick="changeLayer(&#39;' + menuArray[i][0] + '&#39;)">' + menuArray[i][1] + '</div>');
	}
	$('menu').innerHTML = menuHtml;
}

function startVideo () {
	var s1 = new SWFObject('index_files/mediaplayer.swf','mediaplayer','460','350','7');
	s1.addParam('allowfullscreen','true');
	s1.addVariable('width','460');
	s1.addVariable('height','350');
	var video = ('video/' + videoArray[0][0] + '.flv');
	s1.addVariable('file',video);
	s1.write('content');
}

function showVideoThumbs () {
	var thumbsContent = '';
	for (var i=0; i < videoArrayLength; i++) {
		thumbsContent += ('<a href="javascript: changeVideo(videoArray[' + i + '][0]);" title="' + videoArray[i][1] + '"><img src="index_files/video/' + videoArray[i][0] + '.jpg" alt="' + videoArray[i][1] + '" onmouseOver="imageOver(this)" onmouseout="imageOut(this)" /></a><br />');
	};
	$('video_menu').innerHTML = thumbsContent;
}

function changeVideo (newvideo) {
	var s1 = new SWFObject('index_files/mediaplayer.swf','mediaplayer','460','350','7');
	s1.addParam('allowfullscreen','true');
	s1.addVariable('width','460');
	s1.addVariable('height','350');
	var video = ('video/'+newvideo+'.flv');
	s1.addVariable('file',video);
	s1.addVariable('autostart','true');
	s1.write('content');
}

function sNewPicture (value) {
	var holder = $('sPicture');
	var content = "";
	for (i = 0; i < 2; i++) {
		var pic = ('index_files/gallery/' + sPics[value][i] + '.jpg');
		content += '<img class="left" src="'+ pic +'" alt="" />';
	}
	holder.innerHTML = content;
}

function sNewContent (left,top) {
	var value = (left + top);
	if (value == sCurrContent) {return};
	var newDiv = ('sContent' + value);
	var oldDiv = ('sContent' + sCurrContent);
	visible(oldDiv,'hidden');
	visible(newDiv,'visible');
	sCurrContent = value;
	var oldLeft = $('sL' + sCurrLeft);
	var oldTop = $('sT' + sCurrTop);
	oldLeft.className = 'servL_item';
	oldTop.className = 'servT_item';
	if (!(left == sCurrLeft)) {oldLeft.style.fontWeight = 'normal'};
	if (!(top == sCurrTop)) {oldTop.style.fontWeight = 'normal'};
	$('sL' + left).className = 'servL_curr_item';
	$('sT' + top).className = 'servT_curr_item';
	sCurrLeft = left;
	sCurrTop = top;
}

function initServices () {
	var sLContent = '<div id="sL0" class="servL_curr_item" onmouseover="Over(this)" onmouseout="servLOut(this)" onclick="sNewContent(0,sCurrTop);sNewPicture(0)">' + sL[0] + '</div>';
	var sTContent = '<div id="sT0" class="servT_curr_item" onmouseover="Over(this)" onmouseout="servTOut(this)" onclick="sNewContent(sCurrLeft,0)">' + sT[0] + '</div>';
	for (var i=1; i < sLLength; i++) {
		sLContent += '<div id="sL' + (i*sTLength) + '" class="servL_item" onmouseover="Over(this)" onmouseout="servLOut(this)" onclick="sNewContent('+ (i*sTLength) +',sCurrTop);sNewPicture('+ i +')">' + sL[i] + '</div>';
	}
	for (var i=1; i < sTLength; i++) {
		sTContent += '<div id="sT' + i + '" class="servT_item" onmouseover="Over(this)" onmouseout="servTOut(this)" onclick="sNewContent(sCurrLeft,'+ i +')">' + sT[i] + '</div>';
	}
	$('sMenu_left').innerHTML = sLContent;
	$('sMenu_top').innerHTML = sTContent;
}

function initGalleryMenu () {
	var menuHtml = '<a href="javascript:showTopGallery()">НАЗАД  </a><select title="" id="gi_select" onchange="gotoGallery(this.selectedIndex)">';
	for (i in galleryArray) {
		menuHtml += '<option title="' + galleryArray[i][0] + '">' + galleryArray[i][0].substr(0,35) + '</option>';
	}
	menuHtml += '</select>';
	$('gi_menu').innerHTML = menuHtml;
}

function showGallery () {
	var topHTML = '';
	for (var i = 0; i<15; i++) {
		topHTML += '<a href="javascript:gotoGallery(' + i + ')" title="' + galleryArray[i][0] + '"><img src="index_files/gallery/tn_' + galleryArray[i][1][0] + '.jpg" alt="' + galleryArray[i][0] + '" onmouseover="imageOver(this)" onmouseout="imageOut(this)"/>';
	};
	$('gallery_top').innerHTML = topHTML;
}

function showPic (picture) {
	var newImage = new Image ();
	newImage.src = 'index_files/gallery/' + picture + '.jpg';
	$('gi_center').style.background = 'url(' + newImage.src + ') top no-repeat';
}

function slides () {
	if (slidePic == allPics.length) {slidePic = 0;return};
	showPic(allPics[slidePic]);
	slidePic++;
	slidesTimeout = setTimeout('slides()',slideSpeed);
}

function gotoGallery (gallery) {
	currGallery = gallery;
	showInsideGallery ();
	var beforPics = '';
	var afterPics = '';
	var currPic;
	for (i in galleryArray[gallery][1]) {
		currPic = galleryArray[gallery][1][i]
		beforPics += '<img src="index_files/gallery/tn_' + currPic + '.jpg" onmouseover="imageOver(this)" onmouseout="imageOut(this)" onclick="clearTimeout(slidesTimeout);showPic(&#39' + currPic + '&#39)" />';
	};
	for (i in galleryArray[gallery][2]) {
		currPic = galleryArray[gallery][2][i];
		afterPics += '<img src="index_files/gallery/tn_' + currPic + '.jpg" onmouseover="imageOver(this)" onmouseout="imageOut(this)" onclick="clearTimeout(slidesTimeout);showPic(&#39' + currPic + '&#39)" />';
	};
	$('gi_left').innerHTML = beforPics;
	$('gi_right').innerHTML = afterPics;
	$('gi_select').selectedIndex = currGallery;
	$('gi_select').title = galleryArray[currGallery][0];
	allPics = joinArrays (gallery);
	clearTimeout(slidesTimeout);
	slidePic = 0;
	slides(allPics);
}

function showTopGallery () {
	$('gallery_top').style.display = 'block';
	$('gallery_inside').style.display = 'none';
}

function showInsideGallery () {
	$('gallery_top').style.display = 'none';
	$('gallery_inside').style.display = 'block';
}

function smallHack (param) {
	var vEffect1 = $('ve_back'); 
	vEffect1.style.display = param;
	var vEffect2 = $('ve_front'); 
	vEffect2.style.display = param;
}

function fadeIn () {		//efffect appears
	if (fadeCurr >= fadeMax) {return};
	fadeCurr += fadeStep;
	changeOpac(fadeCurr);
	effectTimeout = setTimeout('fadeIn()',stepInSpeed)
}

function fadeOut () {		//efffect appears
	if (fadeCurr <= 0) {return};
	fadeCurr -= fadeStep;
	changeOpac(fadeCurr);
	effectTimeout = setTimeout('fadeOut()',stepOutSpeed)
}

function changeOpac(opacity) {
	e1.style.opacity = (opacity / 100);
	e1.style.filter = "alpha(opacity=" + opacity + ")";
	e2.style.opacity = (opacity / 100);
	e2.style.filter = "alpha(opacity=" + opacity + ")";
}

function joinArrays (gallery) {
	var joined      = new Array;
	var arrayBe     = new Array;
	var arrayAf     = new Array;
	var arrayBe     = galleryArray[gallery][1];
	var arrayAf     = galleryArray[gallery][2];
	var count       = 0;
	var bigger      = (arrayBe.length < arrayAf.length)?arrayAf.length:arrayBe.length;
	for (var i=0; i < bigger; i++) {
		if (arrayBe[i]) {joined[count] = arrayBe[i]; count++}
		if (arrayAf[i]) {joined[count] = arrayAf[i]; count++}
	};
	return joined;
}

function $ (id){
	return document.getElementById(id);
}

function validate (object) {
	var allOk = true;
	var f_name  = object.elements[0].value;
	var f_phone = object.elements[1].value;
	var f_email = object.elements[2].value;

	var nameFilter = /(^[\u0430-\u044Fa-z]+)([\u0430-\u044Fa-z\s]*)([\u0430-\u044Fa-z]+$)/i;
	var phoneFilter = /^\d+[\d\s]+\d$/;
	var emailFilter = /^([\w\-\.])+\@([\w\-\.])+\.([a-z]{2,4})$/i;

	if (!emailFilter.test(f_email)) { allOk = formEffect('email');} else {disFormEffect('email')};
	if (!nameFilter.test(f_name))   { allOk = formEffect('name');}  else {disFormEffect('name')};
	if (!phoneFilter.test(f_phone)) { allOk = formEffect('phone');} else {disFormEffect('phone')};
	return allOk;
}
