[richfaces-svn-commits] JBoss Rich Faces SVN: r8217 - in trunk/ui/modal-panel/src/main: templates/org/richfaces and 1 other directory.

Author: nbelaevski Date: 2008-04-27 17:34:37 -0400 (Sun, 27 Apr 2008) New Revision: 8217 Modified: trunk/ui/modal-panel/src/main/resources/org/richfaces/renderkit/html/scripts/modalPanel.js trunk/ui/modal-panel/src/main/resources/org/richfaces/renderkit/html/scripts/modalPanelBorders.js trunk/ui/modal-panel/src/main/templates/org/richfaces/htmlModalPanel.jspx Log: http://jira.jboss.com/jira/browse/RF-3079 http://jira.jboss.com/jira/browse/RF-2366 Modified: trunk/ui/modal-panel/src/main/resources/org/richfaces/renderkit/html/scripts/modalPanel.js =================================================================== --- trunk/ui/modal-panel/src/main/resources/org/richfaces/renderkit/html/scripts/modalPanel.js 2008-04-27 21:34:31 UTC (rev 8216) +++ trunk/ui/modal-panel/src/main/resources/org/richfaces/renderkit/html/scripts/modalPanel.js 2008-04-27 21:34:37 UTC (rev 8217) @@ -6,9 +6,6 @@ window.Richfaces = {}; } -sizeA = 4; -sizeB = 40; - function discardElement(element) { var garbageBin = document.getElementById('IELeakGarbageBin'); if (!garbageBin) { @@ -71,42 +68,18 @@ ModalPanel.panels = new Array(); ModalPanel.activePanels = new Array(); -ModalPanel.Context = Class.create(); -ModalPanel.Context.prototype = { - initialize: function(modalPanel) { - this.cdiv = modalPanel.contentDiv; - this.isPositionFixed = Richfaces.getComputedStyle(this.cdiv, "position") == "fixed"; - }, - - left: function(offset) { - return offset; - }, - - top: function(offset) { - return offset; - }, - - width: function() { - return $(this.cdiv).offsetWidth; - }, - - height: function() { - return $(this.cdiv).offsetHeight; +function getSizeElement() { + var element; + var element; + if (RichFaces.navigatorType() != RichFaces.OPERA && document.compatMode=='CSS1Compat') { + element = document.documentElement; + } else { + element = document.body; } + + return element; } - function getSizeElement() { - var element; - if (RichFaces.navigatorType() != RichFaces.OPERA && document.compatMode=='CSS1Compat') { - element = document.documentElement; - } else { - element = document.body; - } - - return element; - } - - ModalPanel.prototype = { initialize: function(id, options) { this["rich:destructor"] = "destroy"; @@ -119,17 +92,16 @@ this.baseZIndex = this.options.zindex ? this.options.zindex : 100; - this.minWidth = Math.max(this.options.minWidth, 2*sizeA + 2); - this.minHeight = Math.max(this.options.minHeight, 2*sizeA + 2); + this.minWidth = Math.max(this.options.minWidth, 2*ModalPanel.Sizer.INITIAL_MIN + 2); + this.minHeight = Math.max(this.options.minHeight, 2*ModalPanel.Sizer.INITIAL_MIN + 2); this.div = id + "Div"; this.cursorDiv = id + "CursorDiv"; this.cdiv = id + "CDiv"; this.contentDiv = id + "ContentDiv"; + this.contentTable = id + "ContentTable"; this.shadowDiv = id + "ShadowDiv"; - this.context = new ModalPanel.Context(this); - this.borders = new Array(); if (this.options.resizeable) { @@ -186,7 +158,25 @@ this.selectBehavior = options.selectBehavior; }, + width: function() { + return this.getContentElement().offsetWidth; + }, + + height: function() { + return this.getContentElement().offsetHeight; + }, + + getContentElement: function() { + if (!this._sizedElement) { + this._sizedElement = this.options.autosized ? $(this.contentTable) : $(this.contentDiv); + } + + return this._sizedElement; + }, + destroy: function() { + this._sizedElement = null; + ModalPanel.panels = ModalPanel.panels.without(this); this.traverseSelects(true); @@ -394,7 +384,7 @@ show: function(event, opts) { var element = this.id; - if(this.invokeEvent("beforeshow",event,null,element)){ + if(this.invokeEvent("beforeshow",event,null,element)) { this.preventFocus(); if (!this.floatedToBody) { @@ -420,7 +410,7 @@ "<iframe src=\"javascript:''\" frameborder=\"0\" scrolling=\"no\" id=\"" + this.iframe + "\" " + "style=\"position: absolute; width: 1px; height: 1px; background-color: white; overflow-y: hidden; z-index: 1;\">" + "</iframe>"); - + eIframe = $(this.iframe); //alert("IFrame:" + eIframe + "created!"); @@ -441,27 +431,21 @@ Object.extend(this.userOptions, opts); } - var eContentDiv = $(this.contentDiv); + var eContentElt = this.getContentElement(); - if (this.options.autosized) { - eContentDiv.style.overflow = ""; - options.width = -1; - options.height = -1; - - } else { + if (!this.options.autosized) { if (options.width && options.width == -1) options.width = 300; if (options.height && options.height == -1) options.height = 200; } - var eContentDiv = $(this.contentDiv); if (options.width && options.width != -1) { if (this.minWidth > options.width) { options.width = this.minWidth; } - - eContentDiv.style.width = options.width + (/px/.test(options.width) ? '' : 'px'); + + eContentElt.style.width = options.width + (/px/.test(options.width) ? '' : 'px'); } if (options.height && options.height != -1) { @@ -469,9 +453,9 @@ options.height = this.minHeight; } - eContentDiv.style.height = options.height + (/px/.test(options.height) ? '' : 'px'); + eContentElt.style.height = options.height + (/px/.test(options.height) ? '' : 'px'); } - + eCdiv.mpSet = true; //Element.setStyle(this.dialogWindow.document.body, { "margin" : "0px 0px 0px 0px" }); @@ -528,22 +512,19 @@ Element.show(element); this.correctShadowSizeEx(); - + if (options.left) { var _left; if (options.left != "auto") { _left = parseInt(options.left, 10); } else { var cw = getSizeElement().clientWidth; - if (RichFaces.navigatorType() == RichFaces.OPERA) - { - _left = (cw - eContentDiv.getWidth()) / 2; + var _width = this.width(); //Richfaces.getComputedStyleSize(eContentElt, "width"); + if (cw >= _width) { + _left = (cw - _width) / 2; + } else { + _left = 0; } - else { - var _width = eContentDiv.clientWidth; - _left = (cw - _width) / 2; - } - } this.setLeft(_left); @@ -555,19 +536,17 @@ _top = parseInt(options.top, 10); } else { var cw = getSizeElement().clientHeight; - if (RichFaces.navigatorType() == RichFaces.OPERA) - { - _top = (cw - eContentDiv.getHeight()) / 2; - } - else { - var _height = eContentDiv.clientHeight; + var _height = this.height(); //Richfaces.getComputedStyleSize(eContentElt, "height"); + if (cw >= _height) { _top = (cw - _height) / 2; + } else { + _top = 0; } } this.setTop(_top); } - + if (this.options.autosized) { this.observerSize = window.setInterval(this.correctShadowSize.bindAsEventListener(this), 500); @@ -583,17 +562,17 @@ this.header.doPosition(); } - Element.hide(eCdiv); - element.style.visibility = ""; - + Element.hide(eCdiv); + element.style.visibility = ""; + this.lastOnfocus(); - - Element.show(eCdiv); - - var event = {}; - event.parameters = opts || {}; - this.shown = true; - this.invokeEvent("show",event,null,element); + + Element.show(eCdiv); + + var event = {}; + event.parameters = opts || {}; + this.shown = true; + this.invokeEvent("show",event,null,element); } }, @@ -690,9 +669,9 @@ var vetoeChange = false; var newSize; - var eContentDiv = $(this.contentDiv); + var eContentElt = this.getContentElement(); - newSize = this._getStyle(eContentDiv, "width");//Richfaces.getComputedStyleSize(eContentDiv, "width"); + newSize = this._getStyle(eContentElt, "width");//Richfaces.getComputedStyleSize(eContentDiv, "width"); var oldSize = newSize; newSize += diff.deltaWidth || 0; @@ -728,7 +707,7 @@ cssHash.left = newPos + 'px'; } - newSize = this._getStyle(eContentDiv, "height")//;Richfaces.getComputedStyleSize(eContentDiv, "height"); + newSize = this._getStyle(eContentElt, "height")//;Richfaces.getComputedStyleSize(eContentDiv, "height"); var oldSize = newSize; newSize += diff.deltaHeight || 0; @@ -772,28 +751,28 @@ Element.setStyle(eCdiv, cssHash); - Element.setStyle(eContentDiv, cssHashWH); + Element.setStyle(eContentElt, cssHashWH); this.correctShadowSizeEx(); Object.extend(this.userOptions, cssHash); Object.extend(this.userOptions, cssHashWH); - var w = this.context.width(); - var h = this.context.height(); + var w = this.width(); + var h = this.height(); - this.context.reduced = null; + this.reductionData = null; - if (w <= 2*sizeB) { - this.context.reduced = {}; - this.context.reduced.w = w; + if (w <= 2*ModalPanel.Sizer.INITIAL_MAX) { + this.reductionData = {}; + this.reductionData.w = w; } - if (h <= 2*sizeB) { - if (!this.context.reduced) { - this.context.reduced = {}; + if (h <= 2*ModalPanel.Sizer.INITIAL_MAX) { + if (!this.reductionData) { + this.reductionData = {}; } - this.context.reduced.h = h; + this.reductionData.h = h; } if (this.header) { @@ -841,8 +820,7 @@ correctShadowSizeEx: function() { var eShadowDiv = $(this.shadowDiv); - var eContentDiv = $(this.contentDiv); - if (!eShadowDiv || !eContentDiv) { + if (!eShadowDiv) { return; } var eIframe = $(this.iframe); @@ -854,8 +832,8 @@ dx = eShadowDiv.offsetWidth-eShadowDiv.clientWidth; dy = eShadowDiv.offsetHeight-eShadowDiv.clientHeight; } - var w = eContentDiv.offsetWidth; - var h = eContentDiv.offsetHeight; + var w = this.width(); + var h = this.height(); eShadowDiv.style.width = (w-dx)+"px"; eShadowDiv.style.height = (h-dy)+"px"; Modified: trunk/ui/modal-panel/src/main/resources/org/richfaces/renderkit/html/scripts/modalPanelBorders.js =================================================================== --- trunk/ui/modal-panel/src/main/resources/org/richfaces/renderkit/html/scripts/modalPanelBorders.js 2008-04-27 21:34:31 UTC (rev 8216) +++ trunk/ui/modal-panel/src/main/resources/org/richfaces/renderkit/html/scripts/modalPanelBorders.js 2008-04-27 21:34:37 UTC (rev 8217) @@ -150,6 +150,9 @@ ModalPanel.Sizer = Class.create(); +ModalPanel.Sizer.INITIAL_MIN = 4; +ModalPanel.Sizer.INITIAL_MAX = 40; + ModalPanel.Sizer.Diff = Class.create(); ModalPanel.Sizer.Diff.prototype = { initialize: function(dX, dY, dWidth, dHeight) { @@ -172,15 +175,15 @@ var width = 0; var height = 0; - var context = modalPanel.context; + var reductionData = modalPanel.reductionData; - if (context.reduced) { - if (context.reduced.w) { - width = context.reduced.w / 2; + if (reductionData) { + if (reductionData.w) { + width = reductionData.w / 2; } - if (context.reduced.h) { - height = context.reduced.h / 2; + if (reductionData.h) { + height = reductionData.h / 2; } } @@ -190,7 +193,7 @@ elt.reducedWidth = elt.style.width; } elt.style.width = width + 'px'; - } else if (width < sizeB && /* TODO fix the dirty code */elt.reducedWidth == sizeB + 'px') { + } else if (width < ModalPanel.Sizer.INITIAL_MAX && /* TODO fix the dirty code */elt.reducedWidth == ModalPanel.Sizer.INITIAL_MAX + 'px') { elt.style.width = width + 'px'; } } else { @@ -206,7 +209,7 @@ elt.reducedHeight = elt.style.height; } elt.style.height = height + 'px'; - } else if (height < sizeB && /* TODO fix the dirty code */elt.reducedHeight == sizeB + 'px') { + } else if (height < ModalPanel.Sizer.INITIAL_MAX && /* TODO fix the dirty code */elt.reducedHeight == ModalPanel.Sizer.INITIAL_MAX + 'px') { elt.style.height = height + 'px'; } } else { @@ -218,10 +221,8 @@ }, doSetupPosition: function (modalPanel, elt, left, top) { - var context = modalPanel.context; - - elt.style.left = context.left(left) + 'px'; - elt.style.top = context.top(top) + 'px'; + elt.style.left = left + 'px'; + elt.style.top = top + 'px'; }, doPosition: function (modalPanel, elt) { @@ -246,7 +247,7 @@ ModalPanel.Sizer.N = new ModalPanel.Sizer(); ModalPanel.Sizer.N.doPosition = function (modalPanel, elt) { - elt.style.width = modalPanel.context.width() + 'px'; + elt.style.width = modalPanel.width() + 'px'; this.doSetupPosition(modalPanel, elt, 0, 0); }; ModalPanel.Sizer.N.doDiff = function(dx, dy) { @@ -256,7 +257,7 @@ ModalPanel.Sizer.NEU = new ModalPanel.Sizer(); ModalPanel.Sizer.NEU.doPosition = function (modalPanel, elt) { this.doSetupSize(modalPanel, elt); - this.doSetupPosition(modalPanel, elt, modalPanel.context.width() - elt.clientWidth, 0); + this.doSetupPosition(modalPanel, elt, modalPanel.width() - elt.clientWidth, 0); }; ModalPanel.Sizer.NEU.doDiff = function(dx, dy) { return new ModalPanel.Sizer.Diff(0, dy, dx, -dy); @@ -265,7 +266,7 @@ ModalPanel.Sizer.NEL = new ModalPanel.Sizer(); ModalPanel.Sizer.NEL.doPosition = function (modalPanel, elt) { this.doSetupSize(modalPanel, elt); - this.doSetupPosition(modalPanel, elt, modalPanel.context.width() - elt.clientWidth, 0); + this.doSetupPosition(modalPanel, elt, modalPanel.width() - elt.clientWidth, 0); }; ModalPanel.Sizer.NEL.doDiff = function(dx, dy) { return new ModalPanel.Sizer.Diff(0, dy, dx, -dy); @@ -273,8 +274,8 @@ ModalPanel.Sizer.E = new ModalPanel.Sizer(); ModalPanel.Sizer.E.doPosition = function (modalPanel, elt) { - elt.style.height = modalPanel.context.height() + 'px'; - this.doSetupPosition(modalPanel, elt, modalPanel.context.width() - elt.clientWidth, 0); + elt.style.height = modalPanel.height() + 'px'; + this.doSetupPosition(modalPanel, elt, modalPanel.width() - elt.clientWidth, 0); }; ModalPanel.Sizer.E.doDiff = function(dx, dy) { return new ModalPanel.Sizer.Diff(0, 0, dx, 0); @@ -283,8 +284,8 @@ ModalPanel.Sizer.SEU = new ModalPanel.Sizer(); ModalPanel.Sizer.SEU.doPosition = function (modalPanel, elt) { this.doSetupSize(modalPanel, elt); - this.doSetupPosition(modalPanel, elt, modalPanel.context.width() - elt.clientWidth, - modalPanel.context.height() - elt.clientHeight); + this.doSetupPosition(modalPanel, elt, modalPanel.width() - elt.clientWidth, + modalPanel.height() - elt.clientHeight); }; ModalPanel.Sizer.SEU.doDiff = function(dx, dy) { return new ModalPanel.Sizer.Diff(0, 0, dx, dy); @@ -293,8 +294,8 @@ ModalPanel.Sizer.SEL = new ModalPanel.Sizer(); ModalPanel.Sizer.SEL.doPosition = function (modalPanel, elt) { this.doSetupSize(modalPanel, elt); - this.doSetupPosition(modalPanel, elt, modalPanel.context.width() - elt.clientWidth, - modalPanel.context.height() - elt.clientHeight); + this.doSetupPosition(modalPanel, elt, modalPanel.width() - elt.clientWidth, + modalPanel.height() - elt.clientHeight); }; ModalPanel.Sizer.SEL.doDiff = function(dx, dy) { return new ModalPanel.Sizer.Diff(0, 0, dx, dy); @@ -302,8 +303,8 @@ ModalPanel.Sizer.S = new ModalPanel.Sizer(); ModalPanel.Sizer.S.doPosition = function (modalPanel, elt) { - elt.style.width = modalPanel.context.width() + 'px'; - this.doSetupPosition(modalPanel, elt, 0, modalPanel.context.height() - elt.clientHeight); + elt.style.width = modalPanel.width() + 'px'; + this.doSetupPosition(modalPanel, elt, 0, modalPanel.height() - elt.clientHeight); }; ModalPanel.Sizer.S.doDiff = function(dx, dy) { return new ModalPanel.Sizer.Diff(0, 0, 0, dy); @@ -312,7 +313,7 @@ ModalPanel.Sizer.SWL = new ModalPanel.Sizer(); ModalPanel.Sizer.SWL.doPosition = function (modalPanel, elt) { this.doSetupSize(modalPanel, elt); - this.doSetupPosition(modalPanel, elt, 0, modalPanel.context.height() - elt.clientHeight); + this.doSetupPosition(modalPanel, elt, 0, modalPanel.height() - elt.clientHeight); }; ModalPanel.Sizer.SWL.doDiff = function(dx, dy) { return new ModalPanel.Sizer.Diff(dx, 0, -dx, dy); @@ -321,7 +322,7 @@ ModalPanel.Sizer.SWU = new ModalPanel.Sizer(); ModalPanel.Sizer.SWU.doPosition = function (modalPanel, elt) { this.doSetupSize(modalPanel, elt); - this.doSetupPosition(modalPanel, elt, 0, modalPanel.context.height() - elt.clientHeight); + this.doSetupPosition(modalPanel, elt, 0, modalPanel.height() - elt.clientHeight); }; ModalPanel.Sizer.SWU.doDiff = function(dx, dy) { return new ModalPanel.Sizer.Diff(dx, 0, -dx, dy); @@ -329,7 +330,7 @@ ModalPanel.Sizer.W = new ModalPanel.Sizer(); ModalPanel.Sizer.W.doPosition = function (modalPanel, elt) { - elt.style.height = modalPanel.context.height() + 'px'; + elt.style.height = modalPanel.height() + 'px'; this.doSetupPosition(modalPanel, elt, 0, 0); }; ModalPanel.Sizer.W.doDiff = function(dx, dy) { @@ -347,8 +348,7 @@ ModalPanel.Header = new ModalPanel.Sizer(); ModalPanel.Header.doPosition = function (modalPanel, elt) { - //elt.style.width = modalPanel.context.width() - 2*sizeA + 'px'; - //this.doSetupPosition(modalPanel, elt, 0, 0); + }; ModalPanel.Header.doDiff = function(dx, dy) { return new ModalPanel.Sizer.Diff(dx, dy, 0, 0); Modified: trunk/ui/modal-panel/src/main/templates/org/richfaces/htmlModalPanel.jspx =================================================================== --- trunk/ui/modal-panel/src/main/templates/org/richfaces/htmlModalPanel.jspx 2008-04-27 21:34:31 UTC (rev 8216) +++ trunk/ui/modal-panel/src/main/templates/org/richfaces/htmlModalPanel.jspx 2008-04-27 21:34:37 UTC (rev 8217) @@ -105,13 +105,16 @@ tableStyle += "width: " + (width > 0 ? width : 1) + "px;"; tableStyle += "height: " + (height > 0 ? height : 1) + "px;"; + divStyle = ""; + } else { tableStyle = "height: 100%; width: 100%;"; + divStyle = "overflow: hidden;"; } ]]> </jsp:scriptlet> - <div id="#{clientId}ContentDiv" style="position: absolute; z-index: 2; overflow: hidden; #{component.attributes['style']}" class="dr-mpnl-pnl rich-mp-content"> + <div id="#{clientId}ContentDiv" style="#{divStyle} position: absolute; z-index: 2; #{component.attributes['style']}" class="dr-mpnl-pnl rich-mp-content"> <jsp:scriptlet> <![CDATA[if(component.getFacet("controls")!=null && component.getFacet("controls").isRendered()) {]]> </jsp:scriptlet> @@ -122,7 +125,7 @@ <![CDATA[}]]> </jsp:scriptlet> - <table style="#{tableStyle}" border="0" cellpadding="0" cellspacing="0"> + <table id="#{clientId}ContentTable" style="#{tableStyle}" border="0" cellpadding="0" cellspacing="0"> <jsp:scriptlet> <![CDATA[if(component.getFacet("header")!=null && component.getFacet("header").isRendered()) {]]> </jsp:scriptlet>