/*  Media box, version 1.1
 *  (c) 2010 Andrey Nebogin anebogin@gmail.com
 *
 *  jQuery and swfobject are used here.
 *  Description: show the images and flv-movies
*/

function AMedia()
{
	this.created = false;
	this.fullviewCreated = false;
	
	this.parentId = null;
	this.parent = null;
	
	this.container = null;
	this.navigator = null;
	
	this.fullviewShadow = null;
	this.fullviewContainer = null;
	this.fullviewNavigator = null;
	
	this.items = [];
	this.currentItem = 0;
	this.fullviewCurrentItem = 0;
	
	this.timer = null;
	this.animateIsRunning = false;
	
	this.options = {
		path: '/',
		
		container_width: 724,
		container_height: 455,
		container_background: "#fff",
		
		navigator_show: true,
		navigator_top: 455,
		navigator_left: 0,
		navigator_width: 724,
		navigator_height: 34,
		navgator_class: "media_navigator",
		
		fullview_navgator_class: "media_fullview_navigator",
		fullview_container_padding_top: 5,
		fullview_container_padding_left: 20,
		fullview_container_padding_right: 20,
		fullview_container_padding_bottom: 5
	};
	
	var self = this;
	
	/*
		structure is: [ {normal:'',fullview:'',ext:'',fullview_ext:'',title:''}, ... ]
	*/
	this.addItems = function( items )
	{
		if( items && items.length > 0 )
		{
			for( var i=0; i<items.length; i++ )
			{
				if( items[i].normal )
				{
					var item = {};
					
					item.normal = (items[i].normal)? items[i].normal : null;
					item.fullview = (items[i].fullview)? items[i].fullview : null;
					item.ext = (items[i].ext)? items[i].ext : null;
					item.url = (items[i].url)? items[i].url : null;
					item.fullview_ext = (items[i].fullview_ext)? items[i].fullview_ext : null;
					item.title = (items[i].title)? items[i].title : null;
					item.loaded = false;
						
					this.items.push( item );
				}
			}
		}
	};
	
	this.create = function( parentId, options )
	{
		if( !this.created )
		{
			for( option in options )
			{
				this.options[option] = options[option];
			}
			
			this.parentId = parentId;
			this.parent = $("#"+parentId);
			this.parent.html("");
			this.container = $("<div style='position:relative'></div>");
			this.container.css({
				'position': "relative",
				'overflow': "hidden",
				'width': this.options.container_width +"px",
				'height': (this.options.container_height+this.options.navigator_height) +"px",
				'background-color': this.options.container_background
			});
			this.parent.append( this.container );
			this.created = true;
		}
	};
	
	this.fullviewCreate = function()
	{
		if( !this.fullviewCreated )
		{
			var t = this;
			
			var doc = $(document);
			var body = $(document.body);
			//var dWidth = Math.max( body.width(), doc.width() );
			var dWidth = body.width();
			var dHeight = Math.max( body.height(), doc.height() );
			var bWidth = body.width();
			var bHeight = body.height();
			
			this.fullviewShadow = $("<div id='fullviewShadow'></div>");
			this.fullviewShadow.css({
				top: 0,
				left: 0,
				width: dWidth +"px",
				height: dHeight +"px",
				'background-color': "#888888",
				'position': "absolute",
				'z-index': 100,
				'opacity': 0.8
			});
			this.fullviewShadow.bind( "click", function(event) {
				t.fullviewDestroy();
			} );
			
			$(window).bind( 'resize', t.resizeShadow );
			$(window).bind( 'scroll', t.onScroll );
			
			var scrollTop = Math.max( doc.scrollTop(), body.scrollTop() );
			this.fullviewContainer = $("<div id='fullviewContainer'></div>");
			this.fullviewContainer.css({
				top: scrollTop +"px",
				left: 0,
				width: bWidth +"px",
				height: bHeight +"px",
				'position': "absolute",
				'overflow': "hidden",
				'z-index': 101,
			});
			
			body.append( this.fullviewShadow );
			body.append( this.fullviewContainer );
			
			this.fullviewCurrentItem = this.currentItem;
			
			this.fullviewCreated = true;
		}
	};
	
	this.fullviewDestroy = function()
	{
		if( this.fullviewCreated )
		{
			this.fullviewShadow.remove();
			this.fullviewContainer.remove();
			
			$(window).unbind( 'resize' );
			$(window).unbind( 'scroll' );
			
			this.fullviewCreated = false;
		}
	};
	
	this.start = function()
	{
		if( this.created && this.items.length > 0 && !this.animateIsRunning )
		{
			this.play();
		}
	};
	
	this.play = function()
	{
		var t = this;
		
		if( this.created && this.items.length > 0 && !this.animateIsRunning )
		{
			this.container.children().remove();
			var current = this.items[this.currentItem];
			
			if( current.ext != "mov" && current.ext != "flv" && current.ext != "mp4" && current.ext != "url" )
			{
				var img = $("<img src='"+ current.normal +"' border='0'/>").load(function(){
					if( !t.animateIsRunning )
					{
						t.animateIsRunning = true;
						img.fadeIn( 600, function(){
							t.animateIsRunning = false;
						} );
					}
				} );
				t.container.append( img );
				img.hide();
			}
			//else if( current.ext == "flv" || current.ext == "url" )
			//else if( current.ext == "flv" )
			else if( false )
			{
				var player = $("<div id='player' style='position:relative'></div>");
				t.container.append( player );
				var flashvars = {};
				var params = {};
				var attributes = {};
				
				params.allowFullScreen = "false";
				params.allowscriptaccess = "always";
				params.wmode = "transparent";
				
				flashvars.flv = current.normal;
				flashvars.controlbar = "none";
				flashvars.autoplay = "true";
				flashvars.autoreplay = "false";
				
				swfobject.embedSWF( t.options.path+"player.swf", "player", t.options.container_width, t.options.container_height, "10.0.0", false, flashvars, params, attributes);
			}
			//else if( current.ext == "url" )
			else if( (current.ext == "flv" || current.ext == "mp4" || current.ext == "url") && swfobject.getFlashPlayerVersion().major > 0 )
			{
				var player = $("<div id='player' style='position:relative;width:"+ t.options.container_width +"px;height:"+ t.options.container_height +"px'></div>");
				t.container.append( player );
				
				var streamUrl = current.normal;
				var fp = flowplayer( "player", { src: t.options.path +"../flowplayer/flowplayer.swf", wmode: "transparent" }, {
					key: '#@e9506b2b3176692e1c7',
					clip: {
						autoPlay: true,
						scaling: 'fit',
						title: 'One Big Happy Family',
						onPause : function() {
						}
					},
					playlist: [streamUrl],
					canvas: {
						backgroundColor: 'transparent'
					},
					play: {
						replayLabel: ''
					},
					plugins: {
						controls: {
							url: t.options.path +'../flowplayer/flowplayer.controls.swf'
						}
					}
				});
				fp.play();
			}
			else if( current.ext == "mov" || (current.ext == "url" && navigator.userAgent.match(/iPad/i) != null) )
			{
				var player = $("<div id='player'></div>").css({
					"position": "absolute",
					"z-index": 10
				});
				t.container.append( player );
				
				var streamUrl = current.normal;
				var qt = QT_GenerateOBJECTText( streamUrl, t.options.container_width, t.options.container_height, "", 'autoplay', 'true', "wmode", "transparent", "bgcolor", "transparent" );
				player.html( qt );
			}
			else if( current.ext == "url" && swfobject.getFlashPlayerVersion().major==0 && supportHTML5Video() )
			{
				var player = $("<div id='player'></div>").css({
					"width": t.options.container_width +"px",
					"height": t.options.container_height +"px",
					"position": "absolute",
					"z-index": 10
				});
				t.container.append( player );
				
				var streamUrl = current.normal;
				player.html( "<video width='"+ t.options.container_width +"' height='"+ t.options.container_height +"' poster='' preload='' autobuffer='' src='"+ streamUrl +"'><source width='"+ t.options.container_width +"' height='"+ t.options.container_height +"' src='"+ streamUrl +"'/></video>" );
			}
			
			if( t.options.navigator_show ) t.createNavigator();
		}
	};
	
	var supportHTML5Video = function()
	{
		return( !!document.createElement('video').canPlayType );
	};
	
	this.fullviewPlay = function()
	{
		var t = this;
		
		if( t.fullviewCreated && t.items.length > 0 && !t.animateIsRunning )
		{
			var body = $(document.body);
			//var cWidth = t.fullviewContainer.width() - t.options.fullview_container_padding_left - t.options.fullview_container_padding_right;
			var cWidth = body.width() - t.options.fullview_container_padding_left - t.options.fullview_container_padding_right;
			var cHeight = t.fullviewContainer.height() - t.options.fullview_container_padding_top - t.options.fullview_container_padding_bottom - t.options.navigator_height;
			
			t.fullviewContainer.children().remove();
			var current = this.items[t.fullviewCurrentItem];
			
			if( current.ext != "mov" && current.ext != "flv" && current.ext != "url" )
			{
				var img = $("<img id='fullview_object' src='"+ current.fullview +"?"+ new Date().getTime() +"' border='0'/>").load(function(){
					if( !t.animateIsRunning )
					{
						var iW = img.width();
						var iH = img.height();
						
						var w = iW;
						var h = iH;
						
						if( iW > cWidth || iH > cHeight )
						{
							var ccW = iW/cWidth;
							var ccH = iH/cHeight;
							
							w = cWidth;
							h = Math.floor( iH / ccW );
							
							if( h > cHeight )
							{
								h = cHeight;
								w = Math.floor( iW / ccH );
							}
						}
						
						var il = Math.floor( (cWidth-w)/2 );
						img.css({
							'position': "absolute",
							'width': w +"px",
							'height': h +"px",
							'top': t.options.fullview_container_padding_top +"px"
						});
						
						t.fullviewContainer.css( {
							'width': w +"px",
							'left': il +"px"
						} );
						
						t.animateIsRunning = true;
						img.stop().fadeIn( 600, function(){
							t.animateIsRunning = false;
						} );
						
						t.fullviewCreateNavigator();
						t.resizeShadow();
					}
				} );
				t.fullviewContainer.append( img );
				img.hide();
			}
			//else if( current.ext == "flv" || current.ext == "url" )
			else if( false )
			{
				var player = $("<div id='fullview_object'><div id='fullviewPlayer'></div></div>");
				player.css({
					position: "absolute",
					width: cWidth +"px",
					height: cHeight +"px",
					top: t.options.fullview_container_padding_top +"px",
					left: t.options.fullview_container_padding_left +"px"
				});
				t.fullviewContainer.append( player );
				var flashvars = {};
				var params = {};
				var attributes = {};
				
				params.allowFullScreen = "false";
				params.allowscriptaccess = "always";
				params.wmode = "transparent";
				
				flashvars.flv = current.normal;
				flashvars.controlbar = "none";
				flashvars.autoplay = "true";
				flashvars.autoreplay = "false";
				
				swfobject.embedSWF( t.options.path+"player.swf", "fullviewPlayer", cWidth, cHeight, "10.0.0", false, flashvars, params, attributes);
				t.fullviewCreateNavigator();
			}
			else if( (current.ext == "flv" || current.ext == "url") && swfobject.getFlashPlayerVersion().major > 0 )
			{
				var player = $("<div id='fullview_object'><div id='fullviewPlayer'></div></div>");
				player.css({
					position: "absolute",
					width: cWidth +"px",
					height: cHeight +"px",
					top: t.options.fullview_container_padding_top +"px",
					left: t.options.fullview_container_padding_left +"px"
				});
				t.fullviewContainer.append( player );
				
				var streamUrl = current.normal;
				var fp = flowplayer( "player", { src: t.options.path +"../flowplayer/flowplayer.swf", wmode: "transparent" }, {
					key: '#@e9506b2b3176692e1c7',
					clip: {
						autoPlay: true,
						scaling: 'fit',
						title: 'One Big Happy Family',
						onPause : function() {
						}
					},
					playlist: [streamUrl],
					canvas: {
						backgroundColor: 'transparent'
					},
					play: {
						replayLabel: ''
					},
					plugins: {
						controls: {
							url: t.options.path +'../flowplayer/flowplayer.controls.swf'
						}
					}
				});
				fp.play();
			}
			else if( current.ext == "url" && navigator.userAgent.match(/iPad/i) != null )
			{
				var player = $("<div id='fullview_object'><div id='fullviewPlayer'></div></div>");
				player.css({
					position: "absolute",
					width: cWidth +"px",
					height: cHeight +"px",
					top: t.options.fullview_container_padding_top +"px",
					left: t.options.fullview_container_padding_left +"px"
				});
				t.fullviewContainer.append( player );
				
				var streamUrl = current.normal;
				var qt = QT_GenerateOBJECTText( streamUrl, cWidth, cHeight, "", 'autoplay', 'true', "wmode", "transparent", "bgcolor", "transparent" );
				player.html( qt );
			}
			else if( current.ext == "url" && swfobject.getFlashPlayerVersion().major==0 && supportHTML5Video() )
			{
				var player = $("<div id='fullview_object'><div id='fullviewPlayer'></div></div>");
				player.css({
					position: "absolute",
					width: cWidth +"px",
					height: cHeight +"px",
					top: t.options.fullview_container_padding_top +"px",
					left: t.options.fullview_container_padding_left +"px"
				});
				t.fullviewContainer.append( player );
				
				var streamUrl = current.normal;
				player.html( "<video width='"+ cWidth +"' height='"+ cHeight +"' poster='' preload='' autobuffer='' src='"+ streamUrl +"'><source width='"+ cWidth +"' height='"+ cHeight +"' src='"+ streamUrl +"'/></video>" );
			}
		}
	};
	
	this.createNavigator = function()
	{
		var t = this;
		
		var navigator = $("<div id='navigator' class='"+ t.options.navgator_class +"'></div>").css({
			position: "absolute",
			width: t.options.navigator_width +"px",
			height: t.options.navigator_height +"px",
			left: t.options.navigator_left +"px",
			top: t.options.navigator_top +"px"
		});
		t.container.append( navigator );
		
		if( this.items.length > 1 )
		{
			
			var prev = $("<img id='btn_prev' src='"+ t.options.path +"btn_prev.png' border='0'/>");
			prev.bind( "click", function(event) {
				t.currentItem --;
				if( t.currentItem < 0 ) t.currentItem = 0;
				t.play();
			} );
			navigator.append( prev );
			
			for( var i=0; i<this.items.length; i++ )
			{
				var item = $("<a href='#'></a>");
				item.html( t.zeroPad(i+1,2) );
				item.bind( "click", { idx: i }, function(event) {
					t.currentItem = event.data.idx;
					t.play();
					return( false );
				} );
				if( i == t.currentItem )
				{
					item.css( "text-decoration", "underline" );
				}
				navigator.append( item );
				
				var delim = $("<span></span>");
				if( i < this.items.length-1 ) delim.html( " / " );
				navigator.append( delim );
			}
			
			var next = $("<img id='btn_next' src='"+ t.options.path +"btn_next.png' border='0'/>")
			next.bind( "click", function(event) {
				t.currentItem ++;
				if( t.currentItem > t.items.length-1 ) t.currentItem = t.items.length-1;
				t.play();
			} );
			navigator.append( next );
		}
			
		if( t.fullviewExist() )
		{
			var fullview = $("<img id='btn_fullview' src='"+ t.options.path +"btn_fullview.png' border='0'/>")
			fullview.bind( "click", function(event) {
				t.fullviewCreate();
				t.fullviewPlay();
			} );
			navigator.append( fullview );
		}
	};
	
	this.fullviewCreateNavigator = function()
	{
		var t = this;
		
		var obj = $("#fullview_object");
		var cWidth = obj.width();
		var cHeight = obj.height();
		//var top = cHeight + t.options.fullview_container_padding_top;
		//var left = t.options.fullview_container_padding_left;
		var top = cHeight + obj.position().top;
		var left = obj.position().left;
		
		var navigator = $("<div id='fullview_navigator' class='"+ t.options.fullview_navgator_class +"'></div>").css({
			position: "absolute",
			width: cWidth +"px",
			height: t.options.navigator_height +"px",
			left: left +"px",
			top: top +"px"
		});
		t.fullviewContainer.append( navigator );
		
		if( this.items.length > 1 )
		{
			var prev = $("<img id='fullview_btn_prev' src='"+ t.options.path +"fullview_btn_prev.png' border='0'/>");
			prev.bind( "click", function(event) {
				if( t.fullviewCurrentItem > 0 )
				{
					for( var i=t.fullviewCurrentItem-1; i>=0; i-- )
					{
						if( t.items[i].fullview != "" && t.items[i].fullview != null )
						{
							t.fullviewCurrentItem = i;
							if( t.fullviewCurrentItem < 0 ) t.fullviewCurrentItem = 0;
							t.fullviewPlay();
							break;
						}
					}
				}
			} );
			navigator.append( prev );
			
			for( var i=0; i<this.items.length; i++ )
			{
				var item = $("<a href='#'></a>");
				item.html( t.zeroPad(i+1,2) );
				item.bind( "click", { idx: i }, function(event) {
					if( t.items[event.data.idx].fullview != "" && t.items[event.data.idx].fullview != null )
					{
						t.fullviewCurrentItem = event.data.idx;
						t.fullviewPlay();
					}
					return( false );
				} );
				if( this.items[i].fullview == "" || this.items[i].fullview == null )
				{
					item.css( "text-decoration", "line-through" );
				}
				if( i == t.fullviewCurrentItem )
				{
					item.css( "text-decoration", "underline" );
				}
				navigator.append( item );
				
				var delim = $("<span></span>");
				if( i < this.items.length-1 ) delim.html( " / " );
				navigator.append( delim );
			}
			
			var next = $("<img id='fullview_btn_next' src='"+ t.options.path +"fullview_btn_next.png' border='0'/>")
			next.bind( "click", function(event) {
				for( var i=t.fullviewCurrentItem+1; i<t.items.length; i++ )
				{
					if( t.items[i].fullview != "" && t.items[i].fullview != null )
					{
						t.fullviewCurrentItem = i;
						if( t.fullviewCurrentItem > t.items.length-1 ) t.fullviewCurrentItem = t.items.length-1;
						t.fullviewPlay();
						break;
					}
				}
			} );
			navigator.append( next );
		}
			
		var fullview = $("<img id='fullview_btn_close' src='"+ t.options.path +"fullview_btn_close.png' border='0'/>")
		fullview.bind( "click", function(event) {
			t.fullviewDestroy();
		} );
		navigator.append( fullview );
	};
	
	this.zeroPad = function( num, count )
	{
		var retval = num + '';
		while(retval.length < count)
		{
			retval = "0" + retval;
		}
		
		return( retval );
	};
	
	this.fullviewExist = function()
	{
		var retval = false;
		
		/*
		for( var i=0; i<this.items.length; i++ )
		{
			if( this.items[i].fullview != "" && this.items[i].fullview != null )
			{
				retval = true;
				break;
			}
		}
		*/
		
		if( this.items[this.currentItem].fullview != "" && this.items[this.currentItem].fullview != null ) retval = true;
		
		return( retval );
	};
	
	this.resizeShadow = function()
	{
		var doc = $(document);
		var body = $(document.body);
		var dWidth = body.width();
		var dHeight = Math.max( body.height(), doc.height() );
		
		self.fullviewShadow.css({
			width: dWidth +"px",
			height: dHeight +"px"
		} );
	};
	
	this.onScroll = function()
	{
		if( self.fullviewCreated )
		{
			var doc = $(document);
			var body = $(document.body);
		
			var scrollTop = Math.max( doc.scrollTop(), body.scrollTop() );
			self.fullviewContainer.stop().animate( {top: scrollTop} );
		}
	};
}