import ManageTodosView from 'backbone-parse-es6-todos/site/js/views/ManageTodosView.js'

public class | source

ManageTodosView

Extends:

Events → View → ManageTodosView

The main view that lets a user manage their todos Items. When the various items are rendered they are tracked in the itemViews map so that they can be cleaned up correctly.

Constructor Summary

Public Constructor
public	constructor(options: object) Extends the optional parameters with the element this view is associated with to `.content`.

Member Summary

Public Members
public	allCheckbox: object
public get	events: object: * Delegated events for creating new items and clearing completed ones.
public	input: object
public	itemViews: Array<ItemView> Stores all current `ItemViews` so that they may be properly cleaned up.
public get	statsTemplate: * The template for the line of statistics at the bottom of the app.

Method Summary

Public Methods
public	addAll() Add all items in the Todos collection at once.
public	addOne(item: Item) Add a single item to the list by creating a view for it, and appending its element to the `<ul>`.
public	addSome(filter: function) Only adds some todos, based on a filtering function that is passed into `addSome`.
public	clearAll() Iterates through the `itemViews` map invoking the `Backbone.View->remove` method for each `ItemView` tracked.
public	clearCompleted() Clear all done todos items, destroying their models.
public	createOnEnter(e: object) If you hit return in the main input field, create new Item model.
public	filter() Invoked when the TodoList collection is reset and when the app state changes.
public	initialize(options: object) At initialization we bind to the relevant events on the `Todos` collection, when items are added or changed.
public	render() Re-rendering the App just means refreshing the statistics -- the rest of the app doesn't change.
public	toggleAllComplete() Toggles all todos items to completed / done then saves each item.

Inherited Summary

From class Events
public	bind(): * Delegates to `on`.
public	listenTo(obj: object, name: string, callback: function): Events Tell an object to listen to a particular event on an other object.
public	listenToOnce(obj: object, name: string, callback: function): Events Just like `listenTo`, but causes the bound callback to fire only once before being removed.
public	off(name: string, callback: function, context: object): Events Remove a previously-bound callback function from an object.
public	on(name: string, callback: function, context: object): * Bind a callback function to an object.
public	once(name: string, callback: function, context: object): * Just like `on`, but causes the bound callback to fire only once before being removed.
public	stopListening(obj: object, name: string, callback: function): Events Tell an object to stop listening to events.
public	trigger(name: string): Events Trigger callbacks for the given event, or space-delimited list of events.
public	unbind(): * Delegates to `off`.

From class View
public get	tagName: string: string The default `tagName` of a View's element is `"div"`.
public	$el: object Cached jQuery context for element.
public	cid: number Client ID
public	el: Element Cached element
public	$(selector: string): Element \| $ If jQuery is included on the page, each view has a $ function that runs queries scoped within the view's element. If you use this scoped jQuery function, you don't have to use model ids as part of your query to pull out specific elements in a list, and can rely much more on HTML class attributes.
public	delegate(eventName: string, selector: string, listener: function): View Add a single event listener to the view's element (or a child element using `selector`). This only works for delegate-able events: not `focus`, `blur`, and not `change`, `submit`, and `reset` in Internet Explorer.
public	delegateEvents(events: object): View Uses jQuery's on function to provide declarative callbacks for DOM events within a view. If an events hash is not passed directly, uses this.events as the source. Events are written in the format {"event selector": "callback"}. The callback may be either the name of a method on the view, or a direct function body. Omitting the selector causes the event to be bound to the view's root element (this.el).
public abstract	initialize() Initialize is an empty function by default.
public	remove(): View Removes a view and its el from the DOM, and calls stopListening to remove any bound events that the view has listenTo'd.
public abstract	render(): View The default implementation of render is a no-op.
public	setElement(element: string \| object): View If you'd like to apply a Backbone view to a different DOM element, use setElement, which will also create the cached $el reference and move the view's delegated events from the old element to the new one.
public	undelegate(eventName: string, selector: string, listener: function): View A finer-grained `undelegateEvents` for removing a single delegated event.
public	undelegateEvents(): View Removes all of the view's delegated events. Useful if you want to disable or remove a view from the DOM temporarily.
protected	_createElement(tagName: string): Element Produces a DOM element to be assigned to your view.
protected	_ensureElement() Ensure that the View has a DOM element to render into.
protected	_removeElement() Remove this view's element from the document and all event listeners attached to it.
protected	_setAttributes(attributes: object) Set attributes from a hash on this view's element.
protected	_setElement(el: string \| object) Creates the `this.el` and `this.$el` references for this view using the given `el`.

Public Constructors

public constructor(options: object) source

Extends the optional parameters with the element this view is associated with to .content.

Override:

View#constructor

Params:

Name	Type	Attribute	Description
options	object		optional parameters

Name

Type

Attribute

Description

options

object

optional parameters

Public Members

public allCheckbox: object source

public get events: object: * source

Delegated events for creating new items and clearing completed ones.

Return:

object

public input: object source

public itemViews: Array<ItemView> source

Stores all current ItemViews so that they may be properly cleaned up.

public get statsTemplate: * source

The template for the line of statistics at the bottom of the app.

Public Methods

public addAll() source

Add all items in the Todos collection at once.

public addOne(item: Item) source

Add a single item to the list by creating a view for it, and appending its element to the <ul>.

Params:

Name	Type	Attribute	Description
item	Item		Item to add.

Name

Type

Attribute

Description

item

Item

Item to add.

public addSome(filter: function) source

Only adds some todos, based on a filtering function that is passed into addSome.

Params:

Name	Type	Attribute	Description
filter	function		A function to filter the Items.

Name

Type

Attribute

Description

filter

function

A function to filter the Items.

public clearAll() source

Iterates through the itemViews map invoking the Backbone.View->remove method for each ItemView tracked. The map is then cleared.

public clearCompleted() source

Clear all done todos items, destroying their models.

public createOnEnter(e: object) source

If you hit return in the main input field, create new Item model. The creation of the item is handled over the eventbus via triggering app:create:item which invokes App.js->createItem.

Params:

Name	Type	Attribute	Description
e	object		event data

Name

Type

Attribute

Description

object

event data

public filter() source

Invoked when the TodoList collection is reset and when the app state changes.

public initialize(options: object) source

At initialization we bind to the relevant events on the Todos collection, when items are added or changed. Kick things off by loading any preexisting todos that might be saved to Parse.

Override:

View#initialize

Params:

Name	Type	Attribute	Description
options	object		optional parameters

Name

Type

Attribute

Description

options

object

optional parameters

public render() source

Re-rendering the App just means refreshing the statistics -- the rest of the app doesn't change.

Override:

View#render

public toggleAllComplete() source

Toggles all todos items to completed / done then saves each item.