// JavaScript Document]

function UTOOLmediumLightWindowPopup(element, title, description, imageURI, imageStatus, UStatus, owner, imagePublicStatus)
{
		var Width=getWidth();
		var Height=getHeight();
		var centerWidth = ((Width-606) / 2)+getScrollLeft();
		var centerHeight = ((Height-580) / 2)+getScrollTop();

		var	left=''+centerWidth+'px';
		var	top=''+centerHeight+'px';
		var	height=''+getScrollHeight()+'px';
		var	width=''+getScrollWidth()+'px';
		var buttonStatus=(imageStatus=="enabled")?"disable":"enable";
		var publicImageStatus=(imagePublicStatus=="enabled")?"disable":"enable";
		if(UStatus=='self')
		{
			var inputType='<div class="thumb_heading-bdr" id="imageTitlID" onmouseover="controllerBackGroundColorOnOver(this.id)" onmouseout="controllerBackGroundColorOnOut(this.id)"><span id="UTOOLMediumImageDescriptionTitleText" onclick="makeControlToggler(\'input\', \'dynamicImageTitle\', this.id)">'+title+'</span><input type="text" name="dynamicImageTitle" id="dynamicImageTitle" size="35"  maxlength="30" onkeyup="enterKeyCodeForSaveimageEditData(event,\'input\')"/></div>';
			var textAreaType='<div class="UTOOLMediumImageDescription" id="descriptionID" onmouseover="controllerBackGroundColorOnOver(this.id)" onmouseout="controllerBackGroundColorOnOut(this.id)"><span id="UTOOLMediumImageDescriptionText" onclick="makeControlToggler(\'textarea\', \'dynamicTextController\', this.id)">'+description+'</span><span><textarea rows="4" name="dynamicTextController" id="dynamicTextController" class="textarea" onkeyup="ismaxlength()" onkeypress="enterKeyCodeForSaveimageEditData(event,\'textarea\')"></textarea></span></div>';
			var editLabeText='<div class="UTOOLMediumImageNotes">Click on the picture name and description above to change.</div>';
			var statusButton='<div class="UTOOLMediumImageStatusButton"><input type="hidden" name="elementID" id="elementID" value="'+element+'"/><input type="button" class="button imageActiveStatus" name="imageStatus" id="imageStatus" value="'+buttonStatus+' picture" onclick="changeStatus('+element+',\'self\');"/></div>';
			var closebutton='<div class="UTOOLMediumImageStatusButton"><input type="button" class="button" name="xclose" id="xclose"value="X CLOSE" onclick="hideImageLightBox(\'update\','+element+')"/></div>';
			var enableLabelText='<div class="UTOOLMediumImageBottomAreaRight"><div class="UTOOLMediumImageStatus">This picture is currently <span id="imageActiveStatus">'+imageStatus+'</span></div>'+statusButton+'</div>';
		}
		else
		{
			var inputType='<div class="thumb_heading-bdr" id="imageTitlID"><span>'+title+'</span></div>';
			var textAreaType='<div class="UTOOLMediumImageDescription" id="descriptionID" ><span>'+description+'</span></div>';
			var editLabeText='<div class="UTOOLMediumImageNotes">&nbsp;</div>';
			var statusButton='<div class="UTOOLMediumImageStatusButton">&nbsp;</div>';
			var closebutton='<div class="UTOOLMediumImageStatusButton"><input type="button" class="button" name="xclose" id="xclose"value="X CLOSE" onclick="hideImageLightBox(\'\')"/></div>';
			var enableLabelText='<div class="UTOOLMediumImageBottomAreaRight"><div class="UTOOLMediumImageStatus"><span id="imageActiveStatus"></span></div>'+statusButton+'</div>';
		}
		
		if(JOB_OWNER=='yes' && UStatus=='other')
		{	var statusButton='<div class="UTOOLMediumImageStatusButton"><input type="hidden" name="elementID" id="elementID" value="'+element+'"/><input type="button" class="button imageActiveStatus" name="imageStatus" id="imageStatus" value="'+publicImageStatus+' picture" onclick="changeStatus('+element+',\'public\');"/></div>';
			var enableLabelText='<div class="UTOOLMediumImageBottomAreaRight"><div class="UTOOLMediumImageStatus">Public display <span id="imageActiveStatus">'+imagePublicStatus+'</span></div>'+statusButton+'</div>';
			var closebutton='<div class="UTOOLMediumImageStatusButton"><input type="button" class="button" name="xclose" id="xclose"value="X CLOSE" onclick="hideImageLightBox(\'update\','+element+')"/></div>';
		}
		
		var divContainer='<div class="thumb_container_overlay" id="container_ID">'+
							'<div class="thumb_overlay" id="overlay_ID" style="height:'+height+';width:'+width+'"></div>'+
							'<div class="thumb_imagecontainer" id="imagecontainer" style="left:'+left+';top:'+top+'">'+				
								'<div class="thumb_post_row1">'+
									'<div class="thumb_curve-top"><img src="'+view_url+'mediumImage/images/curve-top2.gif" alt="UTOOL" height="24" width="24" /></div>'+
									inputType+
									'<div class="thumb_curve-top1"><img src="'+view_url+'mediumImage/images/curve-top1.gif" alt="UTOOL" width="24" height="24" /></div>'+
									'<div class="thumb_clear"></div>'+
								'</div>'+
						
								'<div class="thumb_reg_bdr_lrb"> '+
									'<div class="UTOOLMediumImageContainer" id="mediumImageDisplayContainer"></div>'+
									'<div class="thumb_clear"></div>'+
									
									'<div class="UTOOLMediumImageBottomArea">'+
										'<div class="UTOOLMediumImageBottomAreaTop">'+		
											'<div class="UTOOLMediumImageBottomAreaLeft">'+textAreaType+													
											'</div>'+
											
											enableLabelText+
										'</div>	'+						
										'<div class="thumb_clear"></div>'+
										'<div class="UTOOLMediumImageBottomAreaBottom">	'+									
											'<div class="UTOOLMediumImageBottomAreaLeft">'+editLabeText+
											'</div>'+
											'<div class="UTOOLMediumImageBottomAreaRight">'+closebutton+
											'</div>'+
										'</div>	'+					
									'</div>'+
								'</div>'+
							'</div>	'+		
						'</div>';
		
		/*var utoolmedium = document.createElement('div');
		utoolmedium.setAttribute('id', 'utoolMediumLightWindow');
		utoolmedium.innerHTML = divContainer;*/

		var body = $$('body')[0];
		body.appendChild(Builder.node('div',{id:'utoolMediumLightWindow'}))
		$("utoolMediumLightWindow").update(divContainer);
		
		
		$('imagecontainer').setStyle({display:'none'});
		Effect.toggle('imagecontainer','appear');		
		Element.setOpacity('overlay_ID',.5);
		
		imageTime=setInterval("loadimage('"+imageURI+"')",1000);

}	

