Ember.js 2013-01-06 w/ Ember Data

Based on latest version of Ember.js with the new router. (latest ember build from 2013-01-06) Also including latest master of Ember Data (2013-01-06)

by brennan

HTML

<script src="https://github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.js"></script>
<script src="https://gist.github.com/raw/4469745/b102ee742d0c014bdb21715525255069d0b828bb/ember-latest-201301062045.js"></script>
<script src="https://gist.github.com/raw/8002d19b860a9dcd0f89/1b8ed4a66ef696c537466e6dd23fdb76dc804b57/ember-data-latest-2013-01061909.js"></script>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script type="text/x-handlebars" data-template-name="application">
<div class="navbar navbar-inverse">
      <div class="navbar-inner">
        <div class="container">
          <a class="brand">Emberjs Contributors</a>
        </div>
      </div>
    </div>
  
  <div class="container">{{outlet}}</div>
</script>

<script type="text/x-handlebars" data-template-name="status">
  {{#if content}}
    {{#each item in content}}
      {{view App.AuthorView contentBinding="item"}}
    {{/each}}
  {{else}}
        <img src="http://www.deadmau5.com/wp-content/themes/deadmau5/images/ajax-loader.gif">
  {{/if}}
</script>
  
<script type="text/x-handlebars" data-template-name="authorView">
  <div class="media">
    <a class="pull-left" href="#">
      <img {{bindAttr src="view.content.avatar_url"}}>
    </a>
    <div class="media-body">
      <h4 class="media-heading">{{view.content.login}}</h4>
      <p>Has contributed {{view.content.contributions}} things</p>
    </div>
  </div>
</script>

JavaScript

App = Ember.Application.create();

App.ApplicationController = Ember.Controller.extend();
App.ApplicationView = Ember.View.extend({
  templateName: 'application'
});

App.StatusView = Ember.View.extend({
  
});

App.StatusController = Ember.ArrayController.extend({
  init: function(){
    this._super();
    var this_ = this,
        people = $.getJSON('https://api.github.com/repos/emberjs/ember.js/contributors');
      
    people.success(function(response){
      this_.set('content', response)
    });
  }
});


App.AuthorView = Ember.View.extend({
  templateName: "authorView",
  click: function(){
    this.$().slideUp(300);
  }
});


App.Router.map(function(match) {
  match("/").to("status");
});