function dropMemoryAnim()
{
	if(!execStarted)
		executeHighResolutionTimer(1);
	
	var xOffset = 280;
	var yOffset = 154;
	var wOffset = 440;
	var hOffset = 66;
	
	var xTiles = 20;
	var yTiles = 3;
	
	var holder = document.createElement('div');
	holder.id = 'memory_banner';
	setStyle(holder, 'position', 'absolute');
	setStyle(holder, 'display', 'block');
	setStyle(holder, 'overflow', 'hidden');
	setElementBounds(holder, xOffset, yOffset-8, wOffset, hOffset+16);
	document.body.appendChild(holder);
	
	
	for(var y=0; y<yTiles; y++)
	{
		for(var x=0; x<xTiles; x++)
		{
			var elem  = document.createElement('div');
			elem.id   = 'memory_banner_'+x+'_'+y;
			elem.dstX = 0 + x*22;
			elem.dstY = 8 + y*22;
			setStyle(elem, 'background-image', "url('./images/memory_cards_back2.png')");
			setStyle(elem, 'background-position', '-'+(x*22)+'px -'+(y*22)+'px');
			setStyle(elem, 'position', 'absolute');
			setStyle(elem, 'display', 'block');
			setStyle(elem, 'cursor', 'pointer');
			setStyle(elem, 'margin', '0px');
			setStyle(elem, 'padding', '0px');
			setStyle(elem, 'border', 'none');
			elem.onclick = function() { window.location="./?page=186&rightpage=189"; };
			setElementBounds(elem, elem.dstX,-500, 22,22);
			holder.appendChild(elem);
			
			var delay = 1000;
			delay += Math.floor(Math.random() * 50);
			delay += (yTiles-y)*150;
			delay += x*125;
			
			var bounce1 = Math.floor(4+Math.random()*4);
			var bounce2 = Math.floor(bounce1 * 0.33);
			
			var queue = new LerperQueue();
			queue.enqueue(createEvalLerper("setStyle('"+elem.id+"', 'top', [VALUE]);", delay, 10, 1250, elem.dstY-250,      elem.dstY,         powTransform));
			queue.enqueue(createEvalLerper("setStyle('"+elem.id+"', 'top', [VALUE]);", 0,     10,  250, elem.dstY,          elem.dstY-bounce1, invPowTransform));
			queue.enqueue(createEvalLerper("setStyle('"+elem.id+"', 'top', [VALUE]);", 0,     10,  250, elem.dstY-bounce1,  elem.dstY,         powTransform));
			queue.enqueue(createEvalLerper("setStyle('"+elem.id+"', 'top', [VALUE]);", 0,     10,  125, elem.dstY,          elem.dstY-bounce2, invPowTransform));
			queue.enqueue(createEvalLerper("setStyle('"+elem.id+"', 'top', [VALUE]);", 0,     10,  125, elem.dstY-bounce2,  elem.dstY,         powTransform));
			queue.enqueue(createTaskInLerper("setStyle('"+elem.id+"', 'background-image', \"url('./images/memory_banner.png')\")", Math.floor(2000 + Math.random()*4000)));
		}
	}
}

function createTaskInLerper( evalString, delay )
{
	var initFunc = function()
	{
		//
	};
	
	var execFunc = function( t )
	{
		//
	};
	
	var exitFunc = function()
	{
		eval(evalString);
	};
	
	return new Lerper( uniqueNumber() , delay, 1, 1, initFunc, execFunc, exitFunc );
}

function createEvalLerper( evalString, delay, interval, duration, beginValue, endValue, lerpTransform )
{
	var transformEval = function( value )
	{
		var parts = split(evalString, "[VALUE]");
		var joined = '';
		for(var i=0; i<parts.length; i++)
			joined += (i==0?'':value) + parts[i];
		return joined;
	};
	
	var initFunc = function()
	{
		eval(transformEval(beginValue));
	};
	
	var execFunc = function( t )
	{
		if(lerpTransform != null)
			t = lerpTransform(t);
		eval(transformEval(lerp(t, beginValue, endValue)));
	};
	
	var exitFunc = function()
	{
		eval(transformEval(endValue));
	};
	
	return new Lerper( uniqueNumber() , delay, interval, duration, initFunc, execFunc, exitFunc );
}

