Qwen Chat: One-Click Toggle Overview Button

One-Click Toggle Overview Button

За да инсталирате този скрипт, трябва да имате инсталирано разширение като Tampermonkey, Greasemonkey или Violentmonkey.

За да инсталирате този скрипт, трябва да имате инсталирано разширение като Tampermonkey или Violentmonkey.

За да инсталирате този скрипт, трябва да имате инсталирано разширение като Tampermonkey или Violentmonkey.

За да инсталирате този скрипт, трябва да имате инсталирано разширение като Tampermonkey или Userscripts.

За да инсталирате скрипта, трябва да инсталирате разширение като Tampermonkey.

За да инсталирате този скрипт, трябва да имате инсталиран скриптов мениджър.

(Вече имам скриптов мениджър, искам да го инсталирам!)

За да инсталирате този стил, трябва да инсталирате разширение като Stylus.

За да инсталирате този стил, трябва да инсталирате разширение като Stylus.

За да инсталирате този стил, трябва да инсталирате разширение като Stylus.

За да инсталирате този стил, трябва да имате инсталиран мениджър на потребителски стилове.

За да инсталирате този стил, трябва да имате инсталиран мениджър на потребителски стилове.

За да инсталирате този стил, трябва да имате инсталиран мениджър на потребителски стилове.

(Вече имам инсталиран мениджър на стиловете, искам да го инсталирам!)

// ==UserScript==
// @name         Qwen Chat: One-Click Toggle Overview Button
// @name:ru      Qwen Chat: Кнопка для мгновенного включения/выключения обзора
// @namespace    http://tampermonkey.net/
// @description  One-Click Toggle Overview Button
// @description:ru Кнопка для мгновенного включения/выключения обзора
// @author       a114_you
// @version      1.2
// @match        https://chat.qwen.ai/*
// @grant        none
// @run-at       document-idle
// @license      MIT
// ==/UserScript==

(function () {
  'use strict';

  const CONTEXT_BTN_ID       = 'chat-context-menu-button';
  const MENU_SELECTOR        = 'div[role="menu"][data-state="open"]';
  const OVERVIEW_ICON_CLASS  = 'icon-map-01';
  const BUTTON_ID            = 'direct-overview-btn';
  const CLOSE_ICON_CLASS     = 'icon-line-x-01'; 

  function isOverviewOpen() {
    return !!document.querySelector('[data-testid="svelte-flow__wrapper"]');
  }

  async function openOverviewIfNeeded() {
    if ( isOverviewOpen() ) return false;
    const trigger = document.getElementById(CONTEXT_BTN_ID);
    if (!trigger) return false;
    trigger.click();
    await new Promise(r => setTimeout(r, 100));
    const menu = document.querySelector(MENU_SELECTOR);
    if (!menu) return false;
    // find the item by its icon
    const icon = menu.querySelector(`.${OVERVIEW_ICON_CLASS}`);
    const item = icon?.closest('[role="menuitem"]');
    if (!item) return false;
    // use whatever text the menu item has
    const label = item.textContent.trim();
    const btn   = document.getElementById(BUTTON_ID);
    if (btn) btn.querySelector('span').textContent = label;
    item.click();
    // wait for panel
    for (let i=0; i<10 && !isOverviewOpen(); i++) {
      await new Promise(r => setTimeout(r, 100));
    }
    return isOverviewOpen();
  }

  function closeOverview() {
    const closeIcon = document.querySelector(`.${CLOSE_ICON_CLASS}`);
    const closeButton = closeIcon?.closest('button');

    if (closeButton) {
      closeButton.click();
      return true;
    }
    return false;
  }

  function insertButton() {
    const op = document.querySelector('.operationBtn');
    if (!op || document.getElementById(BUTTON_ID)) return;
    op.insertAdjacentHTML('beforeend', `
      <div id="${BUTTON_ID}"
           class="flex cursor-pointer items-center gap-2 rounded-md px-3 py-2 text-sm
                  hover:bg-gray-50 dark:hover:bg-gray-800"
           title="Toggle Overview">
        <i class="iconfont leading-none ${OVERVIEW_ICON_CLASS}"></i>
        <span></span>
      </div>`);

    document.getElementById(BUTTON_ID)
      .addEventListener('click', async () => {
        if (isOverviewOpen()) {
          closeOverview();
        } else {
          await openOverviewIfNeeded();
        }
      });
  }

  insertButton();
  new MutationObserver(insertButton)
    .observe(document.body, { childList: true, subtree: true });

})();