Skip to content

@fabwcie/free-drawing / components/toolbar/widgets/Pan/Pan / PanWidget

Class: PanWidget ​

Defined in: packages/free-drawing/src/components/toolbar/widgets/Pan/Pan.ts:9

Pan tool: drag moves the view (stage draggable while active), grabbing cursor meanwhile

Extends ​

Constructors ​

Constructor ​

new PanWidget(drawer): PanWidget

Defined in: packages/free-drawing/src/components/toolbar/widgets/Pan/Pan.ts:18

Create the pan tool, shortcut H

Parameters ​

drawer ​

Drawer

Drawer of this widget

Returns ​

PanWidget

Overrides ​

BaseWidget.constructor

Properties ​

$button ​

$button: HTMLButtonElement

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:38

Button activating the widget, pressed while it is active, named by the title of the tool

Inherited from ​

BaseWidget.$button


$container ​

protected readonly $container: HTMLElement

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:32

Container of the button in toolbar (or menu of its group), with a class from widget id

Inherited from ​

BaseWidget.$container


cursor ​

protected cursor: string = grabCursor

Defined in: packages/free-drawing/src/components/toolbar/widgets/Pan/Pan.ts:12

Stage cursor while widget is active

Overrides ​

BaseWidget.cursor


drawer ​

protected drawer: Drawer

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:64

Drawer of this widget

Inherited from ​

BaseWidget.drawer


hasMoved ​

hasMoved: boolean = false

Defined in: packages/free-drawing/src/components/toolbar/widgets/Pan/Pan.ts:11

View moved since pointer down: a change is fired on pointer up (view saved)


id ​

id: "pan" | "selection" | "brush" | "eraser" | "undo" | "redo" | "text" | "rect" | "circle" | "ellipse" | "square" | "arrow" | "line" | "star" | "triangle" | "polygon" | "diamond" | "heart" | "cloud" | "highlighter" | "laser" | "frame"

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:40

Id of the tool, key of the widget in toolbar (drawer.getWidget(id)) and namespace of its stage events

Inherited from ​

BaseWidget.id


inAction ​

inAction: boolean = false

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:48

Pointer action in progress (drawing, erasing, selecting...), see startAction / endAction

Inherited from ​

BaseWidget.inAction


options ​

readonly options: WidgetOptions

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:46

Widget options given with drawer widgets option

Inherited from ​

BaseWidget.options


overlay? ​

optional overlay?: ToolOverlay

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:44

Options of the tool (color, width...), shown while widget is active (see showOverlayOnActive)

Inherited from ​

BaseWidget.overlay


shortcut ​

shortcut: string | undefined

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:42

Key activating the tool, lower case (shortcut widget option, else default of the widget), none if undefined

Inherited from ​

BaseWidget.shortcut


showOverlayOnActive ​

protected showOverlayOnActive: boolean = true

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:50

Show overlay while widget is active (false when overlay depends on something else, e.g. selection)

Inherited from ​

BaseWidget.showOverlayOnActive

Accessors ​

isDisabled ​

Get Signature ​

get isDisabled(): boolean

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:137

Widget can not be activated (see setDisabled)

Returns ​

boolean

Inherited from ​

BaseWidget.isDisabled


isGrabbing ​

Get Signature ​

get isGrabbing(): boolean

Defined in: packages/free-drawing/src/components/toolbar/widgets/Pan/Pan.ts:26

View being dragged (pointer action in progress)

Deprecated ​

use inAction

Returns ​

boolean

Methods ​

addTo() ​

addTo(parent): void

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:97

Internal

Adds the button of this widget (icon, shortcut letter) in its container, at the end of parent

Parameters ​

parent ​

HTMLElement

Element receiving the button container: toolbar root or menu of a group

Returns ​

void

Inherited from ​

BaseWidget.addTo


afterDraw() ​

protected afterDraw(): void

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:226

Shape drawn with this tool: selection tool activated, nothing selected, unless tool is kept (keepTool preference)

