/*
 * tsunami.js
 * This script controls the behaviour of the tsunami effect.
 *
 * @author Jack Weinert (lieblinx/CodeMonkz)
 */
var tsunamis = ((!tsunamis) ? ([]) : (tsunamis));

// DPTsunami -------------------------------------------------------------------
// A tsunami object.
// ------------------------------------------------------------------- DPTsunami
function DPTsunami(id)
{
	// GetID ---------------------------------------------------------------
	// Return the ID of this tsunami.
	//
	// @return
	// ID of this tsunami.
	// --------------------------------------------------------------- GetID
	this.GetID = DPiTsunami_GetID;
	
	// GetActive -----------------------------------------------------------
	// Return the coordinates (thumb column and line) of the active thumb.
	//
	// @return
	// an array [column,line] of the active thumb.
	// ----------------------------------------------------------- GetActive
	this.GetActive = DPiTsunami_GetActive;
	
	// GetActiveIndex ------------------------------------------------------
	// Return the index of the active thumb.
	//
	// @return
	// index of the active thumb
	// ------------------------------------------------------ GetActiveIndex
	this.GetActiveIndex = DPiTsunami_GetActiveIndex;
	
	// GetThumbCount -------------------------------------------------------
	// Return the number of thumb container elements.
	//
	// @return
	// number of thumb container element
	// ------------------------------------------------------- GetThumbCount
	this.GetThumbCount = DPiTsunami_GetThumbCount;
	
	// GetThumbElement -----------------------------------------------------
	// Return a thumb container element.
	//
	// @param
	// x - x position (column) of the thumb container element
	// y - y position (line) of the thumb container element
	// ----------------------------------------------------- GetThumbElement
	this.GetThumbElement = DPiTsunami_GetThumbElement;
	
	// GetThumbElement -----------------------------------------------------
	// Return a thumb container element given by its generic index.
	//
	// @param
	// index - index of the thumb container element
	//
	// @return
	// null - index out of range
	// otherwise - thumb container element
	// ----------------------------------------------------- GetThumbElement
	this.GetThumbElementByIndex = DPiTsunami_GetThumbElementByIndex;
	
	// SetActive -----------------------------------------------------------
	// Set the active thumb element of this tsunami.
	//
	// @param
	// x - x position (column) of the thumb element
	// y - y position (line) of the thumb element
	// ----------------------------------------------------------- SetActive
	this.SetActive = DPiTsunami_SetActive;
	
	// SetActiveIndex ------------------------------------------------------
	// ------------------------------------------------------ SetActiveIndex
	this.SetActiveIndex = DPiTsunami_SetActiveIndex;
	
	// SetMouseOver --------------------------------------------------------
	// Inform this tsunami that the mouse is currently of a given thumb
	// element.
	//
	// @param
	// x - x position (column) of the thumb element
	// y - y position (line) of the thumb element
	// -------------------------------------------------------- SetMouseOver
	this.SetMouseOver = DPiTsunami_SetMouseOver;
	
	// SetMouseOut ---------------------------------------------------------
	// Inform this tsunami that the mouse has left a given thumb element.
	//
	// @param
	// x - x position (column) of the left thumb element
	// y - y position (line) of the left thumb element
	// --------------------------------------------------------- SetMouseOut
	this.SetMouseOut = DPiTsunami_SetMouseOut;
	
	// AppendThumbLine -----------------------------------------------------
	// Append a thumb element line to this tsunami.
	//
	// @param
	// lineElement - line container element
	// ----------------------------------------------------- AppendThumbLine
	this.AppendThumbLine = DPiTsunami_AppendThumbLine;
	
	// AppendThumb ---------------------------------------------------------
	// Append a thumb container element to this tsunami.
	//
	// @param
	// thumbElement - thumb container element that should appended
	// --------------------------------------------------------- AppendThumb
	this.AppendThumb = DPiTsunami_AppendThumb;
	
	// SetBaseElement ------------------------------------------------------
	// Set the base element of this tsunami.
	//
	// @param
	// baseElement - base element that should set
	// ------------------------------------------------------ SetBaseElement
	this.SetBaseElement = DPiTsunami_SetBaseElement;
	
	// SetViewElement ------------------------------------------------------
	// Set the view element of this tsunami.
	//
	// @param
	// viewElement - view element that should set
	// ------------------------------------------------------ SetViewElement
	this.SetViewElement = DPiTsunami_SetViewElement;
	
	// SetPreviewElement ---------------------------------------------------
	// Set the preview element of this tsunami. This element contains all
	// the thumb container elements.
	//
	// @param
	// previewElement - preview element that should set
	// --------------------------------------------------- SetPreviewElement
	this.SetPreviewElement = DPiTsunami_SetPreviewElement;
	
	
	this.id = id;		// ID of this tsunami
	
	this.baseElement = null;
	this.viewElement = null;
	this.previewElement = null;
	
	this.thumbs = [];	// thumb container elements
	this.zooms = [];	// corresponding currently zooms for the thumb
				// elements
	this.active = [];	// current active thumb element
	this.active.x = 0;	// -1 indicates a not valid position
	this.active.y = 0;
	this.mouseOver = [];	// current mouse over thumb element
	this.mouseOver.x = -1;	// -1 indicates a not valid position
	this.mouseOver.y = -1;
	this.isFullscreen = false;
	this.timer = null;	// current timeout object
}

