Json-Formatter.php

Quell Code

<fieldset class="layui-elem-field layui-field-title">
        <legend>Formatting JSON
            <div class="layui-input-inline" style="text-align: right;">
                <select style="font-family: 'Ubuntu Mono', monospace, monaco, 'lucida console', 'courier new' !important;" name="select_theme" id="select_theme">
                    <option selected>default</option>
                    <option>erlang-dark</option>
                    <option>material</option>
                </select>
            </div>
        </legend>
    </fieldset>
    <form class="layui-form " action="">
        <input type="hidden" name="hidden_syntax" id="hidden_syntax" value="">
        <div style="display: none;" name="hidden_default_text" id="hidden_default_text">{"name":"suremotoo","hobbies":["sleep","eat"]}</div>
        <div class="layui-form-item layui-form-text">
            <div class="layui-row">
                <div class="layui-col-xs12">
                    <div style="line-height: 0">
                        <textarea id="source" style="height:280px;" rows="20" cols="160"></textarea>
                        <center>
                            <button class="layui-btn  submit" type="button"><strong>Beautify JSON</strong> <em>(ctrl-enter)</em></button>
                            <button class="layui-btn " type="button" id="btn_compress" data-json="json">
                                <strong>Compress Code</strong>
                            </button>
                            <button class="layui-btn " type="button" id="btn_xml_parser">
                                <strong>To XML </strong>
                            </button>
                        </center>
                    </div>
                    <div id="testresults"></div>
                </div>
            </div>
        </div>
    </form>
        <link rel="stylesheet" href="/css/index.php?css=material.css">
    <link rel="stylesheet" href="/css/index.php?css=erlang-dark.css">
    <link rel="stylesheet" href="/css/index.php?css=layui.css">
    <link rel="stylesheet" href="/css/index.php?css=codemirror.css">
    <link rel="stylesheet" href="/css/index.php?css=dialog.css">
    <link rel="stylesheet" href="/css/index.php?css=codeMirror.css">
    <script src="/js/index.php?js=codemirror.js"></script>
    <script src="/js/index.php?js=javascript.js"></script>
    <script src="/js/index.php?js=dialog.js"></script>
    <script src="/js/index.php?js=search.js"></script>
    <script src="/js/index.php?js=searchcursor.js"></script>
    <script src="/js/index.php?js=jump-to-line.js"></script>
    <script src="/js/index.php?js=jquery.js"></script>
    <script src="/js/index.php?js=jquery.cookie.js"></script>
    <script src="/js/index.php?js=beautify.js"></script>
    <script src="/js/index.php?js=beautify-css.js"></script>
    <script src="/js/index.php?js=beautify-html.js"></script>
    <script src="/js/index.php?js=xml2json.js"></script>
    <script src="/js/index.php?js=json2xml.js"></script>
    <script src="/js/index.php?js=layui.js"></script>
    <script src="/js/index.php?js=requestJS.js"></script>
    <script src="/js/index.php?js=popup.js"></script>
    <script src="/js/index.php?js=extentFunction.js"></script>
    <script src="/js/index.php?js=codemirror-init.js"></script>
    <script>
        window.onresize = function () {
            resizeContentSize()
        }
        window.onload = function () {
            resizeContentSize()
        }

        function resizeContentSize() {
            var _TextareaArr = document.getElementsByClassName("CodeMirror");
            var tempTextarea = _TextareaArr[0];
            var areaHeight = tempTextarea.offsetHeight;
            var bodyHeight = document.body.clientHeight;
            var per = areaHeight / bodyHeight;
            var currBoxHeight = document.documentElement.clientHeight;
            temp_box_height = currBoxHeight;
            for (let index = 0; index < _TextareaArr.length; index++) {
                const element = _TextareaArr[index];
                element.style.height = (currBoxHeight *
                    per) - 10 + 'px';
            }
        }
    </script>