var _animate = false;
window.addEvent('domready', function() {
	// tab mover ***************************************************************
	var _tabs = $$('ul.tabset a');
	var _tabHolders = $$('div.holder');
	var _slideBars = $$('div.slide');
	var _verticalMover = $('vertical-mover');
	
	_verticalMover.fx = new Fx.Tween(_verticalMover, {
		duration:1000,
		transition: Fx.Transitions.Expo.easeOut,
		onStart:function(){
			_animate = true;
		},
		onComplete:function(){
			_animate = false;
		}
	});
	
	_tabs.each(function(tab,i){
		_slideBars[i].setStyle('opacity','0')
		_slideBars[i].fx = new Fx.Tween(_slideBars[i], {
			duration:1000,
			transition: Fx.Transitions.Expo.easeOut,
			onStart:function(obj){
				if (obj.getStyle('opacity') == '0') obj.setStyle('display','block')
			},
			onComplete:function(obj){
				if (obj.getStyle('opacity') < 1) obj.setStyle('display','none')
			}
		});
		
		tab._id = tab.href.substr(tab.href.indexOf('#')+1);
		var k = getTabIndex(tab._id);
		_slideBars[i].fx.cancel().start('opacity',0);
		
		if (tab.hasClass('active')) {
			_verticalMover.fx.cancel().start('marginTop',-320*k);
			_slideBars[k].fx.cancel().start('opacity',1);
		}
		tab.addEvent('click', function(){
			_tabs.removeClass('active');
			this.addClass('active');
			_verticalMover.fx.cancel().start('marginTop',-320*k);
			
			_slideBars.each(function(sb,j){
				if (sb.style.display == 'block' && j != k)
					sb.fx.cancel().start('opacity',0);
			});
			_slideBars[k].fx.cancel().start('opacity',1);
			return false;
		});
	});
	function getTabIndex(_id){
		var _index = 0;
		_tabHolders.each(function(t,i){
			if (t.id == _id) {
				_index = i;
			}
		});
		return _index;
	}
	
	
	// notes *******************************************************************
	var _notes = $$('div.note');
	_notes.each(function(note,i){
		var _noteParent = note.getParent();
		var _noteHeight = note.offsetHeight;
		note.fx = new Fx.Tween(note, {
			duration:800,
			transition: Fx.Transitions.Expo.easeOut
		});
		_noteParent.addEvent('mousemove', function(){
			if (!_animate)
				note.fx.cancel().start('top',320-_noteHeight);
		});
		_noteParent.addEvent('mouseout', function(){
			if (!_animate)
				note.fx.cancel().start('top',320);
		});
	});
	
	// layout ******************************************************************
	var _layout = $('page');
	var _container = $('container');
	var _rbg = $$('.rbg')[0];
	_container.size = _container.getSize();
	var _headerHeight = 90;

	function verticalCenter(){
		_container.setStyle('paddingTop',0)
		_layout.size = _layout.getSize();
		_rbg.size = _rbg.getSize();
		var _y = _layout.size.y - _headerHeight;
		var _top = 15;
		
		var _dif = (_y - _container.size.y)/2;
		if (_top <= _dif) _container.setStyle('paddingTop',_dif);
		else _container.setStyle('paddingTop',_top);

		if (_layout.size.y > _rbg.size.y) _rbg.setStyle('height',_layout.size.y);
		else _rbg.setStyle('height','100%');
	}
	verticalCenter();
	window.addEvent('resize', function(){
		verticalCenter();
	});
	
	// horizontal custom scroll ************************************************
	horScroll($('projectList1'), 521,(449 - 8), 'ul.project-list > li', 'horizontalSlideBar1', 'nextSlide1', 'prevSlide1', 'slider1');
	horScroll($('projectList2'), 521,(449 - 8), 'ul.project-list > li', 'horizontalSlideBar2', 'nextSlide2', 'prevSlide2', 'slider2');
	horScroll($('projectList3'), 521,(449 - 8), 'ul.project-list > li', 'horizontalSlideBar3', 'nextSlide3', 'prevSlide3', 'slider3');
	
	function horScroll(holder, step, barWidth, slide, hSlideBar, nextSlideBt, prevSlideBt, slider) {
		if (holder) {
			var _step = step;
			var _barWidth = barWidth; // bar - slider
			var _slides = holder.getElements(slide);
			var _holder = holder.getElement('ul.project-list');
			var _bar = $(hSlideBar);
			var _next =  $(nextSlideBt);
			var _prev = $(prevSlideBt);
			var _slider = $(slider);
	
			var _animated = false;
			var _duration = 1000;
			var _length = _slides.length;
			var _allWidth = _step * (_length-1);
			var _k = _allWidth/_barWidth;
			var _current = 0;
			var _timer;
			var _tmpMargin;
			
			_bar.offset = _bar.getPosition();
			
			_holder.fx = new Fx.Tween(_holder, {
				duration:_duration,
				transition: Fx.Transitions.Expo.easeOut
			});
			_slider.fx = new Fx.Tween(_slider, {
				duration:_duration,
				transition: Fx.Transitions.Expo.easeOut
			});
			
			_next.onclick = function(){
				if (!_animated) 
					nextSlide();
				return false;
			};
			_prev.addEvent('click', function(){
				if (!_animated) 
					prevSlide();
				return false;
			})
			var _slideClick = 0;
			_slider.onclick = function(){return false};
			_slider.onmousedown = function(e) {
				if (e == null) { e = window.event }
				_slider.offset = _slider.getPosition();
				_slideClick = e.clientX - _slider.offset.x;
				
				document.onmousemove = function(e) {
					if (e == null) { e = window.event }
					var _mouseX = e.clientX - _bar.offset.x - _slideClick;
					
					if (_mouseX > _barWidth) _mouseX = _barWidth;
					if (_mouseX < 0) _mouseX = 0;
					 _tmpMargin = _mouseX*_k;
					_slider.setStyle('left',_mouseX);
					_holder.setStyle('marginLeft', -(_tmpMargin));
					return false;
				};
				document.onmouseup = function(){
					_current = parseInt(Math.round(_tmpMargin/_step));
					_holder.fx.cancel().start('marginLeft', -(_step*_current));
					_slider.fx.cancel().start('left', _step*_current/_k);
					document.onmousemove = function(){};
					document.onmouseup = function(){};
				};
				return false;
			};
			_bar.onclick = function(e){
				if (e == null) { e = window.event }
				var _mouseX = e.clientX - _bar.offset.x;
				_tmpMargin = _mouseX*_k;
				_current = parseInt(Math.round(_tmpMargin/_step));
				_holder.fx.cancel().start('marginLeft', -(_step*_current));
				_slider.fx.cancel().start('left', _step*_current/_k);
				return false;
			}
			
			function nextSlide(){
				_current = _current + 1;
				if (_current > _length-1) _current = 0;
				_holder.fx.cancel().start('marginLeft', -(_step*_current));
				_slider.fx.cancel().start('left', _step*_current/_k);
			}
			function prevSlide(){
				_current = _current - 1;
				if (_current < 0) _current = _length-1;
				_holder.fx.cancel().start('marginLeft', -(_step*_current));
				_slider.fx.cancel().start('left', _step*_current/_k);
			}
		}
	}
});