Class VolumeRange

<theoplayer-volume-range> - A volume slider, showing the current audio volume of the player, and which changes the volume when clicked or dragged.

Hierarchy

Constructors

constructor

Properties

_pointerEl _rangeEl activeVideoQuality? deviceType error? fullscreen? playbackRate? previewTime? streamType? targetVideoQualities? theoplayerUiObservedProperties

Accessors

disabled max min player step value observedAttributes

Methods

_upgradeProperty attributeChangedCallback connectedCallback disconnectedCallback getAriaLabel getAriaValueText getBarColors getMinimumStepForVisibleChange_ handleInput handleKeyDown_ update updatePointer_

Constructors

constructor

Properties

Protected Readonly_pointerEl

_pointerEl: HTMLElement

Protected Readonly_rangeEl

_rangeEl: HTMLInputElement

OptionalactiveVideoQuality

activeVideoQuality?: VideoQuality

deviceType

deviceType: "mobile" | "tv" | "desktop"

Optionalerror

error?: THEOplayerError

Optionalfullscreen

fullscreen?: boolean

OptionalplaybackRate

playbackRate?: number

OptionalpreviewTime

previewTime?: number

OptionalstreamType

streamType?: StreamType

OptionaltargetVideoQualities

targetVideoQualities?: VideoQuality[]

ReadonlytheoplayerUiObservedProperties

theoplayerUiObservedProperties: (keyof StateReceiverPropertyMap)[]

The names of the properties this element will receive.

Accessors

disabled

  • get disabled(): boolean

    Whether the range is disabled.

    When disabled, the slider value cannot be changed, and the slider thumb is hidden.

    Returns boolean

  • set disabled(disabled: boolean): void

    Parameters

    • disabled: boolean

    Returns void

max

  • get max(): number

    The maximum allowed value.

    Returns number

  • set max(max: number): void

    Parameters

    • max: number

    Returns void

min

  • get min(): number

    The minimum allowed value.

    Returns number

  • set min(min: number): void

    Parameters

    • min: number

    Returns void

player

step

  • get step(): number | "any"

    The granularity at which the value can change.

    If set to "any", the value can change with arbitrary precision.

    Returns number | "any"

  • set step(step: number | "any"): void

    Parameters

    • step: number | "any"

    Returns void

value

  • get value(): number

    The current value.

    Returns number

  • set value(value: number): void

    Parameters

    • value: number

    Returns void

StaticobservedAttributes

Methods

Protected_upgradeProperty

attributeChangedCallback

  • attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void

    Parameters

    • attrName: string
    • oldValue: any
    • newValue: any

    Returns void

connectedCallback

  • connectedCallback(): void

    Returns void

disconnectedCallback

  • disconnectedCallback(): void

    Returns void

ProtectedgetAriaLabel

  • getAriaLabel(): string

    The value for the aria-label attribute of the <input type="range"> element.

    Returns string

ProtectedgetAriaValueText

  • getAriaValueText(): string

    The value for the aria-valuetext attribute of the <input type="range"> element.

    Returns string

ProtectedgetBarColors

  • getBarColors(): ColorStops

    Build the color gradient for the range bar. Creating an array so progress-bar can insert the buffered bar.

    Returns ColorStops

ProtectedgetMinimumStepForVisibleChange_

  • getMinimumStepForVisibleChange_(): number

    Returns number

ProtectedhandleInput

  • handleInput(): void

    Returns void

ProtectedhandleKeyDown_

Protectedupdate

  • update(useCachedWidth?: boolean): void

    Parameters

    • OptionaluseCachedWidth: boolean

    Returns void

ProtectedupdatePointer_

Settings

Member Visibility

On This Page

Constructors
Properties
Accessors
Methods