function initVideoGallery() {
	// define thumb width
	var THUMB_WIDTH = 94;
	
	// set visible width
	var visibleWidth = THUMB_WIDTH * 6;
	
	// get combined width of all video thumbnails
	var totalWidth = ($("videoThumbs").getChildren().length) * THUMB_WIDTH;
	
	// set width of list
	$("videoThumbs").setStyle("width", totalWidth);
	
	// set initial classes for buttons
	$("videoThumbsLeft").addClass("disabled");
	
	if (totalWidth <= visibleWidth)
		$("videoThumbsRight").addClass("disabled");
	
	// define effects
	var fx = new Fx.Styles($("videoThumbs"), {duration: 500, transition: Fx.Transitions.Sine.easeInOut});
	
	// assign button functions
	$("videoThumbsLeft").addEvent("click", function(e) {
			// stop anchor event
			e = new Event(e).stop();
						
			// get current position
			var currentLeft = $("videoThumbs").getStyle("left").toInt();
			
			// calculate new position
			var tempLeft = currentLeft + THUMB_WIDTH;
						
			if (tempLeft <= 0) {
				// animate
				fx.start({
					"left": tempLeft
				});
				
				// update button statuses
				if ($("videoThumbsRight").hasClass("disabled"))
					$("videoThumbsRight").removeClass("disabled")
				
				if (tempLeft == 0) {
					if (!$("videoThumbsLeft").hasClass("disabled"))
						$("videoThumbsLeft").addClass("disabled");
				}
			}
		}
	);
	
	$("videoThumbsRight").addEvent("click", function(e) {
			// stop anchor event
			e = new Event(e).stop();
			
			// get current position
			var currentLeft = $("videoThumbs").getStyle("left").toInt();
			
			// calculate new position
			var tempLeft = currentLeft - THUMB_WIDTH;
			
			if ((totalWidth - Math.abs(tempLeft)) >= visibleWidth) {
				// animate
				fx.start({
				 	"left": tempLeft
				});
				
				// update button statuses
				if ($("videoThumbsLeft").hasClass("disabled"))
					$("videoThumbsLeft").removeClass("disabled");
				
				if ((totalWidth - Math.abs(tempLeft)) == visibleWidth) {
					if (!$("videoThumbsRight").hasClass("disabled"))
						$("videoThumbsRight").addClass("disabled");
				}
			}
		}
	);
	
	// assign thumbnail link functions
	
	// get links
	var thumbLinks = $$("ul#videoThumbs a");
	
	// add events to all thumb links
	for (var i = 0; i < thumbLinks.length; i++) {
		thumbLinks[i].addEvents({
			
			"mouseover": function(ev) {
				showVideoName(ev);
			},
			
			"mouseout": function() {
				clearVideoName();
			},
			
			"click": function(ev) {
				loadVideo(ev);
			}
			
		});
	}
	
	return false;
}

function showVideoName(ev) {
	// get thumb index
	var event = new Event(ev);
	var thumb_index = $(event.target).getProperty("id").replace("thumb", "").toInt();

	// set video name
	$("highlightedVideo").getChildren()[0].innerHTML = $(event.target).getProperty("title");
	
	// toggle paragraph visibility
	$("nowPlaying").addClass("hide");
	$("highlightedVideo").removeClass("hide");
}

function clearVideoName() {
	// toggle paragraph visibility
	$("highlightedVideo").addClass("hide");
	$("nowPlaying").removeClass("hide");
}

function loadVideo(ev) {
	// get thumb index
	var event = new Event(ev).stop();
	var thumb_index = $(event.target).getProperty("id").replace("thumb", "").toInt();
	
	// get video id
	var video_id = $(event.target).getProperty("name").replace("video", "").toInt();
	
	// set video name
	$("nowPlaying").getChildren()[0].innerHTML = $(event.target).getProperty("title");
	
	// load video
	var url = DOCUMENT_ROOT + "/misc/scripts/ajax/gallery_video.asp?video=" + video_id;
	var element = "videoStage";
	ajaxRequest(url, element);
}