/* photo gallery  */
function gallery(increment, visibleItems) {
	if ($j("#gallery").length == 1)
	{

	//Add buttons to scroll the gallery
	$j("#thumbs").prepend("<span id='scrollUp'><a href='#next'>Scroll Up</a></span>");
	$j("#thumbs").append("<span id='scrollDown'><a href='#previous'>Scroll Down</a></span><p id='counter'></p>");

	//Add Container for media and text
	$j("#gallery").prepend("<div id='showcase'></div>");	
	$j("#showcase").prepend("<div id='media'><div id='imageWrapper'></div></div>");
	$j("#showcase").append("<h3></h3><div class='caption'></div>");

	//Wrap the ul in a holder tag
	$j("#thumbs ul").wrap("<div id='slideHolder'></div>");
	var totalImages = $j("#thumbs li").length;
	var galleryItem = $j("#thumbs li:first");
	
	//Get the size of each item and any margin, padding, or border
	var totalDimensions;
	var itemSize = galleryItem.height();
	totalDimensions = new Array("margin-top", "margin-bottom", "padding-top", "padding-bottom", "border-top", "border-bottom");

	var incrementAmount = increment * itemSize;
	var visibleItemsSize = visibleItems * itemSize;
	var maxOffset = (totalImages * itemSize) - visibleItemsSize;


	//Add events to the scroll buttons
	var target = $j("#thumbs ul");
	var imageSet = 1;
	var curImage = 0
	$j("#scrollUp").click(function() {
		scroll(target, "top", incrementAmount, maxOffset);
		imageSet --;
		curImage = curImage - visibleItems
			if (curImage < 0)
			{
			curImage = 0
			}
			$j("#counter").html("Displaying " +(curImage + 1)+ " - " +(curImage + visibleItems)+ " <span>(of " +totalImages+ ")</span>")
		return false;
	});
	$j("#scrollDown").click(function() {
		scroll(target, "bottom", incrementAmount, maxOffset);
		imageSet ++;
		curImage = curImage + visibleItems
		if (curImage >= totalImages - visibleItems)
		{
			curImage = totalImages - visibleItems
		}	
			$j("#counter").html("Displaying " +(curImage + 1)+ " - " +(curImage + visibleItems)+ " <span>(of " +totalImages+ ")</span>")
		return false;
	});

	var totalItems = $j("#thumbs li").length;
	var counter = 0;

	// Make first gallery item active by default
	$j("#thumbs li:first").each(function() {
		var link = $j(this).children("a").attr("href");
		var thumbSrc = $j(this).children("a").children("span").children("img").attr("src");
		var altText = $j(this).children("a").children("img").attr("alt");
		var title = $j(this).children("a").children("strong").text();
		var text = $j(this).children("div").html();
		if(thumbSrc != null) var newThumbSrc = link;

		$j("#counter").html("Displaying " +1+ " - " +visibleItems+ " <span>(of " +totalImages+ ")</span>")
		$j(this).siblings().removeClass("active");
		$j(this).addClass("active");
		
		var mediaContent = getMediaContent($j(this));
		addMediaToPage($j(this), 1, totalItems, mediaContent, title, text);

		$j("#showcase h3").text(title);
		$j("#showcase div.caption").html(text);
		
	});

//	var $jthumbs = $j("#thumbs li")
//	$jthumbs.each(function() {
//		counter ++;
//		var itemNumber = counter;
//
//		var title = $j(this).children("a").children("strong").text();	
//		var text = $j(this).children("a").children("em").text();		
//		var mediaContent = getMediaContent($j(this));
//
//		//When thumbnail clicked, set as active item and load content into main display area
//		$j(this).click(function() {
//			addMediaToPage($j(this), itemNumber, totalItems, mediaContent, title, text);
//			return false;
//		});
//
//		//Add hover effect to gallery items
//		$j(this).mouseover(function() {
//			$j(this).addClass("jsHover");
//		});
//		$j(this).mouseout(function() {
//			$j(this).removeClass("jsHover");
//		});
//		this.onclick = function() { return false; };
//	});







	var $jthumbs = $j("#thumbs li")
	$jthumbs.each(function() {
		counter ++;
		var itemNumber = counter;

		var title = $j(this).children("a").children("strong").text();	
		var text = $j(this).children("div").html();		
		var mediaContent = getMediaContent($j(this));

		//When thumbnail clicked, set as active item and load content into main display area
		$j(this).click(function() {
			addMediaToPage($j(this), itemNumber, totalItems, mediaContent, title, text);
			return false;
		});

		//Add hover effect to gallery items
		$j(this).mouseover(function() {
			$j(this).addClass("jsHover");
		});
		$j(this).mouseout(function() {
			$j(this).removeClass("jsHover");
		});
		this.onclick = function() { return false; };
	});







}
}

/* 
 * parse the media url and determine the type of media file
 * return the appropriate html to display the media
 */
