/*
* Preview Image
* @Author: Alexander Gavazov
* @Date: 2007-11-29
*/




// Create Container
/*
addLoadEvent(function() {
	var source = '';

	source += '<div id="PreviewImageContainer">';
		source += '<div id="PreviewImageBackground"></div>';
		source += '<div id="PreviewImageBorder"></div>';
		source += '<div id="PreviewImageContent"></div>';
		source += '<div id="PreviewImageClickArea"></div>';
		source += '<div id="PreviewImageBg"></div>';
		source += '<div id="PreviewImageTitle"><div id="PreviewImageTitleText"></div><div id="PreviewImageTitleShadow"></div></div>';
	source += '</div>';
	document.body.innerHTML += source;
});
*/


function PreviewImage(preloaderLocation)
{
	var relId = 'pi';
	var links = [];
	var linksGroups = [];

	var htmlContainer = $('PreviewImageContainer');
	var htmlContent = $('PreviewImageContent');
	var htmlBorder = $('PreviewImageBorder');
	var htmlContainerBackground = $('PreviewImageBackground');
	var htmlClickArea = $('PreviewImageClickArea');

	var titleId = 'PreviewImageTitle';
	var titleTextId = 'PreviewImageTitleText';
	var titleShadowId = 'PreviewImageTitleShadow';

	var previewImageId = 'PreviewImageFile';
	var previewImageIdTemp = 'TempPreviewImageFile';
	var previewImageLocation;

	var preloaderId = 'PreviewImagePreloader';

	var closeButtonId = 'PreviewImageClose';
	var closeButtonSource = '<span id="' + closeButtonId + '" style="opacity: 0;"></span>';

	var lastImage;
	var title;
	var group;
	var previewId;

	var Calculators = [];

	var offsets = {
		outside: -14,
		left: 0,
		top: 0
	};

	var containerPositions = {
		startWidth: 0,
		endWidth: 0,
		startHeight: 0,
		endHeight: 0
	};

	init();

	// Init
	function init()
	{
		searchLinks();

		setWindowsResizeEvents();

		setOpacity(htmlContainerBackground, 30);
		setOpacity(htmlBorder, 30);

		setOpacity($(titleShadowId), 60);
		setOpacity(htmlClickArea, 1); // IE
	}


	// Search links with suitable rel attributes, set click event and group
	function searchLinks()
	{
		var testRel = new RegExp('^' + relId + '(:|$)');
		var elements = document.getElementsByTagName('A');
		var iAdd = 0;

		for(var i = 0; i < elements.length; i++)
		{
			if(testRel.test(elements[i].rel))
			{
				links[iAdd] = elements[i];

				elements[i].onclick = createImage;
				elements[i].setAttribute('preview_id', iAdd);

				var group = (elements[i].rel.split(':')[1]) ? elements[i].rel.split(':')[1] : false;
				if(group)
				{
					if(!linksGroups[group])
					{
						linksGroups[group] = [];
					}

					linksGroups[group][iAdd] = true;

					elements[i].setAttribute('group', group);
				}

				iAdd++;
			}
		}
	}


	// Starting to create preview image
	function createImage(id)
	{
		// Check functions is called by link or other event
		if(typeof(id) == 'string')
		{
			var workLink = links[id];
		}
		else
		{
			var workLink = this;
		}


		// Remove cursor and click event on container (border tag)
		htmlClickArea.style.cursor = 'default';
		htmlClickArea.onclick = function() {return false};

		// Set group and id
		group = (workLink.getAttribute('group')) ? (workLink.getAttribute('group')) : false;
		previewId = (workLink.getAttribute('preview_id')) ? (workLink.getAttribute('preview_id')) : false;

		if(lastImage != previewId)
		{
			destroyPreloader();
			createPreloader(workLink);

			title = (workLink.title) ? workLink.title : '';

			// Add image to temporary container
			previewImageLocation = workLink.href;
			$('t').innerHTML = '<img src="' + previewImageLocation + '" id="' + previewImageIdTemp + '" alt="" />';

			// Set load event
			$(previewImageIdTemp).onload = loadImage;
		}

		lastImage = previewId;

		return false;
	}


	// Show preview image (on load)
	function loadImage()
	{
		// Out script
		stopTooltip = true;

		destroyPreloader();
		destroyClosButton();
		destroyTitle();

		// Show container
		htmlContainer.style.display = 'block';

		if($(previewImageId))
		{
			fade(previewImageId, 0, 100, .5, setContainerStartPosition);
		}
		else
		{
			setContainerStartPosition();
		}
	}


	// Set continaer start position (centerd by window) id needed
	function setContainerStartPosition()
	{
		// Remove content code
		removeNodes(htmlContent);

		if(!htmlContainer.style.left)
		{
			htmlContainer.style.left = getDocumentSize()['width'] / 2 + 'px';
		}

		if(!htmlContainer.style.top)
		{
			htmlContainer.style.top = getDocumentSize()['height'] / 2 + 'px';
		}

		resizeContainerWidth();
	}


	// Resize container - Width
	function resizeContainerWidth()
	{
		// Calculate data
		containerPositions.startWidth = htmlContainer.offsetWidth;
		containerPositions.endWidth = $(previewImageIdTemp).width + offsets.outside;

		// Set positively integers
		containerPositions.startWidth = positivelyInt(containerPositions.startWidth);
		containerPositions.endWidth = positivelyInt(containerPositions.endWidth);

		// Check if Calcolator is init
		if(Calculators['Width'])
		{
			Calculators['Width'].stop();
		}
		else
		{
			Calculators['Width'] = new Tween
		}

		// Start move
		Calculators['Width'].init(htmlContainer.style, 'width', Tween.strongEaseOut, containerPositions.startWidth, containerPositions.endWidth, .5, 'px');
		// Set next step on complete
		Calculators['Width'].onMotionFinished = resizeContainerHeight;
		Calculators['Width'].start();

		// Go to left positing
		resizeContainerLeft();
	}


	// Resize container - Position Left
	function resizeContainerLeft()
	{
		// Calculate data
		var startLeft = parseInt(htmlContainer.style.left);
		var endLeft = (getDocumentSize()['width'] - containerPositions.endWidth + offsets.left) / 2;
		endLeft += document.documentElement.scrollLeft;

		// Set positively integers
		startLeft = positivelyInt(startLeft);
		endLeft = positivelyInt(endLeft);

		// Check if Calcolator is init
		if(Calculators['Left'])
		{
			Calculators['Left'].stop();
		}
		else
		{
			Calculators['Left'] = new Tween
		}

		// Start move
		Calculators['Left'].init(htmlContainer.style, 'left', Tween.strongEaseOut, startLeft, endLeft, .5, 'px');
		Calculators['Left'].start();
	}


	// Resize container - Height
	function resizeContainerHeight()
	{
		// Calculate data
		containerPositions.startHeight = htmlContainer.offsetHeight;
		containerPositions.endHeight = $(previewImageIdTemp).height + offsets.outside;

		// Set positively integers
		containerPositions.startHeight = positivelyInt(containerPositions.startHeight);
		containerPositions.endHeight = positivelyInt(containerPositions.endHeight);

		// Check if Calcolator is init
		if(Calculators['Height'])
		{
			Calculators['Height'].stop();
		}
		else
		{
			Calculators['Height'] = new Tween
		}

		// Start move
		Calculators['Height'].init(htmlContainer.style, 'height', Tween.strongEaseOut, containerPositions.startHeight, containerPositions.endHeight, .5, 'px');
		// Set next step on complete
		Calculators['Height'].onMotionFinished = insertImage;
		Calculators['Height'].start();

		// Go to top positing
		resizeContainerTop()
	}


	// Resize container - Position Left
	function resizeContainerTop()
	{
		// Calculate data
		var startTop = parseInt(htmlContainer.style.top);
		var endTop = (getDocumentSize()['height'] - containerPositions.endHeight + offsets.top) / 2;

		if(containerPositions.endHeight > getDocumentSize()['height'])
		{
			endTop = document.documentElement.scrollTop;
		}
		else
		{
			endTop += document.documentElement.scrollTop;
		}

		// Set positively integers
		startTop = positivelyInt(startTop);
		endTop = positivelyInt(endTop);

		// Check if Calcolator is init
		if(Calculators['Top'])
		{
			Calculators['Top'].stop();
		}
		else
		{
			Calculators['Top'] = new Tween
		}

		// Start move
		Calculators['Top'].init(htmlContainer.style, 'top', Tween.strongEaseOut, startTop, endTop, .5, 'px');
		Calculators['Top'].start();
	}


	// Insert loaded image
	function getNextGroupImage()
	{
		var iLast = 0;
		var next = false;

		for(i in linksGroups[group])
		{
			if(iLast == previewId)
			{
				next = i;
			}

			iLast = i;
		}

		return next;
	}


	// Insert loaded image
	function insertImage()
	{
		htmlContent.innerHTML = '<img src="' + previewImageLocation + '" id="' + previewImageId + '" style="opacity: 0" alt="" />';

		var nextImage = getNextGroupImage();
		if(nextImage)
		{
			htmlClickArea.style.cursor = 'pointer';
			htmlClickArea.onclick = function () {
				if(nextImage)
				{
					createImage(nextImage);
				}
			};
		}

		fade(previewImageId, 100, 0, .9, function() {
			createCloseButton();
			createTitle();
		});
	}


	// Create preloader
	function createPreloader(element)
	{
		var preloaderElement = document.createElement('span');
		preloaderElement.id = preloaderId;
		element.appendChild(preloaderElement);
	}


	// Destroy preloader
	function destroyPreloader()
	{
		if($(preloaderId))
		{
			$(preloaderId).parentNode.removeChild($(preloaderId));
		}
	}


	// When window is resized or scrolled...
	function setWindowsResizeEvents()
	{
		return false;
		
		
		
		addLoadEvent(resizeContainerLeft, 'onresize');
		addLoadEvent(resizeContainerTop, 'onresize');

		addLoadEvent(function() { setTimeout(resizeContainerLeft, 300); }, 'onscroll');
		addLoadEvent(function() { setTimeout(resizeContainerTop, 300); }, 'onscroll');
	}


	// Create close button
	function createCloseButton()
	{
		var closeElement = document.createElement('span');
		closeElement.id = closeButtonId;
		closeElement.style.opacity = 0;
		closeElement.onclick = removeContainer;
		htmlContent.appendChild(closeElement);

		setOpacity($(closeButtonId), 70);
	}
	// Destroy close button
	function destroyClosButton()
	{
		if($(closeButtonId))
		{
			$(closeButtonId).parentNode.removeChild($(closeButtonId));
		}
	}


	// Create title
	function createTitle()
	{
		if(title)
		{
			$(titleId).style.display = 'block';
			$(titleTextId).innerHTML = title;
		}
	}
	// Destroy title
	function destroyTitle()
	{
		$(titleId).style.display = 'none';
	}


	// Start removing preview image
	function removeContainer()
	{
		lastImage = '';
		removeNodes(htmlContent);
		htmlContainer.style.display = 'none';
		htmlContainer.style.width = '10px';
		htmlContainer.style.height = '10px';
		htmlContainer.style.left = null;

		stopTooltip = false;
	}
}


addLoadEvent(function(){
	new PreviewImage(root_dir + 'images/site_images/preloader_text.gif');
});