Kinobot Hide Used Requests

Adds a toggle in user page to hide used/rejected requests.
换行
// ==UserScript==
// @name         Kinobot Hide Used Requests
// @namespace    http://tampermonkey.net/
// @version      2.2
// @description  Adds a toggle in user page to hide used/rejected requests.
// @author       seaque
// @license      MIT
// @match        *://*.kino.caretas.club/user*
// @require      https://code.jquery.com/jquery-1.12.4.min.js
// @icon         data:image/svg+xml,<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 112.16 122.88"><defs><style>.cls-1{fill: whitesmoke;}</style></defs><title>film-camera</title><path class="cls-1" d="M14.76,47.89H71.34a9.56,9.56,0,0,1,9.54,9.53V93a9.58,9.58,0,0,1-9.54,9.54H53.86l12.7,20.37H54.73L40.89,104.27l-14,18.61h-12l12.62-20.37H14.76A9.57,9.57,0,0,1,5.22,93V57.42a9.56,9.56,0,0,1,9.54-9.53Zm.24-38a15,15,0,1,1-15,15,15,15,0,0,1,15-15ZM5.27,24.93A3.05,3.05,0,1,1,8.32,28a3,3,0,0,1-3.05-3.05Zm9.81,9.66a3.06,3.06,0,1,1,3-3.06,3.05,3.05,0,0,1-3,3.06Zm9.66-9.82a3.06,3.06,0,1,1-3-3.05,3.06,3.06,0,0,1,3,3.05Zm-9.82-9.66a3.06,3.06,0,1,1-3.05,3.06,3.06,3.06,0,0,1,3.05-3.06ZM61.06,0A19.89,19.89,0,1,1,41.17,19.89,19.88,19.88,0,0,1,61.06,0Zm-.12,5.8a4.44,4.44,0,1,1-4.44,4.44A4.44,4.44,0,0,1,60.94,5.8ZM46.88,20.08a4.45,4.45,0,1,1,4.44,4.44,4.44,4.44,0,0,1-4.44-4.44ZM61.17,34.14a4.44,4.44,0,1,1,4.44-4.44,4.44,4.44,0,0,1-4.44,4.44Zm14-14.28a4.44,4.44,0,1,1-4.44-4.45,4.44,4.44,0,0,1,4.44,4.45ZM86.3,91V60.38l25.86-15.24v61.51L86.3,91Z"/></svg>
// @run-at       document-end
// @grant        GM_addStyle
// ==/UserScript==
/* globals jQuery, $, waitForKeyElements */
 
(function() {
    'use strict';
 
    const setVisibility = (status) => {
        let used = $("#requests_table > thead > tr > td:nth-child(2):contains('1')");
        status == "hidden" ? used.parent().hide() : used.parent().show();
    };
 
    const createHideToggle = () => {
        const tableElement = document.createElement('tr');
        tableElement.setAttribute('id', 'my_tr');
        tableElement.innerHTML = `
          <td></td>
          <td>
            <img src="https://cdn-icons-png.flaticon.com/512/60/60954.png" style="width: 1.5em; margin-right: 10px; filter: invert(100%); pointer-events: none;">
            <input type="checkbox" id="switch" class="checkbox" />
            <label for="switch" class="toggle"></label>
         </td>
        `;
 
        // Use Greasymonkey function to style the button
        GM_addStyle("#my_tr { text-align: right; } .toggle { position: relative; display: inline-block; width: 1.5em; background-color: #EFCFD4; border-radius: 10px; border: 2px solid #DEC2C5; padding: 10px; } .toggle:after { content: ''; position: absolute; width: 1.1em; height: 1.1em; border-radius: 50%; background-color: #770919; top: 1px; left: 1px; bottom:1px; transition: all 0.5s; margin-bottom:5px; } .checkbox:checked + .toggle::after { left : 1.5em; background-color: #FFFFFF;} .checkbox:checked + .toggle { background-color: #770919; } .checkbox { display : none; }");
 
        const header = document.querySelector('.header');
        header.parentNode.insertBefore(tableElement, header);
    };
 
    const handleCheckboxChange = () => {
        const checkbox = document.querySelector("#my_tr > td:nth-child(2) > input")
 
        checkbox.addEventListener('change', function() {
            if (this.checked) {
                setVisibility('hidden');
                localStorage.setItem('hideOnLoad', true);
            } else {
                setVisibility('visible');
                localStorage.setItem('hideOnLoad', false);
            }
        });
 
    };
 
    const init = () => {
 
        const checkbox = document.querySelector("#my_tr > td:nth-child(2) > input");
        const hideOnLoad = localStorage.getItem('hideOnLoad');
 
        createHideToggle();
        setVisibility();
        handleCheckboxChange();
 
        if (hideOnLoad !== null) {
            if (hideOnLoad === "true") {
                setVisibility("hidden");
                document.querySelector('#my_tr input[type="checkbox"]').checked = true;
            } else {
                setVisibility("visible");
                document.querySelector('#my_tr input[type="checkbox"]').checked = false;
            }
        }
    };
 
    init();
 
})();