$(function(){


	var shadowOffset	=	1.08;							// schatten
	var lightswitch		=	$("#poweronoff");						// der schalter
	var menu		= 	$("#menu1");						//das Menu
	
	//die menue-eintrŠge:

	var home = $("#home");
var gigs = $("#gigs");
var music = $("#music");
var info = $("#info");
var pix = $("#pix");
var video = $("#video");
var text = $("#text");
var contact = $("#contact");
var links = $("#links");
var shop = $("#shop");
var myspace = $("#myspace");
var press = $("#press");

	var lightbulb		=	$("#birne1");							// birne1
	var lightbulb2		=	$("#birne2");							// birne2
	var lightCenterX	=	parseInt(lightbulb.width()/2);			// licht xAchse
	var lightCenterY	=	parseInt(lightbulb.height()/2);			// licht yAchse
	var logo			=	$("#logo");									// tanaka-logo
	var lightAlogo		=	$("#birne1, #logo");					// licht und logo container
	var logoCenterX		=	parseInt(logo.width()/2);				// logo xAchse
	var logoCenterY		=	parseInt(logo.height()/2);			// logo yAchse
	var logoshadow		=	$("#logosh");					// schatten container
	var logoShdwCenterX	=	parseInt(logoshadow.width()/2);			// schatten xAchse
	var logoShdwCenterY	=	parseInt(logoshadow.height()/2);		// schatten yAchse
	var statustext		=	$("#box p");					// box text container
	var defaulttxt		=	"Willkommen im Netzwohnzimmer von Tanaka";			// box standard text
	var ontxt			=	"Ob der Schalter funktioniert??";			// box text hover -> "off"
	var offtxt			=	"Strom sparen?!";				// box text hover -> "on"
	var menutxt			=	"Klick mich!";				// box text hover menu

	statustext.text(defaulttxt);							// set box text to default text
	moveShadow();											// start our main function
	
	
	
	
	// making the light and the logo draggable
	lightAlogo.draggable({
		drag: function(event, ui){
			statustext.text("Mach hier keine Unordnung!");	// change the statustext do "dragging + element id" state
			moveShadow();										// our main function which will move the shadow
		},
		stop: function(event, ui){
			statustext.text(defaulttxt);						// switching to default text when stoped draging
		}
	});


	// asinging the things, which should happen, when clicking the light switch
	lightswitch.click(function(){
		if(lightbulb.hasClass("off")){									// when the light bulb has the class "off" do following:
			lightbulb.removeClass("off");									// first remove the class "off"
			lightswitch.css("backgroundPosition","0 0");					// change the background position of the CSS sprite
			
			logoshadow.stop().fadeTo(750,setOpacity(shadowDistance));		// showing the shadow of the logo with a fading animation
			lightbulb2.stop().fadeTo(750,1);								// fade in the inner light bulb container (light is turned on!)
			
			statustext.text(offtxt);										// changing the status text to the "off text"
		}else{															// else do following:
			lightbulb.addClass("off");										// adding the class "off"
			lightswitch.css("backgroundPosition","-80px 0");				// move the background position of the switch back to original position
			logoshadow.stop().fadeTo(750,0);								// fade out the logo shadow
			lightbulb2.stop().fadeTo(750,0);								// fade out the turned on light (no more lights now)
			statustext.text(ontxt);											// changing the status text to the "on text"
		}
	});
	
	
	
	// changing the infotext when hovering the switch
	lightswitch.hover(function(){
		if(lightbulb.hasClass("off")){
			statustext.text(ontxt);			// when lightbulb has the class "off" show this text
		}else{
			statustext.text(offtxt);		// otherwise show this text
		}
	},function(){
		statustext.text(defaulttxt);		// hovering out will show the default text again
	});




	
	// infotext aendern bei hover auf menu-eintrŠge:
	home.hover(function(){
		statustext.text("Neuigkeiten");	
	},function(){
		statustext.text(defaulttxt);	// default text
	});


	gigs.hover(function(){
		statustext.text("Konzerte");	
	},function(){
		statustext.text(defaulttxt);	// default text
	});

	music.hover(function(){
		statustext.text("Tanakamusik");	
	},function(){
		statustext.text(defaulttxt);	// default text
	});

	info.hover(function(){
		statustext.text("Informationen");	
	},function(){
		statustext.text(defaulttxt);	// default text
	});

	pix.hover(function(){
		statustext.text("Bilder");	
	},function(){
		statustext.text(defaulttxt);	// default text
	});

	video.hover(function(){
		statustext.text("Videos auf YouTube");	
	},function(){
		statustext.text(defaulttxt);	// default text
	});

	text.hover(function(){
		statustext.text("Texte zum auswendig lernen und mitsingen");	
	},function(){
		statustext.text(defaulttxt);	// default text
	});

	contact.hover(function(){
		statustext.text("Kontaktinformationen");	
	},function(){
		statustext.text(defaulttxt);	// default text
	});

	links.hover(function(){
		statustext.text("Links");	
	},function(){
		statustext.text(defaulttxt);	// default text
	});

	shop.hover(function(){
		statustext.text("T-Shirts kaufen bei Spreadshirt");	
	},function(){
		statustext.text(defaulttxt);	// default text
	});

	myspace.hover(function(){
		statustext.text("Unsere MySpace-Seite");	
	},function(){
		statustext.text(defaulttxt);	// default text
	});

	press.hover(function(){
		statustext.text("Bandfotos, Infos, Rider...");	
	},function(){
		statustext.text(defaulttxt);	// default text
	});

	




	// calculating the shadow opacity according to the light bulb distance
	function setOpacity(getDistance){
		if(lightbulb.hasClass("off")){
			return 0;								// if the lightbulb has the class "off", opacity = 0 (no shadow)
		}else{
			return (1.2 - getDistance /1000);		// otherwise we calculate a suitable shadow opacity with this formular
		}
	}
	
	// the main function - our shadow mover
	function moveShadow(){
			// save the current X position of the light bulb
		lightX			=	parseInt(lightbulb.offset().left) + lightCenterX;
			// save the current Y position of the light bulb
		lightY			=	parseInt(lightbulb.offset().top) + lightCenterY;
			// save the current X position of the logo
		logoX			=	parseInt(logo.offset().left) + logoCenterX;
			// save the current Y position of the logo
		logoY			=	parseInt(logo.offset().top) + logoCenterY;
			// save the value how far the logo is away from the light bulb on the X-axis
		distanceX		=	logoX - lightX;
			// save the value how far the logo is away from the light bulb on the Y-axis
		distanceY		=	logoY - lightY;
			// calculating and saving the value of the square root of those two distance values
		distance		=	Math.sqrt(Math.pow(distanceX, 2) + Math.pow(distanceY, 2));
			// calculating and saving the shadow distance with the offset we defined in our variables 
		shadowDistance	=	distance * shadowOffset;
			// preparing the CSS value to put into the "left" attribute of the shadow container
		shadowPosLeft	=	(distanceX / distance * shadowDistance + lightX - logoShdwCenterX) + "px";
			// preparing the CSS value to put into the "top" attribute of the shadow container
		shadowPosTop	=	(distanceY / distance * shadowDistance + lightY - logoShdwCenterY) + "px";
			// finaly using the results of all above calculations to position our shadow and set the opacity
		logoshadow.css({ "left": shadowPosLeft, "top": shadowPosTop, "opacity": setOpacity(shadowDistance) });
	}
	
	
});