Components library

Classes

BaseComponent: BaseComponent The base class from which all other components inherit shared logic
Validator: This is the base class that holds all functionality shared between custom components and native elements
NativeElementValidator: The NativeElementValidator uses the methods from the Validator class All native elements tha don't support methods like isFormElement, tooLong, tooShort etc.. will be wrapped in this class in order to enable us to validate native and custom elements using the same methods.
CustomElementValidator: The CustomElementValidator is inherited by custom elements in order to gain the validation function from the Validator class. This class can not be used to wrap the native elements as it inherits the HTMLElement which can not be instantiated using the new keyword.
TextFieldValidator: Class that implements the commong validation methods for the text fields
GamefaceComponents: Class that defines the Gameface components
ComponentSlot: Class that will handle gameface components slot element

Functions

isNativeTextField(element) ⇒ boolean: Checks if the passed element is a native text field

BaseComponent

BaseComponent The base class from which all other components inherit shared logic

Kind: global class

BaseComponent
- .instanceType
- .setupTemplate(data, callback) ⇒ undefined
- .isStatePropValid(name, value) ⇒ boolean

baseComponent.instanceType

Return the type of the class

Kind: instance property of BaseComponent

baseComponent.setupTemplate(data, callback) ⇒ `undefined`

Called when the template of a component was loaded.

Kind: instance method of BaseComponent

Param	Type
data	`object`
callback	`function`

baseComponent.isStatePropValid(name, value) ⇒ `boolean`

Validate if a value can be set on the state.

Kind: instance method of BaseComponent

Param	Type	Description
name	`string`	the name of the property.
value	`any`	the value that has to be checked.

Validator

This is the base class that holds all functionality shared between custom components and native elements

Kind: global class

Validator
- instance
  - .instanceType
- static
  - .isFormElement(element) ⇒ boolean
  - .tooLong() ⇒ boolean
  - .tooShort() ⇒ boolean
  - .rangeOverflow() ⇒ boolean
  - .rangeUnderflow() ⇒ boolean
  - .valueMissing(element) ⇒ boolean
  - .nameMissing(element) ⇒ boolean
  - .isRequired(element) ⇒ boolean
  - .customError() ⇒ boolean
  - .willSerialize(element) ⇒ boolean

validator.instanceType

Return the type of the class

Kind: instance property of Validator

Validator.isFormElement(element) ⇒ `boolean`

Check if element is child of a form

Kind: static method of Validator

Param	Type
element	`HTMLElement`

Validator.tooLong() ⇒ `boolean`

Check if element value is bigger than element maxlength

Kind: static method of Validator

Validator.tooShort() ⇒ `boolean`

Check if element value is less than element minlength

Kind: static method of Validator

Validator.rangeOverflow() ⇒ `boolean`

Checks if the value of an element is bigger than its max attribute

Kind: static method of Validator

Validator.rangeUnderflow() ⇒ `boolean`

Checks if the value of an element is smaller than its min attribute

Kind: static method of Validator

Validator.valueMissing(element) ⇒ `boolean`

Check if element is required and its value is missing

Kind: static method of Validator

Param	Type
element	`HTMLElement`

Validator.nameMissing(element) ⇒ `boolean`

Check if element name is missing

Kind: static method of Validator

Param	Type
element	`HTMLElement`

Validator.isRequired(element) ⇒ `boolean`

Check if an element is required

Kind: static method of Validator

Param	Type
element	`HTMLElement`

Validator.customError() ⇒ `boolean`

Checks if there is a custom error for the element

Kind: static method of Validator

Validator.willSerialize(element) ⇒ `boolean`

Checks if element is going to be serialized. If an element doesn’t have a name it will not be serialized. Used to determine if an element should be validated.

Kind: static method of Validator

Param	Type
element	`HTMLElement`

NativeElementValidator

The NativeElementValidator uses the methods from the Validator class All native elements tha don’t support methods like isFormElement, tooLong, tooShort etc.. will be wrapped in this class in order to enable us to validate native and custom elements using the same methods.

Kind: global class

CustomElementValidator

The CustomElementValidator is inherited by custom elements in order to gain the validation function from the Validator class. This class can not be used to wrap the native elements as it inherits the HTMLElement which can not be instantiated using the new keyword.