function showMemoryBannerNow()
{
	var xOffset = 280;
	var yOffset = 154;
	var wOffset = 440;
	var hOffset = 66;
		
	var holder = document.createElement('div');
	holder.id = 'memory_banner';
	setStyle(holder, 'position', 'absolute');
	setStyle(holder, 'display', 'block');
	setStyle(holder, 'overflow', 'hidden');
	setElementBounds(holder, xOffset, yOffset-8, wOffset, hOffset+16);
	document.body.appendChild(holder);
	
	
	var elem  = document.createElement('div');
	elem.id   = 'memory_banner_0_0';
	setStyle(elem, 'background-image', "url('./images/memory_banner.png')");
	setStyle(elem, 'background-position', '0px 0px');
	setStyle(elem, 'position', 'absolute');
	setStyle(elem, 'display', 'block');
	setStyle(elem, 'cursor', 'pointer');
	setStyle(elem, 'margin', '0px');
	setStyle(elem, 'padding', '0px');
	setStyle(elem, 'border', 'none');
	elem.onclick = function() { window.location="./?page=186&rightpage=189"; };
	setElementBounds(elem, 0, 8, wOffset,hOffset);
	holder.appendChild(elem);
}

function showBannerOrAnimation()
{
	ajax('POST', './app_quickform/guest_prop.php', null, 'curValue=fetch&property=memory_banner_animation_shown', showBannerOrAnimationCallback);
}

function showBannerOrAnimationCallback( response )
{
	if(!startsWith(response, 'SUCCESS:'))
		return;
		
	moveThumbnails(dumpThumbnails());
	
	return;
		
	var value = after(response, 'SUCCESS:');
	if(value=='true')
	{
		if(Math.random() < 0.5)
			showMemoryBannerNow();
		else
			moveThumbnails(dumpThumbnails());
	}
	else
	{
		dropMemoryAnim();
		ajax('POST', './app_quickform/guest_prop.php', null, 'property=memory_banner_animation_shown&newValue=true', null);
	}
}




