Class: ListComponent

F. ListComponent

new ListComponent(options)

A component that can load and render a collection as a list
Parameters:
Name Type Description
options Object Options for this component and its view. Options not listed below will be passed to the view.
Properties:
Name Type Description
Collection Backbone.Collection The collection class this list will be rendered from
ListContainer Mixed The DOM element or jQuery object list items should be appended to
ListView Backbone.View The view class this list will be rendered with
ListTemplate Template The template this list will be rendered with. Renders to a UL tag by default
ItemView Backbone.View The view that individual items will be rendered with
ItemTemplate Template The template that individual items will be rendered with
Source:

Extends

Members

ListEmptyTemplate

The template to render when a list is empty. Rendered with ListEmptyView if defined, or ItemView otherwise
Source:
To Do:
  • give a default here

ListEmptyView

The view to render when the list is empty
Source:
To Do:
  • give a default here

NoResultsTemplate

The template to render when there are no results
Source:

NoResultsView

The view to render when there are no results. Defaults to using ListView
Source:

Methods

addComponent(component, componentName) → {F.Component}

Add an instance of another component as a sub-component. this[subComponent.toString()] is used to reference the sub-component: this.List.show(); You can give a component an optional custom name as the second argument, then reference as such: this.myCustomComponent.show();
Parameters:
Name Type Argument Description
component F.Component Instance of component
componentName String <optional>
 Optional custom name for this component
Inherited From:
Source:
Returns:
The sub-component that was added
Type
F.Component

bind(name)

Binds a method to the execution scope of this instance
Parameters:
Name Type Description
name String The name of the method to bind. For example, to bind this.handleClick, you would use this.bind('handleClick')
Inherited From:
Source:

bubble(componentName, evt) → {F.Component}

Set an event to bubble up the component chain by re-triggering it when the given sub-component triggers it
Parameters:
Name Type Description
componentName String Name of the component whose event to bubble
evt String Name of event to bubble up
Inherited From:
Source:
Returns:
this, chainable
Type
F.Component

clearParams() → {F.CollectionComponent}

Clear the parameters from the last fetch. Useful when using refresh() on a filtered list.
Inherited From:
Source:
Returns:
this, chainable
Type
F.CollectionComponent

fetch(fetchParams, callback) → {F.CollectionComponent}

Fetch the collection by fetching it from the server
Parameters:
Name Type Argument Description
fetchParams Object <optional>
 Parameters to pass when fetching
callback Function <optional>
 Callback to execute on successful fetch
Inherited From:
Source:
Returns:
this, chainable
Type
F.CollectionComponent

getModelFromLi(listItem) → {Backbone.Model}

Get the model associated with a list item
Parameters:
Name Type Description
listItem Mixed DOM element or jQuery Object to get model from
Source:
Returns:
The model associated with the passed DOM element
Type
Backbone.Model

getViewFromLi(listItem) → {Backbone.View}

Get the view associated with a list item
Parameters:
Name Type Description
listItem Node DOM element or jQuery Object to get model from
Source:
Returns:
The view associated with the passed DOM element
Type
Backbone.View

handleRenderComplete()

Called when view rendering is complete
Inherited From:
Source:

handleSelect(evt)

Handles item selection events
Parameters:
Name Type Description
evt Event The jQuery event object
Source:

hide(options) → {F.Component}

Hide this component
Parameters:
Name Type Argument Description
options Object <optional>
 Options object
Properties
Name Type Argument Default Description
silent Boolean <optional>
 false If true, events will not be triggered
hideChildren Boolean <optional>
 true If false, children will not be hidden automatically
Inherited From:
Source:
Returns:
this, chainable
Type
F.Component

hideAllSubComponents(except) → {F.Component}

Hide all sub-components
Parameters:
Name Type Argument Description
except String[] <optional>
 List of component names not to hide. These components will not be shown if they are already hidden
Inherited From:
Source:
Returns:
this, chainable
Type
F.Component

inDebugMode() → {Boolean}

Check if this component, or F as a whole, is in debug mode and should output debug messages
Inherited From:
Source:
Returns:
Component or F is in debug mode
Type
Boolean

init()

Performs initialization operations after all constructors have been called
Inherited From:
Source:

isVisible() → {Boolean}

Check if this component is currently visible
Inherited From:
Source:
Returns:
Component is visible
Type
Boolean

listenTo(other, event, callback)

An inversion-of-control version of on. Tell this object to listen to an event in another object keeping track of what it's listening to.
Parameters:
Name Type Description
other Object The object to listen to
event String Name of the event to listen to
callback Function Callback to execute when the event is triggered
Inherited From:
Source:

load(collectionOrData) → {F.CollectionComponent}

Load a Backbone.Collection directly or create a collection from an array of data
Parameters:
Name Type Description
collectionOrData Mixed Backbone.Collection to load or Array of Objects with data to create the collection from
Inherited From:
Source:
Returns:
this, chainable
Type
F.CollectionComponent

mergeOptions()

Merge options up the prototype chain. Options defined in the child class take precedence over those defined in the parent class.
Inherited From:
Source:

off(event, callback, context)

