JSFiddle - React, Tailwind, and code Playground

by pauldechov

HTML

<script src="http://cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.0.beta.6.js"></script>
<script src="http://cloud.github.com/downloads/emberjs/ember.js/ember-latest.js"></script>
<script src="http://cloud.github.com/downloads/emberjs/data/ember-data-latest.js"></script>
<script src="https://github.com/downloads/emberjs/ember.js/ember-1.0.pre.min.js"></script>
<script type="text/x-handlebars" data-template-name="application">
    {{outlet}}
</script>

<script type="text/x-handlebars" data-template-name="home">
    <a {{action gotoOne href=true}}>One</a>
</script>

JavaScript

App = Em.Application.create({});

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

App.HomeController = Em.Controller.extend({});
App.HomeView = Em.View.extend({
    templateName: 'home'
});

App.Router = Em.Router.extend({
    enableLogging: true,
    location: 'none',

    root: Em.Route.extend({
        gotoOne: Em.Route.transitionTo('index.one'),
        index: Em.Route.extend({
            route: '/',
            connectOutlets: function(router) {
                router.get('applicationController').connectOutlet('home');
            },
            
            one: Em.Route.extend({
                route: '/one'
            })
        }),
        
    })
});

App.initialize();