var LightBox = {
	initialize:function(id)
	{ 
	this.id = id;
	this.exitBtnId = id+"_exit";
	this.inputsId = id+"_inputs"
	this.closeBtn =id+"close";
	this.closeTitle =CLOSE;
	this.title = PHOTO_BROWSING;
	this.imageId = id+"_image"
	
	
	
	
	  this.templateStr = '<div id="#{id}" style="display:none;"  class="lightBox">'+
'<div class="categoryFormTitle jTitle_small">#{title}</div>'+
 '<div id="#{exitBtnId}" class="exitButton"></div>'+
       '<div class="inputs" id="#{inputsId}" style="margin-top:-50px; width:363px;"><img style="display:none;" id="#{imageId}" /> '+
'</div>'+
       '<div class="controlButtons">'+
'<a id="#{closeBtn}"  href="javascript:cancel_action();">#{closeTitle}</a>'+
'</div>'+
'</div>';

	this.html = (new Template(this.templateStr)).evaluate({id:this.id,title:this.title,exitBtnId:this.exitBtnId,inputsId:this.inputsId,
	closeBtn:this.closeBtn,closeTitle:this.closeTitle,imageId:this.imageId});
	
	   new Insertion.Bottom(document.body, this.html);
		
	 
	   this.loadMembers({el:$(id),exitBtn:$(this.exitBtnId),cancelBtn:$(this.closeBtn)});
	   this.inputs = $(this.inputsId);     
	    this.image = $(this.imageId);    	
	},
	
   open:function(src)
   {  
     this.src =src;
     this.setPositionAndSize();
     // this.parent();

   },
   close:function()
   {
       this.image.hide();
       
       this.parent();
   },
   
   setPositionAndSize:function()
   {
    var imgPreloader = new Image();
    var me = this;

	imgPreloader.onload = function()
	{ 

	  var imageWidth =  imgPreloader.width
	  var imageHeight = imgPreloader.height;
	  
	  var lbWidth = imageWidth +173;
	  var lbHeight =imageHeight+105;
	  
	  if(lbWidth<400) lbWidth =400; 
	  if(lbHeight<300)  lbHeight = 300;
	  
	  setSize(me.el,lbWidth,lbHeight);
	  
	  setWidth(me.inputs,lbWidth-30);
	  
	  me.el.style.marginLeft = -lbWidth/2+"px";
	  me.el.style.marginTop = -lbHeight/2+"px";
	  
	  me.image.src = me.src;
	  me.image.show();
 
	me.el.show();
    me.showOverlay();
	
	}
	imgPreloader.src = this.src;
	
		// once image is preloaded, resize image container
	//	imgPreloader.onload=function(){
	//		Element.setSrc('lightboxImage', imageArray[activeImage][0]);
	//		myLightbox.resizeImageContainer(imgPreloader.width, imgPreloader.height);
	//	}

   }
	
	
}
/*
lb
  height:340px;
  width:540px;
  position:absolute;
  left:51%;
  top:50%;
  margin-left:-220px;
  margin-top:-160px;	
  
  
  

*/

var LightBox =Class.extend(CustomForm,LightBox);