☰

BiliBili动态隐藏

根据Up主名称，在动态页进行筛选，隐藏屏蔽的Up主动态。

目前為 2023-07-23 提交的版本，檢視 最新版本。

  1. // ==UserScript==
  2. // @name		BiliBili动态隐藏
  3. // @author		Yiero
  4. // @description		根据Up主名称，在动态页进行筛选，隐藏屏蔽的Up主动态。
  5. // @version		1.4.1
  6. // @namespace		https://github.com/AliubYiero/TamperMonkeyScripts
  7. // @match		https://t.bilibili.com/*
  8. // @icon		https://t.bilibili.com/favicon.ico
  9. // @resource		layuiCss https://cdn.staticfile.org/layui/2.8.11/css/layui.min.css
  10. // @license		GPL
  11. // @grant		GM_registerMenuCommand
  12. // @grant		GM_unregisterMenuCommand
  13. // @grant		GM_addStyle
  14. // @grant		GM_getResourceText
  15. // @run-at		document-start
  16. // @updateUrl		https://raw.githubusercontent.com/AliubYiero/TamperMonkeyScripts/master/dist/HideDynamic.js
  17. // @downloadUrl		https://raw.githubusercontent.com/AliubYiero/TamperMonkeyScripts/master/dist/HideDynamic.js
  18. // ==/UserScript==
  19. GM_addStyle( GM_getResourceText( 'layuiCss' ) )
  20.  
  21. var __defProp = Object.defineProperty;
  22. var __defNormalProp = ( obj, key, value ) => key in obj ? __defProp( obj, key, {
  23. 	enumerable: true,
  24. 	configurable: true,
  25. 	writable: true,
  26. 	value
  27. } ) : obj[key] = value;
  28. var __publicField = ( obj, key, value ) => {
  29. 	__defNormalProp( obj, typeof key !== "symbol" ? key + "" : key, value );
  30. 	return value;
  31. };
  32.  
  33. function getElement( parent, selector, timeout = 0 ) {
  34. 	return new Promise( ( resolve ) => {
  35. 		let result = parent.querySelector( selector );
  36. 		if ( result ) {
  37. 			return resolve( result );
  38. 		}
  39. 		let timer;
  40. 		const mutationObserver = window.MutationObserver || window.WebkitMutationObserver || window.MozMutationObserver;
  41. 		if ( mutationObserver ) {
  42. 			const observer = new mutationObserver( ( mutations ) => {
  43. 				for ( let mutation of mutations ) {
  44. 					for ( let addedNode of mutation.addedNodes ) {
  45. 						if ( addedNode instanceof Element ) {
  46. 							result = addedNode.matches( selector ) ? addedNode : addedNode.querySelector( selector );
  47. 							if ( result ) {
  48. 								observer.disconnect();
  49. 								timer && clearTimeout( timer );
  50. 								return resolve( result );
  51. 							}
  52. 						}
  53. 					}
  54. 				}
  55. 			} );
  56. 			observer.observe( parent, {
  57. 				childList: true,
  58. 				subtree: true
  59. 			} );
  60. 			if ( timeout > 0 ) {
  61. 				timer = setTimeout( () => {
  62. 					observer.disconnect();
  63. 					return resolve( null );
  64. 				}, timeout );
  65. 			}
  66. 		}
  67. 		else {
  68. 			const listener = ( e ) => {
  69. 				if ( e.target instanceof Element ) {
  70. 					result = e.target.matches( selector ) ? e.target : e.target.querySelector( selector );
  71. 					if ( result ) {
  72. 						parent.removeEventListener( "DOMNodeInserted", listener, true );
  73. 						timer && clearTimeout( timer );
  74. 						return resolve( result );
  75. 					}
  76. 				}
  77. 			};
  78. 			parent.addEventListener( "DOMNodeInserted", listener, true );
  79. 			if ( timeout > 0 ) {
  80. 				timer = setTimeout( () => {
  81. 					parent.removeEventListener( "DOMNodeInserted", listener, true );
  82. 					return resolve( null );
  83. 				}, timeout );
  84. 			}
  85. 		}
  86. 	} );
  87. }
  88.  
  89. const registerMenu = ( title, callback ) => {
  90. 	GM_registerMenuCommand( title, function () {
  91. 		callback();
  92. 	} );
  93. };
  94. const createElement = ( elementConfig ) => {
  95. 	const { tagName, className, id, innerHTML, innerText } = elementConfig;
  96. 	const element = document.createElement( tagName );
  97. 	if ( className && typeof className === "string" ) {
  98. 		element.classList.add( className );
  99. 	}
  100. 	else if ( className && Array.isArray( className ) ) {
  101. 		element.classList.add( ...className );
  102. 	}
  103. 	if ( id ) {
  104. 		element.id = id;
  105. 	}
  106. 	if ( innerHTML ) {
  107. 		element.innerHTML = innerHTML;
  108. 	}
  109. 	if ( innerText ) {
  110. 		element.innerText = innerText;
  111. 	}
  112. 	for ( let elementConfigKey in elementConfig ) {
  113. 		if ( [ "tagName", "className", "id", "innerHTML", "innerText" ].indexOf( elementConfigKey ) !== -1 ) {
  114. 			continue;
  115. 		}
  116. 		element.setAttribute( elementConfigKey, elementConfig[elementConfigKey] );
  117. 	}
  118. 	return element;
  119. };
  120. const addElementToDocument = ( element, cssString, fatherElement = document.body ) => {
  121. 	fatherElement.append( element );
  122. 	GM_addStyle( cssString );
  123. };
  124. const addStyle = ( cssString ) => {
  125. 	GM_addStyle( cssString );
  126. };
  127.  
  128. class Info {
  129. 	constructor( projectName ) {
  130. 		// @ts-ignore
  131. 		__publicField( this, "projectName" );
  132. 		__publicField( this, "header" );
  133. 		this.projectName = projectName;
  134. 		this.header = `[${ projectName }]`;
  135. 	}
  136. 	
  137. 	log( ...msg ) {
  138. 		/* @__PURE__ */
  139. 		( () => {
  140. 		} )( ...this.contentInfo( ...msg ) );
  141. 	}
  142. 	
  143. 	info( ...msg ) {
  144. 		console.info( ...this.contentInfo( ...msg ) );
  145. 	}
  146. 	
  147. 	warn( ...msg ) {
  148. 		console.warn( ...this.contentInfo( ...msg ) );
  149. 	}
  150. 	
  151. 	error( ...msg ) {
  152. 		console.error( ...this.contentInfo( ...msg ) );
  153. 	}
  154. 	
  155. 	contentInfo( ...msg ) {
  156. 		return [ this.header, ...msg ];
  157. 	}
  158. }
  159.  
  160. function importLayui() {
  161. 	let script = document.createElement( "script" );
  162. 	script.type = "text/javascript";
  163. 	script.src = "https://cdn.staticfile.org/layui/2.8.11/layui.min.js";
  164. 	document.head.appendChild( script );
  165. }
  166.  
  167. class Sleep {
  168. 	/** 延时睡眠等待 */
  169. 	static time( delay = 1 ) {
  170. 		return new Promise( ( resolve ) => {
  171. 			setTimeout( resolve, delay * 1e3 );
  172. 		} );
  173. 	}
  174. 	
  175. 	/** 页面加载等待 */
  176. 	static windowLoad( delay = 0 ) {
  177. 		return new Promise( ( resolve ) => {
  178. 			window.addEventListener( "load", () => {
  179. 				setTimeout( resolve, delay * 1e3 );
  180. 			} );
  181. 		} );
  182. 	}
  183. }
  184.  
  185. class Data {
  186. 	/** @param {array} newData */
  187. 	constructor( newData ) {
  188. 		/** @type {Map<string, {id: string, isBandLive: boolean, isBandDynamic: boolean, isBandVideo: boolean}>} */
  189. 		__publicField( this, "data" );
  190. 		__publicField( this, "originData" );
  191. 		if ( newData ) {
  192. 			this.setToLocalStorage( this.arrayToMap( newData ) );
  193. 		}
  194. 		this.getFromLocalStorage();
  195. 	}
  196. 	
  197. 	/** 防止多余数据提交到data中，进行重新赋值 */
  198. 	limitValue( obj ) {
  199. 		const { id, isBandLive, isBandDynamic, isBandVideo } = obj;
  200. 		return {
  201. 			id,
  202. 			isBandLive: isBandLive || false,
  203. 			isBandDynamic: isBandDynamic || false,
  204. 			isBandVideo: isBandVideo || false
  205. 		};
  206. 	}
  207. 	
  208. 	/** 添加一个对象 */
  209. 	set( newObj ) {
  210. 		if ( this.data.has( newObj.id ) ) {
  211. 			return;
  212. 		}
  213. 		const limitData = this.limitValue( newObj );
  214. 		this.data.set( newObj.id, limitData );
  215. 		this.setToLocalStorage();
  216. 		return limitData;
  217. 	}
  218. 	
  219. 	/** 更新其中一个对象 */
  220. 	update( newObj ) {
  221. 		const limitData = this.limitValue( newObj );
  222. 		this.data.set( newObj.id, limitData );
  223. 		this.setToLocalStorage();
  224. 	}
  225. 	
  226. 	/** 删除其中一个对象 */
  227. 	delete( newObjOrId ) {
  228. 		if ( typeof newObjOrId === "string" ) {
  229. 			this.data.delete( newObjOrId );
  230. 		}
  231. 		else {
  232. 			this.data.delete( newObjOrId.id );
  233. 		}
  234. 		this.setToLocalStorage();
  235. 	}
  236. 	
  237. 	/** 改变其中一个对象的键（删除原对象，建立新对象） */
  238. 	change( newObj, oldObjOrId ) {
  239. 		this.delete( oldObjOrId );
  240. 		this.set( this.limitValue( newObj ) );
  241. 		this.setToLocalStorage();
  242. 	}
  243. 	
  244. 	/** 从localStorage中获取data */
  245. 	getFromLocalStorage() {
  246. 		this.originData = JSON.parse( localStorage.getItem( "bandList" ) || "[]" );
  247. 		this.data = this.arrayToMap( this.originData );
  248. 	}
  249. 	
  250. 	/** 将data设置到localStorage中 */
  251. 	setToLocalStorage( value = this.data ) {
  252. 		localStorage.setItem( "bandList", JSON.stringify( this.mapToArray( value ) ) );
  253. 	}
  254. 	
  255. 	/**
  256. 	 * 数组转Map
  257. 	 * @param {{id: string, [propName: string]: any}[]} array
  258. 	 * @return {Map}
  259. 	 * */
  260. 	arrayToMap( array ) {
  261. 		const map = /* @__PURE__ */ new Map();
  262. 		array.forEach( ( value ) => {
  263. 			map.set( value.id, value );
  264. 		} );
  265. 		return map;
  266. 	}
  267. 	
  268. 	/**
  269. 	 * Map转数组
  270. 	 * @param {Map} map
  271. 	 * @return {any[]}
  272. 	 * */
  273. 	mapToArray( map ) {
  274. 		const array = [];
  275. 		for ( let value of map.values() ) {
  276. 			array.push( value );
  277. 		}
  278. 		return array;
  279. 	}
  280. }
  281.  
  282. class UiEvent {
  283. 	constructor( data ) {
  284. 		__publicField( this, "data" );
  285. 		__publicField( this, "treeTable" );
  286. 		__publicField( this, "domList" );
  287. 		this.data = data;
  288. 		this.treeTable = layui.treeTable;
  289. 		this.domList = {
  290. 			main: void 0
  291. 		};
  292. 		this.getMainDom();
  293. 	}
  294. 	
  295. 	/** 添加数据 */
  296. 	add() {
  297. 		layer.prompt( { title: "输入要屏蔽Up主名" }, ( res, index ) => {
  298. 			layer.close( index );
  299. 			if ( !res.trim() ) {
  300. 				return;
  301. 			}
  302. 			const newData = this.data.set( { id: res } );
  303. 			this.treeTable.addNodes( "table-bili-band-config", {
  304. 				index: 0,
  305. 				data: newData
  306. 			} );
  307. 			this.treeTable.reloadData( "table-bili-band-config" );
  308. 		} );
  309. 	}
  310. 	
  311. 	/**
  312. 	 * 删除当前行数据
  313. 	 * @param {Object} e layui数据对象
  314. 	 * */
  315. 	delete( e ) {
  316. 		this.data.delete( e.data );
  317. 		e.del();
  318. 		this.treeTable.reloadData( "table-bili-band-config" );
  319. 	}
  320. 	
  321. 	/** 更新当前行的数据
  322. 	 * @param {Object} originData
  323. 	 * @param {'dynamic' | 'video' | 'live'} type
  324. 	 * @param {number} index
  325. 	 * */
  326. 	update( originData, type, index ) {
  327. 		let newData = { ...originData };
  328. 		switch ( type ) {
  329. 			case "dynamic":
  330. 				newData.isBandDynamic = !originData.isBandDynamic;
  331. 				break;
  332. 			case "video":
  333. 				newData.isBandVideo = !originData.isBandVideo;
  334. 				break;
  335. 			case "live":
  336. 				newData.isBandLive = !originData.isBandLive;
  337. 				break;
  338. 		}
  339. 		this.treeTable.updateNode( "table-bili-band-config", index, newData );
  340. 		this.data.update( newData );
  341. 	}
  342. 	
  343. 	/** 改变Up主名称（因为需要改变键值，所以不能直接更新） */
  344. 	change( e ) {
  345. 		this.data.change( e.data, e.oldValue );
  346. 		this.treeTable.reloadData( "table-bili-band-config" );
  347. 	}
  348. 	
  349. 	/** 展示UI界面 */
  350. 	show() {
  351. 		if ( !this.domList.main ) {
  352. 			this.getMainDom();
  353. 		}
  354. 		const mainContainer = this.domList.main;
  355. 		if ( mainContainer.style.display === "none" ) {
  356. 			mainContainer.style.display = "block";
  357. 		}
  358. 		mainContainer.classList.remove( "layui-anim-fadeout", "hide" );
  359. 		mainContainer.classList.add( "layui-anim-fadein" );
  360. 	}
  361. 	
  362. 	/** 隐藏UI界面 */
  363. 	hide() {
  364. 		if ( !this.domList.main ) {
  365. 			this.getMainDom();
  366. 		}
  367. 		const mainContainer = this.domList.main;
  368. 		mainContainer.classList.remove( "layui-anim-fadein" );
  369. 		mainContainer.classList.add( "layui-anim-fadeout", "hide" );
  370. 	}
  371. 	
  372. 	getMainDom() {
  373. 		this.domList.main = document.querySelector( ".bili-band-config-container" );
  374. 	}
  375. }
  376.  
  377. class ConfigUI {
  378. 	constructor() {
  379. 		// @ts-ignore
  380. 		__publicField( this, "data" );
  381. 		// @ts-ignore
  382. 		__publicField( this, "uiEvent" );
  383. 		importLayui();
  384. 		Sleep.windowLoad().then(
  385. 			() => {
  386. 				this.data = new Data();
  387. 				this.uiEvent = new UiEvent( this.data );
  388. 				this.createContainer();
  389. 				this.createElementEvent();
  390. 				this.show = () => {
  391. 					this.uiEvent.show();
  392. 				};
  393. 				this.hide = () => {
  394. 					this.uiEvent.hide();
  395. 				};
  396. 			}
  397. 		);
  398. 	}
  399. 	
  400. 	/** 创建UI界面框架 */
  401. 	createContainer() {
  402. 		const container = createElement( {
  403. 			tagName: "main",
  404. 			className: [ "bili-band-config-container", "layui-anim", "hide" ],
  405. 			innerHTML: `<table class="layui-anim-fadeout" id="ID-table-bili-band-config" lay-filter="show"></table>`
  406. 		} );
  407. 		addElementToDocument( container, `.bili-band-config-container {position: fixed; top: 0; left:calc(50% - 355px);background: #ffffff; z-index: 10003; width: 710px;}`, document.body );
  408. 	}
  409. 	
  410. 	/**
  411. 	 * 创建UI内容，创建UI事件
  412. 	 * */
  413. 	createElementEvent() {
  414. 		layui.use( "table", () => {
  415. 			const { treeTable, form } = layui;
  416. 			treeTable.render( {
  417. 				elem: "#ID-table-bili-band-config",
  418. 				id: "table-bili-band-config",
  419. 				cols: [ [
  420. 					{
  421. 						field: "index",
  422. 						title: "编号",
  423. 						type: "numbers",
  424. 						width: 60
  425. 					},
  426. 					{
  427. 						field: "id",
  428. 						title: "UP主",
  429. 						width: 200,
  430. 						sort: true,
  431. 						align: "center",
  432. 						edit: true
  433. 					},
  434. 					{
  435. 						field: "dynamic",
  436. 						title: "动态卡片",
  437. 						width: 110,
  438. 						sort: true,
  439. 						align: "center",
  440. 						templet: ( d ) => `<input type="checkbox" lay-skin="switch" lay-filter="toggleDynamicStatus" ${ d.isBandDynamic ? "checked" : "" }/>`
  441. 					},
  442. 					{
  443. 						field: "video",
  444. 						title: "视频卡片",
  445. 						width: 110,
  446. 						sort: true,
  447. 						align: "center",
  448. 						templet: ( d ) => `<input type="checkbox" lay-skin="switch" lay-filter="toggleVideoStatus" ${ d.isBandVideo ? "checked" : "" }/>`
  449. 					},
  450. 					{
  451. 						field: "live",
  452. 						title: "直播卡片",
  453. 						width: 110,
  454. 						sort: true,
  455. 						align: "center",
  456. 						templet: ( d ) => `<input type="checkbox" lay-skin="switch" lay-filter="toggleLiveStatus" ${ d.isBandLive ? "checked" : "" }/>`
  457. 					},
  458. 					{
  459. 						field: "delete",
  460. 						title: "操作",
  461. 						width: 110,
  462. 						sort: false,
  463. 						align: "center",
  464. 						fixed: "right",
  465. 						templet: () => `<button type="button" class="layui-btn layui-btn-sm layui-btn-danger layui-btn-radius" lay-event="delete">Delete</button>`
  466. 					}
  467. 				] ],
  468. 				data: this.data.originData,
  469. 				size: "lg",
  470. 				skin: "line",
  471. 				page: {
  472. 					layout: [ "prev", "page", "next", "count", "skip" ]
  473. 				},
  474. 				pagebar: `
  475. 					<div>
  476. 						<button type="button" class="layui-btn layui-btn-sm" lay-event="add">
  477. 							Add
  478. 						</button>
  479. 						<button type="button" class="layui-btn layui-btn-sm layui-btn-warm" lay-event="close">
  480. 							Close
  481. 						</button>
  482. 					</div>
  483. 				`,
  484. 				toolbar: `
  485. 					<div>
  486. 						<form style="display: flex;">
  487. 							<input type="text" class="layui-input" style="width: 200px;" placeholder="输入需要搜索的UP主"/>
  488. 							<button type="button" lay-submit lay-filter="table-search" class="layui-btn" style="margin-left: 20px;">Search</button>
  489. 							<button type="button" lay-submit lay-filter="table-clear" class="layui-btn" style="margin-left: 20px;">Clear</button>
  490. 						</form>
  491. 					</div>
  492. 				`,
  493. 				width: 710,
  494. 				defaultToolbar: ""
  495. 			} );
  496. 			treeTable.on( "tool(show)", ( e ) => {
  497. 				this.uiEvent.delete( e );
  498. 			} );
  499. 			treeTable.on( "edit(show)", ( e ) => {
  500. 				this.uiEvent.change( e );
  501. 			} );
  502. 			
  503. 			class Checkbox {
  504. 				constructor( input ) {
  505. 					__publicField( this, "input" );
  506. 					__publicField( this, "domList" );
  507. 					this.input = input;
  508. 					this.domList = {
  509. 						input: this.input,
  510. 						tr: this.getTrDom()
  511. 					};
  512. 				}
  513. 				
  514. 				getTrDom() {
  515. 					var _a, _b, _c;
  516. 					return ( _c = ( _b = ( _a = this.input ) == null ? void 0 : _a.parentElement ) == null ? void 0 : _b.parentElement ) == null ? void 0 : _c.parentElement;
  517. 				}
  518. 				
  519. 				getTableDataIndex() {
  520. 					return parseInt( this.domList.tr.dataset.index );
  521. 				}
  522. 				
  523. 				getTableData( index ) {
  524. 					index || ( index = this.getTableDataIndex() );
  525. 					return treeTable.getNodeDataByIndex( "table-bili-band-config", index );
  526. 				}
  527. 			}
  528. 			
  529. 			form.on( "switch(toggleDynamicStatus)", ( e ) => {
  530. 				const input = new Checkbox( e.elem );
  531. 				const index = input.getTableDataIndex();
  532. 				const data = input.getTableData( index );
  533. 				this.uiEvent.update( data, "dynamic", index );
  534. 			} );
  535. 			form.on( "switch(toggleVideoStatus)", ( e ) => {
  536. 				const input = new Checkbox( e.elem );
  537. 				const index = input.getTableDataIndex();
  538. 				const data = input.getTableData( index );
  539. 				this.uiEvent.update( data, "video", index );
  540. 			} );
  541. 			form.on( "switch(toggleLiveStatus)", ( e ) => {
  542. 				const input = new Checkbox( e.elem );
  543. 				const index = input.getTableDataIndex();
  544. 				const data = input.getTableData( index );
  545. 				this.uiEvent.update( data, "live", index );
  546. 			} );
  547. 			treeTable.on( "pagebar(show)", ( e ) => {
  548. 				const { event } = e;
  549. 				if ( [ "add", "close" ].indexOf( event ) === -1 ) {
  550. 					return;
  551. 				}
  552. 				if ( event === "add" ) {
  553. 					this.uiEvent.add();
  554. 					return;
  555. 				}
  556. 				if ( event === "close" ) {
  557. 					this.uiEvent.hide();
  558. 				}
  559. 			} );
  560. 			form.on( "submit(table-search)", ( res ) => {
  561. 				const input = res.form.querySelector( "input" );
  562. 				const { value } = input;
  563. 				if ( !value.trim() ) {
  564. 					return;
  565. 				}
  566. 				const newData = [];
  567. 				this.data.mapToArray( this.data.data ).forEach( ( bandData ) => {
  568. 					if ( bandData.id.match( value ) ) {
  569. 						newData.unshift( bandData );
  570. 					}
  571. 					else {
  572. 						newData.push( bandData );
  573. 					}
  574. 				} );
  575. 				treeTable.reloadData( "table-bili-band-config", {
  576. 					data: newData
  577. 				} );
  578. 				input.value = "";
  579. 				return false;
  580. 			} );
  581. 			form.on( "submit(table-clear)", ( res ) => {
  582. 				res.form.querySelector( "input" ).value = "";
  583. 				return false;
  584. 			} );
  585. 		} );
  586. 	}
  587. 	
  588. 	// 向外暴露出show事件
  589. 	// 初始化声明show函数，具体内容会在构造函数定义
  590. 	show() {
  591. 	}
  592. 	
  593. 	// 向外暴露出hide事件
  594. 	// 初始化声明hide函数，具体内容会在构造函数定义
  595. 	hide() {
  596. 	}
  597. }
  598.  
  599. ( async () => {
  600. 	const print = new Info( "BiliBiliHideDynamic" );
  601. 	addStyle( `.hide {display: none !important}` );
  602. 	print.info( "引入UI" );
  603. 	const configUI = new ConfigUI();
  604. 	await Sleep.windowLoad();
  605. 	/* @__PURE__ */
  606. 	( () => {
  607. 	} )( configUI.data );
  608. 	
  609. 	class Observer {
  610. 		constructor() {
  611. 		}
  612. 		
  613. 		async observe( observerSelectorList, callback ) {
  614. 			await getElement( document.body, observerSelectorList.waitLoadElementSelector );
  615. 			const observer2 = new MutationObserver( ( e ) => {
  616. 				e.forEach( ( record ) => {
  617. 					var _a;
  618. 					const item = record.addedNodes[0];
  619. 					if ( !item || !( ( _a = item == null ? void 0 : item.classList ) == null ? void 0 : _a.contains( observerSelectorList.filterToken || "" ) ) ) {
  620. 						return;
  621. 					}
  622. 					callback( item );
  623. 				} );
  624. 			} );
  625. 			/* @__PURE__ */
  626. 			( () => {
  627. 			} )( observerSelectorList.observeElementSelector );
  628. 			observer2.observe( document.querySelector( observerSelectorList.observeElementSelector ), {
  629. 				childList: true
  630. 			} );
  631. 		}
  632. 	}
  633. 	
  634. 	class BandEvent {
  635. 		constructor( bandList ) {
  636. 			__publicField( this, "bandList" );
  637. 			__publicField( this, "bandTypeList", [ "dynamic", "video" ] );
  638. 			this.bandList = bandList;
  639. 		}
  640. 		
  641. 		/** 判断当前动态的Up主是否在屏蔽列表中，如果是则隐藏 */
  642. 		band( item, upNameSelector, bandType ) {
  643. 			var _a;
  644. 			const upName = ( _a = item.querySelector( upNameSelector ) ) == null ? void 0 : _a.innerText.trim();
  645. 			let bandTypeKey;
  646. 			bandTypeKey = {
  647. 				dynamic: "isBandDynamic",
  648. 				video: "isBandVideo",
  649. 				live: "isBandLive"
  650. 			};
  651. 			if ( this.bandList.has( upName ) && this.bandList.get( upName )[bandTypeKey[bandType]] ) {
  652. 				item.classList.add( "hide" );
  653. 			}
  654. 			else {
  655. 				item.classList.remove( "hide" );
  656. 			}
  657. 		}
  658. 		
  659. 		/**
  660. 		 * 获取当前所处的动态卡片编号，并根据动态卡片编号，返回不同的BandType
  661. 		 * */
  662. 		judgeBandType( tabsItemListSelector ) {
  663. 			let tabsItemIndex = 0;
  664. 			const tabsItemList = document.querySelectorAll( tabsItemListSelector );
  665. 			for ( let i = 0; i < tabsItemList.length; i++ ) {
  666. 				const tabsItem = tabsItemList[i];
  667. 				if ( tabsItem.classList.contains( "active" ) ) {
  668. 					tabsItemIndex = i;
  669. 					break;
  670. 				}
  671. 			}
  672. 			return this.bandTypeList[tabsItemIndex];
  673. 		}
  674. 		
  675. 		/** 刷新页面数据 */
  676. 		fresh( observerSelectorList, bandType ) {
  677. 			const { aimElementSelector, upNameSelector } = observerSelectorList;
  678. 			const upNameNodeList = document.querySelectorAll( aimElementSelector );
  679. 			upNameNodeList.forEach( ( aimElement ) => {
  680. 				this.band( aimElement, upNameSelector, bandType );
  681. 			} );
  682. 		}
  683. 		
  684. 		// 刷新动态卡片 / 视频卡片数据
  685. 		freshDynamic( dynamicSelectorList ) {
  686. 			const bandType = this.judgeBandType( dynamicSelectorList.tabsItemListSelector );
  687. 			bandEvent.fresh( dynamicSelectorList, bandType );
  688. 		}
  689. 		
  690. 		// 刷新直播数据
  691. 		freshLive( liveSelectorList ) {
  692. 			bandEvent.fresh( liveSelectorList, "live" );
  693. 		}
  694. 	}
  695. 	
  696. 	let domSelector = {
  697. 		dynamic: {
  698. 			waitLoadElementSelector: ".bili-dyn-list",
  699. 			observeElementSelector: ".bili-dyn-list__items",
  700. 			upNameSelector: ".bili-dyn-title__text",
  701. 			tabsItemListSelector: ".bili-dyn-list-tabs__item",
  702. 			filterToken: "bili-dyn-list__item",
  703. 			aimElementSelector: ".bili-dyn-list__item"
  704. 		},
  705. 		// Bilibili-Evolved直播侧边栏
  706. 		live: {
  707. 			waitLoadElementSelector: ".be-live-list-content",
  708. 			observeElementSelector: ".be-live-list-content",
  709. 			upNameSelector: ".be-live-list-item-user",
  710. 			filterToken: "be-live-list-item",
  711. 			aimElementSelector: ".be-live-list-item"
  712. 		},
  713. 		// 旧版直播侧边栏
  714. 		oldLive: {
  715. 			waitLoadElementSelector: ".bili-dyn-live-users__body",
  716. 			observeElementSelector: ".bili-dyn-live-users__body",
  717. 			upNameSelector: ".bili-dyn-live-users__item__uname",
  718. 			filterToken: "bili-dyn-live-users__item",
  719. 			aimElementSelector: ".bili-dyn-live-users__item"
  720. 		},
  721. 		// 新版直播侧边栏
  722. 		newLive: {
  723. 			waitLoadElementSelector: ".bili-dyn-live-users__body",
  724. 			observeElementSelector: ".bili-dyn-live-users__body",
  725. 			upNameSelector: ".bili-dyn-live-users__item__uname",
  726. 			filterToken: "bili-dyn-live-users__container",
  727. 			aimElementSelector: ".bili-dyn-live-users__container"
  728. 		}
  729. 	};
  730. 	( function judgeBiliUiVersion() {
  731. 		if ( document.querySelector( "#bili-header-container" ) && document.querySelector( ".bili-header.fixed-header" ) ) {
  732. 			domSelector.live = domSelector.newLive;
  733. 		}
  734. 		else if ( document.querySelector( "#bili-header-container" ) ) {
  735. 			;
  736. 		}
  737. 		else {
  738. 			domSelector.live = domSelector.oldLive;
  739. 		}
  740. 	} )();
  741. 	const observer = new Observer();
  742. 	const bandEvent = new BandEvent( configUI.data.data );
  743. 	await observer.observe( domSelector.dynamic, ( item ) => {
  744. 		const bandType = bandEvent.judgeBandType( domSelector.dynamic.tabsItemListSelector );
  745. 		bandEvent.band( item, domSelector.dynamic.upNameSelector, bandType );
  746. 	} );
  747. 	bandEvent.freshDynamic( domSelector.dynamic );
  748. 	await observer.observe( domSelector.live, ( item ) => {
  749. 		bandEvent.band( item, domSelector.live.upNameSelector, "live" );
  750. 	} );
  751. 	bandEvent.freshLive( domSelector.live );
  752. 	registerMenu( "添加屏蔽", () => {
  753. 		configUI.show();
  754. 	} );
  755. 	
  756. 	class DragEvent {
  757. 		constructor() {
  758. 			// Dom集合
  759. 			__publicField( this, "domList" );
  760. 			// 坐标集合
  761. 			__publicField( this, "position" );
  762. 			this.domList = {
  763. 				main: document.querySelector( ".bili-band-config-container" )
  764. 			};
  765. 			this.domList.tool = this.domList.main.querySelector( ".layui-table-tool" );
  766. 			this.position = {
  767. 				start: { x: 0, y: 0 },
  768. 				end: { x: 0, y: 0 },
  769. 				relative: { x: 0, y: 0 }
  770. 			};
  771. 			this.bindDragEvent( this.domList.tool );
  772. 		}
  773. 		
  774. 		/** 绑定拖拽事件 */
  775. 		bindDragEvent( willDraggableElement ) {
  776. 			willDraggableElement.draggable = true;
  777. 			willDraggableElement.addEventListener( "dragstart", ( e ) => {
  778. 				this.getStartPosition( e );
  779. 			} );
  780. 			willDraggableElement.addEventListener( "dragend", ( e ) => {
  781. 				e.preventDefault();
  782. 				this.getEndPosition( e );
  783. 				this.getRelativePosition();
  784. 				this.changeDomPosition();
  785. 			} );
  786. 		}
  787. 		
  788. 		/** 获取开始坐标 */
  789. 		getStartPosition( e ) {
  790. 			const { pageX, pageY } = e;
  791. 			this.position.start = {
  792. 				x: pageX,
  793. 				y: pageY
  794. 			};
  795. 		}
  796. 		
  797. 		/** 获取结束坐标 */
  798. 		getEndPosition( e ) {
  799. 			const { pageX, pageY } = e;
  800. 			this.position.end = {
  801. 				x: pageX,
  802. 				y: pageY
  803. 			};
  804. 		}
  805. 		
  806. 		/** 获取相对坐标 */
  807. 		getRelativePosition() {
  808. 			this.position.relative = {
  809. 				x: this.position.relative.x + this.position.end.x - this.position.start.x,
  810. 				y: this.position.relative.y + this.position.end.y - this.position.start.y
  811. 			};
  812. 		}
  813. 		
  814. 		/** 改变main容器的坐标位置 */
  815. 		changeDomPosition() {
  816. 			this.domList.main.style.transform = `translate(${ this.position.relative.x }px, ${ this.position.relative.y }px)`;
  817. 		}
  818. 	}
  819. 	
  820. 	( () => {
  821. 		const domList = {
  822. 			closeBtn: document.querySelector( "[lay-event=close]" )
  823. 		};
  824. 		domList.closeBtn.addEventListener( "click", () => {
  825. 			bandEvent.freshDynamic( domSelector.dynamic );
  826. 			bandEvent.freshLive( domSelector.live );
  827. 		} );
  828. 		new DragEvent();
  829. 	} )();
  830. } )();