var Gallery = new Class({

	initialize: function(element){
		this.element = element;
		this.initScroller();
	},
	
	initScroller: function(){
		var that = this;
		var container = $(that.element);
		if (!container) {
			return;
		}
		var contents = container.getElements('div.featuredProjectsContent');
		var len = contents.length;
		var scrollIndex = 0;
		var totalWidth = 0;
		contents.each(function(el){
			totalWidth += el.getCoordinates().width;
		});
		container.getFirst().setStyle('width', totalWidth);
		var scrollFx = new Fx.Scroll(container);
		scrollFx.set(0, 0);	
		scrollFx.toElement(contents[scrollIndex]);
		var btn = container.getNext().getElements('a');
		if (btn.length != 2) {
			return;
		}
		if (contents.length <= 3) {
			this.setDisableButton(btn[0]);
			this.setDisableButton(btn[1]);
			return;
		}
		that.setDisableButton(btn[0]);
		btn[0].removeEvents('click').addEvent('click', function(e){
			new Event(e).stop();	
			if(scrollIndex - 1 < 0) {
				that.setDisableButton(btn[0]);
				return;
			}
			scrollIndex -= 1;
			if(scrollIndex - 1 < 0) {
				that.setDisableButton(btn[0]);
			}
			that.setEnableButton(btn[1]);
			scrollFx.cancel().toElement(contents[scrollIndex]);
		});
		that.setEnableButton(btn[1]);
		btn[1].removeEvents('click').addEvent('click', function(e){
			new Event(e).stop();	
			if(scrollIndex + 1 > len - 3) {
				that.setDisableButton(btn[1]);
				return;
			}
			scrollIndex += 1;
			if(scrollIndex + 1> len - 3) {
				that.setDisableButton(btn[1]);				
			}
			that.setEnableButton(btn[0]);
			scrollFx.cancel().toElement(contents[scrollIndex]);
		});
	},
	
	setDisableButton: function (btn) {
		try {			
			btn.getFirst().setStyles({
				'opacity': '0.4'				
			});
		} catch(err) {}
	},

	setEnableButton: function (btn) {
		try {
			btn.getFirst().setStyles({
				'opacity': '1'				
			});
		} catch(err) {}
	}
});

var Gallery2 = new Class({

	initialize: function(element){
		this.element = element;
		this.initScroller();
	},
	
	initScroller: function(){
		var that = this;
		var container = $(that.element);
		if (!container) {
			return;
		}
		var listContainer = container.getElement('div.scrollContainer ul');
		var contents = listContainer.getElements('li');
		var len = contents.length;		
		var scrollIndex = 0;
		var totalWidth = 0;
		var previewImage = container.getElement('img.preview');
		var currentLi = contents[0];
		contents.each(function(el, index){
			totalWidth += el.getCoordinates().width + 2;
			el.removeEvents('click').addEvent('click', function(e){
				new Event(e).stop();
				currentLi.removeClass('current');
				currentLi = contents[index];
				currentLi.addClass('current');
				previewImage.src = el.getElement('a').href;
			});
		});
		listContainer.setStyle('width', totalWidth);
		var scrollFx = new Fx.Scroll(listContainer.getParent());
		scrollFx.set(0, 0);	
		scrollFx.toElement(contents[scrollIndex]);
		var btn = container.getElement('p.btn').getElements('img');
		if (btn.length != 2) {
			return;
		}
		if (contents.length <= 4) {
			this.setDisableButton(btn[0]);
			this.setDisableButton(btn[1]);
			return;
		}
		that.setDisableButton(btn[0]);
		btn[0].removeEvents('click').addEvent('click', function(e){
			new Event(e).stop();	
			if(scrollIndex - 1 < 0) {
				that.setDisableButton(btn[0]);
				return;
			}
			scrollIndex -= 1;
			if(scrollIndex - 1 < 0) {
				that.setDisableButton(btn[0]);
			}
			that.setEnableButton(btn[1]);
			scrollFx.cancel().toElement(contents[scrollIndex]);
		});
		that.setEnableButton(btn[1]);
		btn[1].removeEvents('click').addEvent('click', function(e){
			new Event(e).stop();	
			if(scrollIndex + 1 > len - 4) {
				that.setDisableButton(btn[1]);
				return;
			}
			scrollIndex += 1;
			if(scrollIndex + 1> len - 4) {
				that.setDisableButton(btn[1]);				
			}
			that.setEnableButton(btn[0]);
			scrollFx.cancel().toElement(contents[scrollIndex]);
		});
	},
	
	setDisableButton: function (btn) {
		try {			
			btn.setStyles({
				'opacity': '0.4'				
			});
		} catch(err) {}
	},

	setEnableButton: function (btn) {
		try {
			btn.setStyles({
				'opacity': '1'
			});
		} catch(err) {}
	}
});

