Page Launching Control

By default the web page will load javascript without any special instructions. You can however change it to depend on deferred scripts, config, login and user properties.

The page resolver tracks the state and configuration of the page. It is used to decorate the body element so the page can be styled based on the current state.

By default the state is authenticated, authorised, connected, configured. Since these are set by default the page will be launched without waiting.

The core library functionality will work regardless of the page state, but some document roles, stateful fields and actions will only become available as the page launches.

Launch when logged in

If the page connects to a backend for authentication + authorisation, and you want to delay the page launching until the connection and authorisation is established you will need to change the defaults and trigger the launching yourself.

Put the following in your html:

<script>
 Resolver("page").set("state.authenticated",false);
</script>

This will hold off the launching while the user is authenticated. And then when the connection is established

Resolver("page").set("state.authenticated",true)

This paradigm is used when you have an asynchronus callback for gradually establishing communication with you backend systems.

If you need authorisation info after login in but before launching set state.authorised to false. If you need to verify connectivity to the backend set state.connected to false.

Delayed loading of scripts

Scripts defined using the <script> tag are treated as normal and executed with the HTML. If however you define a script using a link tag and specify rel="pastload" it will be loaded after the HTML page is rendered. In this case it will hold off the page launching until it is done. During this the loading and loadingScripts states will be true.

If you want a script to be delayed loading but loaded before the others use a link tag and specify rel="preload" instead.

Delayed loading of config

Commonly your web application will depend on configuration resources that are loaded independently of the scripts. You can load these using any logic you like; XHR, post message, XXHR, web sockets or dynamic script tags. Regardless of how you do it you will need to flag the url yet to be received and when it is.

Resolver('essential')('configRequired')('/path/to/config/resource');

Call this while you are loading the scripts to extend the loading state until the resource is received. Once received call:

Resolver('essential')('configLoaded')('/path/to/config/resource');

If you want to fetch your resource with XHR use the following template:

var req = XMLHttpRequest();
var xmlBundleUrl = '/path/to/config/resource'

Resolver('essential')('configRequired')(xmlBundleUrl);
req.onreadystatechange = function() {
    var console = Resolver("essential")("console");
    if (this.readyState == 4) {
        if (this.status == 200) {
            var mimeType = this.getResponseHeader("Content-Type");
            useTheResourceText(xmlBundleUrl,mimeType,this.responseText);
            Resolver('essential')('configLoaded')(xmlBundleUrl);
        } else if (this.status == 404) {
            console.log("Failed to load XML bundle configuration");
        }
    }
};
req.open('get',xmlBundleUrl, true); 
req.send();

When configLoaded hasn't been called for all resource URLs the launching will be held off. During this the loading and loadingConfig states will be true.

Adding a configuration processing step

You can process the individual configuration resources as they come in. However if you need a processing step when all scripts and configurations are loaded you need to set configured to false in the HTML.

<script>
 Resolver("page").set("state.configured",false);
</script>

And then when the loaded scripts and configuration is applied

Resolver("page").set("state.configured",true)

Responding to online/offline status

Some browsers have ways of being offline. If it goes into offline mode the online will be set to false. Combine checks for online with connected checks to determine if backend systems are available.