//	Configuration
var overlayOpacity = 0.8;	// controls transparency of shadow overlay

// -----------------------------------------------------------------------------------

//
//	Global Variables
//
 
overlayDuration = 0.2;

var Projectbox = Class.create();

Projectbox.prototype = {
	
	// initialize()
	// Constructor runs on completion of the DOM loading. Calls updateImageList and then
	// the function inserts html at the bottom of the page which is used to display the shadow 
	// overlay and the image container.
	//
	initialize: function() {	
		
		var objBody = document.getElementsByTagName("body").item(0);
		
		var objOverlay = document.createElement("div");
		objOverlay.setAttribute('id','overlay');
		objOverlay.style.display = 'none';
		objOverlay.onclick = function() { myProjectbox.end(); }
		objBody.appendChild(objOverlay);
		
		var objProjectbox = document.createElement("div");
		objProjectbox.setAttribute('id','projectbox');
		objProjectbox.style.display = 'none';
		objProjectbox.onclick = function(e) {	// close Lightbox is user clicks shadow overlay
			if (!e) var e = window.event;
			var clickObj = Event.element(e).id;
			if ( clickObj == 'projectbox') {
				myProjectbox.end();
			}
		};
		objBody.appendChild(objProjectbox);

		var objProjectContainer = document.createElement("div");
		objProjectContainer.setAttribute('id','projectContainer');
		objProjectbox.appendChild(objProjectContainer);
	},

	
	//
	//	start()
	//	Display overlay and lightbox. If image is part of a set, add siblings to imageArray.
	//
	start: function(projectID, projectType) {
		
		hideSelectBoxes();
		//hideFlash();
		
		new Effect.Appear('overlay', { duration: overlayDuration, from: 0.0, to: overlayOpacity });
		
		$('projectContainer').style.height = '260px';
		$('projectContainer').style.width  = '290px';
		
		// clear innerHTML and make fancy tween
		$('projectContainer').innerHTML = '';
		new Effect.Scale('projectContainer', 200, {scaleX: false, duration: 0.3, queue: 'front', scaleContent: false});
		new Effect.Scale('projectContainer', 200, {scaleY: false, duration: 0.3, queue: 'front', scaleContent: false});
		Element.show('projectbox');
		
		var self = this;
		setTimeout(function(){self.loadContent(projectID, projectType);}, 1500);
	},
	
	loadContent: function(projectID, projectType){
		// Get project data
		// Set script URL and set properties
		var url        = './slider/getData.php';
		
		// Make request
		new Ajax.Request(url, {
			parameters: {
				id:       projectID
			},
			onSuccess: function(transport){
				$('projectContainer').innerHTML = transport.responseText;
			}
		});
		
		var self = this;
		
		
		setTimeout(function(){self.showProjectSlider(projectID, projectType);}, (1500));
		
		/*
		setTimeout(function(){self.showThumb(0);}, (1000));
		setTimeout(function(){self.showThumb(1);}, (1100));
		setTimeout(function(){self.showThumb(2);}, (1200));
		setTimeout(function(){self.showThumb(3);}, (1300));
		setTimeout(function(){self.showThumb(4);}, (1400));
		setTimeout(function(){self.showThumb(5);}, (1500));
		setTimeout(function(){self.showThumb(6);}, (1600));
		setTimeout(function(){self.showThumb(7);}, (1700));
		setTimeout(function(){self.showThumb(8);}, (1800));
		setTimeout(function(){self.showThumb(9);}, (1900));
		*/
	},
	
	showProjectSlider: function(projectID, projectType){
		// Create slider in popup
		var so = new SWFObject('./Flash/slider_'+projectType+'.swf?id='+projectID, 'slider_project', '619', '173', '7');
	    so.addParam('quality', 'best');
	    so.addParam('scale', 'showall');
	    so.addParam('loop', 'true');
	    so.addParam('menu', 'false');
	    so.addParam('wmode', 'transparent');
		so.addVariable('id', projectID);
	    so.write('slider_project');
	},
	
	showThumb: function(id){
		if($('thumb_'+id)){
			new Effect.Appear('thumb_'+id, { duration: 0.5, from: 0.0, to: 100 });
		}
	},
	
	//
	//	end()
	//
	end: function() {
		Element.hide('projectbox');
		new Effect.Fade('overlay', { duration: overlayDuration});
		showSelectBoxes();
		//showFlash();
	},
	
	setImage: function(id){
		srcdiv         = 'image_src_'+id;
		descriptiondiv = 'image_description_'+id;
		$('project_active_image').src    = $(srcdiv).innerHTML;
		$('project_photo').style.display = 'none';
		new Effect.Appear('project_photo');
		$('image_description').innerHTML = $(descriptiondiv).innerHTML;
	}
}


function showSelectBoxes(){
	var selects = document.getElementsByTagName("select");
	for (i = 0; i != selects.length; i++) {
		selects[i].style.visibility = "visible";
	}
}

// ---------------------------------------------------

function hideSelectBoxes(){
	var selects = document.getElementsByTagName("select");
	for (i = 0; i != selects.length; i++) {
		selects[i].style.visibility = "hidden";
	}
}

// ---------------------------------------------------

function showFlash(){
	var flashObjects = document.getElementsByTagName("object");
	for (i = 0; i < flashObjects.length; i++) {
		flashObjects[i].style.visibility = "visible";
	}

	var flashEmbeds = document.getElementsByTagName("embed");
	for (i = 0; i < flashEmbeds.length; i++) {
		flashEmbeds[i].style.visibility = "visible";
	}
}

// ---------------------------------------------------

function hideFlash(){
	var flashObjects = document.getElementsByTagName("object");
	for (i = 0; i < flashObjects.length; i++) {
		flashObjects[i].style.visibility = "hidden";
	}

	var flashEmbeds = document.getElementsByTagName("embed");
	for (i = 0; i < flashEmbeds.length; i++) {
		flashEmbeds[i].style.visibility = "hidden";
	}

}

// ---------------------------------------------------

//
// pause(numberMillis)
// Pauses code execution for specified time. Uses busy code, not good.
// Help from Ran Bar-On [ran2103@gmail.com]
//

function pause(ms){
	var date = new Date();
	curDate = null;
	do{var curDate = new Date();}
	while( curDate - date < ms);
}

function initProjectbox() { myProjectbox = new Projectbox(); }
Event.observe(window, 'load', initProjectbox, false);