View

Lateralus.Component. View

new View()

This class builds on the ideas and APIs of Backbone.View.

Source:

Extends

  • Backbone.View

Members

(readonly) component :Lateralus.Component

A reference to the Lateralus.Component to which this Lateralus.Component.View belongs.

Source:
Type:

components :Object.<Lateralus.Component>

The subcomponents belonging to this object. Do not modify this property directly, it is managed by Lateralus.

Mixes In:
Source:
Type:

(readonly) lateralus :Lateralus

A reference to the central Lateralus instance.

Source:
Type:

lateralusEvents :Object|undefined

A map of functions or string references to functions that will handle events dispatched to the central Lateralus instance.

const ExtendedComponent = Lateralus.Component.extend({
  name: 'extended',

  lateralusEvents: {
    anotherComponentChanged: 'onAnotherComponentChanged',

    anotherComponentDestroyed: function () {
      // ...
    }
  },

  onAnotherComponentChanged: function () {
    // ...
  }
});
Mixes In:
Default Value:
  • undefined
Source:
Type:
  • Object | undefined

modelEvents :Object|undefined

A map of functions or string references to functions that will handle events emitted by this.model.

const ExtendedComponent = Lateralus.View.extend({
  modelEvents: {
    changed:someProperty: function (model, someProperty) {
      // ...
    }
  }
});
Mixes In:
Default Value:
  • undefined
Source:
Type:
  • Object | undefined

parentView :Lateralus.Component.View|null

If this is a subview of another Lateralus.Component.View, this property is a reference to the parent Lateralus.Component.View.

Properties:
Name Type Description
parentView
Default Value:
  • null
Source:
Type:

provide :Object|undefined

A map of functions that will handle Lateralus.mixins#collect calls. Each of the functions attached to this Object should return a value. These functions must be completely synchronous.

const App = Lateralus.beget(function () {
  Lateralus.apply(this, arguments);
});

_.extend(App.prototype, {
  provide: {
    demoData: function () {
      return 1;
    }
  }
});

const app = new App();
const ComponentSubclass = Lateralus.Component.extend({
  name: 'provider',
  provide: {
    demoData: function () {
      return 2;
    }
  }
});

app.addComponent(ComponentSubclass);
console.log(app.collect('demoData')); // [1, 2]
Mixes In:
Source:
Type:
  • Object | undefined

template :string|null

The DOM template to be used with this View.

Default Value:
  • {null}
Source:
Type:
  • string | null

Methods

addSubview(Subview, subviewOptionsopt) → {Lateralus.Component.View}

Adds a subview. Subviews are lighter than subcomponents. It is preferable to use a subview rather than a subcomponent when there is clear interdependency between two Views. This pattern is useful when you want to keep display logic well-organized into several Views, but have it compartmentalized within a single component.

Source:
Parameters:
Name Type Attributes Description
Subview Lateralus.Component.View

A constructor, not an instance.
subviewOptions Object <optional>

Backbone.View constructor options to pass along to the subview when it is instantiated.
Returns:
Type:
Lateralus.Component.View

The instantiated subview.

deferredInitialize()

A function to be called in the next JavaScript thread. This can be necessary for situations where setup logic needs to happen after a View has been rendered.

In other words, Lateralus.Component.View#initialize runs before the View has been rendered to the DOM, and deferredInitialize runs immediately after it has been rendered.

Source:

dispose()

Remove this Lateralus.Component.View from the DOM and cleanly dispose of any references.

Source:

getTemplateRenderData() → {Object}

This method returns the object whose properties are used as render variables in Lateralus.Component.View#renderTemplate. The method can be overridden.

Source:
Returns:
Type:
Object

The raw Backbone.Model data, if this View has a Model. Otherwise, an empty object is returned.

initialize(optsopt)

This is called when a Lateralus.Component.View is initialized, it is not called directly.

Lateralus.Component.View subclasses that override initialize must call this base method:

const Base = Lateralus.Component.View;
const baseProto = Base.prototype;

const ExtendedComponentView = Base.extend({
  initialize: function () {
    baseProto.initialize.apply(this, arguments);
    // Other logic...
  }
});
Source:
Parameters:
Name Type Attributes Description
opts Object <optional>

Any properties or methods to attach to this Lateralus.Component.View instance.

renderTemplate()

Meant to be called by Lateralus.Component.View#initialize and infrequently thereafter, this method empties out $el and does a full re-render. render should only be used for partial renders.

Source:

toString() → {string}

Source:
Returns:
Type:
string

The name of this View. This is used internally by Lateralus.