var de=function(ele){return document.getElementById(ele);}
var et=function(ele,tag){return ele.getElementsByTagName(tag)}
var ec=function(ele,cla){var ret=[];var tags=ele.getElementsByTagName('*');for(var i=0;i<tags.length;i++){if(tags[i].className==cla) ret.push(tags[i])} return ret}


var getLeft=function(ele){
	var left=0;
	left=left+ele.offsetLeft;
	while(ele=ele.parentNode){
		if(ele.offsetLeft && getStyle(ele,'position')=="relative") left=left+ele.offsetLeft-ele.scrollLeft;//-parseInt(getStyle(ele.parentNode,'margin-left'));
	}

	if((document.all)&&(navigator.appVersion.indexOf("MSIE 7.")!=-1)){
		return left-de('viewport').offsetLeft-10;
	}
	else{
		return left-de('viewport').offsetLeft;
	}
}
var getTop=function(ele){
	var top=0;
	top=top+ele.offsetTop;
	while(ele=ele.parentNode){
		if(ele.offsetTop && getStyle(ele,'position')=="relative") top=top+ele.offsetTop-ele.scrollTop;
	}
	//return top;
	return -46;
}


function getStyle(oElm, strCssRule){
	var strValue = "";
	if(document.defaultView && document.defaultView.getComputedStyle){
		strValue = document.defaultView.getComputedStyle(oElm, "").getPropertyValue(strCssRule);
	}
	else if(oElm.currentStyle){
		strCssRule = strCssRule.replace(/\-(\w)/g, function (strMatch, p1){
			return p1.toUpperCase();
		});
		strValue = oElm.currentStyle[strCssRule];
	}
	return strValue;
}



var menu={
	SHOW:1,
	HIDE:2,
	anims:{},
	heights:{},
	tmr:null,
	tmr2:{},
	show:function(id){
		clearTimeout(menu.tmr2[id]);
		var thismenu=de(id);
		var submenu=de(id+'-1');
		submenu.parent=id;
		submenu.onmouseover=function(e){clearTimeout(menu.tmr2[this.parent]);menu.show(this.parent);}
		submenu.onmouseout=function(e){clearTimeout(menu.tmr2[this.parent]);menu.hide(this.parent);}
		
		if(submenu.style.display==""){
			submenu.style.display="block";
			menu.heights[id]=submenu.offsetHeight;
			submenu.style.display="none";
		}
		if(submenu.style.display=="none") submenu.style.height="0px";
		submenu.style.display='block';
		if(submenu.id=="menuitem6-1"){
			submenu.style.left=(submenu.parentNode.offsetWidth-submenu.offsetWidth)+"px";
		}
		else
		{
			submenu.style.left=getLeft(thismenu)+"px";
		}
		submenu.style.top=(getTop(thismenu)+thismenu.offsetHeight)+"px";
		menu.anims[id+'-1']={type:menu.SHOW}
		menu.anims[id+'-1'].currentHeight=submenu.offsetHeight;
		menu.anims[id+'-1'].targetHeight=menu.heights[id];
	},
	open:function(id){
		menu.show(this.id);
	},
	hide:function(id){
		var submenu=de(id+'-1');
		menu.anims[id+'-1']={currentHeight:1,targetHeight:1,type:menu.HIDE}
		menu.anims[id+'-1'].currentHeight=submenu.offsetHeight;
	},
	close:function(e){
		clearTimeout(menu.tmr2[this.id]);
		menu.tmr2[this.id]=setTimeout("menu.hide('"+this.id+"')",150);
	},
	anim:function(){
		for(id in this.anims){
			switch(this.anims[id].type){
				case menu.SHOW: 
					de(de(id).parent).className=de(de(id).parent).className.replace("sel", "")+"sel";
					this.anims[id].currentHeight=this.anims[id].currentHeight*1.6;
					if(this.anims[id].currentHeight>this.anims[id].targetHeight) this.anims[id].currentHeight=this.anims[id].targetHeight;
					de(id).style.height=this.anims[id].currentHeight+'px';
					if(this.anims[id].currentHeight==this.anims[id].targetHeight) delete(this.anims[id]);
					break;
				case menu.HIDE:
					this.anims[id].currentHeight=this.anims[id].currentHeight/10;
					if(this.anims[id].currentHeight<this.anims[id].targetHeight) this.anims[id].currentHeight=this.anims[id].targetHeight;
					de(id).style.height=this.anims[id].currentHeight+'px';
					if(this.anims[id].currentHeight==this.anims[id].targetHeight){
						de(id).style.display='none';
						de(de(id).parent).className=de(de(id).parent).className.replace("sel", "");
						delete(this.anims[id]);
					}
					break;
			}
		}
		menu.tmr=setTimeout("menu.anim()",10);
	}
}

function menuinit(){
	var lis=et(de('nav-mainmenu'),'li');
	for(var i=0;i<lis.length;i++){
		lis[i].onmouseover=menu.open;
		lis[i].onmouseout=menu.close;
	}

	menu.tmr=setTimeout("menu.anim()",16);
}












