NamedViewSelector

gistfile1.js

//viewport for https://github.com/scttnlsn/backbone.viewkit
var NamedViewSelector = Backbone.ViewKit.ViewPort.extend({
  constructor: function (options) {
    options || (options = {});

    this._views = options.views || {};
    _.each(this._views, function(view) {
      view.viewSelector = this;
    }, this);

    this.transitions = options.transitions || {
      left: new Backbone.ViewKit.Transitions.Slide(),
      right: new Backbone.ViewKit.Transitions.Slide({ reverse: true })
    };

    Backbone.ViewKit.ViewPort.prototype.constructor.apply(this, arguments);
  },

  selectView: function(name, direction) {
    if (!this._views[name]) {
      throw new Error("View doesn't exist.");
    }

    this._name = name;
    this.render(this.transitions[direction || 'right']);
    this.trigger('selected', this.getView(), name);
  },

  getView: function () {
    return this._views[this._name];
  }
});

// usage

var viewSelector = new NamedViewSelector({
  views: { foo: new FooView(), bar: new BarView() }
});

viewSelector.selectView('foo');
viewSelector.selectView('bar');