☰

Greasyfork script-set-edit button

Add / Remove script into / from script set directly in GF script info page

  1. // ==UserScript==
  2. // @name               Greasyfork script-set-edit button
  3. // @name:zh-CN         Greasyfork 快捷编辑收藏
  4. // @name:zh-TW         Greasyfork 快捷編輯收藏
  5. // @name:en            Greasyfork script-set-edit button
  6. // @name:en-US         Greasyfork script-set-edit button
  7. // @name:fr            Greasyfork Set Edit+
  8. // @namespace          Greasyfork-Favorite
  9. // @version            0.3.2.2
  10. // @description        Add / Remove script into / from script set directly in GF script info page
  11. // @description:zh-CN  在GF脚本页直接编辑收藏集
  12. // @description:zh-TW  在GF腳本頁直接編輯收藏集
  13. // @description:en     Add / Remove script into / from script set directly in GF script info page
  14. // @description:en-US  Add / Remove script into / from script set directly in GF script info page
  15. // @description:fr     Ajouter un script à un jeu de scripts / supprimer un script d'un jeu de scripts directement sur la page d'informations sur les scripts GF
  16. // @author             PY-DNG
  17. // @license            GPL-3.0-or-later
  18. // @match              http*://*.greatest.deepsurf.us/*
  19. // @match              http*://*.sleazyfork.org/*
  20. // @match              http*://*.cn-greatest.deepsurf.us/*
  21. // @require            https://update.greatest.deepsurf.us/scripts/456034/1597683/Basic%20Functions%20%28For%20userscripts%29.js
  22. // @require            https://update.greatest.deepsurf.us/scripts/449583/1324274/ConfigManager.js
  23. // @icon               data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAbBJREFUOE+Vk7GKGlEUhr8pAiKKDlqpCDpLUCzWBxCENBa+hBsL9wHsLWxXG4tNtcGH0MIiWopY7JSGEUWsbESwUDMw4Z7siLsZDbnlPff/7n/+e67G38sA6sAXIPVWXgA/gCdgfinRPuhfCoXCw3Q65XA4eLBl6zvw1S2eAZqmvTqOc5/NZhkMBqRSKWzbvgYxgbwquoAX4MGyLHK5HIlEgtFo9C+IOFEAo1gsWsvlUmyPx2MymYxAhsMh6XT6lpM7BXjWdf1xNpuRz+fl8GQywTAMGo0G1WpVnJxOJ692vinADPgcDAaZz+cCOR6PmKZJPB4XUb/fp1wuewF+KoBCf1JVBVE5dDodms3mWdDtdqlUKl6AX+8ALmS9XgtM0/5kvNlspKX9fv8RIgBp4bISCoXo9XqsVitKpRK6rrPb7STQ7XZ7eVRaeAYerz14OBxGOfL7/eIgmUwKzHEcJZEQ1eha1wBqPxqNihufzyeQWCzmtiPPqJYM0jWIyiISibBYLAgEAtTrdVqt1nmQXN0rcH/LicqmVqvRbrdN27bfjbKru+nk7ZD3Z7q4+b++82/YPKIrXsKZ3AAAAABJRU5ErkJggg==
  24. // @grant              GM_setValue
  25. // @grant              GM_getValue
  26. // @grant              GM_listValues
  27. // @grant              GM_deleteValue
  28. // @grant              GM_registerMenuCommand
  29. // @grant              GM_unregisterMenuCommand
  30. // ==/UserScript==
  31.  
  32. /* eslint-disable no-multi-spaces */
  33. /* eslint-disable no-return-assign */
  34.  
  35. /* global LogLevel DoLog Err $ $All $CrE $AEL $$CrE addStyle detectDom destroyEvent copyProp copyProps parseArgs escJsStr replaceText getUrlArgv dl_browser dl_GM AsyncManager queueTask FunctionLoader loadFuncs require isLoaded */
  36. /* global ConfigManager */
  37.  
  38. (function __MAIN__() {
  39.     'use strict';
  40.  
  41. 	const CONST = {
  42. 		TextAllLang: {
  43.             DEFAULT: 'en-US',
  44. 			'zh-CN': {
  45. 				FavEdit: '收藏集：',
  46. 				Add: '加入此集',
  47. 				Remove: '移出此集',
  48. 				Edit: '手动编辑',
  49. 				EditIframe: '页内编辑',
  50. 				CloseIframe: '关闭编辑',
  51. 				CopySID: '复制脚本ID',
  52. 				Sync: '同步',
  53. 				NotLoggedIn: '请先登录Greasyfork',
  54. 				NoSetsYet: '您还没有创建过收藏集',
  55. 				NewSet: '新建收藏集',
  56. 				sortByApiDefault: ['默认排序', '默认倒序'],
  57. 				Working: ['工作中...', '就快好了...'],
  58. 				InSetStatus: ['[ ]', '[✔]'],
  59. 				Groups: {
  60. 					Server: 'GreasyFork收藏集',
  61. 					Local: '本地收藏集',
  62. 					New: '新建'
  63. 				},
  64. 				Refreshing: {
  65. 					List: '获取收藏集列表...',
  66. 					Script: '获取收藏集内容...',
  67. 					Data: '获取收藏集数据...'
  68. 				},
  69. 				UseAPI: ['[ ] 使用GF的收藏集API', '[✔]使用GF的收藏集API'],
  70. 				Error: {
  71. 					AlreadyExist: '脚本已经在此收藏集中了',
  72. 					NotExist: '脚本不在此收藏集中',
  73. 					NetworkError: '网络错误',
  74. 					Unknown: '未知错误'
  75. 				}
  76. 			},
  77. 			'zh-TW': {
  78. 				FavEdit: '收藏集：',
  79. 				Add: '加入此集',
  80. 				Remove: '移出此集',
  81. 				Edit: '手動編輯',
  82. 				EditIframe: '頁內編輯',
  83. 				CloseIframe: '關閉編輯',
  84. 				CopySID: '複製腳本ID',
  85. 				Sync: '同步',
  86. 				NotLoggedIn: '請先登錄Greasyfork',
  87. 				NoSetsYet: '您還沒有創建過收藏集',
  88. 				NewSet: '新建收藏集',
  89. 				sortByApiDefault: ['默認排序', '默認倒序'],
  90. 				Working: ['工作中...', '就快好了...'],
  91. 				InSetStatus: ['[ ]', '[✔]'],
  92. 				Groups: {
  93. 					Server: 'GreasyFork收藏集',
  94. 					Local: '本地收藏集',
  95. 					New: '新建'
  96. 				},
  97. 				Refreshing: {
  98. 					List: '獲取收藏集清單...',
  99. 					Script: '獲取收藏集內容...',
  100. 					Data: '獲取收藏集數據...'
  101. 				},
  102. 				UseAPI: ['[ ] 使用GF的收藏集API', '[✔]使用GF的收藏集API'],
  103. 				Error: {
  104. 					AlreadyExist: '腳本已經在此收藏集中了',
  105. 					NotExist: '腳本不在此收藏集中',
  106. 					NetworkError: '網絡錯誤',
  107. 					Unknown: '未知錯誤'
  108. 				}
  109. 			},
  110. 			'en-US': {
  111. 				FavEdit: 'Script set: ',
  112. 				Add: 'Add',
  113. 				Remove: 'Remove',
  114. 				Edit: 'Edit Manually',
  115. 				EditIframe: 'In-Page Edit',
  116. 				CloseIframe: 'Close Editor',
  117. 				CopySID: 'Copy Script-ID',
  118. 				Sync: 'Sync',
  119. 				NotLoggedIn: 'Login to greasyfork to use script sets',
  120. 				NoSetsYet: 'You haven\'t created a collection yet',
  121. 				NewSet: 'Create a new set',
  122. 				sortByApiDefault: ['Default', 'Default reverse'],
  123. 				Working: ['Working...', 'Just a moment...'],
  124. 				InSetStatus: ['[ ]', '[✔]'],
  125. 				Groups: {
  126. 					Server: 'GreasyFork',
  127. 					Local: 'Local',
  128. 					New: 'New'
  129. 				},
  130. 				Refreshing: {
  131. 					List: 'Fetching script sets...',
  132. 					Script: 'Fetching set content...',
  133. 					Data: 'Fetching script sets data...'
  134. 				},
  135. 				UseAPI: ['[ ] Use GF API', '[✔] Use GF API'],
  136. 				Error: {
  137. 					AlreadyExist: 'Script is already in set',
  138. 					NotExist: 'Script is not in set yet',
  139. 					NetworkError: 'Network Error',
  140. 					Unknown: 'Unknown Error'
  141. 				}
  142. 			},
  143. 			'default': {
  144. 				FavEdit: 'Script set: ',
  145. 				Add: 'Add',
  146. 				Remove: 'Remove',
  147. 				Edit: 'Edit Manually',
  148. 				EditIframe: 'In-Page Edit',
  149. 				CloseIframe: 'Close Editor',
  150. 				CopySID: 'Copy Script-ID',
  151. 				Sync: 'Sync',
  152. 				NotLoggedIn: 'Login to greasyfork to use script sets',
  153. 				NoSetsYet: 'You haven\'t created a collection yet',
  154. 				NewSet: 'Create a new set',
  155. 				sortByApiDefault: ['Default', 'Default reverse'],
  156. 				Working: ['Working...', 'Just a moment...'],
  157. 				InSetStatus: ['[ ]', '[✔]'],
  158. 				Groups: {
  159. 					Server: 'GreasyFork',
  160. 					Local: 'Local',
  161. 					New: 'New'
  162. 				},
  163. 				Refreshing: {
  164. 					List: 'Fetching script sets...',
  165. 					Script: 'Fetching set content...',
  166. 					Data: 'Fetching script sets data...'
  167. 				},
  168. 				UseAPI: ['[ ] Use GF API', '[✔] Use GF API'],
  169. 				Error: {
  170. 					AlreadyExist: 'Script is already in set',
  171. 					NotExist: 'Script is not in set yet',
  172. 					NetworkError: 'Network Error',
  173. 					Unknown: 'Unknown Error'
  174. 				}
  175. 			},
  176. 		},
  177. 		URL: {
  178. 			SetLink: `https://${location.host}/scripts?set=$ID`,
  179. 			SetEdit: `https://${location.host}/users/$UID/sets/$ID/edit`
  180. 		},
  181. 		ConfigRule: {
  182. 			'version-key': 'config-version',
  183. 			ignores: ['useAPI'],
  184. 			defaultValues: {
  185. 				'script-sets': {
  186. 					sets: [],
  187. 					time: 0,
  188. 					'config-version': 2,
  189. 				},
  190. 				'useAPI': true
  191. 			},
  192. 			'updaters': {
  193. 				/*'config-key': [
  194. 					function() {
  195. 						// This function contains updater for config['config-key'] from v0 to v1
  196. 					},
  197. 					function() {
  198. 						// This function contains updater for config['config-key'] from v1 to v2
  199. 					}
  200. 				]*/
  201. 				'script-sets': [
  202. 					config => {
  203. 						// v0 ==> v1
  204. 						// Fill set.id
  205. 						const sets = config.sets;
  206. 						sets.forEach(set => {
  207. 							const id = getUrlArgv(set.link, 'set');
  208. 							set.id = id;
  209. 							set.scripts = null; // After first refresh, it should be an array of SIDs:string
  210. 						});
  211.  
  212. 						// Delete old version identifier
  213. 						delete config.version;
  214.  
  215. 						return config;
  216. 					},
  217. 					config => {
  218. 						// v1 ==> v2
  219. 						return config
  220. 					}
  221. 				]
  222. 			},
  223. 		},
  224.         get Text() {
  225.             const page_i18n = $('.language-selector-locale').value;
  226.             const browser_i18n = navigator.language;
  227.             return findLanguagePack(CONST.TextAllLang, page_i18n, browser_i18n);
  228.  
  229.             function findLanguagePack(packs, ...lang_codes) {
  230.                 const getSuffix = code => code.slice(0, code.indexOf('-'));
  231.                 
  232.                 const lang_code =
  233.                     // Pack code that directly matches one of provided language code
  234.                     Object.keys(packs).find(pcode =>
  235.                         lang_codes.some(lcode => pcode === lcode)
  236.                     ) ??
  237.                     // Pack code which suffix matches one of provided language code
  238.                     Object.keys(packs).find(pcode =>
  239.                         lang_codes.some(lcode => getSuffix(pcode) === getSuffix(lcode))
  240.                     ) ??
  241.                     // No matches, use default language pack
  242.                     packs.DEFAULT;
  243.                 
  244.                 return packs[lang_code];
  245.             }
  246.         },
  247. 	};
  248.  
  249. 	const CM = new ConfigManager(CONST.ConfigRule);
  250. 	const CONFIG = CM.Config;
  251. 	CM.updateAllConfigs();
  252. 	CM.setDefaults();
  253.  
  254.     const functions = {
  255.         utils: {
  256.             /** @typedef {Awaited<ReturnType<typeof functions.utils.func>>} utils */
  257.             func() {
  258.                 function makeBooleanSettings(settings) {
  259.                     for (const setting of settings) {
  260.                         makeBooleanMenu(setting.text, setting.key, setting.defaultValue, setting.callback, setting.initCallback);
  261.                     }
  262.  
  263.                     function makeBooleanMenu(texts, key, defaultValue=false, callback=null, initCallback=false) {
  264.                         const initialVal = GM_getValue(key, defaultValue);
  265.                         const initialText = texts[initialVal + 0];
  266.                         let id = makeMenu(initialText, onClick);
  267.                         initCallback && callback(key, initialVal);
  268.  
  269.                         function onClick() {
  270.                             const newValue = !GM_getValue(key, defaultValue);
  271.                             const newText = texts[newValue + 0];
  272.                             GM_setValue(key, newValue);
  273.                             id = makeMenu(newText, onClick, id);
  274.                             typeof callback === 'function' && callback(key, newValue);
  275.                         }
  276.  
  277.                         function makeMenu(text, func, id) {
  278.                             if (GM_info.scriptHandler === 'Tampermonkey' && GM_hasVersion('5.0')) {
  279.                                 return GM_registerMenuCommand(text, func, {
  280.                                     id,
  281.                                     autoClose: false,
  282.                                 });
  283.                             } else {
  284.                                 GM_unregisterMenuCommand(id);
  285.                                 return GM_registerMenuCommand(text, func);
  286.                             }
  287.                         }
  288.                     }
  289.  
  290.                     function GM_hasVersion(version) {
  291.                         return hasVersion(GM_info?.version || '0', version);
  292.  
  293.                         function hasVersion(ver1, ver2) {
  294.                             return compareVersions(ver1.toString(), ver2.toString()) >= 0;
  295.  
  296.                             // https://greatest.deepsurf.us/app/javascript/versioncheck.js
  297.                             // https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/version/format
  298.                             function compareVersions(a, b) {
  299.                             if (a == b) {
  300.                                 return 0;
  301.                             }
  302.                             let aParts = a.split('.');
  303.                             let bParts = b.split('.');
  304.                             for (let i = 0; i < aParts.length; i++) {
  305.                                 let result = compareVersionPart(aParts[i], bParts[i]);
  306.                                 if (result != 0) {
  307.                                 return result;
  308.                                 }
  309.                             }
  310.                             // If all of a's parts are the same as b's parts, but b has additional parts, b is greater.
  311.                             if (bParts.length > aParts.length) {
  312.                                 return -1;
  313.                             }
  314.                             return 0;
  315.                             }
  316.  
  317.                             function compareVersionPart(partA, partB) {
  318.                             let partAParts = parseVersionPart(partA);
  319.                             let partBParts = parseVersionPart(partB);
  320.                             for (let i = 0; i < partAParts.length; i++) {
  321.                                 // "A string-part that exists is always less than a string-part that doesn't exist"
  322.                                 if (partAParts[i].length > 0 && partBParts[i].length == 0) {
  323.                                 return -1;
  324.                                 }
  325.                                 if (partAParts[i].length == 0 && partBParts[i].length > 0) {
  326.                                 return 1;
  327.                                 }
  328.                                 if (partAParts[i] > partBParts[i]) {
  329.                                 return 1;
  330.                                 }
  331.                                 if (partAParts[i] < partBParts[i]) {
  332.                                 return -1;
  333.                                 }
  334.                             }
  335.                             return 0;
  336.                             }
  337.  
  338.                             // It goes number, string, number, string. If it doesn't exist, then
  339.                             // 0 for numbers, empty string for strings.
  340.                             function parseVersionPart(part) {
  341.                             if (!part) {
  342.                                 return [0, "", 0, ""];
  343.                             }
  344.                             let partParts = /([0-9]*)([^0-9]*)([0-9]*)([^0-9]*)/.exec(part)
  345.                             return [
  346.                                 partParts[1] ? parseInt(partParts[1]) : 0,
  347.                                 partParts[2],
  348.                                 partParts[3] ? parseInt(partParts[3]) : 0,
  349.                                 partParts[4]
  350.                             ];
  351.                             }
  352.                         }
  353.                     }
  354.                 }
  355.  
  356.                 // Copy text to clipboard (needs to be called in an user event)
  357.                 function copyText(text) {
  358.                     // Create a new textarea for copying
  359.                     const newInput = document.createElement('textarea');
  360.                     document.body.appendChild(newInput);
  361.                     newInput.value = text;
  362.                     newInput.select();
  363.                     document.execCommand('copy');
  364.                     document.body.removeChild(newInput);
  365.                 }
  366.  
  367.                 return {
  368.                     makeBooleanSettings,
  369.                     copyText
  370.                 }
  371.             }
  372.         },
  373.         api: {
  374.             /** @typedef {Awaited<ReturnType<typeof functions.api.func>>} api */
  375.             func() {
  376.                 const API = {
  377.                     async getScriptSets() {
  378.                         const userpage = API.getUserpage();
  379.                         const oDom = await API.getDocument(userpage);
  380.             
  381.                         const list =  Array.from($(oDom, 'ul#user-script-sets').children);
  382.                         const NoSets = list.length === 1 && list.every(li => li.children.length === 1);
  383.                         const script_sets = NoSets ? [] : Array.from($(oDom, 'ul#user-script-sets').children).filter(li => li.children.length === 2).map(li => {
  384.                             try {
  385.                                 return {
  386.                                     name: li.children[0].innerText,
  387.                                     link: li.children[0].href,
  388.                                     linkedit: li.children[1].href,
  389.                                     id: getUrlArgv(li.children[0].href, 'set')
  390.                                 }
  391.                             } catch(err) {
  392.                                 DoLog(LogLevel.Error, [li, err, li.children.length, li.children[0]?.innerHTML, li.children[1]?.innerHTML], 'error');
  393.                                 Err(err);
  394.                             }
  395.                         });
  396.             
  397.                         return script_sets;
  398.                     },
  399.             
  400.                     async getSetScripts(url) {
  401.                         return [...$All(await API.getDocument(url), '#script-set-scripts>input[name="scripts-included[]"]')].map(input => input.value);
  402.                     },
  403.             
  404.                     /**
  405.                      * @typedef {Object} SetsDataAPI
  406.                      * @property {Response} resp - api fetch response object
  407.                      * @property {boolean} ok - resp.ok (resp.status >= 200 && resp.status <= 299)
  408.                      * @property {(Object|null)} data - api response json data, or null if not resp.ok
  409.                      */
  410.                     /**
  411.                      * @returns {SetsDataAPI}
  412.                      */
  413.                     async getSetsData() {
  414.                         const userpage = API.getUserpage();
  415.                         const url = (userpage.endsWith('/') ? userpage : userpage + '/') + 'sets'
  416.             
  417.                         const resp = await fetch(url, { credentials: 'same-origin' });
  418.                         if (resp.ok) {
  419.                             return {
  420.                                 ok: true,
  421.                                 resp,
  422.                                 data: await resp.json()
  423.                             };
  424.                         } else {
  425.                             return {
  426.                                 ok: false,
  427.                                 resp,
  428.                                 data: null
  429.                             };
  430.                         }
  431.                     },
  432.             
  433.                     /**
  434.                      * @returns {(string|null)} the user's profile page url, from page top-right link <a>.href
  435.                      */
  436.                     getUserpage() {
  437.                         const a = $('#nav-user-info>.user-profile-link>a');
  438.                         return a ? a.href : null;
  439.                     },
  440.             
  441.                     /**
  442.                      * @returns {(string|null)} the user's id, in string format
  443.                      */
  444.                     getUserID() {
  445.                         const userpage = API.getUserpage(); //https://greatest.deepsurf.us/zh-CN/users/667968-pyudng
  446.                         return userpage ? userpage.match(/\/users\/(\d+)(-[^\/]*\/*)?/)[1] : null;
  447.                     },
  448.             
  449.                     // editCallback recieves:
  450.                     //     true: edit doc load success
  451.                     //     false: already in set
  452.                     // finishCallback recieves:
  453.                     //     text: successfully added to set with text tip `text`
  454.                     //     true: successfully loaded document but no text tip found
  455.                     //     false: xhr error
  456.                     addFav(url, sid, editCallback, finishCallback) {
  457.                         API.modifyFav(url, oDom => {
  458.                             const existingInput = [...$All(oDom, '#script-set-scripts>input[name="scripts-included[]"][type="hidden"]')].find(input => input.value === sid);
  459.                             if (existingInput) {
  460.                                 editCallback(false);
  461.                                 return false;
  462.                             }
  463.             
  464.                             const input = $CrE('input');
  465.                             input.value = sid;
  466.                             input.name = 'scripts-included[]';
  467.                             input.type = 'hidden';
  468.                             $(oDom, '#script-set-scripts').appendChild(input);
  469.                             editCallback(true);
  470.                         }, oDom => {
  471.                             const status = $(oDom, 'p.notice');
  472.                             const status_text = status ? status.innerText : true;
  473.                             finishCallback(status_text);
  474.                         }, err => finishCallback(false));
  475.                     },
  476.             
  477.                     // editCallback recieves:
  478.                     //     true: edit doc load success
  479.                     //     false: already not in set
  480.                     // finishCallback recieves:
  481.                     //     text: successfully removed from set with text tip `text`
  482.                     //     true: successfully loaded document but no text tip found
  483.                     //     false: xhr error
  484.                     removeFav(url, sid, editCallback, finishCallback) {
  485.                         API.modifyFav(url, oDom => {
  486.                             const existingInput = [...$All(oDom, '#script-set-scripts>input[name="scripts-included[]"][type="hidden"]')].find(input => input.value === sid);
  487.                             if (!existingInput) {
  488.                                 editCallback(false);
  489.                                 return false;
  490.                             }
  491.             
  492.                             existingInput.remove();
  493.                             editCallback(true);
  494.                         }, oDom => {
  495.                             const status = $(oDom, 'p.notice');
  496.                             const status_text = status ? status.innerText : true;
  497.                             finishCallback(status_text);
  498.                         }, err => finishCallback(false));
  499.                     },
  500.             
  501.                     async modifyFav(url, editCallback, finishCallback, onerror) {
  502.                         const oDom = await API.getDocument(url);
  503.                         if (editCallback(oDom) === false) { return false; }
  504.             
  505.                         const form = $(oDom, '.change-script-set');
  506.                         const data = new FormData(form);
  507.                         data.append('save', '1');
  508.             
  509.                         // Use XMLHttpRequest insteadof GM_xmlhttpRequest because there's unknown issue with GM_xmlhttpRequest
  510.                         const xhr = new XMLHttpRequest();
  511.                         xhr.open('POST', API.toAbsoluteURL(form.getAttribute('action')));
  512.                         xhr.responseType = 'blob';
  513.                         xhr.onload = async e => finishCallback(await API.parseDocument(xhr.response));
  514.                         xhr.onerror = onerror;
  515.                         xhr.send(data);
  516.                     },
  517.             
  518.                     // Download and parse a url page into a html document(dom).
  519.                     // Returns a promise fulfills with dom
  520.                     async getDocument(url, retry=5) {
  521.                         try {
  522.                             const response = await fetch(url, {
  523.                                 method: 'GET',
  524.                                 cache: 'reload',
  525.                             });
  526.                             if (response.status === 200) {
  527.                                 const blob = await response.blob();
  528.                                 const oDom = await API.parseDocument(blob);
  529.                                 return oDom;
  530.                             } else {
  531.                                 throw new Error(`response.status is not 200 (${response.status})`);
  532.                             }
  533.                         } catch(err) {
  534.                             if (--retry > 0) {
  535.                                 return API.getDocument(url, retry);
  536.                             } else {
  537.                                 throw err;
  538.                             }
  539.                         }
  540.                     },
  541.             
  542.                     // Returns a promise fulfills with dom
  543.                     parseDocument(htmlblob) {
  544.                         return new Promise((resolve, reject) => {
  545.                             const reader = new FileReader();
  546.                             reader.onload = function(e) {
  547.                                 const htmlText = reader.result;
  548.                                 const dom = new DOMParser().parseFromString(htmlText, 'text/html');
  549.                                 resolve(dom);
  550.                             }
  551.                             reader.onerror = err => reject(err);
  552.                             reader.readAsText(htmlblob, document.characterSet);
  553.                         });
  554.                     },
  555.             
  556.                     toAbsoluteURL(relativeURL, base=`${location.protocol}//${location.host}/`) {
  557.                         return new URL(relativeURL, base).href;
  558.                     },
  559.             
  560.                     GM_hasVersion(version) {
  561.                         return hasVersion(GM_info?.version || '0', version);
  562.             
  563.                         function hasVersion(ver1, ver2) {
  564.                             return compareVersions(ver1.toString(), ver2.toString()) >= 0;
  565.             
  566.                             // https://greatest.deepsurf.us/app/javascript/versioncheck.js
  567.                             // https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/version/format
  568.                             function compareVersions(a, b) {
  569.                             if (a == b) {
  570.                                 return 0;
  571.                             }
  572.                             let aParts = a.split('.');
  573.                             let bParts = b.split('.');
  574.                             for (let i = 0; i < aParts.length; i++) {
  575.                                 let result = compareVersionPart(aParts[i], bParts[i]);
  576.                                 if (result != 0) {
  577.                                 return result;
  578.                                 }
  579.                             }
  580.                             // If all of a's parts are the same as b's parts, but b has additional parts, b is greater.
  581.                             if (bParts.length > aParts.length) {
  582.                                 return -1;
  583.                             }
  584.                             return 0;
  585.                             }
  586.             
  587.                             function compareVersionPart(partA, partB) {
  588.                             let partAParts = parseVersionPart(partA);
  589.                             let partBParts = parseVersionPart(partB);
  590.                             for (let i = 0; i < partAParts.length; i++) {
  591.                                 // "A string-part that exists is always less than a string-part that doesn't exist"
  592.                                 if (partAParts[i].length > 0 && partBParts[i].length == 0) {
  593.                                 return -1;
  594.                                 }
  595.                                 if (partAParts[i].length == 0 && partBParts[i].length > 0) {
  596.                                 return 1;
  597.                                 }
  598.                                 if (partAParts[i] > partBParts[i]) {
  599.                                 return 1;
  600.                                 }
  601.                                 if (partAParts[i] < partBParts[i]) {
  602.                                 return -1;
  603.                                 }
  604.                             }
  605.                             return 0;
  606.                             }
  607.             
  608.                             // It goes number, string, number, string. If it doesn't exist, then
  609.                             // 0 for numbers, empty string for strings.
  610.                             function parseVersionPart(part) {
  611.                             if (!part) {
  612.                                 return [0, "", 0, ""];
  613.                             }
  614.                             let partParts = /([0-9]*)([^0-9]*)([0-9]*)([^0-9]*)/.exec(part)
  615.                             return [
  616.                                 partParts[1] ? parseInt(partParts[1]) : 0,
  617.                                 partParts[2],
  618.                                 partParts[3] ? parseInt(partParts[3]) : 0,
  619.                                 partParts[4]
  620.                             ];
  621.                             }
  622.                         }
  623.                     }
  624.                 };
  625.             
  626.                 return API;
  627.             }
  628.         },
  629.         'Favorite panel': {
  630.             checkers: {
  631.                 type: 'func',
  632.                 value: () => {
  633.                     const path = location.pathname.split('/').filter(p=>p).map(p => p.toLowerCase());
  634.                     const index = path.indexOf('scripts');
  635.                     const scripts_exist = [0,1].includes(index);
  636.                     const is_scripts_list = path.length-1 === index;
  637.                     const is_set_page = /[\?&]set=\d+/.test(location.search);
  638.                     const correct_page = [undefined, 'code', 'feedback'].includes(path[index+2]);
  639.                     return scripts_exist && !is_scripts_list && !is_set_page && correct_page;
  640.                 }
  641.             },
  642.             dependencies: ['utils', 'api'],
  643.             func() {
  644.                 /** @type {utils} */
  645.                 const utils = require('utils');
  646.                 /** @type {api} */
  647.                 const GFScriptSetAPI = require('api');
  648.                 //if (!GFScriptSetAPI.getUserpage()) {return false;}
  649.  
  650.                 class FavoritePanel {
  651.                     #CM;
  652.                     #sid;
  653.                     #sets;
  654.                     #elements;
  655.                     #disabled;
  656.  
  657.                     constructor(CM) {
  658.                         this.#CM = CM;
  659.                         this.#sid = location.pathname.match(/scripts\/(\d+)/)[1];
  660.                         this.#sets = this.#CM.getConfig('script-sets').sets;
  661.                         this.#elements = {};
  662.                         this.disabled = false;
  663.  
  664.                         // Sort sets by name in alphabetical order
  665.                         FavoritePanel.#sortSetsdata(this.#sets);
  666.  
  667.                         const script_after = $('#script-feedback-suggestion+*') || $('#new-script-discussion');
  668.                         const script_parent = script_after.parentElement;
  669.  
  670.                         // Container
  671.                         const script_favorite = this.#elements.container = $$CrE({
  672.                             tagName: 'div',
  673.                             props: {
  674.                                 id: 'script-favorite',
  675.                                 innerHTML: CONST.Text.FavEdit
  676.                             },
  677.                             styles: { margin: '0.75em 0' }
  678.                         });
  679.  
  680.                         // Selecter
  681.                         const favorite_groups = this.#elements.select = $$CrE({
  682.                             tagName: 'select',
  683.                             props: { id: 'favorite-groups' },
  684.                             styles: { maxWidth: '40vw' },
  685.                             listeners: [['change', (() => {
  686.                                 let lastSelected = 0;
  687.                                 const record = () => lastSelected = favorite_groups.selectedIndex;
  688.                                 const recover = () => favorite_groups.selectedIndex = lastSelected;
  689.  
  690.                                 return e => {
  691.                                     const value = favorite_groups.value;
  692.                                     const type = /^\d+$/.test(value) ? 'set-id' : 'command';
  693.  
  694.                                     switch (type) {
  695.                                         case 'set-id': {
  696.                                             const set = this.#sets.find(set => set.id === favorite_groups.value);
  697.                                             favorite_edit.href = set.linkedit;
  698.                                             break;
  699.                                         }
  700.                                         case 'command': {
  701.                                             recover();
  702.                                             this.#execCommand(value);
  703.                                         }
  704.                                     }
  705.  
  706.                                     this.#refreshButtonDisplay();
  707.                                     record();
  708.                                 }
  709.                             }) ()]]
  710.                         });
  711.                         favorite_groups.id = 'favorite-groups';
  712.  
  713.                         // Buttons
  714.                         const makeBtn = (id, innerHTML, onClick, isLink=false) => $$CrE({
  715.                             tagName: 'a',
  716.                             props: {
  717.                                 id, innerHTML,
  718.                                 [isLink ? 'target' : 'href']: isLink ? '_blank' : 'javascript:void(0);'
  719.                             },
  720.                             styles: { margin: '0px 0.5em' },
  721.                             listeners: [['click', onClick]]
  722.                         });
  723.  
  724.                         const favorite_add = this.#elements.btnAdd = makeBtn('favorite-add', CONST.Text.Add, e => this.#addFav());
  725.                         const favorite_remove = this.#elements.btnRemove = makeBtn('favorite-remove', CONST.Text.Remove, e => this.#removeFav());
  726.                         const favorite_edit = this.#elements.btnEdit = makeBtn('favorite-edit', CONST.Text.Edit, e => {}, true);
  727.                         const favorite_iframe = this.#elements.btnIframe = makeBtn('favorite-edit-in-page', CONST.Text.EditIframe, e => this.#editInPage(e));
  728.                         const favorite_copy = this.#elements.btnCopy = makeBtn('favorite-add', CONST.Text.CopySID, e => utils.copyText(this.#sid));
  729.                         const favorite_sync = this.#elements.btnSync = makeBtn('favorite-sync', CONST.Text.Sync, e => this.#refresh());
  730.  
  731.                         script_favorite.appendChild(favorite_groups);
  732.                         script_after.before(script_favorite);
  733.                         [favorite_add, favorite_remove, favorite_edit, favorite_iframe, favorite_copy, favorite_sync].forEach(button => script_favorite.appendChild(button));
  734.  
  735.                         // Text tip
  736.                         const tip = this.#elements.tip = $CrE('span');
  737.                         script_favorite.appendChild(tip);
  738.  
  739.                         // Display cached sets first
  740.                         this.#displaySets();
  741.  
  742.                         // Request GF document to update sets
  743.                         this.#autoRefresh();
  744.                     }
  745.  
  746.                     get sid() {
  747.                         return this.#sid;
  748.                     }
  749.  
  750.                     get sets() {
  751.                         return FavoritePanel.#deepClone(this.#sets);
  752.                     }
  753.  
  754.                     get elements() {
  755.                         return FavoritePanel.#lightClone(this.#elements);
  756.                     }
  757.  
  758.                     #refresh() {
  759.                         const that = this;
  760.                         const method = CONFIG.useAPI ? 'api' : 'doc';
  761.                         return {
  762.                             api: () => this.#refresh_api(),
  763.                             doc: () => this.#refresh_doc()
  764.                         }[method]();
  765.                     }
  766.  
  767.                     async #refresh_api() {
  768.                         const CONFIG = this.#CM.Config;
  769.  
  770.                         this.#disable();
  771.                         this.#tip(CONST.Text.Refreshing.Data);
  772.  
  773.                         // Check login status
  774.                         if (!GFScriptSetAPI.getUserpage()) {
  775.                             this.#tip(CONST.Text.NotLoggedIn);
  776.                             return;
  777.                         }
  778.  
  779.                         // Request sets data api
  780.                         const api_result = await GFScriptSetAPI.getSetsData();
  781.                         const sets_data = api_result.data;
  782.                         const uid = GFScriptSetAPI.getUserID();
  783.  
  784.                         if (!api_result.ok) {
  785.                             // When api fails, use doc as fallback
  786.                             DoLog(LogLevel.Error, 'Sets API failed.');
  787.                             DoLog(LogLevel.Error, api_result);
  788.                             return this.#refresh_doc();
  789.                         }
  790.  
  791.                         // For forward compatibility, convert all setids and scriptids to string
  792.                         // and fill property set.link and set.linkedit
  793.                         for (const set of sets_data) {
  794.                             // convert set id to string
  795.                             set.id = set.id.toString();
  796.                             // https://greatest.deepsurf.us/zh-CN/scripts?set=439237
  797.                             set.link = replaceText(CONST.URL.SetLink, { $ID: set.id });
  798.                             // https://greatest.deepsurf.us/zh-CN/users/667968-pyudng/sets/439237/edit
  799.                             set.linkedit = replaceText(CONST.URL.SetEdit, { $UID: uid, $ID: set.id });
  800.  
  801.                             // there's two kind of sets: Favorite and non-favorite
  802.                             // favorite set's data is an array of object, where each object represents a script, with script's properties
  803.                             // non-favorite set's data is an array of ints, where each int means a script's id
  804.                             // For forward compatibility, we only store script ids, in string format
  805.                             set.scripts.forEach((script, i, scripts) => {
  806.                                 if (typeof script === 'number') {
  807.                                     scripts[i] = script.toString();
  808.                                 } else {
  809.                                     scripts[i] = script.id.toString();
  810.                                 }
  811.                             });
  812.                         }
  813.  
  814.                         // Sort sets by name in alphabetical order
  815.                         FavoritePanel.#sortSetsdata(sets_data);
  816.  
  817.                         this.#sets = CONFIG['script-sets'].sets = sets_data;
  818.                         CONFIG['script-sets'].time = Date.now();
  819.  
  820.                         this.#tip();
  821.                         this.#enable();
  822.                         this.#displaySets();
  823.                         this.#refreshButtonDisplay();
  824.                     }
  825.  
  826.                     // Request document: get sets list and
  827.                     async #refresh_doc() {
  828.                         const CONFIG = this.#CM.Config;
  829.  
  830.                         this.#disable();
  831.                         this.#tip(CONST.Text.Refreshing.List);
  832.  
  833.                         // Check login status
  834.                         if (!GFScriptSetAPI.getUserpage()) {
  835.                             this.#tip(CONST.Text.NotLoggedIn);
  836.                             return;
  837.                         }
  838.  
  839.                         // Refresh sets list
  840.                         this.#sets = CONFIG['script-sets'].sets = await GFScriptSetAPI.getScriptSets();
  841.                         CONFIG['script-sets'].time = Date.now();
  842.                         this.#displaySets();
  843.  
  844.                         // Refresh each set's script list
  845.                         this.#tip(CONST.Text.Refreshing.Script);
  846.                         await Promise.all(this.#sets.map(async set => {
  847.                             // Fetch scripts
  848.                             set.scripts = await GFScriptSetAPI.getSetScripts(set.linkedit);
  849.                             this.#displaySets();
  850.  
  851.                             // Save to GM_storage
  852.                             const setIndex = CONFIG['script-sets'].sets.findIndex(s => s.id === set.id);
  853.                             CONFIG['script-sets'].sets[setIndex].scripts = set.scripts;
  854.                             CONFIG['script-sets'].time = Date.now();
  855.                         }));
  856.  
  857.                         this.#tip();
  858.                         this.#enable();
  859.                         this.#refreshButtonDisplay();
  860.                     }
  861.  
  862.                     // Refresh on instance creation.
  863.                     // This should be running in low-frequecy. Refreshing makes lots of requests which may resul in a 503 error(rate limit) for the user.
  864.                     #autoRefresh(minTime=1*24*60*60*1000) {
  865.                         const CONFIG = this.#CM.Config;
  866.                         const lastRefresh = new Date(CONFIG['script-sets'].time);
  867.                         if (Date.now() - lastRefresh > minTime) {
  868.                             this.#refresh();
  869.                             return true;
  870.                         } else {
  871.                             return false;
  872.                         }
  873.                     }
  874.  
  875.                     #addFav() {
  876.                         const set = this.#getCurrentSet();
  877.                         const option = set.elmOption;
  878.  
  879.                         this.#displayNotice(CONST.Text.Working[0]);
  880.                         GFScriptSetAPI.addFav(this.#getCurrentSet().linkedit, this.#sid, editStatus => {
  881.                             if (!editStatus) {
  882.                                 this.#displayNotice(CONST.Text.Error.AlreadyExist);
  883.                                 option.innerText = `${CONST.Text.InSetStatus[1]} ${set.name}`;
  884.                             } else {
  885.                                 this.#displayNotice(CONST.Text.Working[1]);
  886.                             }
  887.                         }, finishStatus => {
  888.                             if (finishStatus) {
  889.                                 // Save to this.#sets and GM_storage
  890.                                 if (CONFIG['script-sets'].sets.some(set => !set.scripts)) {
  891.                                     // If scripts property is missing, do sync(refresh)
  892.                                     this.#refresh();
  893.                                 } else {
  894.                                     const setIndex = CONFIG['script-sets'].sets.findIndex(s => s.id === set.id);
  895.                                     CONFIG['script-sets'].sets[setIndex].scripts.push(this.#sid);
  896.                                     this.#sets = CM.getConfig('script-sets').sets;
  897.                                 }
  898.  
  899.                                 // Display
  900.                                 this.#displayNotice(typeof finishStatus === 'string' ? finishStatus : CONST.Text.Error.Unknown);
  901.                                 set.elmOption.innerText = `${CONST.Text.InSetStatus[1]} ${set.name}`;
  902.                                 this.#displaySets();
  903.                             } else {
  904.                                 this.#displayNotice(CONST.Text.Error.NetworkError);
  905.                             }
  906.                         });
  907.                     }
  908.  
  909.                     #removeFav() {
  910.                         const set = this.#getCurrentSet();
  911.                         const option = set.elmOption;
  912.  
  913.                         this.#displayNotice(CONST.Text.Working[0]);
  914.                         GFScriptSetAPI.removeFav(this.#getCurrentSet().linkedit, this.#sid, editStatus => {
  915.                             if (!editStatus) {
  916.                                 this.#displayNotice(CONST.Text.Error.NotExist);
  917.                                 option.innerText = `${CONST.Text.InSetStatus[0]} ${set.name}`;
  918.                             } else {
  919.                                 this.#displayNotice(CONST.Text.Working[1]);
  920.                             }
  921.                         }, finishStatus => {
  922.                             if (finishStatus) {
  923.                                 // Save to this.#sets and GM_storage
  924.                                 if (CONFIG['script-sets'].sets.some(set => !set.scripts)) {
  925.                                     // If scripts property is missing, do sync(refresh)
  926.                                     this.#refresh();
  927.                                 } else {
  928.                                     const setIndex = CONFIG['script-sets'].sets.findIndex(s => s.id === set.id);
  929.                                     const scriptIndex = CONFIG['script-sets'].sets[setIndex].scripts.indexOf(this.#sid);
  930.                                     CONFIG['script-sets'].sets[setIndex].scripts.splice(scriptIndex, 1);
  931.                                     this.#sets = CM.getConfig('script-sets').sets;
  932.                                 }
  933.  
  934.                                 // Display
  935.                                 this.#displayNotice(typeof finishStatus === 'string' ? finishStatus : CONST.Text.Error.Unknown);
  936.                                 set.elmOption.innerText = `${CONST.Text.InSetStatus[0]} ${set.name}`;
  937.                                 this.#displaySets();
  938.                             } else {
  939.                                 this.#displayNotice(CONST.Text.Error.NetworkError);
  940.                             }
  941.                         });
  942.                     }
  943.  
  944.                     #editInPage(e) {
  945.                         e.preventDefault();
  946.  
  947.                         const _iframes = [...$All(this.#elements.container, '.script-edit-page')];
  948.                         if (_iframes.length) {
  949.                             // Iframe exists, close iframe
  950.                             this.#elements.btnIframe.innerText = CONST.Text.EditIframe;
  951.                             _iframes.forEach(ifr => ifr.remove());
  952.                             this.#refresh();
  953.                         } else {
  954.                             // Iframe not exist, make iframe
  955.                             this.#elements.btnIframe.innerText = CONST.Text.CloseIframe;
  956.  
  957.                             const iframe = $$CrE({
  958.                                 tagName: 'iframe',
  959.                                 props: {
  960.                                     src: this.#getCurrentSet().linkedit
  961.                                 },
  962.                                 styles: {
  963.                                     width: '100%',
  964.                                     height: '60vh'
  965.                                 },
  966.                                 classes: ['script-edit-page'],
  967.                                 listeners: [['load', e => {
  968.                                     //this.#refresh();
  969.                                     //iframe.style.height = iframe.contentDocument.body.parentElement.offsetHeight + 'px';
  970.                                 }]]
  971.                             });
  972.                             this.#elements.container.appendChild(iframe);
  973.                         }
  974.                     }
  975.  
  976.                     #displayNotice(text) {
  977.                         const notice = $CrE('p');
  978.                         notice.classList.add('notice');
  979.                         notice.id = 'fav-notice';
  980.                         notice.innerText = text;
  981.                         const old_notice = $('#fav-notice');
  982.                         old_notice && old_notice.parentElement.removeChild(old_notice);
  983.                         $('#script-content').insertAdjacentElement('afterbegin', notice);
  984.                     }
  985.  
  986.                     #tip(text='', timeout=0) {
  987.                         this.#elements.tip.innerText = text;
  988.                         timeout > 0 && setTimeout(() => this.#elements.tip.innerText = '', timeout);
  989.                     }
  990.  
  991.                     // Apply this.#sets to gui
  992.                     #displaySets() {
  993.                         const elements = this.#elements;
  994.  
  995.                         // Save selected set
  996.                         const old_value = elements.select.value;
  997.                         [...elements.select.children].forEach(child => child.remove());
  998.  
  999.                         // Make <optgroup>s and <option>s
  1000.                         const serverGroup = elements.serverGroup = $$CrE({ tagName: 'optgroup', attrs: { label: CONST.Text.Groups.Server } });
  1001.                         this.#sets.forEach(set => {
  1002.                             // Create <option>
  1003.                             set.elmOption = $$CrE({
  1004.                                 tagName: 'option',
  1005.                                 props: {
  1006.                                     innerText: set.name,
  1007.                                     value: set.id
  1008.                                 }
  1009.                             });
  1010.                             // Display inset status
  1011.                             if (set.scripts) {
  1012.                                 const inSet = set.scripts.includes(this.#sid);
  1013.                                 set.elmOption.innerText = `${CONST.Text.InSetStatus[inSet+0]} ${set.name}`;
  1014.                             }
  1015.                             // Append <option> into <select>
  1016.                             serverGroup.appendChild(set.elmOption);
  1017.                         });
  1018.                         if (this.#sets.length === 0) {
  1019.                             const optEmpty = elements.optEmpty = $$CrE({
  1020.                                 tagName: 'option',
  1021.                                 props: {
  1022.                                     innerText: CONST.Text.NoSetsYet,
  1023.                                     value: 'empty',
  1024.                                     selected: true
  1025.                                 }
  1026.                             });
  1027.                             serverGroup.appendChild(optEmpty);
  1028.                         }
  1029.  
  1030.                         const newGroup = elements.newGroup = $$CrE({ tagName: 'optgroup', attrs: { label: CONST.Text.Groups.New } });
  1031.                         const newSet = elements.newSet = $$CrE({
  1032.                             tagName: 'option',
  1033.                             props: {
  1034.                                 innerText: CONST.Text.NewSet,
  1035.                                 value: 'new',
  1036.                             }
  1037.                         });
  1038.                         newGroup.appendChild(newSet);
  1039.                         [serverGroup, newGroup].forEach(optgroup => elements.select.appendChild(optgroup));
  1040.  
  1041.                         // Adjust <select> width
  1042.                         elements.select.style.width = Math.max.apply(null, Array.from($All(elements.select, 'option')).map(o => o.innerText.length)).toString() + 'em';
  1043.  
  1044.                         // Select previous selected set's <option>
  1045.                         const selected = old_value ? [...$All(elements.select, 'option')].find(option => option.value === old_value) : null;
  1046.                         selected && (selected.selected = true);
  1047.  
  1048.                         // Set edit-button.href
  1049.                         if (elements.select.value !== 'empty') {
  1050.                             const curset = this.#sets.find(set => set.id === elements.select.value);
  1051.                             elements.btnEdit.href = curset.linkedit;
  1052.                         }
  1053.  
  1054.                         // Display correct button
  1055.                         this.#refreshButtonDisplay();
  1056.                     }
  1057.  
  1058.                     // Display only add button when script in current set, otherwise remove button
  1059.                     // Disable set-related buttons when not selecting options that not represents a set
  1060.                     #refreshButtonDisplay() {
  1061.                         const set = this.#getCurrentSet();
  1062.                         !this.#disabled && ([this.#elements.btnAdd, this.#elements.btnRemove, this.#elements.btnEdit, this.#elements.btnIframe]
  1063.                                 .forEach(element => set ? FavoritePanel.#enableElement(element) : FavoritePanel.#disableElement(element)));
  1064.                         if (!set || !set.scripts) { return null; }
  1065.                         if (set.scripts.includes(this.#sid)) {
  1066.                             this.#elements.btnAdd.style.setProperty('display', 'none');
  1067.                             this.#elements.btnRemove.style.removeProperty('display');
  1068.                             return true;
  1069.                         } else {
  1070.                             this.#elements.btnRemove.style.setProperty('display', 'none');
  1071.                             this.#elements.btnAdd.style.removeProperty('display');
  1072.                             return false;
  1073.                         }
  1074.                     }
  1075.  
  1076.                     #execCommand(command) {
  1077.                         switch (command) {
  1078.                             case 'new': {
  1079.                                 const url = GFScriptSetAPI.getUserpage() + (this.#getCurrentSet() ? '/sets/new' : '/sets/new?fav=1');
  1080.                                 window.open(url);
  1081.                                 break;
  1082.                             }
  1083.                             case 'empty': {
  1084.                                 // Do nothing
  1085.                                 break;
  1086.                             }
  1087.                         }
  1088.                     }
  1089.  
  1090.                     // Returns null if no <option>s yet
  1091.                     #getCurrentSet() {
  1092.                         return this.#sets.find(set => set.id === this.#elements.select.value) || null;
  1093.                     }
  1094.  
  1095.                     #disable() {
  1096.                         [
  1097.                             this.#elements.select,
  1098.                             this.#elements.btnAdd, this.#elements.btnRemove,
  1099.                             this.#elements.btnEdit, this.#elements.btnIframe,
  1100.                             this.#elements.btnCopy, this.#elements.btnSync
  1101.                         ].forEach(element => FavoritePanel.#disableElement(element));
  1102.                         this.#disabled = true;
  1103.                     }
  1104.  
  1105.                     #enable() {
  1106.                         [
  1107.                             this.#elements.select,
  1108.                             this.#elements.btnAdd, this.#elements.btnRemove,
  1109.                             this.#elements.btnEdit, this.#elements.btnIframe,
  1110.                             this.#elements.btnCopy, this.#elements.btnSync
  1111.                         ].forEach(element => FavoritePanel.#enableElement(element));
  1112.                         this.#disabled = false;
  1113.                     }
  1114.  
  1115.                     static #disableElement(element) {
  1116.                         element.style.filter = 'grayscale(1) brightness(0.95)';
  1117.                         element.style.opacity = '0.25';
  1118.                         element.style.pointerEvents = 'none';
  1119.                         element.tabIndex = -1;
  1120.                     }
  1121.  
  1122.                     static #enableElement(element) {
  1123.                         element.style.removeProperty('filter');
  1124.                         element.style.removeProperty('opacity');
  1125.                         element.style.removeProperty('pointer-events');
  1126.                         element.tabIndex = 0;
  1127.                     }
  1128.  
  1129.                     static #deepClone(val) {
  1130.                         if (typeof structuredClone === 'function') {
  1131.                             return structuredClone(val);
  1132.                         } else {
  1133.                             return JSON.parse(JSON.stringify(val));
  1134.                         }
  1135.                     }
  1136.  
  1137.                     static #lightClone(val) {
  1138.                         if (['string', 'number', 'boolean', 'undefined', 'bigint', 'symbol', 'function'].includes(val) || val === null) {
  1139.                             return val;
  1140.                         }
  1141.                         if (Array.isArray(val)) {
  1142.                             return val.slice();
  1143.                         }
  1144.                         if (typeof val === 'object') {
  1145.                             return Object.fromEntries(Object.entries(val));
  1146.                         }
  1147.                     }
  1148.  
  1149.                     static #sortSetsdata(sets_data) {
  1150.                         // Sort sets by name in alphabetical order
  1151.                         const sorted_names = sets_data.map(set => set.name).sort();
  1152.                         if (sorted_names.includes('Favorite')) {
  1153.                             // Keep set `Favorite` at first place
  1154.                             sorted_names.splice(0, 0, sorted_names.splice(sorted_names.indexOf('Favorite'), 1)[0]);
  1155.                         }
  1156.                         sets_data.sort((setA, setB) => sorted_names.indexOf(setA.name) - sorted_names.indexOf(setB.name));
  1157.                     }
  1158.                 }
  1159.  
  1160.                 const panel = new FavoritePanel(CM);
  1161.             }
  1162.         },
  1163.         'api-doc switch': {
  1164.             checkers: {
  1165.                 type: 'switch',
  1166.                 value: true
  1167.             },
  1168.             dependencies: 'utils',
  1169.             func: e => {
  1170.                 /** @type {utils} */
  1171.                 const utils = require('utils');
  1172.                 utils.makeBooleanSettings([{
  1173.                     text: CONST.Text.UseAPI,
  1174.                     key: 'useAPI',
  1175.                     defaultValue: true
  1176.                 }]);
  1177.             }
  1178.         },
  1179.         'Set scripts sort': {
  1180.             checkers: {
  1181.                 type: 'func',
  1182.                 value: () => {
  1183.                     const scripts_exist = [1, 2].map(index => location.pathname.split('/')[index]?.toLowerCase()).includes('scripts');
  1184.                     const is_set_page = /[\?&]set=\d+/.test(location.search);
  1185.                     return scripts_exist && is_set_page;
  1186.                 }
  1187.             },
  1188.             detectDom: '#script-list-sort>ul',
  1189.             func: e => {
  1190.                 const search = new URLSearchParams(location.search);
  1191.                 const set_id = search.get('set');
  1192.                 const sort = search.get('sort');
  1193.                 if (!CONFIG['script-sets'].sets.some(set => set.id === set_id)) { return false; }
  1194.  
  1195.                 const ul = $('#script-list-sort>ul');
  1196.                 [false, true].forEach(reverse => {
  1197.                     const li = $$CrE({
  1198.                         tagName: 'li',
  1199.                         classes: ['list-option', 'gse-sort'], // gse: (G)resyfork(S)et(E)dit+
  1200.                         attrs: { reverse: reverse ? '1' : '0' },
  1201.                     });
  1202.                     const a = $$CrE({
  1203.                         tagName: 'a',
  1204.                         props: { innerText: CONST.Text.sortByApiDefault[+reverse] },
  1205.                         attrs: { rel: 'nofollow', href: getSortUrl(reverse) }
  1206.                     });
  1207.                     li.appendChild(a);
  1208.                     ul.appendChild(li);
  1209.                 });
  1210.                 $AEL(ul, 'click', e => {
  1211.                     if (e.target.matches('.gse-sort>a')) {
  1212.                         e.preventDefault();
  1213.                         const a = e.target;
  1214.                         const li = a.parentElement;
  1215.                         const reverse = !!+li.getAttribute('reverse');
  1216.                         sortByApiDefault(reverse);
  1217.                         buttonClicked(a);
  1218.                         setSortUrl(reverse);
  1219.                     }
  1220.                 }, { capture: true });
  1221.  
  1222.                 switch (sort) {
  1223.                     case 'gse_default':
  1224.                         sortByApiDefault(false);
  1225.                         buttonClicked($('.gse-sort[reverse="0"]>a'));
  1226.                         break;
  1227.                     case 'gse_reverse':
  1228.                         sortByApiDefault(true);
  1229.                         buttonClicked($('.gse-sort[reverse="1"]>a'));
  1230.                         break;
  1231.                 }
  1232.  
  1233.                 /**
  1234.                  * Sort <li>s in #browse-script-list by default api order
  1235.                  * Default api order is by add-to-set time right now (2024-07-21),
  1236.                  * but this is not a promising feature
  1237.                  */
  1238.                 function sortByApiDefault(reverse=false) {
  1239.                     const ol = $('#browse-script-list');
  1240.                     const li_scripts = Array.from(ol.children);
  1241.                     const set = CM.getConfig('script-sets').sets.find(set => set.id === set_id);
  1242.                     const scripts = set.scripts;
  1243.                     li_scripts.sort((li1, li2) => {
  1244.                         const [sid1, sid2] = [li1, li2].map(li => li.getAttribute('data-script-id'));
  1245.                         const [index1, index2] = [sid1, sid2].map(sid => scripts.indexOf(sid)).map(index => index >= 0 ? index : Infinity);
  1246.  
  1247.                         return (reverse ? [1, -1] : [-1, 1])[index1 > index2 ? 1 : 0];
  1248.                     });
  1249.                     //li_scripts.forEach(li => ol.removeChild(li));
  1250.                     li_scripts.forEach(li => ol.appendChild(li));
  1251.                 }
  1252.  
  1253.                 /**
  1254.                  * Change the clicked button gui to given one
  1255.                  */
  1256.                 function buttonClicked(a) {
  1257.                     const li = a.parentElement;
  1258.                     const ul = li.parentElement;
  1259.                     const old_li_current = Array.from(ul.children).find(li => li.classList.contains('list-current'));
  1260.  
  1261.                     li.classList.add('list-current');
  1262.                     a.remove();
  1263.                     li.innerText = a.innerText;
  1264.  
  1265.                     old_li_current.classList.remove('list-current');
  1266.                     const old_li_a = $$CrE({
  1267.                         tagName: 'a',
  1268.                         attrs: { href: location.pathname + location.search + location.hash },
  1269.                         props: { innerText: old_li_current.innerText }
  1270.                     });
  1271.                     old_li_current.innerText = '';
  1272.                     old_li_current.appendChild(old_li_a);
  1273.                 }
  1274.  
  1275.                 /**
  1276.                  * Set url search params when sorting
  1277.                  */
  1278.                 function setSortUrl(reverse) {
  1279.                     history.replaceState({}, '', getSortUrl(reverse));
  1280.                 }
  1281.  
  1282.                 /**
  1283.                  * Make corrent url search params with sorting
  1284.                  */
  1285.                 function getSortUrl(reverse) {
  1286.                     const search = new URLSearchParams(location.search);
  1287.                     search.set('sort', reverse ? 'gse_reverse' : 'gse_default');
  1288.                     const url = location.pathname + '?' + search.toString();
  1289.                     return url;
  1290.                 }
  1291.             }
  1292.         }
  1293.     };
  1294.  
  1295.     const oFuncs = Object.entries(functions).reduce((arr, [id, oFunc]) => {
  1296.         oFunc.id = id;
  1297.         arr.push(oFunc);
  1298.         return arr;
  1299.     }, []);
  1300.     loadFuncs(oFuncs);
  1301. })();