MFC Tagger+

A set of tools to help MyFigureCollection contributors with tagging items
换行
// ==UserScript==
// @name        MFC Tagger+
// @description A set of tools to help MyFigureCollection contributors with tagging items
// @namespace   https://takkkane.tumblr.com/scripts/mfcTagCounter
// @version     0.2.1
// @author      Nefere
// @homepage    https://github.com/Nefere256/mfc-tagger-plus/tree/main
// @supportURL  https://github.com/Nefere256/mfc-tagger-plus/tree/main
// @match       https://myfigurecollection.net/entry/*
// @match       https://myfigurecollection.net/browse.v4.php*
// @match       https://myfigurecollection.net/browse/calendar/*
// @match       https://myfigurecollection.net/*
// @match       https://myfigurecollection.net/item/browse/figure/
// @match       https://myfigurecollection.net/item/browse/goods/
// @match       https://myfigurecollection.net/item/browse/media/
// @match       https://myfigurecollection.net/item/browse/calendar/*
// @icon        https://www.google.com/s2/favicons?sz=64&domain=myfigurecollection.net
// @license     MIT
// @connect     github.com
// @run-at      document-idle
// @grant       GM_getValue
// @grant       GM_setValue
// @grant       GM_addStyle
// @grant       GM_getResourceText
// @grant       GM_xmlhttpRequest
// ==/UserScript==
GM_addStyle(GM_getResourceText('css'));
var app = (function () {
    'use strict';
 
    function noop() { }
    function run(fn) {
        return fn();
    }
    function blank_object() {
        return Object.create(null);
    }
    function run_all(fns) {
        fns.forEach(run);
    }
    function is_function(thing) {
        return typeof thing === 'function';
    }
    function safe_not_equal(a, b) {
        return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function');
    }
    function is_empty(obj) {
        return Object.keys(obj).length === 0;
    }
 
    const globals = (typeof window !== 'undefined'
        ? window
        : typeof globalThis !== 'undefined'
            ? globalThis
            : global);
    function detach(node) {
        if (node.parentNode) {
            node.parentNode.removeChild(node);
        }
    }
    function children(element) {
        return Array.from(element.childNodes);
    }
    function custom_event(type, detail, { bubbles = false, cancelable = false } = {}) {
        const e = document.createEvent('CustomEvent');
        e.initCustomEvent(type, bubbles, cancelable, detail);
        return e;
    }
 
    let current_component;
    function set_current_component(component) {
        current_component = component;
    }
 
    const dirty_components = [];
    const binding_callbacks = [];
    let render_callbacks = [];
    const flush_callbacks = [];
    const resolved_promise = /* @__PURE__ */ Promise.resolve();
    let update_scheduled = false;
    function schedule_update() {
        if (!update_scheduled) {
            update_scheduled = true;
            resolved_promise.then(flush);
        }
    }
    function add_render_callback(fn) {
        render_callbacks.push(fn);
    }
    // flush() calls callbacks in this order:
    // 1. All beforeUpdate callbacks, in order: parents before children
    // 2. All bind:this callbacks, in reverse order: children before parents.
    // 3. All afterUpdate callbacks, in order: parents before children. EXCEPT
    //    for afterUpdates called during the initial onMount, which are called in
    //    reverse order: children before parents.
    // Since callbacks might update component values, which could trigger another
    // call to flush(), the following steps guard against this:
    // 1. During beforeUpdate, any updated components will be added to the
    //    dirty_components array and will cause a reentrant call to flush(). Because
    //    the flush index is kept outside the function, the reentrant call will pick
    //    up where the earlier call left off and go through all dirty components. The
    //    current_component value is saved and restored so that the reentrant call will
    //    not interfere with the "parent" flush() call.
    // 2. bind:this callbacks cannot trigger new flush() calls.
    // 3. During afterUpdate, any updated components will NOT have their afterUpdate
    //    callback called a second time; the seen_callbacks set, outside the flush()
    //    function, guarantees this behavior.
    const seen_callbacks = new Set();
    let flushidx = 0; // Do *not* move this inside the flush() function
    function flush() {
        // Do not reenter flush while dirty components are updated, as this can
        // result in an infinite loop. Instead, let the inner flush handle it.
        // Reentrancy is ok afterwards for bindings etc.
        if (flushidx !== 0) {
            return;
        }
        const saved_component = current_component;
        do {
            // first, call beforeUpdate functions
            // and update components
            try {
                while (flushidx < dirty_components.length) {
                    const component = dirty_components[flushidx];
                    flushidx++;
                    set_current_component(component);
                    update(component.$$);
                }
            }
            catch (e) {
                // reset dirty state to not end up in a deadlocked state and then rethrow
                dirty_components.length = 0;
                flushidx = 0;
                throw e;
            }
            set_current_component(null);
            dirty_components.length = 0;
            flushidx = 0;
            while (binding_callbacks.length)
                binding_callbacks.pop()();
            // then, once components are updated, call
            // afterUpdate functions. This may cause
            // subsequent updates...
            for (let i = 0; i < render_callbacks.length; i += 1) {
                const callback = render_callbacks[i];
                if (!seen_callbacks.has(callback)) {
                    // ...so guard against infinite loops
                    seen_callbacks.add(callback);
                    callback();
                }
            }
            render_callbacks.length = 0;
        } while (dirty_components.length);
        while (flush_callbacks.length) {
            flush_callbacks.pop()();
        }
        update_scheduled = false;
        seen_callbacks.clear();
        set_current_component(saved_component);
    }
    function update($$) {
        if ($$.fragment !== null) {
            $$.update();
            run_all($$.before_update);
            const dirty = $$.dirty;
            $$.dirty = [-1];
            $$.fragment && $$.fragment.p($$.ctx, dirty);
            $$.after_update.forEach(add_render_callback);
        }
    }
    /**
     * Useful for example to execute remaining `afterUpdate` callbacks before executing `destroy`.
     */
    function flush_render_callbacks(fns) {
        const filtered = [];
        const targets = [];
        render_callbacks.forEach((c) => fns.indexOf(c) === -1 ? filtered.push(c) : targets.push(c));
        targets.forEach((c) => c());
        render_callbacks = filtered;
    }
    const outroing = new Set();
    function transition_in(block, local) {
        if (block && block.i) {
            outroing.delete(block);
            block.i(local);
        }
    }
    function mount_component(component, target, anchor, customElement) {
        const { fragment, after_update } = component.$$;
        fragment && fragment.m(target, anchor);
        if (!customElement) {
            // onMount happens before the initial afterUpdate
            add_render_callback(() => {
                const new_on_destroy = component.$$.on_mount.map(run).filter(is_function);
                // if the component was destroyed immediately
                // it will update the `$$.on_destroy` reference to `null`.
                // the destructured on_destroy may still reference to the old array
                if (component.$$.on_destroy) {
                    component.$$.on_destroy.push(...new_on_destroy);
                }
                else {
                    // Edge case - component was destroyed immediately,
                    // most likely as a result of a binding initialising
                    run_all(new_on_destroy);
                }
                component.$$.on_mount = [];
            });
        }
        after_update.forEach(add_render_callback);
    }
    function destroy_component(component, detaching) {
        const $$ = component.$$;
        if ($$.fragment !== null) {
            flush_render_callbacks($$.after_update);
            run_all($$.on_destroy);
            $$.fragment && $$.fragment.d(detaching);
            // TODO null out other refs, including component.$$ (but need to
            // preserve final state?)
            $$.on_destroy = $$.fragment = null;
            $$.ctx = [];
        }
    }
    function make_dirty(component, i) {
        if (component.$$.dirty[0] === -1) {
            dirty_components.push(component);
            schedule_update();
            component.$$.dirty.fill(0);
        }
        component.$$.dirty[(i / 31) | 0] |= (1 << (i % 31));
    }
    function init(component, options, instance, create_fragment, not_equal, props, append_styles, dirty = [-1]) {
        const parent_component = current_component;
        set_current_component(component);
        const $$ = component.$$ = {
            fragment: null,
            ctx: [],
            // state
            props,
            update: noop,
            not_equal,
            bound: blank_object(),
            // lifecycle
            on_mount: [],
            on_destroy: [],
            on_disconnect: [],
            before_update: [],
            after_update: [],
            context: new Map(options.context || (parent_component ? parent_component.$$.context : [])),
            // everything else
            callbacks: blank_object(),
            dirty,
            skip_bound: false,
            root: options.target || parent_component.$$.root
        };
        append_styles && append_styles($$.root);
        let ready = false;
        $$.ctx = instance
            ? instance(component, options.props || {}, (i, ret, ...rest) => {
                const value = rest.length ? rest[0] : ret;
                if ($$.ctx && not_equal($$.ctx[i], $$.ctx[i] = value)) {
                    if (!$$.skip_bound && $$.bound[i])
                        $$.bound[i](value);
                    if (ready)
                        make_dirty(component, i);
                }
                return ret;
            })
            : [];
        $$.update();
        ready = true;
        run_all($$.before_update);
        // `false` as a special case of no DOM component
        $$.fragment = create_fragment ? create_fragment($$.ctx) : false;
        if (options.target) {
            if (options.hydrate) {
                const nodes = children(options.target);
                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
                $$.fragment && $$.fragment.l(nodes);
                nodes.forEach(detach);
            }
            else {
                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
                $$.fragment && $$.fragment.c();
            }
            if (options.intro)
                transition_in(component.$$.fragment);
            mount_component(component, options.target, options.anchor, options.customElement);
            flush();
        }
        set_current_component(parent_component);
    }
    /**
     * Base class for Svelte components. Used when dev=false.
     */
    class SvelteComponent {
        $destroy() {
            destroy_component(this, 1);
            this.$destroy = noop;
        }
        $on(type, callback) {
            if (!is_function(callback)) {
                return noop;
            }
            const callbacks = (this.$$.callbacks[type] || (this.$$.callbacks[type] = []));
            callbacks.push(callback);
            return () => {
                const index = callbacks.indexOf(callback);
                if (index !== -1)
                    callbacks.splice(index, 1);
            };
        }
        $set($$props) {
            if (this.$$set && !is_empty($$props)) {
                this.$$.skip_bound = true;
                this.$$set($$props);
                this.$$.skip_bound = false;
            }
        }
    }
 
    function dispatch_dev(type, detail) {
        document.dispatchEvent(custom_event(type, Object.assign({ version: '3.59.2' }, detail), { bubbles: true }));
    }
    function validate_slots(name, slot, keys) {
        for (const slot_key of Object.keys(slot)) {
            if (!~keys.indexOf(slot_key)) {
                console.warn(`<${name}> received an unexpected slot "${slot_key}".`);
            }
        }
    }
    /**
     * Base class for Svelte components with some minor dev-enhancements. Used when dev=true.
     */
    class SvelteComponentDev extends SvelteComponent {
        constructor(options) {
            if (!options || (!options.target && !options.$$inline)) {
                throw new Error("'target' is a required option");
            }
            super();
        }
        $destroy() {
            super.$destroy();
            this.$destroy = () => {
                console.warn('Component was already destroyed'); // eslint-disable-line no-console
            };
        }
        $capture_state() { }
        $inject_state() { }
    }
 
    /* src\App.svelte generated by Svelte v3.59.2 */
 
    const { Object: Object_1, console: console_1 } = globals;
 
    function create_fragment(ctx) {
    	const block = {
    		c: noop,
    		l: function claim(nodes) {
    			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
    		},
    		m: noop,
    		p: noop,
    		i: noop,
    		o: noop,
    		d: noop
    	};
 
    	dispatch_dev("SvelteRegisterBlock", {
    		block,
    		id: create_fragment.name,
    		type: "component",
    		source: "",
    		ctx
    	});
 
    	return block;
    }
 
    function instance($$self, $$props) {
    	let { $$slots: slots = {}, $$scope } = $$props;
    	validate_slots('App', slots, []);
 
    	(async function () {
 
    		/**
     * Name of the class used for a tag counter container.
     * It should be not used on the page it's inserted to.
     **/
    		var TAG_CLASSNAME = "us-tag";
 
    		/**
     * Name of the class absent on the page.
     * Used to return empty collection of nodes from a function.
     **/
    		var FAKE_CLASS_PLACEHOLDER = "fake-class-placeholder";
 
    		/**
     * A time in miliseconds to wait between requests to MFC.
     * Too short time may results in "429 - Too many requests" error responses.
     * Can be increased with REQUEST_DELAY_MULTIPLIER.
     **/
    		var REQUEST_DELAY = 1000;
 
    		/**
     * A multipler that is used on REQUEST_DELAY when 429 response error is obtained.
     * Should be over 1 to work properly.
     **/
    		var REQUEST_DELAY_MULTIPLIER = 1.1;
 
    		/**
     * A time in seconds for how long the entry data saved in a cache is considered "fresh" and up to date.
     * After the entry data is "stale", it is removed from cache and may be replaced with new data.
     **/
    		var CACHE_FRESH_SECONDS = 10 * 60;
 
    		/**
     * Map entries for tagCounterCache that are yet to be persisted in the extension storage.
    	 * The contents: see tagCounterCache
     **/
    		var CACHE_SAVE_ENTRIES = [];
 
    		/**
     * How many entries have to be added to the cache so the cache can be persisted in the extension storage.
    	 * That way if the user gets into another page, some of the data gathered will not be lost.
     * It requires using GM.getValue() and GM.setValue()
     **/
    		var CACHE_SAVE_AFTER_SETTING_VALUES_ORDER = 5;
 
    		/**
     * A cache for tag count indicated in the entry page.
     * It's a Map() consisted of:
     * * keys: pathname of an entry page ("/entry/39")
     * * values: object with fields:
     * ** number: integer with number of tags on the entry page (39)
     * ** updatedTime: timestamp of when the map was updated.
     * Map entries may be deleted after time indicated in CACHE_FRESH_SECONDS.
     **/
    		var tagCounterCache;
 
    		/**
     * Util method. It let the thread sleep for ms (miliseconds) between calls to MFC website.
     **/
    		function sleep(ms) {
    			return new Promise(resolve => setTimeout(resolve, ms));
    		}
 
    		/**
     * Get tagCounterCache from a persistent storage.
     **/
    		async function getTagCounterCache() {
    			return new Map(Object.entries(JSON.parse(await GM.getValue('tagCounterCache', '{}'))));
    		}
 
    		/**
     * Save tagCounterCache with new CACHE_SAVE_ENTRIES to a persistent storage.
     * CACHE_SAVE_ENTRIES will be cleared after succesful save.
     **/
    		async function saveTagCounterCache() {
    			var newTagCounterCache = await getTagCounterCache();
 
    			for (var entry of CACHE_SAVE_ENTRIES) {
    				newTagCounterCache.set(entry.key, entry.value);
    			}
 
    			GM.setValue('tagCounterCache', JSON.stringify(Object.fromEntries(newTagCounterCache)));
    			tagCounterCache = newTagCounterCache;
    			newTagCounterCache.length = 0; /* clear new data as they are persisted */
    		}
 
    		/**
     * Save an url and count of tags to both tagCounterCache and CACHE_SAVE_ENTRIES.
     * If CACHE_SAVE_ENTRIES will have CACHE_SAVE_AFTER_SETTING_VALUES_ORDER entries, 
     * the persistent storage will be updated.
     **/
    		async function pushToTagCounterCache(url, tagCounter) {
    			if (tagCounter) {
    				var time = Date.now();
 
    				var entry = {
    					key: url,
    					value: {
    						'number': tagCounter,
    						'updatedTime': time
    					}
    				};
 
    				tagCounterCache.set(entry.key, entry.value);
    				CACHE_SAVE_ENTRIES.push(entry);
 
    				if (CACHE_SAVE_ENTRIES.length % CACHE_SAVE_AFTER_SETTING_VALUES_ORDER == 0) {
    					saveTagCounterCache();
    				}
    			}
    		}
 
    		/**
     * Get a number of tags for a specified url from cache.
     * if the info is stale after CACHE_FRESH_SECONDS since last update of entry,
     * the info would be deleted, and the functon will return 0.
     * Otherwise, return number of tags.
     **/
    		function getTagCounterFromTagCounterCache(url) {
    			var tagCounterPair = tagCounterCache.get(url);
 
    			if (tagCounterPair == null) {
    				return 0;
    			}
 
    			var stalePairDate = new Date(tagCounterPair.updatedTime);
    			stalePairDate.setSeconds(stalePairDate.getSeconds() + CACHE_FRESH_SECONDS);
 
    			if (stalePairDate < Date.now()) {
    				tagCounterCache.delete(url);
    				return 0;
    			}
 
    			return tagCounterPair.number;
    		}
 
    		/**
    * Add a style for tag counter container (with a TAG_CLASSNAME class).
    * It's done only once the page is loaded.
    **/
    		function addStyles() {
    			let style = document.createElement('style');
    			style.type = 'text/css';
 
    			style.innerHTML = "\
            .item-icon ." + TAG_CLASSNAME + " {\
            position: absolute;\
            display: block;\
            right: -4px;\
            top: -4px;\
            padding: 4px;\
            border-radius: 3px;\
            text-align: center;\
            vertical-align: middle;\
            min-width: 12px;\
            font-weight: 700;\
            font-size: 11px;\
            color: gold;\
            background-color: darkgreen\
            }";
 
    			document.getElementsByTagName('head')[0].appendChild(style);
    		}
 
    		function getEntryContainers() {
    			var pathname = window.location.pathname;
    			var search = window.location.search;
    			var searchParams = new URLSearchParams(search);
    			var tbParam = searchParams.get("_tb");
 
    			if (pathname.includes("/entry/") || pathname.includes("/browse.v4.php") || pathname.includes("/browse/calendar/") || pathname.includes("/item/browse/calendar/") || pathname.includes("/item/browse/figure/") || pathname.includes("/item/browse/goods/") || pathname.includes("/item/browse/media/") || tbParam !== null) {
    				var result = document.querySelectorAll("#wide .result:not(.hidden)"); /* encyclopedia entry */ /* search results with filters */ /* calendar page */ /* new calendar page */ /* new figures page */ /* new goods page */ /* new media page */
    				return result;
    			}
 
    			console.log("unsupported getEntryContainers");
    			return document.querySelectorAll(FAKE_CLASS_PLACEHOLDER);
    		}
 
    		/**
    * Check if the current page (intended to be one with search results)
    * is detailed list.
    * The info is taken from GET/query params instead from the page contents.
    **/
    		function isDetailedList() {
    			var search = window.location.search;
    			var searchParams = new URLSearchParams(search);
    			var outputParam = searchParams.get("output"); /* 0 - detailedList, 1,2 - grid, 3 - diaporama */
    			return outputParam == 0;
    		}
 
    		function getItemsFromContainer(entryContainer) {
    			var icons = entryContainer.querySelectorAll(".item-icons .item-icon");
 
    			if (icons.length > 0) {
    				return icons;
    			}
 
    			var pathname = window.location.pathname;
 
    			if (pathname.includes("/browse.v4.php") && isDetailedList()) {
    				return document.querySelectorAll(FAKE_CLASS_PLACEHOLDER); /* search page, detailed list view */
    			}
 
    			console.log("unsupported getItemsFromContainer");
    			return document.querySelectorAll(FAKE_CLASS_PLACEHOLDER);
    		}
 
    		function getTagCounterFromHtml(html) {
    			var parser = new DOMParser();
    			var doc = parser.parseFromString(html, 'text/html');
    			var tagCounterNode = doc.querySelector("div.tbx-target-TAGS .actions > .meta");
    			if (tagCounterNode == null) console.log("No tag counter element on downloaded html.");
    			return tagCounterNode.textContent;
    		}
 
    		function addTagCounterToSearchResult(itemLinkElement, countOfTags) {
    			var tagElement = document.createElement("span");
    			tagElement.setAttribute("class", TAG_CLASSNAME);
    			tagElement.textContent = countOfTags;
    			itemLinkElement.appendChild(tagElement);
    		}
 
    		async function fetchAndHandle(queue) {
    			var resultQueue = [];
 
    			for (var itemElement of queue) {
    				var itemLinkElement = itemElement.firstChild;
    				var entryLink = itemLinkElement.getAttribute("href");
 
    				fetch(entryLink, {
    					headers: {
    						"User-Agent": GM.info.script.name + " " + GM.info.script.version
    					}
    				}).then(function (response) {
    					if (response.ok) {
    						response.text().then(function (html) {
    							var countOfTags = getTagCounterFromHtml(html);
    							addTagCounterToSearchResult(itemLinkElement, countOfTags);
    							pushToTagCounterCache(entryLink, countOfTags);
    						});
    					}
 
    					return Promise.reject(response);
    				}).catch(function (err) {
    					if (err.status == 429) {
    						console.warn('Too many requests. Added the request to fetch later', err.url);
    						resultQueue.push(itemElement);
    						REQUEST_DELAY = REQUEST_DELAY * REQUEST_DELAY_MULTIPLIER;
    						console.info('Increased delay to ' + REQUEST_DELAY);
    					}
    				});
 
    				await sleep(REQUEST_DELAY);
    			}
 
    			return resultQueue;
    		}
 
    		async function main() {
    			var cacheQueue = [];
    			var entryContainers = getEntryContainers();
 
    			entryContainers.forEach(entryContainer => {
    				var itemsElements = getItemsFromContainer(entryContainer);
 
    				itemsElements.forEach(itemElement => {
    					cacheQueue.push(itemElement);
    				});
    			});
 
    			var queue = [];
    			tagCounterCache = await getTagCounterCache();
 
    			for (var itemElement of cacheQueue) {
    				var itemLinkElement = itemElement.firstChild;
    				var entryLink = itemLinkElement.getAttribute("href");
    				var cache = getTagCounterFromTagCounterCache(entryLink);
 
    				if (cache > 0) {
    					addTagCounterToSearchResult(itemLinkElement, cache);
    				} else {
    					queue.push(itemElement);
    				}
    			}
 
    			while (queue.length) {
    				queue = await fetchAndHandle(queue);
    			}
 
    			saveTagCounterCache();
    		}
 
    		/**
    * All variables and methods are set.
    * Enjoy the show.
    **/
    		addStyles();
 
    		main();
    	})();
 
    	const writable_props = [];
 
    	Object_1.keys($$props).forEach(key => {
    		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1.warn(`<App> was created with unknown prop '${key}'`);
    	});
 
    	return [];
    }
 
    class App extends SvelteComponentDev {
    	constructor(options) {
    		super(options);
    		init(this, options, instance, create_fragment, safe_not_equal, {});
 
    		dispatch_dev("SvelteRegisterComponent", {
    			component: this,
    			tagName: "App",
    			options,
    			id: create_fragment.name
    		});
    	}
    }
 
    const app = new App({
        target: document.body,
        props: {
            name: "World"
        }
    });
 
    return app;
 
})();