// ==UserScript==
// @name         推特搜索筛选助手Twitter Search Helper Elegant
// @namespace    example.uihelper
// @version      0.4
// @description  带精致UI的推特搜索助手示例（仅客户端）
// @match        https://twitter.com/*
// @match        https://x.com/*
// @grant        none
// @license MIT
// @downloadURL none
// ==/UserScript==

(function () {
  'use strict';

  // ----搜索预设----
  const presets = {
    "📷 图片": "filter:images -filter:retweets -filter:replies",
    "🎬 视频": "filter:videos -filter:retweets -filter:replies",
    "🔥 高热度": "min_faves:200 -filter:retweets",
    "🈶 日语": "lang:ja -filter:retweets -filter:replies",
    "🌎 英语": "lang:en -filter:retweets -filter:replies",
    "💬 感想类": "感想 OR 評価 lang:ja -filter:retweets -filter:replies"
  };

  // ----面板HTML结构----
  const panel = document.createElement('div');
  panel.id = 'tw-helper-panel';
  panel.innerHTML = `
    <div class="header">🔍 推特搜索助手</div>
    <input id="tw-keyword" type="text" placeholder="请输入关键词">
    <div id="tw-buttons"></div>
  `;

  // ----样式----
  const style = document.createElement('style');
  style.textContent = `
    #tw-helper-panel{
      position:fixed;
      bottom:20px;
      right:20px;
      z-index:9999;
      width:210px;
      background:rgba(30,35,50,0.75);
      backdrop-filter:blur(10px);
      border-radius:16px;
      padding:16px;
      box-shadow:0 4px 20px rgba(0,0,0,0.4);
      color:#fff;
      font-family:'Segoe UI',sans-serif;
      font-size:13px;
      transition:all .3s ease;
    }
    #tw-helper-panel:hover{
      box-shadow:0 8px 24px rgba(0,0,0,0.5);
      transform:translateY(-2px);
    }
    #tw-helper-panel .header{
      font-weight:600;
      text-align:center;
      margin-bottom:10px;
      letter-spacing:.5px;
    }
    #tw-helper-panel input{
      width:100%;
      padding:6px 8px;
      border:none;
      border-radius:8px;
      font-size:13px;
      margin-bottom:12px;
      outline:none;
    }
    #tw-buttons{
      display:flex;
      flex-wrap:wrap;
      justify-content:space-between;
    }
    #tw-buttons button{
      flex:0 0 48%;
      background:linear-gradient(145deg,#1DA1F2,#667eea);
      border:none;
      border-radius:8px;
      margin-bottom:6px;
      color:#fff;
      padding:6px 0;
      font-size:12px;
      cursor:pointer;
      transition:background .3s,transform .2s;
    }
    #tw-buttons button:hover{
      background:linear-gradient(145deg,#4facfe,#00f2fe);
      transform:scale(1.05);
    }
  `;
  document.head.appendChild(style);
  document.body.appendChild(panel);

  // ----生成按钮----
  const container = document.querySelector('#tw-buttons');
  Object.keys(presets).forEach(name => {
    const b = document.createElement('button');
    b.textContent = name;
    b.onclick = () => doSearch(presets[name]);
    container.appendChild(b);
  });

  // ----执行搜索----
  function doSearch(expr) {
    const kw = document.getElementById('tw-keyword').value.trim();
    if(!kw){ alert('请输入关键词'); return; }
    const q = encodeURIComponent(`${kw} ${expr}`);
    const url = `https://twitter.com/search?q=${q}&src=typed_query&f=top`;
    window.open(url,'_blank');
  }
})();