JSFiddle - React, Tailwind, and code Playground

by meddle

HTML

<script src="https://github.com/downloads/wycats/handlebars.js/handlebars-1.0.0.beta.6.js"></script>
<script src="https://github.com/downloads/emberjs/ember.js/ember-1.0.pre.js"></script>

JavaScript

myrouter = Ember.Router.extend({
    enableLogging: true,
    root: Ember.Route.extend({
        index: Ember.Route.extend({
            route: '/',
            redirectsTo: 'first'                
        }),
        first: Ember.Route.extend({
         route: '/first',
         connectOutlets: function(router) {
          router.get('applicationController').connectOutlet('myFirst');
         },
            changeview: Ember.Route.transitionTo('second'),
        }),
        second: Ember.Route.extend({
         route: '/second',
         connectOutlets: function(router) {
          router.get('applicationController').connectOutlet('mySecond');
         },
            changeview: Ember.Route.transitionTo('first')
        })           
    })
});

Ember.TEMPLATES['appTmpl'] = Ember.Handlebars.compile('{{x}} {{outlet}} <a {{action changeview}} href="#">Change View</a>');
Ember.TEMPLATES['firstTmpl'] = Ember.Handlebars.compile('First view: {{x1}}');
Ember.TEMPLATES['secondTmpl'] = Ember.Handlebars.compile('Second view: {{x2}} and {{y2}}');

appCtrl = Em.Controller.extend({x:'Application Controller Property'});
appView = Em.View.extend({ templateName: 'appTmpl'});

myFirstCtrl = Ember.Controller.extend({x1:'1st controller property'});
myFirstView = Ember.View.extend({x1:'1st view property',templateName: 'firstTmpl'});

mySecondCtrl = Ember.Controller.extend({x2Binding:'App.router.myFirstController.x1', y2:'Second controller property'});
mySecondView = Ember.View.extend({templateName: 'secondTmpl'});
App = Ember.Application.create({
    VERSION: "0.0.1",
    Router: myrouter,
    ApplicationController: appCtrl,
    ApplicationView: appView,
    MyFirstController: myFirstCtrl,
    MyFirstView: myFirstView,   
    MySecondController: mySecondCtrl ,
    MySecondView: mySecondView ,
});
App.initialize();