JSFiddle - React, Tailwind, and code Playground

by YangHax

HTML

<link rel="stylesheet" href="http://cdn.sencha.io/ext-4.1.0-gpl/resources/css/ext-all.css">
<html>
    <head>
        <title>ExtJS4 Test</title>
    </head>
    <body>
    </body>
</html>

JavaScript

// ExtJS 4.1 Error Dialog /w Stack Trace         
// Works without issue here?
//**************************//                        

Ext.onReady(function(){
    
    Ext.create('Ext.button.Button',{
        text: 'Show dialog'
        , renderTo: Ext.getBody()
        , style: 'margin: 50px;'
        , handler: function() {
            var fakeAjaxResponse = "{ ExceptionType: 'Error', Message: 'Message', StackTrace: 'line 101' }";
            handleAjaxError(fakeAjaxResponse);
        }
    });
});

// ajaxResponse: { ExceptionType: 'Error', Message: 'Message', StackTrace: 'line 101' }
handleAjaxError = function ( ajaxResponse ) {
    var responseData = Ext.JSON.decode(ajaxResponse),
        win = null,
        windowConfig = null;
        
    if (!responseData) // request timed out?
    {
        responseData = {
            ExceptionType: 'Timeout',
            Message: 'It appears the request timed out, please try again!' 
        };
    }
    // Window to show
    windowConfig = {
        title: 'Error: ' + Ext.htmlEncode(responseData.ExceptionType),
        layout: 'anchor',
        defaults: { anchor: '100%' },
        modal: true,
        resizable: false,
        width: 400,
        items: 
        [
            { 
                xtype: 'container'
                , autoScroll: true
                , html: '<img style="float: left; padding: 5px;" src="http://cdn.sencha.io/ext-4.1.0-gpl/resources/themes/images/gray/shared/icon-error.gif">'
                    + Ext.htmlEncode(responseData.Message)
            }
        ], // eo items
        buttons:
        [
            { text: 'OK', handler: function() { win.destroy(); } }
        ], // eo buttons
        listeners: {
            afterrender: { // make sure layout sized properly
                single: true,
                buffer: 10,
                fn: function() { return; win.doLayout(); }
            } // eo afterrender
        } // eo listeners
    };
    
    if ( responseData.StackTrace )
  ...