Class Draggable

A UI utility to make an element draggable.

Index

Constructors

Properties

app element handle handlers position resizable

Accessors

Methods

activateListeners _activateDragListeners _activateResizeListeners _onDragMouseDown _onDragMouseMove _onDragMouseUp _onResizeMouseDown _onResizeMouseMove _onResizeMouseUp

Constructors

constructor

new Draggable(
    app:
        | Application
        | ApplicationV2<ApplicationConfiguration, ApplicationRenderOptions>,
    element: any,
    handle: false | HTMLElement,
    resizable: boolean | DraggableResizeOptions,
): Draggable
Parameters
- app: Application | ApplicationV2<ApplicationConfiguration, ApplicationRenderOptions>
  The Application that is being made draggable.
- element: any
  The Application's outer-most element.
- handle: false | HTMLElement
  The element that acts as a drag handle. Supply false to disable dragging.
- resizable: boolean | DraggableResizeOptions
  Is the application resizable? Supply an object to configure resizing behavior or true to have it automatically configured.
Returns Draggable

Properties

app

app:
| Application
| ApplicationV2<ApplicationConfiguration, ApplicationRenderOptions>

The Application being made draggable.

element

element: HTMLElement

The Application's outer-most element.

handle

handle: false | HTMLElement

The drag handle, or false to disable dragging.

handlers

handlers: Record<string, Function> = {}

Registered event handlers.

position

position: object = null

The Application's starting position, pre-drag.

resizable

resizable: boolean | DraggableResizeOptions

Resize configuration.

Accessors

`Static`implementation

get implementation(): typeof Draggable
Retrieve the configured Draggable implementation.

Returns typeof Draggable

Methods

activateListeners

activateListeners(): void
Activate event handling for a Draggable application Attach handlers for floating, dragging, and resizing

Returns void

`Protected`_activateDragListeners

_activateDragListeners(): void
Protected
Attach handlers for dragging and floating.

Returns void

`Protected`_activateResizeListeners

_activateResizeListeners(): void
Protected
Attach handlers for resizing.

Returns void

`Protected`_onDragMouseDown

_onDragMouseDown(event: PointerEvent): void
Protected
Handle the initial mouse click which activates dragging behavior for the application
Parameters
- event: PointerEvent
Returns void

`Protected`_onDragMouseMove

_onDragMouseMove(event: PointerEvent): void
Protected
Move the window with the mouse, bounding the movement to ensure the window stays within bounds of the viewport
Parameters
- event: PointerEvent
Returns void

`Protected`_onDragMouseUp

_onDragMouseUp(event: PointerEvent): void
Protected
Conclude the dragging behavior when the mouse is release, setting the final position and removing listeners
Parameters
- event: PointerEvent
Returns void

`Protected`_onResizeMouseDown

_onResizeMouseDown(event: PointerEvent): void
Protected
Handle the initial mouse click which activates dragging behavior for the application
Parameters
- event: PointerEvent
Returns void

`Protected`_onResizeMouseMove

_onResizeMouseMove(event: PointerEvent): void
Protected
Move the window with the mouse, bounding the movement to ensure the window stays within bounds of the viewport
Parameters
- event: PointerEvent
Returns void

`Protected`_onResizeMouseUp

_onResizeMouseUp(event: PointerEvent): void
Protected
Conclude the dragging behavior when the mouse is release, setting the final position and removing listeners
Parameters
- event: PointerEvent
Returns void