Tool

The Tool object refers to a script that the user can interact with by using the mouse and keyboard and can be accessed through the global tool variable. All its properties are also available in the paper scope.

The global tool variable only exists in scripts that contain mouse handler functions (onMouseMove, onMouseDown, onMouseDrag, onMouseUp) or a keyboard handler function (onKeyDown, onKeyUp).

Example

var path;

// Only execute onMouseDrag when the mouse
// has moved at least 10 points:
tool.distanceThreshold = 10;

function onMouseDown(event) {
	// Create a new path every time the mouse is clicked
	path = new Path();
	path.add(event.point);
	path.strokeColor = 'black';
}

function onMouseDrag(event) {
	// Add a point to the path every time the mouse is dragged
	path.add(event.point);
}

Properties

eventInterval

minDistance

maxDistance

fixedDistance

Mouse Event Handlers

onMouseDown

The function to be called when the mouse button is pushed down. The function receives a ToolEvent object which contains information about the mouse event.

Type:

Function

Example — Creating circle shaped paths where the user presses the mouse button:

Run

onMouseDrag

The function to be called when the mouse position changes while the mouse is being dragged. The function receives a ToolEvent object which contains information about the mouse event.

This function can also be called periodically while the mouse doesn't move by setting the eventInterval

Type:

Function

Example — Draw a line by adding a segment to a path on every mouse drag event:

Run

onMouseMove

onMouseUp

Keyboard Event Handlers

onKeyDown

The function to be called when the user presses a key on the keyboard.

The function receives a KeyEvent object which contains information about the keyboard event.

If the function returns false, the keyboard event will be prevented from bubbling up. This can be used for example to stop the window from scrolling, when you need the user to interact with arrow keys.

Type:

Function

Example — Scaling a path whenever the user presses the space bar:

Run

onKeyUp

The function to be called when the user releases a key on the keyboard.

The function receives a KeyEvent object which contains information about the keyboard event.

Type:

Function

Example

function onKeyUp(event) {
	if(event.key == 'space') {
		console.log('The spacebar was released!');
	}
}

Tool

Properties

Mouse Event Handlers

Keyboard Event Handlers

Methods