☰

哔哩哔哩-B站-Bilibili搜索结果过滤

手动过滤搜索结果(兼容Bilibili旧播放页)

目前为 2024-11-03 提交的版本。查看 最新版本。

  1. // ==UserScript==
  2. // @name         哔哩哔哩-B站-Bilibili搜索结果过滤
  3. // @version      0.2
  4. // @description  手动过滤搜索结果(兼容Bilibili旧播放页)
  5. // @author       rteta、gpt4o、deepseek2.5、gemini1.5pro-002
  6. // @match        https://search.bilibili.com/*
  7. // @license MIT
  8. // @namespace https://greasyfork.org/users/1217761
  9. // ==/UserScript==
  10. (function() {
  11.     'use strict';
  12.     // Create a container for the input and controls
  13.     const controlContainer = document.createElement('div');
  14.     controlContainer.style.position = 'fixed';
  15.     controlContainer.style.left = '10px';
  16.     controlContainer.style.bottom = '10px';
  17.     controlContainer.style.zIndex = '9999';
  18.     controlContainer.style.backgroundColor = '#fff';
  19.     controlContainer.style.padding = '10px';
  20.     controlContainer.style.border = '1px solid #ccc';
  21.     controlContainer.style.borderRadius = '5px';
  22.     controlContainer.style.boxShadow = '0 0 10px rgba(0, 0, 0, 0.2)';
  23.     controlContainer.style.display = 'flex';  // Use Flexbox
  24.     controlContainer.style.flexDirection = 'column';  // Stack elements vertically
  25.     controlContainer.style.transition = 'left 0.3s ease-in-out';  // Add transition effect
  26.     document.body.appendChild(controlContainer);
  27.  
  28.     // Create keyword input
  29.     const inputBox = document.createElement('textarea');
  30.     inputBox.placeholder = '多个关键词请用英文逗号隔开';
  31.     inputBox.style.width = '180px';
  32.     inputBox.style.height = '100px';
  33.     inputBox.style.marginBottom = '5px';  // Add some spacing
  34.     controlContainer.appendChild(inputBox);
  35.  
  36.     // Create a select element for filtering mode
  37.     const filterModeSelect = document.createElement('select');
  38.     filterModeSelect.style.width = '100%'; // Occupy full container width
  39.     filterModeSelect.style.marginBottom = '5px'; // Add spacing
  40.  
  41.     const showAllOption = document.createElement('option');
  42.     showAllOption.value = 'all';
  43.     showAllOption.text = '显示所有内容';
  44.     filterModeSelect.appendChild(showAllOption);
  45.  
  46.     const showMatchingOption = document.createElement('option');
  47.     showMatchingOption.value = 'matching';
  48.     showMatchingOption.text = '只显示含有关键词的内容';
  49.     filterModeSelect.appendChild(showMatchingOption);
  50.  
  51.     const hideMatchingOption = document.createElement('option');
  52.     hideMatchingOption.value = 'hide';
  53.     hideMatchingOption.text = '不显示含有关键词的内容';
  54.     filterModeSelect.appendChild(hideMatchingOption);
  55.  
  56.     controlContainer.appendChild(filterModeSelect);
  57.  
  58.     // Function to hide the container
  59.     function hideContainer() {
  60.         controlContainer.style.left = '-190px';  // Hide the container to the left side
  61.     }
  62.  
  63.     // Function to show the container
  64.     function showContainer() {
  65.         controlContainer.style.left = '10px';  // Show the container from the left side
  66.     }
  67.  
  68.     // Event listener to detect clicks outside the container
  69.     document.addEventListener('click', function(event) {
  70.         if (!controlContainer.contains(event.target)) {
  71.             hideContainer();
  72.         } else {
  73.             showContainer();
  74.         }
  75.     });
  76.  
  77.     // Initially show the container
  78.     showContainer();
  79.  
  80.  
  81.     let keywords = [];
  82.  
  83.     function filterListItems() {
  84.         const filterMode = filterModeSelect.value;
  85.         const selectors = ['ul.video-list.clearfix > li', 'div.video-list.row > div'];
  86.  
  87.         selectors.forEach(selector => {
  88.             document.querySelectorAll(selector).forEach(item => {
  89.                 const itemText = item.textContent.trim();
  90.                 const matches = keywords.some(keyword => itemText.includes(keyword));
  91.  
  92.                 if (filterMode === 'all') {
  93.                     item.style.display = '';
  94.                 } else if (filterMode === 'matching') {
  95.                     item.style.display = matches ? '' : 'none';
  96.                 } else if (filterMode === 'hide') {
  97.                     item.style.display = matches ? 'none' : '';
  98.                 }
  99.             });
  100.         });
  101.     }
  102.  
  103.     inputBox.addEventListener('input', () => {
  104.         keywords = inputBox.value.trim() ? inputBox.value.split(',').map(keyword => keyword.trim()) : [];
  105.         filterListItems();
  106.     });
  107.  
  108.     filterModeSelect.addEventListener('change', filterListItems); // Filter on selection change
  109.  
  110.     // Observe changes in the DOM
  111.     const observer = new MutationObserver(mutations => {
  112.         mutations.forEach(mutation => {
  113.             if (mutation.addedNodes.length || mutation.removedNodes.length) {
  114.                 filterListItems();
  115.             }
  116.         });
  117.     });
  118.  
  119.     observer.observe(document.body, { childList: true, subtree: true });
  120. })();