The model that holds data with respect to the according view.
The function that handles all inputs made by a user.
The function that renders the view this module lives in.
Indicator whether the marker is currently dragged or not.
Unique Id for the div that wraps the canvas. Is as big as the canvas.
Unique Id for the canvas.
Height of the drawing canvas in px.
Unique Id for the image that is shown in the canvas.
This function is called whenever a user interacts with the module.
This function is called whenever a user interacts with the module.
The input that was made. The type is chosen according to whom makes the input, i.e. is the input happening in Player or Controller View.
Unique Id for the draggable marker.
Size/Radius of the draggable marker inside the canvas/box.
Unique Id for the div that holds the canvas (this is markerSize/2 bigger than the canvas, so the marker can be dragged to the most outer edge of the canvas div).
A Module View always holds a Module Model that has all the informations and settings.
The position of the newest drag update.
The position of the last drag update.
The normalized coordinate.
This function is called when the model changes it's view has to be rerendered.
This function is called when the model changes it's view has to be rerendered.
Unique Id for the most outer div wrapper.
Width of the drawing canvas in px.
The maximum x-value the marker can have (used to calculate rangedPosition).
The minimum x-value the marker can have (used to calculate rangedPosition).
The maximum y-value the marker can have (used to calculate rangedPosition).
The minimum y-value the marker can have (used to calculate rangedPosition).
Update the list of Midi output devices.
Sends the changed background image path to the server.
A text input element.
Given the width and height of the canvas together with the marker size, calculate the current position of the marker (as relative value between x/yrangeMin and x/yrangeMax) and store it in rangedPosition.
Composes the controller view parts that are specific to this model. Has to be implemented by the child class that inherits from this class.
Composes an input field where the name of the module can be set.
A Template Result without an outer div.
Composes a dropdown select element that let's the controller choose for which type of players this model is visible.
A Template Result without an outer div.
Composes the player view parts that are specific to this model. Has to be implemented by the child class that inherits from this class.
Display the new ranged position of the marker
Triggered for every registered mouse/touch movement, when the marker is currently being dragged.
Triggered whenever a touch/mouse drag ends.
Triggered when clicked inside the box/canvas. Prepares the drag movement.
Composes the general controller view of every model, regardless of the specific model type.
All aggregator subscriptions that the Controller holds.
All outputs that are currently set.
The controller view as Template Result.
Get the marker position.
Absolute position of the marker (absolute on-screen value in px).
Composes the general player view of every model, regardless of the specific model type.
The Role of the player that loadsand looks at this module.
The player view as Template Result. Might be empty if the player roles don't match.
Set all sizes, position the marker and load the widget's background image.
Sends the changed text of the slider bottom left label to the server.
A text input element.
Sends the changed text of the slider bottom right label to the server.
A text input element.
Sends the changed text of the slider top left label to the server.
A text input element.
Sends the changed text of the slider top right label to the server.
A text input element.
Normalize the ranged coordinates.
Ranged coordinate with x in [xrangeMin, xrangeMax] and y in [yrangeMin, yrangeMax].
A Coordinate with x in [0,1] and y in [0,1].
Send the coordinates to the server.
Set the marker to a position.
Absolute x value of the new position (on-screen value in px).
Absolute y value of the new position (on-screen value in px).
Move the marker to a specific location within the ranged coordinates.
Has to be within [this.xrangeMin, this.xrangeMax]
Has to be within [this.yrangeMin, this.yrangeMax]
General function to translate an HTML Element.
Absolute x value of the new position (on-screen value in px).
Absolute y value of the new position (on-screen value in px).
The element tha will be moved.
Generated using TypeDoc
Implements a Slider2DModel's player and controller views and the functions needed for user interaction.