Class CvsTextField

This class supports a single line text entry field.

The left/right arrow keys move the text-insertion-point within the text. Used in combination with the shift key it enables part or all of the text to be selected. The entire text can be selected with the Ctrl+A or Cmd+A keys.

Selected text can be copied with the Ctrl+C or Cmd+C keys and pasted at the current text-insertion-point with the Ctrl+V or Cmd+V keys. The Ctrl+X or Cmd+X keys will cut (and copy) the selected text.

If no text is selected then the arrows keys can move off the current control to another. This only works if each textfield has a unique index number (>0;).

If the control has the index value 'idx' then the next control depends on the arrow key pressed -
left : idx - 1
right : idx + 1
up : idx - offset
down : idx + offset

The offset value is set when initialising the idx value with the index(idx, deltaIndex) method.

No other controls can be used while a textfield control is active. Pressing 'Enter' or attempting to move to a non-existant textfield deactivates the current textfield.

The user can provide their own validation function which is checked when the control is deativated.

Hierarchy

  • CvsText
    • CvsTextField

Accessors

hasValidText id isEnabled isOpaque isValid isVisible type

Methods

addChild corners disable enable hide index leaveParent moveBy moveTo noIndex opaque orient parent removeChild scheme setAction setTextValid show shrink text textFont textSize textStyle tipTextSize tooltip transparent validation

Accessors

hasValidText

  • get hasValidText(): boolean

  • True if there is some text and it passed any validation function. If there is no text then this will be false.

    Returns boolean

id

  • get id(): string

  • The unique identifier for this control.

    Returns string

isEnabled

  • 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

isOpaque

  • get isOpaque(): boolean

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

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

    Returns boolean

isValid

  • get isValid(): boolean

  • True if the text has passed validation. If there is no validation function this is always true.

    Returns boolean

isVisible

  • get isVisible(): boolean

  • This is true if the control is visible else false.

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

    Returns boolean

type

  • get type(): string

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

    Returns string

Methods

addChild

  • 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.

    Returns

    this control

    Parameters

    • c: string | CvsBaseControl

      is the actual control or its id

    • Optional rx: number
    • Optional ry: number

    Returns any

corners

  • 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.

    Returns

    an array of the currently used radii values

    Parameters

    • Rest ...c: any

      valid radii combination

    Returns number[] | CvsBaseControl

disable

  • Disables this control.

    Returns

    this control

    Parameters

    • Optional cascade: boolean

      if true disable child controls

    Returns CvsBaseControl

enable

  • Enables this control.

    Returns

    this control

    Parameters

    • Optional cascade: boolean

      if true enable child controls

    Returns CvsBaseControl

hide

  • Make this control invisible.

    Returns

    this control

    Parameters

    • Optional cascade: boolean

      if true hide children

    Returns CvsBaseControl

index

  • Set a unique index number for this text field.

    Returns

    this control

    Parameters

    • idx: number

      unique index number

    • Optional deltaIndex: number

      relative link when using up/down arrow keys

    Returns CvsTextField

leaveParent

  • Remove this control from its parent

    Returns

    this control

    Returns CvsBaseControl

moveBy

  • Move this control relative to current position.

    Returns

    this control

    Parameters

    • x: number

      horizontal distance

    • y: number

      vertical distance

    Returns CvsTextField

moveTo

  • Move this control to an absolute position.

    Returns

    this control

    Parameters

    • x: number

      horizontal position

    • y: number

      vertical position

    Returns CvsTextField

noIndex

  • Removes the link index from this textfield. After this it will not be possible to move focus to this textfield using the keyboard arrows.

    Returns

    this control

    Returns CvsTextField

opaque

  • 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 (efault value).

    Returns

    this control

    Parameters

    • alpha: number = 255

      alpha value for controls background color.

    Returns CvsBaseControl

orient

  • Sets this controls display orientation to one of the four cardinal compass points. An invalid parameter will set the orientation to 'east' which is the default value.

    Returns

    this control

    Parameters

    • dir: string = 'east'

      'north', 'south', 'east' or 'west'

    Returns CvsBaseControl

