// JavaScript Document

var currentTab = new String();

$(document).ready(function() {
	
	// SETUP THE APPEARANCE
	
	// Hide Titles
	$('.gallery-section h2').hide();
	
	// Hide buttons
	$('div.gallery-add').hide();
	
	// Add Dynamic Add button
	$('ul.tabs').append('<li id="addMedia"><a href="#"></a></li>');
	
	// Move Add butons into #addMedia
	$('#addMedia a').replaceWith( $('.gallery-add a') );
	
	//	Attach warning to Pictures Add button
	$('#gallery-pictures-add-link').click(function()
	{
		alert('It may take several moments for the image uploader to load; don\'t worry, this is normal.');
	});
	
	//	Attach listeners to tabs
	$('ul#tabs li a').each( function() {
		$(this).click( function(){
			switchGalleryTab(this);
			$(this).blur();
			//return false;
		});
	});
	
	//	Show the current DIV (ID'd by # in URL, or just the first tab)
	var r=  new RegExp('\\#([a-zA-Z0-9_\\-]+)');
	var res = r.exec(window.location.href);
	if( (res != null) && (res[1].length > 0) )//&& ($('ul#tabs #' + res[1]).length) )	// Test if a DIV exists
	{
		$('ul#tabs #' + res[1] + '-link').click();
	} else {
		$('ul#tabs li:first-child a').click();
	}
	
	
	// Picture Gallery
	// If there are pictures, add the Flash
	var numPics = $('#numPictures').html();
	var gameGuid = $('#gameGuid').html();
	var httpHost = $('#httpHost').html();
	var makeCarousel = $('#carousel').html();
	if(numPics > 0 && makeCarousel)
	{
		var so = new SWFObject("/flash/flipper.swf", "ticker", "600", "230", "8", "#ffffff");
		so.addVariable("guid", gameGuid);
		so.addVariable("host", httpHost);
		so.addParam("wmode", "transparent");
		so.write("gallery-pictures");
		
		$('#gallery-pictures').prepend('<p>Double-click pictures for a larger view.</p>');
	} else {
		$('#gallery-pictures').append('<p>Be the first to <a href="/web/id/' + gameGuid + '/t/1/media_add.php">upload pictures of this game</a>!</p>');
	}
	
	
	
	// VIDEOs
	/*
	// Setup thumbs
	$('#videos li.video').each(function() {
		
		// Gather required info
		var id = $(this).attr('id');
		var vidURL = $('#' + id + ' thumbnail a.vidLink').attr('href');
		var vidThumb = $('#' + id + ' img.vidThumb').attr('src');
		//alert('' + '\n\nID: ' + id + '\nTHUMBNAIL: ' + vidThumb + '\nURL: ' + vidURL);
		
		
		// Make the changes
		$('#' + id + ' .thumbnail').css('background', 'transparent url(' + vidThumb + ') no-repeat scroll left top');
		$('#' + id).addClass('transformed');
	});
	
	// Setup boxes
	$("a[@href*=youtube.com]").click( function(){
		
		//	Add the class
		$(this).parent().parent().addClass('video-playing');
		
		// Build the player
		var href = $(this).attr('href');
		var vidPlayer  = '<div class="videoFull">';
			vidPlayer += '<a href="#" class="videoCloseButton" onclick="return closePlayer(this);">Close</a>';
			vidPlayer += '<object width="300" height="250"><param name="movie" value="../' + href + '&autoplay=1" />';
			vidPlayer += '<param name="autoplay" value="true" />';
			vidPlayer += '<param name="wmode" value="transparent" />';
			vidPlayer += '<param name="allowFullScreen" value="true" />';
			vidPlayer += '<embed src="../' + href + '&autoplay=1" type="application/x-shockwave-flash" autoplay="true" width="300" height="250" wmode="transparent" /></object>';
			vidPlayer += '</div>';
		
		// Add the player
		$(this).parent().append(vidPlayer);
		
		// Remove the background
		$(this).parent().css('background', 'none');
		
		return false;
	});
	
	*/
	
	
});



