/* ************************************** * Popup v1.0 * * Autor: Wagner B. Soares * ************************************** */ Popup = function(oRoot,exibirBotoes,width, height, minX, maxX, minY, maxY) { var popup = new Object(); var id = oRoot; // recebe a div que será a popup var win = document.getElementById(id); // div que é utilizada para minimizar e maximizar var animate = jQuery.create("div",{},[]); // container do conteúdo var container = jQuery.create("div",{"class":"container-window"},[]); // cabeçalho da popup var header = jQuery.create("span",{"class":"window-header"},[]); // texto do cabeçalho var headerText = null; width = (isNumber(width) && width > 200)? width: 350; height = (isNumber(height) && height > 200)? height: 450; var images = new Array(new Image(),new Image()); if(exibirBotoes) { images[0].src = "../img/button-close.gif"; images[1].src = "../img/button-min.gif"; } else { images[0].src = "../img/fpop.gif"; images[1].src = "../img/fpop.gif"; } //cria e configura o botão minimizar var buttonMin = jQuery.create("img",{"id":"minimize-"+id,"alt":"","title":"","src":images[1].src},[]); var buttonClose = jQuery.create("img",{"id":"close-"+id,"alt":"","title":"","src":images[0].src},[]); if(exibirBotoes) { buttonMin.onclick = function() { jQuery(animate).animate({height:"toggle"},"slow"); } //cria e configura o botão fechar buttonClose.onclick = function() { jQuery(win).animate({opacity:"hide"},"slow"); } } // cria o container dos botões var buttonContainer = jQuery.create("span",{"class":"window-buttons"},[]); jQuery(buttonContainer).append(buttonMin); jQuery(buttonContainer).append(buttonClose); jQuery(container).html(jQuery(win).html()); jQuery(win).empty(); jQuery(win).append(buttonContainer); jQuery(win).append(header); jQuery(animate).append(container); jQuery(win).append(animate); jQuery(win).css({"width":(width+"px"),"border":"1px solid","padding": "0px","position": "absolute","text-align": "center","background-color":"#C0C0C0","display":"none"}); jQuery(header).css({"display": "block","margin": "0px","padding": "0px","padding-left": "5px","left":"0px","line-height": "22px","text-align": "left","width":((width-5)+"px"),"height":(22+"px"),"color": "#000000","font-weight": "bold","background-color": "#DEDEDE"}); jQuery(buttonContainer).css({"display": "block","cursor": "move","margin": "0px","position": "absolute","left":"0px","text-align": "right","line-height": "22px","width":((width-2)+"px"),"height":(22+"px")}); jQuery("img",buttonContainer).css({"margin-right": "2px","cursor": "pointer","width": "23px","height": "23px"}); jQuery(container).css({"margin":"3px","width":((width-8)+"px"),"height":((height-29)+"px"),"text-align": "left","overflow":"auto","background-color":"#FFFFFF","border":"1px solid"}); // função para configurar o texto do cabeçalho da popup this.setTitle = function(t) { headerText = document.createTextNode(t); jQuery(header).append(headerText); }; popup.getPageSize = function() { var de = document.documentElement; var w = window.innerWidth || self.innerWidth || (de&&de.clientWidth) || document.body.clientWidth; var h = window.innerHeight || self.innerHeight || (de&&de.clientHeight) || document.body.clientHeight arrayPageSize = new Array(w,h) return arrayPageSize; }; popup.position = function() { var pagesize = popup.getPageSize(); jQuery(win).css({left: ((pagesize[0] - width)/2), top: ((pagesize[1]-height)/2) }); }; // exibe a popup this.show = function() { popup.position(); jQuery(win).animate({opacity:"show"},"slow"); }; this.close = function() { jQuery(win).animate({opacity:"hide"},"slow"); }; var Drag = { obj : null, init : function(oRoot,head, minX, maxX, minY, maxY) { var o = head; o.onmousedown = Drag.start; o.root = oRoot; if (isNaN(parseInt(o.root.style.left ))) o.root.style.left = "0px"; if (isNaN(parseInt(o.root.style.top ))) o.root.style.top = "0px"; o.minX = typeof minX != 'undefined' ? minX : null; o.minY = typeof minY != 'undefined' ? minY : null; o.maxX = typeof maxX != 'undefined' ? maxX : null; o.maxY = typeof maxY != 'undefined' ? maxY : null; o.root.ondragStart = new Function(); o.root.ondragEnd = new Function(); o.root.ondrag = new Function(); }, start : function(e) { var o = Drag.obj = this; e = Drag.fixE(e); o.root.style.zIndex = "200"; var y = parseInt(o.root.style.top); var x = parseInt(o.root.style.left); o.root.ondragStart(x, y); o.lastMouseX = e.clientX; o.lastMouseY = e.clientY; if (o.minX != null) o.minMouseX = e.clientX - x + o.minX; if (o.maxX != null) o.maxMouseX = o.minMouseX + o.maxX - o.minX; if (o.minY != null) o.minMouseY = e.clientY - y + o.minY; if (o.maxY != null) o.maxMouseY = o.minMouseY + o.maxY - o.minY; document.onmousemove = Drag.drag; document.onmouseup = Drag.end; return false; }, drag : function(e) { e = Drag.fixE(e); var o = Drag.obj; var ey = e.clientY; var ex = e.clientX; var y = parseInt(o.root.style.top); var x = parseInt(o.root.style.left); var nx, ny; if (o.minX != null) ex = Math.max(ex, o.minMouseX); if (o.maxX != null) ex = Math.min(ex, o.maxMouseX); if (o.minY != null) ey = Math.max(ey, o.minMouseY); if (o.maxY != null) ey = Math.min(ey, o.maxMouseY); nx = x + ((ex - o.lastMouseX) * 1); ny = y + ((ey - o.lastMouseY) * 1); Drag.obj.root.style["left"] = nx + "px"; Drag.obj.root.style["top"] = ny + "px"; Drag.obj.lastMouseX = ex; Drag.obj.lastMouseY = ey; Drag.obj.root.ondrag(nx, ny); return false; }, end : function() { document.onmousemove = null; document.onmouseup = null; Drag.obj.root.ondragEnd( parseInt(Drag.obj.root.style["left"]), parseInt(Drag.obj.root.style["top"])); Drag.obj.root.style.zIndex = "199"; Drag.obj = null; }, fixE : function(e) { if (typeof e == 'undefined') e = window.event; if (typeof e.layerX == 'undefined') e.layerX = e.offsetX; if (typeof e.layerY == 'undefined') e.layerY = e.offsetY; return e; } }; // inicializa a popup this.init = function() { popup.position(); Drag.init(win,buttonContainer, minX, maxX, minY, maxY); }; };