The SPA Library

You can access the SPA library using

spa_activity: the command to run. Always of the format libname:function

 All spa_activity must be inside a class called spa_main otherwise it will not work

document.ready will fail because SPA loads pages using Ajax.

Overall Flow of SPA

When the first page is loaded

  • Step 1: Body is Faded
  • Step 2: Spinner is Shown
  • Step 3: The Page is cached for future calls. The cache is same as the URL
  • Step 4: Backbone.js, Underscore.js and aw2_spa is loaded
  • Step 5: Spinner is Hidden
  • Step 6: Body is Made Visible
  • Step 7: All the spa_activity within .spa_main are executed
  • Step 8: If there is Google Analytics a pageview is fired

When get_spa_uri is called

  •  Step 1: spinner library is shown. You can choose the spinner library. See get_spa_uri
  • Step 2: If the uri is already available in cache then the cache value is retrieved
  • Step 3: Not in cache: All the data to be sent to server is collected. See collect_data to see what all is sent to the server
  • Step 4: Not in Cache: Post Request to the server. See get_spa_uri on the uri which is requested
  • Step 5: The URL of the browser is updated to the New URL which is retrieved
  • Step 6: The Page is cached for future calls. The cache is same as the URL
  • Step 7: The .spa_main is replaced with the new .spa_main . This destroys all the data of the previous page including data, models and events .
  • The js and css will remain as they are loaded at an app level
  • Step 8: The spa_main is unhidden and faded from transparent to opaque
  • Step 9: spinner library is hidden. You can choose the spinner library. See get_spa_uri
  • Step 10: If there is Google Analytics a pageview is fired
  • Step 11: All the spa_activity within .spa_main are executed
  • Step 12: The Page is scrolled to the top. To overwrite See get_spa_uri

When a page is retrieved from history – previous and next button

  • Step 1: spinner library is shown. You can choose the spinner library. See get_spa_uri
  • Step 2: If the uri is already available in cache then the cache value is retrieved
  • Step 3: Not in cache: No data is sent to the server
  • Step 4: Not in Cache: Post Request to the server. See get_spa_uri on the uri which is requested
  • Step 5: The URL of the browser is Not repeat Not updated since it is History
  • Step 6: The Page is cached for future calls. The cache is same as the URL
  • Step 7: The .spa_main is replaced with the new .spa_main . This destroys all the data of the previous page including data, models and events .
  • The js and css will remain as they are loaded at an app level
  • Step 8: The spa_main is unhidden and faded from transparent to opaque
  • Step 9: spinner library is hidden. You can choose the spinner library. See get_spa_uri
  • Step 10: If there is Google Analytics a pageview is fired
  • Step 11: All the spa_activity within .spa_main are executed
  • Step 12: The Page is scrolled to the top. To overwrite See get_spa_uri

Execution Steps for one spa_activity

These are the Execution steps for any spa_activity. With fancybox as example.

 

  • Step 1: If any libraries are mention will load the libraries. lib=’a,b,c’
  • Step 2: If set_defaults=true then will fire the set_defaults command of all the dependency libraries
  • Step 3: Will look for the spa_activity command eg fancybox:close and load the library. Will load fancybox.
  • Step 4: If set_defaults=true then will fire the set_defaults command of fancybox
  • Step 5: Will fire the command mentioned. Will fire fancybox.close() . If you just want to load then say fancybox:load .  If you just want to set defaults say fancybox:set_defaults, There is only one exception

This command adds a Step 6 at the end

  • Step 6: Fire the JavaScript command mentioned after all the relevant libraries are loaded

 

Leave a Reply

Your email address will not be published. Required fields are marked *