2 Replies Latest reply on Mar 8, 2007 9:27 AM by balteo

    HourGlass/Status for the whole page

    balteo

      Hello and congratulations for going OS!

      I am looking for a design pattern that would allow me to display an houglass or statut message on the whole page while it is loading. My page is as follows:

      <%@page contentType="text/html"%>
      <%@page pageEncoding="UTF-8"%>
      
      <%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
      <%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
      <%@taglib prefix="a4j" uri="https://ajax4jsf.dev.java.net/ajax"%>
      
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
      <html>
       <head>
       <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
       <title></title>
       <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/style.css"/>
       </head>
       <body>
       <div id="container">
       <f:view>
      
       <a4j:region id="region" selfRendered="true">
      
       <a4j:outputPanel layout="block" styleClass="box">
       <a4j:status startText="Please wait..." stopText="Idle/Done"/>
       </a4j:outputPanel>
      
       <f:verbatim>
       <br /><br />
       </f:verbatim>
      
      
       <jsp:include page="includes/debugInfo.jsp"/>
      
      
       <f:verbatim>
       <br /><br />
       </f:verbatim>
      
       <h:form id="formOne">
       <jsp:include page="includes/tradeDetails.jsp"/>
       </h:form>
      
       <jsp:include page="includes/tradeClientsAndQuantities.jsp"/>
      
       </a4j:region>
       </f:view>
       </div>
       </body>
      </html>
      
      


      the line here:
      <jsp:include page="includes/tradeDetails.jsp"/>
      is taking ages to load and there is not much I can do to improve this behavior.

      How can I display an animated gif on the whole page whilst the page is loading??????

      Thanks in advance,

      Julien.

        • 1. Re: HourGlass/Status for the whole page

          If I understand you use case correctly, you are speaking about showing the "please, wait" image not on ajax request, but on regular page loading. If so, a4j:status does not help you any how here.

          Seems to me you can solve it using just a pure client side code:

          ...
          <body onload="document.getElementById('wait').style.display='none'">
          ...
          <h:graphicImage id="wait" value="/path/to/your/image.gif" />





          P.S. Please, do not use selfRendered="true" for the region if you do not realize yet, what it is for.

          • 2. Re: HourGlass/Status for the whole page
            balteo

            thanks!