kheina-com / Blue-Blocker

Blocks all Twitter Blue verified users on twitter.com
Mozilla Public License 2.0
337 stars 28 forks source link

add quick and advanced tabs to the popup menu #150

Closed kheina closed 1 year ago

kheina commented 1 year ago

addresses #141, also addresses #155

the quickmenu only has 5 or 6 options in it and does not scroll. advanced menu has everything in it and will be where new options are added from now on.

to add a new checkbox option, follow the existing format in the html:

<div class="option">
    <label for="skip-verified" name="skip-verified">
        <div class="checkmark">
            <div></div>
        </div>
        <p>skip legacy verified users</p>
    </label>
    <span name="skip-verified-status"></span>
</div>

status can be omitted on the quick page

and then registered on the backend like this:

// custom callback
checkHandler(suspendBlockCollection, config, "suspendedBlockCollection", {
    callback(target) {
        // notice you need to update status yourself
        document.getElementsByName(target.id + "-status").forEach(status => {
            status.textContent = target.checked ? "paused" : "resumed";
            setTimeout(() => status.textContent = null, 1000);
        });
        api.action.setIcon({ path: target.checked ? "/icon/icon-128-greyscale.png" : "/icon/icon-128.png" });
    },
});
// custom option name
checkHandler(showBlockPopups, config, "showBlockPopups", {
    optionName: "popup-timer-slider",
});
// default everything
checkHandler(skipVerified, config, "skipVerified");

where the third value is the config key. if there are nested options, make sure they're labelled with name="<check input id>-option" and they will be hidden/shown automatically, or you can pass optionName to the checkHandler

you can also pass a custom callback to the checkHandler as well if you need to do something other than the normal updating status

image image