Public: Concord Software Projects : Notes on startup sequence of WISE4-embedded svg-edit
This page last changed on Mar 02, 2010 by rklancer.
in svg-editor.html, the window.onload event handler fires a 'pageRenderComplete' event (passing in its node ID, which is a string like 'node 3.sd', using the nodeId variable which is presumably global within the iframe)
the Node.prototype.pageRenderComplete handler calls the loadContent() method of the 'content panel' (i.e., svg-editor.html) with the node object as an argument
svg-editor.html's loadContent() method calls the scriptloader's loadScripts method
The scriptloader loads the script and css files required by 'svgdraw' (the dependencies are hard-coded into an array contained in the scriptloader.js file)
(the one script required is all.js)
When the last line of all.js (line 788) executes, it causes a scriptLoaded event to fire:
the scriptLoaded listener, once all dependencies are loaded, fires the 'scriptsLoaded' event
It appears that there are many listeners to the scriptsLoaded event. For example each 'node' (item in the left-hand menu, like 'Step 2: mySystem' or 'Step 3: Draw Step 2' in the wise4 test site) appears to register as a listener with Node.prototype.loadContentAfterScriptsLoaded() as the callback.
In this case, the Node.prototype.loadContentAfterScriptsLoaded() callback is called.
The Node.prototype.loadContentAfterScriptsLoaded() callback calls the loadContentAfterScriptsLoaded() function in the 'content panel', i.e. (in this case) the loadContentAfterScriptsLoaded() function of svg-editor.html
The SVGDRAW constructor is called (the new SVGDRAW object is made available as a global called 'svgdraw')
The last step of the SVGDRAW constructor calls the init() method of the svgdraw object with the 'ContentUrl' of the svgdraw 'node' as the argument. I believe the content url contains json data for the node (ie., the particular svgdraw 'node' in the VLE that is starting up)
The init function calls svg_edit_setup() which creates the svgcanvas object (in vanilla svg-edit-2.4rc1, this step is done at document.ready without any of the above steps)
The init function then calls SVGDRAW.prototype.loadModules which gets the JSON data from the 'content url' and sets the stamp, snapshot, description, instruction, and default image state.
It then sets the 'dataService' property of the SVGDRAW object to a new VleDS object
(VleDS is defined in all.js, which takes the definition from svg-editor.js)
The load() method of the SVGDRAW object is called, which calls the load() methods of the dataService object. The SVGDRAW object's loadCallback is passed as the callback.
The VleDS load() method sets its 'data' property to the data returned by the VLE's getLatestStateForCurrentNode() method
The SVGDRAW object's loadCallback method is called with the argument 'studentWorkJSON' set to the data returned by the VleDS. This is apparently the step that actually loads the student's prior work into the SVG canvas...
SVGDRAW's initDisplay() method is called to "populate instructions, stamp images, description/annotation text, and snapshots" in the actual display)
to see the 'stamp tool' in action, click "Step 1: Draw Step 1" on the wise4 beta test site project. This tool doesn't seem to be active for the other steps.
|Document generated by Confluence on Jan 27, 2014 16:52|