-`js/main.js` creates the different views and binds them to the model.
Another option is to directly define a function named `main()`, as in `small_example.html`.
### JSON .vidjil data
Clone lists can be passed to the model through several ways:
- directly by the user (import/export)
- from a patient database (needs a database)
- trough the API (see below)
- or by directly providing data through Javascript (as in `small_example.html`)
The first three solutions need some further elements from the full `index.html`.
## Notifications
### Priority
\#<spanid="browser:priority"></span>
The priority determines how the notification are shown and what action the
user should do. The priorities can be between 0 and 3.
- 0
The notification is not shown
- 1
The notification is shown (usually on green background) and
automatically disappears
- 2
The notification is shown (usually on yellow background) and
automatically disappears
- 3
The notification is shown (usually on red background) and doesn't
disappear until the user clicks on it.
In the `console.log`, the field `priority` takes one of those priorities.
## Plots
### How to add something to be plotted
You want to add a dimension in the scatterplot or as a color? Read the
following.
1. Scatterplot
In [scatterPlot.js](../browser/js/scatterPlot.js), the `available_axis` object defines the dimensions that
can be displayed. It suffices to add an entry so that it will be proposed
in the X and Y axis. This kind of way of doing should be generalized to
the other components.
The presets are defined in the `preset` object.
2. Color
Adding a color needs slightly more work than adding a dimension in the
scatterplot.
The function `updateColor` in file [clone.js](../browser/js/clone.js) must be modified to add our color method.
The variable `this.color` must contain a color (either in HTML or RGB, or…).
Then a legend must be displayed to understand what the color represents.
For this sake, modify the `build_info_color` method in [info.js](../browser/js/info.js) file. By
default four spans are defined (that can be used) to display the legend:
`span0`, …, `span3`.
Finally modify the [index.html](../browser/index.html) file to add the new color method in the
select box (which is under the `color_menu` ID).
## Classes
### Clone
1. Info box
In the info box all the fields starting with a \_ are put. Also all the
fields under the `seg` field are displayed as soon as they have a `start` and
`stop`. Some of them can be explicitly not displayed by filling the
`exclude_seg_info` array in `getHtmlInfo`.
## Tests
### Code Quality
Quality of code is checked using [JSHint](http://jshint.com/), by
running `make quality` from the `browser` directory.
Install with `npm install -g jshint`
### Unit
The unit tests in the client are managed by QUnit and launched using
[nightmare](http://www.nightmarejs.org/), by launching `make unit` from the `browser/test` directory.
The tests are organised in the directory
[browser/test/QUnit/testFiles](../browser/test/QUnit/testFiles). The file [data<sub>test</sub>.js](../browser/test/QUnit/testFiles/data_test.js) contains a toy
dataset that is used in the tests.
Unit tests can be launched using a real client (instead of nightmare). It
suffices to open the file [test<sub>Qunit</sub>.html](../browser/test/QUnit/test_Qunit.html). In this HTML webpage it is
possible to see the coverage. It is important that all possible functions
are covered by unit tests. Having the coverage displayed under Firefox
needs to display the webpage using a web server for security
reasons. Under Chromium/Chrome this should work fine by just opening the
webpage.
1. Installation
Nightmare is distributed withing `node` and can therefore be installed with it.
``` bash
apt-get install nodejs-legacy npm
npm install nightmare -g# make -C browser/test unit will automatically
link to global nightmare installation
```
Note that using `nightmare` for our unit testing
requires the installation of `xvfb`.
2. Debugging
If there is a problem with the nightmare or electron (nightmare
dependency), you may encounter a lack of output or error messages.