Returns ​

void

Inherited from ​

BaseWidget.afterDraw


clearSelection() ​

clearSelection(): void

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:219

Unselect shapes, with selection widget (implemented by it)

Returns ​

void

Inherited from ​

BaseWidget.clearSelection


endAction() ​

protected endAction(): void

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:202

Pointer action ends (pointer up)

Returns ​

void

Inherited from ​

BaseWidget.endAction


initEvents() ​

protected initEvents(): void

Defined in: packages/free-drawing/src/components/toolbar/widgets/Pan/Pan.ts:33

Grabbing cursor while pointer is down, change fired on pointer up when the view moved (view saved)

Returns ​

void

Overrides ​

BaseWidget.initEvents


onActive() ​

protected onActive(): void

Defined in: packages/free-drawing/src/components/toolbar/widgets/Pan/Pan.ts:59

Stage draggable: a drag moves the view

Returns ​

void

Overrides ​

BaseWidget.onActive


onConstrainChange()? ​

protected optional onConstrainChange(constrain): void

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:182

Shift pressed or released during a pointer action (square, circle, straight line...), without pointer move

Parameters ​

constrain ​

boolean

Shift pressed

Returns ​

void

Inherited from ​

BaseWidget.onConstrainChange


onDesactive() ​

protected onDesactive(): void

Defined in: packages/free-drawing/src/components/toolbar/widgets/Pan/Pan.ts:66

Stage no longer draggable

Returns ​

void

Overrides ​

BaseWidget.onDesactive


onStage() ​

protected onStage(events, handler): void

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:147

Listen stage events while widget is active. Events are namespaced with widget id, so they are removed on deactivation without removing other listeners.

Parameters ​

events ​

string

Space separated event names

handler ​

KonvaEventListener<Stage, any>

Konva listener called with the stage event

Returns ​

void

Inherited from ​

BaseWidget.onStage


removeEvents() ​

protected removeEvents(): void

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:164

Remove widget events, called on deactivation

Returns ​

void

Inherited from ​

BaseWidget.removeEvents


setActive() ​

setActive(active): void

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:259

Activate widget (nothing if disabled): previous widget deactivated, button pressed, then initEvents, updateCursor, overlay shown (if showOverlayOnActive), onActive and drawer focused. Deactivate it: pointer action ended, removeEvents, overlay hidden, onDesactive, button released.

Parameters ​

active ​

boolean

Activate (true) or deactivate (false) widget

Returns ​

void

Inherited from ​

BaseWidget.setActive


setDisabled() ​

setDisabled(disabled): void

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:124

Disable or enable widget: a disabled widget can not be activated and its button is disabled (also its group when all its widgets are). Drawing tools are disabled in read only.

Parameters ​

disabled ​

boolean

Disable widget

Returns ​

void

Inherited from ​

BaseWidget.setDisabled


shareLive() ​

protected shareLive(...shapes): void

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:212

Shapes being drawn shown to collaborators while drawing (final state is sent on change)

Parameters ​

shapes ​

...DrawingShape[]

Shapes in their current state, sent as a live change of the collaboration session

Returns ​

void

Inherited from ​

BaseWidget.shareLive


startAction() ​

protected startAction(): void

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:194

Pointer action starts (pointer down): shortcuts are disabled and UI (toolbar, overlays...) ignores pointer

Returns ​

void

Inherited from ​

BaseWidget.startAction


toggleDisable() ​

toggleDisable(): void

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:115

Disable / enable widget, a disabled widget can not be activated

Returns ​

void

Inherited from ​

BaseWidget.toggleDisable


updateCursor() ​

updateCursor(): void

Defined in: packages/free-drawing/src/components/toolbar/widgets/BaseWidget.ts:187

Set stage cursor to the cursor of widget: on activation, and to restore it after a temporary one (pan grabbing)

Returns ​

void

Inherited from ​

BaseWidget.updateCursor