Ember Latest
The latest build of Ember.
HTML
<script src="http://builds.emberjs.com/handlebars-1.0.0-rc.4.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="posts">
{{outlet}}
<ul>
{{#each post in controller}}
<li>
{{#linkTo posts.show post}}
{{post.title}}
{{/linkTo}}
</li>
{{/each}}
<li> {{#linkTo posts}}BACK{{/linkTo}}</li>
</ul>
</script>
<script type="text/x-handlebars" data-template-name="posts/show">
{{title}}
</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({
LOG_TRANSITIONS: true
});
App.initializer({
name: 'google-analytics',
initialize: function(container, app) {
var router = container.lookup('router:main');
router.addObserver('url', function() {
var lastUrl = undefined;
return function() {
Ember.run.next(function() {
var url = router.get('url');
if (url !== lastUrl) {
lastUrl = url;
console.log("Google Analytics: " + url);
}
});
};
}());
}
});
App.IndexRoute = Ember.Route.extend({
redirect: function(){
this.transitionTo('posts')
}
});
App.PostsRoute = Ember.Route.extend({
model: function(){
return [
{id: 1, title: "first"},
{id: 2, title: "second"}
];
}
});
App.Router.map(function(){
this.resource('posts',function(){
this.route('show', {path: '/:post_id'});
});
});