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.
setThickness number between 1 and 40 Change the thickness of the pencil.
setColor the color's name or #RRGGBB notation Change color and switch from eraser to pencil.
setEraserThickness number between 1 and 40 Change the thickness of the eraser.
setEraserOn --- Turns on the eraser mode.

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

Demo presentation

Demo presentation contains examples on how to use the Drawing addon.