Class: AutoComplete

Extends

• GOWN.TextInput

Members

static,readonlyGOWN.AutoComplete.CLICKEDString

Click state

static,readonlyGOWN.AutoComplete.HOVER_CONTAINERString

Hover state

allowDestroyCachebool

Will destroy the skin cache when the skinable gets destroyed

Default Value:

• true

autoPreventInteractionbool

Prevent other interaction (touch/move) on this component

Default Value:

• false

blinkIntervalNumber

Interval for the cursor (in milliseconds)

Default Value:

• 500

currentStateString

The current state TODO: move to skinable?

Default Value:

• InputControl.UP

displayAsPasswordbool

Set display as password (show text with "*")

enabledBoolean

Enables/Disables the control. (not implemented yet)

hasFocusbool

Determine if the input has the focus

Default Value:

• false

limitToNumber

The maximum number of suggestions that show at one time. If 0, all suggestions will be shown.

Default Value:

• 5

maxCharsString

The maximum number of characters that may be entered. If 0, any number of characters may be entered. (same as maxLength for DOM inputs)

Default Value:

• 0

minAutoCompleteLengthNumber

The minimum number of entered characters required to draw suggestions.

Default Value:

• 2

receiveKeysbool

TODO

Default Value:

• true

resultsArray.<String>

Result elements (source elements filtered by the text attribute)

Default Value:

• []

selectionBgPIXI.Graphics

Text selection background

skinFallbackString

The fallback skin if the other skin does not exist (e.g. if a mobile theme that does not provide a "hover" state is used on a desktop system) (normally the default "up"-state skin)

Default Value:

• 'up'

skinNameString

The skin name

Default Value:

• TextInput.SKIN_NAME

sourceArray.<String>

Source elements from which the auto complete filters the elements corresponding to the current text

Default Value:

• []

stylePIXI.TextStyle

Set the text style (size, font etc.) for text and cursor

textString

The displayed text

Methods

inherited blur()

controls/InputControl.js, line 428

Blur the text input (remove focus)

inherited changeSkin(skin)

core/Skinable.js, line 110

Remove old skin and add new one

Name	Type	Description
skin	DisplayObject

inherited deleteSelection()

controls/InputControl.js, line 280

Delete the selected text

inherited deleteText(fromPos, toPos){String}

controls/InputControl.js, line 300

Delete text from a start position to an end position

Name	Type	Description
fromPos	Number	start position
toPos	Number	end position

Returns:

Type	Description
String

inherited destroy()

core/Skinable.js, line 221

Destroy the Skinable and empty the skin cache

drawResults(text)

controls/AutoComplete.js, line 171

Draw the results

Name	Type	Description
text	String	Text to filter the source elements

inherited focus()

controls/InputControl.js, line 376

Focus on this input and set it as current

inherited fromSkin(name, callback)

core/Skinable.js, line 134

Get image from skin (will execute a callback with the loaded skin when it is loaded or call it directly when it already is loaded)

Name	Type	Description
name	String	name of the state
callback	function	callback that is executed if the skin is loaded

inherited getLines(){Array|*}

controls/TextInput.js, line 72

Get the text lines as an array

Returns:

Type	Description
Array | *	Returns an array with one text line per array element

hoverResultElement(elementText)

controls/AutoComplete.js, line 235

Update the hover result element

Name	Type	Description
elementText

inherited insertChar(char)

controls/InputControl.js, line 267

Insert a char at the current cursor position

Name	Type	Description
char	String	The char that gets inserted

inherited lineHeight(){Number}

controls/InputControl.js, line 455

Height of the line in pixel (assume that every character of pixi text has the same line height)

Returns:

Type	Description
Number

inherited mousePos(){PIXI.Point}

core/Control.js, line 69

Get the local mouse position from PIXI.InteractionData

Returns:

Type	Description
PIXI.Point

inherited moveCursorLeft()

controls/InputControl.js, line 249

Move the cursor left

inherited moveCursorRight()

controls/InputControl.js, line 257

Move the cursor right

inherited protectedonblur()

controls/InputControl.js, line 666

Callback that will be executed once the text input is blurred

inherited protectedonDown()

controls/InputControl.js, line 518

onDown callback

inherited protectedonfocus()

controls/InputControl.js, line 422

Callback to execute code on focus

inherited protectedonInputChanged()

controls/InputControl.js, line 227

Input changed callback

protectedonMouseUpOutside()

controls/AutoComplete.js, line 265

Closes the results when the mouse is released outside

inherited protectedonMove()

controls/InputControl.js, line 492

onMove callback

inherited protectedonUp()

controls/InputControl.js, line 561

onUp callback

inherited pixelToTextPos(pixelPos){Number}

controls/InputControl.js, line 630

From pixel position on the text to character position inside the text (used when clicked on the text)

Name	Type	Description
pixelPos		Pixel position of the mouse on the text

Returns:

Type	Description
Number	Position in the text

inherited preloadSkins()

core/Skinable.js, line 124

Initiate all skins first

inherited protectedredraw()

controls/InputControl.js, line 682

Update before draw call (draw cursor and selection)

redrawResult()

controls/AutoComplete.js, line 255

Redraw the results

removeHoverResultElement()

controls/AutoComplete.js, line 246

Remove the hover result element

selectResultElement(text)

controls/AutoComplete.js, line 218

Close results and set the text

Name	Type	Description
text	String	Display text

inherited setCursorPos()

controls/InputControl.js, line 443

Set the cursor position on the text

setText(text)

controls/AutoComplete.js, line 278

Set the auto complete text. Draws the auto complete results afterwards.

Name	Type	Description
text	String	The text to set

inherited setTheme(theme)

controls/InputControl.js, line 318

Change the theme

Name	Type	Description
theme	GOWN.Theme	the new theme

inherited textToPixelPos(textPos, position){PIXI.Point}

controls/InputControl.js, line 600

From position in the text to pixel position (for cursor/selection positioning)

Name	Type	Description
textPos	Number	Current character position in the text
position	PIXI.Point	optional point that will be set with the pixel position and returned

Returns:

Type	Description
PIXI.Point	Pixel position

inherited textWidth(text){Number}

controls/InputControl.js, line 367

Get the width of a text

Name	Type	Description
text	String	The text to get the width from

Returns:

Type	Description
Number

toggleResults()

controls/AutoComplete.js, line 226

Close the results

inherited updateSelection(start, end){boolean}

controls/InputControl.js, line 350

Set the selected text

Name	Type	Description
start	Number	Start position in the text
end	Number	End position in the text

Returns:

Type	Description
boolean

inherited updateTheme(data)

core/Skinable.js, line 100

Overwrite data from theme for this specific component. (usable if you want to change e.g. background color based on selected items)

Name	Type	Description
data		updated skin data