canvas-gui
    Preparing search index...

    Class CvsKnob

    A simple turnable knob control

    This class represents a turnable knob with a surrounding status track (optional). There are 3 modes available to rotate the knob they are :-

    'a' : drag the mouse in a circular fashion round the knob center.can move in any direction (360°). This is the default value.
    'x' : drag the mouse horizontally left or right.
    'y' : drag the mouse vertically up and down./pr>

    This control's appearance is highly configurable including major and minor tick with optional stick-to-ticks functionality.

    Hierarchy (View Summary)

    Index

    Properties

    _inset: number
    _limit0: number
    _limit1: number
    _majorTicks: number
    _majorTickSize: number
    _minorTicks: number
    _minorTickSize: number
    _s2ticks: boolean
    _t01: number
    _thumbCnrs: number[]
    _thumbSize: number
    _trackWeight: number

    Accessors

    • get id(): string

      The unique identifier for this control.

      Returns string

    • get isEnabled(): boolean

      This is true if the control can respond to UI events else false.

      Use enable() and disable() to enable and disable it.

      Returns boolean

    • get isOpaque(): boolean

      This is true if the control background is opaque else false.

      Use opaque() and transparent() display / hide the background.

      Returns boolean

    • get isVisible(): boolean

      This is true if the control is visible else false.

      Use hide() and show() to set visibility.

      Returns boolean

    • get type(): string

      The type name for this control.
      (type name = class name without the Cvs prefix)

      Returns string

    Methods

    • Add a child to this control using its relative position [rx, ry]. If rx and ry are not provided then it uses the values set in the child.

      Parameters

      • child: any

        is the actual control or its id

      • Optionalrx: number
      • Optionalry: number

      Returns any

      this control

    • Execute one or more configuration methods on this control.

      The parameter is a user defined object where each field is the name of a configuration method and its value is the method's parameter(s). Multiple parameters should be in an array and use 'undefined' if the method expects no parameters.

      This object will change the color scheme, text size and alignment, it will also make sure it is visible.

      { scheme : 'red', textSize : 12, textAlign: ['left', 'top'], show : undefined }
      
      If the field name does not exist or not a valid function of this control it will be silently ignored.

      There is no error checking on the parameters, it is up to the user to ensure they are valid for the control method.

      Parameters

      • cfg: any

        the configuration object

      Returns CvsKnob

      this control

    • Get or set the corner radii used for this control.

      To set the radii the parameters must be one of the following

      • an array of 4 numbers.
      • a comma seperated list of 4 numbers.
      • a single number to be used for all 4 radii.

      If no parameter is passed or does not match one of the above then an array of the currently used radii values.

      Parameters

      • ...c: any

        valid radii combination

      Returns number[] | CvsControl

      an array of the currently used radii values

    • Disables this control.

      Parameters

      • Optionalcascade: boolean

        if true disable child controls

      Returns CvsControl

      this control

    • Enables this control.

      Parameters

      • Optionalcascade: boolean

        if true enable child controls

      Returns CvsControl

      this control

    • If the turn angle is < 360° then there will be an 'unused' section of track. This is called the gap and this method sets the position of the gap center effectively rotating the whole knob.

      The angle is 0° along positive x-axis and increases clockwise. The default value is 90° which means the gap center is facing south.

      Parameters

      • ang: number

        must be in the range ≥ 0 and ≤ 360

      Returns CvsKnob

      this control

    • Make this control invisible.

      Parameters

      • Optionalcascade: boolean

        if true hide any children

      Returns CvsControl

      this control

    • Checks whether a value is between the lower and upper limits for this control. It allows the user to prevalidate a value before attempting to change the control's value.

      Parameters

      • value: number

        value to test

      Returns boolean

      true if the value lies within the control's limits else false

    • Set the lower and upper limits for the slider

      Parameters

      • l0: number

        lower limit

      • l1: number

        upper limit

      Returns CvsSlider

      this slider object

    • Sets the interaction mode for rotating the knob.

      • 'x' : dragging left and right turns the knob anticlockwise and clockwise respectively.
      • 'y' : dragging down and up turns the knob anticlockwise and clockwise respectively.
      • 'a' : dragging in a circular motion round the knob center turns the knob to face the drag point.

      Rotation is constrained within the maximum turn angle for this knob.

      Any other parameter value is ignored and the mode is unchanged.

      Parameters

      • mode: string

        'x', 'y' or 'a'

      Returns CvsKnob

      this control

    • Move this control relative to current position.

      Parameters

      • x: number

        horizontal distance

      • y: number

        vertical distance

      Returns CvsKnob

      this control

    • Move this control to an absolute position.

      Parameters

      • x: number

        horizontal position

      • y: number

        vertical position

      Returns CvsKnob

      this control

    • Makes the controls background opaque. The actual color depends on the controls color scheme.

      The second parameter, alpha, is optional and controls the level of opaqueness from 0 - transparent to 255 - fully opaque (default value).

      Parameters

      • alpha: number = 255

        alpha value for controls background color.

      Returns CvsControl

      this control

    • Adds this control to another control which becomes its parent.

      Parameters

      • parent: any

        is the parental control or its id

      • Optionalrx: number

        x position relative to parent

      • Optionalry: number

        y position relative to parent

      Returns CvsPin

      this control

    • Remove a child control from this one so that it stays in same screen position.

      Parameters

      • child: any

        the control to remove or its id

      Returns CvsKnob

      this control

    • If the name of a valid color scheme is provided then it will use it to display the control, non-existant scheme names will be ignored. In both cases this control is returned.

      If there is no parameter it returns the name of the current color scheme used by this control.

      Parameters

      • Optionalname: string

        the color scheme name e.g. 'blue'

      • Optionalcascade: boolean

        if true propogate scheme to all child controls.

      Returns ColorScheme | CvsControl

      this control or the control's color scheme

    • Only applies to modes 'x' and 'y'. It controls how far the knob rotates for a given drag distance.

      The drag distance needed to rotate the knob by the maximum turn angle is the reciprocal of the parameter value i.e. 1.0 / sens.

      The default value is 0.005 which equates to a drag distance of 200 pixels and the minimum permitted value is 0.0025 (400 pixels).

      Parameters

      • svty: number

        ≥0.0025

      Returns CvsKnob

      this control

    • This sets the event handler to be used when this control fires an event. The parameter can take one of three forms:

      1. Arrow function definition
      2. Anonymous function definition
      3. Named function declaration

      Parameters

      • event_handler: Function

        the function to handle this control's events.

      Returns CvsKnob

      this control

    • An alternative to the enable / disable methods.

      Parameters

      • enable: boolean

        true / false

      • Optionalcascade: boolean

        true apply to all children

      Returns CvsPin

      this control

    • An alternative to the show / hide methods.

      Parameters

      • visible: boolean

        true / false

      • Optionalcascade: boolean

        if true hide children

      Returns CvsPin

      this control

    • Make this control visible.

      Parameters

      • Optionalcascade: boolean

        if true then show any children

      Returns CvsControl

      this control

    • The track can be divided up into a number of domains separated with major ticks. The major domains and be further divided into subdomains separated with minor ticks. If the final parameter is true then values returned by the slider are consrained to the tick values.

      Parameters

      • major: number

        the number of major domains on the track

      • minor: number

        the number of minor domains between major ticks

      • Optionalstick2ticks: boolean

        slider value is constrainged to tick values

      Returns CvsControl

      this slider object

    • Sets the size of the text to use in the tooltip.

      Parameters

      • Optionaltsize: number

        text size for this tooltip

      Returns CvsKnob

    • Create a tooltip for this control.

      Parameters

      • tiptext: string

        the text to appear in the tooltip

      Returns CvsKnob

      this control

    • Sets the width of the track surrounding the central knob-grip. The value will be constrained so the minimum width is 6 pixels upto the radius of the knob.

      The track is used to display current value bar as well as any user specified ticks.

      Parameters

      • tw: number

        the width of the value track

      Returns CvsKnob

      this control

    • Sets the maximum angle the knob can be turned in degrees. Angles outside the range >0° and ≤360° will be ignored and the current turn angle is unchanged.

      Parameters

      • ang: number

        max.turn angle >0 and ≤360 degrees

      Returns CvsKnob

      this control

    • If the parameter value is withing the slider limits it will move the thumb to the appropriate position. If no parameter is passed or is outside the limits this methods returns the current slider value.

      Parameters

      • Optionalvalue: number

        the selected value to be set

      Returns number | CvsControl

      the current value or this slider object

    • Gets or sets the thickness of the track.

      The thickness is constrained to the range ≥ 4 and ≤ 0.1 * control width.

      Parameters

      • tWgt: number

        the required track thickness)

      Returns number | CvsControl

      the curent track thickness or this control