// DPiTsunami_GetID ------------------------------------------------------------
// Return the id of this tsunami.
//
// @return
// null - no id is set
// otherwise - id of this tsunami
// ------------------------------------------------------------ DPiTsunami_GetID
function DPiTsunami_GetID()
{
	return this.id;
}

// DPiTsunami_GetActive --------------------------------------------------------
// -------------------------------------------------------- DPiTsunami_GetActive
function DPiTsunami_GetActive()
{
	return [this.active.x,this.active.y];
}

// DPiTsunami_GetActiveIndex ---------------------------------------------------
// --------------------------------------------------- DPiTsunami_GetActiveIndex
function DPiTsunami_GetActiveIndex()
{
	var thumbIndex = 0;
	
	for (var y in this.thumbs)
	{
		if (y == this.active.y)
		{
			thumbIndex += this.active.x;
			return thumbIndex;
		}
		else
		{
			thumbIndex += this.thumbs[y].length;
		}
	}
	
	return null;
}

// DPiTsunami_GetThumbElement --------------------------------------------------
// Return a thumb container element of this tsunami given by its position.
//
// @param
// x - x position (column) of the desired thumb element
// y - y position (line) of the desired thumb element
//
// @return
// null - failed
// otherwise - thumb container element
// -------------------------------------------------- DPiTsunami_GetThumbElement
function DPiTsunami_GetThumbElement(x,y)
{
	var e = null;
	
	if ((y >= 0) && (y < this.thumbs.length) && (x >= 0) && (x < this.thumbs[y].length))
	{
		e = this.thumbs[y][x];
	}
	
	return e;
}

// DPiTsunami_GetThumbCount ----------------------------------------------------
// ---------------------------------------------------- DPiTsunami_GetThumbCount
function DPiTsunami_GetThumbCount()
{
	var thumbCount = 0;
	for (var y in this.thumbs)
	{
		for (var x in this.thumbs[y])
		{
			thumbCount++;
		}
	}
	
	return thumbCount;
}

// DPiTsunami_GetThumbElementByIndex -------------------------------------------
// ------------------------------------------- DPiTsunami_GetThumbElementByIndex
function DPiTsunami_GetThumbElementByIndex(index)
{
	var thumbCount = 0;
	for (var y in this.thumbs)
	{
		for (var x in this.thumbs[y])
		{
			if (thumbCount == index)
			{
				return this.thumbs[y][x];
			}
			
			thumbCount++;
		}
	}
	
	return null;
}

// DPiTsunami_CreateVideoHTML --------------------------------------------------
// Embed and start the video.
//
// @param
// videoURL (IN) - URL to the video file
// imageURL (IN) - URL to the image file (still)
// playerURL (IN) - URL to the player
// destHTMLID (IN) - ID of the HTML container where to embed the video
// width (IN) - width in pixel
// height (IN) - height in pixel
// -------------------------------------------------- DPiTsunami_CreateVideoHTML
function DPiTsunami_CreateVideoHTML(videoURL,imageURL,playerURL,destHTMLID,
	width,height)
{
	var video = {
		params : {
			wmode : "opaque",
			allowscriptaccess : "always",
			allownetworking : "all"
			},
		flashvars : {
			file : videoURL,
			volume : "80",
			bufferlength : "5",
			quality: "false",
			'logo.hide' : "false",
			image : imageURL,
			title : "",
			linktarget : "_self",
			autostart : "true"
			},
		attr : {
			id : destHTMLID + "_video",
			name : destHTMLID + "_video"
			},
		start : function() {
			swfobject.embedSWF(unescape(playerURL) + "?" + Math.round(1000 * Math.random()),destHTMLID,width,height,"9.0.115",false,this.flashvars,this.params,this.attr);
			}
		};
	video.start();
}

