Ember Data Canary
Using Sinon to mock server
HTML
<script src="http://builds.emberjs.com/handlebars-1.0.0.js"></script>
<script src="http://builds.emberjs.com/canary/ember.js"></script>
<script src="http://builds.emberjs.com/canary/ember-data.js"></script>
<script src="https://dl.dropboxusercontent.com/u/5739722/js/fake_xml_http_request.js"></script>
<script src="https://dl.dropboxusercontent.com/u/5739722/js/fakehr.js"></script>
<script src="https://dl.dropboxusercontent.com/u/5739722/js/httpRespond.js"></script>
<script type="text/x-handlebars" data-template-name="application">
<h1>ember-canary jsfiddle</h1>
{{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="index">
<h2>Index Content:</h2>
{{#each}}{{this.firstName}} {{this.date}}{{/each}}
</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
(function(host) {
fakehr.start();
host.App = Ember.Application.create({});
App.APIConfig = Ember.Object.extend({
namespace: 'v1'
});
App.ApplicationAdapter = DS.RESTAdapter.extend({
namespace: Ember.computed.readOnly('config.namespace')
});
Ember.Application.initializer({
name: 'config',
before: 'store',
initialize: function(container, app) {
container.register('config:main', App.APIConfig, { singleton: true });
app.inject('adapter:application', 'config', 'config:main');
}
});
App.IndexRoute = Ember.Route.extend({
model: function(){
var people = this.store.findAll('person');
Ember.run.later(function(){
httpRespond('get', '/v1/people', '{ "people": [{ "id": 1, "firstName": "Joe", "date": "Mon, 21 Apr 2014 01:59:15 +0000"}] }');
}, 15);
return people;
}
});
App.Person = DS.Model.extend({
firstName: DS.attr(),
date: DS.attr('date')
});
}(window));