var HumanInfo = new Class({

	initialize: function(element){
		this.element = element;
		this.initScroller();
	},
	
	initScroller: function(){
		var that = this;
		var container = $(that.element);
		if (!container) {
			return;
		}
		var contents = container.getElements('div.humanType');
		var contentsDetails = $$('div.humanType2');
		var len = contents.length;
		var scrollIndex = 0;
		var totalHeight = 0;
		var currentIndex = 0;
		contents.each(function(el, index){
			totalHeight += el.getCoordinates().height + 2;
			el.removeEvents('click').addEvent('click', function(e){
				new Event(e).stop();
				if(currentIndex == index) return;
				contents[currentIndex].removeClass('current');
				contentsDetails[currentIndex].addClass('hidden');				
				currentIndex = index;
				contents[currentIndex].addClass('current');
				contentsDetails[currentIndex].removeClass('hidden');
				var temp = $$(".smScroller");
				for(var i=0;i<temp.length;i++) temp[i].destroy();
				scroller = new mooScroller($$(".smScrollContent"), {});
			});
		});
		container.getFirst().setStyle('height', totalHeight);
		var scrollFx = new Fx.Scroll(container);
		scrollFx.set(0, 0);
		var btn = container.getParent().getParent().getChildren('p');
		if (btn.length != 2) {
			return;
		}
		if (contents.length <= 5) {
			this.setDisableButton(btn[0]);
			this.setDisableButton(btn[1]);
			return;
		}
		that.setDisableButton(btn[0]);
		btn[0].removeEvents('click').addEvent('click', function(e){
			new Event(e).stop();	
			if(scrollIndex - 1 < 0) {
				that.setDisableButton(btn[0]);
				return;
			}
			scrollIndex -= 1;
			if(scrollIndex - 1 < 0) {
				that.setDisableButton(btn[0]);
			}
			that.setEnableButton(btn[1]);
			scrollFx.cancel().start(0, 51*scrollIndex);
		});
		that.setEnableButton(btn[1]);
		btn[1].removeEvents('click').addEvent('click', function(e){
			new Event(e).stop();	
			if(scrollIndex + 1 > len - 5) {
				that.setDisableButton(btn[1]);
				return;
			}
			scrollIndex += 1;
			if(scrollIndex + 1> len - 5) {
				that.setDisableButton(btn[1]);				
			}
			that.setEnableButton(btn[0]);
			scrollFx.cancel().start(0, 51*scrollIndex);
		});
	},
	
	setDisableButton: function (btn) {
		try {			
			btn.getElement('img').setStyles({
				'opacity': '0.4'			
			});
		} catch(err) {}
	},

	setEnableButton: function (btn) {
		try {
			btn.getElement('img').setStyles({
				'opacity': '1'				
			});
		} catch(err) {}
	}
});