// DPiTsunami_SetActive --------------------------------------------------------
// Set the active thumb element of this tsunami.
//
// @param
// x - x position (column) of the active thumb element
// y - y position (line) of the active thumb element
// (force) - force an update
// -------------------------------------------------------- DPiTsunami_SetActive
function DPiTsunami_SetActive(x,y,force)
{
	if ((this.active.x != x) || (this.active.y != y) || ((force) && (force == true)))
	{
		var thumb = this.GetThumbElement(x,y);
		if (thumb)
		{
			var oldThumb;
			
			HTML.AppendElementClass(thumb,'selected');
			if ((this.active.x != -1) && (this.active.y != -1))
			{
				oldThumb = this.GetThumbElement(this.active.x,this.active.y);
				if (oldThumb)
				{
					HTML.RemoveElementClass(oldThumb,'selected');
				}
			}
			
			this.active.x = parseInt(x,10);
			this.active.y = parseInt(y,10);
			
			var imageURL;
			var imageElement = HTML.GetSubElementByClass(thumb,'fly');
			if ((imageElement) && (imageElement.src))
			{
				imageURL = imageElement.src;
				var lastIndex = imageURL.search(/\.(jpg|jpeg|gif|png)$/i);
				imageURL = imageURL.substring(0,lastIndex);
				lastIndex = imageURL.lastIndexOf('-');
				imageURL = imageURL.substring(0,lastIndex);
				imageURL += '.' + RegExp.$1;
			}
			
			var videoThumb = HTML.HasElementClass(thumb,'video');
			if (videoThumb == true)
			{
				// new image is a video
				var videoURL;
				
				var videoInfoElement  = HTML.GetSubElementByClass(thumb,'videoInfo');
				if ((videoInfoElement) && (videoInfoElement.innerHTML))
				{
					videoURL = videoInfoElement.innerHTML;
				}
				
				// hide large image
				var viewImageElement = HTML.GetSubElementByClass(this.viewElement,'imgLarge');
				HTML.AppendElementClass(viewImageElement,'hidden');
				
				// prepare large video
				var viewVideoElement = HTML.GetSubElementByClass(this.viewElement,'videoLarge');
				HTML.RemoveElementClass(viewVideoElement,'hidden');
				viewVideoElement.innerHTML = '<span id="__videoLarge__" name="__videoLarge__"></span>';
				
				// hide larger (big) image
				var largeImageElement = HTML.GetSubElementByClass(HTML.GetElementByID('fullscreenBox'),'imgBig');
				HTML.AppendElementClass(largeImageElement,'hidden');
				
				// prepare larger (big) video
				var largeVideoElement = HTML.GetSubElementByClass(HTML.GetElementByID('fullscreenBox'),'videoBig');
				HTML.RemoveElementClass(largeVideoElement,'hidden');
				largeVideoElement.innerHTML = '<span id="__videoBig__" name="__videoBig__"></span>';
				
				// run video(s)
				DPiTsunami_CreateVideoHTML(videoURL,imageURL,DP_videoPlayerURL,"__videoLarge__",740,492);
				DPiTsunami_CreateVideoHTML(videoURL,imageURL,DP_videoPlayerURL,"__videoBig__",980,652);
			}
			else
			{
				// image is just an image
				
				// show large image
				var viewImageElement = HTML.GetSubElementByClass(this.viewElement,'imgLarge');
				viewImageElement.src = imageURL;
				HTML.RemoveElementClass(viewImageElement,'hidden');
				
				// hide large video
				var viewVideoElement = HTML.GetSubElementByClass(this.viewElement,'videoLarge');
				HTML.AppendElementClass(viewVideoElement,'hidden');
				viewVideoElement.innerHTML = '';
				
				// show larger (big) image
				var largeImageElement = HTML.GetSubElementByClass(HTML.GetElementByID('fullscreenBox'),'imgBig');
				largeImageElement.src = imageURL;
				HTML.RemoveElementClass(largeImageElement,'hidden');
				
				// hide larger (big) video
				var largeVideoElement = HTML.GetSubElementByClass(HTML.GetElementByID('fullscreenBox'),'videoBig');
				HTML.AppendElementClass(largeVideoElement,'hidden');
				largeVideoElement.innerHTML = '';
			}
			
			// update large paging counter
			var viewPagingElement = HTML.GetSubElementByClass(this.viewElement,'paging');
			if (viewPagingElement)
			{
				var curTag = HTML.GetSubElementByClass(viewPagingElement,'curIndex');
				var countTag = HTML.GetSubElementByClass(viewPagingElement,'count');
				
				if ( (curTag) && (countTag) )
				{
					curTag.innerHTML = this.GetActiveIndex() + 1;
					countTag.innerHTML = this.GetThumbCount();
				}
			}
			
			// update larger (big) paging counter
			var largePagingElement = HTML.GetSubElementByClass(HTML.GetElementByID('fullscreenBox'),'paging');
			if (largePagingElement)
			{
				var curTag = HTML.GetSubElementByClass(largePagingElement,'curIndex');
				var countTag = HTML.GetSubElementByClass(largePagingElement,'count');
				
				if ( (curTag) && (countTag) )
				{
					curTag.innerHTML = this.GetActiveIndex() + 1;
					countTag.innerHTML = this.GetThumbCount();
				}
			}
			
/*			var thumbImgTag = HTML.FirstChildTag(thumb);
			if ((thumbImgTag) && (thumbImgTag.tagName) && (thumbImgTag.tagName == 'IMG'))
			{
				var largeViewElement = this.viewElement;
				for (var i=0;i < 2;i++)
				{
					var imgTag = HTML.FirstChildTag(largeViewElement);
					while (imgTag)
					{
						if ((imgTag) && (imgTag.tagName) && (imgTag.tagName == 'IMG'))
						{
							var largeImageName = thumbImgTag.src;
							var lastIndex = largeImageName.lastIndexOf('.jpg');
							largeImageName = largeImageName.substring(0,lastIndex);
							lastIndex = largeImageName.lastIndexOf('-');
							largeImageName = largeImageName.substring(0,lastIndex);
							largeImageName += '.jpg';
							imgTag.src = largeImageName;
							break;
						}
						
						imgTag = HTML.NextSiblingTag(imgTag);
					}
					
					var pagingTag = HTML.GetSubElementByClass(largeViewElement,'paging');
					if (pagingTag)
					{
						var curTag  = HTML.GetSubElementByClass(pagingTag,'curIndex');
						var countTag = HTML.GetSubElementByClass(pagingTag,'count');
						
						if ((curTag) && (countTag))
						{
							curTag.innerHTML = this.GetActiveIndex() + 1;
							countTag.innerHTML = this.GetThumbCount();
						}
					}
					
					largeViewElement = HTML.GetElementByID('fullscreenBox');
				}
			} /**/
		}
	}
}

