/**
 *	This class manages the display and behavior of an event
 *	schedule slideout.
 *
 *	Requirements: Prototype / Scriptaculous
 */
 
 function EventSlideout(slideoutID, hideDelay, skin) {
 	/** Properties *******************************************************/
	var slideoutID = slideoutID;
	var currEventID = null;
	var hideTimeout = 0;
	if (skin)
		var skin = skin;
	else
		var skin = "blue";
	var showObject = false;
	var showCallback = function() { };
	var hideCallback = function() { };

	if (hideDelay != null)
		hideTimeout = hideDelay;

	preload();

	/** Public Functions *************************************************/
	/** Displays the slideout and loads the given event into the display */
	this.showSlideout = function showSlideout(eventID, contentData) {

		if (eventID && (currEventID != eventID)) {
			// Execute the callback if it exists
			showCallback();

			// Load variables for the display skin
			var skin = this.loadSkin();
	
			// Load the content data for the slideout
			if (contentData != null) {
				// Clean content data
				if (! contentData.type) {
					contentData.type = "blank";
				}
				// Initialize and clear the slideout content
				var headerElement = document.getElementById(slideoutID + "-Header");
				var contentElement = document.getElementById(slideoutID + "-Content");
				headerElement.innerHTML = "";
				contentElement.innerHTML = "";
	
				// Create the new slideout header	
				var headerImage = skin.imageDir + "/header-" + contentData.type + ".jpg";
				headerElement.innerHTML += '<img src="' + headerImage + '" alt="UFC Events" />';
	
				if (contentData.video != "") {
					// Show flash video
					var flashURL = "/includes/flash/flvplayer.swf?autostart=false&file=" + contentData.video;
					flashURL += "&image=/images/slideout/main/play-now.jpg";
	
					headerElement.innerHTML += '<div id="' + slideoutID + '-Flash" class="feature"><strong>Flash Video</strong></div>';
					var so = new SWFObject(flashURL, "mymovie", "200", "150", "7", "#336699");
					so.addParam("wmode", "transparent");
					so.write(slideoutID + "-Flash");
				}
				else if (contentData.topImage != "") {
					// Show banner image
					headerElement.innerHTML = '<img class="feature" src="' + contentData.topImage + '" />';
				}

				contentElement.innerHTML = document.getElementById("EventContent-" + eventID).innerHTML;
			}

			currEventID = eventID;
		}

		// Update the slideout visibility
		showObject = true;
		updateVisibility();
	}

	/** Hides the slideout */
	this.hideSlideout = function hideSlideout(skipDelay) {
		if (hideCallback != null) {
			hideCallback();
		}
		showObject = false;
		if (skipDelay) 
			updateVisibility();
		else
			setTimeout(function() { updateVisibility() }, hideTimeout);
	}

	/** Creates a structure of display attributes according to the set skin */
	this.loadSkin = function loadSkin() {
		var result = {
			imageDir : "images/slideout/banner-slide"
		};
		if (skin == "red") {
			result.imageDir = "images/slideout/event-slide"
		}

		return result;
	}

	this.setShowCallback = function setShowCallback(callback) {
		showCallback = callback;
	}

	this.setHideCallback = function setHideCallback(callback) {
		hideCallback = callback;
	}

	/** Private Functions ***********************************************/
	/** Updates the visibility of the slideout based on showObject */
	function updateVisibility() {
		var slideout = document.getElementById(slideoutID);
		if (showObject) {
//			if (! slideout.style.display == "block") {
				slideout.style.display = "block";
//			}
		}
		else {
			slideout.style.display = "none";
			currEventID = null;
		}
	}

	/** Preloads all slideout template images. */
	function preload() {
		if (document.images) {
			if (skin == "red") {
				var images = [
					"/images/slideout/event-slide/bg_topBody.gif",
					"/images/slideout/event-slide/eventBfly_bknd.jpg",
					"/images/slideout/event-slide/eventBfly_bot.jpg",
					"/images/slideout/event-slide/buy-tickets-button.jpg",
					"/images/slideout/event-slide/eventBfly_imgBknd.jpg",
					"/images/slideout/event-slide/eventBfly_imgBot.jpg"
				];
			}
			else {
				var images = [
					"/images/slideout/banner-slide/bg_topBody.gif",
					"/images/slideout/banner-slide/eventTfly_bknd.jpg",
					"/images/slideout/banner-slide/eventTfly_bot.jpg",
					"/images/slideout/banner-slide/buy-tickets-button.jpg",
					"/images/slideout/banner-slide/eventTfly_imgBknd.jpg",
					"/images/slideout/banner-slide/eventTfly_imgBot.jpg"
				];
			}

			var preloaderImage = new Image();
			for (var i = 0; i < images.length; i++) {
				preloaderImage.src = images[i];
			}
		}
	}
 }