// setup quick nav

var initQuickNav = function() {

	// add the quicknav content - search

	$('quickNavAreas').adopt(
		new Element('div', {
			id: 'quickAreaSearch',
			'class': 'quickNavArea'
		}).adopt(
			new Element('form', {
				id: 'quickAreaSearchForm',
				method: 'post',
				action: '/search.php'
			}).adopt(
				new Element('ul').adopt(
					new Element('li').adopt(
						new Element('label', {'for': 'quickAreaSearchTerm'}).setHTML('Search:')
					),
					new Element('li').adopt(
						new Element('input', {
                            name: 'searchTerm',
                            id: 'quickAreaSearchTerm',
                            type: 'text',
                            value: 'Search term'
                        }).addEvent('focus', function(){
                            if (this.value == 'Search term') this.setProperty('value', '');
                        })
					),
					new Element('li').adopt(
						new Element('label', {'for': 'quickAreaSearchPrice'}).setHTML('Price:')
					),
					new Element('li').adopt(
						 new Element('select', {
                            name: 'searchPrice',
                            id: 'quickAreaSearchPrice'
                        }).adopt(
                            new Element('option', {value: '0', selected: 'selected'}).setHTML('Any'),
                            new Element('option', {value: '1'}).setHTML('£1.00 - £4.99'),
                            new Element('option', {value: '2'}).setHTML('£5.00 - £9.99'),
                            new Element('option', {value: '3'}).setHTML('£10.00 - £19.99'),
                            new Element('option', {value: '4'}).setHTML('£20.00 - £29.99'),
                            new Element('option', {value: '5'}).setHTML('£30.00+')
                        )
					),
					new Element('li', {'class': 'go'}).adopt(
						new Element('input', {
							name: 'go',
							type: 'image',
							title: 'Go',
							src: '/images/go.gif',
							alt: 'Go',
							'class': 'rollover',
							id: 'quickAreaSearchSubmit'
						})
					)
				)
			),
			new Element('div', {id: 'quickAreaSearchResultsWrapper'}).adopt(
				new Element('div', {id: 'quickAreaSearchResults'}),
				new Element('a', {
					href: '#',
					id: 'quickAreaSearchResultsCloser'
				}).setHTML('Close search results')
			)
		)
	)

	// setup live search

	initLiveSearch();

	// add the quicknav content - basket

	$('quickNavAreas').adopt(new Element('div', {
		id: 'quickAreaBasket',
		'class': 'quickNavArea'
	}).setHTML('Loading basket...'));

	// setup basket

	initBasket();

	// add the quicknav content - login

	$('quickNavAreas').adopt(
		new Element('div', {
			id: 'quickAreaLogin',
			'class': 'quickNavArea'
		}).adopt(
			new Element('form', {
				method: 'post',
				action: '/login.php'
			}).adopt(
				new Element('input', {
					type: 'hidden',
					name: 'submit',
					value: 'login'
				}),
				new Element('ul').adopt(
					new Element('li').adopt(
						new Element('label', {'for': 'quickAreaLoginEmail'}).setHTML('Email:')
					),
					new Element('li').adopt(
						new Element('input', {
								name: 'emailaddress',
								id: 'quickAreaLoginEmail',
								type: 'text'
							})
					),
					new Element('li').adopt(
						new Element('label', {'for': 'quickAreaLoginPassword'}).setHTML('Password:'),
						new Element('input', {
							name: 'password',
							id: 'quickAreaLoginPassword',
							type: 'password'
						})
					),
					new Element('li', {'class': 'go'}).adopt(
						new Element('input', {
							name: 'go',
							type: 'image',
							title: 'Go',
							src: '/images/go.gif',
							alt: 'Go',
							'class': 'rollover',
							id: 'quickAreaLoginSubmit'
						})
					)
				)
			)
		)
	);

	// get the quicknav items

	var quickNavClickers	= $$('.quickNavClicker');
	var quickNavAreas		= $$('.quickNavArea');


	// setup mouseover events

	quickNavClickers.each(function(el, i){
		el.addEvent('mouseover', function(){
			showQuickNavArea(i);
		});
	});


	// setup the animation on the content elements

	quickNavAreas.each(function(el){
		el.defaults = new Array;
		el.defaults[0] = el.offsetHeight;
		el.animation = el.effects({
			duration: 400,
			onComplete: function(el){
				if (el.offsetHeight > 0) {
					el.setStyle('height', 'auto');
					el.defaults[0] = el.offsetHeight;
				}
			},
			wait: false
		});
	});


	// display the required item

	var showQuickNavArea = function(index){
		quickNavClickers.each(function(el){
			el.removeClass('over');
		});
		quickNavClickers[index].addClass('over');

		if (index > 0 && $('quickAreaSearchResultsWrapper').offsetHeight > 0) $('quickAreaSearchResultsWrapper').animation.start({
			height: 0,
			opacity: 0
		});

		quickNavAreas.each(function(el, i){
			if (i != index) {
				el.setStyle('height', el.offsetHeight + 'px').animation.start({
					height: 0,
					opacity: 0
				});
			} else {
				el.animation.start({
					height: el.defaults[0],
					opacity: 1
				});
			}
		});
	}


	// immediately hide all items

	quickNavAreas.each(function(el, i){
		if (i != 0) {
			el.setStyles({
				height: 0,
				opacity: 0
			});
		}
	});

	// display the first item

	showQuickNavArea(0);
}



