Ember latest Template

by krisselden

HTML

<script src="http://cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.0.beta.6.js"></script>
<script src="http://cloud.github.com/downloads/emberjs/ember.js/ember-latest.js"></script>

JavaScript

App = Ember.Application.create();

function bindOneWay(obj, to, from) {
    Ember.defineProperty(obj, to, Ember.computed(function() {
        if (arguments.length > 1) {
            throw new Error(to + " is a readonly property");
        }
        return obj.get(from);
    }).property(from));
}

App.OutletsView = Ember.ContainerView.extend({
    init: function() {
        var outlets = this.outlets,
            i, len, outlet;
        this._super();
        for (i = 0, len = outlets.length; i < len; i++) {
            outlet = outlets[i];
            Ember.addObserver(this, outlet, null, 'outletDidChange');
            bindOneWay(this, outlet, 'controller.' + outlet);
        }
    },
    outletDidChange: function(obj, key) {
        Em.run.once(this, 'updateOutlets');
    },
    updateOutlets: function() {
        var outlets = this.outlets,
            childViews = this.get('childViews'),
            outletViews = [],
            view, i, len;
        len = childViews.length;
        while (len--) {
            childViews[len].destroy();
        }
        for (i = 0, len = outlets.length; i < len; i++) {
            view = this.get(outlets[i]);
            if (view) {
                outletViews.push(view);
            }
        }
        childViews.replace(0, 0, outletViews);
    }
});

App.HeaderView = Em.View.extend({
    template: function() {
        return 'Header';
    }
});

App.FooterView = Em.View.extend({
    template: function() {
        return 'Footer';
    }
});

App.MainView = Em.View.extend({
    template: function() {
        return 'Hello World';
    }
});

App.ApplicationView = App.OutletsView.extend({
    outlets: ['header', 'view', 'footer']
});

App.ApplicationController = Ember.Controller.extend();

App.Router = Ember.Router.extend({
    root: Ember.Route.extend({
        index: Ember.Route.extend({
            route: '/',
            connectOutlets: function(router) {
                var applicationController =...