JSDoc: Class: View

new View(params)

Create a View

Parameters:

Name Type Description

params

Object

Properties

Name	Type	Description
`selector`	string	Parent element of view. Also the default element when a selector is not passed in to methods. Must be a valid CSS selector string.
`template`	function	A template function used for rendering.
`events`	Array.<View~Event>	Events will be passed to addEvents.
`route`	Router~Route	Route will be passed to addRoute.
`uri`	string	The default uri to use when fetch is called.
`binded`	Array.<string>	Strings will be passed to addBinded.

Members

$selector

Get a Query instance of the selector passed in to the view constructor.

documentListener

Get DocumentListener singleton.

eventBus

Get EventBus singleton.

router

Get Router singleton.

Methods

addBinded(binded)

Convenience method to help bind view methods to this (eg. 'foo' -> this.foo.bind(this)). Binded methods can be accessed using this.binded.foo.

Parameters:

Name	Type	Description
`binded`	Array.<string>

addEvents(events)

Events will be passed to DocumentListener.on for DOM events and View.on for custom events. If Event.context is not set, it will default to the View instance.

Parameters:

Name	Type	Description
`events`	Array.<View~Event>

addRoute(route)

Route will be passed to Router.add. Route.listener should be passed in as a string and will be changed to a method on the View instance. (eg. 'show' -> this.show).

Parameters:

Name	Type	Description
`route`	Router~Route

(async) fetch(params) → {View~FetchResult}

Wrapper for native fetch. The response is automatically parsed as JSON. If browser does not support fetch, this falls back to xhr

Parameters:

Name Type Description

params

Object

All params passed in will be passed to native fetch.

Properties

Name	Type	Description
`uri`	string	the remote URI.

Returns:

Type: View~FetchResult

off(type, listener)

convenience method passed to EventBus.off.

Parameters:

Name	Type	Description
`type`	string	the name of the event to stop listening to.
`listener`	function	The callback function for this event.

on(type, listener, contextopt)

convenience method passed to EventBus.on.

Parameters:

Name	Type	Attributes	Default	Description
`type`	string			the name of the event to listen on.
`listener`	function			The callback function for when this event is triggered.
`context`	object	<optional>	this	The value of 'this' provided to the listener.

render(paramsopt)

Takes the passed in data object, runs it through the template function and inserts it into the selector element. Passing params is optional and will default to the params passed to the view instance constructor.

Parameters:

Name Type Attributes Description

params

Object

Properties

Name	Type	Description
`selector`	string	The selector that the resulting HTML will be inserted in to. If none is passed in, will default to the selector passed to the Class constructor.
`template`	function	A template function. If none is passed in, will default to the template passed to the Class constructor.
`data`	Object	An object that will be passed to the template function.
`append`	boolean	[false] - If true, will append the HTML to the selector element as opposed to replacing the entire innerHTML.
`prepend`	boolean	[false] - If true, will prepend the HTML to the selector element as opposed to replacing the entire innerHTML.

trigger(type, data)

convenience method passed to EventBus.trigger.

Parameters:

Name	Type	Description
`type`	string	the name of the event to trigger.
`data`	object	Arbitrary data to pass with the event.

Type Definitions

Event

Type:

object

Properties:

Name	Type	Description
`type`	string	DOM event (eg. 'click') or custom event ('myevent').
`selector`	string	If it's a DOM event, the selector to listen on.
`listener`	string	The callback function for when this event is triggered. Param is passed in as a string and turned in to a method on the View instance (eg. 'show' -> this.show).
`context`	Object	The value of 'this' provided to the listener.

FetchResult

Type:

object

Properties:

Name	Type	Description
`data`	object	The JSON data returned from the remote call.
`error`	boolean	If the response status > 400, this is set to true.
`status`	number	The http response code