JSFiddle - React, Tailwind, and code Playground

by Cristian Trifan

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootswatch/3.2.0/united/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.11.0/ui-bootstrap-tpls.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bower-angular-translate/2.0.1/angular-translate.js"></script>
<div ng-app="app">
    <div ng-controller="demoController">
        <div cdev-error-box></div>
        <button class="btn btn-sm btn-primary" ng-click="handleError()">Handle Error</button>
        <button class="btn btn-sm btn-info" ng-click="handleCustomError()">Handle Custom Error</button>
        <button class="btn btn-sm btn-warning" ng-click="handleUnmappedError()">Handle Unmapped Error</button>
        <button class="btn btn-sm btn-success" ng-click="clearPageError()">Clear Error</button>
    </div>
</div>

JavaScript

//-----------------------------------------------------------------------------------------------
//- Application code
(function() {
    'use strict';

    //
    // For the DEMO
    //
    angular.module('app', ['cdevErrorHandling'])
        .config(function($translateProvider) {
            $translateProvider.translations('en', {
                'errors': {
                    'account-disabled': 'Your account has been disabled.'
                }
            });
            $translateProvider.preferredLanguage('en');
        })
        .run(function(cdevErrorHandler, $window) {
            // Register a custom error handler to do a redirect
            cdevErrorHandler.setCustomHandler('redirect-to-ng', function() {
                $window.location = 'http://angularjs.org/';
            });
        })
        .controller('demoController', function($scope, cdevErrorHandler) {
            $scope.handleCustomError = function() {
                cdevErrorHandler.handle('redirect-to-ng');
            };
            $scope.handleError = function() {
                cdevErrorHandler.handle('account-disabled');
            };
            $scope.handleUnmappedError = function() {
                cdevErrorHandler.handle('unknown-error');
            };
        });
})();



//-----------------------------------------------------------------------------------------------
//- cdevErrorHandling module
(function() {
    'use strict';

    angular.module('cdevErrorHandling', ['pascalprecht.translate', 'ui.bootstrap'])
        .constant('cdevDefaultErrorCode', 'generic')
        .constant('cdevDefaultErrorMessage', 'Something went wrong')
        .constant('cdevErrorEventName', 'app-error')
        .factory('cdevErrorHandler', ['$rootScope', '$q', '$translate', 'cdevDefaultErrorCode', 'cdevDefaultErrorMessage', 'cdevErrorEventName',
            function($rootScope, $q, $translate, defaultErrorCode, defaultErrorMessage, errorEventName) {
                var _customHandlers =...