Bookmarklet that JSON formats and also has a box to type JSONPaths

jsonformaterbookmarklet.js

javascript: (function () {
    function callback() {
        (function ($) {
            var jQuery = $;
            javascript: (function () {
                function refresh() {
                    $.ajax({
                        url: location,
                        type: "get",
                        dataType: "json",
                        success: function (data, textStatus, jqXHR) {
                            if (data.error) {
                            } else {
                                o = data;
                                var xpath = $("#jsonpath").val();
                                if (xpath == '') {
                                    $("#json").html(`${jsonPrettyPrint.toHtml(o)}`);
                                } else {
                                    var filtered = jsonPath(o, xpath);
                                    if (filtered) {
                                        $("#json").html(`${jsonPrettyPrint.toHtml(filtered)}`);
                                    }
                                }
                            }
                        }
                    });
                }
                $(document).on("click", "#refresh", refresh);
                var jsonPrettyPrint = {
                    replacer: function (match, pIndent, pKey, pVal, pEnd) {
                        var key = '<span class=json-key>', val = '<span class=json-value>', str = '<span class=json-string>', r = pIndent || '';
                        if (pKey) r = r + key + pKey.replace(/[": ]/g, '') + '</span>: ';
                        if (pVal) r = r + (pVal[0] == '"' ? str : val) + pVal + '</span>';
                        return r + (pEnd || '');
                    },
                    toHtml: function (obj) {
                        var jsonLine = /^( *)("[\w]+": )?("[^"]*"|[\w.+-]*)?([,[{])?$/mg;
                        return JSON.stringify(obj, null, 4).replace(/&/g, '&amp;').replace(/\\"/g, '&quot;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(jsonLine, jsonPrettyPrint.replacer);
                    }
                };
                var jsonpathScript = document.createElement('script'), o = JSON.parse(document.body.innerText);
                jsonpathScript.type = 'text/javascript';
                jsonpathScript.src = 'https://storage.googleapis.com/google-code-archive-downloads/v2/code.google.com/jsonpath/jsonpath-0.8.0.js.txt';
                jsonpathScript.onload = formatjson;
                document.body.appendChild(jsonpathScript);
                var css = `
body {
    background-color: #2d2d2d!important;
    color: #ccc!important;
    font-family: monaco, Consolas, Menlo, Courier, monospace;
    font-size: 14px;
    line-height: 1.5em;
}
.json-key {
    color: #ccc!important;
}
.json-value {
    color: #f08d49!important;
}
.json-string {
    color: #7ec699!important;
}
`, head = document.head || document.getElementsByTagName('head')[0], style = document.createElement('style');
                style.type = 'text/css';
                if (style.styleSheet) { style.styleSheet.cssText = css; } else { style.appendChild(document.createTextNode(css)); }
                head.appendChild(style);
                style.type = 'text/css';
                style.styleSheet.cssText = css;
                document.head.appendChild(style);
                function formatjson() {
                    var xpathFromURL = decodeURI(location.toString().split('#')[1]);
                    document.body.innerHTML = `<pre><input id="jsonpath" type="text" value="${(xpathFromURL != 'undefined' ? xpathFromURL : '')}" style="width:80%;"/><button id="refresh" type="button">Refresh</button><br/><div id="json">${JSON.stringify(o, null, 4).replace(/\"([^\:]*?)\:/g, '<span style="color:#9C3636">"$1&colon;</span>')}</div></pre>`;
                    if (xpathFromURL == '' || xpathFromURL == 'undefined') {
                        $("#json").html(`${jsonPrettyPrint.toHtml(o)}`);
                    } else {
                        var filtered = jsonPath(o, xpathFromURL);
                        if (filtered) {
                            $("#json").html(`${jsonPrettyPrint.toHtml(filtered)}`);
                        }
                    }
                    $("#jsonpath").keyup(function () {
                        var xpath = this.value;
                        if (xpath == '') {
                            $("#json").html(`${jsonPrettyPrint.toHtml(o)}`);
                        } else {
                            var filtered = jsonPath(o, xpath);
                            if (filtered) {
                                $("#json").html(`${jsonPrettyPrint.toHtml(filtered)}`);
                            }
                        }
                    });
                }
            }())
        })(jQuery.noConflict(true))
    }
    var s = document.createElement("script");
    s.src = "https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js";
    if (s.addEventListener) {
        s.addEventListener("load", callback, false)
    } else if (s.readyState) {
        s.onreadystatechange = callback
    }
    document.body.appendChild(s);
})();