Skip to content
UrsZeidler edited this page Oct 17, 2016 · 11 revisions

Generated JS Code

Start the code generation per launch configuration:

For each contract package Two files are generated a [package.name/]Web3.js and a [package.name/]-main.js

While the [package.name/]Web3.js contains only the abi for each contract in a variable [aClass.name/]Contract the [package.name/]-main.js file defines a lot of js objects for each contract.

  • function [aClass.name/]Model(contract) - A model element which simply wrapped the contract.
  • function [aClass.name/]GuiFactory() - Creates a gui for the contract, the 'create gui' functions returns always html text, the factory can be configured with a prefix with is then used in all element ids the factory creates.
    • this.placeDefaultGui=function(e) - Places the gui in the given element e, or document.getElementById(this.prefix+'[aClass.name/]_gui')
    • this.createDefaultGui=function() - creates the default gui
    • this.createAttributesGui=function() - create the attributes
    • for each public contract function a function this.create[op.functionName()/]Gui=function() - creates a gui for this function
    • for each struct a function this.create[p.name/]StructGui=function() - creates a gui for the struct element
  • function [aClass.name/]Controller() - A class to update the gui with the contract data, it uses the prefix to identify the elements and takes the values from these elements, it also provide an execute function for each contract function and a bind function to bind theses functions to elements-
    • this.bindGui=function() - Binds the wigets to onClick of the element
    • this.setAddress=function() - Set the address and the contract instance
    • this._updateAttributes=function ()- Update the attribute values of the gui
    • for each public contract method a function to get the values from the gui and a call to the contact function with these values is created
  • function [aClass.name/]Manager(prefix,contract) - For the contract the guifactory [aClass.name/]GuiFactory() as g and the Controller [aClass.name/]Controller() as c are used together. The prefix will be used by the gui factory and the controller.
    • this.addGui = function(e) - Add a gui for the contract at e or document.getElementById(this.prefix + 'GuiContainer')
    • this.clearGui = function(e) - Clears the element e or document.getElementById(this.prefix + 'GuiContainer')
    • this.createGui = function(guifactory) - Create the gui with the given guiFactory. This functions can be customized.
    • this.createSmallGui = function(guifactory) - Create a small gui with the given guifactory.
    • this.updateGui = function() - Update the attributes
    • this.getContract = function() - A simple getter for the contract instance.
    • this.watchEvents=function() - Will collect all events in an element with the id this.eventlogPrefix+'eventLog'.
  • function [aClass.name/]GuiMananger(guiId) - The GuiManager is capable of managing a set contracts. Each contract is managed by a [aClass.name/]Manager(prefix,contract) with the address as prefix. All calls like display guis are delegated to all Manager instances.
    • this.addManager = function(contract) - Add a contract to the guimanager.
    • this.clearGui = function(e) - Clears the element e or document.getElementById(this.prefix)
    • this.displayGui = function(e) - add to e or document.getElementById(this.prefix) for each contract the gui
    • this.updateGui = function() - update all attributes
  • function [aClass.name/]Deployment(guiId) - Here you can collect the steps to deploy the contracts by script.

And for the package a

  • function [aPackage.name.toUpperFirst()/]Page(prefix) - This contains the single page dapp. There arte customized code parts where you plug the Classes together,
    • this.placeDefaultGui=function() - Put the gui in the page.
    • this.createDefaultGui=function() - create the actual gui, this is an method you need to implement.

A simple html file is also written, including the [package.name/]-main.js and some basic elements.

testCode for the contracts

The generated test code is a file [package.name/]-test.jsand a [package.name/]-tests.html for each contract the test.js contains a simple wrapper([aClass.name]Model) and a Test[aClass.name] is generated. The Test[aClass.name] contains a test function for each public contract function.

The functions this.printTest and this.testAE can be used to log a test result in the gui.

The generated html will execute the allTests() function on each Test[aClass.name].

Clone this wiki locally