// DPiTsunami_SetActiveIndex ---------------------------------------------------
// --------------------------------------------------- DPiTsunami_SetActiveIndex
function DPiTsunami_SetActiveIndex(index)
{
	var thumbIndex = 0;
	for (var y in this.thumbs)
	{
		for (var x in this.thumbs[y])
		{
			if (thumbIndex == index)
			{
				this.SetActive(x,y,true);
				return;
			}
			thumbIndex++;
		}
	}
}

// DPi_Tsunami_Calculate -------------------------------------------------------
// Calculate the tsunami effect itself.
//
// @param
// id - id of the tsunami object
// ------------------------------------------------------- DPi_Tsunami_Calculate
function DPi_Tsunami_Calculate(id)
{
	var tsunami = DPi_GetTsunami(id);
	
	if (tsunami)
	{
		for (var y in tsunami.thumbs)
		{
			for (var x in tsunami.thumbs[y])
			{
				//var zoomFactor = tsunami.zooms[y][x];
				//var dist = Math.sqrt((x - tsunami.mouseOver.x) * (x - tsunami.mouseOver.x) + (y - tsunami.mouseOver.y) * (y - tsunami.mouseOver.y));
				//var dist2 = Math.pow(dist,10);
				var newZoom = 1.0;
				//newZoom = 1.0 + 0.3 / (dist2 + 1.0);
				if ((tsunami.mouseOver.x == x) && (tsunami.mouseOver.y == y))
				{
					newZoom = 1.3;
				}
				zoomFactor = newZoom;
				
				var thumbElement = tsunami.thumbs[y][x];
				var imageElement = HTML.GetSubElementByClass(thumbElement,'fly');
				var spacerElement = HTML.GetSubElementByClass(thumbElement,'spacer');
				if ((spacerElement) && (imageElement))
				{
					var spacerOffset = HTML.GetAbsolutePosition(spacerElement);
					var pivot = [spacerOffset[0] + (115 / 2),spacerOffset[1] + (76 / 2)];
					
					var eWidth = Math.round(115 * zoomFactor);
					var eHeight = Math.round(76 * zoomFactor);
					
					imageElement.style.width = eWidth + 'px';
					imageElement.style.height = eHeight + 'px';
					
					var eLeft = (pivot[0] - (eWidth / 2));
					var eTop = (pivot[1] - (eHeight / 2));
					
					imageElement.style.left = eLeft + 'px';
					imageElement.style.top = eTop + 'px';
					
					if ((tsunami.mouseOver.x != -1) && (tsunami.mouseOver.y != -1))
					{
						var manhattenDist = Math.abs(tsunami.mouseOver.x - x) + Math.abs(tsunami.mouseOver.y - y);
						imageElement.style.zIndex = (100 - manhattenDist);
					}
				}
			}
		}
		
		tsunami.timer = window.setTimeout('DPi_Tsunami_Calculate(\'' + id + '\');',100);
	}
}

