fb_quick_key

粉笔刷题快捷键脚本e 编辑/退出编辑

Você precisará instalar uma extensão como Tampermonkey, Greasemonkey ou Violentmonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey ou Violentmonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey ou Userscripts para instalar este script.

Você precisará instalar uma extensão como o Tampermonkey para instalar este script.

Você precisará instalar um gerenciador de scripts de usuário para instalar este script.

(Eu já tenho um gerenciador de scripts de usuário, me deixe instalá-lo!)

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

(Eu já possuo um gerenciador de estilos de usuário, me deixar fazer a instalação!)

// ==UserScript==
// @name         fb_quick_key
// @namespace    http://tampermonkey.net/
// @version      1.0.2
// @description  粉笔刷题快捷键脚本e 编辑/退出编辑
// @author       You
// @match        https://spa.fenbi.com/ti/exam
// @icon         https://www.google.com/s2/favicons?sz=64&domain=nowcoder.com
// @grant        none
// @license MIT

// @match   https://spa.fenbi.com/*
// ==/UserScript==


(function () {
    'use strict';

    // Your code here...



    window.addEventListener("keyup", () => {
        console.log("keyup", event.keyCode)
        const title_right_tools_container = document.querySelectorAll(".title-right")
        // 出现画画后的工具栏(撤销、反撤销、橡皮、清空、退出)
        const edit_tools_container = document.querySelectorAll(".tools-container")

        const target_title_right_tool = getFirstVisibleElement(title_right_tools_container);
        const target_edit_tool = getFirstVisibleElement(edit_tools_container);
        const isEditMode = getIsEditMode(target_title_right_tool, target_edit_tool)
        console.log('mod is edit mode', isEditMode)
        if (isEditMode === 'edit') {
            // 这是画画后的工具栏的操作按钮
            const undo_btn = target_edit_tool.children[0]
            const redo_btn = target_edit_tool.children[1]
            const eraser_btn = target_edit_tool.children[2]
            const clear_btn = target_edit_tool.children[3]
            const exit_btn = target_edit_tool.children[4]
            switch (event.keyCode) {
                case 69: // e 键,退出编辑模式exit
                    exit_btn.click()
                    break;
                case 65: // a 键 橡皮,
                    eraser_btn.click()
                    break;

                case 67: // c 键,清空 clear
                    clear_btn.click()
                    break;
                case 81: // q 键 撤销 undo
                    undo_btn.click()
                    break;
                case 87: // w 键 反撤销 redo
                    redo_btn.click()
                    break;
                default:
                    break;
            }
        }
        else if (isEditMode === 'normal') {
            // 这是title栏右侧的工具栏的操作按钮
            const pin_btn = target_title_right_tool.children[0]
            const edit_btn = target_title_right_tool.children[1]
            const collect_btn = target_title_right_tool.children[2]
            switch (event.keyCode) {
                case 69: // e 键,进入编辑模式edit
                    edit_btn.click()
                    break;
                case 67: // c 键,收藏 collect
                    collect_btn.click()
                    break;
                case 65: // s 键,标记 sign
                    pin_btn.click()
                    break;
                default:
                    break;
            }
        }
    })
})();

/**
 * 获取 tool_container 中在视口内的第一个元素
 * @param {NodeList} containers - document.querySelectorAll(".title-right") 的结果
 * @returns {Element|null} 可见的第一个元素,如果没有则返回 null
 */
function getFirstVisibleElement(containers) {
    for (let i = 0; i < containers.length; i++) {
        const rect = containers[i].getBoundingClientRect();
        // 检查元素是否在视口内
        // rect.top >= 0 && rect.left >= 0 && 
        // rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && 
        // rect.right <= (window.innerWidth || document.documentElement.clientWidth)

        // 更宽松的判断:只要元素的一部分在视口内即可
        if (
            rect.top < (window.innerHeight || document.documentElement.clientHeight) &&
            rect.bottom > 0 &&
            rect.left < (window.innerWidth || document.documentElement.clientWidth) &&
            rect.right > 0
        ) {
            return containers[i];
        }
    }
    return null;
}

// 判断模式编辑模式还是非编辑模式
function getIsEditMode(target_title_right_tool, target_edit_tool) {

    if (target_edit_tool) {
        return "edit"
    }
    else if (target_title_right_tool) {
        return "normal"
    }
    return "none"

}