var JSONFormat = (function(){
    var _toString = Object.prototype.toString;

    function format(object, indent_count){
        var html_fragment = '';
        switch(_typeof(object)){
            case 'Null' :0
                html_fragment = _format_null(object);
                break;
            case 'Boolean' :
                html_fragment = _format_boolean(object);
                break;
            case 'Number' :
                html_fragment = _format_number(object);
                break;
            case 'String' :
                html_fragment = _format_string(object);
                break;
            case 'Array' :
                html_fragment = _format_array(object, indent_count);
                break;
            case 'Object' :
                html_fragment = _format_object(object, indent_count);
                break;
        }
        return html_fragment;
    };

    function _format_null(object){
        return '<span class="json_null">null</span>';
    }

    function _format_boolean(object){
        return '<span class="json_boolean">' + object + '</span>';
    }

    function _format_number(object){
        return '<span class="json_number">' + object + '</span>';
    }

    function _format_string(object){
        if(0 <= object.search(/^http/)){
            object = '<a href="' + object + '" target="_blank" class="json_link">' + object + '</a>'
        }
        return '<span class="json_string">"' + object + '"</span>';
    }

    function _format_array(object, indent_count){
        var tmp_array = [];
        for(var i = 0, size = object.length; i < size; ++i){
            tmp_array.push(indent_tab(indent_count) + format(object[i], indent_count + 1));
        }
        return '[\n'
        + tmp_array.join(',\n')
        + '\n' + indent_tab(indent_count - 1) + ']';
    }

    function _format_object(object, indent_count){
        var tmp_array = [];
        for(var key in object){
            tmp_array.push( indent_tab(indent_count) + '<span class="json_key">"' + key + '"</span>:' +  format(object[key], indent_count + 1));
        }
        return '{\n'
        + tmp_array.join(',\n')
        + '\n' + indent_tab(indent_count - 1) + '}';
    }

    function indent_tab(indent_count){
        return (new Array(indent_count + 1)).join('   ');
    }

    function _typeof(object){
        var tf = typeof object,
            ts = _toString.call(object);
        return null === object ? 'Null' :
            'undefined' == tf ? 'Undefined'   :
                'boolean' == tf ? 'Boolean'   :
                    'number' == tf ? 'Number'   :
                        'string' == tf ? 'String'   :
                            '[object Function]' == ts ? 'Function' :
                                '[object Array]' == ts ? 'Array' :
                                    '[object Date]' == ts ? 'Date' : 'Object';
    };

    function loadCssString(){
        var style = document.createElement('style');
        style.type = 'text/css';
        var code = Array.prototype.slice.apply(arguments).join('');
        try{
            style.appendChild(document.createTextNode(code));
        }catch(ex){
            style.styleSheet.cssText = code;
        }
        document.getElementsByTagName('head')[0].appendChild(style);
    }

    loadCssString(
        '.json_key{ color: purple;}',
        '.json_null{color: red;}',
        '.json_string{ color: #077;}',
        '.json_link{ color: #717171;}',
        '.json_array_brackets{}');

    var _JSONFormat = function(origin_data){
        this.data = 'string' != typeof origin_data ? origin_data :
            JSON && JSON.parse ? JSON.parse(origin_data) : eval('(' + origin_data + ')');
    };

    _JSONFormat.prototype = {
        constructor : JSONFormat,
        toString : function(){
            return format(this.data, 1);
        }
    }

    return _JSONFormat;

})();

function create_result_contatiner(){
    var $result = $('<pre id="result" style=" width: 100%; height: 100%; overflow: scroll; overflow-x: scroll; overflow-y:scroll"></pre>')
    var $result_container = $('<div id="result_container" style=" top: 1%; right: 8px;  margin: 0; padding: 0;  border:1px solid skyblue; background: #f8f8f8; line-height: 1.2em; font-size: 14px; cursor: pointer;"></div>');
    $result_container.append($result);

    $('body').append($result_container);
    return [$result_container, $result];
}

/*
(function request_intercept(args){
    var $result_container = args[0],
        $result = args[1];
    $('form *[type="submit"]').bind('click', function(){
        var _form = $(this).parents('form'),
            _action = (_form.attr('action') || './'),
            _method = (_form.attr('method') || 'get').toLowerCase(),
            _params = {};
        _form.find('input').each(function(){
            var item = $(this);
            _params[item.attr('name')] = item.val();
        });
        qls.loading();
        $['get' == _method ? 'get' : 'post'](_action, _params, function(response){
            qls.close();
            try{
                var j = new JSONFormat(JSON && JSON.parse ? JSON.parse(response) : eval('(' + response + ')'));
                $result.html(j.toString());
                $.post(interfacevaluesurl,{values:j.toString(),id:$('select[name="interface"]').val()});
            }catch (e){
                $result.html(response);
            }
            //$result_container.stop(true).animate({width:'50%'}, 'slow');
        });
        return false;
    });
})(create_result_contatiner());*/