DeepFlood 编辑框增强

NS原帖：https://www.nodeseek.com/post-336879-1

把域名改一下就成了

还有个浮动框的自己改吧 https://www.nodeseek.com/post-336922-1

// ==UserScript==
// @name         DeepFlood 编辑框增强
// @namespace    https://www.deepflood.com/
// @version      0.0.3
// @description  DeepFlood Editor Enhanced
// @author       ps3chinamj
// @match        https://www.deepflood.com/new-discussion
// @match        https://www.deepflood.com/post-*-*
// @match        https://www.deepflood.com/notification#/message?mode=talk&to=*
// @icon         https://www.deepflood.com/static/image/favicon/favicon-32x32.png
// @grant        GM_addStyle
// ==/UserScript==

(function () {
    'use strict';

    window.addEventListener('load', () => {
        insertBackToMdEditorButton();

        insertDropdownBeforeEditor();

        modifyTitle();

        const editorWrapper = document.getElementById('cm-editor-wrapper');
        if (editorWrapper) {
            editorWrapper.addEventListener('keydown', (e) => keydownHandler(e, editorWrapper));
        }
    });

    function insertBackToMdEditorButton() {
        // 查找目标元素
        const backToBottomBtn = document.getElementById('back-to-bottom');
        if (!backToBottomBtn) return;

        // 创建新按钮
        const scrollToEditorBtn = document.createElement('div');
        scrollToEditorBtn.id = 'back-to-md-editor';
        scrollToEditorBtn.className = 'nav-item-btn';
        scrollToEditorBtn.innerHTML = '<svg class="iconpark-icon" style="width: 24px; height: 24px;"><use href="#comments"></use></svg>';

        // 添加点击事件
        scrollToEditorBtn.addEventListener('click', () => {
            const editor = document.querySelector('.md-editor');
            if (editor) {
                editor.scrollIntoView({ behavior: 'smooth' });
            }
        });

        // 在目标元素前插入新按钮
        backToBottomBtn.parentNode.insertBefore(scrollToEditorBtn, backToBottomBtn);

        // 添加样式
        GM_addStyle(`
            #fast-nav-button-group .nav-item-btn:nth-last-child(4) {
                bottom: 120px;
            }

            #back-to-md-editor {
                display: flex;
            }
        `);
    }

    function insertDropdownBeforeEditor() {
        const mdeToolbar = document.getElementsByClassName('mde-toolbar')[0];
        if (!mdeToolbar) return;

        const container = document.createElement('div');
        container.style.margin = '5px 0';

        const select = document.createElement('select');
        select.style.padding = '4px 8px';
        select.style.fontSize = '14px';
        select.style.width = '100%';

        const defaultOption = document.createElement('option');
        defaultOption.value = '';
        defaultOption.textContent = '—— 插入预设文本 ——';
        defaultOption.disabled = true;
        defaultOption.selected = true;
        select.appendChild(defaultOption);

        const options = ['好机', 'BD'];
        options.forEach((text) => {
            const option = document.createElement('option');
            option.value = text;
            option.textContent = text;
            select.appendChild(option);
        });

        select.addEventListener('change', function () {
            insertTextIntoEditor(this.value);
            this.selectedIndex = 0; // 重置选择
        });

        container.appendChild(select);
        mdeToolbar.parentNode.insertBefore(container, mdeToolbar);
    }

    function insertTextIntoEditor(text) {
        const el = document.querySelector('.md-editor');
        const vm = el.__vue__ || el.__vueParentComponent?.proxy;
        if (!vm) return;

        vm.setMarkdown(vm.markdown ? vm.markdown + "\n" + text : text)
    }

    function modifyTitle() {
        // 发布帖子
        tryUpdateInnerText('submit btn focus-visible', '（Ctrl+Enter）');
        // 加粗
        tryUpdateTitle('toolbar-item i-icon i-icon-text-bold', '（Ctrl+B）');
        // 斜体
        tryUpdateTitle('toolbar-item i-icon i-icon-text-italic', '（Ctrl+I）');
        // 删除线
        tryUpdateTitle('toolbar-item i-icon i-icon-strikethrough', '（Ctrl+D）');
        // 引用
        tryUpdateTitle('toolbar-item i-icon i-icon-quote', '（Ctrl+Q）');
        // 链接
        tryUpdateTitle('toolbar-item i-icon i-icon-link-three', '（Alt+L）');
        // 标题
        tryUpdateTitle('toolbar-item i-icon i-icon-h', '（Alt+H）');
        // 图片
        // tryUpdateTitle('toolbar-item i-icon i-icon-pic', '（Alt+P）');
        // 表格
        tryUpdateTitle('toolbar-item i-icon i-icon-table-file', '（Alt+T）');
        // 分割线
        tryUpdateTitle('toolbar-item i-icon i-icon-minus', '（Alt+M）');
    }

    function tryUpdateInnerText(className, appendText) {
        const el = document.getElementsByClassName(className)[0];
        if (el) {
            el.innerText += appendText;
        }
    }

    function tryUpdateTitle(className, appendText) {
        const el = document.getElementsByClassName(className)[0];
        if (el) {
            el.title += appendText;
        }
    }

    function clickIfExists(className) {
        const el = document.getElementsByClassName(className)[0];
        if (el) el.click();
    }

    function keydownHandler(e, editorWrapper) {
        if (!editorWrapper || editorWrapper.style.display === 'none') return;

        /*
            0 = off
            1 = on
            keyCodeObject outputs the event object of the KeyEvent
            keyCode outputs the keyCode of the key thats been pressed
        */
        const log = {keyCodeObject: 0, keyCode: 0}

        const keyAlt = e.altKey;
        const keyCtrl = e.ctrlKey;
        const keyShift = e.shiftKey;

        if (log.keyCodeObject) {
            console.log(e);
        }

        // https://unixpapa.com/js/key.html
        // get the code representation of the key pressed.
        const keyCode = e.which === 0 ? e.charCode : e.keyCode;

        if (log.keyCode) {
            console.log(keyCode);
        }

        if (keyCtrl) {
            switch (keyCode) {
                case 13:
                    // 发布帖子
                    // match 'Enter' key
                    clickIfExists('submit btn focus-visible');
                    break;
                case 66:
                    // 加粗
                    // match 'B' key
                    clickIfExists('toolbar-item i-icon i-icon-text-bold');
                    break;
                case 73:
                    // 斜体
                    // match 'I' key
                    clickIfExists('toolbar-item i-icon i-icon-text-italic');
                    break;
                case 68:
                    // 删除线
                    // match 'D' key
                    clickIfExists('toolbar-item i-icon i-icon-strikethrough');
                    break;
                case 81:
                    // 引用
                    // match 'Q' key
                    clickIfExists('toolbar-item i-icon i-icon-quote');
                    break;
            }
        }

        if (keyAlt) {
            switch (keyCode) {
                case 72:
                    // 标题
                    // match 'H' key
                    clickIfExists('toolbar-item i-icon i-icon-h');
                    break;
                // case 76:
                //     // 图片
                //     // match 'P' key
                //     clickIfExists('toolbar-item i-icon i-icon-pic');
                //     break;
                case 76:
                    clickIfExists('toolbar-item i-icon i-icon-link-three');
                    break;
                case 84:
                    // 表格
                    // match 'T' key
                    clickIfExists('toolbar-item i-icon i-icon-table-file');
                    break;
                case 77:
                    // 分割线
                    // match 'M' key
                    clickIfExists('toolbar-item i-icon i-icon-minus');
                    break;
            }
        }
    }
})();