4 Replies Latest reply on May 10, 2007 9:27 AM by tomarenz

Modal panel non working anymore on FF 2.0.0.3 with latest sn

tomarenz May 8, 2007 1:00 PM

Hi, I downloaded the latest snapshot of RichFaces. The modal panel is not working anymore on FF, while it keeps running fine on IE 6/7.
Panel contents appear at page bottom without any frame and without disabling anything on the page.
I upgraded to latest snapshot because this effect appeared randomly on a previous snapshot.
This is the failing page example:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<tr:document
 xmlns:rich="http://richfaces.ajax4jsf.org/rich"
 xmlns:f="http://java.sun.com/jsf/core"
 xmlns:h="http://java.sun.com/jsf/html"
 xmlns:tr="http://myfaces.apache.org/trinidad">

 <rich:modalPanel id="modal" moveable="true" resizeable="true">
 <f:facet name="header">
 <h:outputText value=""/>
 </f:facet>
 <tr:form id="modalForm" inlineStyle="width: auto; height: auto">
 <a href="javascript:Richfaces.hideModalPanel('modal')">hide this panel</a>
 </tr:form>
 </rich:modalPanel>
 <a href="javascript:Richfaces.showModalPanel('modal');">Open</a>
</tr:document>

I use Trinidad, MyFaces and Facelets.
Online example for the modal panel from Jboss runs fine, but I noticed that rendered contents are different: in my case, there is no iframe before resizer divs.

1. Re: Modal panel non working anymore on FF 2.0.0.3 with lates

sergeysmirnov May 8, 2007 6:36 PM (in response to tomarenz)

do you have a small test project? if so, create a jira issue and attach the war there. From the first glance, i do not see what might happen there.
Actions

2. Re: Modal panel non working anymore on FF 2.0.0.3 with lates

tomarenz May 9, 2007 4:39 AM (in response to tomarenz)

Sergey, I will post it, all is needed is this example page and related jars.
Btw, I noticed a few differences in DOM structure concerning calling showModalPanel.
Before (as rendered):

<div id="modal" style="display: none;">
<div id="modalContainer" class="rich-modalpanel" style="position: absolute; display: none; z-index: 100;">
<div id="modalDiv" class="dr-mpnl-mask-div rich-mpnl-mask-div" style="z-index: 1;"/>
<div id="modalCursorDiv" class="dr-mpnl-mask-div rich-mpnl-mask-div" style="opacity: 0.01; z-index: -200;"/>
<div id="modalCDiv" class="dr-mpnl-panel rich-mpnl_panel" style="width: 1px; height: 1px; z-index: 2;">
<div id="modalResizerNWU" class="dr-mpnl-resizer rich-mpnl-resizer" style="width: 40px; height: 4px; z-index: 13; cursor: nw-resize;"/>
...

and after:

<div id="modal" style="display: none;"/>
<a href="javascript:Richfaces.showModalPanel('modal');">Open</a>
<div id="modalContainer" class="rich-modalpanel" style="position: absolute; z-index: 100;">
<div id="modalDiv" class="dr-mpnl-mask-div rich-mpnl-mask-div" style="z-index: 1;"/>
<div id="modalCursorDiv" class="dr-mpnl-mask-div rich-mpnl-mask-div" style="opacity: 0.01; z-index: -200;"/>
<div id="modalCDiv" class="dr-mpnl-panel rich-mpnl_panel" style="width: 1px; height: 1px; z-index: 2; left: 608px; top: 178px;">
<div id="modalResizerNWU" class="dr-mpnl-resizer rich-mpnl-resizer" style="width: 40px; height: 4px; z-index: 13; cursor: nw-resize; left: 0px; top: 0px;"/>

And this is after running the online example at Jboss:

<div id="mp" style="position: relative;" name="mp">
<div id="mpDiv" class="dr-mpnl-mask-div rich-mpnl-mask-div" style="background-color: rgb(208, 208, 208); opacity: 0.5; z-index: 1998;"/>
<div id="mpCursorDiv" class="dr-mpnl-mask-div rich-mpnl-mask-div" style="background-color: rgb(208, 208, 208); opacity: 0.01; z-index: 1800; cursor: move;"/>
<div id="mpCDiv" class="dr-mpnl-panel rich-mpnl_panel" style="z-index: 1999; width: 450px; height: 200px; left: 505px; top: 200px;">
<iframe id="mpIFrame" scrolling="no" frameborder="0" style="position: absolute; width: 100%; height: 100%; background-color: white; overflow-y: hidden; z-index: 1998;">
</iframe>
<div id="mpResizerNWU" class="dr-mpnl-resizer rich-mpnl-resizer" style="width: 40px; height: 4px; z-index: 2001; cursor: nw-resize; left: 0px; top: 0px;"/>

3. Re: Modal panel non working anymore on FF 2.0.0.3 with lates

tomarenz May 9, 2007 10:38 AM (in response to tomarenz)
Well, page contents and js seem ok, the problem is the css which sometimes appears empty while looking at it through Firebug. No classes.
The rendered link is:
/Test/a4j.res/org/richfaces/renderkit/html/css/modalPanel.xcss/DATA/eAFbJaehBAADeAET.faces

Then a sessionid is appended as ;jsessionid=CB1BF3C665425EB2BF52C90AFD7B74AB.
Furthermore, I noticed that this effect doesn't depend on FF: when on IE the css is not available, panel contents are completely missing.
The overall result appears as very random in time.
Could anyone suggest any point in sources where I could observe & debug modal panel css rendering ?
Actions
4. Re: Modal panel non working anymore on FF 2.0.0.3 with lates

tomarenz May 10, 2007 9:27 AM (in response to tomarenz)

This turned out being a Ajax4jsf/Trinidad css cache issue, please see

http://jboss.com/index.html?module=bb&op=viewtopic&t=108340
Actions

Go to original post