Ember Latest

The latest build of Ember.

HTML

<script src="http://builds.emberjs.com/handlebars-1.0.0.js"></script>
<script src="http://builds.emberjs.com/ember-latest.js"></script>
<script type="text/x-handlebars" data-template-name="application">
    <h1>ember-latest jsfiddle</h1>
    {{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="foos">
  {{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="foos/index">
  <ul>
  {{#each}}
      <li>{{link-to firstName 'foos.show' id}} {{lastName}}</li>
  {{/each}}
   </ul>
</script>
<script type="text/x-handlebars" data-template-name="foos/show">
  {{link-to 'Show All' 'foos'}}
  <div>First name: {{firstName}}</div>
  <div>Last name: {{lastName}}</div>
</script>

CSS

h1 { font-size: 1.6em; padding-bottom: 10px; }
h2 { font-size: 1.4em; }
ul { padding: 15px; font-size: 1.4em; color: green; }

JavaScript

App = Ember.Application.create({});

var FIXTURE = [
    {id: 1, firstName: 'Kris', lastName: 'Selden'},
    {id: 2, firstName: 'Luke', lastName: 'Melia'},
    {id: 3, firstName: 'Formerly Alex', lastName: 'Matchneer'}
];

App.Router = Ember.Router.extend({
    logUrl: function() {
        var routeName = this.get('router.state.handlerInfos.lastObject.handler.routeName');
        console.log('Logging', routeName);
        console.log('Logging Url', window.location.href);
    }.on('didTransition')
});

App.Router.map(function() {
    this.resource('foos', { path: '/' }, function() {
        this.route('show', { path: '/:id' });
    });
});

App.FoosRoute = Ember.Route.extend({});

App.FoosIndexRoute = Ember.Route.extend({
    model: function() {
      return FIXTURE;
    }
});

App.FoosShowRoute = Ember.Route.extend({
    model: function(params) {
      return FIXTURE.findBy('id', parseInt(params.id, 10));
    }
});