Page States

The page body will have a stateful resolver tracking the state. You can define how the class should reflect the state. Have a look at Resolver("page::state::") to see the current values.

state	true/false
livepage	Is set 60ms after loading starts or when DOM onload is fired for quick pages.
loading	Is set initially and cleared when all <link ..text/javascript.. > modules are loaded.
launching	Is set when not loading, is configured, is connected, is authenticated, is authorised
launched	Is not set automatically now, will be in the near future.

The authorised and connected requirement may be moved to launched in the future.

The following flags are for you to manage:

state	true/false
authenticated	Set to false in HEAD to delay launching until user is logged in.
configured	Set to false in HEAD if webapp requires a configuration beyond the HTML page
connected	Set to false in HEAD if webapp requires a backend connection.
authorised	Set to false in HEAD if webapp requires permissions
online	Flag for tracking internet connectivity. No support, until browser support is better.

Reacting to state changes

You can listen to page state changes in general by,

Resolver("page::state").on("change",function(ev) {
    switch(ev.symbol) {
        case "loading": if (ev.value) ...
    }
});

Or you can listen very specifically,

Resolver("page::state.loading").on("false",startMyApp);
Resolver("page::state.livepage").on("false",stopMyApp);