window.addEvent('domready',init)

var selected = -1
var subpages = ['bexx3','uv']


function init(){
	initMenu()
	initProductSelectors()
	showKit(getDefaultPage())
}


function getDefaultPage(){
	var queryParam = location.search
	var id = 0
	$each(subpages, function(pageId, i){
		console.log(pageId,i,queryParam.indexOf(pageId))
		if(queryParam.indexOf(pageId) != -1){
			id = i
		}
	})
	return id
}


function initMenu(){
	$each($$('#content ul.submenu li'), function(el,i){
		var elLink = el.getElement('a')
		elLink.addEvent('click',function(){
			showKit(i)
		})
		elLink.addEvent('mouseover',function(){
			elLink.addClass('over')
		})
		elLink.addEvent('mouseout',function(){
			if(selected != i){
				elLink.removeClass('over')
			}
		})
	})
}

function showKit(id){
	selected = id
	
	var menuEls = $$('#content ul.submenu li a')
	var kitEls = $$('#content ul.kits li.kit')
	
	$each(menuEls, function(el,i){
		var menuEl = menuEls[i]
		var kitEl = kitEls[i]
		
		if(i == id){
			menuEl.addClass('over')
			menuEl.addClass('selected')
			
			kitEl.setStyle('display','block')
			
			//get target objects
			$each(kitEl.getElements('.targetprods'), function(targetEl){
				selectProd(targetEl, 0)
				showProdName(targetEl, 0)
			})
		}else{
			menuEl.removeClass('over')
			menuEl.removeClass('selected')
			
			kitEl.setStyle('display','none')
		}
	})
}


function initProductSelectors(){
	$each($$('#content .targetprods'), function(targetEl){
		initProductSelector(targetEl)
	})
}


function initProductSelector(el){
	$each(el.getElements('.thumbs a'), function(thumbEl,i){
		thumbEl.addEvent('mouseover', function(){
			selectProd(el,i)	
			showProdName(el,i)
		})
	})	
}


function selectProd(targetEl,id){
	$each(targetEl.getElements('.thumbs a'), function(el,i){
		if(i == id){
			el.addClass('over')
		}else{
			el.removeClass('over')
		}
	})
}


function showProdName(targetEl,id){
	$each(targetEl.getElements('.names li'), function(el,i){
		if(i == id){
			el.setStyle('visibility','visible')
		}else{
			el.setStyle('visibility','hidden')
		}
	})
}