rl-input.user.js

// ==UserScript==
// @name          rlInput box
// @author        Robert Lemon
// @version       0.1
// @namespace     http://rlemon.com
// @description   Produces a small input area for you to execute Javascript on the page. Saves scripts in LocalStorage and executes on page load.
// @include       *
// ==/UserScript==
 
(function () {
    function init() {
        var form = document.createElement('form'),
            input = document.createElement('textarea'),
            btn = document.createElement('button'),
            chk = document.createElement('input'),
            lbl = document.createElement('label');
        if ('localStorage' in window) {
            for (var key in window.localStorage) {
                if (key.substr(0, 4) === 'rls_') {
                    run_script(window.localStorage.getItem(key));
                }
            }
        }
        form.name = 'rlInputFrm';
        input.name = 'rlInputInput';
        chk.name = 'rlInputCheck';
        btn.textContent = 'Run';
        chk.type = 'checkbox';
        form.appendChild(input);
        form.appendChild(btn);
        lbl.appendChild(chk);
        lbl.appendChild(document.createTextNode(' Save in localStorage'));
        form.appendChild(lbl);
        form.addEventListener('submit', submit_handler, false);
 
        apply_styles(form, {
            position: 'fixed',
            zIndex: '9999999',
            width: '100%',
            top: '0px',
            left: '0px',
            padding: '12px 22px',
            backgroundColor: '#fff',
            boxSizing: 'border-box',
            borderBottom: '1px solid #000',
            display: 'block'
        });
        apply_styles(input, {
            width: '100%',
            height: '64px'
        });
        apply_styles(lbl, {
            float: 'right',
            marginTop: '2px'
        });
        apply_styles(btn, {
            borderRadius: '0',
            border: '1px solid #000',
            backgroundColor: 'white'
        });
       
        document.body.appendChild(form);
        document.addEventListener('keyup', check_key_handler, false);
        form.style.display = 'none';
    }
 
    function apply_styles(element, map) {
        for (var key in map) {
            element.style[key] = map[key];
        }
    }
 
    function submit_handler(e) {
        var el = this.elements.rlInputInput,
            chk = this.elements.rlInputCheck,
            script = el.value;
        if (chk.checked && 'localStorage' in window) {
            window.localStorage.setItem('rls_' + new Date().getTime(), script);
        }
        run_script(script);
        el.value = '';
        chk.checked = false;
        e && (e.preventDefault());
        return false;
    }
 
    function run_script(str) {
        try {
            eval(str);
        } catch (ex) {
            console.log(ex.stack);
        }
    }
 
    function check_key_handler(e) {
        if (e.ctrlKey && e.which == 77) {
            var frm = document.forms.rlInputFrm;
            frm.style.display === 'none' ? frm.style.display = 'block' : frm.style.display = 'none';
        }
    }
    init()
}());