Class ScrollView<StaticProps, ChangeableProps, CallbacksTypes>

Detect when elements enter or leave the viewport

Type Parameters

StaticProps extends NScrollView.IStaticProps = NScrollView.IStaticProps
ChangeableProps extends NScrollView.IChangeableProps = NScrollView.IChangeableProps
CallbacksTypes extends NScrollView.ICallbacksTypes = NScrollView.ICallbacksTypes

Hierarchy

Component<StaticProps, ChangeableProps, CallbacksTypes>
- ScrollView

Constructors

constructor

new ScrollView<StaticProps, ChangeableProps, CallbacksTypes>(initialProps?, canInit?): ScrollView<StaticProps, ChangeableProps, CallbacksTypes>
Type Parameters
- StaticProps extends NScrollView.IStaticProps = NScrollView.IStaticProps
- ChangeableProps extends NScrollView.IChangeableProps = NScrollView.IChangeableProps
- CallbacksTypes extends NScrollView.ICallbacksTypes = NScrollView.ICallbacksTypes
Parameters
- Optional initialProps: StaticProps & ChangeableProps
- canInit: boolean = true
Returns ScrollView<StaticProps, ChangeableProps, CallbacksTypes>
Overrides Component.constructor
- Defined in src/components/ScrollView/index.ts:61

Properties

`Protected` _elements

_elements: NScrollView.IElement[]

Elements

`Protected` `Optional` _intersectionObserverIn

_intersectionObserverIn?: IntersectionObserver

Intersection observer - type IN

`Protected` `Optional` _intersectionObserverOut

_intersectionObserverOut?: IntersectionObserver

Intersection observer - type OUT

`Protected` _isFirstStart

_isFirstStart: boolean

If first start

`Protected` _isIntersectionObserverSupported

_isIntersectionObserverSupported: boolean

If intersection observer is supported

Accessors

app

get app(): Application
Vevet Application

Returns Application
Inherited from ComponentClass.app
- Defined in src/base/Module/index.ts:68

callbacks

get callbacks(): Callbacks<CallbacksTypes>
Module Callbacks

Returns Callbacks<CallbacksTypes>
Inherited from ComponentClass.callbacks
- Defined in src/base/Module/index.ts:47

elements

get elements(): NScrollView.IElement[]
Elements

Returns NScrollView.IElement[]
- Defined in src/components/ScrollView/index.ts:57

isDestroyed

get isDestroyed(): boolean
The module is destroyed

Returns boolean
Inherited from ComponentClass.isDestroyed
- Defined in src/base/Module/index.ts:94

isFirstStart

get isFirstStart(): boolean
If first start

Returns boolean
- Defined in src/components/ScrollView/index.ts:46

isInitialized

get isInitialized(): boolean
The module is initialized

Returns boolean
Inherited from ComponentClass.isInitialized
- Defined in src/base/Module/index.ts:86

name

get name(): string
Module name

Returns string
Inherited from ComponentClass.name
- Defined in src/base/Module/index.ts:73

prefix

get prefix(): string
Module prefix

Returns string
Inherited from ComponentClass.prefix
- Defined in src/base/Module/index.ts:78

props

get props(): TRequiredModuleProp<StaticProps & ChangeableProps>
Current properties

Returns TRequiredModuleProp<StaticProps & ChangeableProps>
Inherited from ComponentClass.props
- Defined in src/base/Module/index.ts:34

`Protected` rootBounding

get rootBounding(): {
    height: number;
    left: number;
    top: number;
    width: number;
}
Root bounding rect

Returns {
    height: number;
    left: number;
    top: number;
    width: number;
}
- height: number
- left: number
- top: number
- width: number
- Defined in src/components/ScrollView/index.ts:107

Methods

`Protected` _destroy

_destroy(): void
Destroy the module

Returns void
Overrides Component._destroy
- Defined in src/components/ScrollView/index.ts:320

`Protected` _getDefaultProps

_getDefaultProps(): DeepRequired<StaticProps & ChangeableProps> & {
    classToToggle: string;
    direction: string;
    hasDelay: boolean;
    intersectionRoot: null;
    isEnabled: boolean;
    maxDelay: number;
    resizeDebounce: number;
    rootMargin: number;
    states: string;
    viewportTarget: string;
}
Get Default properties (should be extended)

Returns DeepRequired<StaticProps & ChangeableProps> & {
    classToToggle: string;
    direction: string;
    hasDelay: boolean;
    intersectionRoot: null;
    isEnabled: boolean;
    maxDelay: number;
    resizeDebounce: number;
    rootMargin: number;
    states: string;
    viewportTarget: string;
}
Overrides Component._getDefaultProps
- Defined in src/components/ScrollView/index.ts:20

