var aBoxWidth = 30;

function SetOp ( el, val )
{
	if ( navigator.userAgent.indexOf ( 'MSIE' ) >= 0 ) 
	{
		if ( val == 1 )
			el.style.filter = null;
		else el.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=' + Math.round( val * 100 ) + ')';
	}
	else el.style.opacity = val;
}

function NextGalleryImage ( pelement )
{
	pelement = document.getElementById ( pelement );
	var gc = pelement.gc;
	SetGalleryImage ( pelement.id, ++gc.currentImage );
}


function PrevGalleryImage ( pelement )
{
	pelement = document.getElementById ( pelement );
	var gc = pelement.gc;
	SetGalleryImage ( pelement.id, --gc.currentImage );
}

function SetGalleryImage ( pelement, num )
{
	// Get container div
	pelement = document.getElementById ( pelement );
	var gc = pelement.gc;
	
	// Check current image
	if ( !num && !(num === 0) ) num = gc.currentImage;
	else gc.currentImage = num;
	if ( gc.currentImage >= gc.imgs.length )
		gc.currentImage = gc.imgs.length - 1;
	else if ( gc.currentImage < 0 ) gc.currentImage = 0;
	num = gc.currentImage;
	
	// Activate page
	var as = gc.pages.getElementsByTagName ( 'a' );
	var aGalWidth = parseInt ( pelement.getAttribute ( 'GalleryWidth' ) );
	var boxesInHalfWidth = Math.round ( ( aGalWidth / 2 ) / aBoxWidth );
	if ( !gc.oWidth )
	{
		gc.oWidth = parseInt ( as[as.length-1].style.left ) + aBoxWidth;
	}
	for ( var a = 0; a < as.length; a++ )
	{
		if ( a == num )
		{
			as[a].className = 'Active';
			if ( gc.oWidth >= aGalWidth - aBoxWidth )
			{
				// Offset looks if a (clicked item) has offset >= (aGalWidth / 2) before
				// moving the whole page row
				var offset = (aBoxWidth+1)*(a>=(boxesInHalfWidth-1)?boxesInHalfWidth:(a+1));
				var skew = a*(aBoxWidth+1);
				for ( var b = 0; b < as.length; b++ )
				{
					var basepos = b*(aBoxWidth+1);
					as[b].style.left = (offset-skew+basepos)+"px";
				}
			}
		}
		else as[a].className = '';
	}
	// Start fade routine
	if ( gc.img2.innerHTML.length )
		gc.img1.innerHTML = gc.img2.innerHTML;
	SetOp ( gc.img2, 0 );
	gc.img2.op = 0;
	if ( gc.imgs[num].rel ) gc.img2.innerHTML = '<a href="' + gc.imgs[num].rel + '"><img src="' + gc.imgs[num].src + '" border="0"/></a>';
	else gc.img2.innerHTML = '<img src="' + gc.imgs[num].src + '" border="0"/>';
	if ( gc.imgs[num].description && gc.imgs[num].description.length )
	{
		gc.img2.innerHTML += '<div class="Description">' + gc.imgs[num].description + '</div>';
		var cl = document.createElement ( 'div' ); cl.className = 'Close'; cl.innerHTML = 'X';
		cl.onclick = function (){ gc.img2.getElementsByTagName ( 'div' )[0].style.display = 'none'; }
		gc.img2.getElementsByTagName ( 'div' )[0].appendChild ( cl );
	}
	clearInterval ( gc.intv );
	gc.intv = setInterval ( 'FadeGalleryImageIn(\''+pelement.id+'\')', 50 );
}
function FadeGalleryImageIn ( el )
{
	el = document.getElementById ( el );
	var gc = el.gc;
	if ( gc.img2.op < 1 )
	{
		gc.img2.op += 0.1;
		SetOp ( gc.img2, gc.img2.op );
	}
	else clearInterval ( gc.intv );
}

var galInterval = 0;
function InitGallery ( pelement )
{
	// Get container div
	pelement = document.getElementById ( pelement );
	pelement.setAttribute ( 'GalleryWidth', pelement.id == 'MiniGallerie' ? 233 : 435 );
	
	// Prepare images
	var images = pelement.getElementsByTagName ( 'img' );
	var galleryImages = new Array ( );
	for ( var a = 0; a < images.length; a++ )
	{
		var i = new Image ( );
		i.src = images[a].src;
		i.description = images[a].getAttribute ( 'alt' );
		i.rel = images[a].getAttribute ( 'rel' );
		galleryImages.push ( i );
	}
	pelement.innerHTML = '';
	
	// Setup container
	var gc = document.createElement ( 'div' );
	gc.className = 'GalleryContainer';
	gc.img1 = document.createElement ( 'div' ); gc.img1.className = 'Image1';
	gc.img2 = document.createElement ( 'div' ); gc.img2.className = 'Image2';
	gc.setAttribute ( 'CurrentElement', '1' );
	gc.imgs = galleryImages;
	gc.currentImage = 0;
	
	// Setup pages
	var pages = document.createElement ( 'div' );
	pages.className = 'Pages';
	for ( var a = 0; a < galleryImages.length; a++ )
	{
		var at = document.createElement ( 'a' );
		at.innerHTML = a+1;
		at.pel = pelement.id;
		at.i = a;
		at.onmouseover = function ( ){ clearInterval ( galInterval ); }
		at.onclick = function ( ){ SetGalleryImage ( this.pel, this.i ); }
		at.href = "javascript: void(0)";
		at.style.left = (aBoxWidth+1)+(a*(aBoxWidth+1)) + "px";
		pages.appendChild ( at );
	}
	// Arrow back / forth
	var arF = document.createElement ( 'div' ); arF.className = "ArrowNext";
	var arB = document.createElement ( 'div' ); arB.className = "ArrowPrev";
	arF.el = pelement.id; arB.el = pelement.id;
	arF.onclick = function ( ){ NextGalleryImage ( this.el ); }
	arB.onclick = function ( ){ PrevGalleryImage ( this.el ); }
	gc.appendChild ( arF ); gc.appendChild ( arB );
	
	// Append children
	gc.appendChild ( gc.img1 ); gc.appendChild ( gc.img2 );
	gc.appendChild ( pages );
	pelement.gc = gc;
	gc.pages = pages;
	pelement.appendChild ( gc );
	SetGalleryImage ( pelement.id, 0 );
	
	// galInterval adaptation to soya
	if ( pelement.id == 'MiniGallerie' )
	{
		galInterval = setInterval ( 'GalNextButton ( )', 4000 );
	}
}

// galInterval adaptation to soya
function GalNextButton ( )
{
	var buts = document.getElementById ( 'MiniGallerie' ).getElementsByTagName ( 'a' );
	var active = false;
	for ( var a = 0; a < buts.length; a++ )
	{
		if ( buts[a].className == 'Active' )
			active = buts[a];
	}
	if ( !active ) active = buts[0];
	// Do next one
	for ( var a = 0; a < buts.length; a++ )
	{
		if ( buts[a] == active && buts[a+1] )
		{
			return SetGalleryImage ( 'MiniGallerie', a+1 );
			
		}
	}
	SetGalleryImage ( 'MiniGallerie', 0 );
}