var image_size = 97;
var preventResizing = false;
var movementTime = 1;

function resetLoaderClass(el) {
	el.className = '';
}
 

function setHeight() {
    if($('left_panel') && $('whiteResizable')) {

    $('content').style.height = '';
    $('left_panel').style.height = '';
    $('whiteResizable').style.height = '';
    $('tabsContainerMeasurer').style.height = '';

    var allHeight = $('heightMeasurer').getHeight();
    var leftPanelHeight = $('left_panel').getHeight();
    var whiteResizableHeight = $('whiteResizable').getHeight();
    var contentHeight = $('content').getHeight();


      if (contentHeight <= leftPanelHeight) {
        $('whiteResizable').style.display = 'none';
        //alert(leftPanelHeight);
        $('content').style.height = allHeight - 0 + "px";
        }
      else {
        //alert('left < content');
        //alert(allHeight);
        $('whiteResizable').style.display = 'block';
        //$('marginTop').style.height = 8 + 'px';
        $('left_panel').style.height = allHeight - 0 + "px";
        $('whiteResizable').style.height = allHeight - leftPanelHeight + "px";
        }
      }
    }
  window.onload=function() {
    setHeight();
    if($('whiteResizable')) {
      $('whiteResizable').style.height = $('whiteResizable').getHeight() - 8 + "px"; //Only on page loading 
    }
  }
  
  
function setContainer(post, divNum)
{
	var image = $('page_' + post + '_' + divNum);
	if (image.hasClassName('active_image'))
		return;
	
	var images = $('block_' + post).getElementsByClassName('image_block');
	for (var i = 0; i < images.length; i++)
	{
		if (images[i].hasClassName('active_image'))
		{
			images[i].morph('background:#ffffff');
			images[i].removeClassName('active_image');
		}
	}
	
	image.addClassName('active_image');
	image.morph('background:#FFF');
//	if ($('next_scroll_' + post).getStyle('display') != 'none')
//		flattenImage(post, image);
	
	
	var url = $('container_' + post + '_' + divNum).innerHTML;
	var title = $('title_' + post + '_' + divNum).innerHTML;
	var link = $('link_' + post + '_' + divNum).innerHTML;
	var description = $('description_' + post + '_' + divNum).innerHTML;
	var caption = $('caption_' + post + '_' + divNum).innerHTML;
	
	var ajaxImageUrl = imagesPath + '/ajax-loader.gif';
	var imageContainer = $('image_container_' + post);
	var titleContainer = $('title_container_' + post);
	var linkContainer = $('link_container_' + post);
	var descriptionContainer = $('description_container_' + post);
	
	var imgObj = new Image();

	var pseudo = $('pseudo_' + post);
	if (typeof pseudo.height == 'undefined')
		pseudo.setStyle({height:pseudo.getStyle('height')});
	
	imgObj.onload = function()
	{
		var container = $('display_container_' + post);
		var timeout = 0.8;
		if (parseInt(pseudo.getStyle('height')) != imgObj.height)
		{
			imageContainer.src = ajaxImageUrl;
			
			new Effect.Morph(pseudo, {
						  style: {
						    height: imgObj.height + 'px'
						  },
						  duration: timeout
						});
			
		}
		else
			timeout = 0;
		
		setTimeout(function()
			{
				imageContainer.src = url;
				imageContainer.alt = caption;
				titleContainer.innerHTML = title;
				if(!link.length) linkContainer.hide(); else linkContainer.show();
				if(!description.length) descriptionContainer.hide(); else descriptionContainer.show();
				linkContainer.innerHTML = link; 
				linkContainer.href = link;
				
				descriptionContainer.innerHTML = description;
				
				container.setStyle({display:'none'});
				container.appear({ duration: 1.0 });
			},
			timeout * 1000
		);
	}
	
	imgObj.src = url;
	if (!imgObj.complete)
	{
		imageContainer.src = ajaxImageUrl;
	}
}

function nextLink(post, divNum)
{
	var current_div = $('page_' + post + '_' + divNum);
	var next_div = $('page_' + post + '_' + (divNum + 1));
	if (!current_div || !next_div)
		return;
	
	current_div.setStyle({display:'none'});
	next_div.setStyle({display:'block'});
}

function previusLink(post, divNum)
{
	var current_div = $('page_' + post + '_' + divNum);
	var prev_div = $('page_' + post + '_' + (divNum - 1));
	if (!current_div || !prev_div)
		return;
	
	current_div.setStyle({display:'none'});
	prev_div.setStyle({display:'block'});
}

function openupGallery(post)
{
	if (preventResizing)
		return;
	$('next_scroll_' + post).hide();
	$('prev_scroll_' + post).hide();
	$('disabled_next_scroll_' + post).show();
	$('disabled_prev_scroll_' + post).show();
	
	var block_width = $('block_' + post).getStyle('width');
	var object = $('arrangement_' + post);
	object.setStyle({width: block_width, left:0});
	
	var div = $('block_' + post);
	var height = div.scrollHeight;
	new Effect.Morph(div, {
						  style: {
						    height: height + 'px'
						  },
						  duration:0.8,
              afterFinish: setHeight
						});
	swap('openup_' + post, 'minimize_' + post);
	$('scroller_' + post).hide();
}

