Docs

Search Clear

Show Docs menu

Delayed run start

We often want to delay the start of the run until resources are loaded, or until the user has clicked on a splash screen.

• A loading screen vanishes automatically when resources load.
• A splash screen needs user interaction to dismiss.

 

AB.runReady = true;              // Start the run loop immediately 
                                 // or delay the run loop until the World is ready.
 
AB.loadingScreen();              // draw a standard loading screen   
AB.loadingHtml ( html );         // define entire HTML of the loading screen  
AB.removeLoading();              // remove loading screen 

AB.newSplash();                  // draw a standard splash screen  
AB.newSplash ( html );           // draw a standard splash screen plus a HTML message 
AB.splashHtml ( html );          // define entire HTML of the splash screen  
AB.splashClick ( fn );           // define function when splash screen clicked    
AB.removeSplash();               // remove splash screen 

• JS code search of all Worlds for use of AB.runReady.
• JS code search of all Worlds for use of AB.loadingScreen.
• JS code search of all Worlds for use of AB.newSplash.

---

Example of how to use a loading screen

Here is a plan for how to use AB.runReady and a loading screen to load resources. Do not start the run loop until resources loaded. Then loading screen vanishes.

AB.world.newRun = function() 
{
  // ... initialise whatever we can without the resources 
	
  AB.loadingScreen();
  AB.runReady = false;  
		
  // start asynchronous load of resources
  
  loadResources ( resources, function()
  {
    // this function is called whenever load resources returns  	  
	
    // ... further initialisation now resources are loaded 
	
    AB.removeLoading();
    AB.runReady = true;             
  });         
  
};


AB.world.nextStep = function()
{
  // this function will not be called until AB.runReady = true
};

Example World that uses a loading screen:

---

Example of how to use a splash screen

Here is a plan for how to use AB.runReady with a splash screen. Do not start the run loop until user dismisses splash screen.

 

AB.world.newRun = function() 
{
  AB.runReady = false;  		
};


AB.world.nextStep = function()
{
  // this function will not be called until AB.runReady = true
};


AB.newSplash();

// define what splash screen click does:

$('#splashbutton').click ( function ()        
{
  AB.removeSplash();                    
  AB.runReady = true;              
});

Example World that uses a splash screen: