The Official Blog of Patcoola

Project Title: Knob
Programming Language: JavaScript
Date Created: 2022-08-28

Purpose: To provide a behavior class for a knob user interface component.

Description: The knob is a user interface behavior class for providing a rotational alternative to a value slider. Knobs are commonly used in musically applications, and can occupy less space than a value slider.

The knob works by dragging the handle in the circular motion or by click-and-drag from the center of the knob along an x/y axis. The knob auto detects your axis of choice.

Advertisement

Donate Now!

Hey buddy, it takes a lot to make a blog. How about a donation?

---

Methods:

knob_class()

The knob class

class.target

Define the element to target, takes an element

class.decimals(int)

Function to format the decimal range of the value

class.setValue(num)

Function to change the current value of the knob

class.getValue()

Function to fetch the value from the knob

class.setMin(num)

Function to define the minimum number range of the value

class.setMax(num)

Function to define the maximum number range of the value

class.setRange(str[“dial”, “axis”], int)

Function to change the dial or axis range. Dial to limit the degrees the knob can rotate. Axis to define how far the x/y range

class.setDeadzone(int)

Function to manually define the dead zone from the center the user’s mouse can not rotate the knob if the mouse if inside the dead zone

class.onchange

Define with a user created function to execute your own event

class.start()

Function to run the behavior

class.stop()

Function to stop the behavior

Style Notes:

The following class names are required to assign the knob behavior.

.knob

.knob-handle

Advertisement

Donate Now!

Hey buddy, it takes a lot to make a blog. How about a donation?

---

Be the first to write a comment.