var mainZoomer = {

start: function() {

var imgs=$$("img.mainZoomer");
imgs.setStyles({ "cursor": "pointer" });
imgs.addEvent("mousedown",function(e) {
    var thisImg = e.target;
    var thisID  = thisImg.id;
    var bSrcID  = "s"+thisID;
    var widthID = "w"+thisID;
    var heightID = "h"+thisID;
    var title    = "t"+thisID;
    
    var closeEvent = function() {
        if(Browser.Engine.presto){
        	back.setStyles({"display":"none"});
        	bigImage.setStyles({"display":"none"});
        	close.setStyles({"display":"none"});
        	imgDiv.setStyles({"display":"none"});
        }
        back.dispose();
        bigImage.dispose();
        close.dispose();
        imgDiv.dispose();
    }
    
    bigWidth = $(widthID).value;
    bigHeight = $(heightID).value;
    if (bigWidth < 170) {
    big_Width = 170;
    big_Height = (big_Width/bigWidth)*bigHeight;
    }
    else if (bigWidth > 640) {
    big_Width = 640;
    big_Height = (big_Width/bigWidth)*bigHeight;
    if (big_Height > 480) {
    big_Height = 480;
    big_Width  = (big_Height/bigHeight)*bigWidth;
    }
    }
    else {
    big_Width = bigWidth;
    big_Height = bigHeight;
    }
    
    var d = document.body;
    var bodyElem = document.id(document.body);
    var endTop = bodyElem.getScroll().y + (bodyElem.getHeight() - big_Height)/2;
    var divTop = bodyElem.getScroll().y + bodyElem.getHeight()/2 + big_Height/2 + 1;
    var endLeft = bodyElem.getScroll().x + (bodyElem.getWidth() - big_Width)/2;
    if (Browser.Engine.trident4) var backStyle = {
    		"position":"absolute",
    		"top":0,
    		"left":0,
    		"width":bodyElem.getWidth()+"px",
    		"height":bodyElem.getHeight()+"px",
    		"z-index":3105,
    		"background-color":"#000000",
    		"opacity":0.7,
    		"cursor":"pointer"
    	};
    else var backStyle = {
    		"position":"fixed",
    		"top":0,
    		"left":0,
    		"width":bodyElem.getWidth()+"px",
    		"height":bodyElem.getHeight()+"px",
    		"z-index":3105,
    		"background":"url(images/overlay.png) repeat 0 0",
    		"cursor":"pointer"
    	};
    var back = new Element("div", {
    id: "back",
    styles: backStyle
    }).inject(d);
    
    var bigImage = new Element("img", {
    id: "bigImage",
    src: $(bSrcID).value,
    alt:$(title).value,
    title:$(title).value,
    styles: {
    "position": "absolute",
    "top": endTop+"px",
    "left": endLeft+"px",
    "z-index": "3106",
    "cursor": "pointer",
    "visibility": "hidden",
    "width": big_Width+"px",
    "height": big_Height+"px",
    "border":"1px solid #ffffff"
    }
    }).inject(d);
    var imgDiv=new Element("div",{
    	id:"imgDiv",
    	styles:{
    		"position":"absolute",
    		"top":divTop + "px",
    		"left":endLeft + "px",
    		"width":big_Width + "px",
    		"height":"19px",
    		"background-color":"#f4f2f2",
    		"border":"1px solid #ffffff",
    		"border-top":"none",
    		"z-index":3106,
    		"visibility":"hidden",
    		"padding-top":"6px",
    		"text-align":"center"
    	}
    }).inject(d);
    imgDiv.innerHTML=$(title).value;
    closeLeft = big_Width-22+endLeft;
    var close = new Element("img", {
    id: "close",
    src: "images/closeButton.png",
    styles: {
    "position": "absolute",
    "top": endTop+2,
    "left": closeLeft,
    "width": "20px",
    "height": "20px",
    "z-index": "3107",
    "cursor": "pointer",
    "visibility": "hidden"
    }
    }).inject(document.body);
    var noSave=function(){
    	closeEvent();
    	window.removeEvent("mousedown",noSave);
    };
    back.addEvent("click", closeEvent);
    close.addEvent("click", closeEvent);
    bigImage.addEvent("click", closeEvent);
    window.setTimeout(function(){window.addEvent("mousedown",noSave);},51);
    window.setTimeout("mainZoomer.show()",50);
});
},

show: function() {

    $("back").setStyles({"visibility": "visible"});
    $("bigImage").setStyles({"visibility": "visible"});
    $("imgDiv").setStyles({"visibility": "visible"});
    $("close").setStyles({"visibility": "visible"});
}
};