/** * zobrazi bud jeden nebo vice obrazku pres celou plochu prohlizece * * pokud zobrazuje vice obrazku, zobrazuje i sipky vlevo a vpravo * * pri prejizdeni mysi pres obrazek zobrazuje navigaci a tlacitko zavrit * pri kliku mimo obrazek se zavre taky * * jlx@seznam.cz */ var ShowImage = function() { this.imgLayer = null; this.imgLayer2 = null; this.msgLayer = null; this.nextButt = null; this.prevButt = null; this.closeButt = null; this.currentImgElem = null; this.imgObjectTmp = new Image; this.loader = new Image; this.loading = true; this.timer = null; this.offset = 15; this.imgH = 0; this.images = new Array(); this.currentImg = 0; this.buttonPaddingBigX; this.buttonPaddingBigY; this.buttonPaddingSmall = 10; this.buttonSize = 40; } //tlacitko doleva doprava ShowImage.prototype.setNavButton = function(aSrc) { var butt = document.createElement("img"); butt.src = aSrc; butt.style.position = "absolute"; butt.style.cursor = "pointer"; butt.style.display = "none"; return butt; } //zobrazit obrazek pres cele okno ShowImage.prototype.display = function(linkStr) { var docBody = document.getElementsByTagName("body")[0]; this.loader.src = "/images/loader.gif"; this.currentImgElem = this.loader; this.imgLayer = document.createElement("div"); this.imgLayer2 = document.createElement("div"); this.prevButt = this.setNavButton("/images/arr_prev.png"); this.nextButt = this.setNavButton("/images/arr_next.png"); this.closeButt = this.setNavButton("/images/close.png"); this.imgLayer.style.position = "absolute"; this.imgLayer.style.zIndex = 1000; this.imgLayer.style.top = "0px"; this.imgLayer.style.left = "0px"; this.imgLayer.style.width = "100%"; this.imgLayer.style.height = fLib.getDocumentHeight() + "px"; this.imgLayer.style.textAlign = "center"; this.imgLayer2.style.position = "absolute"; this.imgLayer2.style.zIndex = 1000; this.imgLayer2.style.top = "0px"; this.imgLayer2.style.left = "0px"; this.imgLayer2.style.width = "100%"; this.imgLayer2.style.height = fLib.getDocumentHeight() + "px"; this.imgLayer2.style.backgroundColor = "#000000"; fLib.setOpacity(this.imgLayer2, 70); this.imgObjectTmp.style.padding = "10px"; this.imgObjectTmp.style.background = "#FFFFFF"; this.imgObjectTmp.style.borderRadius = "10px"; this.imgObjectTmp.style.MozBorderRadius = "10px"; this.imgObjectTmp.style.WebkitBorderRadius = "10px"; this.loader.style.padding = "10px"; this.loader.style.background = "#FFFFFF"; this.loader.style.borderRadius = "10px"; this.loader.style.MozBorderRadius = "10px"; this.loader.style.WebkitBorderRadius = "10px"; this.imgLayer.appendChild(this.prevButt); this.imgLayer.appendChild(this.currentImgElem); this.imgLayer.appendChild(this.nextButt); this.imgLayer.appendChild(this.closeButt); docBody.appendChild(this.imgLayer2); docBody.appendChild(this.imgLayer); var self = this; fLib.addEvent("click", function(e) { self.hide(e) }, this.imgLayer); fLib.addEvent("click", function(e) { self.prevImage(e) }, this.prevButt); fLib.addEvent("click", function(e) { self.nextImage(e) }, this.nextButt); fLib.addEvent("click", function(e) { self.hide(e) }, this.closeButt); fLib.addEvent("click", function(e) { fLib.stopPropagation(e); }, this.imgObjectTmp); fLib.addEvent("mouseover", function() { self.showPrevNext() }, this.imgObjectTmp); fLib.addEvent("mouseover", function() { self.showPrevNext() }, this.closeButt); fLib.addEvent("mouseover", function() { self.showPrevNext() }, this.prevButt); fLib.addEvent("mouseover", function() { self.showPrevNext() }, this.nextButt); fLib.addEvent("mouseout", function() { self.hidePrevNext() }, this.imgObjectTmp); fLib.addEvent("mouseout", function() { self.hidePrevNext() }, this.closeButt); fLib.addEvent("mouseout", function() { self.hidePrevNext() }, this.prevButt); fLib.addEvent("mouseout", function() { self.hidePrevNext() }, this.nextButt); fLib.addEvent("resize", function() { self.repairSize() }, window); this.timer = setInterval(function() { self.repairSize() }, 500); this.setImage(linkStr); } //skryt a zrusit ShowImage.prototype.hide = function(e) { fLib.stopPropagation(e); var docBody = document.getElementsByTagName("body")[0]; docBody.removeChild(this.imgLayer); docBody.removeChild(this.imgLayer2); fLib.removeEvent("resize", function() { this.repairSize() }, window); clearInterval(this.timer); } //prepocitat umisteni hlavniho obrazku ShowImage.prototype.setImgPosition = function() { var winH = fLib.getWindowHeight(); var winW = fLib.getWindowWidth(); this.buttonPaddingBigY = Math.round((this.imgObjectTmp.height / 2) - this.buttonSize - 20); this.currentImgElem.style.marginTop = fLib.getTopScroll() + ((winH - this.currentImgElem.height) / 2) + "px"; if(!this.loading) { this.prevButt.style.paddingTop = this.buttonPaddingBigY + "px"; this.prevButt.style.paddingBottom = this.buttonPaddingBigY + "px"; this.prevButt.style.top = fLib.getTopScroll() + (((winH - this.buttonSize) / 2) - this.buttonPaddingBigY) + "px"; this.nextButt.style.paddingTop = this.buttonPaddingBigY + "px"; this.nextButt.style.paddingBottom = this.buttonPaddingBigY + "px"; this.nextButt.style.top = fLib.getTopScroll() + (((winH - this.buttonSize) / 2) - this.buttonPaddingBigY) + "px"; this.closeButt.style.marginTop = -15 + fLib.getTopScroll() + ((winH - this.currentImgElem.height) / 2) + "px"; } } //pri zmene velikosti okna ShowImage.prototype.repairSize = function() { //posunuti obrazku this.setImgPosition(); //zmena velikosti divu this.imgLayer.style.width = "100%"; this.imgLayer.style.height = fLib.getDocumentHeight() + "px"; this.imgLayer2.style.width = "100%"; this.imgLayer2.style.height = fLib.getDocumentHeight() + "px"; } //zobrazi anim. gif ShowImage.prototype.showLoader = function() { this.currentImgElem = fLib.swapElemetnts(this.loader, this.currentImgElem); this.setImgPosition(); } ShowImage.prototype.setImage = function(aImg) { var self = this; this.loading = true; this.hidePrevNext(); this.showLoader(); this.imgObjectTmp.src = aImg; this.imgObjectTmp.onload = function() { setTimeout(function() { self.swapImages() }, 500); } this.currentImg = fLib.arIndexOf(this.images, aImg); this.showPrevNext(); } ShowImage.prototype.swapImages = function() { this.currentImgElem = fLib.swapElemetnts(this.imgObjectTmp, this.currentImgElem); this.loading = false; this.setImgPosition(); } //zobrazi navigaci ShowImage.prototype.showPrevNext = function() { if(!this.loading) { this.buttonPaddingBigX = Math.round((this.imgObjectTmp.width / 2) - this.buttonPaddingSmall - this.buttonSize); var imgOffset = Math.round((fLib.getDocumentWidth() - this.imgObjectTmp.width) / 2) - 5; if(this.currentImg > 0) { this.prevButt.style.paddingRight = this.buttonPaddingBigX + "px"; this.prevButt.style.left = (imgOffset - this.offset) + "px"; fLib.setDisplay(this.prevButt, "block"); } if(this.currentImg < this.images.length - 1) { this.nextButt.style.paddingLeft = this.buttonPaddingBigX + "px"; this.nextButt.style.left = (fLib.getDocumentWidth() - this.buttonPaddingBigX - this.buttonSize - imgOffset + this.offset) + "px"; fLib.setDisplay(this.nextButt, "block"); } this.closeButt.style.paddingLeft = this.buttonPaddingBigX + "px"; this.closeButt.style.left = (fLib.getDocumentWidth() - this.buttonPaddingBigX - this.buttonSize - imgOffset + this.offset) + "px"; this.closeButt.style.top = "0px"; fLib.setDisplay(this.closeButt, "block"); } } //skryje navigaci ShowImage.prototype.hidePrevNext = function() { fLib.setDisplay(this.prevButt, "none"); fLib.setDisplay(this.nextButt, "none"); fLib.setDisplay(this.closeButt, "none"); } //dalsi obrazek ShowImage.prototype.nextImage = function(e) { fLib.stopPropagation(e); var n = (this.currentImg + 1 < this.images.length) ? this.currentImg + 1 : this.images.length - 1; this.setImage(this.images[n]); } //predchozi obrazek ShowImage.prototype.prevImage = function(e) { fLib.stopPropagation(e); var n = (this.currentImg - 1 < 0) ? 0 : this.currentImg - 1; this.setImage(this.images[n]); } //prida obrazek do seznamu ShowImage.prototype.addImage = function(aPath) { aPath = fLib.strReplace("&", "&", aPath); this.images.push(aPath); } ShowImage.prototype.getImageCount = function() { return this.images.length; } var showImage = new ShowImage();