JSON paste on textarea

Paste JSON on textarea

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey, Greasemonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Userscripts.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een gebruikersscriptbeheerder nodig.

(Ik heb al een user script manager, laat me het downloaden!)

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

(Ik heb al een beheerder - laat me doorgaan met de installatie!)

// ==UserScript==
// @name         JSON paste on textarea
// @version      0.6
// @description  Paste JSON on textarea
// @match        https://*/*
// @grant        none
// @namespace https://greasyfork.org/users/371179
// ==/UserScript==
(function() {
    'use strict';

    /*

    -- Example --
    https://jsonformatter.curiousconcept.com/
    "{\"a\":1,\"b\":2,\"c\":3,\"d\":\"A\",\"e\":\"B\",\"f\":\"C\"}"

    */

    function getClipText(evt) {

        var text;
        var clp = (evt.originalEvent || evt).clipboardData;
        if (clp === undefined || clp === null) {
            text = window.clipboardData.getData("text") || null;
        } else {
            text = clp.getData('text/plain') || null;
        }
        return text;

    }

    //  =========================================================================================
    // https://stackoverflow.com/questions/7464282/javascript-scroll-to-selection-after-using-textarea-setselectionrange-in-chrome

    function setSelectionRange(textarea, selectionStart, selectionEnd) {
        // First scroll selection region to view
        const fullText = textarea.value;
        textarea.value = fullText.substring(0, selectionEnd);
        // For some unknown reason, you must store the scollHeight to a variable
        // before setting the textarea value. Otherwise it won't work for long strings
        const scrollHeight = textarea.scrollHeight
        textarea.value = fullText;
        let scrollTop = scrollHeight;
        const textareaHeight = textarea.clientHeight;
        if (scrollTop > textareaHeight) {
            // scroll selection to center of textarea
            scrollTop -= textareaHeight / 2;
        } else {
            scrollTop = 0;
        }
        textarea.scrollTop = scrollTop;

        // Continue to set selection range
        textarea.setSelectionRange(selectionStart, selectionEnd);
    }
    //  =========================================================================================


    if (document.queryCommandSupported("insertText")) {

        var object = {

            callback: function(str) {

                var targetElm = this.targetElm;
                var clipText = this.clipText;

                var newClipText = typeof str == 'string' ? str : clipText;
                if (newClipText != "") {


                    var oldText = targetElm.value
                    document.execCommand("insertText", false, newClipText);

                    if ('selectionStart' in targetElm) {
                        var afterChange = () => {
                            var newText = targetElm.value;
                            if (oldText == newText) return window.requestAnimationFrame(afterChange);
                            setSelectionRange(targetElm, targetElm.selectionStart, targetElm.selectionEnd);
                        };

                        window.requestAnimationFrame(afterChange);

                    }
                }

            }
        };

        var JF_safeObjects=[];

        var makeJFunction = (() => {
            var a = document.createElement('iframe');
            a.style.position = 'absolute';
            a.style.left = '-99px';
            a.style.top = '-99px';
            a.src = "about:blank"; //userscript can access "about:blank"
            a.width = "1";
            a.height = "1";
            document.documentElement.appendChild(a)
            // it is assumed that the "contentWindow" is immediately available after appendChild
            var JFunction;
            try {
                JFunction = (a.contentWindow || window).Function;
            } catch (e) {
                JFunction = window.Function
            }

            document.documentElement.removeChild(a)

            var res2 = null;
            try {
                var res = new JFunction('return Object.keys(window);')(); // avoid no access to JFunction
                res2 = [...res]; // transfer the js array object to the current framework
            } catch (e) {}

            if (res2 && 'forEach' in res2) {
                JF_safeObjects=res2;
            }else{
                JFunction = window.Function;
                JF_safeObjects=[];
            }

            return JFunction
        });


        var JFunction = null;
        document.addEventListener('paste', function(evt) {

            var clipText = getClipText(evt)
            if (clipText === null || typeof clipText != 'string') return;

            var targetElm = evt.target;

            if (!targetElm) return;

            switch (targetElm.tagName) {
                case 'TEXTAREA':
                    break;
                default:
                    return;
            }

            var testingStr=clipText.replace(/[0-9]+/g,'0')
            testingStr=testingStr.replace(/[a-zA-Z\u4E00-\u9FFF]+/g,'z')
            if (/[\[\{][\s\S]*[\]\}]/.test(testingStr)&&/[\'\"\`][\s\S]*[\'\"\`]/.test(testingStr)){}else{ return;}

            var testP = testingStr.replace(/[0z\/\%\-\+\_\.\;\$\#]+/g, '').trim();
            var testR = /^[\x21-\x2F\x3A-\x40\x5B-\x60\x7B-\x7E]+$/
            if (!testP) {
                return;
            }
            if (!testR.test(testP)) return;

            object.targetElm = targetElm;
            object.clipText = clipText;

            // JS-safe Function
            JFunction = JFunction || makeJFunction();

            //window.JF = JFunction



            var res = null;
            try {
                res = new JFunction(...JF_safeObjects,'return (' + clipText + ');')(); //backbracket to avoid return newline -> undefined
            } catch (e) {}

            //console.log(res)

            if (typeof res == 'string') {
                console.log('userscript - there is a text convertion to your pasted content');
                evt.preventDefault();
                object.callback(res);
            }


        });
    }

    // Your code here...
})();