var img_base = '/img/virtual_tour/';
var $canvas;
var $background;
var $loader;
var tour;
var virtualTourData = {
		victorian: [
		            {url: img_base + 'victorian/tv01.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv03.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv04.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv05.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv06.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv07.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv08.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv09.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv10.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv12.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv13.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv14.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv15.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv16.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv17.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv18.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv19.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv20.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv21.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv22.jpg', title: 'The students in the Victorian Farmhouse' },
		            {url: img_base + 'victorian/tv23.jpg', title: 'The students in the Victorian Farmhouse' }
		            ],
        outdoor: [
                  {url: img_base + 'outdoor/to01.jpg', title: 'The students enjoying our outdoor activities' },
                  {url: img_base + 'outdoor/to02.jpg', title: 'The students enjoying our outdoor activities' },
                  {url: img_base + 'outdoor/to03.jpg', title: 'The students enjoying our outdoor activities' },
                  {url: img_base + 'outdoor/to04.jpg', title: 'The students enjoying our outdoor activities' },
                  {url: img_base + 'outdoor/to05.jpg', title: 'The students enjoying our outdoor activities' },
                  {url: img_base + 'outdoor/to06.jpg', title: 'The students enjoying our outdoor activities' },
                  {url: img_base + 'outdoor/to07.jpg', title: 'The students enjoying our outdoor activities' },
                  {url: img_base + 'outdoor/to08.jpg', title: 'The students enjoying our outdoor activities' },
                  {url: img_base + 'outdoor/to09.jpg', title: 'The students enjoying our outdoor activities' },
                  {url: img_base + 'outdoor/to10.jpg', title: 'The students enjoying our outdoor activities' },
                  {url: img_base + 'outdoor/to11.jpg', title: 'The students enjoying our outdoor activities' }
                  ],
      	redbarn: [
      	          {url: img_base + 'redbarn/tR01.jpg', title: 'The students in the Red Barn' },
      	          {url: img_base + 'redbarn/tR02.jpg', title: 'The students in the Red Barn' },
      	          {url: img_base + 'redbarn/tR03.jpg', title: 'The students in the Red Barn' },
      	          {url: img_base + 'redbarn/tR04.jpg', title: 'The students in the Red Barn' },
      	          {url: img_base + 'redbarn/tR05.jpg', title: 'The students in the Red Barn' },
      	          {url: img_base + 'redbarn/tR06.jpg', title: 'The students in the Red Barn' },
      	          {url: img_base + 'redbarn/tR07.jpg', title: 'The students in the Red Barn' },
      	          {url: img_base + 'redbarn/tR08.jpg', title: 'The students in the Red Barn' },
      	          {url: img_base + 'redbarn/tR09.jpg', title: 'The students in the Red Barn' },
      	          {url: img_base + 'redbarn/tR10.jpg', title: 'The students in the Red Barn' },
      	          {url: img_base + 'redbarn/tR11.jpg', title: 'The students in the Red Barn' },
      	          {url: img_base + 'redbarn/tR12.jpg', title: 'The students in the Red Barn' },
      	          {url: img_base + 'redbarn/tR13.jpg', title: 'The students in the Red Barn' },
      	          {url: img_base + 'redbarn/tR14.jpg', title: 'The students in the Red Barn' }
      	          ],
	    greenfarm: [
	              {url: img_base + 'greenfarm/tG01.jpg', title: 'The students in the Green Farmhouse' },
	              {url: img_base + 'greenfarm/tG02.jpg', title: 'The students in the Green Farmhouse' },
	              {url: img_base + 'greenfarm/tG03.jpg', title: 'The students in the Green Farmhouse' },
	              {url: img_base + 'greenfarm/tG04.jpg', title: 'The students in the Green Farmhouse' },
	              {url: img_base + 'greenfarm/tG05.jpg', title: 'The students in the Green Farmhouse' },
	              {url: img_base + 'greenfarm/tG06.jpg', title: 'The students in the Green Farmhouse' },
	              {url: img_base + 'greenfarm/tG07.jpg', title: 'The students in the Green Farmhouse' },
	              {url: img_base + 'greenfarm/tG08.jpg', title: 'The students in the Green Farmhouse' },
	              {url: img_base + 'greenfarm/tG09.jpg', title: 'The students in the Green Farmhouse' },
	              {url: img_base + 'greenfarm/tG10.jpg', title: 'The students in the Green Farmhouse' },
	              {url: img_base + 'greenfarm/tG11.jpg', title: 'The students in the Green Farmhouse' },
	              {url: img_base + 'greenfarm/tG12.jpg', title: 'The students in the Green Farmhouse' },
	              {url: img_base + 'greenfarm/tG13.jpg', title: 'The students in the Green Farmhouse' },
	              {url: img_base + 'greenfarm/tG14.jpg', title: 'The students in the Green Farmhouse' }
	              ],
      middleschool: [
                     {url: img_base + 'middleschool/ms01.jpg', title: 'The activities at Oak Bridge Montessori Middle School' },
                     {url: img_base + 'middleschool/ms02.jpg', title: 'The activities at Oak Bridge Montessori Middle School' },
                     {url: img_base + 'middleschool/ms03.jpg', title: 'The activities at Oak Bridge Montessori Middle School' },
                     {url: img_base + 'middleschool/ms04.jpg', title: 'The activities at Oak Bridge Montessori Middle School' },
                     {url: img_base + 'middleschool/ms05.jpg', title: 'The activities at Oak Bridge Montessori Middle School' },
                     {url: img_base + 'middleschool/ms06.jpg', title: 'The activities at Oak Bridge Montessori Middle School' },
                     {url: img_base + 'middleschool/ms07a.jpg', title: 'The activities at Oak Bridge Montessori Middle School' },
                     {url: img_base + 'middleschool/ms07b.jpg', title: 'The activities at Oak Bridge Montessori Middle School' },
                     {url: img_base + 'middleschool/ms08.jpg', title: 'The activities at Oak Bridge Montessori Middle School' },
                     {url: img_base + 'middleschool/ms09.jpg', title: 'The activities at Oak Bridge Montessori Middle School' },
                     {url: img_base + 'middleschool/ms10.jpg', title: 'The activities at Oak Bridge Montessori Middle School' },
                     {url: img_base + 'middleschool/ms11.jpg', title: 'The activities at Oak Bridge Montessori Middle School' },
                     {url: img_base + 'middleschool/ms12.jpg', title: 'The activities at Oak Bridge Montessori Middle School' },
                     {url: img_base + 'middleschool/ms13.jpg', title: 'The activities at Oak Bridge Montessori Middle School' },
                     {url: img_base + 'middleschool/ms14.jpg', title: 'The activities at Oak Bridge Montessori Middle School' },
                     {url: img_base + 'middleschool/ms15.jpg', title: 'The activities at Oak Bridge Montessori Middle School' }
                     ]
};

