var fileExt;
var ynmGalleryPop ={
	//get Thumbnails onload using prototype
	//target all 'a tags'
	load: function() {
		//var browserDims = document.body.getDimensions();
		var dialog = new Element('div');//top:' + browserDims.height/2 + 'px;'
		var newIframe = new Element('IFRAME', { 'id':'videoIframe','scrolling':'no', 'frameborder':'no','style' : 'width:575px; height:345px; overflow:hidden; border:0px;z-index:3600;'});//top:' + browserDims.height/2 + 'px;'
		var next = new Element('img', { 'src' : 'images/rightarrow.png' ,'class' : 'next' ,'style' : 'margin-top:50%;'}).hide();
		var previous = new Element('img', { 'src' : 'images/leftarrow.png' ,'class' : 'previous' ,'style' : 'margin-top:49%;'}).hide();
		var nextDiv = new Element('div', {'class' : 'nextDiv' ,'style' : 'float:right;cursor:pointer; height:100%; width:49%; background-image:url(image/empty.gif);'}).show();
		var previousDiv = new Element('div', {'class' : 'previousDiv' , 'style' : 'float:left;cursor:pointer; height:100%; width:50%; background-image:url(image/empty.gif); '}).show();
		var navBar = new Element('div', {'class':'navBar', 'style' : 'position:absolute; height:100%; width:100%;cursor:pointer;z-index:3500;'}).hide();
		//var debug = new Element('div', {'class':'imageTag'}).show();
		var loader = new Element('img', {'src':'images/ajax-loader.gif','style' : 'z-index:1000;margin-top:25%; width:220px; height:19px;'}).show();
		var loaderDiv = new Element('div', {'src':'images/ajax-loader.gif','style' : 'z-index:1000; position:absolute; text-align:center; height:100%; width:100%;'}).hide();
		var closerDiv = new Element('div', {'style' : 'clear:both; margin-top:-20px; padding-right:-20px;position:absolute;width:100%;z-index:3600;'}).show();
		var closer = new Element('img', {'class':'closer','src':'images/close_bt.png','style' : 'cursor:pointer;clear:both;float:right;','alt' : 'close'}).show();
		var varIndex;
		var varTotal;	
			Event.observe(navBar, 'click',  function(event) {Event.stop(event)})
		var theHeight ='' ;
		var theHeight ='' ;
		var overlay = new DialogOverlay(dialog);
		var target_array=$$('div.thumbNail .centerDiv a');
		var text_array=$$('div.thumbNail .hiddenfield ');
		var text_Overlay=$$('div.thumbNail .imageContainer .thumbOverlay ');
			varTotal = target_array.length;
		var showimg = new Element('img', {'id' : 'enlarged','style' : 'z-index:1000; margin-top:2px;'}).hide();
			//showimg.src = '';
			//showimg.onclick=function(){ this.width=this.width;this.src='images/ajax-loader.gif';}
			target_array.each(function(s, index){
				//$("debug2").innerHTML=target_array;
			centerThumbs($($(s).parentNode));
			getAtagFileEx=s.getAttribute('href').split('/');
			fileExt=getAtagFileEx[getAtagFileEx.length-1].split('.')[1];
			if(fileExt=='flv'){
			s.onclick = function(){
				//alert('video');
				newIframe.src='cmx_videoplayer.asp?file=' + s;
				//alert(s);
				overlay.show();
				closerDiv.insert(closer);
				dialog.insert(closerDiv);
				dialog.insert(newIframe);
				centerDiv(dialog,newIframe);
				return false;
			}
				
			}else{
			s.onclick = function(){
			varIndex=(index);
			 doImage(index); checkIfExists(varIndex); overlay.show();nextDiv.insert(next) ;previousDiv.insert(previous); navBar.insert(previousDiv);closerDiv.insert(closer);navBar.insert(nextDiv);dialog.insert(loaderDiv);loaderDiv.insert(loader);//dialog.insert(debug);;
			return false};
			}
			//showimg.onmouseover = function(){ new Effect.Appear(navBar, { duration: 0.5,  to: 1 });}
		})
		Event.observe(document.onresize ? document : window, "resize", function() {if(fileExt!='flv'){centerDiv(dialog,showimg)}else{centerDiv(dialog,newIframe);}});  
		Event.observe(showimg, 'load',  function(event) {		

							imagesSize = showimg.getDimensions()
							centerDiv(dialog,showimg);
							navBar.show();
							//new Effect.Appear(navBar, { duration: 0.5,  to: 1 });
							var eltDims  = showimg.getDimensions();
							checkIfExists(varIndex);
		}); 

		previousDiv.onclick = function(){
			varIndex--;
			doImage(varIndex)
		}
		
		nextDiv.onclick = function(){	
			//showimg.src='';
			varIndex++;
			doImage(varIndex)
		}
		var checkIfExists = function(theIndex){
			if (theIndex<varTotal-1){ nextDiv.show();} else { nextDiv.hide();}; 
			if (0<theIndex){ previousDiv.show();} else { previousDiv.hide();}
		}
		var doImage = function(theIndex){		
			//alert(theIndex + ' | ' + varIndex)
			if(showimg.src!=target_array[theIndex]){	
			//loader.show();
			showimg.style.width='auto';
			dialog.insert(closerDiv);
			dialog.insert(navBar);
			previousDiv.hide();
			nextDiv.hide();
			navBar.hide()
			dialog.insert(showimg);
			showimg.src=target_array[theIndex];
			showimg.hide();
			closerDiv.show();
			//loader.hide();	
			}
		}
		var centerDiv = function(elt,theimg){
			browser_size_array = new Array();
			browser_size_array = getBrowserSize();
			
			eltDims  = $($(theimg)).getDimensions();
			//alert(eltDims.width)
			var browserDims = document.body.getDimensions();			
			adjustHeight = 20;
			showimg.hide();
			Event.observe(previousDiv, 'mouseover',  function(event) { new Effect.Appear(next, { duration: 0.5,  to: 0 });new Effect.Appear(previous, { duration: 0.5,  to: 1 }); })
			Event.observe(nextDiv, 'mouseover',  function(event) { new Effect.Appear(previous, { duration: 0.5,  to: 0 });new Effect.Appear(next, { duration: 0.5,  to: 1 }); })
			//navBar.onmouseout = function(){new Effect.Appear(next, { duration: 0.5,  to: 0 });new Effect.Appear(previous, { duration: 0.5,  to: 0 }); }
			if(document.documentElement.scrollTop>0){
				adjustHeight = document.documentElement.scrollTop + 20;
			}else if(document.body.scrollTop>0){
				adjustHeight = document.body.scrollTop + 20//' | ' + document.getElementById('content').scrollHeight + ' | ' + 
			}
			closerDiv.style.width = eltDims.width + 20 + 'px';
			closerDiv.hide();
			next.style.marginTop = eltDims.height/2 - 20 + 'px';
			previous.style.marginTop = eltDims.height/2 - 20 + 'px';
			//loaderDiv.style.left = (eltDims.width/2) - 110 +'px';
			var y  = ((browser_size_array[1] - eltDims.height) / 2)-2;
			var x = (browserDims.width - eltDims.width) / 2;
							theHeight = eltDims.height+4;
							theWidth = eltDims.width+2;
							//debug.innerHTML= theHeight + ' | ' + theWidth + ' | ' + theimg.getWidth();
			new Effect.Morph(dialog, {
				 duration: 0.2,   to: 1,
				style: {
					height: theHeight + 'px' ,
					width:  theWidth + 'px', 
					left : x + 'px',
					top: adjustHeight + 'px'
				},
				beforeStart: function(){if(fileExt!='flv'){closerDiv.hide(); new Effect.Appear(loaderDiv, { duration: 0.2,  to: 1 });}},
				afterFinish: function(){if(fileExt!='flv'){loaderDiv.hide(); new Effect.Appear(showimg, { duration: 0.2,   to: 1});closerDiv.show();} }
			
			})
			var styles = { position : 'absolute', padding : 0 + 'px' , textAlign : 'center' ,background : '#000000' }; 
			elt.setStyle(styles);

			//elt.scrollTo();
		}
	}

}
function removeThisElement(target){
	if(document.getElementById(target)!=null){
		document.getElementById(target).parent.removeChild(document.getElementById(target))
	}
}
function DialogOverlay(content, container) {
 
	// Manage arguments and assign defaults,
	if (typeof container == 'undefined' ) container = document.body;
	if (null == (this.container = $(container))) throw("container is not valid");
 
	// Assign instance variables
	this.content = content;
	this.overlay = new Element('div', { 'class': 'overlay' }).hide();
	this.dialog = new Element('div', { 'class': 'dialogCont' }).hide();
	// Hide the overlay when clicked. Ignore clicks on the dialog.
	Event.observe(this.overlay, 'click', this.hide.bindAsEventListener(this),removeThisElement('videoIframe'));
	Event.observe(this.dialog, 'click', this.hide.bindAsEventListener(this));
 
	// Insert the elements into the DOM
	this.dialog.insert(this.content);
	this.container.insert(this.dialog);
	this.container.insert(this.overlay);
 
	// Content may have been hidden if it is embedded in the page
	content.show();
	this.dialog.hide();
}
 
DialogOverlay.prototype.show = function() {
	new Effect.Appear(this.overlay, { duration: 0.5,  to: 0.8 });
	this.dialog.show();
	return this;
};
DialogOverlay.prototype.hide = function(event) {
	this.dialog.hide();
	this.overlay.hide();
	return this;
};//Adding a dialogue object to your page 

	Event.observe(window, 'load', function() {
	ynmGalleryPop.load();
});	
var centerThumbs = function(element){
	imgHeight = element.getHeight(); 
	imgPHeight = 175;
			var y  = (imgPHeight - imgHeight) / 2;
			element.style.marginTop=y + 'px';
	
}