parent

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

    Returns

    this control

    Parameters

    • parent: string | CvsBaseControl

      is the parental control or its id

    • Optional rx: number

      x position relative to parent

    • Optional ry: number

      y position relative to parent

    Returns CvsBaseControl

removeChild

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

    Returns

    this control

    Parameters

    Returns CvsTextField

scheme

  • 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.

    Returns

    this control or the control's color scheme

    Parameters

    • Optional name: string

      the color scheme name e.g. 'blue'

    • Optional cascade: boolean

      if true propogate scheme to all child controls.

    Returns ColorScheme | CvsBaseControl

setAction

  • 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

    Returns

    this control

    Parameters

    • event_handler: Function

      the function to handle this control's events.

    Returns CvsTextField

setTextValid

  • If the text is invalid this method sets the text as being valid and change the visual appearance accordingly. This will remain in effect until the next time the text is validated.

    Returns

    this control

    Returns CvsTextField

show

  • Make this control visible.

    Returns

    this control

    Parameters

    • Optional cascade: boolean

      if true show children

    Returns CvsBaseControl

shrink

  • Shrink the control to fit contents.

    To shrink on one dimension only pass either 'w' (width) or 'h' (height) to indicate which dimmension to shrink

    Returns

    this control

    Parameters

    • Optional dim: string

      the dimension to shrink

    Returns CvsBaseControl

text

  • Gets or sets the current text. Any EOL characters are stripped out of the string. If necessary the string length will be reduced until it will fit inside the textfield. If a validation function has been set then the string will be validated.

    Returns

    this control for setter

    Parameters

    • Optional t: string

      a string representing text to display

    Returns string | CvsTextField

textFont

  • Sets or gets the text font for this control.

    If the parameter is true-type-font or the name of a system font it will be used as the local font and this control will be returned.

    Recognised font names are :-

    'arial'             'verdana'   'tahoma'        'trebuchet ms'
'times new roman'   'georgia'   'courier new'   'brush script mt'
'impact'            'serif'     'sans-serif'    'monospace'

    Invalid fonts are ignored and the local font is unchanged.

    If no parameter is passed then the current local font is returned.

    Returns

    this control

    Parameters

    • Optional ltf: any

      A true-type-font or the name (case-insensitive) of a valid system font.

    Returns string | GUI | CvsTextField

textSize

  • If there are no paremeters return the currently used text size for this control, otherwise set the text size to use.

    Returns

    this control or the current text size

    Parameters

    • lts: number

      the text size to use

    Returns number | GUI | CvsTextField

textStyle

  • Sets or gets the local text style.

    The 4 recognised font styles are :-

    NORMAL    BOLD   ITALIC   BOLDITALIC

    Unrecognized styles are ignored and the local style is unchanged.

    If no parameter is passed then the current style is returned.

    Returns

    this control

    Parameters

    • Optional gty: string

      the font style to use.

    Returns string | CvsTextField

tipTextSize

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

    Parameters

    • Optional tsize: number

      text size for this tooltip

    Returns CvsTextField

tooltip

  • Create a tooltip for this control.

    Returns

    this control

    Parameters

    • tiptext: string

      the text to appear in the tooltip

    Returns CvsTextField

transparent

  • Makes the controls background fully transparent.

    Returns

    this control

    Returns CvsBaseControl

validation

  • Set the validation function to be used for this control.

    The function is created by the user and should return an array of two elements e.g. [valid, valid-text]

    valid is a boolean indicating if the text is valid and
    valid-text can be the original text or amended in some way.

    For instance a textfield used for getting a persons name will be valid if there are 2 or more words and the valid-text will be the name but with the first letter of each word being capatilised.

    Returns

    this control

    Parameters

    • vfunc: Function

      the validation function

    Returns CvsTextField

Settings

Member Visibility

Theme

Generated using TypeDoc