// DPiTsunami_SetMouseOver -----------------------------------------------------
// Inform this tsunami that the mouse is over a given thumb element.
//
// @param
// x - x position (column) of the thumb element where the mouse is over
// y - y position (line) of the thumb element where the mouse is over
// ----------------------------------------------------- DPiTsunami_SetMouseOver
function DPiTsunami_SetMouseOver(x,y)
{
	if ((this.mouseOver.x != x) && (this.mouseOver.y != y))
	{
		this.mouseOver.x = x;
		this.mouseOver.y = y;
	}
}

// DPiTsunami_SetMouseOut ------------------------------------------------------
// Inform this tsunami that the mouse is out of a given thumb element.
//
// @param
// x - x position (column) of the thumb element where the mouse is out
// y - y position (line) of the thumb element where the mouse is out
// ------------------------------------------------------ DPiTsunami_SetMouseOut
function DPiTsunami_SetMouseOut(x,y)
{
	if ((this.mouseOver.x == x) && (this.mouseOver.y == y))
	{
		this.mouseOver.x = -1;
		this.mouseOver.y = -1;
	}
}

// DPiTsunami_AppendThumbLine --------------------------------------------------
// Append a thumb element line to this tsunami.
//
// @param
// lineElement - thumb line element that should append
//
// @return
// number of currently existing thumb element lines
// -------------------------------------------------- DPiTsunami_AppendThumbLine
function DPiTsunami_AppendThumbLine(lineElement)
{
	this.thumbs.push([]);
	this.zooms.push([]);
	return this.thumbs.length;
}

// DPiTsunami_AppendThumb ------------------------------------------------------
// Append a thumb container element to this tsunami. It will be appended into
// the current thumb element line.
//
// @param
// thumbElement - thumb container element that should append
// ------------------------------------------------------ DPiTsunami_AppendThumb
function DPiTsunami_AppendThumb(thumbElement)
{
	var thumbLine = (this.thumbs.length - 1);
	this.thumbs[thumbLine].push(thumbElement);
	this.zooms[thumbLine].push(1.0);
	return this.thumbs[thumbLine].length;
}

// DPiTsunami_SetBaseElement ---------------------------------------------------
// Set the base element of this tsunami.
//
// @param
// baseElement - base element that should set
// --------------------------------------------------- DPiTsunami_SetBaseElement
function DPiTsunami_SetBaseElement(baseElement)
{
	this.baseElement = baseElement;
}

// DPiTsunami_SetViewElement ---------------------------------------------------
// Set the view element of this tsunami.
//
// @param
// viewElement - view element that should set
// --------------------------------------------------- DPiTsunami_SetViewElement
function DPiTsunami_SetViewElement(viewElement)
{
	this.viewElement = viewElement;
}

// DPiTsunami_SetPreviewElement ------------------------------------------------
// Set the preview element of this tsunami.
//
// @param
// previewElement - preview element that should set
// ------------------------------------------------ DPiTsunami_SetPreviewElement
function DPiTsunami_SetPreviewElement(previewElement)
{
	this.previewElement = previewElement;
}

