	
	// HANDLING

	function selectItem( itemIndex )
	{		
		// timing
		var durationPerItem = 400;
	
		var scroller 		= $("scroller");
		scroller.busy 		= true;
		var oldIndex		= scroller.oldIndex;
		var newIndex;
		
		itemIndex 			= parseInt( itemIndex );
		
		if( itemIndex > scroller.items.size()-1 )  { itemIndex = scroller.items.size()-1; }
		else if( itemIndex < 0 )  { itemIndex = 0; }
			
		newIndex 			= itemIndex;
		var oldItem 		= scroller.items[ oldIndex ];
		var newItem  		= scroller.items[ newIndex ];
		
		// focus the new item, blur the previous item	
		focusItem( newItem );
	
		// store the previous selection
		$("scroller").oldIndex = newIndex;
				
		// scroll to the new item
		var newScroll 	= 0 - Position.positionedOffset( newItem )[0] - ( newItem.getWidth()/2 );
		var state1 		= "left: " + newScroll + "px";
		var tempScroll 	= Animator.apply( scroller, state1 );
		tempScroll.options.duration 	= durationPerItem * Math.abs( newIndex - oldIndex );
		tempScroll.options.onComplete 	= function() { scroller.busy = false; };
		tempScroll.play();
	}

	function focusItem( item )
	{
		item = $( item );
	
		// blur previous focused item
		if( $("scroller").lastFocus )
		{
			blurItem( $("scroller").lastFocus );
		}
	
		// focus on our new item
		if( item )
		{
			// for use when focusing the next item
			$("scroller").lastFocus = item;
			
			// focus all children
			item.immediateDescendants().map( 	function( contentBlock )
									{
										focus( contentBlock );
									} );
		}
		
		return item;	
	}

	function blurItem( item )
	{
		item = $( item );
	
		if( item )
		{			
			// blur all children
			item.immediateDescendants().each	( 	function( contentBlock )
												{
													blur( contentBlock );
												} );
		}

		return item;

	}

	function focus( element )
	{
		element = $( element );		
		if( typeof( element.focus.seekTo ) == "function"  )
			{
				element.focus.seekTo( 1 );
			}
		return element;
	}

	function blur( element )
	{
		element = $( element );
		if( typeof( element.focus.seekTo ) == "function"  )
			{
				element.focus.seekTo( 0 );
			}
		return element;
	}

	function nextImage()
	{
		selectItem( $("scroller").oldIndex + 1 );
	}
	
	function previousImage()
	{
		selectItem( $("scroller").oldIndex - 1);
	}
	





// SETUPS


function setup( item )
{

	item = $( item );

	if( item.hasClassName( "item" ) )
	{
		item.focus = Animator.apply( item, [ "itemblur", "itemfocus" ] );
		item.focus.options.duration = 700;
		setupItemEvents( item );
		blurItem( item );
	}
	else if( item.hasClassName( "itemImage" ) )
	{	
		item.focus = Animator.apply( item, [ "imageblur", "imagefocus" ] );
		item.focus.options.duration = 200; 
	}
	else if( item.hasClassName( "itemInfo" ) )
	{
		item.focus = Animator.apply( item, [ "infoblur", "infofocus" ] );
		item.focus.options.duration = 800;
	}							
	else if( item.hasClassName( "textBlock" ) )
	{
		item.focus = Animator.apply( item, [ "textblockblur", "textblockfocus" ] );
		item.focus.options.duration = 400; 				
	}
	else if( item.hasClassName( "scrollLeft" ) )
	{
		Event.observe( $('scrollLeft'), "click",
			function()
			{
				previousImage();
			});
	}
	else if( item.hasClassName( "scrollRight" ) )
	{
		Event.observe( $('scrollRight'), "click",
			function()
			{
				nextImage();
			});
	}
	else if( item.hasClassName( "scroller" ) )
	{
		var scroller = item;

		scroller.oldIndex 	= 1;
		scroller.newIndex 	= 1;
		scroller.lastFocus	= null;
		scroller.items 		= $A( scroller.getElementsByClassName('item') );
		scroller.images 		= $A( scroller.getElementsByClassName('itemImage') );

		$$('.itemImage, .itemInfo, .textBlock, .item').map( 
			function( element )
			{
				setup( element );
			});

		scroller.focus = new Animator.apply( scroller, [ "scrollerblur", "scrollerfocus" ] );
		scroller.focus.options.duration = 1000;
		scroller.focus.options.onComplete = function()
			{
				$('spinner').addClassName('inviso');
				selectItem(0);
			};
		focus( scroller );		
	}
}

function setupItemEvents( item )
{
			
			
			// click
			Event.observe( item, 'click', function( event )
				{					
					var clickedItem 	= Event.element( event );
					var scroller 		= $( "scroller" );

					if( clickedItem.hasClassName("item") )
						item = clickedItem;
					else
						item = clickedItem.up('.item');
					
					if( item )
					{
						var itemIndex = scroller.items.indexOf( item );				
						if( !scroller.busy )
						{
							if( itemIndex != scroller.oldIndex )
								scroller.busy = true;
								selectItem( itemIndex );
						}
					}
				});
				
			// mouseover
			Event.observe( item, 'mouseover', function( event )
				{					
					var scroller 	= $( "scroller" );
					var mousedItem 	= Event.element( event );

					if( mousedItem.hasClassName("item") )
						item = mousedItem;
					else
						item = mousedItem.up('.item');
					
					if( item )
					{
						var itemIndex = scroller.items.indexOf( item );						
						if( !scroller.busy )
						{
							focusItem( item );
						}
					}
				});

			// mouseout
			Event.observe( item, 'mouseout', function( event )
				{
					if( !$("scroller").busy )
					{
						// var items 	= $A( scroller.getElementsByClassName('item') );
						focusItem( $('scroller').items[ $("scroller").oldIndex ] );
					}
				});
}



