Simplify routing by removing mvc/Controller

[zship]

The path that a route takes from a url change to a View rendering seems a bit complex to me:

(init/popstate event) -> Router#exec -> Route#exec -> Controller#(method) -> Controller#view -> ViewManager#load -> View#render

There's also boilerplate in writing every Controller name and method in both the Controller subclass and app.js.

How about this instead?

// app.js

// was referenced through Controller#viewManager
var viewManager = require('lavaca/mvc/ViewManager');

var app = new Application(function() {
  this.router.add({
    // adaptation of mutualmobile/lavaca-starter app/net/HomeController
    '/': function index(params, state) {
        var model = new Model();
        return viewManager.load(HomeView, model) // instead of Controller#view()
            .then(function() {
                // instead of Controller#history, use HTML5 History API
                History.pushState(state, 'Home Page', params.url);
            });
    },
    '/other': function() {
    }
  });
});

That'd remove mvc/Controller. Controller implementations are usually pretty short (one or two methods), so the above seems doable for all of an application's routes. If a user wanted to split them up, though, they could do something like this:

// app/net/HomeController
define(function(require) {
    var viewManager = require('lavaca/mvc/ViewManager');
    //just a plain object
    return {
        '/': function index(params, state) {
            var model = new Model();
            return viewManager.load(HomeView, model)
                .then(function() {
                    History.pushState(state, 'Home Page', params.url);
                });
        }
    };
});

// app/net/OtherController
define(function(require) {
    var viewManager = require('lavaca/mvc/ViewManager');
    return {
        '/test': function test(params, state) {
            var model = new Model();
            return viewManager.load(TestView, model)
                .then(function() {
                    History.pushState(state, 'Test', params.url);
                });
        }
    };
});

And then in app.js:

// app.js

var mixIn = require('mout/object/mixIn');
var HomeController = require('app/net/HomeController');
var TestController = require('app/net/TestController');

var app = new Application(function() {
  this.router.add(mixIn(
    HomeController,
    TestController
  ));
});