Page History
...
For the Framework to be able to properly load our new plug-in module, we must declare which files comprise the new module. This is accomplished by creating a JSON-based configuration file within the module's root directory. For our example that would be
/js-i2b2/cells/plugins/examples/ExampHello/cell_config_data.js
The file would have the following structure:
// This file contains a list of all files that need to be loaded dynamically |
...
The first step in the development of any plug-in module is the creation of a user interface. The i2b2 web framework eliminates the complexity of transforming simple HTML screens into an AJAX-based application.
To start, an HTML file must be created and put into the plug-in module's asset directory (/js-i2b2/cells/plugins/examples/ExampHello/assets). For our "Hello World" we will create a file called injected_screens.html and fill it with the following HTML:
<html> |
The text which emphasis added is what we want to display in the plug-in viewer's display window when the plug-in is selected and loaded.
The next step is to configure the plug-in (via the cell_config_data.js file) with the correct HTML file and ID for the HTML Element that contains the initial UI display.
plugin: { |
...
Creating Constructor & Destructor Functions
Tip | ||
---|---|---|
| ||
Although it is not absolutely necessary, it is good practice to create constructor and destructor functions for your plug-in. |
The plug-in constructor function is called after the Plugin Viewer has loaded the requested plug-in's initial HTML into the main DOM tree. When the constructor is called it is passed a reference to the DOM node that contains the plug-in's HTML.
If your plug-in contains a destructor function, it is called by the Plugin Viewer before it removes the plug-in's GUI from the main DOM tree.
Info | ||
---|---|---|
| ||
If your destructor function does not return true then the unload process is canceled. |
i2b2.ExampHello.Init = function(loadedDiv) { |
...
i2b2.ExampHello.Unload = function() { |
...