import Scrollable from '@shopify/draggable/src/Draggable/Plugins/Scrollable/Scrollable.js'

public class | source

Scrollable

Extends:

* → Scrollable

Scrollable plugin which scrolls the closest scrollable parent

Constructor Summary

Public Constructor
public	constructor(draggable: Draggable) Scrollable constructor.

Member Summary

Public Members
public	currentMousePosition: Object \| null Keeps current mouse position
public	findScrollableElementFrame: Number \| null Animation frame looking for the closest scrollable element
public	options: Object Scrollable options
public	scrollAnimationFrame: Number \| null Scroll animation frame
public	scrollableElement: HTMLElement \| null Closest scrollable element

Method Summary

Public Methods
public	attach() Attaches plugins event listeners
public	detach() Detaches plugins event listeners
public	getOptions(): Object Returns options passed through draggable
public	getScrollableElement(target: HTMLElement): HTMLElement Returns closest scrollable elements by element
public	hasDefinedScrollableElements(target: HTMLElement): Boolean Returns true if at least one scrollable element have been defined via options

Private Methods
private	[onDragMove](dragEvent: DragMoveEvent) Drag move handler.
private	[onDragStart](dragEvent: DragStartEvent) Drag start handler.
private	[onDragStop]() Drag stop handler.
private	[scroll]() Scroll function that does the heavylifting

Public Constructors

public constructor(draggable: Draggable) source

Scrollable constructor.

Params:

Name	Type	Attribute	Description
draggable	Draggable		Draggable instance

Public Members

public currentMousePosition: Object | null source

Keeps current mouse position

Properties:

Name	Type	Attribute	Description
currentMousePosition	Object
currentMousePosition.clientX	Number
currentMousePosition.clientY	Number

public findScrollableElementFrame: Number | null source

Animation frame looking for the closest scrollable element

Properties:

Name	Type	Attribute	Description
findScrollableElementFrame	*

public options: Object source

Scrollable options

Properties:

Name	Type	Attribute	Description
options	Object
options.speed	Number
options.sensitivity	Number
options.scrollableElements	HTMLElement[]

public scrollAnimationFrame: Number | null source

Scroll animation frame

Properties:

Name	Type	Attribute	Description
scrollAnimationFrame	*

public scrollableElement: HTMLElement | null source

Closest scrollable element

Properties:

Name	Type	Attribute	Description
scrollableElement	*

Public Methods

public attach() source

Attaches plugins event listeners

public detach() source

Detaches plugins event listeners

public getOptions(): Object source

Returns options passed through draggable

Return:

Object

public getScrollableElement(target: HTMLElement): HTMLElement source

Returns closest scrollable elements by element

Params:

Name	Type	Attribute	Description
target	HTMLElement

Return:

HTMLElement

public hasDefinedScrollableElements(target: HTMLElement): Boolean source

Returns true if at least one scrollable element have been defined via options

Params:

Name	Type	Attribute	Description
target	HTMLElement

Return:

Boolean

Private Methods

private [onDragMove](dragEvent: DragMoveEvent) source

Drag move handler. Remembers mouse position and initiates scrolling

Params:

Name	Type	Attribute	Description
dragEvent	DragMoveEvent

private [onDragStart](dragEvent: DragStartEvent) source

Drag start handler. Finds closest scrollable parent in separate frame

Params:

Name	Type	Attribute	Description
dragEvent	DragStartEvent

private [onDragStop]() source

Drag stop handler. Cancels scroll animations and resets state

private [scroll]() source

Scroll function that does the heavylifting