JSFiddle - React, Tailwind, and code Playground

by Lachlan Arthur

HTML

<script src="http://cdn.sencha.io/touch/1.1.0/sencha-touch.js"></script>
<link rel="stylesheet" href="http://cdn.sencha.io/touch/1.1.0/resources/css/sencha-touch.css">

JavaScript

// UNCOMMENT THIS FOR ERROR
/*
Object.prototype.union = function(obj2) {
    var output = this;
    for (var property in obj2) {
        if (obj2.hasOwnProperty(property)) {
            output[property] = obj2[property];
        }
    }
    return output;
}
*/

Ext.regModel('User', {
    fields: [
        { name: 'id',       type: 'int'    },
        { name: 'username', type: 'string' },
        { name: 'password', type: 'string' }
    ]
});

var userStore = new Ext.data.Store({
    model: 'User'
});

userStore.add({ username: 'user01', password: 'abc123' });

new Ext.Application({
    launch: function() {
        var backButton = new Ext.Button({
            text: 'Back',
            ui: 'back',
            hidden: true,
            handler: function() {
                backButton.hide();
                tabs.setActiveItem(0);
            }
        });
        var tabs = new Ext.TabPanel({
            fullscreen: true,
            layout: 'card',
            tabBar: new Ext.TabBar({
                hidden: true
            }),
            dockedItems: [{
                xtype: 'toolbar',
                title: 'Example',
                dock: 'top',
                items: [
                    backButton
                ]
            }],
            items: [{
                xtype: 'list',
                store: userStore,
                itemTpl: '<div class="user" userid="{id}">{username}</div>',
                onItemTap: function(element) {
                    var id = element.getElementsByClassName('user')[0].getAttribute('userid');
                    var user = userStore.getById(parseInt(id));
                    backButton.show();
                    tabs.down('form').setValues(user.data);
                    tabs.setActiveItem(1);
                }
            },{
                xtype: 'form',
                items: [{
                    xtype: 'fieldset',
                    title: 'User Details',
                    items: [{
                       ...