/*
 * popup video player
 * will hook onto all links with class of popup-viewer
 * e.g. <a class="popup-viewer" rel=/path/videofile.flv" href="#id"><img></a>
 */

$(document).ready(function(){
	
		// add play buttons if video filename shown
		$(".popup-video").each(function(){
			if($(this).attr("rel")){
				$(this).append('<img class="play-button" src="/images/play-button-small.png" alt="" width="45" height="45" />').find(".play-button").hide();
			}
		});
		// show play button on hover
		$(".popup-video").hover(
			function(){
				$(this).find(".play-button").show();		
			},
			function(){
				$(this).find(".play-button").hide();						
			}
		);
	
		// movies popup video player
		$(".popup-video").click(function (e) {
			e.preventDefault();
			// get filename
			videoFilename = $(this).attr("rel");
			// show popup if filename exists
			if (videoFilename) {
				$.log(videoFilename);
				$("<div></div>").modal({
					//closeHTML: "<a href='#' title='Close' class='modal-close'>X</a>",
					position: ["15%", ],
					overlayId: 'popup-overlay',
					containerId: 'popup-container',
					overlayClose: true,
					escClose: true,
					autoResize: false,
					autoPosition: true,
					//minHeight:		400,
					opacity: 50,
					onOpen: popup.open,
					onShow: popup.show,
					onClose: popup.close
				});
			}
		});
	
		var popup = {
			message: null,
			
			/* open event */
			open: function (dialog) {
				$.log("'open' event");
				dialog.overlay.fadeIn(200, function () {
					dialog.container.fadeIn(200, function () {
						dialog.data.fadeIn(0, function () {
							$.log(videoFilename);
							$(this)
								.videoPlayer({
									// default options:
									 id: "popup-player",			
									 autostart: "true",
									 width: "556",		// player width
									 height: "431",		// player height
									 filename: videoFilename,
									 thumbnail: "/images/tv-viewer.png"
								});
			
						});
					});
				});
			},
			
			/* close event
			 * can call programatically with $.modal.close();
			 * 
			 */ 
			close: function (dialog) {
				$.log("'close' event");		
				/* hide dialog */
				dialog.container.fadeOut(200, function () {
					dialog.overlay.fadeOut(200, function () {
						$.modal.close();
					});
				});
			}
			
		}
		
});