(function(){
var containerDims=[500,500];

var brandcontainer=document.getElementById("brandcontainer");

var createBrand=function(image,url,width,height){
	var newBrand=document.createElement("a");
	newBrand.style.width=width+"px";
	newBrand.style.height=height+"px";
	newBrand.style.position="absolute";
	newBrand.style.backgroundImage="url('"+image+"')";
	newBrand.href=url;
	brandcontainer.appendChild(newBrand);
	return newBrand;
}


var currentMatrix=[1,0,0,0,0,1,0,0,0,0,1,-3,0,0,0,1];

var rotateMatrix=function(x,y,z) {
	var cosx=Math.cos(x);
	var sinx=Math.sin(x);
	var cosy=Math.cos(y);
	var siny=Math.sin(y);
	var cosz=Math.cos(z);
	var sinz=Math.sin(z);
	var rotx=[1,0,0,0,0,cosx,-sinx,0,0,sinx,cosx,0,0,0,0,1];
	var roty=[cosy,0,siny,0,0,1,0,0,-siny,0,cosy,0,0,0,0,1];
	var rotz=[cosz,-sinz,0,0,sinz,cosz,0,0,0,0,1,0,0,0,0,1];
	return mulMat4(rotz,mulMat4(rotx,roty));
}

var mulMat4=function(mat2,mat1){
	var a00 = mat1[0], a01 = mat1[1], a02 = mat1[2], a03 = mat1[3];
	var a10 = mat1[4], a11 = mat1[5], a12 = mat1[6], a13 = mat1[7];
	var a20 = mat1[8], a21 = mat1[9], a22 = mat1[10], a23 = mat1[11];
	var a30 = mat1[12], a31 = mat1[13], a32 = mat1[14], a33 = mat1[15];
	
	var b00 = mat2[0], b01 = mat2[1], b02 = mat2[2], b03 = mat2[3];
	var b10 = mat2[4], b11 = mat2[5], b12 = mat2[6], b13 = mat2[7];
	var b20 = mat2[8], b21 = mat2[9], b22 = mat2[10], b23 = mat2[11];
	var b30 = mat2[12], b31 = mat2[13], b32 = mat2[14], b33 = mat2[15];
	return [b00 * a00 + b01 * a10 + b02 * a20 + b03 * a30,
		b00 * a01 + b01 * a11 + b02 * a21 + b03 * a31,
		b00 * a02 + b01 * a12 + b02 * a22 + b03 * a32,
		b00 * a03 + b01 * a13 + b02 * a23 + b03 * a33,
		
		b10 * a00 + b11 * a10 + b12 * a20 + b13 * a30,
		b10 * a01 + b11 * a11 + b12 * a21 + b13 * a31,
		b10 * a02 + b11 * a12 + b12 * a22 + b13 * a32,
		b10 * a03 + b11 * a13 + b12 * a23 + b13 * a33,
		
		b20 * a00 + b21 * a10 + b22 * a20 + b23 * a30,
		b20 * a01 + b21 * a11 + b22 * a21 + b23 * a31,
		b20 * a02 + b21 * a12 + b22 * a22 + b23 * a32,
		b20 * a03 + b21 * a13 + b22 * a23 + b23 * a33,
		
		b30 * a00 + b31 * a10 + b32 * a20 + b33 * a30,
		b30 * a01 + b31 * a11 + b32 * a21 + b33 * a31,
		b30 * a02 + b31 * a12 + b32 * a22 + b33 * a32,
		b30 * a03 + b31 * a13 + b32 * a23 + b33 * a33];
};

var mulMat4Vec4=function(mat1,vec2){
	return [mat1[0]*vec2[0]+mat1[1]*vec2[1]+mat1[2]*vec2[2]+mat1[3]*vec2[3],
			          mat1[4]*vec2[0]+mat1[5]*vec2[1]+mat1[6]*vec2[2]+mat1[7]*vec2[3],
			          mat1[8]*vec2[0]+mat1[9]*vec2[1]+mat1[10]*vec2[2]+mat1[11]*vec2[3],
			          mat1[12]*vec2[0]+mat1[13]*vec2[1]+mat1[14]*vec2[2]+mat1[15]*vec2[3]];
};

var makeFrustum=function(left,right,bottom,top,near,far){
	var x = 2*near/(right-left);
	var y = 2*near/(top-bottom);
	var a = (right+left)/(right-left);
	var b = (top+bottom)/(top-bottom);
	var c = -(far+near)/(far-near);
	var d = -2*far*near/(far-near);
	return [x, 0, a, 0,
		       0, y, b, 0,
		       0, 0, c, d,
		       0, 0, -1, 0];
};

var makePerspective=function(fovy, aspect, near, far){
	var ymax = near * Math.tan(fovy * 0.00872664625972);
	var ymin = -ymax;
	var xmin = ymin * aspect;
	var xmax = ymax * aspect;
	return makeFrustum(xmin, xmax, ymin, ymax, near, far);
};

var brandArray=[
	{brand:"goldring",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/goldring.gif',url:'http://www.google.co.uk'},
	{brand:"myryad",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/myryad.gif',url:'http://www.google.co.uk'},
	{brand:"qacoustics",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/qacoustics.gif',url:'http://www.google.co.uk'},
	{brand:"audica",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/audica.gif',url:'http://www.google.co.uk'},
	{brand:"q2",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/q2.gif',url:'http://www.google.co.uk'},
	{brand:"systemline",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/systemline.gif',url:'http://www.google.co.uk'},
	{brand:"soundstyle",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/soundstyle.gif',url:'http://www.google.co.uk'},
	{brand:"qed",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/qed.gif',url:'http://www.google.co.uk'},
	{brand:"nad",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/nad.gif',url:'http://www.google.co.uk'},
	{brand:"aquavision",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/aquavision.gif',url:'http://www.google.co.uk'},
	{brand:"epson",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/epson.gif',url:'http://www.google.co.uk'},
	{brand:"grado",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/grado.gif',url:'http://www.google.co.uk'},
	{brand:"iport",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/iport.gif',url:'http://www.google.co.uk'},
	{brand:"lutron",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/lutron.gif',url:'http://www.google.co.uk'},
	{brand:"musical",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/musical.gif',url:'http://www.google.co.uk'},
	{brand:"nevo",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/nevo.gif',url:'http://www.google.co.uk'},
	{brand:"sonance",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/sonance.gif',url:'http://www.google.co.uk'},
	{brand:"soundcast",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/soundcast.gif',url:'http://www.google.co.uk'},
	{brand:"tivoli",image:'http://www.armourhomeelectronics.co.uk/themes/armourv2/logos/tivoli.gif',url:'http://www.google.co.uk'}
];

var imgLoading=brandArray.length;

var getPosition=function(i){
	var total=brandArray.length;
	var y=(i/total-0.5)*2;
	var position=[Math.sin(y*10),y,Math.cos(y*10)];
	var size=Math.sqrt(position[0]*position[0]+position[1]*position[1]+position[2]*position[2]);
	return [position[0]/size,position[1]/size,position[2]/size];
}

var imageLoad=function(i){
	var brand=brandArray[i];
	var tmpImg=new Image();
	tmpImg.onload=function(e){
		brand.position=getPosition(i);
		brand.ele=createBrand(brand.image,brand.url,this.width,this.height);
		var pos=mulMat4Vec4(projection,mulMat4Vec4(currentMatrix,[brand.position[0],brand.position[1],brand.position[2],1]));
		brand.ele.style.left=((((pos[0]/pos[3]/2+0.5)*500)|0)-brand.ele.offsetWidth/2)+"px";
		brand.ele.style.top=((((pos[1]/pos[3]/2+0.5)*500)|0)-brand.ele.offsetHeight/2)+"px";
		brand.ele.style.zIndex=(pos[2]/pos[3]-0.9)*300|0;
	};
	tmpImg.src=brand.image;	
	return;
}
for(var i=0;i<brandArray.length;i++) imageLoad(i);

var projection=makePerspective(45, 1, 0.1, 100);
var over=false;
var targetX=0;
var targetY=0;
var currentX=0;
var currentY=0;

brandcontainer.onmousemove=function(e){
	if(!e)e=event;
	targetX=containerDims[0]-e.clientX;
	targetY=containerDims[1]-e.clientY;
}

var timeout=function(){
	if(targetX!=currentX || targetY!=currentY){
		currentX=(currentX-(currentX-targetX)/5)|0;
		currentY=(currentY-(currentY-targetY)/5)|0;
		var roty=currentX/containerDims[0]*2*Math.PI;
		var rotx=currentY/containerDims[1]*2*Math.PI;
		
		var rotMatrix=rotateMatrix(rotx,roty,0);
		
		//update positions of each of the brand elements
		for(var i=0;i<brandArray.length;i++){
			var brand=brandArray[i];
			if(brand.ele && brand.ele.style){
				var pos=mulMat4Vec4(projection,mulMat4Vec4(currentMatrix,mulMat4Vec4(rotMatrix,[brand.position[0],brand.position[1],brand.position[2],1])));
				brand.ele.style.left=((((pos[0]/pos[3]/2+0.5)*500)|0)-brand.ele.offsetWidth/2)+"px";
				brand.ele.style.top=((((pos[1]/pos[3]/2+0.5)*500)|0)-brand.ele.offsetHeight/2)+"px";
				brand.ele.style.zIndex=(pos[2]/pos[3]-0.9)*300|0;
			}
		}
	
	
	}
	setTimeout(timeout,50);
}
timeout();
})();
/*
this kill ie :-(
var bgpos=-100;
var bgfade=function(){
	if(bgpos<0){
		bgpos=bgpos+5;
		document.getElementsByTagName("body")[0].style.backgroundPosition="0px "+bgpos+"px";
	}
	setTimeout(bgfade,50);
}
bgfade();
*/