function getMediaContent(el) {
	var link = el.children("a").attr("href");
	var altText = el.children("a").children("img").attr("alt");

	var splitLink = link.split("?");
	var end = splitLink[0].lastIndexOf(".");
	var mediaType = splitLink[0].substring(end+1);
	var height, width;
	var mediaContent;

	
		//Generate code based on the type of media to be displayed
		switch(mediaType) {


			//Flash
			case "swf":
				//Get all the parameters for the flash movie
				var urlParams = link.split("?");
				link = urlParams[0];
				var properties = getQueryString(urlParams[1]);
				
				width = properties['width'];
				height = properties['height'];
				
				//If dimensions not defined or too large then set to max size
				if(!height || height > 340) height = 340;
				if(!width || width > 540) width = 540;
				
				//flashVars = 'var1='+ properties['var1'];

				//mediaContent = '<object class="item" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" height="' + height + '" width="' + width + '" align="top">'+
				//'<param value="noscale" name="scale"/>'+
				//'<param name="movie" value="'+ link +'">'+
				//'<param name="quality" value="high">'+
				//'<param value="'+ flashVars +'" name="flashvars"/>'+
				//'<embed flashvars="'+ flashVars +'" height="' + height + '" pluginspage="http://www.macromedia.com/go/getflashplayer" src="' + link + '" type="application/x-shockwave-flash" width="' + width + '" quality="high">'+
				//'<\/embed><\/object>';

				if(properties['isStream'] == 0)
                {
				    flashVars = "config={'key':'#$28d4f4f3f205e518e4a','clip':{'url':'" + properties['var1'] + "'}, 'plugins':{'controls': { 'url': 'flowplayer.controls-3.1.4.swf'}}}";
				    
				    mediaContent = '<object id="flowplayer" height="' + height + '" width="' + width + '" align="top" data="/mediaPlayers/flowplayer.commercial-3.1.4.swf" type="application/x-shockwave-flash">' +
	                '<param name="movie" value="/mediaPlayers/flowplayer.commercial-3.1.4.swf" />' +
	                '<param name="allowfullscreen" value="true" />' +
	                '<param name="flashvars" value="'+ flashVars + '"/> </object>';
	             
                }
                else
                {
                    // use the rtmp stream player / plugin
				    flashVars = "config={'key':'#$28d4f4f3f205e518e4a','clip':{'url':'" + properties['var1'] + "','provider':'rtmp','autoPlay':true}, 'plugins':{'rtmp':{'url':'flowplayer.rtmp-3.1.3.swf','netConnectionUrl':'rtmp://adobeflash.wooster.edu/vod'}, 'controls': {  'url': 'flowplayer.controls-3.1.4.swf'}}}";
				
				    mediaContent = '<object id="flowplayer" height="' + height + '" width="' + width + '" align="top" data="/mediaPlayers/flowplayer.commercial-3.1.4.swf" type="application/x-shockwave-flash">' +
	                '<param name="movie" value="/mediaPlayers/flowplayer.commercial-3.1.4.swf" />' +
	                '<param name="allowfullscreen" value="true" />' +
	                '<param name="flashvars" value="'+ flashVars + '"/> </object>';
				}
				break;

			//Images
			case "ashx":
			case "jpg":
			case "jpeg":
			case "gif":
			case "png":
			case "bmp":
				mediaContent = '<img alt="' +  altText + '" class="item" src="' + link + '" />';
				break;

		}
	return mediaContent;

		//When thumbnail clicked, set as active item and load content into main display area
		$j(this).click(function() {
			addMediaToPage($j(this), itemNumber, totalItems, mediaContent, title, text);
			return false;
		});

		//Add hover effect to gallery items
		$j(this).mouseover(function() {
			$j(this).addClass("jsHover");
		});
		$j(this).mouseout(function() {
			$j(this).removeClass("jsHover");
		});
		this.onclick = function() { return false; };
}

/*
 * After all the work has been done, this will add the html to the page
 * It also removes any existing media in the showcase
 */
function addMediaToPage(el, itemNumber, totalItems, mediaContent, title, text) {
	//Display Counter
	$j("#showcase").empty();
	$j("#showcase").prepend("<div id='media'><div id='imageWrapper'></div></div>");
	$j("#showcase").append("<h3></h3><div class='caption'></div>");

	//Set current item as active
	el.siblings().removeClass("active");
	el.siblings().removeClass("jsHover");
	el.addClass("active");

	//Remove existing content
	try {
		document.gallery-media.Stop();
	}
	catch(e){}
	$j("#imageWrapper .item").css("display", "none");
	$j("#imageWrapper").empty();
	
	//Add new content
	document.getElementById("imageWrapper").innerHTML = mediaContent;
	$j("#showcase h3").text(title);
	$j("#showcase div.caption").html(text);
	
	//Remove existing content
	try {
		document.gallery-media.Stop();
	}
	catch(e){}
	$j("#imageWrapper .item").css("display", "none");
	$j("#imageWrapper").empty();
	//Add new content
	document.getElementById("imageWrapper").innerHTML = mediaContent;
	$j("#showcase h3").text(title);
	$j("#showcase div.caption").html(text);
	
}

/*
 * Get the dimensions of the media content from a query string
 * Returns an array containing width and height
 */
function getDimensions(params) {
	var dim = new Array();
	params = params.split("&");
	dim[0] = params[1].substring(6);
	dim[1] = Number(params[0].substring(7)) + 16;
	return dim;
}

function getQueryString(params) {
	var props = new Array();
	
	$j(params.split("&")).each(function(i) {
		var param = this.split("=");
		props[param[0]] = param[1];
	});

	return props;
}

/*
 * Scroll the gallery the required amount in the specified direction
 */
function scroll(container, direction, amount, maxOffest) {
	var cur = container.css("top");

	if(cur == "auto") cur = 0;
	else cur = Number(cur.replace("px", ""));

	switch(direction) {
		case "top":
			cur = cur + amount;
			if(cur > 0) cur = 0;
			break;
		case "bottom":
			cur = cur - amount;
			if(cur < - maxOffest) cur = - maxOffest;
			break;
	}

	container.css("top", cur+"px");
}


