var width = 958;
var next = 0;

//Triggers which way the carousel should go. Only AJAX it its forward.
function carousel( dir )
{	
	var prev = next;
	
	if( true == dir )
		next++;
	else
		next--;
	
	if( next < 0 )
		next = 0;
	
	if( next > 0 || ( next == 0 && prev == 1 ) )
	{
		//Insert new post with AJAX and rotate
		if( true == dir )
			carouselAjax( next, dir );
		//Only rotate since post is already there
		else
			carouselMove( dir );
	}
}

//Triggers the movement
function carouselMove( dir )
{
	if( dir == true )
		dir = "-";
	else
		dir = null;
	
	new Effect.Move( $( 'carousel-content' ), { x: dir + width, y: 0, mode: 'relative', duration: 0.5, queue: 'end' } );
}

//Get new post with AJAX
function carouselAjax( offset, dir )
{		
	new Ajax.Request( '/core/blog/ajaxGetCarouselPost.php', {
		onSuccess: function( result ){
			
			//Response
			var myJSON = result.responseText.evalJSON();
			
			//If status is true
			if( myJSON.status == 1 )
			{
				var array = "";
			
				//Add categories if there is any
				if( myJSON.category != "undefined" )
				{
					for( i = 0; i < myJSON.category.length; i++ )
					{
						array = array + '<span class="meta-round">' + myJSON.category[i] + '</span>';
					}
				}
				
				//Insert content
				$('carousel-content').insert( 	'<div class="slide">' +
													'<img src="' + myJSON.image + '" width="958" height="200" style="position: absolute;" />' +
													'<div class="background-opacity"></div>' +
													'<div class="content">' +
														'<ul class="carousel-meta">' +
		    												'<li class="headline">' + myJSON.comments + '</li>' +
															'<li class="small-text">kommentarer</li>' +
															'<li class="headline">' + myJSON.thumbs + '</li>' +
															'<li class="small-text">tummar</li>' +
														'</ul>' +
														'<span class="font-title">' + myJSON.blog + '</span><br />' +
														'<span class="title">' + myJSON.title + '</span>' +
														'<div class="text-transform" style="height: 80px;">' + myJSON.text + '</div>' +
														array +
													'</div>' +
													'<a href="' + myJSON.url + '" style="z-index: 4; position: relative;" onmouseover="new Effect.Opacity( $( \'overlay\' ), { from: 0, to: 1, duration: 0.2 } );" onmouseout="new Effect.Opacity( $( \'overlay\' ), { from: 1, to: 0, duration: 0.2 } );"><img src="/gfx/space01.gif" width="958" height="200" /></a>' +
												'</div>' );
				
				//Rotate the carousel
				if( true == dir )
					carouselMove( dir );
			}
			else
				next--;
			
			//Remove gif-animation
			$( 'animation' ).remove();
		},
		onLoading: function(){
			
			//Insert gif-animation
			$('carousel-wrapper').insert(
				new Element( 'div', { 'id': 'animation' } ).setStyle( { zIndex: 5, position: 'absolute', top: '67px', width: width + 'px', textAlign: 'center' } ).update(
					new Element( 'img', { src: '/gfx/theme_default/site/ico_wait_animation_huge.gif' } )
				)
			);
		},
		onFailure: function(){
			
			//Remove gif-animation if function fails
			$( 'animation' ).remove();
		},
		parameters: {
			offset: offset
		}
	} );
}

function controlOpacity( element, show )
{
	var opacity = $( element ).getStyle( 'opacity');
	
	if( opacity > 0 && opacity < 1 )
	{
		setTimeout( 'controlOpacity("' + $( element ).identify() + '", ' + show + ');', 100 );
	}
	else
	{
		if( opacity == 0 && show == true )
		{
			new Effect.Opacity( element, { from: 0, to: 1, duration: 0.3 } );
		}
		else if( show == false )
		{
			new Effect.Opacity( element, { from: 1, to: 0, duration: 0.3 } );
		}
	}
}