// JavaScript Document


//initialize vars
var fadeRate=1000;


window.addEvent('domready', function () {
	init();
	
	});
	
function init() {
	fadeInElements();
	changeNavState();
	homeButton();
	}
	
function fadeInElements() {
	var pix=$('mainPix');
	var text=$('content');
	//hide initial elements
	text.setOpacity(0);
	pix.setOpacity(0);
	//first see if this page has a scroller
	var scrollKnob=$E('div.scrollerBarDown');
	if (scrollKnob) {
		scrollKnob.setOpacity(0);
		var myFx=new Fx.Style(pix, 'opacity', {duration:fadeRate});
		myFx.start(0, 1).chain(function() {
		var myScroll=new Fx.Scroll('content');
		myScroll.scrollTo(100, 0, {duration: fadeRate});
		var textFx=new Fx.Style(text, 'opacity', {duration:fadeRate});
		textFx.start(0, 1).chain(function() {
			setUpScroller();
			})
		})
	} else {
		var myFx=new Fx.Style('mainPix', 'opacity', {duration:fadeRate}).start(0, 1).chain(function() {
			var textFx=new Fx.Style(text, 'opacity', {duration:fadeRate}).start(0, 1);
		});
		//alert(pix);

	}
	}

function setUpScroller() {
	var scrollKnob=$E('div.scrollerBarDown');
	var allowScroll=true;
	var theColor=$E('h1').getStyle('color');
	var accentColor=new Color(theColor);
	scrollKnob.setStyle('background-color', accentColor);
	var curPos=scrollKnob.getStyle('bottom');
	var knobFx=new Fx.Styles(scrollKnob, {duration:fadeRate, transition:Fx.Transitions.Quad.easeOut});
	knobFx.start({
		'opacity':[0, 1],
		'bottom': [10, 0]
		}).chain(function(){
			programScroll();
			});
	}
	
function programScroll() {
	var scrollKnob=$E('div.scrollerBarDown');
	var allowScroll=true;
	var text=$('content');
	var scroller=new Fx.Scroll(text);
	scrollKnob.addEvent('click', function () {
		if (allowScroll) {
			scroller.toBottom();
			this.removeClass('scrollerBarDown');
			this.addClass('scrollerBarUp');
			scrollKnob.setStyle('background-position', 'bottom');
			allowScroll=false;
		} else {
			scroller.toTop();
			this.setStyle('background-position', 'top');
			allowScroll=true;
		}
	})
}

function changeNavState() {
	//first, get the current page color
	var myColor=$E('h1').getStyle('color');
	var pageId=$E('body').getProperty('id');
	var allowColorNav=true;
	//check ids
	
	if (pageId=='salon') {
		var curNav=$('nav-salon');
		//alert(curNav);
	}
	else if (pageId=='services') {
		var curNav=$('nav-services');
		//alert(pageId);
	}
	else if (pageId=='products') {
		var curNav=$('nav-products');
		//alert(pageId);
	}
	else if (pageId=='contact') {
		var curNav=$('nav-contact');
		//alert(pageId);
	}
	else if (pageId=='home') {
		allowColorNav=false;

	}
	if (allowColorNav) {
	var activeLink=$E('a', curNav);
	activeLink.setStyle('background-color', myColor);
	}

	
	//get the nav elements
	var theLinks=$ES('a', 'gNav');
	theLinks.each(function(o) {
		o.addEvent('mouseenter', function () {
			//alert(o);
			if (o != activeLink) {
			var myFx=new Fx.Style(this, 'background-color').start('#aaa', myColor);
			}
			});
		
		o.addEvent('mouseleave', function () {
			if (o != activeLink) {
			var myFx=new Fx.Style(this, 'background-color').start(myColor, '#fff');
			}
			});
		
	 });
										   }
										   
function homeButton() {
	//find the button
	var homeButton=$('button-home');
	var curColor=$E('h1').getStyle('color');
	var theLink=$E('a', homeButton);
	theLink.addEvent('mouseenter', function () {
		var myFx=new Fx.Style(this, 'background-color').start('#fff', curColor);
	});
	theLink.addEvent('mouseleave', function () {
		var myFx=new Fx.Style(this, 'background-color').start(curColor, '#fff');
	});
}
			

	
	
	
	
	
	