var Menu = new Class({
	
	initialize: function(element){
		this.element = $(element);
		this.initMenu();
	},
	
	initMenu: function(){	
		var that = this;
		if(!that.element){
			return;
		}
		var mainItems = that.element.getChildren('li');
		if(!mainItems.length){
			return;
		}
		
		var timeOut;
		var lastItem = mainItems[0];
		lastItem.ul = lastItem.getElement('ul');
		var lastIndex = 0;
		var currentItem = lastItem;
		var currentIndex = 0;
		var forceShow = false;
		mainItems.each(function(item, index){
			item.ul = item.getElement('ul');
			if(item.hasClass('active')){
				lastItem = item;
				currentItem = item;
				currentIndex = index;
				lastIndex = index;
			}
			item.addEvents({
				'mouseenter': function(e){
					$clear(timeOut);
					forceShow = false;
					buildSubNav(item.ul);					
					currentItem = this;
					currentIndex = index;					
				},
				'mouseleave': function(e){
					hideSubMenu();
				}
			});
		});
		buildSubNav(currentItem.ul);
		
		function buildSubNav(ul){
			if(lastItem && lastItem.ul){
				lastItem.ul.setStyles({
					'top': '-8800px'
				});
			}
			if(currentItem && currentItem.ul){
				currentItem.ul.setStyles({
					'top': '-8800px'
				});
			}
			if(ul){
				ul.setStyles({
					'top': '88px'
				});
				ul.removeEvents().addEvents({
					'mouseenter': function(e){
						if(currentIndex != lastIndex)
							currentItem.getElement('img').set('src', currentItem.getElement('img').get('src').replace('_n.', '_o.'));
						forceShow = true;
					},
					'mouseleave': function(e){
						if(currentIndex != lastIndex)
							currentItem.getElement('img').set('src', currentItem.getElement('img').get('src').replace('_o.', '_n.'));
						forceShow = false;					
					}
				});
				
			}
			else{
				if(currentItem.ul){
					currentItem.ul.setStyles({
						'top': '-8800px'
					});
				}				
			}
		}
		
		function hideSubMenu(){
			timeOut = setTimeout(function(){
				if(!forceShow){	
					if(currentItem.ul){
						currentItem.ul.setStyles({
							'top': '-8800px'
						});
					}
					if(lastItem && lastItem.ul){
						lastItem.ul.setStyles({
							'top': '88px'
						});
						currentIndex = lastIndex;
						currentItem = lastItem;						
					}					
				}
			}, 200);
		}
		
		
	}
});

var Navigator = new Class({	
	initialize: function(element){
		this.element = element;
		this.setupNavigator();
	},
	
	setupNavigator: function(){
		var navHolder = $(this.element);		
		if (!navHolder) {
			return;
		}
		var togglers = navHolder.getElements('dt');		
		var startToggle = -1;
		for(var i=0; i<togglers.length; i++){
			if(togglers[i].hasClass('current')){
				startToggle = i;
				break;
			}
		}
		var elements = navHolder.getElements('dd').setStyle('display', 'block');
		
		var accordionObj = new Accordion(togglers, elements, {
			duration: 400,
			display: startToggle,
			show: startToggle,
			alwaysHide: true,
			onActive: function(toggle, element){
				toggle.addClass('current');
				toggle.getElement('a img').set('src', 'images/ico_arrow_04.gif');
				toggle.getLast().addClass('imgSelected').set('src', toggle.getLast().get('src').replace('_n.', '_o.'));
			},
			onBackground: function(toggle, element){
				toggle.removeClass('current');
				toggle.getElement('a img').set('src', 'images/ico_arrow_03.gif');
				toggle.getLast().removeClass('imgSelected').set('src', toggle.getLast().get('src').replace('_o.', '_n.'));
			}
		});			
	}	
});

var Navigator2 = new Class({	
	initialize: function(element){
		this.element = element;
		this.setupNavigator();
	},
	
	setupNavigator: function(){
		var navHolder = $(this.element);		
		if (!navHolder) {
			return;
		}
		var togglers = navHolder.getElements('dt.toggle');		
		var startToggle = -1;
		for(var i=0; i<togglers.length; i++){
			if(togglers[i].hasClass('current')){
				startToggle = i;
				break;
			}
		}
		var elements = navHolder.getElements('dd.element').setStyle('display', 'block');
		
		var accordionObj = new Accordion(togglers, elements, {
			duration: 600,
			display: startToggle,
			show: startToggle,
			alwaysHide: true,
			onActive: function(toggle, element){
				toggle.addClass('current');				
			},
			onBackground: function(toggle, element){
				toggle.removeClass('current');
			}
		});	
		navHolder.getElements('a.more').each(function(item){
			item.addEvent('click', function(e){
				e.stop();
				showHideLayer2('layerContent', item.getParent().getParent().getNext(), 1);
			});
		});			
	}	
});