$(function(){
	$canvas = $('#virtual_tour_canvas');
	$background = $('#virtual_tour_background').hide();
	$loader = $('#virtual_tour_loading').css('z-index','1000');

	tour = new Tour($canvas);
	
	var bgImg = new Image();
	startedLoadingImage();
	$(bgImg).load(function(){
		/*Overlay Images*/
		tour.addOverlay(TourRect( 69,  27, 60, 80), 
                    TourOverlay('victorian_over.png',    69,  27));
		tour.addOverlay(TourRect(266,  27, 130, 110), 
                    TourOverlay('outdoor_over.png',     266,  27));
		tour.addOverlay(TourRect(370,  35, 162, 110), 
                    TourOverlay('outdoor2_over.png',    370,  35));
		tour.addOverlay(TourRect( 18, 133, 118, 102), 
                    TourOverlay('farmhouse1_over.png',   18, 133));
		tour.addOverlay(TourRect(382, 151, 75, 43), 
                    TourOverlay('redbarn_over.png',     382, 151));
		tour.addOverlay(TourRect(280, 160, 71, 75), 
                    TourOverlay('redbarn2_over.png',    280, 160));
		tour.addOverlay(TourRect(315, 229, 30, 30), 
                    TourOverlay('redbarn3_over.png',    315, 229));
		tour.addOverlay(TourRect(382, 213, 136, 71), 
                    TourOverlay('redbarn4_over.png',    382, 213));
		tour.addOverlay(TourRect( 60, 305, 116, 63), 
                    TourOverlay('entrance_over.png',     60, 305));
		tour.addOverlay(TourRect(166, 271, 122, 92), 
                    TourOverlay('farmhouse2_over.png',  166, 271));
		tour.addOverlay(TourRect(396, 288, 118, 61), 
                    TourOverlay('middle_over.png',      396, 288));
		
		/*Overlay Titles/Links*/
		tour.addOverlay(TourRect(124,  12, 167, 20,'victorian'),
                    TourOverlay('victorian_overlay.gif',  124, 12));
		tour.addOverlay(TourRect(222, 137, 126, 20,'outdoor'),
                    TourOverlay('outdoor_overlay.gif',    222, 137));
		tour.addOverlay(TourRect(346, 197,  96, 20,'redbarn'),
                    TourOverlay('redbarn_overlay.gif',    346, 197));
		tour.addOverlay(TourRect(85,  250, 146, 20,'greenfarm'),
                    TourOverlay('greenfarm_overlay.gif',  85, 250));
		tour.addOverlay(TourRect(301, 319, 234, 49,'middleschool'),
                    TourOverlay('middle_overlay.gif',     301, 319));
		
		$background.append(this);
		finishedLoadingImage();
	}).attr('src','/img/virtual_tour/full_bg.jpg');
});