`Protected` _getElementDelay

_getElementDelay(element): number
Get element delay
Parameters
- element: NScrollView.IElement
Returns number
- Defined in src/components/ScrollView/index.ts:210

`Protected` _handleInOut

_handleInOut(elementProp, isInViewport, delay?): void
Event that is triggered when an element appears or disappears
Parameters
- elementProp: NScrollView.IElement
- isInViewport: boolean
- delay: number = 0
Returns void
- Defined in src/components/ScrollView/index.ts:245

`Protected` _handleIntersectionIn

_handleIntersectionIn(data): void
Event on IntersectionObserver In
Parameters
- data: IntersectionObserverEntry[]
Returns void
- Defined in src/components/ScrollView/index.ts:186

`Protected` _handleIntersectionOut

_handleIntersectionOut(data): void
Event on IntersectionObserver Out
Parameters
- data: IntersectionObserverEntry[]
Returns void
- Defined in src/components/ScrollView/index.ts:231

`Protected` _init

_init(): void
Inner extra initialization

Returns void
Overrides Component._init
- Defined in src/components/ScrollView/index.ts:74

`Protected` _onPropsMutate

_onPropsMutate(): void
This method is called on properties change

Returns void
Overrides Component._onPropsMutate
- Defined in src/components/ScrollView/index.ts:80

`Protected` _removeViewEvents

_removeViewEvents(): void
Remove View events

Returns void
- Defined in src/components/ScrollView/index.ts:177

`Protected` _setEvents

_setEvents(): void
Set class events

Returns void
- Defined in src/components/ScrollView/index.ts:87

`Protected` _setViewEvents

_setViewEvents(): void
Set view events

Returns void
- Defined in src/components/ScrollView/index.ts:132

addCallback

addCallback<T>(target, action, settings?): IAddedCallback
Add a module callback
Type Parameters
- T extends string | number | symbol
Parameters
- target: T
- action: TAction<CallbacksTypes[T]>
- settings: ISettings = {}
Returns IAddedCallback
Inherited from Component.addCallback
- Defined in src/base/Module/index.ts:245

`Protected` addDestroyableAction

addDestroyableAction(action): void
Add destroyable actions
Parameters
- action: (() => void)
  - - (): void
    - Returns void
Returns void
Inherited from Component.addDestroyableAction
- Defined in src/base/Module/index.ts:224

addElement

addElement(elementProp): IRemovable
Add an element
Parameters
- elementProp: Element
Returns IRemovable
- Defined in src/components/ScrollView/index.ts:283

addEventListener

addEventListener<El, Target, Callback>(el, target, callback, options?): IAddEventListener
Add a DOM event listener
Type Parameters
- El extends ListenerElement
- Target extends keyof HTMLElementEventMap
- Callback extends ((evt) => void)
Parameters
- el: El
- target: Target
- callback: Callback
- Optional options: IAddEventListenerOptions
Returns IAddEventListener
Inherited from Component.addEventListener
- Defined in src/base/Module/index.ts:254

addPlugin

addPlugin<T>(plugin): void
Add a single plugin
Type Parameters
- T extends Plugin<any, any, any, any>
Parameters
- plugin: T
Returns void
Inherited from Component.addPlugin
- Defined in src/base/Component/index.ts:21

addResponsiveProps

addResponsiveProps(rules): void
Add responsive rules
Parameters
- rules: IResponsive<ChangeableProps>
Returns void
Inherited from Component.addResponsiveProps
- Defined in src/base/Module/index.ts:173

addViewportCallback

addViewportCallback(target, action, data?): void
Add a viewport callback that will be removed on class destroy
Parameters
- target: keyof NViewport.ICallbacksTypes
- action: ((arg) => void)
  - - (arg): void
    - Parameters
      
      arg: IChanges
      
      Returns void
- data: undefined | ISettings = {}
Returns void
Inherited from Component.addViewportCallback
- Defined in src/base/Module/index.ts:231

changeProps

changeProps(props): void
Change module properties
Parameters
- props: Partial<ChangeableProps>
Returns void
Inherited from Component.changeProps
- Defined in src/base/Module/index.ts:184

`Protected` className

className(...classNames): string
Parameters
- Rest ...classNames: string[]
Returns string
Inherited from Component.className
- Defined in src/base/Module/index.ts:279

destroy