function hideImageLightBox(reloadPage,element)
{
	var body = document.getElementsByTagName('body')[0];
	var lw=	document.getElementById('utoolMediumLightWindow');
	body.removeChild(lw);
	if(reloadPage=='update')
	{
		updateImageStatus=base_url+'thejob/editedPhotoVideos/'+element;
		$('thumbImageID_'+element).innerHTML='<img src="'+view_url+'images/ajax-loader.gif" />';
		var myAjax = new Ajax.Request(updateImageStatus, {method: 'post',
					onComplete: function showResponse(response)
					{
						$('thumbImageID_'+element).innerHTML='';
						$('thumbImageID_'+element).innerHTML=response.responseText;
					}
					
			});
	}
}

function loadimage(ImgURI)
{
	$("mediumImageDisplayContainer").appendChild(Builder.node('img',{id:"mediumimage",src:ImgURI}));
	clearInterval(imageTime);
}


Event.observe(window,'load',function(){
var objBody= $$('body')[0];
objBody.appendChild(Builder.node('div',{id:'utoolMediumImageDownloadContainer'}));
$("utoolMediumImageDownloadContainer").appendChild(Builder.node('img',{src:view_url+"mediumImage/images/curve-top1.gif",style:"display:none"}));
$("utoolMediumImageDownloadContainer").appendChild(Builder.node('img',{src:view_url+"mediumImage/images/curve-top2.gif",style:"display:none"}));
$("utoolMediumImageDownloadContainer").appendChild(Builder.node('img',{src:view_url+"mediumImage/images/black-70.png",style:"display:none"}));
$("utoolMediumImageDownloadContainer").appendChild(Builder.node('img',{src:view_url+"mediumImage/images/header-bg1.gif",style:"display:none"}));
});