function initFormApplyJob(){
	if(!$('formApplyJob')) return;
	var demoFormApplyJobData = [{
		field: 'fullname',
		valid: 'required',
		alert: 'fullname is required'
	},{
		field: 'email',
		valid: 'email',
		alert: 'email is required'
	},{
		field: 'telephone',
		valid: 'required',
		alert: 'telephone is required',
		restrict: "[0-9 \.()]"
	},{
		field: 'pos',
		valid: 'required',
		alert: 'position is required'
	},{
		field: 'resume',
		valid: 'image',
		alert: 'resume is required'
	},{
		field: 'comments',
		valid: 'required',
		alert: 'comments is required'
	}];
	new htmlform({
		id: "formApplyJob",
		data: demoFormApplyJobData,
		layer: {
			type: "layer",
			layerWidth: 273
		}
	});
}

function initFormContactUs(){
	if(!$('formContactUs')) return;
	var demoFormContactUsData = [{
		field: 'fullname',
		valid: 'required',
		alert: 'fullname is required'
	},{
		field: 'company',
		valid: 'required',
		alert: 'company is required'
	},{
		field: 'address',
		valid: 'required',
		alert: 'address is required'
	},{
		field: 'tel',
		valid: 'required',
		alert: 'tel is required',
		restrict: "[0-9 \.()]"
	},{
		field: 'email',
		valid: 'email',
		alert: 'email is required'
	},{
		field: 'comments',
		valid: 'required',
		alert: 'comments is required'
	}];

	new htmlform({
		id: "formContactUs",
		data: demoFormContactUsData,
		layer: {
			type: "layer",
			layerWidth: 255
		}
	});
}

function showHideLayer(div, to){
	var _div = $(div);
	if(!_div.overlay){
		_div.overlay = new Element('div', {
			id: 'overlay'
		}).inject(document.body);			
		_div.overlay.fx = new Fx.Tween(_div.overlay, {property: "opacity"});
	}
	if(to == 1){	
		if(Browser.Engine.trident4)
			_div.overlay.setStyles({	
				'position': 'absolute',
				'height': window.getScrollHeight(),
				'width': window.getScrollWidth()					
			});
		_div.overlay.fx.set(0).start(0.6);
		_div.setStyles({
			'position': 'absolute', //Browser.Engine.trident4 ? 'absolute' : 'fixed',
			'top': window.getScrollTop() + (window.getHeight() - _div.getCoordinates().height)/2,
			'left': window.getWidth()/2 - _div.getCoordinates().width/2			
		});
		/*window.addEvent('scroll', function(){
			_div.setStyles({
				'top':  (Browser.Engine.trident4 ? window.getScrollTop() : 0) + (window.getHeight() - _div.getCoordinates().height)/2,
				'left': window.getWidth()/2 - _div.getCoordinates().width/2			
			});
		});*/
		window.addEvent('resize', function(){
			_div.setStyles({
				'top':  window.getScrollTop() + (window.getHeight() - _div.getCoordinates().height)/2,
				'left': window.getWidth()/2 - _div.getCoordinates().width/2			
			});
		});
	}
	else{
		_div.overlay.fx.start(0);
		_div.setStyles({
			'top': -1000,
			'left': -1000
		});
		window.removeEvents('scroll');
		window.removeEvents('resize');
		
	}
	$('overlay').addEvent('click', function(e){
		e.stop();
		_div.overlay.fx.start(0);
		_div.setStyles({
			'top': -1000,
			'left': -1000
		});
		window.removeEvents('scroll');
		window.removeEvents('resize');
		this.removeEvents('click');
	});
}

