/*
		imagePlayer JS
	*/
	
	Component.imagePlayer = {
		
		init: function( args )
		{
			for(var i=args.length-1;i>=0;i--)
			{
				new Component.imagePlayer.create( args[i] );	
			}
		},
		
		create: function( args )
		{
			var imagePlayerObject = document.getElementById( args.id );
			var productContainerObject = document.getElementById( args.id + "_productContainer" );
			var pictureContainerObject = document.getElementById( args.id + "_pictureContainer" );
			var pictureDescriptionTitleObject = document.getElementById( args.id + "_pictureDescriptionTitle" );
			var pictureDescriptionTextObject = document.getElementById( args.id + "_pictureDescriptionText" );
			var buttonContainerObject = document.getElementById( args.id + "_buttonContainer" );
			var buttonUpObject = document.getElementById( args.id + "_buttonUp" );
			var buttonDownObject = document.getElementById( args.id + "_buttonDown" );
			var buttonBackObject = document.getElementById( args.id + "_buttonBack" );
			var buttonPlayPauseObject = document.getElementById( args.id + "_buttonPlayPause" );
			var buttonNextObject = document.getElementById( args.id + "_buttonNext" );
			var controllerObject = document.getElementById( args.id + "_controller" );
			
			var bigWindowObject = document.getElementById( args.id + "_bigWindow" );
			var bigWindowImageObject = document.getElementById( args.id + "_bigWindowImage" );
			var bigWindowTextObject = document.getElementById( args.id + "_bigWindowText" );
			
			if( args.showCategories != "false" )
			{
				// Event attachment function for Buttons
				var _attachEvents = function( obj, position )
									{
										Application.event.add( obj, "mouseover", 	function()
																					{
																						obj.className = "buttonOver";
																					});
										
										Application.event.add( obj, "mouseout", 	function()
																					{
																						if( _currentCategory == position )
																						{
																							return;
																						}
																						
																						obj.className = "buttonOut";
																					});
										
										Application.event.add( obj, "click",	function()
																				{
																					buttonPlayPauseObject.className = "playPauseButtonOff_play";
																					
																					_playing = false;
																					
																					clearTimeout( _timeoutPointer );
																					
																					// Get the first product pointing to this category
																					for(var i=0;i<productsList.length;i++)
																					{
																						if(productsList[i].getAttribute("categoryNumber") != position)
																						{
																							continue;
																						}
																						
																						_currentPosition = i;
																						
																						break;
																					}
																					
																					_showProduct();
																				});
									};
				
				// Attach events to buttons
				i = 1;
				while(true)
				{
					var buttonObject = document.getElementById( args.id + "_button_" + i);
					
					if( !buttonObject )
					{
						break;
					}
					
					_attachEvents( buttonObject, i );
					
					i++;
				}
				
				// Attach events to up and down buttons
				var _intervalPointer = null;
				Application.event.add( buttonUpObject, "mouseover",	function()
																	{
																		buttonUpObject.className = "buttonUpOn";
																		
																		_intervalPointer = setInterval( function()
																										{
																											buttonContainerObject.scrollTop -= 2;
																										}, 10);
																	});
				
				Application.event.add( buttonUpObject, "mouseout",	function()
																	{
																		buttonUpObject.className = "buttonUpOff";
																		
																		clearInterval( _intervalPointer );
																	});
				
				Application.event.add( buttonDownObject, "mouseover",	function()
																		{
																			buttonDownObject.className = "buttonDownOn";
																			
																			_intervalPointer = setInterval( function()
																											{
																												buttonContainerObject.scrollTop += 2;
																											}, 10);
																		});
				
				Application.event.add( buttonDownObject, "mouseout",	function()
																		{
																			buttonDownObject.className = "buttonDownOff";
																			
																			clearInterval( _intervalPointer );
																		});
			}
			
			// Attach events to back, play and next buttons
			Application.event.add( buttonBackObject, "mouseover", 	function()
																	{
																		buttonBackObject.className = "backButtonOn";
																	});
			
			Application.event.add( buttonBackObject, "mouseout", 	function()
																	{
																		buttonBackObject.className = "backButtonOff";
																	});
			
			Application.event.add( buttonBackObject, "click", 	function()
																{
																	buttonPlayPauseObject.className = "playPauseButtonOff_play";
																	
																	_playing = false;
																	
																	_currentPosition--;
																	
																	clearTimeout( _timeoutPointer );
																	
																	_showProduct();
																});
			
			Application.event.add( buttonPlayPauseObject, "mouseover", 	function()
																		{
																			if( _playing )
																			{
																				buttonPlayPauseObject.className = "playPauseButtonOn_pause";
																			}
																			else
																			{
																				buttonPlayPauseObject.className = "playPauseButtonOn_play";
																			}
																		});
			
			Application.event.add( buttonPlayPauseObject, "mouseout", 	function()
																		{
																			if( _playing )
																			{
																				buttonPlayPauseObject.className = "playPauseButtonOff_pause";
																			}
																			else
																			{
																				buttonPlayPauseObject.className = "playPauseButtonOff_play";
																			}
																		});
			
			Application.event.add( buttonPlayPauseObject, "click", 	function()
																	{
																		if( _playing )
																		{
																			buttonPlayPauseObject.className = "playPauseButtonOn_play";
																			
																			clearTimeout( _timeoutPointer );
																			
																			_playing = false;
																		}
																		else
																		{
																			buttonPlayPauseObject.className = "playPauseButtonOn_pause";
																			
																			clearTimeout( _timeoutPointer );
																			
																			_playing = true;
																			_showProduct();
																		}
																	});
			
			Application.event.add( buttonNextObject, "mouseover", 	function()
																	{
																		buttonNextObject.className = "nextButtonOn";
																	});
			
			Application.event.add( buttonNextObject, "mouseout", 	function()
																	{
																		buttonNextObject.className = "nextButtonOff";
																	});
			
			Application.event.add( buttonNextObject, "click", 	function()
																{
																	buttonPlayPauseObject.className = "playPauseButtonOff_play";
																	
																	_playing = false;
																	
																	_currentPosition++;
																	
																	clearTimeout( _timeoutPointer );
																	
																	_showProduct();
																});
			
			// Controller event
			var _fadePointer = null;
			var _fadedIn = null;
			Application.event.add( imagePlayerObject, "mouseover", 	function( e )
																	{
																		clearInterval( _fadePointer );
																		
																		if( bigWindowObject.className != 'bigWindowHidden' )
																		{
																			return;
																		}
																		
																		if( _fadedIn )
																		{
																			return;
																		}
																		
																		_fadePointer = Application.effects.fade.fadeIn({
																													object: controllerObject,
																													onComplete: function()
																																{
																																	_fadedIn = true;
																																}
																											 });
																	});
			
			Application.event.add( imagePlayerObject, "mouseout", 	function( e )
																	{
																		clearInterval( _fadePointer );
																		
																		if( !_fadedIn )
																		{
																			return;
																		}
																		
																		_fadePointer = Application.effects.fade.fadeOut({
																													object: controllerObject,
																													onComplete: function()
																																{
																																	_fadedIn = false;
																																}
																											 });
																	});
			
			// PictureContainer event
			Application.event.add( productContainerObject, "click", function()
																	{
																		// Stop the animation
																		buttonPlayPauseObject.className = "playPauseButtonOff_play";
																		controllerObject.className = 'controllerHidden';
																		
																		_playing = false;
																		
																		clearTimeout( _timeoutPointer );
																		
																		// Show the picture
																		bigWindowObject.className = 'bigWindowVisible';
																		
																		bigWindowImageObject.src = "/components/imagePlayer/resources/public/img/gallery/bigImages/" + productsList[ _currentPosition ].getAttribute("imageBig");
																		bigWindowTextObject.innerHTML = productsList[ _currentPosition ].getElementsByTagName("description")[0].childNodes[0].nodeValue;
																	});
			
			Application.event.add( bigWindowObject, "click", 	function()
																{
																	bigWindowObject.className = 'bigWindowHidden';
																	controllerObject.className = 'controller';
																});
			
			var _showProduct = null;
			var _timeoutPointer = null;
			var _playing = null;
			var _currentPosition = 0;
			var _currentCategory = null;
			
			var productsList = null;
			
			// Add products & translations
			new Application.connect.ajax({
							url: "/components/imagePlayer/translations/ro-RO.xml",
							successFunction: 	function( domEl )
												{
													productsList = domEl.getElementsByTagName("product");
													
													_showProduct = 	function()
																	{
																		Application.effects.fade.fadeOut({
																									object: productContainerObject,
																									onComplete: function()
																												{
																													if( _playing )
																													{
																														_currentPosition++;
																													}
																													
																													/*
																													Application.debug.show();
																													Application.debug.addRow({ text: _currentPosition + " " + productsList.length });
																													*/
																													
																													if( _currentPosition < 0 )
																													{
																														_currentPosition = productsList.length - 1;	
																													}
																													
																													if( _currentPosition >= productsList.length )
																													{
																														_currentPosition = 0;
																													}
																													
																													pictureContainerObject.src = "/components/imagePlayer/resources/public/img/gallery/thumbnails/" + productsList[ _currentPosition ].getAttribute("image");
																													
																													pictureDescriptionTitleObject.innerHTML = productsList[ _currentPosition ].getElementsByTagName("title")[0].childNodes[0].nodeValue;
																													pictureDescriptionTextObject.innerHTML = productsList[ _currentPosition ].getElementsByTagName("description")[0].childNodes[0].nodeValue;
																													
																													// Setting the new category
																													
																													if( args.showCategories != "false" )
																													{
																														document.getElementById( args.id + "_button_" + _currentCategory ).className = "buttonOut";
																														_currentCategory = productsList[ _currentPosition ].getAttribute("categoryNumber");
																														document.getElementById( args.id + "_button_" + _currentCategory ).className = "buttonOver";
																													}
																													
																													Application.effects.fade.fadeIn({
																																				object: productContainerObject,
																																				onComplete: function()
																																							{
																																								if( _playing )
																																								{
																																									_timeoutPointer = setTimeout( _showProduct, 2500 );
																																								}
																																							}
																																			 });
																												}
																								});
																	}
													
													pictureContainerObject.src = "/components/imagePlayer/resources/public/img/gallery/thumbnails/" + productsList[ _currentPosition ].getAttribute("image");
													
													pictureDescriptionTitleObject.innerHTML = productsList[ _currentPosition ].getElementsByTagName("title")[0].childNodes[0].nodeValue;
													pictureDescriptionTextObject.innerHTML = productsList[ _currentPosition ].getElementsByTagName("description")[0].childNodes[0].nodeValue;
													
													_playing = true;
													
													if( args.showCategories != "false" )
													{
														_currentCategory = productsList[ _currentPosition ].getAttribute("categoryNumber");
													
														document.getElementById( args.id + "_button_" + _currentCategory ).className = "buttonOver";
													}
													
													Application.effects.fade.fadeIn({
																				object: productContainerObject,
																				onComplete: function()
																							{
																								_timeoutPointer = setTimeout( _showProduct, 2500 );
																							}
																			 });
												}
					   });
		}
		
	};