OverPageBrowser.OverPageBrowser = function(){
    this.imageId = "OverPageBrowserImage"
    this.closeImageId = "OverPageBrowserClose"
    this.over = null
    this.arrowsBg = [];
    this.showImage = function(url, title){
        //window.scrollTo(0, 0)
        this.over = new jslt.OverPage()
        var overLay = this.over.getLayer(OverPageBrowser.config.opacity,{backgroundColor:OverPageBrowser.config.backgroundColor})
	    overLay.onclick=function(){
			OverPageBrowser.instance.hide()
		}
		//document.getElementById(this.over.outenerLayerId).style.backgroundColor=OverPageBrowser.config.backgroundColor
        this.over.setCenter()
		if(url.indexOf(".flv")>-1){
			this.createFlvPlayer(url,jslt.overPageInstance.layerId,"outerFLV",title)
			return
		}
        var imLoading = document.createElement("img")
		imLoading.id="OverPageBrowserImLoading"
        imLoading.src = "/modules/layout/loading-100x100.gif";
		imLoading.onclick = function(){
                OverPageBrowser.instance.hide()
            }
		imLoading.style.cursor = "pointer"
        var bodyEl = new jslt.Element(document.body)
        var viewSize = bodyEl.getRequiredSize()
        imLoading.style.position = "absolute"
        imLoading.style.left = Math.round(viewSize[0] / 2) + "px"
        imLoading.style.top = Math.round(viewSize[1] / 2) + "px"
        overLay.appendChild(imLoading)
        var img = document.createElement("img")
        overLay.appendChild(img)
        if (OverPageBrowser.config.clickKill == true) {
            img.onclick = function(){
                OverPageBrowser.instance.hide()
            }
            img.style.cursor = "pointer"
        }
        else {
            var closeImg = document.createElement("img")
            closeImg.style.position = "absolute"
            closeImg.style.display = "none"
            closeImg.style.cursor = "pointer"
            closeImg.id = this.closeImageId
            closeImg.src = OverPageBrowser.config.closeImg.src
            closeImg.onclick = function(){
                OverPageBrowser.instance.hide()
            }
            overLay.appendChild(closeImg)
        }
        img.style.position = "absolute"
        img.style.left = "-2000px"
		img.alt=title
        img.onload = function(){
            var imgSize = [this.width, this.height]
            var bodyEl = new jslt.Element(document.body)
            var viewSize = bodyEl.getRequiredSize()
            var divEl = new jslt.Element(jslt.overPageInstance.outenerLayerId)
            viewSize[1] = divEl.getViewHeight()
            var thisPosition = [parseInt((viewSize[0] - imgSize[0]) / 2), Math.max(0, parseInt((viewSize[1] - imgSize[1]) / 2))]
            this.style.left = thisPosition[0] + "px"
            this.style.top = thisPosition[1] + "px"
            if (!OverPageBrowser.config.clickKill) {
                var close = document.getElementById(OverPageBrowser.instance.closeImageId)
                close.style.display = "block"
                close.style.left = (thisPosition[0] + imgSize[0] - OverPageBrowser.config.closeImg.width - 2 * OverPageBrowser.config.borderWidth) + "px"
                close.style.top = (thisPosition[1] + 2 * OverPageBrowser.config.borderWidth) + "px"
            }
			//console.log(this.alt)
			if(this.alt!=undefined && this.alt!=""){
				var titleEl=document.createElement("div")
				titleEl.className="OPBTitle elAbsolute"
				this.parentNode.appendChild(titleEl)
				titleEl.innerHTML=this.alt
				titleEl.style.left = (thisPosition[0]) + "px"
				titleEl.style.top = (thisPosition[1] +this.height+2 * OverPageBrowser.config.borderWidth)+ "px"
				titleEl.style.display="block"
				titleEl.style.width=(this.width+2 * OverPageBrowser.config.borderWidth)+ "px"
			}
			document.getElementById("OverPageBrowserImLoading").style.display="none"
			if(viewSize[1]<imgSize[1]){
					window.onscroll=null
				}
        }
        img.src = url
        img.id = this.imageId
        img.style.border = "solid " + OverPageBrowser.config.borderColor + " " + OverPageBrowser.config.borderWidth + "px"

    }
    this.showGaleryImage = function(index, substitute,records,wg3Instance){
		var recordsToPass
		if(typeof(records)=="object"){
			OverPageBrowser.instance.storedRecords=records
			recordsToPass="'stored'"
		}else if(records==undefined){
			this.wg3Instance=wg3Instance || "instance"
			records=webgalery3[this.wg3Instance].images
		}else if(records=="stored"){
			recordsToPass="'stored'"
			records=OverPageBrowser.instance.storedRecords
		}
		record = records[index]
		var presentationType = typeof(webgalery3.config.presentationType) != "undefined" && webgalery3.config.presentationType.length>1? webgalery3.config.presentationType : "image"
        if (!substitute) {
			//window.scrollTo(0, 0)
			this.over = new jslt.OverPage()
			var overLay = this.over.getLayer(OverPageBrowser.config.opacity, {
				backgroundColor: OverPageBrowser.config.backgroundColor
			})
			//document.getElementById(this.over.outenerLayerId).style.backgroundColor=OverPageBrowser.config.backgroundColor
			this.over.setCenter()
			var tbody = document.createElement("tbody")
			var tr = document.createElement("tr");
			var td1 = document.createElement("td");
			td1.id = "WebGaleryBigScrollLeft"
			td1.rowSpan = 3
			tr.appendChild(td1)
			var tdHeader = document.createElement("td");
			tdHeader.id = "WebGaleryBigHeader"
			tr.appendChild(tdHeader)
			var td3 = document.createElement("td");
			td3.id = "WebGaleryBigScrollRight"
			td3.rowSpan = 3
			tr.appendChild(td3)
			tbody.appendChild(tr)
			tr = document.createElement("tr");
			var tdImage = document.createElement("td");
			tdImage.id = "Webgalery3BigImageTd"
			tr.appendChild(tdImage)
			tbody.appendChild(tr)
			tr = document.createElement("tr");
			var tdTitle = document.createElement("td");
			tdTitle.id = "tdTitleWebGaleryBigTitle"
			tr.appendChild(tdTitle)
			tbody.appendChild(tr)
			var table = document.createElement("table")
			table.id = "Webgalery3BigTable"
			table.appendChild(tbody)
			overLay.appendChild(table)
			var imLoading = document.createElement("img")
			imLoading.id = "loadingProgressImg"
			imLoading.src = "/modules/layout/loading-100x100.gif";
			tdImage.appendChild(imLoading)
			var bodyEl = new jslt.Element(document.body)
			var viewSize = bodyEl.getRequiredSize()
			table.style.position = "absolute"
			table.style.left = Math.round(viewSize[0] / 2) + "px"
			table.style.top = Math.round(viewSize[1] / 2) + "px"
			//console.log(presentationType)
			if (presentationType == "image") {
				var img = document.createElement("img")
				tdImage.appendChild(img)
				img.onclick = function(){
					OverPageBrowser.instance.hide()
				}
				img.style.cursor = "pointer"
				img.onload = function(){
					$("#loadingProgressImg").css("display", "none")
					$(this).css("display", "block")
					var savedTitle = $("#tdTitleWebGaleryBigTitle").html()
					$("#tdTitleWebGaleryBigTitle").html("")
					$("#tdTitleWebGaleryBigTitle").width($(this).width())
					var tableSize = [$("#Webgalery3BigTable").width(), $("#Webgalery3BigTable").height()]
					$("#tdTitleWebGaleryBigTitle").html(savedTitle)
					var bodyEl = new jslt.Element(document.body)
					var viewSize = bodyEl.getRequiredSize()
					var divEl = new jslt.Element(jslt.overPageInstance.outenerLayerId)
					viewSize[1] = divEl.getViewHeight()
					var thisPosition = [parseInt((viewSize[0] - tableSize[0]) / 2), Math.max(0, parseInt((viewSize[1] - tableSize[1]) / 2))]
					$("#Webgalery3BigTable").css("left", thisPosition[0] + "px")
					$("#Webgalery3BigTable").css("top", thisPosition[1] + "px")
				}
				img.id = this.imageId;
			}else if(presentationType == "movie"){
			}
		}else if(substitute){
			if(presentationType=="image"){
			}else if(presentationType == "movie"){
				
			}
		}
		if(presentationType=="image"){
				document.getElementById(this.imageId).style.display = "none"
				document.getElementById(this.imageId).src = record[1];
			}else  if(presentationType == "movie"){
				document.getElementById("Webgalery3BigTable").style.background="none"
				document.getElementById("Webgalery3BigTable").style.borderBottom="none"
				this.createFlvPlayer(record[1],"Webgalery3BigImageTd","Webgalery3BigTable",record[2])
			}	
			if (presentationType == "image") {
				$("#loadingProgressImg").css("display", "block")
			}
			var isPrevElement=index > 0
			if(isPrevElement){
				//check: is link only image?
				var prevEl=records[index-1]
				isPrevElement=prevEl[2].indexOf("config|")==-1
			}
			
        document.getElementById("WebGaleryBigScrollLeft").onclick = isPrevElement ? new Function("OverPageBrowser.instance.showGaleryImage(" + (index - 1) + ",true,"+recordsToPass+",'"+this.wg3Instance+"')") : null
        document.getElementById("WebGaleryBigScrollLeft").style.cursor = isPrevElement ? "pointer" : "default";
        if (this.arrowsBg.length == 0) {
            this.arrowsBg.push(document.getElementById("WebGaleryBigScrollLeft").style.backgroundImage)
            this.arrowsBg.push(document.getElementById("WebGaleryBigScrollRight").style.backgroundImage)
        }
        document.getElementById("WebGaleryBigScrollLeft").style.backgroundImage = index > 0 ? this.arrowsBg[0] : "none";
        document.getElementById("WebGaleryBigScrollRight").onclick = index < (records.length - 1) ? new Function("OverPageBrowser.instance.showGaleryImage(" + (index + 1) + ",true,"+recordsToPass+",'"+this.wg3Instance+"')") : null
        document.getElementById("WebGaleryBigScrollRight").style.cursor = index < (records.length - 1) ? "pointer" : "default";
        document.getElementById("WebGaleryBigScrollRight").style.backgroundImage = index < (records.length - 1) ? this.arrowsBg[1] : "none";
        if (records.length > 1) {
			$("#WebGaleryBigHeader").html((index + 1) + " / " + records.length)
		}
		if (presentationType == "image") {
			$("#tdTitleWebGaleryBigTitle").html(record[2])
		}

    }
    this.hide = function(){
        this.over.hide()
    }
	this.createFlvPlayer=function(movieURL,assignToId,centerId,title){
			document.getElementById('contentOverPageDiv').onclick=null
			var emb=new PluginEmbeder()
			emb.addAttribute("id","flvPlayer")
			emb.addAttribute("width",OverPageBrowser.config.flvPlayer.size[0])
			emb.addAttribute("height",OverPageBrowser.config.flvPlayer.size[1])
			emb.addAttribute("file",OverPageBrowser.config.flvPlayer.src)
			emb.addAttribute("wmode","transparent")
			emb.addVariable("isHTML","true")
			emb.addVariable("movieURL",movieURL)
			emb.addVariable("title",title)
			emb.addVariable("knobXMaxMax",OverPageBrowser.config.flvPlayer.knobXMaxMax)
			emb.addVariable("progressLineWidthMax",OverPageBrowser.config.flvPlayer.progressLineWidthMax)
			var playerHTML=emb.getHTML()//emb.assignToElement(assignToId)
			if(centerId=="outerFLV"){
				playerHTML="<div id='outerFLV' >"+playerHTML+"</div>"
			}
			document.getElementById(assignToId).innerHTML=playerHTML
			this.over.centerContent(document.getElementById(centerId),OverPageBrowser.config.flvPlayer.size)
	}
	this.createSwfPlayer=function(swfFile,size,paramsA,playerSize,attributesA){
			this.over = new jslt.OverPage()
	        var overLay = this.over.getLayer(OverPageBrowser.config.opacity,{backgroundColor:OverPageBrowser.config.backgroundColor})
			this.over.setCenter()
			var emb=new PluginEmbeder()
			if(!playerSize){
				playerSize=size
			}
			emb.addAttribute("width",playerSize[0])
			emb.addAttribute("height",playerSize[1])
			emb.addAttribute("file",swfFile)
			emb.addAttribute("wmode","transparent")
			emb.addVariable("isHTML","true")
			if(paramsA){
				for(var p in paramsA){
					emb.addVariable(p,paramsA[p])
				}
			}
			if(attributesA){
				for(var p in attributesA){
					emb.addAttribute(p,attributesA[p])
				}
			}
			var playerHTML=emb.getHTML()
			playerHTML="<div id='outerSwfPlayer' class='elAbsolute'>"+playerHTML+"</div>"
			document.getElementById(jslt.overPageInstance.layerId).innerHTML=playerHTML
			this.over.centerContent(document.getElementById('outerSwfPlayer'),size)
	}
	/**
	 * require jquery
	 * @param {Object} url
	 * @param {Object} size
	 */
	this.loadDocument=function(url,size){
			this.over = new jslt.OverPage()
	        var overLay = this.over.getLayer(OverPageBrowser.config.opacity,{backgroundColor:OverPageBrowser.config.backgroundColor})
			this.over.setCenter()
			var contentHTML="<div id='outerOverDocument' class='elAbsolute' style='width:"+size[0]+"px;height:"+size[1]+"px'>loading...</div>"
			document.getElementById(jslt.overPageInstance.layerId).innerHTML=contentHTML
			this.over.centerContent(document.getElementById('outerOverDocument'),size)
			$.get(url, function(data){  
   				  $('#outerOverDocument').html(data)
 			} );
	}
	this.fixFlvMiniatures=function(){
		var a=document.getElementsByTagName("a")
		for(var i=0;i<a.length;i++){
			if(a[i].href.indexOf(".flv")>-1 && a[i].className.indexOf("flvAdd")==-1){
				var curA=a[i];
				curA.className+=" flvAdd"
				var im=document.createElement("img")
				im.src=OverPageBrowser.config.flvPlayImage
				curA.style.position="relative"
				im.style.position="absolute"
				im.style.left="0px"
				im.style.cursor="pointer"
				im.className="moviePlayButton"
				curA.appendChild(im)
				
			}
		}
	}
}
OverPageBrowser.instance = new OverPageBrowser.OverPageBrowser()