// setup live search

var initLiveSearch = function(){

	// setup a slider on the search results area

	var el = $('quickAreaSearchResultsWrapper');
	el.defaults = new Array;
	el.defaults[0] = el.scrollHeight;
	el.animation = el.effects({
		duration: 400,
		wait: false,
		onStart: function(el){
			if (el.offsetHeight <= 0) el.setStyle('display', 'block');	
		},
		onComplete: function(el){
			if (el.offsetHeight <= 0) el.setStyle('display', 'none');
		}
	});
	el.animation.set({
		height: 0,
		opacity: 0
	});
	el.setStyle('display', 'none');


	// setup an observer on the live search fields

	$('quickAreaSearchTerm').observe(doLiveSearch, {delay: 500});
	$('quickAreaSearchPrice').addEvent('change', doLiveSearch);


	// setup the closer link

	$('quickAreaSearchResultsCloser').addEvent('click', function(){
		$('quickAreaSearchResultsWrapper').animation.start({
			height: 0,
			opacity: 0
		});
	});
}



// actual search function

var doLiveSearch = function(){

	// show "searching" message in results box

	$('quickAreaSearchResults').setHTML('<div class="searching">Searching...</div>');


	// open results box if currently closed

	$('quickAreaSearchResultsWrapper').setStyle('display', 'block')
	$('quickAreaSearchResultsWrapper').animation.start({
		height: $('quickAreaSearchResultsWrapper').defaults[0],
		opacity: 1
	});


	// do the ajax search

	$('quickAreaSearchResults').searchAjax = new Ajax('/ajax-search.php', {
		postBody: $('quickAreaSearchForm'),
		update: $('quickAreaSearchResults')
	}).request();
}



// setup basket

var initBasket = function(){

	// load the basket contents HTML via AJAX

	var myAjax = new Ajax('/ajax-basket.php', {
		postBody: '',
		update: $('quickAreaBasket'),
		onComplete: function(){
			var el = $('quickAreaBasket');

			if (el.defaults) {
				var height = el.getStyle('height');
				el.setStyles({
					height: 'auto',
					position: 'absolute'
				});
				el.defaults['height'] = el.scrollHeight;
				el.setStyles({
					height: height,
					position: 'relative'
				});
			}
		}
	}).request();
}

var initCurrencies = function(){
	var currencyList = $E('#currencyPanel select');
	
	if (currencyList) {
		currencyList.setAttribute("class", currencyList.options[currencyList.selectedIndex].getAttribute("class"));

		currencyList.addEvent("change", function() {
			currencyList.setAttribute("class", currencyList.options[currencyList.selectedIndex].getAttribute("class"));
		});
	}
}

// and initialise the quick nav on page load

window.addEvent('domready', initQuickNav);
window.addEvent('domready', initCurrencies);