Hi all,
*Introduction*
The purpose of this feature is to provide a framework to generate gadgets
where you can plug datasource providers and chart templates.
For an example, you will be able to plug your RDBMS datasource, rest api ,
csv file , real time datsources etc as pluggable providers.
*Flow*
Select datasource provider (stage 1) --> Configure datasource parameters
(stage 2) --> Configure chart parameters (stage 3) --> Preview gadget
(stage 4) --> Generate gadget (stage 5)
*Proposed Architecuture*
Provider developers can plug their providers to DS by adding their
respective provider into the designer.json
*{*
* ............*
* "gadgetGeneration" :{*
* "isCreateGadgetEnable": false,*
* "providers": ["batch", "rdbms", "rest", "rt"]*
* },*
* ................*
*}*
Provider implementation should be placed under /portal/extensions/providers
and should mainly contain 2 files.
- config.json - contains the expected configuration in the "Configure
datasource parameters" stage 2
*example config*
* {*
* "id":"rdbms",*
* "name" : "Relational Database Source",*
* "image" : "",*
* "config" : [*
* {*
* "fieldLabel" : "Database URL",*
* "fieldName" :"db_url",*
* "fieldType" : "text",*
* "defaultValue" : "",*
* "isRequired" : true*
* },*
* {*
* "fieldLabel" : "Username",*
* "fieldName" :"username",*
* "fieldType" : "text",*
* "defaultValue" : "",*
* "isRequired" : true*
* },*
* {*
* "fieldLabel" : "Password",*
* "fieldName" :"password",*
* "fieldType" : "password",*
* "defaultValue" : "",*
* "isRequired" : true*
* },*
* {*
* "fieldLabel" : " Database Driver",*
* "fieldName" :"driver",*
* "fieldType" : "dropDown",*
* "valueSet" : [ ],*
* "isRequired" : true*
* },*
* {*
* "fieldLabel" : " Check Box",*
* "fieldName" :"checkbox",*
* "fieldType" : "checkbox",*
* "isRequired" : true*
* },*
* {*
* "fieldType" : "advanced",*
* "partialName" : "myPartial"*
* }*
* ]*
*} *
The configuration UI will be dynamically generated for the data types
text-box, checkbox, password field and drop-down. And a provider can plug
his own UI blocks as partials when there are advanced fields.
- index.js - implements the provider api for
- validateData (providerConfig)
- To validate the inputs provided at the stage 2
- providerConfig will be key value pairs of provided field names
and values
- getSchema (providerConfig)
- Returns the list of column names and their data types of the
configured data provider
- getData (providerConfig,schemaPropertyList)
- schemaPropertyList will be list of column names selected at
stage 3
Similarly chart templates can also be plugged via configuring at
designer.json
Chart template mplementations also goes under
/portal/extensions/chart-templates and have 2 main files.
- config.json - contains the fields that needs to be populated at stage 3
*example config*
*{*
* "id":"lineChart",*
* "name" : "Line Chart",*
* "config": [*
* {*
* "fieldLabel": "X axis",*
* "fieldName": "x",*
* "fieldType": "String",*
* "fieldValue" : ["$COLUMN_NAMES"]*
* },*
* {*
* "fieldLabel": "Y axis",*
* "fieldName": "y",*
* "fieldType": "Int",*
* "fieldValue" : ["$COLUMN_NAMES"]*
* },*
* {*
* "fieldLabel": "Chart Colour",*
* "fieldName": "colour",*
* "fieldType": "String"*
* }*
* ]*
*}*
If the first element of field value is * ["$COLUMN_NAMES"] *,it will
populate the list of column names retrieved getSchema method of provider
api.
- index.js - implements the chart template api for
- draw (chartConfig, data)
- responsible for plotting the chart/gadget
- chartConfig will be key value pairs of chart configurations
provided at stage 3
- data will be the actual data retrieved by calling getData method
of provider api
Appreciate your input on the above approach.
Thanks,
Tanya
--
Tanya Madurapperuma
Senior Software Engineer,
WSO2 Inc. : wso2.com
Mobile : +94718184439
Blog : http://tanyamadurapperuma.blogspot.com
_______________________________________________
Architecture mailing list
[email protected]
https://mail.wso2.org/cgi-bin/mailman/listinfo/architecture
