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

    Modal panel non working anymore on FF 2.0.0.3 with latest sn

    Renzo Tomaselli Novice

      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
          Sergey Smirnov Master

          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.

          • 2. Re: Modal panel non working anymore on FF 2.0.0.3 with lates
            Renzo Tomaselli Novice

            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
              Renzo Tomaselli Novice

              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 ?