Create a JavaScript Application for encapsulation and single page application support

Web Export Feature Request
1

This would write an object to the page that you can use to reference any element and set states or options.

It would also wrap the artboard navigation and scalling code into the application object.

As a developer you could use this object to add event listeners, get references to elements, change states or pages, set options and so on.

It would be something like this:

<script> 
    var application = {};

    // creating references to relevant elements
    application.totalSales = document.getElementById("TotalSales");
    application.netSales = document.getElementById("Net_Sales");
    application.getDataButton = document.getElementById("Get_Data_Button");

    // change state support
    application.artboards = ["Artboard1", "Artboard2", "Artboard3"];
    application.setState = function(name) { 
       application.showState(name)
    };

    // create global reference
    window.application = application;

    // dispatching event to notify event listeners
    window.dispatchEvent("applicationComplete");
</script>
2

This is now available in 2.2.0.

You can get a reference to the application by accessing the application object.

var myApplication = window.application;

You can listen for application complete by adding an event listener to the window object.

window.addEventListener("applicationComplete", myApplicationComplete);
window.addEventListener(application.APPLICATION_COMPLETE, myApplicationComplete);

You can list all states by accessing the states array:

var states = application.states;

You can list all view ids by accessing the viewIds array:

var views = application.viewIds;

Each artboard (or view) has it’s own related view state. You can get a reference to all views by accessing the views object:

var views = application.views;

You can go get the visible view by using the getVisibleView method():

 var view = application.getVisibleView();

You can go to another view / state by using the goToState() method:

 application.goToState(application.states[0]);
 application.goToState("Home");
 application.goToState(application.getVisibleView().id);

When you export an single page application a new state is created for each artboard. In the future you will be able to create your own states and determine what artboards and elements appear in that state.