JSFiddle - React, Tailwind, and code Playground

by krisselden

HTML

<script src="http://cloud.github.com/downloads/emberjs/ember.js/ember-0.9.2.js"></script>
<button id="view-create">Create View</button>
<button id="view-destroy" style="display:none">Destroy View</button>
<div id="app-root"></div>

JavaScript

var viewCreate$, viewDestroy$;

window.App = Em.Application.create({
    rootElement: '#app-root'
});

App.HelloView = Em.View.extend({
    render: function(buffer) {
        buffer.push('Hello World');
    }
});

function cleanGlobalTuple() {
    Em.normalizeTuple(window, 'Em.A');
}

function createView() {
    App.helloView = App.HelloView.create();
    App.helloView.appendTo('#app-root');
}

function destroyView() {
    if (App.helloView) {
        App.helloView.destroy();
        delete App.helloView;
        cleanGlobalTuple();
    }
}

viewCreate$ = $('#view-create');
viewDestroy$ = $('#view-destroy');
viewCreate$.click(function() {
    createView();
    viewCreate$.hide();
    viewDestroy$.show();
});
viewDestroy$.click(function() {
    destroyView();
    viewDestroy$.hide();
    viewCreate$.show();
});