☰

leetcode.cn中一键切换Vim模式

leetcode.cn中的做题页面一键切换Vim模式

// ==UserScript==
// @name         leetcode.cn中一键切换Vim模式
// @namespace    https://leetcode.cn/
// @version      0.1
// @description  leetcode.cn中的做题页面一键切换Vim模式
// @author       pala
// @match        https://leetcode.cn/problems/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=leetcode.cn
// @license      GPL-3.0
// ==/UserScript==

(function() {
    'use strict';

    var vim_div = document.createElement('div')
    vim_div.innerHTML = "<button id=\"vim-button\" class=\"tool-button__2YsS css-4n3zyb-transparent-sm-Btn e131m59q0\" type=\"button\"><svg t=\"1676037858099\" class=\"icon\" viewBox=\"0 0 1024 1024\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" p-id=\"2772\" data-spm-anchor-id=\"a313x.7781069.0.i0\" width=\"128\" height=\"128\"><path d=\"M1024 511.402667h-1.152l-184.234667-184.234667 183.594667-188.330667V62.336l-27.690667-27.648h-349.781333l-28.16 25.813333v44.586667L512.64 1.152V0L512 0.597333 511.402667 0v1.152l-55.04 55.082667-22.954667-22.997334H86.826667l-27.221334 29.525334v80.426666l26.282667 26.282667h30.72v226.56L1.152 511.445333H0L0.597333 512 0 512.597333h1.152l115.456 115.456v275.925334l38.698667 22.314666h99.072l79.232-81.237333 177.749333 177.749333V1024l0.64-0.597333 0.597333 0.597333v-1.194667l107.093334-107.050666h20.693333c4.736 0 9.002667-2.986667 10.666667-7.637334l6.229333-18.176a11.178667 11.178667 0 0 0-1.578667-10.197333l62.378667-62.378667-26.112 83.712a11.306667 11.306667 0 0 0 10.88 14.677334h77.824a11.349333 11.349333 0 0 0 10.368-6.954667l7.04-16.810667a11.52 11.52 0 0 0-10.538667-15.573333h-3.2l35.84-112.810667h52.565334l-43.349334 137.429334a11.349333 11.349333 0 0 0 10.88 14.677333h85.418667c4.693333 0 8.832-2.816 10.581333-7.253333l6.997334-18.261334a11.349333 11.349333 0 0 0-10.624-15.274666h-6.186667l48.256-156.714667a11.221333 11.221333 0 0 0-1.664-10.24l-16-21.504-0.128-0.213333a11.392 11.392 0 0 0-8.917333-4.352h-61.269334a11.349333 11.349333 0 0 0-8.106666 3.456l-17.066667 18.730666h-26.624l-1.792-1.962666 189.653333-189.653334H1024L1023.402667 512l0.597333-0.597333zM419.754667 901.930667l67.370666-192.384h-21.376l12.672-12.970667h70.784l-66.688 194.346667h26.581334l-3.370667 11.008H419.754667z m157.653333-320.682667l6.4 6.442667-11.477333 39.338666-9.6 9.642667h-41.344l-7.722667-7.722667 13.269333-37.162666 12.288-10.538667h38.186667zM238.506667 888.704H165.418667l-11.178667-6.4V131.882667H101.504l-4.266667-4.266667V77.44l6.101334-6.570667h314.496l9.088 9.130667v47.274667l-6.058667 7.381333H374.826667v370.688l375.765333-370.688h-89.002667l-7.466666-8.021333V77.013333l5.162666-4.736h319.573334l5.632 5.674667v45.653333L553.770667 565.333333h-15.914667c-0.64-0.042667-1.194667 0-1.792 0.042667l-0.853333 0.128a11.050667 11.050667 0 0 0-5.077334 2.56l-14.634666 12.586667-0.170667 0.128a11.648 11.648 0 0 0-3.114667 4.736l-12.629333 35.413333-261.077333 267.776z m630.101333-168.618667l20.224-22.144h56.917333l13.184 17.706667-53.973333 175.232h21.034667l-3.413334 8.917333H846.506667l47.957333-152.064h-85.973333l-45.952 144.682667h18.090666l-3.114666 7.424h-68.48l47.232-151.381333h-89.429334l-45.312 142.464h18.602667l-3.072 8.917333H566.186667l64.597333-190.293333h-25.002667l3.882667-11.562667h70.4l22.144 22.912h38.656l20.949333-23.637333h45.269334l20.864 22.826666h40.661333z\" p-id=\"2773\" fill=\"#b3b3b3\"></path></svg></button>"

    // 修改 css
    // https://blog.csdn.net/pangji0417/article/details/94029462
    var style = document.createElement("style");
    style.type = "text/css";
    var text = document.createTextNode(".modal-container.css-sdt3ue-RootContainer.e117yaqi0{display: none;}");
    var head = document.getElementsByTagName("head")[0];
    head.appendChild(style);

    function trans() {
        style.appendChild(text)
    }

    function unTrans() {
        // https://blog.csdn.net/lilongsy/article/details/83039528
        setTimeout(function(){
            style.removeChild(text)
        }, 300) // 需要与防连击的时间间隙匹配
    }

    // 不断尝试添加按钮
    // https://tieba.baidu.com/p/4473101647
    var myInterval = setInterval(function(){
        if (document.getElementsByClassName('second-section-container__2cAh')[0] == null) {
            console.warn("vim-binding: 页面可能还未加载完成")
            return
        }

        // https://zhidao.baidu.com/question/1832390421308672020.html
        document.getElementsByClassName('second-section-container__2cAh')[0].appendChild(vim_div);

        // 防连击 https://www.jianshu.com/p/a0be7d2b4fd9
        let last_click_time = new Date().getTime()
        let intervals = 500
        document.getElementById('vim-button').onclick = function changeKeyBinding() {
            if (new Date().getTime() - last_click_time < intervals) {
                console.warn("vim-binding: 连击")
                return
            }
            trans()
            document.getElementsByClassName('tool-button__2YsS css-4n3zyb-transparent-sm-Btn e131m59q0')[4].click()
            document.getElementsByClassName('e19sweus0 css-1x1kwut-BaseButtonComponent-StyledButton ery7n2v0')[4].click()
            document.getElementsByClassName('css-1xmg8zz-hoverOverlayBg-OptionContainer e1c4ivjc0')[0].click()
            document.getElementsByClassName('eqff6b23 css-wfwmcl-BaseButtonComponent-CloseButton ery7n2v0')[0].click()
            unTrans()
            console.log("vim-binding: key binding changed")
            last_click_time = new Date().getTime()
        }

        console.info("vim-binding: 按钮添加成功")
        clearInterval(myInterval)
    }, 1000)
})();