# Introduction

## What is widget-generator tool?
Widget generator tool generate customized widget tamplates based on user inputs. Users can modify the widget template and create new widgets which can be used across analytics dashboards.
Tool generates three types of widget templates which supports both RDBMS Data Provider and SiddhiStore Data Provider.

#### 1. Subscriber Widgets
#### 2. Publisher Widgets
#### 3. Stand-alone Widgets

> Note - By default widget generator will generate a subscriber widget using SiddhiStoreDataProvider

>In order to use the sample Subscriber widget generated by the tool, User must use the DateTimeRangePicker widget as the publisher widget.


# Quick Start Guide

## Setting up the generator
Navigate to the <ANALYTICS_HOME>/wso2/tools/generator-widget directory and run following command to initialize the widget generator.

      `$ npm run init`

`<ANALYTICS_HOME>/wso2/tools/generator-widget` directory will be hereafter referred as <TOOL_HOME>

## How to use the tool?

1. Open a terminal in the <TOOL_HOME> directory and Use following commands to create your preffered widget skeleton.
    -  Issue the following command To create a default widget (Subscriber widget using SIddhiStoreDataProvider).
      
       `$ npm run createwidget`

    - Issue the following command replacing the `argument1` and `argument2` as follows to create other widget types.
    
      `$npm run createwidget--widgettype:`argument1`--dataprovider:`argument2

    - "argument1" is reffered to the widget type, replace the "argument1" with `subscriber`, `publisher` or `stand-alone` type.

    - "argument2" is reffered to the data provider type, replace the "argument2" with `SiddhiDataProvider` or `RDBMSDataProvider` type.

    - For example following command will create a publisher widget template with RDBMS Data Provider.

      `$npm run createwidget--widgettype:publisher --dataprovider:RDBMSDataProvider`
2. Enter your widget name and widget heading to the terminal.

3. Based on the preferences, new widget skeleton will be created inside the `<TOOL_HOME>/widgetTemplates` directory and the relevent dependencies will be installed to the `<TOOL_HOME>/widgetTemplates/<WIDGET_ROOT>` directory.

4. Navigate to the `<WIDGET_ROOT>` directory and modify the file content to create your own widget.

5. Navigate to the `<WIDGET_ROOT>` directory and Issue the following command to build the widget.
      - `$npm run build`

6. Restart the analytics dashboard profile to load the newly created widget to the dashboard. 

7. Additionally, to start a development environment and create a symlink from `<WIDGET_ROOT>` directory to `<HOME>/wso2/...widgets`  directory, Open a terminal in the `<WIDGET_ROOT>` directory and issue following command.
      - `$npm run dev`