Ember WordPress test 3

To extend http://broerse.net/ember/wp2/ I added a fix for the WordPress JetPack ‘ID’. Ember uses ‘id’ by default. See:


You can download the source from http://broerse.net/ember/wp3/wp3.zip or download the Ember Starter kit from http://emberjs.com/ and replace app.js and index.html with these files:


<!DOCTYPE html>
<meta charset="utf-8">
<title>Ember Starter Kit</title>
  <link rel="stylesheet" href="css/bootstrap.css">
  <link rel="stylesheet" href="css/normalize.css">
  <link rel="stylesheet" href="css/style.css">
  <script type="text/x-handlebars">
    <div class="navbar">
      <div class="navbar-inner">
        <a class="brand" href="#">Home</a>
        <ul class="nav">
          <li>{{#linkTo 'posts'}}Posts{{/linkTo}}</li>

  <script type="text/x-handlebars" id="posts">
    <div class="container-fluid">
      <div class="row-fluid">
        <div class="span3">
          <table class='table'>
              <tr><th>Recent Posts</th></tr>
            {{#each model}}
              {{#linkTo 'post' this}}{{{title}}}{{/linkTo}}
        <div class="span9">

  <script type="text/x-handlebars" id="posts/index">
    <p>Please select a post</p>

  <script type="text/x-handlebars" id="post">
    <h2>by {{{author.name}}} <small class='muted'>({{date}})</small></h2>




  <script src="js/libs/jquery-1.10.2.js"></script>
  <script src="js/libs/handlebars-1.1.2.js"></script>
  <script src="js/libs/ember-1.2.0.js"></script>
  <script src="js/app.js"></script>


App = Ember.Application.create();

App.Router.map(function() {
  this.resource('posts', function() {
    this.resource('post', { path: ':post_id' });

App.Post = Ember.Object.extend();

  findAll: function() {
    return Ember.$.ajax({ url: 'http://public-api.wordpress.com/rest/v1/sites/58826716/posts/?number=10', dataType: "jsonp", type: 'GET' }).then(function(data) {
      return data.posts.map(function(post) {
        post['id'] = post['ID'];
        delete post['ID'];
        return App.Post.create(post);

  find: function(id) {
    return Ember.$.ajax({ url: 'http://public-api.wordpress.com/rest/v1/sites/58826716/posts/' + id + '/', dataType: "jsonp", type: 'GET' }).then(function(post) {
      post['id'] = post['ID'];
      delete post['ID'];
      return App.Post.create(post);


App.PostsRoute = Ember.Route.extend({
  model: function() {
    return App.Post.findAll();

App.PostRoute = Ember.Route.extend({
  model: function(params) {
    return App.Post.find(params.post_id);


Comments are closed.