function showHideLayer2(div, content, to){
	var _div = $(div);
	if(!_div.overlay){
		_div.overlay = new Element('div', {
			id: 'overlay'
		}).inject(document.body);			
		_div.overlay.fx = new Fx.Tween(_div.overlay, {property: "opacity"});
		
		var jobToggle = _div.getElement('h2.jobToggle');		
		var applyToggle = _div.getElement('h2.applyToggle');
		var jobDetail = _div.getElement('div.jobDetails');
		var applyDetail = _div.getElement('div.applyDetails');
		jobToggle.addEvent('click', function(){
			if(!jobDetail.hasClass('hidden')){
				applyToggle.fireEvent('click');
			}
			else{				
				applyDetail.getParent().removeClass('formExpanse');
				applyDetail.addClass('hidden');			
				jobDetail.removeClass('hidden');			
				jobToggle.getPrevious().getFirst().set('src', jobToggle.getPrevious().getFirst().get('src').replace('06', '05'));
				applyToggle.getPrevious().getFirst().set('src', applyToggle.getPrevious().getFirst().get('src').replace('05', '06'));
			}
		});
		jobToggle.getPrevious().addEvent('click', function(){
			jobToggle.fireEvent('click');
		});
		applyToggle.addEvent('click', function(){			
			if(!applyDetail.hasClass('hidden')){
				jobToggle.fireEvent('click');
			}
			else{
				jobDetail.addClass('hidden');
				applyDetail.getParent().addClass('formExpanse');
				applyDetail.removeClass('hidden');
				jobToggle.getPrevious().getFirst().set('src', jobToggle.getPrevious().getFirst().get('src').replace('05', '06'));
				applyToggle.getPrevious().getFirst().set('src', applyToggle.getPrevious().getFirst().get('src').replace('06', '05'));
			}
		});
		applyToggle.getPrevious().addEvent('click', function(){
			applyToggle.fireEvent('click');
		});		
	}
	if(to == 1){	
		if(Browser.Engine.trident4)
			_div.overlay.setStyles({	
				'position': 'absolute',
				'height': window.getScrollHeight(),
				'width': window.getScrollWidth()					
			});
		_div.getElement('.jobDetails').getFirst().set('html', content.get('html'));
		_div.overlay.fx.set(0).start(0.6);
		_div.setStyles({
			'position': 'absolute', //Browser.Engine.trident4 ? 'absolute' : 'fixed',
			'top': window.getScrollTop() + window.getHeight()/2 - _div.getCoordinates().height/2,
			'left': window.getWidth()/2 - _div.getCoordinates().width/2			
		});
		/*
		window.addEvent('scroll', function(){
			_div.setStyles({
				'top':  (Browser.Engine.trident4 ? window.getScrollTop() : 0) + window.getHeight()/2 - _div.getCoordinates().height/2,
				'left': window.getWidth()/2 - _div.getCoordinates().width/2			
			});
		});*/
		window.addEvent('resize', function(){
			_div.setStyles({
				'top':  window.getScrollTop() + window.getHeight()/2 - _div.getCoordinates().height/2,
				'left': window.getWidth()/2 - _div.getCoordinates().width/2			
			});
		});
	}
	else{
		_div.overlay.fx.start(0);
		_div.setStyles({
			'top': -1000,
			'left': -1000
		});
		window.removeEvents('scroll');
		window.removeEvents('resize');
	}
}

function initCustomSelect(){
	var arrMooSelects = $$('.mooselect');
	if(arrMooSelects.length > 0 ) {
		arrMooSelects.each(function(select, index){
			new MooSelect(select);
		});		
	}
}

