☰

Basic Functions (For userscripts)

Useful functions for myself

As of 2025-01-25. See the latest version.

This script should not be not be installed directly. It is a library for other scripts to include with the meta directive // @require https://update.greatest.deepsurf.us/scripts/456034/1526615/Basic%20Functions%20%28For%20userscripts%29.js 

  1. // ==UserScript==
  2. // @name               Basic Functions (For userscripts)
  3. // @name:zh-CN         常用函数（用户脚本）
  4. // @name:en            Basic Functions (For userscripts)
  5. // @namespace          PY-DNG Userscripts
  6. // @version            1.1
  7. // @description        Useful functions for myself
  8. // @description:zh-CN  自用函数
  9. // @description:en     Useful functions for myself
  10. // @author             PY-DNG
  11. // @license            GPL-3.0-or-later
  12. // ==/UserScript==
  13.  
  14. /* eslint-disable no-multi-spaces */
  15. /* eslint-disable no-return-assign */
  16.  
  17. // Note: version 0.8.2.1 is modified just the license and it's not uploaded to GF yet 23-11-26 15:03
  18. // Note: version 0.8.3.1 is added just the description of parseArgs and has not uploaded to GF yet 24-02-03 18:55
  19.  
  20. let [
  21.     // Console & Debug
  22.     LogLevel, DoLog, Err, Assert,
  23.  
  24.     // DOM
  25.     $, $All, $CrE, $AEL, $$CrE, addStyle, detectDom, destroyEvent,
  26.  
  27.     // Data
  28.     copyProp, copyProps, parseArgs, escJsStr, replaceText,
  29.  
  30.     // Environment & Browser
  31.     getUrlArgv, dl_browser, dl_GM,
  32.  
  33.     // Logic & Task
  34.     AsyncManager, queueTask, FunctionLoader, loadFuncs, require, isLoaded
  35. ] = (function() {
  36.     const [LogLevel, DoLog] = (function() {
  37.         /**
  38.          * level defination for DoLog function, bigger ones has higher possibility to be printed in console
  39.          * @typedef {Object} LogLevel
  40.          * @property {0} None - 0
  41.          * @property {1} Error - 1
  42.          * @property {2} Success - 2
  43.          * @property {3} Warning - 3
  44.          * @property {4} Info - 4
  45.          */
  46.         /** @type {LogLevel} */
  47.         const LogLevel = {
  48.             None: 0,
  49.             Error: 1,
  50.             Success: 2,
  51.             Warning: 3,
  52.             Info: 4,
  53.         };
  54.  
  55.         return [LogLevel, DoLog];
  56.  
  57.         /**
  58.          * @overload
  59.          * @param {String} content - log content
  60.          */
  61.         /**
  62.          * @overload
  63.          * @param {Number} level - level specified in LogLevel object
  64.          * @param {String} content - log content
  65.          */
  66.         /**
  67.          * Logger with level and logger function specification
  68.          * @overload
  69.          * @param {Number} level - level specified in LogLevel object
  70.          * @param {String} content - log content
  71.          * @param {String} logger - which log function to use (in window.console[logger])
  72.          */
  73.         function DoLog() {
  74.             // Get window
  75.             const win = (typeof(unsafeWindow) === 'object' && unsafeWindow !== null) ? unsafeWindow : window;
  76.  
  77.             const LogLevelMap = {};
  78.             LogLevelMap[LogLevel.None] = {
  79.                 prefix: '',
  80.                 color: 'color:#ffffff'
  81.             }
  82.             LogLevelMap[LogLevel.Error] = {
  83.                 prefix: '[Error]',
  84.                 color: 'color:#ff0000'
  85.             }
  86.             LogLevelMap[LogLevel.Success] = {
  87.                 prefix: '[Success]',
  88.                 color: 'color:#00aa00'
  89.             }
  90.             LogLevelMap[LogLevel.Warning] = {
  91.                 prefix: '[Warning]',
  92.                 color: 'color:#ffa500'
  93.             }
  94.             LogLevelMap[LogLevel.Info] = {
  95.                 prefix: '[Info]',
  96.                 color: 'color:#888888'
  97.             }
  98.             LogLevelMap[LogLevel.Elements] = {
  99.                 prefix: '[Elements]',
  100.                 color: 'color:#000000'
  101.             }
  102.  
  103.             // Current log level
  104.             DoLog.logLevel = (win.isPY_DNG && win.userscriptDebugging) ? LogLevel.Info : LogLevel.Warning; // Info Warning Success Error
  105.  
  106.             // Log counter
  107.             DoLog.logCount === undefined && (DoLog.logCount = 0);
  108.  
  109.             // Get args
  110.             let [level, logContent, logger] = parseArgs([...arguments], [
  111.                 [2],
  112.                 [1,2],
  113.                 [1,2,3]
  114.             ], [LogLevel.Info, 'DoLog initialized.', 'log']);
  115.  
  116.             let msg = '%c' + LogLevelMap[level].prefix + (typeof GM_info === 'object' ? `[${GM_info.script.name}]` : '') + (LogLevelMap[level].prefix ? ' ' : '');
  117.             let subst = LogLevelMap[level].color;
  118.  
  119.             switch (typeof(logContent)) {
  120.                 case 'string':
  121.                     msg += '%s';
  122.                     break;
  123.                 case 'number':
  124.                     msg += '%d';
  125.                     break;
  126.                 default:
  127.                     msg += '%o';
  128.                     break;
  129.             }
  130.  
  131.             // Log when log level permits
  132.             if (level <= DoLog.logLevel) {
  133.                 // Log to console when log level permits
  134.                 if (level <= DoLog.logLevel) {
  135.                     if (++DoLog.logCount > 512) {
  136.                         console.clear();
  137.                         DoLog.logCount = 0;
  138.                     }
  139.                     console[logger](msg, subst, logContent);
  140.                 }
  141.             }
  142.         }
  143.     }) ();
  144.  
  145.     /**
  146.      * Throw an error
  147.      * @param {String} msg - the error message
  148.      * @param {Error} [ErrorConstructor=Error] - which error constructor to use, defaulting to Error()
  149.      */
  150.     function Err(msg, ErrorConstructor=Error) {
  151.         throw new ErrorConstructor((typeof GM_info === 'object' ? `[${GM_info.script.name}]` : '') + msg);
  152.     }
  153.  
  154.     /**
  155.      * Assert given condition is true-like, otherwise throws given error
  156.      * @param {*} condition 
  157.      * @param {string} errmsg 
  158.      * @param {Error} [ErrorConstructor=Error] 
  159.      */
  160.     function Assert(condition, errmsg, ErrorConstructor=Error) {
  161.         condition || Err(errmsg, ErrorConstructor);
  162.     }
  163.  
  164.     /**
  165.      * Convenient function to querySelector
  166.      * @overload
  167.      * @param {Element|Document|DocumentFragment} [root] - which target to call querySelector on
  168.      * @param {string} selector - querySelector selector
  169.      * @returns 
  170.      */
  171.     function $() {
  172.         switch(arguments.length) {
  173.             case 2:
  174.                 return arguments[0].querySelector(arguments[1]);
  175.                 break;
  176.             default:
  177.                 return document.querySelector(arguments[0]);
  178.         }
  179.     }
  180.     /**
  181.      * Convenient function to querySelectorAll
  182.      * @overload
  183.      * @param {Element|Document|DocumentFragment} [root] - which target to call querySelectorAll on
  184.      * @param {string} selector - querySelectorAll selector
  185.      * @returns 
  186.      */
  187.     function $All() {
  188.         switch(arguments.length) {
  189.             case 2:
  190.                 return arguments[0].querySelectorAll(arguments[1]);
  191.                 break;
  192.             default:
  193.                 return document.querySelectorAll(arguments[0]);
  194.         }
  195.     }
  196.     /**
  197.      * Convenient function to querySelectorAll
  198.      * @overload
  199.      * @param {Document} [root] - which document to call createElement on
  200.      * @param {string} tagName
  201.      */
  202.     function $CrE() {
  203.         switch(arguments.length) {
  204.             case 2:
  205.                 return arguments[0].createElement(arguments[1]);
  206.                 break;
  207.             default:
  208.                 return document.createElement(arguments[0]);
  209.         }
  210.     }
  211.     /**
  212.      * Convenient function to addEventListener
  213.      * @overload
  214.      * @param {EventTarget} target - which target to call addEventListener on
  215.      * @param {string} type
  216.      * @param {EventListenerOrEventListenerObject | null} callback
  217.      * @param {AddEventListenerOptions | boolean} [options]
  218.      */
  219.     function $AEL(...args) {
  220.         /** @type {EventTarget} */
  221.         const target = args.shift();
  222.         return target.addEventListener.apply(target, args);
  223.     }
  224.     /**
  225.      * @typedef {[type: string, callback: EventListenerOrEventListenerObject | null, options: AddEventListenerOptions | boolean]} $AEL_Arguments 
  226.      */
  227.     /**
  228.      * @typedef {Object} $$CrE_Options
  229.      * @property {string} tagName
  230.      * @property {object} [props] - properties set by `element[prop] = value;`
  231.      * @property {object} [attrs] - attributes set by `element.setAttribute(attr, value);`
  232.      * @property {string | string[]} [classes] - class names to be set
  233.      * @property {object} [styles] - styles set by `element[style_name] = style_value;`
  234.      * @property {$AEL_Arguments[]} [listeners] - event listeners added by `$AEL(element, ...listener);`
  235.      */
  236.     /**
  237.      * @overload
  238.      * @param {$$CrE_Options} options
  239.      */
  240.     /**
  241.      * Create configorated element
  242.      * @overload
  243.      * @param {string} tagName
  244.      * @param {object} [props] - properties set by `element[prop] = value;`
  245.      * @param {object} [attrs] - attributes set by `element.setAttribute(attr, value);`
  246.      * @param {string | string[]} [classes] - class names to be set
  247.      * @param {object} [styles] - styles set by `element[style_name] = style_value;`
  248.      * @param {$AEL_Arguments[]} [listeners] - event listeners added by `$AEL(element, ...listener);`
  249.      * @returns {HTMLElement}
  250.      */
  251.     function $$CrE() {
  252.         const [tagName, props, attrs, classes, styles, listeners] = parseArgs([...arguments], [
  253.             function(args, defaultValues) {
  254.                 const arg = args[0];
  255.                 return {
  256.                     'string': () => [arg, ...defaultValues.filter((arg, i) => i > 0)],
  257.                     'object': () => ['tagName', 'props', 'attrs', 'classes', 'styles', 'listeners'].map((prop, i) => arg.hasOwnProperty(prop) ? arg[prop] : defaultValues[i])
  258.                 }[typeof arg]();
  259.             },
  260.             [1,2],
  261.             [1,2,3],
  262.             [1,2,3,4],
  263.             [1,2,3,4,5]
  264.         ], ['div', {}, {}, [], {}, []]);
  265.         const elm = $CrE(tagName);
  266.         for (const [name, val] of Object.entries(props)) {
  267.             elm[name] = val;
  268.         }
  269.         for (const [name, val] of Object.entries(attrs)) {
  270.             elm.setAttribute(name, val);
  271.         }
  272.         for (const cls of Array.isArray(classes) ? classes : [classes]) {
  273.             elm.classList.add(cls);
  274.         }
  275.         for (const [name, val] of Object.entries(styles)) {
  276.             elm.style[name] = val;
  277.         }
  278.         for (const listener of listeners) {
  279.             $AEL(elm, ...listener);
  280.         }
  281.         return elm;
  282.     }
  283.  
  284.     /**
  285.      * @overload
  286.      * @param {string} css - css content
  287.      * @returns {HTMLStyleElement}
  288.      */
  289.     /**
  290.      * @overload
  291.      * @param {string} css - css content
  292.      * @param {string} id - `id` attribute for <style> element
  293.      * @returns {HTMLStyleElement}
  294.      */
  295.     /**
  296.      * Append a style text to document(<head>) with a <style> element \
  297.      * removes existing <style> elements with same id if id provided, so style updates can be done by using one same id
  298.      * 
  299.      * Uses `GM_addElement` if `GM_addElement` exists and param `id` not specified. (`GM_addElement` uses id attribute, so specifing id manually when using `GM_addElement` takes no effect) \
  300.      * In another case `GM_addStyle` instead of `GM_addElement` exists, and both `id` and `parentElement` not specified, `GM_addStyle` will be used. \
  301.      * `document.createElement('style')` will be used otherwise.
  302.      * @overload
  303.      * @param {HTMLElement} parentElement - parent element to place <style> element
  304.      * @param {string} css - css content
  305.      * @param {string} id - `id` attribute for <style> element
  306.      * @returns {HTMLStyleElement}
  307.      */
  308.     function addStyle() {
  309.         // Get arguments
  310.         const [parentElement, css, id] = parseArgs([...arguments], [
  311.             [2],
  312.             [2,3],
  313.             [1,2,3]
  314.         ], [null, '', null]);
  315.  
  316.         if (typeof GM_addElement === 'function' && id === null) {
  317.             return GM_addElement(parentElement, 'style', { textContent: css });
  318.         } else if (typeof GM_addStyle === 'function' && parentElement === null && id === null) {
  319.             return GM_addStyle(css);
  320.         } else {
  321.             // Make <style>
  322.             const style = $CrE('style');
  323.             style.innerText = css;
  324.             id !== null && (style.id = id);
  325.             id !== null && Array.from($All(`style#${id}`)).forEach(elm => elm.remove());
  326.  
  327.             // Append to parentElement
  328.             (parentElement ?? document.head).appendChild(style);
  329.             return style;
  330.         }
  331.     }
  332.  
  333.     /**
  334.      * @typedef {Object} detectDom_options
  335.      * @property {Node} root - root target to observe on
  336.      * @property {string | string[]} [selector] - selector(s) to observe for, be aware that in options object it is named selector, but is named selectors in param
  337.      * @property {boolean} [attributes] - whether to observe existing elements' attribute changes
  338.      * @property {function} [callback] - if provided, use callback instead of Promise when selector element found
  339.      */
  340.     /**
  341.      * @overload
  342.      * @param {detectDom_options} options
  343.      * @returns {MutationObserver}
  344.      */
  345.     /**
  346.      * Get callback / resolve promise when specific dom/element appearce in document \
  347.      * uses MutationObserver for implementation \
  348.      * This behavior is different from versions that equals to or older than 0.8.4.2, so be careful when using it.
  349.      * @overload
  350.      * @param {Node} root - root target to observe on
  351.      * @param {string | string[]} [selectors] - selector(s) to observe for
  352.      * @param {boolean} [attributes] - whether to observe existing elements' attribute changes
  353.      * @param {function} [callback] - if provided, use callback instead of Promise when selector element found
  354.      * @returns {MutationObserver}
  355.      */
  356.     function detectDom() {
  357.         let [selectors, root, attributes, callback] = parseArgs([...arguments], [
  358.             function(args, defaultValues) {
  359.                 const arg = args[0];
  360.                 return {
  361.                     'string': () => [arg, ...defaultValues.filter((arg, i) => i > 0)],
  362.                     'object': () => ['selector', 'root', 'attributes', 'callback'].map((prop, i) => arg.hasOwnProperty(prop) ? arg[prop] : defaultValues[i])
  363.                 }[typeof arg]();
  364.             },
  365.             [2,1],
  366.             [2,1,3],
  367.             [2,1,3,4],
  368.         ], [[''], document, false, null]);
  369.         !Array.isArray(selectors) && (selectors = [selectors]);
  370.  
  371.         if (select(root, selectors)) {
  372.             for (const elm of selectAll(root, selectors)) {
  373.                 if (callback) {
  374.                     setTimeout(callback.bind(null, elm));
  375.                 } else {
  376.                     return Promise.resolve(elm);
  377.                 }
  378.             }
  379.         }
  380.  
  381.         const observer = new MutationObserver(mCallback);
  382.         observer.observe(root, {
  383.             childList: true,
  384.             subtree: true,
  385.             attributes,
  386.         });
  387.  
  388.         let isPromise = !callback;
  389.         return callback ? observer : new Promise((resolve, reject) => callback = resolve);
  390.  
  391.         function mCallback(mutationList, observer) {
  392.             const addedNodes = mutationList.reduce((an, mutation) => {
  393.                 switch (mutation.type) {
  394.                     case 'childList':
  395.                         an.push(...mutation.addedNodes);
  396.                         break;
  397.                     case 'attributes':
  398.                         an.push(mutation.target);
  399.                         break;
  400.                 }
  401.                 return an;
  402.             }, []);
  403.             const addedSelectorNodes = addedNodes.reduce((nodes, anode) => {
  404.                 if (anode.matches && match(anode, selectors)) {
  405.                     nodes.add(anode);
  406.                 }
  407.                 const childMatches = anode.querySelectorAll ? selectAll(anode, selectors) : [];
  408.                 for (const cm of childMatches) {
  409.                     nodes.add(cm);
  410.                 }
  411.                 return nodes;
  412.             }, new Set());
  413.             for (const node of addedSelectorNodes) {
  414.                 callback(node);
  415.                 isPromise && observer.disconnect();
  416.             }
  417.         }
  418.  
  419.         function selectAll(elm, selectors) {
  420.             !Array.isArray(selectors) && (selectors = [selectors]);
  421.             return selectors.map(selector => [...$All(elm, selector)]).reduce((all, arr) => {
  422.                 all.push(...arr);
  423.                 return all;
  424.             }, []);
  425.         }
  426.  
  427.         function select(elm, selectors) {
  428.             const all = selectAll(elm, selectors);
  429.             return all.length ? all[0] : null;
  430.         }
  431.  
  432.         function match(elm, selectors) {
  433.             return !!elm.matches && selectors.some(selector => elm.matches(selector));
  434.         }
  435.     }
  436.  
  437.     /**
  438.      * Just stopPropagation and preventDefault
  439.      * @param {Event} e
  440.      */
  441.     function destroyEvent(e) {
  442.         if (!e) {return false;};
  443.         if (!e instanceof Event) {return false;};
  444.         e.stopPropagation();
  445.         e.preventDefault();
  446.     }
  447.  
  448.     /**
  449.      * copy property value from obj1 to obj2 if exists
  450.      * @param {object} obj1
  451.      * @param {object} obj2
  452.      * @param {string|Symbol} prop
  453.      */
  454.     function copyProp(obj1, obj2, prop) {obj1.hasOwnProperty(prop) && (obj2[prop] = obj1[prop]);}
  455.     /**
  456.      * copy property values from obj1 to obj2 if exists
  457.      * @param {object} obj1 
  458.      * @param {object} obj2 
  459.      * @param {string|Symbol} [props] - properties to copy, copy all enumerable properties if not specified
  460.      */
  461.     function copyProps(obj1, obj2, props) {(props ?? Object.keys(obj1)).forEach((prop) => (copyProp(obj1, obj2, prop)));}
  462.  
  463.     /**
  464.      * Argument parser with sorting and defaultValue support \
  465.      * See use cases in other functions
  466.      * @param {Array} args - original arguments' value to be parsed 
  467.      * @param {(number[]|function)[]} rules - rules to sort arguments or custom function to parse arguments
  468.      * @param {Array} defaultValues - default values for arguments not provided a value
  469.      * @returns {Array}
  470.      */
  471.     function parseArgs(args, rules, defaultValues=[]) {
  472.         // args and rules should be array, but not just iterable (string is also iterable)
  473.         if (!Array.isArray(args) || !Array.isArray(rules)) {
  474.             throw new TypeError('parseArgs: args and rules should be array')
  475.         }
  476.  
  477.         // fill rules[0]
  478.         (!Array.isArray(rules[0]) || rules[0].length === 1) && rules.splice(0, 0, []);
  479.  
  480.         // max arguments length
  481.         const count = rules.length - 1;
  482.  
  483.         // args.length must <= count
  484.         if (args.length > count) {
  485.             throw new TypeError(`parseArgs: args has more elements(${args.length}) longer than ruless'(${count})`);
  486.         }
  487.  
  488.         // rules[i].length should be === i if rules[i] is an array, otherwise it should be a function
  489.         for (let i = 1; i <= count; i++) {
  490.             const rule = rules[i];
  491.             if (Array.isArray(rule)) {
  492.                 if (rule.length !== i) {
  493.                     throw new TypeError(`parseArgs: rules[${i}](${rule}) should have ${i} numbers, but given ${rules[i].length}`);
  494.                 }
  495.                 if (!rule.every((num) => (typeof num === 'number' && num <= count))) {
  496.                     throw new TypeError(`parseArgs: rules[${i}](${rule}) should contain numbers smaller than count(${count}) only`);
  497.                 }
  498.             } else if (typeof rule !== 'function') {
  499.                 throw new TypeError(`parseArgs: rules[${i}](${rule}) should be an array or a function.`)
  500.             }
  501.         }
  502.  
  503.         // Parse
  504.         const rule = rules[args.length];
  505.         let parsed;
  506.         if (Array.isArray(rule)) {
  507.             parsed = [...defaultValues];
  508.             for (let i = 0; i < rule.length; i++) {
  509.                 parsed[rule[i]-1] = args[i];
  510.             }
  511.         } else {
  512.             parsed = rule(args, defaultValues);
  513.         }
  514.         return parsed;
  515.     }
  516.  
  517.     /**
  518.      * escape str into javascript written format
  519.      * @param {string} str
  520.      * @param {string} [quote] 
  521.      * @returns 
  522.      */
  523.     function escJsStr(str, quote='"') {
  524.         str = str.replaceAll('\\', '\\\\').replaceAll(quote, '\\' + quote).replaceAll('\t', '\\t');
  525.         str = quote === '`' ? str.replaceAll(/(\$\{[^\}]*\})/g, '\\$1') : str.replaceAll('\r', '\\r').replaceAll('\n', '\\n');
  526.         return quote + str + quote;
  527.     }
  528.     
  529.     /**
  530.      * Replace given text with no mismatching of replacing replaced text
  531.      * 
  532.      * e.g. replaceText('aaaabbbbccccdddd', {'a': 'b', 'b': 'c', 'c': 'd', 'd': 'e'}) === 'bbbbccccddddeeee' \
  533.      *      replaceText('abcdAABBAA', {'BB': 'AA', 'AAAAAA': 'This is a trap!'}) === 'abcdAAAAAA' \
  534.      *      replaceText('abcd{AAAA}BB}', {'{AAAA}': '{BB', '{BBBB}': 'This is a trap!'}) === 'abcd{BBBB}' \
  535.      *      replaceText('abcd', {}) === 'abcd'
  536.      * 
  537.      * **Note**: \
  538.      *  replaceText will replace in sort of replacer's iterating sort \
  539.      *  e.g. currently replaceText('abcdAABBAA', {'BBAA': 'TEXT', 'AABB': 'TEXT'}) === 'abcdAATEXT' \
  540.      *  but remember: (As MDN Web Doc said,) Although the keys of an ordinary Object are ordered now, this was \
  541.      *  not always the case, and the order is complex. As a result, it's best not to rely on property order. \
  542.      *  So, don't expect replaceText will treat replacer key-values in any specific sort. Use replaceText to \
  543.      *  replace irrelevance replacer keys only.
  544.      * @param {string} text 
  545.      * @param {object} replacer 
  546.      * @returns {string}
  547.      */
  548.     function replaceText(text, replacer) {
  549.         if (Object.entries(replacer).length === 0) {return text;}
  550.         const [models, targets] = Object.entries(replacer);
  551.         const len = models.length;
  552.         let text_arr = [{text: text, replacable: true}];
  553.         for (const [model, target] of Object.entries(replacer)) {
  554.             text_arr = replace(text_arr, model, target);
  555.         }
  556.         return text_arr.map((text_obj) => (text_obj.text)).join('');
  557.  
  558.         function replace(text_arr, model, target) {
  559.             const result_arr = [];
  560.             for (const text_obj of text_arr) {
  561.                 if (text_obj.replacable) {
  562.                     const splited = text_obj.text.split(model);
  563.                     for (const part of splited) {
  564.                         result_arr.push({text: part, replacable: true});
  565.                         result_arr.push({text: target, replacable: false});
  566.                     }
  567.                     result_arr.pop();
  568.                 } else {
  569.                     result_arr.push(text_obj);
  570.                 }
  571.             }
  572.             return result_arr;
  573.         }
  574.     }
  575.  
  576.     /**
  577.      * @typedef {Object} getUrlArgv_options
  578.      * @property {string} name
  579.      * @property {string} [url]
  580.      * @property {string} [defaultValue]
  581.      * @property {function} [dealFunc] - function that inputs original getUrlArgv result and outputs final return value
  582.      */
  583.     /**
  584.      * @overload
  585.      * @param {Object} getUrlArgv_options
  586.      * @returns 
  587.      */
  588.     /**
  589.      * Get a url argument from location.href
  590.      * @param {string} name
  591.      * @param {string} [url]
  592.      * @param {string} [defaultValue]
  593.      * @param {function} [dealFunc] - function that inputs original getUrlArgv result and outputs final return value
  594.      */
  595.     function getUrlArgv() {
  596.         const [name, url, defaultValue, dealFunc] = parseArgs([...arguments], [
  597.             function(args, defaultValues) {
  598.                 const arg = args[0];
  599.                 return {
  600.                     'string': () => [arg, ...defaultValues.filter((arg, i) => i > 0)],
  601.                     'object': () => ['name', 'url', 'defaultValue', 'dealFunc'].map((prop, i) => arg.hasOwnProperty(prop) ? arg[prop] : defaultValues[i])
  602.                 }[typeof arg]();
  603.             },
  604.             [2,1],
  605.             [2,1,3],
  606.             [2,1,3,4]
  607.         ], [null, location.href, null, a => a]);
  608.  
  609.         if (name === null) { return null; }
  610.  
  611.         const search = new URL(url).search;
  612.         const objSearch = new URLSearchParams(search);
  613.         const raw = objSearch.has(name) ? objSearch.get(name) : defaultValue;
  614.         const argv = dealFunc(raw);
  615.  
  616.         return argv;
  617.     }
  618.  
  619.     /**
  620.      * download file from given url by simulating <a download="..." href=""></a> clicks\
  621.      * a common use case is to download Blob objects as file from `URL.createObjectURL`
  622.      * @param {string} url 
  623.      * @param {string} filename 
  624.      */
  625.     function dl_browser(url, filename) {
  626.         const a = document.createElement('a');
  627.         a.href = url;
  628.         a.download = filename;
  629.         a.click();
  630.     }
  631.  
  632.     /**
  633.      * File download function\
  634.      * details looks like the detail of GM_xmlhttpRequest\
  635.      * onload function will be called after file saved to disk
  636.      * @param {object} details
  637.      */
  638.     function dl_GM(details) {
  639.         if (!details.url || !details.name) {return false;};
  640.  
  641.         // Configure request object
  642.         const requestObj = {
  643.             url: details.url,
  644.             responseType: 'blob',
  645.             onload: function(e) {
  646.                 // Save file
  647.                 dl_browser(URL.createObjectURL(e.response), details.name);
  648.  
  649.                 // onload callback
  650.                 details.onload ? details.onload(e) : function() {};
  651.             }
  652.         }
  653.         if (details.onloadstart       ) {requestObj.onloadstart        = details.onloadstart;};
  654.         if (details.onprogress        ) {requestObj.onprogress         = details.onprogress;};
  655.         if (details.onerror           ) {requestObj.onerror            = details.onerror;};
  656.         if (details.onabort           ) {requestObj.onabort            = details.onabort;};
  657.         if (details.onreadystatechange) {requestObj.onreadystatechange = details.onreadystatechange;};
  658.         if (details.ontimeout         ) {requestObj.ontimeout          = details.ontimeout;};
  659.  
  660.         // Send request
  661.         Assert(typeof GM_xmlhttpRequest === 'function', 'GM_xmlhttpRequest should be provided in order to use dl_GM', TypeError);
  662.         GM_xmlhttpRequest(requestObj);
  663.     }
  664.  
  665.     /**
  666.      * Manager to manager async tasks\
  667.      * This was written when I haven't learnt Promise, so for fluent promise users, just ignore it:)
  668.      * 
  669.      * # Usage
  670.      * ```javascript
  671.      * // This simulates a async task, it can be a XMLHttpRequest, some file reading, or so on...
  672.      * function someAsyncTask(callback, duration) {
  673.      *     const result = Math.random(); 
  674.      *     setTimeout(() => callback(result), duration);
  675.      * }
  676.      * 
  677.      * // Do 10 async tasks, and log all results when all async tasks finished
  678.      * const AM = new AsyncManager();
  679.      * const results = [];
  680.      * AM.onfinish = function() {
  681.      *     console.log('All tasks finished!');
  682.      *     console.log(results);
  683.      * }
  684.      * 
  685.      * for (let i = 0; i < 10; i++) {
  686.      *     AM.add();
  687.      *     const duration = (Math.random() * 5 + 5) * 1000;
  688.      *     const index = i;
  689.      *     someAsyncTask(result => {
  690.      *         console.log(`Task ${index} finished after ${duration}ms!`);
  691.      *         results[index] = result;
  692.      *     }, duration);
  693.      *     console.log(`Task ${index} started!`);
  694.      * }
  695.      * 
  696.      * // Set AM.finishEvent to true after all tasks added, allowing AsyncManager to call onfinish callback 
  697.      * ```
  698.      * @constructor
  699.      */
  700.     function AsyncManager() {
  701.         const AM = this;
  702.  
  703.         // Ongoing tasks count
  704.         this.taskCount = 0;
  705.  
  706.         // Whether generate finish events
  707.         let finishEvent = false;
  708.         Object.defineProperty(this, 'finishEvent', {
  709.             configurable: true,
  710.             enumerable: true,
  711.             get: () => (finishEvent),
  712.             set: (b) => {
  713.                 finishEvent = b;
  714.                 b && AM.taskCount === 0 && AM.onfinish && AM.onfinish();
  715.             }
  716.         });
  717.  
  718.         // Add one task
  719.         this.add = () => (++AM.taskCount);
  720.  
  721.         // Finish one task
  722.         this.finish = () => ((--AM.taskCount === 0 && AM.finishEvent && AM.onfinish && AM.onfinish(), AM.taskCount));
  723.     }
  724.  
  725.     /**
  726.      * Put tasks in specific queue and order their execution
  727.      * Set `queueTask[queueId].max`, `queueTask[queueId].sleep` to custom queue's max ongoing tasks and sleep time between tasks
  728.      * @param {function} task - task function to run
  729.      * @param {string | Symbol} queueId - identifier to specify a target queue. if provided, given task will be added into specified queue. 
  730.      * @returns 
  731.      */
  732.     function queueTask(task, queueId='default') {
  733.         init();
  734.  
  735.         return new Promise((resolve, reject) => {
  736.             queueTask.hasOwnProperty(queueId) || (queueTask[queueId] = { tasks: [], ongoing: 0 });
  737.             queueTask[queueId].tasks.push({task, resolve, reject});
  738.             checkTask(queueId);
  739.         });
  740.  
  741.         function init() {
  742.             if (!queueTask[queueId]?.initialized) {
  743.                 queueTask[queueId] = {
  744.                     // defaults
  745.                     tasks: [],
  746.                     ongoing: 0,
  747.                     max: 3,
  748.                     sleep: 500,
  749.  
  750.                     // user's pre-sets
  751.                     ...(queueTask[queueId] || {}),
  752.  
  753.                     // initialized flag
  754.                     initialized: true
  755.                 }
  756.             };
  757.         }
  758.  
  759.         function checkTask() {
  760.             const queue = queueTask[queueId];
  761.             setTimeout(() => {
  762.                 if (queue.ongoing < queue.max && queue.tasks.length) {
  763.                     const task = queue.tasks.shift();
  764.                     queue.ongoing++;
  765.                     setTimeout(
  766.                         () => task.task().then(v => {
  767.                             queue.ongoing--;
  768.                             task.resolve(v);
  769.                             checkTask(queueId);
  770.                         }).catch(e => {
  771.                             queue.ongoing--;
  772.                             task.reject(e);
  773.                             checkTask(queueId);
  774.                         }),
  775.                         queue.sleep
  776.                     );
  777.                 }
  778.             });
  779.         }
  780.     }
  781.  
  782.     const [FunctionLoader, loadFuncs, require, isLoaded] = (function() {
  783.         /**
  784.          * 一般用作函数对象oFunc的加载条件，检测当前环境是否适合/需要该oFunc加载
  785.          * @typedef {Object} checker_func
  786.          * @property {string} type - checker's identifier
  787.          * @property {function} func - actual internal judgement implementation
  788.          */
  789.         /**
  790.          * 一般用作函数对象oFunc的加载条件，检测当前环境是否适合/需要该oFunc加载
  791.          * @typedef {Object} checker
  792.          * @property {string} type - checker's identifier
  793.          * @property {*} value - param that goes into checker function
  794.          */
  795.         /**
  796.          * 被加载函数对象的func函数
  797.          * @callback oFuncBody
  798.          * @param {oFunc} oFunc
  799.          * @returns {*|Promise<*>}
  800.          */
  801.         /**
  802.          * 被加载执行的函数对象
  803.          * @typedef {Object} oFunc
  804.          * @property {string} id - 每次load（每个FuncPool实例）内唯一的标识符
  805.          * @property {checker[]|checker} [checkers] - oFunc执行的条件
  806.          * @property {string[]|string} [detectDom] - 如果提供，开始checker检查前会首先等待其中所有css选择器对应的元素在document中出现
  807.          * @property {string[]|string} [dependencies] - 如果提供，应为其他函数对象的id或者id列表；开始checker检查前会首先等待其中所有指定的函数对象加载完毕
  808.          * @property {boolean} [readonly] - 指定该函数的返回值是否应该被Proxy保护为不可修改对象
  809.          * @property {oFuncBody} func - 实际实现了功能的函数
  810.          * @property {boolean} [STOP] - [调试用] 指定不执行此函数对象
  811.          */
  812.  
  813.         const registered_checkers = {
  814.             switch: value => value,
  815.             url: value => location.href === value,
  816.             path: value => location.pathname === value,
  817.             regurl: value => !!location.href.match(value),
  818.             regpath: value => !!location.pathname.match(value),
  819.             starturl: value => location.href.startsWith(value),
  820.             startpath: value => location.pathname.startsWith(value),
  821.             func: value => value()
  822.         };
  823.  
  824.         class FuncPool extends EventTarget {
  825.             static #STILL_LOADING = Symbol('oFunc still loading');
  826.             static FunctionNotFound = Symbol('Function not found');
  827.             static FunctionNotLoaded = Symbol('Function not loaded');
  828.  
  829.             /** @typedef {symbol|*} return_value */
  830.             /** @type {Map<oFunc, return_value>} */
  831.             #oFuncs = new Map();
  832.  
  833.             /**
  834.              * 创建新函数池，并加载提供的函数对象
  835.              * @param {oFunc[]|oFunc} [oFuncs] - 可选，需要加载的函数对象或其数组，不提供时默认为空数组
  836.              * @returns {FuncPool}
  837.              */
  838.             constructor(oFuncs=[]) {
  839.                 super();
  840.                 this.load(oFuncs);
  841.             }
  842.  
  843.             /**
  844.              * 加载提供的一个或多个函数对象，并将其加入到函数池中
  845.              * @param {oFunc[]|oFunc} [oFuncs] - 可选，需要加载的函数对象或其数组，不提供时默认为空数组
  846.              */
  847.             load(oFuncs=[]) {
  848.                 oFuncs = Array.isArray(oFuncs) ? oFuncs : [oFuncs];
  849.                 for (const oFunc of oFuncs) {
  850.                     this.#load(oFunc);
  851.                 }
  852.             }
  853.  
  854.             /**
  855.              * 加载一个函数对象，并将其加入到函数池中
  856.              * 当id重复时，直接报错RedeclarationError
  857.              * 异步函数，当彻底load完毕/checkers确定不加载时resolve
  858.              * 当加载完毕时，广播load事件；如果全部加载完毕，还广播all_load事件
  859.              * @param {oFunc} oFunc
  860.              * @returns {Promise<undefined>}
  861.              */
  862.             async #load(oFunc) {
  863.                 const that = this;
  864.  
  865.                 // 已经在函数池中的函数对象，不重复load
  866.                 if (this.#oFuncs.has(oFunc)) {
  867.                     return;
  868.                 }
  869.  
  870.                 // 检查有无重复id
  871.                 for (const o of this.#oFuncs.keys()) {
  872.                     if (o.id === oFunc.id) {
  873.                         throw new RedeclarationError(`Attempts to load oFunc with id already in use: ${oFunc.id}`);
  874.                     }
  875.                 }
  876.  
  877.                 // 设置当前返回值为STILL_LOADING
  878.                 this.#oFuncs.set(oFunc, FuncPool.#STILL_LOADING);
  879.  
  880.                 // 加载依赖
  881.                 const dependencies = Array.isArray(oFunc.dependencies) ? oFunc.dependencies : ( oFunc.dependencies ? [oFunc.dependencies] : [] );
  882.                 const promise_deps = Promise.all(dependencies.map(id => new Promise((resolve, reject) => {
  883.                     $AEL(that, 'load', e => e.detail.oFunc.id === id && resolve());
  884.                 })));
  885.  
  886.                 // 检测detectDOM中css选择器指定的元素出现
  887.                 const selectors = Array.isArray(oFunc.detectDom) ? oFunc.detectDom : ( oFunc.detectDom ? [oFunc.detectDom] : [] );
  888.                 const promise_css = Promise.all(selectors.map(selector => detectDom(selector)));
  889.  
  890.                 // 等待上述两项完成
  891.                 await Promise.all([promise_deps, promise_css]);
  892.  
  893.                 // 检测checkers加载条件
  894.                 const checkers = Array.isArray(oFunc.checkers) ? oFunc.checkers : ( oFunc.checkers ? [oFunc.checkers] : [] );
  895.                 if (!testCheckers(checkers)) {
  896.                     return;
  897.                 }
  898.  
  899.                 // 执行函数对象
  900.                 const raw_return_value = oFunc.func(oFunc);
  901.                 const return_value = await Promise.resolve(raw_return_value);
  902.  
  903.                 // 设置返回值
  904.                 this.#oFuncs.set(oFunc, return_value);
  905.  
  906.                 // 广播事件
  907.                 this.dispatchEvent(new CustomEvent('load', {
  908.                     detail: {
  909.                         oFunc, id: oFunc.id, return_value
  910.                     }
  911.                 }));
  912.                 Array.from(this.#oFuncs.values()).every(v => v !== FuncPool.#STILL_LOADING) &&
  913.                     this.dispatchEvent(new CustomEvent('all_load', {}));
  914.             }
  915.  
  916.             /**
  917.              * 获取指定函数对象的返回值
  918.              * 如果指定的函数对象不存在，返回FunctionNotFound
  919.              * 如果指定的函数对象存在但尚未加载，返回FunctionNotLoaded
  920.              * 如果函数对象指定了readonly为真值，则返回前用Proxy包装返回值，使其不可修改
  921.              * @param {string} id - 函数对象的id
  922.              * @returns {*}
  923.              */
  924.             require(id) {
  925.                 for (const [oFunc, return_value] of this.#oFuncs.entries()) {
  926.                     if (oFunc.id === id) {
  927.                         if (return_value === FuncPool.#STILL_LOADING) {
  928.                             return FuncPool.FunctionNotLoaded;
  929.                         } else {
  930.                             return oFunc.readonly ? FuncPool.#MakeReadonlyObj(return_value) : return_value;
  931.                         }
  932.                     }
  933.                 }
  934.                 return FuncPool.FunctionNotFound;
  935.             }
  936.  
  937.             isLoaded(id) {
  938.                 for (const [oFunc, return_value] of this.#oFuncs.entries()) {
  939.                     if (oFunc.id === id) {
  940.                         if (return_value === FuncPool.#STILL_LOADING) {
  941.                             return false;
  942.                         } else {
  943.                             return true;
  944.                         }
  945.                     }
  946.                     return false;
  947.                 }
  948.             }
  949.  
  950.             /**
  951.              * 以Proxy包装value，使其属性只读
  952.              * 如果传入的不是obj，则直接返回value
  953.              * @param {Object} val
  954.              * @returns {Proxy}
  955.              */
  956.             static #MakeReadonlyObj(val) {
  957.                 return isObject(val) ? new Proxy(val, {
  958.                     get: function(target, property, receiver) {
  959.                         return FuncPool.#MakeReadonlyObj(target[property]);
  960.                     },
  961.                     set: function(target, property, value, receiver) {},
  962.                     has: function(target, prop) {},
  963.                     setPrototypeOf(target, newProto) {
  964.                         return false;
  965.                     },
  966.                     defineProperty(target, property, descriptor) {
  967.                         return true;
  968.                     },
  969.                     deleteProperty(target, property) {
  970.                         return false;
  971.                     },
  972.                     preventExtensions(target) {
  973.                         return false;
  974.                     }
  975.                 }) : val;
  976.  
  977.                 function isObject(value) {
  978.                     return ['object', 'function'].includes(typeof value) && value !== null;
  979.                 }
  980.             }
  981.         }
  982.         class RedeclarationError extends TypeError {}
  983.         class CircularDependencyError extends ReferenceError {}
  984.  
  985.  
  986.         // 预置的函数池
  987.         const default_pool = new FuncPool();
  988.  
  989.         /**
  990.          * 在预置的函数池中加载函数对象或其数组
  991.          * @param {oFunc[]|oFunc} oFuncs - 需要执行的函数对象
  992.          * @returns {FuncPool}
  993.          */
  994.         function loadFuncs(oFuncs) {
  995.             default_pool.load(oFuncs);
  996.             return default_pool;
  997.         }
  998.  
  999.         /**
  1000.          * 在预置的函数池中获取函数对象的返回值
  1001.          * @param {string} id - 函数对象的字符串id
  1002.          * @returns {*}
  1003.          */
  1004.         function require(id) {
  1005.             return default_pool.require(id);
  1006.         }
  1007.  
  1008.         /**
  1009.          * 在预置的函数池中检查指定函数对象是否已经加载完毕（有返回值可用）
  1010.          * @param {string} id - 函数对象的字符串id
  1011.          * @returns {boolean}
  1012.          */
  1013.         function isLoaded(id) {
  1014.             return default_pool.isLoaded(id);
  1015.         }
  1016.  
  1017.         /**
  1018.          * 测试给定checker是否检测通过
  1019.          * 给定多个checker时，checkers之间是 或 关系，有一个checker通过即算作整体通过
  1020.          * 注意此函数设计和旧版testChecker的设计不同，旧版中一个checker可以有多个值，还可通过checker.all指定多值之间的关系为 与 还是 或
  1021.          * @param {checker[]|checker} [checkers] - 需要检测的checkers
  1022.          * @returns {boolean}
  1023.          */
  1024.         function testCheckers(checkers=[]) {
  1025.             checkers = Array.isArray(checkers) ? checkers : [checkers];
  1026.             return checkers.length === 0 || checkers.some(checker => !!registered_checkers[checker.type]?.(checker.value));
  1027.         }
  1028.  
  1029.         /**
  1030.          * 注册新checker
  1031.          * 如果给定type已经被其他checker占用，则会报错RedeclarationError
  1032.          * @param {string} type - checker类名
  1033.          * @param {function} func - checker implementation
  1034.          */
  1035.         function registerChecker(type, func) {
  1036.             if (registered_checkers.hasOwnProperty(type)) {
  1037.                 throw RedeclarationError(`Attempts to register checker with type already in use: ${type}`);
  1038.             }
  1039.             registered_checkers[type] = func;
  1040.         }
  1041.  
  1042.         const FunctionLoader = {
  1043.             FuncPool,
  1044.             testCheckers,
  1045.             registerChecker,
  1046.             get checkers() {
  1047.                 return Object.assign({}, registered_checkers);
  1048.             },
  1049.             Error: {
  1050.                 RedeclarationError,
  1051.                 CircularDependencyError
  1052.             }
  1053.         };
  1054.         return [FunctionLoader, loadFuncs, require, isLoaded];
  1055.     }) ();
  1056.  
  1057.     return [
  1058.         // Console & Debug
  1059.         LogLevel, DoLog, Err, Assert,
  1060.  
  1061.         // DOM
  1062.         $, $All, $CrE, $AEL, $$CrE, addStyle, detectDom, destroyEvent,
  1063.  
  1064.         // Data
  1065.         copyProp, copyProps, parseArgs, escJsStr, replaceText,
  1066.  
  1067.         // Environment & Browser
  1068.         getUrlArgv, dl_browser, dl_GM,
  1069.  
  1070.         // Logic & Task
  1071.         AsyncManager, queueTask, FunctionLoader, loadFuncs, require, isLoaded
  1072.     ];
  1073. }) ();