function closePlayer(el)
{
	// Gather required info
	var id = $(el).parent().parent().parent().attr('id');
	var vidThumb = $('#' + id + ' img.vidThumb').attr('src');
	//alert('' + '\n\nID: ' + id + '\nTHUMBNAIL: ' + vidThumb + '\nURL: ' + vidURL);
	$('#' + id + ' .thumbnail').css('background', 'transparent url(' + vidThumb + ') no-repeat scroll left top');
	
	$(el).parent().parent().parent().removeClass('playing');
	$('#' + id + ' .videoFull').remove();
	return false;
}



/**
 *	Set the active tab by showing the div and setting the active class to the tab
 *	@param		target		(string) The ID of the div of activate
 *	@returns	void
*/
function switchGalleryTab(obj)
{
	// Get the bookmark target, and the text to display
	target = getMark(obj);
	var tmp = target.split('-');
	var targetText = tmp[tmp.length-1];
	
	// Hide all sections
	$('.gallery-section').hide();
	
	// Show the appripriate one
	$('div#' + target).show();
	
	// Remove current class from all 
	$('ul#tabs li').removeClass('current');
	
	// Add CURRENT class to the tab
	$('li#' + target + '-tab').addClass('current');
	
	// Hide the Add links, then show only the current one
	$('#addMedia a').hide();
	$('a#' + target + '-add-link').show();
	
	// Stop playing any videos
	$('#videos .videoFull .videoCloseButton').each(function(){
		closePlayer(this);
	});
		
}



/**
 *	Get the bookmark portion of an anchor's href attribute (i.e. the part after the hash symbol ['#'])
 *	@param		obj		(obj) The object containing the url.
 *	@returns	string	The text after the hash symbol ('#')
*/
function getMark(obj)
{
	var url = new String();
	
	//	Extract the URL
	if( (obj.href) && (typeof(obj.href) == 'string') ) {
		url = obj.href;
	} else if( (obj.target) && (typeof(obj.target) == 'string') ) {
		url = obj.target;
	} else {
		return false;
	}
	
	//	Ensure there is a hash in the URL, otherwise return an empty string
	var hashAt = url.indexOf('#');
	if(hashAt == (-1)) {
		return '';
	}
	
	//	Return the page mark
	return url.substring(hashAt+1);
}



/*

$("a[@href*=youtube.com]").each( function() {
	// YouTube Video Link 
	var linkurl = this.href;
	var videoregex = /[\?\&]v=([^?&]+)/i; // pull the 'v' value out of the querystring
	var arrresult = videoregex.exec(linkurl);
	var videoId = arrresult[1];
	
	var videoThumb = 'http://img.youtube.com/vi/' + videoId + '/default.jpg';
	
	$(this).prepend("<img src=\"/_Images/video_play.png\" alt=\"" + "" + "\" width=\"130\" height=\"97\" /><br />");
	$(this).wrap("<div class=\"videoThumb\" style=\"background-image: url('" + videoThumb + "');\"></div>");
	$(this).wrap("<div class=\"videoHolder\"></div>");
});

$("a[@href*=youtube.com]").click( function() {
	// YouTube Video Link 
	var linkurl = this.href;
	var videoregex = /[\?\&]v=([^?&]+)/i; // pull the 'v' value out of the querystring
	var arrresult = videoregex.exec(linkurl);
	var videoId = arrresult[1];
	
	var videoThumb = $(this).parent();
		videoThumb.addClass("hidden");
	
	var videoOutput	 = '<div class="videoFull">';
		videoOutput += '<div class="videoCloseButton"><a href="#" onclick="$(this).parent().parent().next().removeClass(\'hidden\'); $(this).parent().parent().remove();CSBfleXcroll(\'content\');return false;">Close </a></div>';
		videoOutput += '<object width="275" height="226" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"><param name="movie" value="http://www.youtube.com/v/' + videoId + '&autoplay=1" /><param name="autoplay" value="true" /><param name="wmode" value="transparent" /><embed src="http://www.youtube.com/v/' + videoId + '&autoplay=1" type="application/x-shockwave-flash" autoplay="true" width="275" height="226" wmode="transparent" /></object>';
		videoOutput += '</div>';
	
	var videoHolder = $(this).parent().parent();
		videoHolder.addClass("highest");
		videoHolder.prepend(videoOutput);
	
	CSBfleXcroll('content');

	return false;
});
	
*/