Kind: global class

TextFieldValidator

Class that implements the commong validation methods for the text fields

Kind: global class

TextFieldValidator
- .tooLong(element) ⇒ boolean
- .tooShort(element) ⇒ boolean
- .rangeOverflow(element) ⇒ boolean
- .rangeUnderflow(element) ⇒ boolean
- .isBadURL(element) ⇒ boolean
- .isBadEmail(element) ⇒ boolean

TextFieldValidator.tooLong(element) ⇒ `boolean`

Most of the custom elements will not need this check however, we call all validation methods in order to determine if an element is valid. Each element that needs this check implements it itself.

Kind: static method of TextFieldValidator

Param	Type
element	`HTMLElement`

TextFieldValidator.tooShort(element) ⇒ `boolean`

Most of the custom elements will not need this check however, we call all validation methods in order to determine if an element is valid. Each element that needs this check implements it itself.

Kind: static method of TextFieldValidator

Param	Type
element	`HTMLElement`

TextFieldValidator.rangeOverflow(element) ⇒ `boolean`

Most of the custom elements will not need this check however, we call all validation methods in order to determine if an element is valid. Each element that needs this check implements it itself.

Kind: static method of TextFieldValidator

Param	Type
element	`HTMLElement`

TextFieldValidator.rangeUnderflow(element) ⇒ `boolean`

Most of the custom elements will not need this check however, we call all validation methods in order to determine if an element is valid. Each element that needs this check implements it itself.

Kind: static method of TextFieldValidator

Param	Type
element	`HTMLElement`

TextFieldValidator.isBadURL(element) ⇒ `boolean`

Checks if the text field with type url has a valid url by its pattern

Kind: static method of TextFieldValidator

Param	Type
element	`HTMLElement`

TextFieldValidator.isBadEmail(element) ⇒ `boolean`

Checks if the text field element with type email is valid

Kind: static method of TextFieldValidator

Param	Type
element	`HTMLElement`

GamefaceComponents

Class that defines the Gameface components

Kind: global class

GamefaceComponents
- .importScript(url)
- .loadHTML(url) ⇒ promise
- .whenDefined(name) ⇒ promise
- .defineCustomElement(name, element)
- .importComponent(url)
- .removeSlashes(path) ⇒ string
- .removeNewLines(template) ⇒ string
- .removeCopyrightNotice(template) ⇒ string
- .resolveWithTemplate(component) ⇒ Promise.<HTMLElement>
- .loadResource(component) ⇒ promise
- .requestResource(url) ⇒ promise
- .findSlots(parent, parentElName, result) ⇒ Object
- .replaceSlots(source, target)
- .transferContent(source, target)
- .renderOnce(element) ⇒ boolean
- .render(element)
- .transferChildren(element, targetContainerSelector, children)
- .waitForFrames(callback, count) ⇒ any
- .isBrowserGameface() ⇒ boolean
- .isNumberPositiveValidation(propName, value) ⇒ boolean

gamefaceComponents.importScript(url)

Create and add a script tag with given url.

Kind: instance method of GamefaceComponents

Param	Type
url	`string`

gamefaceComponents.loadHTML(url) ⇒ `promise`

Loads an html by given url.

Kind: instance method of GamefaceComponents
Returns: promise - resolved with the html as text.

Param	Type
url	`string`

gamefaceComponents.whenDefined(name) ⇒ `promise`

Creates a promise which resolves when a custom element was defined. Saves the promise for each defined component.

Kind: instance method of GamefaceComponents
Returns: promise - - the previously saved promise it any or a new one

Param	Type	Description
name	`string`	the name of the custom element

gamefaceComponents.defineCustomElement(name, element)

Defines a custom element.

Kind: instance method of GamefaceComponents

Param	Type	Description
name	`string`	the name of the element.
element	`Object`	the object which describes the element.

gamefaceComponents.importComponent(url)

Imports a component by given url. It will automatically try to import style.css and script.js if these files' names were not explicitly specified.

Kind: instance method of GamefaceComponents

Param	Type	Description
url	`string`	the url of the component

gamefaceComponents.removeSlashes(path) ⇒ `string`

Removes back and forward slashes from string

