DevtoolsFormatter for GWT

gwt-formatter.js

JsonMLFormatter = function(simpleFormatter)
{
    this._simpleFormatter = simpleFormatter;
}

JsonMLFormatter.prototype = {

    header: function(object, config)
    {
        var c = this._simpleFormatter.preview(object);
        if (c === null)
            return null;

        var header = new JsonMLElement('span');
        if (config && config.key) {
            var key = header.createChild('span');
            key.createTextChild(config.key + ': ');
            key.setStyle('color: rgb(136, 19, 145);');
        }

        header.createTextChild(c);

        return header.toJsonML();
    },

    hasBody: function(object)
    {
        return this._simpleFormatter.hasChildren(object);
    },

    body: function(object)
    {
        var body = new JsonMLElement('ol');
        body.setStyle('list-style-type:none; padding-left: 0px; margin-top: 0px; margin-bottom: 0px; margin-left: 12px');
        var children = this._simpleFormatter.children(object);
        for (var i = 0; i < children.length; ++i) {
            var child = children[i];
            var li = body.createChild('li');

            if (typeof child.value === 'object') {
                var objectTag = li.createObjectTag(child.value);
                objectTag.addAttribute('config', {key: child.name});
                if (!this._simpleFormatter.hasChildren(child.value))
                    li.setStyle("padding-left: 13px;");
            } else {
                var nameSpan = new JsonMLElement('span');
                nameSpan.createTextChild(child.name + ': ');
                nameSpan.setStyle('color: rgb(136, 19, 145);');
                li.setStyle("padding-left: 13px;");
                var objectTag = li.createChild('span');
                objectTag.appendChild(nameSpan);
                objectTag.createTextChild('' + child.value);
            }
        }
        return body.toJsonML();
    }

}

JsonMLElement = function(tagName)
{
    this._attributes = {};
    this._jsonML = [tagName, this._attributes];
}


JsonMLElement.prototype = {

    appendChild: function(element)
    {
        this._jsonML.push(element.toJsonML());
    },

    createChild: function(tagName)
    {
        var c = new JsonMLElement(tagName);
        this._jsonML.push(c.toJsonML());
        return c;
    },

    createObjectTag: function(object)
    {
        var tag = this.createChild('object');
        tag.addAttribute('object', object);
        return tag;
    },

    setStyle: function(style)
    {
        this._attributes['style'] = style;
    },

    addAttribute: function(key, value)
    {
        this._attributes[key] = value;
    },

    createTextChild: function(text)
    {
        this._jsonML.push(text + '');
    },

    toJsonML: function()
    {
        return this._jsonML;
    }
}

GwtSimpleFormatter = function ()
{
    this._formatters = [new MapFormatter(), new SetFormatter(), new ArrayFormatter(), new ArrayListFormatter(), new EntryFormatter(this), new ObjectFormatter()];
}

GwtSimpleFormatter.__INTERNAL_TYPE = '__formatter_internal_type';
GwtSimpleFormatter.__INTERNAL_TYPES = {
    Entry: 'entry'
};

GwtSimpleFormatter.prototype = {

    preview: function(object)
    {
        if (typeof object === 'undefined')
            return 'undefined';

        if (typeof object === 'number')
            return object + '';

        if (typeof object === 'string')
            return object;

        if (!object)
            return 'null';

        for (var i = 0; i < this._formatters.length; ++i) {
            var formatter = this._formatters[i];
            if (formatter.accept(object))
                return formatter.preview(object);
        }

        return null;
    },

    hasChildren: function(object)
    {
        if (!object) {
            return false;
        }

        for (var i = 0; i < this._formatters.length; ++i) {
            var formatter = this._formatters[i];
            if (formatter.accept(object))
                return formatter.hasChildren(object);
        }

        return false;
    },

    children: function(object)
    {
        if (!object) {
            return [];
        }

        for (var i = 0; i < this._formatters.length; ++i) {
            var formatter = this._formatters[i];
            if (formatter.accept(object)) {
                return formatter.children(object);
            }
        }
        return [];
    }
};

ObjectFormatter = function() {};

ObjectFormatter.prototype = {

    accept: function(object)
    {
        return !!object.getClass_2_g$
    },

    preview: function(object)
    {
        var type = object.getClass_2_g$().compoundName_1_g$;
        return  type;
    },

    hasChildren: function(object)
    {
        return !!Object.keys(object).length;
    },

    children: function(object)
    {
        var keys= Object.keys(object);
        var properties = [];
        for (var i = 0; i < keys.length; ++i) {
            properties.push(this._createPropertyPreview(keys[i], object[keys[i]]));
        }
        return properties;
    },

    _createPropertyPreview: function(key, value)
    {
        var result = {};
        //result.name = this._tryToCutKey(key) || key;
        result.name = key;
        result.value = value;
        return result;
    },

    _tryToCutKey: function(key)
    {
        var ind = key.lastIndexOf('_');
        if (ind === -1) {
            return null;
        }
        var len = key.lastIndexOf('_', ind - 1);
        if (len === -1) {
            return null;
        }
        return key.substring(0, len);
    }

};

