Class: Multislider

Multislider(container, oopt)

Class representing a Multislider widget.

Constructor

new Multislider(container, oopt)

Parameters:
Name Type Attributes Description
container object DOM container for the widget.
o object <optional>
 Options.
Properties
Name Type Attributes Default Description
numSliders number <optional>
 10 Number of sliders.
minVal number <optional>
 0 Minimum slider value.
maxVal number <optional>
 127 Maximum slider value.
sliderColors array.<string> <optional>
 ["#000"] Slider colors, specified as an array of color values. e.g. to get a black-white-black-white zebra pattern, specify ['black', 'white']
backgroundColor string <optional>
 "#fff" Background color.
Implements:
  • Widget
Source:

Methods

(private) _addSvgSlider()

Adds an svg element representing a slider.
Source:

(private) _calcSliderHeight(idx) → {number}

Calculate the slider height.
Parameters:
Name Type Description
idx number Index of the slider.
Source:
Returns:
- Height of the slider in px.
Type
number

(private) _calcSliderPos(idx) → {object}

Calculate the position for a given slider.
Parameters:
Name Type Description
idx number Index of the slider (left to right).
Source:
Returns:
- Object representing the {x, y} position.
Type
object

(private) _calcSliderWidth() → {number}

Calculate the width of each slider. Each slider's width is width of multislider / number of sliders.
Source:
Returns:
- Width of each slider in px.
Type
number

(protected) _initHandlers()

Initialize mouse and touch event handlers
Source:

(protected) _initOptions()

Initialize the options
Source:

(protected) _initState()

Initialize state
Source:

(protected) _initStateConstraints()

Initialize state constraints
Source:

(protected) _initSvgEls()

Initialize the svg elements
Source:

(private) _removeSvgSlider()

Remove an SVG slider element.
Source:

_setSliderVal(targetSliderPanel, y)

Set value for a slider based on y position of a click event.
Parameters:
Name Type Description
targetSliderPanel object The panel that registered the event.
y number Y-position of the event.
Source:

(protected) _update()

Update (redraw) component based on state.
Source:

(private) _updateEls()

Updates the SVG elements and state containers. Adds or removes a number of SVG elements and state containers to match the current number of sliders.
Source:

(abstract) getVal() → {array}

Get public representation of the state.
Source:
Returns:
- An array of slider values.
Type
array

(abstract) setInternalVal(newSliderVals)

Set the current state in a format specific to each widget. Same as setVal(), but will not cause an observer callback trigger.
Parameters:
Name Type Description
newSliderVals array An array representing the new slider values
Source:

(abstract) setVal(newSliderVals)

Set the current state in a format specific to each widget. Same as setInternalVal(), but will cause an observer callback trigger.
Parameters:
Name Type Description
newSliderVals array An array representing the new slider values
Source: