Documentation
Drawing
Description
Drawing addon allows users to draw images on the digital canvas. It is possible to define the line thickness and color in the editor.
Properties
The list starts with the common properties, learn more about them by visiting the Modules description section. The other available properties are described below.
| Property name | Description |
|---|---|
| Color | Color of pencil specified in '#RRGGBB' notation or by name e.g. 'pink' |
| Thickness | Width of pencil. Number between 1 and 40. |
| Border | Border size. Number between 0 (no border) and 5 (5px black border) |
| Opacity | Opacity for the whole addon. Number between 0 - 1 |
Supported commands
| Command name | Params | Description |
|---|---|---|
| hide | --- | Hide the addon. |
| show | --- | Show the addon. |
CSS classes
| Class name | Description |
|---|---|
| drawing | Main class containing the entire Addon's content. |
Advanced Connector integration
Each command supported by the Drawing addon can be used in the Advanced Connector addon's scripts. The below example shows how to change color (to green) and thickness (to 13) when the image source is selected and Text module's gap content changes.
EVENTSTART
Name:ItemSelected
Item:green
SCRIPTSTART
var drawing = presenter.playerController.getModule('Drawing1');
drawing.setColor('green');
SCRIPTEND
EVENTEND
EVENTSTART
Source:Text1
Item:1
Value:^medium$
SCRIPTSTART
var drawing = presenter.playerController.getModule('Drawing1');
drawing.setThickness(13);
SCRIPTEND
EVENTEND
To turn on eraser, you have to use function:
drawing.setEraserOn();
To set eraser's Thickness, use function:
drawing.setEraserThickness(10);
To turn off Eraser, just set pencil color e.g.:
drawing.setColor('pink');
Demo presentation
Demo presentation contains examples on how to use the Drawing addon.