JSFiddle - React, Tailwind, and code Playground

by mehulkar

HTML

<script src="http://cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.0.beta.6.js"></script>
<script src="http://mochaleaf.com/ember.js"></script>
<script src="http://mochaleaf.com/ember-data.js"></script>
<script type='text/x-handlebars'>
{{#each post in App.postsController.tutorial_posts}}
<li>{{post}}</li>
{{/each}}
</script>

JavaScript

App = Ember.Application.create();

App.store = DS.Store.create({
    revision: 5,
    adapter: DS.RESTAdapter.create({
        bulkCommit: false
    })
});

App.Post = DS.Model.extend({
    name: DS.attr("string"),
    author: DS.belongsTo("App.Author"),
    type: DS.attr('string')
});

App.Author = DS.Model.extend({
    name: DS.attr("string")
});

App.store.load(App.Post, 
    {id: 1, name: "cool post", type:'tutorial', author_id: 1},
    {id: 2, name: '2nd post', type: 'review', author_id: 1}
);


App.postsController = Ember.ArrayController.create({
    tutorial_posts: (function() {
        return this.get('content').filterProperty('type', 'tutorial');
    }).property('[email protected]'),
    
  review_posts: (function() {
    return this.get('content').filterProperty('type', 'review');
  }).property('[email protected]')
                     
});

App.initialize()
App.postsController.set('content', []);
App.postsController.pushObject(App.Post.find(1));
App.postsController.pushObject(App.Post.find(2));

a = App.Post.createRecord({});
App.postsController.tutorial_ports.pushObject(a);