destroy(): void
Destroy the module

Returns void
Inherited from Component.destroy
- Defined in src/base/Module/index.ts:299

init

init(): void
Initializes the class

Returns void
Inherited from Component.init
- Defined in src/base/Module/index.ts:202

removeElement

removeElement(elementProp): void
Remove an element
Parameters
- elementProp: Element
Returns void
- Defined in src/components/ScrollView/index.ts:303

removeElements

removeElements(): void
Remove all elements

Returns void
- Defined in src/components/ScrollView/index.ts:314

resize

resize(): void
Resize the scene

Returns void
- Defined in src/components/ScrollView/index.ts:98

`Protected` toggleClassName

toggleClassName(element, className, isActive): void
Toggle classList
Parameters
- element: Element
- className: string
- isActive: boolean
Returns void
Inherited from Component.toggleClassName
- Defined in src/base/Module/index.ts:284

Class ScrollView<StaticProps, ChangeableProps, CallbacksTypes>

Type Parameters

StaticProps extends NScrollView.IStaticProps = NScrollView.IStaticProps

ChangeableProps extends NScrollView.IChangeableProps = NScrollView.IChangeableProps

CallbacksTypes extends NScrollView.ICallbacksTypes = NScrollView.ICallbacksTypes

Hierarchy

Index

Constructors

Properties

Accessors

Methods

Constructors

constructor

Type Parameters

StaticProps extends NScrollView.IStaticProps = NScrollView.IStaticProps

ChangeableProps extends NScrollView.IChangeableProps = NScrollView.IChangeableProps

CallbacksTypes extends NScrollView.ICallbacksTypes = NScrollView.ICallbacksTypes

Parameters

Optional initialProps: StaticProps & ChangeableProps

canInit: boolean = true

Returns ScrollView<StaticProps, ChangeableProps, CallbacksTypes>

Properties

Protected _elements

Protected Optional _intersectionObserverIn

Protected Optional _intersectionObserverOut

Protected _isFirstStart

Protected _isIntersectionObserverSupported

Accessors

app

Returns Application

callbacks

Returns Callbacks<CallbacksTypes>

elements

Returns NScrollView.IElement[]

isDestroyed

Returns boolean

isFirstStart

Returns boolean

isInitialized

Returns boolean

name

Returns string

prefix

Returns string

props

Returns TRequiredModuleProp<StaticProps & ChangeableProps>

Protected rootBounding

Returns { height: number; left: number; top: number; width: number; }

height: number

left: number

top: number

width: number

Methods

Protected _destroy

Returns void

Protected _getDefaultProps

Returns DeepRequired<StaticProps & ChangeableProps> & { classToToggle: string; direction: string; hasDelay: boolean; intersectionRoot: null; isEnabled: boolean; maxDelay: number; resizeDebounce: number; rootMargin: number; states: string; viewportTarget: string; }

Protected _getElementDelay

Parameters

element: NScrollView.IElement

Returns number

Protected _handleInOut

Parameters

elementProp: NScrollView.IElement

isInViewport: boolean

delay: number = 0

Returns void

Protected _handleIntersectionIn

Parameters

data: IntersectionObserverEntry[]

Returns void

Protected _handleIntersectionOut

Parameters

data: IntersectionObserverEntry[]

Returns void

Protected _init

Returns void

Protected _onPropsMutate

Returns void

Protected _removeViewEvents

`Optional` initialProps: StaticProps & ChangeableProps

`Protected` _elements

`Protected` `Optional` _intersectionObserverIn

`Protected` `Optional` _intersectionObserverOut

`Protected` _isFirstStart

`Protected` _isIntersectionObserverSupported

`Protected` rootBounding

Returns {
height: number;
left: number;
top: number;
width: number;
}

`Protected` _destroy

`Protected` _getDefaultProps

Returns DeepRequired<StaticProps & ChangeableProps> & {
classToToggle: string;
direction: string;
hasDelay: boolean;
intersectionRoot: null;
isEnabled: boolean;
maxDelay: number;
resizeDebounce: number;
rootMargin: number;
states: string;
viewportTarget: string;
}

`Protected` _getElementDelay

`Protected` _handleInOut

`Protected` _handleIntersectionIn

`Protected` _handleIntersectionOut

`Protected` _init

`Protected` _onPropsMutate

`Protected` _removeViewEvents

`Protected` _setEvents

`Protected` _setViewEvents

`Protected` addDestroyableAction

`Optional` options: IAddEventListenerOptions

`Protected` className

`Rest` ...classNames: string[]