function dumpThumbnails()
{	
	var off = 1300;
	var end = 1363;
	var prefix = '/images/kewlox-nl-photos/tiny/DSC0';
	var postfix = '.png';
	

	var holder = fetchElement('topmenu_bar', false);
	if(holder==null)
		return null;
		
	var func = function(evt)
	{
		var xy = fetchMouseCoordsFromEvent(evt);
		if(!isInsideElement(bannerHolder, xy[0], xy[1]))
		{
			xStepDelay = Math.min(500, Math.floor(xStepDelay * 1.10));
			if(xStepDelay == 500) xStep = 0;
			return;
		}
		
		var x = xy[0] - getAbsoluteX(bannerHolder);
		var w = getStyle(bannerHolder, 'width');
		var xFromCenter = x-(w/2);
		var xRel = -xFromCenter/(w/2);
		
		var middle = 0.25;
		
		if(xRel > -middle && xRel < middle)
		{
			xStepDelay = 50;
			xStep = 0;
		}
		else if(xRel > 0)
		{
			xStepDelay = interpolate(xRel, middle, 1.0, 50, 10);
			xStep = +2;
		}
		else
		{
			xStepDelay = interpolate(-xRel, middle, 1.0, 50, 10);
			xStep = -2;		
		}
		
		//while(xStepDelay < 100){xStepDelay*=2; xStep*=2;}			
		
		//fetchElement('header_tagline', true).innerHTML = xStep+"/"+xStepDelay;
	};
		
	var bannerHolder = document.createElement('div');
	setStyle(bannerHolder, 'display', 'block');
	setStyle(bannerHolder, 'position', 'absolute');
	setStyle(bannerHolder, 'left', 192+50);
	setStyle(bannerHolder, 'top', 4);
	setStyle(bannerHolder, 'width', 506);
	setStyle(bannerHolder, 'height', 68);
	setStyle(bannerHolder, 'background-color', 'white');
	setStyle(bannerHolder, 'overflow', 'hidden');	
	holder.appendChild(bannerHolder);
	
	var bannerLeft = document.createElement('div');
	setStyle(bannerLeft, 'display', 'block');
	setStyle(bannerLeft, 'position', 'absolute');
	setStyle(bannerLeft, 'left', 192+50-xSpacing);
	setStyle(bannerLeft, 'top', 4);
	setStyle(bannerLeft, 'width', xSpacing);
	setStyle(bannerLeft, 'height', 68);
	setStyle(bannerLeft, 'background-color', 'white');
	setStyle(bannerLeft, 'overflow', 'hidden');
	holder.appendChild(bannerLeft);
	
	var bannerRight = document.createElement('div');
	setStyle(bannerRight, 'display', 'block');
	setStyle(bannerRight, 'position', 'absolute');
	setStyle(bannerRight, 'left', 192+50+506);
	setStyle(bannerRight, 'top', 4);
	setStyle(bannerRight, 'width', xSpacing);
	setStyle(bannerRight, 'height', 68);
	setStyle(bannerRight, 'background-color', 'white');
	setStyle(bannerRight, 'overflow', 'hidden');
	holder.appendChild(bannerRight);
		
	var elems = new Array();
	
	executeHighResolutionTimer(10);
	
	
	var preventClose = false;
	var frntElem = null;
	
	var funcHide = function()
	{
		if(!preventClose && frntElem != null)
			detachElement(frntElem);
		preventClose = false;
	};

	
	var funcBigger = function()
	{					
		var this_ = this;

		var initFunc = function()
		{
			this_.src = replaceStr(this_.src, '/tiny/', '/small/');
			
			setElementDim(this_,60,45);
			
			this_.xRel.setup(-9);
			this_.xRel.apply(0.0);
			
			this_.yRel.setup(-8);
			this_.yRel.apply(0.0);
		};
		var execFunc = function( t )
		{
			setElementDim(this_, lerp(t,60,80), lerp(t,45,60));
			
			this_.xRel.apply(t);
			this_.yRel.apply(t);
		};
		var exitFunc = function()
		{
			setElementDim(this_,80,60);
			
			this_.xRel.apply(1.0);
			this_.yRel.apply(1.0);
		};
		
		var lerper = new Lerper( null, 0, 25, 500, initFunc, execFunc, exitFunc );
		this.animationQueue.enqueue( lerper );
		//this.animationQueue.enqueue( new Lerper( null, 0, 100, 2500, null, null, null ) );
	};
	
	var funcSmaller = function()
	{
		var this_ = this;
		
		var initFunc = function()
		{	
			setElementDim(this_,80,60);
			
			this_.xRel.setup(+9);
			this_.xRel.apply(0.0);
			
			this_.yRel.setup(+8);
			this_.yRel.apply(0.0);
		};
		var execFunc = function( t )
		{
			setElementDim(this_, lerp(t,80,60), lerp(t,60,45));
			
			this_.xRel.apply(t);
			this_.yRel.apply(t);
		};
		var exitFunc = function()
		{
			setElementDim(this_,60,45);
			
			this_.xRel.apply(1.0);
			this_.yRel.apply(1.0);
			
			this_.src = replaceStr(this_.src, '/small/', '/tiny/');
		};
		
		var lerper = new Lerper( null, 0, 25, 500, initFunc, execFunc, exitFunc );
		this.animationQueue.enqueue( lerper );
	};
	
	var funcClick = function()
	{
		frntElem = createFullscreenElement();
		frntElem.onclick = funcHide;
		

		
		var backElem = createFullscreenElement();
		setStyle(backElem, 'background-color', 'black');
		setElementAlpha(backElem, 0.75);
		backElem.onclick = funcHide;
		frntElem.appendChild(backElem);
		
		var img = document.createElement('img');
		img.src = replaceStr(replaceStr(this.src, '/tiny/', '/normal/'), '/small/', '/normal/');

		setStyle(img, 'display', 'block');
		setStyle(img, 'position', 'absolute');
		setStyle(img, 'left', 180);
		setStyle(img, 'top', 75);
		setStyle(img, 'width', 640);
		setStyle(img, 'height', 480);
		setStyle(img, 'border', '1px solid white');
		setStyle(img, 'cursor', 'pointer');
		img.funcRelImage = function( move )
		{
			var curId = between(this.src, '/images/kewlox-nl-photos/normal/DSC0', '.png');
			
			var index = -1;
			for(var i=0; i<elems.length; i++)
				if(curId == between(elems[i].src, prefix, postfix))
					index = i;
			
			index = (((index+move)%elems.length)+elems.length)%elems.length;
						
			this.src = replaceStr(replaceStr(elems[index].src, '/tiny/', '/normal/'), '/small/', '/normal/');
		};
		img.onclick = funcHide; ;
		frntElem.appendChild(img);
		
		var prevNext = document.createElement('div');
		prevNext.src = './images/gui/icons/32x32/set3-pijl-links.png';
		setStyle(prevNext, 'display', 'block');
		setStyle(prevNext, 'position', 'absolute');
		setStyle(prevNext, 'left', 180);
		setStyle(prevNext, 'top', 555);
		setStyle(prevNext, 'width', 642);
		setStyle(prevNext, 'height', 42);
		setStyle(prevNext, 'border', '1px solid white');
		setStyle(prevNext, 'background-color', 'white');
		prevNext.onclick = null;
		frntElem.appendChild(prevNext);
		
		var prevImg = document.createElement('img');
		prevImg.src = './images/gui/icons/32x32/set3-pijl-links.png';
		setStyle(prevImg, 'display', 'block');
		setStyle(prevImg, 'position', 'absolute');
		setStyle(prevImg, 'left', 184);
		setStyle(prevImg, 'top', 560);
		setStyle(prevImg, 'cursor', 'pointer');
		prevImg.onclick = function(evt) { img.funcRelImage(-1); preventClose = true; return false; };
		frntElem.appendChild(prevImg);
		
		var closer = document.createElement('img');
		closer.src = './images/gui/close_button.png';
		setStyle(closer, 'display', 'block');
		setStyle(closer, 'position', 'absolute');
		setStyle(closer, 'left', 180 + (640 - 19)/2);
		setStyle(closer, 'top', 560+6);
		setStyle(closer, 'cursor', 'pointer');
		closer.onclick = function() { detachElement(frntElem); } ;
		frntElem.appendChild(closer);
		
		var nextImg = document.createElement('img');
		nextImg.src = './images/gui/icons/32x32/set3-pijl-rechts.png';
		setStyle(nextImg, 'display', 'block');
		setStyle(nextImg, 'position', 'absolute');
		setStyle(nextImg, 'left', 784);
		setStyle(nextImg, 'top', 560);
		setStyle(nextImg, 'cursor', 'pointer');
		nextImg.onclick = function(evt) { img.funcRelImage(+1); preventClose = true; return false; };
		frntElem.appendChild(nextImg);
		
		document.body.appendChild(frntElem);
		
		if(traceTracking)
			new ElemHoverTracker(frntElem);
	};
	
	var p=0;
	for(var i=off; i<=end; i++)
	{
		if((i > 1314 && i < 1331) ||
		   i==1344||i==1349||
		   i==1352||
		   i==1353||i==1359)
		   continue;
		   
		var elem = document.createElement('img');
		elem.xRel = new RelativeStyleLerper(elem, 'left');
		elem.yRel = new RelativeStyleLerper(elem, 'top');
		elem.animationQueue = new LerperQueue();
		elem.src = prefix+i+postfix;
		elem.currentState = 'smaller';
		elem.onmouseover  = funcBigger;
		elem.onmouseout   = funcSmaller;
		elem.onclick      = funcClick;
		setStyle(elem, 'display', 'block');
		setStyle(elem, 'position', 'absolute');
		setStyle(elem, 'left', 2+(p++)*xInterval);
		setStyle(elem, 'top', xSpacing-1);
		setStyle(elem, 'cursor', 'pointer');
		bannerHolder.appendChild(elem);
		
		elems.push(elem);
	}
	
	document.onmousemove = func;
	
	return elems;
}