// DPi_ScanTsunami -------------------------------------------------------------
// Scan the HTML document for a tsunami structure given by the id of the tsunami
//
// @param
// id - id of the tsunami container
//
// @return
// null - failed
// otherwise - tsunami object
// ------------------------------------------------------------- DPi_ScanTsunami
function DPi_ScanTsunami(id)
{
	var tsunami = new DPTsunami(id);
	var tsunamiElement = HTML.GetElementByID(id);
	if (tsunamiElement)
	{
		tsunami.SetBaseElement(tsunamiElement);
		var viewElement = HTML.GetSubElementByClass(tsunamiElement,'imageView');
		if (viewElement)
		{
			tsunami.SetViewElement(viewElement);
			var previewElement = HTML.GetSubElementByClass(tsunamiElement,'preview');
			if (previewElement)
			{
				tsunami.SetPreviewElement(previewElement);
				var imageLineElements = HTML.GetSubElementsByClass(previewElement,'imageLine');
				for (var i in imageLineElements)
				{
					var imageLineElement = imageLineElements[i];
					tsunami.AppendThumbLine(imageLineElement);
					
					var thumbElements = HTML.GetSubElementsByClass(imageLineElement,'thumb');
					for (var t in thumbElements)
					{
						tsunami.AppendThumb(thumbElements[t]);
					}
				}
			}
		}
		
		tsunamis.push(tsunami);
		
		tsunami.timer = window.setTimeout('DPi_Tsunami_Calculate(\'' + id + '\');',100);
		return tsunami;
	}
}

// DPi_GetTsunami --------------------------------------------------------------
// Return the tsunami object given by its id of the corresponding HTML tag. If
// no such tsunami object exists, it will be created if there is a corresponding
// HTML tag/container.
//
// @param
// id - id of the tsunami container
//
// @return
// null - no tsun
// -------------------------------------------------------------- DPi_GetTsunami
function DPi_GetTsunami(id)
{
	for (var i in tsunamis)
	{
		if (tsunamis[i].GetID() == id)
		{
			return tsunamis[i];
		}
	}
	
	var tsunami = null;
	if (!(tsunami))
	{
		tsunami = DPi_ScanTsunami(id);
		tsunami.SetActive(0,0);
	}
	
	return tsunami;
}

// DP_TsunamiOver --------------------------------------------------------------
// @param
// id - id of the tsunami container
// x - x position (column) of the thumb container where the mouse is over
// y - y position (line) of the thumb container where the mouse is over
// -------------------------------------------------------------- DP_TsunamiOver
function DP_TsunamiOver(id,x,y)
{
	var tsunami = DPi_GetTsunami(id);
	if (tsunami)
	{
		tsunami.SetMouseOver(x,y);
	}
}

// DP_TsunamiOut ---------------------------------------------------------------
// @param
// id - id of the tsunami container
// x - x position (column) of the thumb container where the mouse is out
// y - y position (line) of the thumb container where the mouse is out
// --------------------------------------------------------------- DP_TsunamiOut
function DP_TsunamiOut(id,x,y)
{
	var tsunami = DPi_GetTsunami(id);
	if (tsunami)
	{
		tsunami.SetMouseOut(x,y);
	}
}

// DP_TsunamiClick -------------------------------------------------------------
// @param
// id - id of the tsunami container
// x - x position (column) of the thumb container which was clicked
// y - y position (line) of the thumb container which was clicked
// ------------------------------------------------------------- DP_TsunamiClick
function DP_TsunamiClick(id,x,y)
{
	var tsunami = DPi_GetTsunami(id);
	if (tsunami)
	{
		tsunami.SetActive(x,y);
	}
}

