// teh magic JavaScript Document
$(document).ready(function(){

working = "ready"; // Set the working variable to ready, this allows us to track if the script is processing or not

     $('#ground-floor').click(function(){
		if(working == "ready") {
		working = "working"; // working var to 'working', this will be reset to 'ready' upon execution of the groundfloor() function, this stops the user clicking multiple floors
		$('#stage-controller .floor-block-active').removeClass("floor-block-active");
		$('#ground-floor').removeClass("floor-block-inactive"); 
		$('#ground-floor').addClass("floor-block-active");
         groundfloor();
		}
     });
     $('#first-floor').click(function(){
		if(working == "ready") {
		working = "working";
		$('#stage-controller .floor-block-active').removeClass("floor-block-active");
		$('#first-floor').removeClass("floor-block-inactive"); 
		$('#first-floor').addClass("floor-block-active");
         firstfloor();
		}
     });
     $('#second-floor').click(function(){
		if(working == "ready") {
		working = "working";
		$('#stage-controller .floor-block-active').removeClass("floor-block-active");
		$('#second-floor').removeClass("floor-block-inactive"); 
		$('#second-floor').addClass("floor-block-active");
         secondfloor();
		}
     });
     $('#third-floor').click(function(){
		if(working == "ready") {
		working = "working";
		$('#stage-controller .floor-block-active').removeClass("floor-block-active");
		$('#third-floor').removeClass("floor-block-inactive"); 
		$('#third-floor').addClass("floor-block-active");
         thirdfloor();
		}
     });

	$("area").easyTooltip({
		xOffset: 0, 
		yOffset: 80
	});

});

function groundfloor() {
	$('.stage-active').fadeOut("slow", function() { 
		$('.stage-active').removeClass("stage-active"); 
		$('#ground-stage').addClass("stage-active"); 
		$('#ground-stage').fadeIn();
		working = "ready";
		});
}

function firstfloor() {
	$('.stage-active').fadeOut("slow", function() { 
		$('.stage-active').removeClass("stage-active"); 
		$('#first-stage').addClass("stage-active"); 
		$('#first-stage').fadeIn();
		working = "ready";
		});
}

function secondfloor() {
	$('.stage-active').fadeOut("slow", function() { 
		$('.stage-active').removeClass("stage-active"); 
		$('#second-stage').addClass("stage-active"); 
		$('#second-stage').fadeIn();
		working = "ready";
		});
}

function thirdfloor() {
	$('.stage-active').fadeOut("slow", function() { 
		$('.stage-active').removeClass("stage-active"); 
		$('#third-stage').addClass("stage-active"); 
		$('#third-stage').fadeIn();
		working = "ready";
		});
}


// The following two functions toggle the display property of the plots, highlighting them green when interacted with 

function activateImg(theplot) {
	$(theplot).show();	
}

function deactivateImg(theplot) {
	$(theplot).hide();	
}