var wImage    = 60;
var xSpacing  = 12;
var xInterval = wImage+xSpacing;

var xStep = 0;
var xStepDelay = 100;

function moveThumbnails( elems )
{
	if(xStep != 0)
	{
		for(var i=0; i<elems.length; i++)
		{
			var elem = elems[i];
			var left = getStyle(elem, 'left');
			left += xStep;
			if(left < -xInterval)                       left += elems.length*xInterval;
			if(left > elems.length*xInterval-xInterval) left -= elems.length*xInterval;
			setStyle(elem, 'left', left);
		}
	}
	
	setTimeout(function(){ moveThumbnails(elems); }, xStepDelay);
}

var swappingAreaIndex = -1;
var currentShowIndex = 7;

var dst_offset_x = -230;
var dst_offset_y = -50;

function swapAreaWithShow( areaIndex )
{
	if(areaIndex == currentShowIndex)
		return;
	if(swappingAreaIndex != -1)
		return;
	swappingAreaIndex = areaIndex;
	
	if(typeof trackConsole != 'undefined')
	{
		trackConsole.logStatus("area-index", areaIndex);
	}
	
	ajax('POST', 'http://'+location.host+'/app_quickform/guest_visit.php', null, 'request='+strToHex('/index.php')+'&arguments='+strToHex('frontpage___'+areaIndex)+'&java_version_found=pending', null);
	

	var src   = fetchElement('area_'+areaIndex, true);
	var src_x = getStyle(src, 'left');
	var src_y = getStyle(src, 'top');
	var src_w = getStyle(src, 'width');
	var src_h = getStyle(src, 'height');
	
	var dst   = fetchElement('area_'+currentShowIndex, true);
	var dst_x = getStyle(dst, 'left');
	var dst_y = getStyle(dst, 'top');
	var dst_w = getStyle(dst, 'width');
	var dst_h = getStyle(dst, 'height');
	
	//
	
	var src_t = fetchElement('thumb_'+areaIndex, true);
	var dst_t = fetchElement('thumb_'+currentShowIndex, true);
	var src_c = fetchElement('content_'+areaIndex, true);
	var dst_c = fetchElement('content_'+currentShowIndex, true);
	
	var src_offset_x = getStyle(src_c, 'left');
	var src_offset_y = getStyle(src_c, 'top');
	
	//
	
	var initFunc1 = function()
	{
		
	};
	
	var execFunc1 = function( t )
	{
		setElementAlpha(dst,   1.0-t);
		setElementAlpha(src_t, 1.0-t);
	};
	
	var exitFunc1 = function()
	{		
		setElementAlpha(dst,   0.0);
		setElementAlpha(src_t, 0.0);
	};
	
	//
	
	var initFunc2 = function()
	{
		setStyle(src, 'z-index', 9);
		setStyle(dst, 'z-index', 1);
		
		setStyle(src_t, 'top', '-1000');
		//setStyle(src, 'border', '1px solid #0080C0');
	};
	
	var execFunc2 = function( t )
	{
		var src_t = smoothTransform(t);
		var src_lerp_x = lerp(src_t, src_x, dst_x);
		var src_lerp_y = lerp(src_t, src_y, dst_y);
		var src_lerp_w = Math.ceil(lerp(src_t, src_w, dst_w));
		var src_lerp_h = Math.ceil(lerp(src_t, src_h, dst_h));
		setElementBounds(src, src_lerp_x, src_lerp_y, src_lerp_w, src_lerp_h);
		
		setStyle(src_c, 'left', lerp(src_t, src_offset_x, 0));
		setStyle(src_c, 'top',  lerp(src_t, src_offset_y, 0));
	};
	
	var exitFunc2 = function()
	{		
		//setStyle(src, 'z-index', 0);
		setStyle(dst, 'z-index', 0);	
		
		setStyle(dst_t, 'top', '0');
		//setStyle(dst, 'border', 'none');
	};

	//
	
	var initFunc3 = function( )
	{
		setStyle(src_c, 'left', 0);
		setStyle(src_c, 'top',  0);
		setStyle(dst_c, 'left', dst_offset_x);
		setStyle(dst_c, 'top',  dst_offset_y);
		dst_offset_x = src_offset_x;
		dst_offset_y = src_offset_y;
		
		setElementAlpha(dst_c,   0.0);
		
		setElementBounds(dst, src_x, src_y, src_w, src_h);
		setElementBounds(src, dst_x, dst_y, dst_w, dst_h);
	};

	var execFunc3 = function( t )
	{
		setElementAlpha(dst,   t);
		setElementAlpha(dst_t, t);
	};
	
	var exitFunc3 = function(  )
	{
		setElementAlpha(dst,   1.0);
		setElementAlpha(dst_t, 1.0);
		setElementAlpha(dst_c, 1.0);
		
		currentShowIndex = areaIndex;
		swappingAreaIndex = -1;
	};
	
	//
	
		
	var lerper1 = new Lerper( "swapAreaWithShow1", 100, 10,  500, initFunc1, execFunc1, exitFunc1 );
	var lerper2 = new Lerper( "swapAreaWithShow2", 100, 10, 1500, initFunc2, execFunc2, exitFunc2 );
	var lerper3 = new Lerper( "swapAreaWithShow3", 100, 10,  500, initFunc3, execFunc3, exitFunc3 );
	
	var queue = new LerperQueue();
	queue.enqueue(lerper1);
	queue.enqueue(lerper2);
	queue.enqueue(lerper3);
}