pencil.js / mouse-event / MouseEvent

Class: MouseEvent<T>

Defined in: mouse-event.ts:69

Mouse (or any pointer, touch included) event class

Extends

• BaseEvent<T>

Type Parameters

Type Parameter	Default type
T	unknown

Constructors

Constructor

new MouseEvent<T>(
   name, 
   target, 
   positionDefinition?, 
   event?
): MouseEvent<T>;

Defined in: mouse-event.ts:83

MouseEvent constructor

Parameters

Parameter	Type	Description
name	string	Name of the event
target	T	Component concerned by the event
positionDefinition?	PositionDefinition	Position of the mouse when event trigger
event?	Event	Original HTML event

Returns

MouseEvent<T>

Overrides

BaseEvent.constructor

Properties

Property	Type	Description	Inherited from	Defined in
bubble	boolean	Should the event continue to bubble up to parents	BaseEvent.bubble	base-event.ts:15
button	string | null	Pressed button ("0" for the main button)	-	mouse-event.ts:74
event?	Event	Original DOM event (if any)	BaseEvent.event	base-event.ts:12
name	string	Name of the event	BaseEvent.name	base-event.ts:6
position	Position	Position of the pointer when the event trigger	-	mouse-event.ts:71
target	T	Component concerned by the event	BaseEvent.target	base-event.ts:9

Accessors

buttons

Get Signature

get static buttons(): object;

Defined in: mouse-event.ts:99

Set of buttons on a pointing device for easy access

Example

scene.on(`${MouseEvent.events.down}.${MouseEvent.buttons.middle}`, () => {
    console.log("User pressed the middle mouse button");
});

Returns

aux1

readonly aux1: "3" = "3";

First auxiliary button, usually the browse backward button

aux2

readonly aux2: "4" = "4";

Second auxiliary button, usually the browse forward button

backward

readonly backward: "3" = "3";

Browse backward button

forward

readonly forward: "4" = "4";

Browse forward button

left

readonly left: "0" = "0";

Left button on a classic right-handed mouse

main

readonly main: "0" = "0";

Main button

middle

readonly middle: "1" = "1";

Middle button, usually the scroll wheel

right

readonly right: "2" = "2";

Right button on a classic right-handed mouse

secondary

readonly secondary: "2" = "2";

Secondary button

wheel

readonly wheel: "1" = "1";

The scroll wheel

---

events

Get Signature

get static events(): object;

Defined in: mouse-event.ts:106

Set of events for easy access

Returns

click

readonly click: "click" = "click";

Pointer button is pressed then released without moving

contextMenu

readonly contextMenu: "contextmenu" = "contextmenu";

Context menu is requested (usually right click)

doubleClick

readonly doubleClick: "dblclick" = "dblclick";

Pointer is clicked twice rapidly

down

readonly down: "mousedown" = "mousedown";

Pointer button is pressed

drag

readonly drag: "drag" = "drag";

Pointer is moved while grabbing a component

drop

readonly drop: "drop" = "drop";

Pointer is release after dragging a component

grab

readonly grab: "grab" = "grab";

Pointer is pressed on a draggable component

hover

readonly hover: "hover" = "hover";

Pointer goes hover a component

leave

readonly leave: "leave" = "leave";

Pointer leave a component

move

readonly move: "mousemove" = "mousemove";

Pointer is moved

resize

readonly resize: "resize" = "resize";

Pointer is moved while holding the handle of a resizable component

rotate

readonly rotate: "rotate" = "rotate";

Pointer is rotating a component

scrollDown

readonly scrollDown: "scrolldown" = "scrolldown";

Mouse wheel is scrolled down

scrollUp

readonly scrollUp: "scrollup" = "scrollup";

Mouse wheel is scrolled up

up

readonly up: "mouseup" = "mouseup";

Pointer button is released

wheel

readonly wheel: "mousewheel" = "mousewheel";

Mouse wheel is scrolled in any direction

zoomIn

readonly zoomIn: "zoomin" = "zoomin";

Mouse wheel is scrolled up (toward the screen)

zoomOut

readonly zoomOut: "zoomout" = "zoomout";

Mouse wheel is scrolled down (away from the screen)

Methods

getModifier()

getModifier(): string | null;

Defined in: mouse-event.ts:89

Get the event modifier (should be overridden by child classes)

Returns

string | null

Overrides

BaseEvent.getModifier

---

prevent()

prevent(): this;

Defined in: base-event.ts:50

Prevent the initial event default behavior

Returns

this

Itself

Inherited from

BaseEvent.prevent

---

stop()

stop(): this;

Defined in: base-event.ts:34

Mark this event as stopped (won't bubble further)

Returns

this

Itself

Inherited from

BaseEvent.stop