This discussion is archived
4 Replies Latest reply: Jan 29, 2013 3:51 AM by gimbal2 RSS

Loading page animation while JSF page is being loaded

jmsjr Newbie
Currently Being Moderated
JSF 2.1
Mojarra 2.1.7
JBoss 7.1.1

The backing bean on my JSF page(s) are view-scoped, and during the initial request, the backing bean's @PostConstructor method may take some time to return as it is calling external systems that are outside of my control. Thus, during the RENDER_RESPONSE phase of the initial request to the JSF page, it may take, on average, 3 to 5 seconds to return ( sometimes longer than that .... which again, is outside of my control ). While this is happening, the page rendered is of course blank as the response has not been written yet.

Naturally, I am thinking of a way to show an animated loading image.

1) I have seen suggestions of using a4j:status and a4j:region, but these are only valid for Ajax requests, while what I need is something that I can use during the initial request ( not a post back ), of a JSF lifecycle.

2) Suggestions of using two HTML divs... one DIV shows the animated image while the other DIV wraps the real content, but is initially hidden. Then use window.onload() to swap the style of the two DIVs so that the DIV wrapping the real content becomes visible while the DIV wrapping the animated image becomes hidden.

But then again ... these DIVs will NOT be written to the response yet as I am still in RENDER_RESPONSE phase.


The only thing that I can think of is to:

3) Create another page whose sole purpose is to show the animated image, then somehow immediately forward the request to the real page. The animated image on the first page will hopefully continue animating until the final page is rendered.

What have you guys done ?
  • 1. Re: Loading page animation while JSF page is being loaded
    gimbal2 Guru
    Currently Being Moderated
    3(alt)) show a view which displays the animation and then triggers the long-loading page to be requested (no forward). The long-loading page does not generate any response until there really is something to show, to keep the animation view visible.

    4) create a task system which can be polled. Whatever takes a long time to execute is executed as a background job; the view will periodically poll the job status through ajax and when it finishes (or fails), displays the results.
  • 2. Re: Loading page animation while JSF page is being loaded
    960507 Newbie
    Currently Being Moderated
    I would recommend changing your approach then. Stick the data in a @SessionScoped bean and use 2 pages.

    Calling page 1 will load the data into the session (use your animation here).
    Calling page 2 will call the @PostConstruct on the @ViewScoped bean where you can have the @PostConstruct get the data from the session.

    Edited by: mojarra on Dec 4, 2012 6:12 AM
  • 3. Re: Loading page animation while JSF page is being loaded
    jmsjr Newbie
    Currently Being Moderated
    gimbal2 wrote:
    3(alt)) show a view which displays the animation and then triggers the long-loading page to be requested (no forward). The long-loading page does not generate any response until there really is something to show, to keep the animation view visible.
    This was the simplest solution by far .. although there are some quirks to be deal with when using IE.
  • 4. Re: Loading page animation while JSF page is being loaded
    gimbal2 Guru
    Currently Being Moderated
    jmsjr wrote:
    gimbal2 wrote:
    3(alt)) show a view which displays the animation and then triggers the long-loading page to be requested (no forward). The long-loading page does not generate any response until there really is something to show, to keep the animation view visible.
    This was the simplest solution by far .. although there are some quirks to be deal with when using IE.
    As usual :/ It remains a questionable product no matter how many times they reinvent the wheel.

Legend

  • Correct Answers - 10 points
  • Helpful Answers - 5 points