var	currimage	=	null;
var	currimagenum	=	0;
var	theimage		=	null;
var	mainimage		=	null;
var	imagebuffer		=	null;
var	theimagearea	=	null;

window.addEvent('domready', function() {

	var		closebutton		=	$('closebutton');
	var		prevbutton		=	$('prevbutton');
	var		nextbutton		=	$('nextbutton');

	theimagearea			=	$('theimagearea');
	mainimage				=	$('themainimage');
	imagebuffer				=	$('themainimage');

//	theimagearea.fade( 'hide' ) ;	
//	theimagearea.set('opacity', 0);

	closebutton.addEvent('mouseover', function()	{ roi( 'closebutton','closebutton-hi.png')});	
	closebutton.addEvent('mouseout', function()	{ roi( 'closebutton','closebutton.png')});	
	prevbutton.addEvent('mouseover', function()	{ roi( 'prevbutton','prevbutton-hi.png')});	
	prevbutton.addEvent('mouseout', function()	{ roi( 'prevbutton','prevbutton.png')});	
	nextbutton.addEvent('mouseover', function()	{ roi( 'nextbutton','nextbutton-hi.png')});	
	nextbutton.addEvent('mouseout', function()	{ roi('nextbutton','nextbutton.png')});	

	prevbutton.addEvent('click', function()	{ previmage() });	
	nextbutton.addEvent('click', function()	{ nextimage() });	

	for( i=0; i<imgcnt; i++ )	{
		var	idn	=	'image' + i;
//		$(idn).addEvent('click', theimagearea.fade.bind(theimagearea, [1]) );
		$(idn).addEvent('click', function() { zoomimage2(this); });
	}

	$('closebutton').addEvent('click', theimagearea.fade.bind(theimagearea,[0]));
});


function	nextimage()	{
	if( ++currimagenum >= imgcnt )	{	currimagenum=0;	}
	zoomimage( $('image' + currimagenum) );
}

function	previmage()	{

	if( --currimagenum < 0)	{	currimagenum=imgcnt-1;	}
	zoomimage( $('image' + currimagenum) );
}

function	zoomimage2(obj)	{
	imagebuffer.empty();
	theimagearea.fade( [1]);
	zoomimage(obj);
}

function	zoomimage(obj)	{

	showLoading();
	cin			=	obj.id;
	currimage	=	obj;
	currimagenum	=	cin.substr( 5 ) ;

//	imagebuffer.empty();
//	imagebuffer.fade( [0]) ;	
	theimagearea.setStyle('visibility', 'visible'); 	
	oneimg	=	imgnames[obj.id];
	var newasset = new Asset.image( oneimg[0], { id: 'myImage', title: oneimg[1], alt: oneimg[3],onload: newimageloadcomplete} );	
}

function	newimageloadcomplete( e )	{
	hideLoading();
//	imagebuffer.fade( 'hide' ) ;

	/*
	imgcontainer	=	new	Element('div', {style : 'width : 670px'});

	e.inject(imgcontainer);

	oneimg	=	imgnames[currimage.id];
	imgtitle	=	new Element('div', {id : 'newimagetitle', style : 'text-align : left; text-transform: uppercase; font-size : 1em;'});
	imgdesc		=	new Element('div', {id : 'newimagedesc', style : 'font-size : 0.9em;'});
	imgtitle.set('html' , oneimg[1] );
	imgdesc.set('html' , oneimg[2] );


	imgtitle.inject(imgcontainer );
	imgdesc.inject(imgcontainer );

	imgcontainer.inject(imagebuffer);
	*/

	imagebuffer.empty();
	e.inject(imagebuffer);

	oneimg	=	imgnames[currimage.id];
	
	imgtitle	=	new Element('span', {id : 'newimagetitle', style : 'text-transform: uppercase; font-size : 1.2em; margin-top : 14px; display : block;'});
	imgdesc		=	new Element('span', {id : 'newimagedesc', style : 'font-size : 1em; display : block'});
	imgtitle.set('html' , oneimg[1] );
	imgdesc.set('html' , oneimg[2] );
	
	imgtitle.inject(imagebuffer );
	imgdesc.inject(imagebuffer );

}


function	showLoading()	{
//	var	myFx	=	new Fx.Tween( imagebuffer, {'duration' : 100 });
//	myFx.start('opacity' , 0.5 );

//	imagebuffer.fade( [0.5]) ;
	$('loadingdisplay').fade([0.7]);
	$('loadingdisplay').setStyle( 'background' ,'url(/resources/images/loading-button.gif) no-repeat center center');
//	$('loadingdisplay').fade.bind($('loadingdisplay'),[1]);
}


function	hideLoading()	{
//	$('loadingdisplay').fade.bind($('loadingdisplay'),[0]);
//	imagebuffer.fade( 'show' ) ;	

//	var	myFx	=	new Fx.Tween( imagebuffer, {'duration' : 100 });
//	myFx.start('opacity' , 1 );
//	imagebuffer.fade( 1) ;	

	$('loadingdisplay').setStyle( 'background' ,'none');
}

function	roi(iid, fn)	{
	$(iid).src='/resources/images/'+fn; 
}