Kind: instance method of GamefaceComponents

Param	Type
path	`string`

gamefaceComponents.removeNewLines(template) ⇒ `string`

Remove new lines from the beginning of templates, because template.firstChild.cloneNode will clone an empty string and will return an empty template.

Kind: instance method of GamefaceComponents

Param	Type
template	`string`

gamefaceComponents.removeCopyrightNotice(template) ⇒ `string`

Removes the copyright notice from the template

Kind: instance method of GamefaceComponents
Returns: string - the template without the copyright notice

Param	Type
template	`string`

gamefaceComponents.resolveWithTemplate(component) ⇒ `Promise.<HTMLElement>`

Used when the element has already been rendered. Return the already rendered template instead of loading and slotting its elements.

Kind: instance method of GamefaceComponents
Returns: Promise.<HTMLElement> - - a promise that will resolve with the rendered template

Param	Type	Description
component	`HTMLElement`	the component that was rendered

gamefaceComponents.loadResource(component) ⇒ `promise`

Uses an XMLHttpRequest to load an external file.

Kind: instance method of GamefaceComponents
Returns: promise - - a promise that is resolved with the file’s text content.

Param	Type	Description
component	`string`	the url of the file.

gamefaceComponents.requestResource(url) ⇒ `promise`

Execute an XMLHttpRequest to load a resource by url.

Kind: instance method of GamefaceComponents
Returns: promise - - promise which resolves with the loaded resource

Param	Type	Description
url	`string`	the path to the resource

gamefaceComponents.findSlots(parent, parentElName, result) ⇒ `Object`

Recursively finds the slot elements in a given element.

Kind: instance method of GamefaceComponents
Returns: Object - result

Param	Type	Description
parent	`HTMLElement`	the element which is searched for slots.
parentElName	`string`
result	`object`	a key:value object containing the slot elements under their data-name as value: { : HTMLElement }

gamefaceComponents.replaceSlots(source, target)

Will replace the slot element

Kind: instance method of GamefaceComponents

Param	Type
source	`Array.<HTMLElement>`
target	`HTMLElement`

gamefaceComponents.transferContent(source, target)

Transfers the slottable elements into their slots.

Kind: instance method of GamefaceComponents

Param	Type	Description
source	`HTMLElement`	the element containing the slottable elements.
target	`HTMLElement`	the element containing the slots elements.

gamefaceComponents.renderOnce(element) ⇒ `boolean`

Renderes an element only if it wasn’t rendered before that

Kind: instance method of GamefaceComponents
Returns: boolean - - true if it was rendered, false if not

Param	Type
element	`HTMLElement`

gamefaceComponents.render(element)

Renders an element’s content into its template.

Kind: instance method of GamefaceComponents

Param	Type	Description
element	`HTMLElement`	the element into which to render the content

gamefaceComponents.transferChildren(element, targetContainerSelector, children)

Used to render.

Kind: instance method of GamefaceComponents

Param	Type	Description
element	`HTMLElement`	the element which will be rendered
targetContainerSelector	`string`	the selector of the parent element
children	`Array.<HTMLElement>`	the child elements that need to go into the parent

gamefaceComponents.waitForFrames(callback, count) ⇒ `any`

Delay the execution of a callback function by n amount of frames. Used to retrieve the computed styles of elements.

Kind: instance method of GamefaceComponents

Param	Type	Default	Description
callback	`function`		the function that will be executed.
count	`number`	`3`	the amount of frames that the callback execution should be delayed by.

gamefaceComponents.isBrowserGameface() ⇒ `boolean`

Checks if the current user agent is Cohtml

Kind: instance method of GamefaceComponents

gamefaceComponents.isNumberPositiveValidation(propName, value) ⇒ `boolean`

Check if a value is a number and if not - log an error

Kind: instance method of GamefaceComponents
Returns: boolean - - true if it is a number or a string that can be cast to number, false if not

Param	Type	Description
propName	`string`	the name of the property that needs to be validated
value	`any`

ComponentSlot

Class that will handle gameface components slot element

Kind: global class

isNativeTextField(element) ⇒ `boolean`

Checks if the passed element is a native text field

Kind: global function

Param	Type
element	`HTMLElement`