Remove one or many callbacks. If context is null, removes all callbacks with that function. If callback is null, removes all callbacks for the event. If events is null, removes all bound callbacks for all events.
Parameters:
Name Type Argument Description
event String <optional>
 Name of the event that is being listened to
callback Function <optional>
 Callback to remove
context Object <optional>
 Remove callbacks with the specified context
Inherited From:
Source:

on(event, callback, context)

Bind one or more space separated events, or an events map, to a callback function. Passing "all" will bind the callback to all events fired.
Parameters:
Name Type Argument Description
event String Event to listen to
callback Function Callback to execute when the event is triggered
context Object <optional>
 The value of this when the callback runs
Inherited From:
Source:

once(event, callback, context)

Bind events to only be triggered a single time. After the first time the callback is invoked, it will be removed.
Parameters:
Name Type Argument Description
event String Name of the event to listen to
callback Function Callback to execute when the event is triggered
context Object <optional>
 The value of this when the callback runs
Inherited From:
Source:

refresh(callback) → {F.CollectionComponent}

Refresh this collection with the last parameters used
Parameters:
Name Type Description
callback Function Optional callback to execute on successful fetch
Inherited From:
Source:
Returns:
this, chainable
Type
F.CollectionComponent

removeComponent(componentName) → {F.Component}

Remove and destroy a sub-component
Parameters:
Name Type Description
componentName String Component name
Inherited From:
Source:
Returns:
this, chainable
Type
F.Component

removeComponents() → {F.Component}

Remove and destroy all sub-components
Inherited From:
Source:
Returns:
this, chainable
Type
F.Component

render() → {F.Component}

Render the view associated with this component, if it has one
Inherited From:
Source:
Returns:
this, chainable
Type
F.Component

setName(componentName) → {F.Component}

Set a custom name for this component. Only useful before passing to F.Component.addComponent
Parameters:
Name Type Description
componentName String Component name
Inherited From:
Source:
Returns:
this, chainable
Type
F.Component

setPropsFromOptions(options, props) → {F.Component}

Set properties of this instance from an options object, then remove the properties from the options object
Parameters:
Name Type Description
options Object Options object with many properties
props String[] Properties to copy from options object
Inherited From:
Source:
Returns:
this, chainable
Type
F.Component

setup()

Perform setup operations before this component is shown for the first time, such as adding sub-components
Inherited From:
Source:

show(options) → {F.CollectionComponent}

Show this component. Provide options.params to fetch with new parameters. The collection will be fetched before showing if it hasn't already
Parameters:
Name Type Description
options Object Pass fetch parameters with options.params
Inherited From:
Source:
Returns:
this, chainable
Type
F.CollectionComponent

showAllSubComponents(except) → {F.Component}

Show all sub-components
Parameters:
Name Type Argument Description
except String[] <optional>
 List of component names not to show. These components will not be hidden if they are already shown
Inherited From:
Source:
Returns:
this, chainable
Type
F.Component

stopListening(other, event, callback)

Tell this object to stop listening to either specific events or to every object it's currently listening to.
Parameters:
Name Type Argument Description
other Object <optional>
 The object that is being listened to
event String <optional>
 Name of the event that is being listened to
callback Function <optional>
 Callback to remove
Inherited From:
Source:

teardown()

Perform tear-down operations after this component is hidden, such as removing sub-components. This method will not be called unless the setup() method is defined and the component has been shown previously
Inherited From:
Source:

teardownIfSetup()

Calls teardown() if necessary
Inherited From:
Source:

trigger(event, args)

Trigger one or many events, firing all bound callbacks. Callbacks are passed the same arguments as trigger is, apart from the event name (unless you're listening on "all", which will cause your callback to receive the true name of the event as the first argument).
Parameters:
Name Type Argument Description
event String Name of the event to trigger
args Mixed <optional>
<repeatable>
 Arguments to pass to callback functions
Inherited From:
Source:

unbubble(componentName, evt) → {F.Component}

Discontinue bubbling of a given event
Parameters:
Name Type Description
componentName String Name of the component whose event to stop bubbling
evt String Name of event that was set to bubble
Inherited From:
Source:
Returns:
this, chainable
Type
F.Component

Events

collection:loaded

Triggered when the collection is loaded from the server
Parameters:
Name Type Description
collection Backbone.Collection The collection that was loaded
Inherited From:
Source:

collection:loading

Triggered when the collection is being loaded from the server
Parameters:
Name Type Description
collection Backbone.Collection The collection that is being loaded
Inherited From:
Source:

component:hidden

Triggered when this component is hidden
Parameters:
Name Type Description
evt Object Event object
Properties
Name Type Description
name String This component's name
component F.Component This component
Inherited From:
Source:

component:shown

Triggered when this component is shown
Parameters:
Name Type Description
evt Object Event object
Properties
Name Type Description
name String This component's name
component F.Component This component
Inherited From:
Source:

list:itemSelected

Triggered when and item in the list is selected by tapping or clicking
Parameters:
Name Type Description
evt Object Event object
Properties
Name Type Description
listItem jQuery The list item that was touched
model Backbone.Model The model representing the item in the list
Source: