☰

Twitter Search Advanced

Adds an Advanced Search button next to Twitter's search box. Makes it easier to access Twitter's powerful advanced search features.

  1. // ==UserScript==
  2. // @name         Twitter Search Advanced
  3. // @name:zh-CN   Twitter高级搜索按钮
  4. // @name:ja      Twitter高度な検索ボタン
  5. // @name:fr      Recherche Avancée Twitter
  6. // @name:ru      Расширенный поиск Twitter
  7. // @name:es      Búsqueda Avanzada de Twitter
  8. // @name:pt      Pesquisa Avançada do Twitter
  9. // @namespace    http://tampermonkey.net/
  10. // @version      0.3
  11. // @description  Adds an Advanced Search button next to Twitter's search box. Makes it easier to access Twitter's powerful advanced search features.
  12. // @description:zh-CN  在Twitter搜索框旁边添加高级搜索按钮，方便快速访问Twitter强大的高级搜索功能。
  13. // @description:ja     Twitterの検索ボックスの横に高度な検索ボタンを追加し、Twitterの強力な検索機能に素早くアクセスできます。
  14. // @description:fr     Ajoute un bouton de recherche avancée à côté de la barre de recherche Twitter. Facilite l'accès aux puissantes fonctionnalités de recherche avancée de Twitter.
  15. // @description:ru     Добавляет кнопку расширенного поиска рядом с полем поиска Twitter. Облегчает доступ к мощным функциям расширенного поиска Twitter.
  16. // @description:es     Añade un botón de búsqueda avanzada junto al cuadro de búsqueda de Twitter. Facilita el acceso a las potentes funciones de búsqueda avanzada de Twitter.
  17. // @description:pt     Adiciona um botão de pesquisa avançada ao lado da caixa de pesquisa do Twitter. Facilita o acesso aos poderosos recursos de pesquisa avançada do Twitter.
  18. // @author       Your name
  19. // @match        https://x.com/*
  20. // @match        https://twitter.com/*
  21. // @grant        none
  22. // @license MIT
  23. // ==/UserScript==
  24.  
  25. (function() {
  26.     'use strict';
  27.  
  28.     // Language settings
  29.     const LANGUAGES = {
  30.         'zh-CN': '高级搜索',
  31.         'ja': '高度な検索',
  32.         'en': 'Search Advanced',
  33.         'fr': 'Recherche Avancée',
  34.         'ru': 'Расширенный поиск',
  35.         'es': 'Búsqueda Avanzada',
  36.         'pt': 'Pesquisa Avançada'
  37.     };
  38.  
  39.     // Get user's browser language
  40.     function getUserLanguage() {
  41.         const lang = navigator.language || navigator.userLanguage;
  42.         const shortLang = lang.split('-')[0];
  43.         
  44.         // Check for exact match first
  45.         if (LANGUAGES[lang]) {
  46.             return LANGUAGES[lang];
  47.         }
  48.         // Then check for language without region
  49.         if (LANGUAGES[shortLang]) {
  50.             return LANGUAGES[shortLang];
  51.         }
  52.         // Default to English
  53.         return LANGUAGES['en'];
  54.     }
  55.  
  56.     // Function to add the advanced search button
  57.     function addAdvancedSearchButton() {
  58.         // Find the search box container
  59.         const searchBox = document.querySelector("#react-root > div > div > div.css-175oi2r.r-1f2l425.r-13qz1uu.r-417010.r-18u37iz > main > div > div > div > div > div > div.css-175oi2r.r-aqfbo4.r-gtdqiz.r-1gn8etr.r-1g40b8q > div.css-175oi2r.r-1e5uvyk.r-6026j > div.css-175oi2r.r-136ojw6 > div > div > div > div > div.css-175oi2r.r-1pz39u2.r-1777fci.r-15ysp7h.r-obd0qt.r-s8bhmr");
  60.         
  61.         if (searchBox && !document.getElementById('advanced-search-btn')) {
  62.             // Create the button
  63.             const button = document.createElement('button');
  64.             button.id = 'advanced-search-btn';
  65.             button.textContent = getUserLanguage();
  66.             button.style.cssText = `
  67.                 margin-left: 12px;
  68.                 padding: 0 16px;
  69.                 height: 32px;
  70.                 min-height: 32px;
  71.                 border-radius: 16px;
  72.                 background-color: rgb(15, 20, 25);
  73.                 color: rgb(255, 255, 255);
  74.                 border: 1px solid rgb(15, 20, 25);
  75.                 font-weight: 700;
  76.                 cursor: pointer;
  77.                 font-size: 14px;
  78.                 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  79.                 transition-property: background-color, box-shadow;
  80.                 transition-duration: 0.2s;
  81.                 line-height: 32px;
  82.                 display: inline-flex;
  83.                 align-items: center;
  84.                 justify-content: center;
  85.                 user-select: none;
  86.                 white-space: nowrap;
  87.             `;
  88.  
  89.             // Add hover effect
  90.             button.onmouseover = function() {
  91.                 this.style.backgroundColor = 'rgb(39, 44, 48)';
  92.             };
  93.             button.onmouseout = function() {
  94.                 this.style.backgroundColor = 'rgb(15, 20, 25)';
  95.             };
  96.  
  97.             // Add click event
  98.             button.addEventListener('click', function() {
  99.                 window.location.href = 'https://x.com/search-advanced';
  100.             });
  101.  
  102.             // Insert the button after the search box
  103.             searchBox.parentNode.insertBefore(button, searchBox.nextSibling);
  104.             return true;
  105.         }
  106.         return false;
  107.     }
  108.  
  109.     // Function to check if we should add the button
  110.     function shouldAddButton() {
  111.         const url = window.location.href;
  112.         return url.includes('/explore') || url.includes('/search-advanced');
  113.     }
  114.  
  115.     // Function to continuously check for the search box
  116.     function startChecking() {
  117.         if (shouldAddButton()) {
  118.             // Initial check
  119.             if (!addAdvancedSearchButton()) {
  120.                 // If not found, set up periodic checking
  121.                 const checkInterval = setInterval(() => {
  122.                     if (addAdvancedSearchButton() || !shouldAddButton()) {
  123.                         clearInterval(checkInterval);
  124.                     }
  125.                 }, 1000);
  126.             }
  127.         }
  128.     }
  129.  
  130.     // Start checking when script loads
  131.     startChecking();
  132.  
  133.     // Create a MutationObserver to watch for DOM changes
  134.     const observer = new MutationObserver((mutations) => {
  135.         if (shouldAddButton() && !document.getElementById('advanced-search-btn')) {
  136.             startChecking();
  137.         }
  138.     });
  139.  
  140.     // Start observing the document with the configured parameters
  141.     observer.observe(document.body, {
  142.         childList: true,
  143.         subtree: true,
  144.         attributes: true,
  145.         characterData: true
  146.     });
  147.  
  148.     // Also check when history events occur (back/forward navigation)
  149.     window.addEventListener('popstate', function() {
  150.         if (shouldAddButton()) {
  151.             startChecking();
  152.         }
  153.     });
  154.  
  155.     // Check when the page visibility changes (tab switching)
  156.     document.addEventListener('visibilitychange', function() {
  157.         if (!document.hidden && shouldAddButton()) {
  158.             startChecking();
  159.         }
  160.     });
  161.  
  162.     // Handle URL changes
  163.     let lastUrl = location.href;
  164.     new MutationObserver(() => {
  165.         const url = location.href;
  166.         if (url !== lastUrl) {
  167.             lastUrl = url;
  168.             if (shouldAddButton()) {
  169.                 startChecking();
  170.             }
  171.         }
  172.     }).observe(document, {subtree: true, childList: true});
  173. })();