function minimizeGallery(post)
{
  $('disabled_next_scroll_' + post).hide();
	$('disabled_prev_scroll_' + post).hide();
	$('next_scroll_' + post).show();
	$('prev_scroll_' + post).show();
	
	var images = $('block_' + post).getElementsByClassName('image_block');
	var block_width = images.length * image_size;
	var object = $('arrangement_' + post);
	object.setStyle({width: block_width + 'px'});
	
	var div = $('block_' + post);
	new Effect.Morph(div, {
						  style: {
						    height: parseInt(images[0].getStyle('height')) + 4 + 'px'
						  },
						  duration: 0.6,
              afterFinish: setHeight
						});
	swap('openup_' + post, 'minimize_' + post);
	
	var activeImage = $('block_' + post).getElementsByClassName('active_image')[0];
	if (activeImage)
		flattenImage(post, activeImage);
		
	$('scroller_' + post).show();
	Element.scrollTo($('display_container_' + post));
}

function swap(div1, div2)
{
	var obj1 = $(div1);
	var obj2 = $(div2);
	
	if (Element.getStyle(obj1, 'display') == 'none')
	{
		obj1.setStyle({display:'block'});
		obj2.setStyle({display:'none'});
	}
	else
	{
		obj1.setStyle({display:'none'});
		obj2.setStyle({display:'block'});
	}
}

function scrollNext(galleryId)
{
	var object = $('arrangement_' + galleryId);
	var arrangementWidth = parseInt(object.getStyle('width'));
	
	var left = Element.getStyle(object, 'left');
	var block_width = parseInt($('block_' + galleryId).getStyle('width'));
	
	var images_count = $('block_' + galleryId).getElementsByClassName('image_block').length;
	
	var offset = arrangementWidth + parseInt(left);
	
	if (offset - block_width < block_width)
		move = offset - block_width;
	else
		move = block_width;
	
	if (move == 0)
		pushGallery(galleryId, -25);
	else
		moveGallery(galleryId, -move);
	var left = parseInt(Element.getStyle(object, 'left'));
}

function moveGallery(id, move, duration)
{
	if (typeof duration == 'undefined')
	{
		duration = movementTime;
	}
	var object = $('arrangement_' + id);
	preventResizing = true;
	new Effect.Move(object, { x: move, mode: 'relative', duration:duration});
	setTimeout(function()
		{
			preventResizing = false;
		},
		duration * 1000
	);
}

function scrollPrevius(galleryId)
{
	var object = $('arrangement_' + galleryId);
	var left = Element.getStyle(object, 'left');
	var images_count = $('block_' + galleryId).getElementsByClassName('image_block').length;
	var block_width = parseInt($('block_' + galleryId).getStyle('width'));
	
	if (parseInt(left) < 0)
		move = block_width;
	else
		move = 0;
	
		
	if (parseInt(left) > -block_width)
		move = -parseInt(left);
		
	if (move == 0)
		pushGallery(galleryId, 25);
	else
	{
//		new Effect.Move(object, { x: move, mode: 'relative' });
		moveGallery(galleryId, move);
	}
		
}

function pushGallery(galleryId, width)
{
	var object = $('arrangement_' + galleryId);
	moveGallery(galleryId, width, 0.3);
//	new Effect.Move(object, { x: width, mode: 'relative', duration:0.3 });
	setTimeout(function()
		{
			if (width > 0)
				scrollFirst(galleryId);
			else
				scrollLast(galleryId);
		},
		300
	);
}

function flattenImage(id, image)
{
	var block_width = parseInt($('block_' + id).getStyle('width'));
	var arrangement = $('arrangement_' + id);
	var arrangement_left = parseInt(arrangement.getStyle('left'));
	var arrangement_width = parseInt(arrangement.getStyle('width'));
	var image_left = parseInt(image.offsetLeft);
	var move = 	(image_left + arrangement_left) - block_width/2 + parseInt(image.getStyle('width'))/2;
	
//	alert(move + Math.abs(arrangement_left) + );
	
	
	if (move + Math.abs(arrangement_left) + block_width > arrangement_width)
	{
		scrollLast(id);
		return;
	}
//	alert(move - arrangement_left);
	if (move - arrangement_left < 0)
	{
		scrollFirst(id);
		return;
	}
	
	moveGallery(id, -move);

}

function scrollFirst(id)
{
	var object = $('arrangement_' + id);
	var left = parseInt(Element.getStyle(object, 'left'));
	
	var move = left;
//	if (move == 0)
//		pushGallery(id, 25);
//	else
//		new Effect.Move(object, { x: -move, mode: 'relative' });
	moveGallery(id, -move);
}

function scrollLast(id)
{
	var block_width = parseInt($('block_' + id).getStyle('width'));
	var object = $('arrangement_' + id);
	var left = parseInt(Element.getStyle(object, 'left'));
	var width = parseInt(object.getStyle('width'));

	var move = width + left - block_width;

	moveGallery(id, -move);
}

var startX;
function startDrag(event)
{
	startX = Event.pointer(event).x;
}

function stopDrag(galleryId, event)
{
	var endX = Event.pointer(event).x;
	var arrangement = $('arrangement_' + galleryId);
	
	var move = endX - startX;
	if (Math.abs(move) > 75)
	{
		if (move > 0)
			scrollPrevius(galleryId);
		else
			scrollNext(galleryId);
	}
}

var is_showScroller = 0;
function showScroller(galleryId, event)
{
	is_showScroller = 1;
	setTimeout(function()
		{
			if (is_showScroller == 1)
			{
				var pointer = Event.pointer(event);
				var scroller = $('scroller_' + galleryId);
				var objOffset = Element.cumulativeScrollOffset(scroller);
				
				new Effect.Opacity(scroller, { from: 0, to: 0.6, duration: 0.5 });
				is_showScroller = 0;
			}
		},
		650
	);
}

function hideScroller(galleryId)
{
	if (is_showScroller == 0)
	{
		var scroller = $('scroller_' + galleryId);
		new Effect.Opacity(scroller, { from: 0.6, to: 0, duration: 0.5 });
	}
	else
		is_showScroller = 0;
}