function initFrmBrowseFile() {
	// must check this
	//classname
	var container = $$('p.browseFileWrap');
	if (container.length == 0) {
		return;
	}
	var arrInput = container[0].getElements('input');
	if (!Browser.Engine.gecko && !Browser.Engine.webkit && !Browser.Engine.presto && !Browser.Engine.trident5) {
		// remove input mask	
			arrInput[0].value="";
			arrInput[1].value="";
			arrInput[1].set("styles", {
				left: 96,
				opacity: 0.001,
				display: "block",
				visibility: "visible"				
			});			
			arrInput[1].addEvent('change', function(evt) {				
				arrInput[0].value = this.value;
			});			
			
	} else {
		// fix position and size of mask according to each browser
		arrInput[0].value="";
		arrInput[1].value="";
		if (Browser.Engine.presto) { // Opera
			arrInput[1].set("styles", {
				left: 96
			});
		} else if (Browser.Engine.webkit) { // safari
			arrInput[1].set("styles", {
				left: 96
			});
		} else if (Browser.Engine.trident5) { // IE7
			arrInput[1].set("styles", {
				left: 96
			});
		} else if (Browser.Engine.gecko ) { // FireFox
			arrInput[1].set("styles", {
				left: 96,
				clip: 'rect(auto, auto, auto, 0)',
				'letter-spacing' : 2
			});
		}
		arrInput[1].set("styles", {
			opacity: 0.001,
			display: "block",
			visibility: "visible"
			
		});
		arrInput[1].addEvent('change', function(evt) {
			arrInput[0].value = this.value;
		});
	}
}

function initFadeImages(){
	var fadeImg = $$('.fadeImg')[0];
	if(!fadeImg)	return;
	
	fadeImg.setStyle('opacity', 1);
	fadeImg.store('actived', true);
	
	var chooseBgd = $$('div.fadeImgs')[0];	
	if(!chooseBgd)	return;	
	
	var arrImgs = chooseBgd.getElements('input');
	var arrSrc = new Array(); 
	arrImgs.each(function(item, i){			
		arrSrc[i] = item.value;			
	});
	
	var bgCurrent = 0;
	var objTweenBg = [];
	new Asset.images(arrSrc, {
		onProgress: function(counter, index){
			var imgClone = fadeImg.clone();
			imgClone.className = fadeImg.className;
			imgClone.inject(fadeImg,'after').setStyle('opacity', 0).store('actived', false);
			if(counter == arrImgs.length-1){				
				var bgds = $$('.fadeImg');
				bgds.each(function(item, index){
					if(index){
						item.getFirst().src = arrSrc[index-1];
						objTweenBg[index-1] = new Fx.Tween(item,{
							duration: 3000
						});			
					}						
				});				
				bgds[1].setStyle('opacity', 1);
				bgds[1].store('actived', true);
				fadeImg.setStyle('display','none');				
				fadeImg.destroy();		
				var bgTimer = setInterval(function(){			
					objTweenBg[bgCurrent].cancel().start('opacity',[1,0]);
					bgCurrent = (bgCurrent < arrImgs.length - 1)?(bgCurrent + 1):0;
					objTweenBg[bgCurrent].cancel().start('opacity',[0,1]);
				}, 5000);	
			}
		}
	});	
}


function initFadeListImages(){
	var listImg = $('listImg');		
	if(!listImg) return;
	var title = listImg.getNext('p'); 
	var imgs = listImg.getElements('img');
	var imgCur = 0;
	imgs[0].setStyle('opacity', 1);
	imgs[0].fx = new Fx.Tween(imgs[0], {
		duration: 3000
	});
	imgs[0].title = imgs[0].getProperty('ref');
	if(imgs.length > 1){
		for(var i = 1; i < imgs.length; i++){
			imgs[i].setStyle('opacity', 0).removeClass('hide');
			imgs[i].fx = new Fx.Tween(imgs[i], {
				duration: 3000
			});
			imgs[i].title = imgs[i].getProperty('ref'); 
		}
		var lsTimer = setInterval(function(){			
			imgs[imgCur].fx.cancel().start('opacity',[1,0]);
			imgCur = (imgCur < imgs.length - 1)?(imgCur + 1):0;
			imgs[imgCur].fx.cancel().start('opacity',[0,1]);
			title.setProperty('text', imgs[imgCur].title);
		}, 4500);	
	}	
}

window.addEvent('domready', function(){	
	new Menu('nav');
	new HumanInfo('humanInfoContainer');
	new Gallery('featuredProjectsContainer');
	new Gallery2('photoGallery');
	new Navigator('historyContent');
	new Navigator2('availableInfo');
	initFadeImages();
	initFadeListImages();
	initFormContactUs();	
	initCustomSelect();
	initFrmBrowseFile();
	initFormApplyJob();	
});