[GC] - Enhanced Relic Log View

See additional details related to your relic log, included view filter options.
目前为 2024-01-19 提交的版本。查看最新版本。
Wrap lines
// ==UserScript==
// @name         [GC] - Enhanced Relic Log View
// @namespace    https://gf.qytechs.cn/en/users/1225524-kaitlin
// @version      0.1
// @license      MIT
// @description  See additional details related to your relic log, included view filter options.
// @author       Cupkait
// @match        https://www.grundos.cafe/space/warehouse/relics/
// @grant        none
// ==/UserScript==


(function () {
    var pageContent = document.getElementById('page_content');
    var relicCountElement = document.querySelector("#page_content > main > div.center > p:nth-child(2)");

    var relicCount = relicCountElement.innerText.replace(/[^\d/]/g, '');
    var [countLogged, relicTotal] = relicCount.split('/').map(value => parseInt(value.trim(), 10));

    var countNeeded = relicTotal - countLogged;
    var relicPercent = ((countLogged / relicTotal) * 100).toFixed(1);

    relicCountElement.innerHTML += `<br>Your collection is <strong>${relicPercent}%</strong> complete.<br> You are missing <strong>${countNeeded}</strong> relics.`;

    var dropdown = document.createElement('select');
    dropdown.id = 'orderDropdown';
    dropdown.style.marginLeft = '10px';
    dropdown.style.marginBottom = '10px';

    var createOption = (value, text, disabled = false, selected = false) => {
        var option = document.createElement('option');
        option.value = value;
        option.text = text;
        option.disabled = disabled;
        option.selected = selected;
        return option;
    };

    dropdown.add(createOption('choose_view', 'Choose View', true, true));

    var options = ['Show Needed', 'Show Logged', 'Show All'];
    options.forEach(optionText => {
        dropdown.add(createOption(optionText.toLowerCase().replace(' ', '_'), optionText));
    });

    relicCountElement.parentNode.insertBefore(dropdown, relicCountElement.nextSibling);

    var flexColumns = document.querySelectorAll('.flex-column');

    dropdown.addEventListener('change', function () {
        var relicLoggedDivs = document.querySelectorAll('#reliclogged');
        var notLoggedDivs = document.querySelectorAll('#notlogged');

        if (dropdown.value === 'show_all') {
            toggleVisibility(relicLoggedDivs, '');
            toggleVisibility(notLoggedDivs, '');
        } else if (dropdown.value === 'show_needed') {
            toggleVisibility(relicLoggedDivs, 'none');
            toggleVisibility(notLoggedDivs, '');
        } else if (dropdown.value === 'show_logged') {
            toggleVisibility(notLoggedDivs, 'none');
            toggleVisibility(relicLoggedDivs, '');
        }
    });

    flexColumns.forEach(flexColumn => {
      console.log(flexColumn);
        var imagesWithOpacity = flexColumn.querySelectorAll('img[style*="opacity"]');
        flexColumn.setAttribute('id', imagesWithOpacity.length > 0 ? 'notlogged' : 'reliclogged');
    });

    function toggleVisibility(elements, displayValue) {
        elements.forEach(element => {
            element.style.display = displayValue;
        });
    }
})();
欢迎访问Greasy Fork镜像