// DP_ShowFullscreen -----------------------------------------------------------
// ----------------------------------------------------------- DP_ShowFullscreen
function DP_ShowFullscreen(id)
{
	var payoffElement = HTML.GetElementByID('payoffBar');
	var middleNavi = HTML.GetElementByID('middleNavigationBar');
	var mainPage = HTML.GetElementByID('mainPage');
	var fullscreenBox = HTML.GetElementByID('fullscreenBox');
	if ((payoffElement) && (middleNavi) && (mainPage))
	{
		var tsunami = DPi_GetTsunami(id);
		if (tsunami)
		{
			tsunami.SetActiveIndex(tsunami.GetActiveIndex());
			
/*			animation.AppendFrame(new DNClassFrame(50,true,'positionAbsolute'));
			animation.AppendFrame(new DNComplexStyleValuesFrame(2000,true,'clip','rect(%dpx, %dpx, %dpx, %dpx)',
				[{'value':100,'suffix':'px'},{'value':200,'suffix':'px'},{'value':200,'suffix':'px'},{'value':100,'suffix':'px'}],
				[{'value':100,'suffix':'px'},{'value':100,'suffix':'px'},{'value':100,'suffix':'px'},{'value':100,'suffix':'px'}],
				'LINEAR')); */
			
			var speedFactor = 0.5;
			
			var payoffAni = new DNAnimation(payoffElement);
			payoffAni.AppendFrame(new DNStyleFrame(0,true,'overflow','hidden'));
			payoffAni.AppendFrame(new DNStyleValueFrame(100 * speedFactor,false,'height',payoffElement.clientHeight,0,'px','SQUARE'));
			payoffAni.AppendFrame(new DNClassFrame(0,true,'hidden'));
			payoffAni.AppendFrame(new DNStyleFrame(0,true,'overflow','visible'));
			payoffAni.StartAnimation();
			DNAniServer.AppendAnimation(payoffAni);
			
			var mnAni = new DNAnimation(middleNavi);
			mnAni.AppendFrame(new DNWaitFrame(100 * speedFactor));
			mnAni.AppendFrame(new DNStyleFrame(0,true,'overflow','hidden'));
			mnAni.AppendFrame(new DNStyleValueFrame(100 * speedFactor,false,'height',middleNavi.clientHeight,0,'px','SQUARE'));
			mnAni.AppendFrame(new DNClassFrame(0,true,'hidden'));
			mnAni.AppendFrame(new DNStyleFrame(0,true,'overflow','visible'));
			mnAni.StartAnimation();
			DNAniServer.AppendAnimation(mnAni);
			
			var mpAni = new DNAnimation(mainPage);
			mpAni.AppendFrame(new DNWaitFrame(150 * speedFactor));
			mpAni.AppendFrame(new DNStyleFrame(0,true,'overflow','hidden'));
			mpAni.AppendFrame(new DNClassFrame(0,true,'inAnimation'));
			mpAni.AppendFrame(new DNStyleValueFrame(500 * speedFactor,false,'height',mainPage.clientHeight,0,'px','SQUARE'));
			mpAni.AppendFrame(new DNClassFrame(0,true,'hidden'));
			mpAni.AppendFrame(new DNRemoveClassFrame('inAnimation'));
			mpAni.AppendFrame(new DNStyleFrame(0,true,'overflow','visible'));
			mpAni.StartAnimation();
			DNAniServer.AppendAnimation(mpAni);
			
			var fsBoxAni = new DNAnimation(fullscreenBox);
			HTML.AppendElementClass(fullscreenBox,'hidden_measureable');
			HTML.RemoveElementClass(fullscreenBox,'hidden');

			fsBoxAni.AppendFrame(new DNWaitFrame(600 * speedFactor));
			fsBoxAni.AppendFrame(new DNStyleFrame(0,true,'overflow','hidden'));
			fsBoxAni.AppendFrame(new DNRemoveClassFrame('hidden_measureable'));
			fsBoxAni.AppendFrame(new DNStyleValueFrame(500 * speedFactor,false,'height',0,fullscreenBox.clientHeight,'px','SQUARE'));
			fsBoxAni.AppendFrame(new DNStyleFrame(0,true,'overflow','visible'));
			fsBoxAni.StartAnimation();
			DNAniServer.AppendAnimation(fsBoxAni);
		
			// very simple switching
			//HTML.AppendElementClass(payoffElement,'hidden');
			//HTML.AppendElementClass(middleNavi,'hidden');
			//HTML.AppendElementClass(mainPage,'hidden');
			//HTML.RemoveElementClass(fullscreenBox,'hidden');
		}
		
		return false;
	}
	
	return false;
}