function Tour(elem) {
	this.element=elem;
	this.overlays=new Array();
	this.links={};
	
	
	this.addOverlay = function(trigger,element){
		triger = $(trigger);
		element = $(element);
		
		trigger.attr('overlay_index',this.overlays.length);
		this.overlays[this.overlays.length]=element;
		$(trigger).hover(function(){tour.showOverlay(this);},function(){tour.hideOverlay(this)});
	};
	
	this.showOverlay = function(trigger){
		trigger = $(trigger);
		element = this.overlays[trigger.attr('overlay_index')];
		element.stop().show().animate({opacity:1});
	}

	this.hideOverlay = function(trigger){
		trigger = $(trigger);
		element = this.overlays[trigger.attr('overlay_index')];
		element.stop().animate({opacity:0});
	}
	return true;
}



function TourOverlay(src,x,y,link){
	$this = $('<div></div>');
	$this.css('z-index','100');
	$this.css('display','block');
	$this.css('opacity','0');
	$this.css('position','absolute');
	$this.css('left',x+'px');
	$this.css('top',y+'px');
	var img = new Image();
	startedLoadingImage();
	var $img = $(img);
	$img.load(function(){
		finishedLoadingImage();
	});
	$img.attr('src',img_base+src);
	
	$this.append($img);
	$canvas.append($this);
	return $this;
}
function TourRect(x,y,w,h,link){
	var $this = $('<a></a>');
	$this.css('z-index','200');
	$this.css('display','block');
	$this.css('position','absolute');
	$this.css('left',x+'px');
	$this.css('top',y+'px');
	$this.css('width',w+'px');
	$this.css('height',h+'px');
	//$this.css('border','1px solid red');
	$this.css('background','url(/img/transparent.gif)');
	if(link!=undefined && virtualTourData[link]!=undefined){
		//$this.click(function(){tourShow(link);});
		$this.attr('href',virtualTourData[link][0]['url']);
		$this.attr('rel',link);
		$this.lightbox({
			fitToScreen: true,
			jsonData: virtualTourData[link],
		    loopImages: true,
		    imageClickClose: false,
		    disableNavbarLinks: false,
		    autoPlayInterval:5000,
		    hideNavLinks: false
		});
		$this.css('cursor','pointer');
	}
	
	$canvas.append($this);
	return $this;
}


var globalImageLoadCount=0;
function startedLoadingImage(){
	globalImageLoadCount++;
}
function finishedLoadingImage(){
	globalImageLoadCount--;
	if(globalImageLoadCount<=0){
		$loader.fadeOut().css('z-index','-100');
		$background.fadeIn();
	}
}

function tourShow(link){
	
}