MapFormatter = function() {};

MapFormatter.prototype = {

    accept: function(object)
    {
        if (!object.getClass_2_g$) {
            return false;
        }

        var clazz = object.getClass_2_g$();
        return clazz.compoundName_1_g$ === 'HashMap';
    },

    hasChildren: function(object)
    {
        return object.size_179_g$() > 0;
    },

    preview: function(object)
    {
        var type = object.getClass_2_g$().compoundName_1_g$;
        var size = object.size_179_g$();
        return type + ' size = ' + size;
    },

    children: function(object)
    {
        var stringChildren = this._retrieveStringEntries(object);
        if (stringChildren.length) {
            return stringChildren;
        }
        return this._retrieveObjectEntries(object);
    },

    _retrieveStringEntries: function(object)
    {
        var mapObject = object.stringMap_0_g$.backingMap_6_g$;
        var entries = [];

        mapObject.forEach((value, key, map) => {
            entries.push({name: key + '', value: value});
        })

        return entries;
    },

    _retrieveObjectEntries: function(object)
    {
        var mapObject = object.hashCodeMap_0_g$.backingMap_5_g$
        var entries = [];
        mapObject.forEach((value, key, map) => {
            var bucket = value;
            for (var j = 0; j < bucket.length; ++j) {
                var entry = bucket[j];
                var entryWrapper = {key: entry.key_11_g$, value: entry.value_70_g$};
                entryWrapper[GwtSimpleFormatter.__INTERNAL_TYPE] = 'entry';
                entries.push({name: entries.length + '', value: entryWrapper});
            }
        })
        return entries;
    }

}

ArrayFormatter = function() {};

ArrayFormatter.prototype = {

    accept: function(object)
    {
        if (!object.___clazz_0_g$ || !(object instanceof Array)) {
            return false;
        }

        return true;
    },

    preview: function(object)
    {
        var type =  object.___clazz_0_g$.componentType_1_g$.compoundName_1_g$;
        return  type + '[] size = ' + object.length;
    },

    hasChildren: function(object)
    {
        return !!object.length;
    },

    children: function(object)
    {
        var result = [];
        for (var i = 0; i < object.length; ++i) {
            result.push({name: i + '', value: object[i]});
        }
        return result;
    }
}

ArrayListFormatter = function() {};

ArrayListFormatter.prototype = {

    accept: function(object)
    {
        if (!object.getClass_2_g$)
            return false;

        var clazz = object.getClass_2_g$();
        return clazz.compoundName_1_g$ === 'ArrayList';

    },

    preview: function(object)
    {
        var type =  object.___clazz_0_g$.compoundName_1_g$;
        return  type + '[] size = ' + object.array_1_g$.length;
    },

    hasChildren: function(object)
    {
        return object.array_1_g$.length > 0;
    },

    children: function(object)
    {
        var result = [];
        for (var i = 0; i < object.array_1_g$.length; ++i) {
            result.push({name: i + '', value: object.array_1_g$[i]});
        }
        return result;
    }
}


EntryFormatter = function(simpleFormatter) {
    this._simpleFormatter = simpleFormatter;
};

EntryFormatter.prototype = {

    accept: function(object)
    {
        return object[GwtSimpleFormatter.__INTERNAL_TYPE] === GwtSimpleFormatter.__INTERNAL_TYPES.Entry;
    },

    preview: function(object)
    {
        var keyPreview = this._simpleFormatter.preview(object.key);
        if (keyPreview == null) {
            keyPreview = new ObjectFormatter().preview(object.key)
        }
        var valuePreview = this._simpleFormatter.preview(object.value);
        if (valuePreview == null) {
            valuePreview = new ObjectFormatter().preview(object.value)
        }
        return keyPreview + ' => ' + valuePreview;
    },

    hasChildren: function(object)
    {
        return true;
    },

    children: function(object)
    {
        var keyProperty = {name: 'key', value: object.key};
        var valueProperty = {name: 'value', value: object.value};
        return [keyProperty, valueProperty];
    }

};

SetFormatter = function() {};

SetFormatter.prototype = {

    accept: function(object)
    {
        if (!object.getClass_2_g$) {
            return false;
        }

        var clazz = object.getClass_2_g$();
        return clazz.compoundName_1_g$ === 'HashSet';
    },

    preview: function(object)
    {
        var type = object.getClass_2_g$().compoundName_1_g$;
        var size = object.size_179_g$();
        return type + ' size = ' + size;
    },

    hasChildren: function(object)
    {
        return object.size_179_g$() > 0;
    },

    children: function(object)
    {
        var mapObject = object.stringMap_0_g$.backingMap_6_g$;
        var entries = [];
        var index = 0;
        mapObject.forEach((value, key, map) => {
            entries.push({name: index + '', value: value});
            index++;
        })

        return entries;
    }

};

window['devtoolsFormatters'] = [new JsonMLFormatter(new GwtSimpleFormatter())];