// DP_HideFullscreen -----------------------------------------------------------
// ----------------------------------------------------------- DP_HideFullscreen
function DP_HideFullscreen(id)
{
	var payoffElement = HTML.GetElementByID('payoffBar');
	var middleNavi = HTML.GetElementByID('middleNavigationBar');
	var mainPage = HTML.GetElementByID('mainPage');
	var fullscreenBox = HTML.GetElementByID('fullscreenBox');
	if ((payoffElement) && (middleNavi) && (mainPage) && (fullscreenBox))
	{
		var tsunami = DPi_GetTsunami(id);
		if (tsunami)
		{
			tsunami.SetActiveIndex(tsunami.GetActiveIndex());
			
/*			var fsBoxAni = new DNAnimation(fullscreenBox);
			fsBoxAni.AppendFrame(new DNWaitFrame(0));
			fsBoxAni.AppendFrame(new DNStyleFrame(0,true,'overflow','hidden'));
			fsBoxAni.AppendFrame(new DNStyleValueFrame(500,false,'height',fullscreenBox.clientHeight,0,'px','SQUARE'));
			fsBoxAni.AppendFrame(new DNClassFrame(0,true,'hidden'));
			fsBoxAni.AppendFrame(new DNStyleFrame(0,true,'overflow','visible'));
			fsBoxAni.StartAnimation();
			DNAniServer.AppendAnimation(fsBoxAni);
			
			var payoffAni = new DNAnimation(payoffElement);
			HTML.AppendElementClass(payoffElement,'hidden_measureable');
			HTML.RemoveElementClass(payoffElement,'hidden');
			
			payoffAni.AppendFrame(new DNWaitFrame(500));
			payoffAni.AppendFrame(new DNStyleFrame(0,true,'overflow','hidden'));
			payoffAni.AppendFrame(new DNRemoveClassFrame('hidden_measureable'));
			payoffAni.AppendFrame(new DNStyleValueFrame(150,false,'height',0,payoffElement.clientHeight,'px','SQUARE'));
			payoffAni.AppendFrame(new DNStyleFrame(0,true,'overflow','visible'));
			payoffAni.StartAnimation();
			DNAniServer.AppendAnimation(payoffAni);
			
			var mnAni = new DNAnimation(middleNavi);
			HTML.AppendElementClass(middleNavi,'hidden_measureable');
			HTML.RemoveElementClass(middleNavi,'hidden');
			
			mnAni.AppendFrame(new DNWaitFrame(550));
			mnAni.AppendFrame(new DNStyleFrame(0,true,'overflow','hidden'));
			mnAni.AppendFrame(new DNRemoveClassFrame('hidden_measureable'));
			mnAni.AppendFrame(new DNStyleValueFrame(150,false,'height',0,middleNavi.clientHeight,'px','SQUARE'));
			mnAni.AppendFrame(new DNStyleFrame(0,true,'overflow','visible'));
			mnAni.StartAnimation();
			DNAniServer.AppendAnimation(mnAni);
			
			var mpAni = new DNAnimation(mainPage);
			HTML.AppendElementClass(mainPage,'hidden_measureable');
			HTML.RemoveElementClass(mainPage,'hidden');
			
			mpAni.AppendFrame(new DNWaitFrame(650));
			mpAni.AppendFrame(new DNStyleFrame(0,true,'overflow','hidden'));
			mpAni.AppendFrame(new DNClassFrame(0,true,'inAnimation'));
			mpAni.AppendFrame(new DNRemoveClassFrame('hidden_measureable'));
			mpAni.AppendFrame(new DNStyleValueFrame(500,false,'height',0,mainPage.clientHeight,'px','SQUARE'));
			mpAni.AppendFrame(new DNRemoveClassFrame('inAnimation'));
			mpAni.AppendFrame(new DNStyleFrame(0,true,'overflow','visible'));
			mpAni.StartAnimation();
			DNAniServer.AppendAnimation(mpAni);*/
			
			// very simple switching
			HTML.RemoveElementClass(payoffElement,'hidden');
			HTML.RemoveElementClass(middleNavi,'hidden');
			HTML.RemoveElementClass(mainPage,'hidden');
			HTML.RemoveElementClass(mainPage,'hidden_measureable');
			HTML.AppendElementClass(mainPage,'inAnimation');
			HTML.AppendElementClass(fullscreenBox,'hidden');
			
			var delayedRemove = new DNAnimation(mainPage);
			delayedRemove.AppendFrame(new DNWaitFrame(200));
			delayedRemove.AppendFrame(new DNRemoveClassFrame('inAnimation'));
			delayedRemove.StartAnimation();
			DNAniServer.AppendAnimation(delayedRemove);
		}
		return false;
	}
	
	return false;
}

// DP_Next ---------------------------------------------------------------------
// --------------------------------------------------------------------- DP_Next
function DP_Next(id)
{
	var tsunami = DPi_GetTsunami(id);
	if (tsunami)
	{
		var index = tsunami.GetActiveIndex();
		if (index < tsunami.GetThumbCount())
		{
			index++;
			tsunami.SetActiveIndex(index);
		}
	}
	return false;
}

// DP_Last ---------------------------------------------------------------------
// --------------------------------------------------------------------- DP_Last
function DP_Last(id)
{
	var tsunami = DPi_GetTsunami(id);
	if (tsunami)
	{
		var index = tsunami.GetActiveIndex();
		if (index > 0)
		{
			index--;
			tsunami.SetActiveIndex(index);
		}
	}
	return false;
}