Show loading message while HTMLPane is loading

[SimonF]

Hi there,

We are using HTMLPanes to include content which is generated asynchronous to the view generation.
It can happen that the generation of the included content need more time (between 0 and 15 seconds). In the meanwhile the user only sees an empty box with no content.
It seems that the loadingMessage attribute does not get rendered with contentsType set to page.

Here you can see an example delay for the included url, the loadingMesage is not displayed.



I also have tried to set an own styleName to the HTMLPane to add css background. But the included page maybe has no background set so the background would shine through. To remove the class we would need a callback for the onload event of the iframe, but this is also no implemented yet.

Is there any way to display a message while the iframe is loading?

isc.VLayout.create({
    "ID" : "theVLayout",
    "height" : "600",
    "width" : "600",
    "align" : "center",
    "leaveScrollbarGap" : false,
    "members" :
    [isc.Label.create({
            "ID" : "theLabel",
            "width" : "100%",
            "height" : "20",
            "contents" : "Here is a Label - Waiting for HTMLPane to load",
        }),
        isc.HTMLPane.create({
            "ID" : "theHtmlPane",
            "width" : "100%",
            "height" : "580",
            "hideUsingDisplayNone" : false,
            "contentsType" : "page",
            "contentsURL" : "http://www.itgeared.com/demo/1508-iframe-loading-source.aspx",
            "loadingMessage" : "Loading...",
            "border" : "1px solid red"
        })]
})

Best Regards

[Isomorphic]

This is tricky, because iframes are notoriously finicky when it comes to finding out if they are loaded, especially when document.domain is involved.

Some options:

1. have your server write out some partial content (possibly a loading message) before starting on the longer task that can take 15 seconds

2. if the long process on your server is only long the first time, or if results can be cached, just load the contents invisibly via an RPCRequest, discard them and then load them via an iframe

3. consider whether you really need contentsType:"page" - it's only needed if your content is poorly behaved and will impact the containing page via overly broad CSS rules or similar problems

4. dive into reliable iframe detection on your own, or use Feature Sponsorship to have Isomorphic add the feature to HTMLFlow (possibly with limitations such as not supporting document.domain, which simplifies the problem)

[SimonF]

Thanks for your fast reply.
1. sadly we cannot use partial-content.
2. the data has to be calculated live and should only displayed when needed. so also not really an option.
3. the included page can have multiple overly broad CSS rules, some of them cannot be changed and are client specific.
4. This seems to be the only option to display a loading text or loading image in an iframe.

I'll take a closer look on this. I wanted to first ask if there is a "easy" supported solution to this.