☰

google translate utils

Full screen content, replace line breaks; draw inspiration from tabedit

// ==UserScript==
// @name         google translate utils
// @name:zh-CN   google翻译实用工具
// @description  Full screen content, replace line breaks; draw inspiration from tabedit
// @description:zh-CN 内容全屏，替换换行；借鉴 tabedit
// @namespace    http://tampermonkey.net/
// @version      2025-07-26.3
// @author       linlccc
// @include     http*://translate.google.*
// @grant        none
// @license MIT
// ==/UserScript==

(function () {
  "use strict";
  // 激活时颜色
  const activeColor = "rgba(66,133,244,.12)";
  // 非激活时颜色
  const inactiveColor = "rgba(0, 0, 0, 0)";
  // 获取导航栏容器
  const navContainer = Array.from(document.querySelectorAll("nav")).filter((v) => v.innerHTML.indexOf("翻译类型") !== -1)[0];
  if (!navContainer) {
    console.warn("无法找到导航栏容器，可能页面结构已更改");
    return;
  }

  // 添加一个导航按钮
  function addNavButton(text, callback) {
    // 复制一个按钮
    const copyButtonCon = navContainer.children[2].cloneNode(true);
    const copyButton = copyButtonCon.querySelector("button");
    // 设置按钮
    copyButton.querySelector("svg").remove();
    copyButton.querySelector("span").innerText = text;
    copyButton.addEventListener("click", callback);
    // 添加到导航栏
    navContainer.appendChild(copyButtonCon);
    return copyButton;
  }
  // 设置导航按钮文本
  function setNavButtonContent(button, content) {
    if (button && button.querySelector("span")) button.querySelector("span").innerText = content;
  }
  // 添加占位
  function addNavButtonPlaceholder() {
    const button = addNavButton("分隔占位");
    button.innerText = "";
    button.style.minWidth = "0";
    button.style.padding = "0";
  }

  // 内容全屏
  function addFullScreenContent() {
    // 控制的元素
    const ctrlE = document.evaluate("/html/body/c-wiz/div/div[2]/c-wiz", document).iterateNext();
    const ctrlE2 = document.evaluate("/html/body/c-wiz/div/div[2]/c-wiz/div[6]", document).iterateNext();
    if (!ctrlE) {
      console.warn("无法找到内容容器，可能页面结构已更改");
      return;
    }
    // 全屏状态 key
    const fullScreenKey = "enableContentFullScreen";
    // 创建的按钮
    let button = null;
    // 获取是否全屏状态
    const getFullScreenState = () => localStorage.getItem(fullScreenKey) === "true";
    // 设置全屏状态
    const setFullScreenState = (enabled) => localStorage.setItem(fullScreenKey, enabled.toString());
    // 更新按钮显示
    function updateButton() {
      const state = getFullScreenState();
      // 设置按钮背景颜色
      button.style.backgroundColor = state ? activeColor : inactiveColor;
      // 设置按钮文本
      setNavButtonContent(button, state ? "关闭内容全屏" : "开启内容全屏");
    }
    // 更新全屏样式
    function updateFullScreenStyle() {
      if (getFullScreenState()) {
        ctrlE.style.padding = "5px";
        ctrlE.style.maxWidth = "100%";
        if (ctrlE2) ctrlE2.style.maxWidth = "100%";
      } else {
        ctrlE.style.padding = "";
        ctrlE.style.maxWidth = "";
        if (ctrlE2) ctrlE2.style.maxWidth = "";
      }
    }

    // 添加内容全屏按钮
    button = addNavButton("", () => {
      setFullScreenState(!getFullScreenState());
      updateButton();
      updateFullScreenStyle();
    });

    // 恢复状态
    updateButton();
    updateFullScreenStyle();
  }

  // 替换换行
  function replaceLineBreaks() {
    addNavButton("替换换行", () => {
      var raw = /text=([^&]+)/.exec(location.href);
      raw = raw && raw[1];
      if (!raw) return;

      raw = decodeURIComponent(raw);
      if (!/\n/.test(raw)) return;

      var replaced = raw.replace(/\n/g, " ").replace(/ {2,}/g, " ").replace(/\. /g, ".");
      replaced = encodeURIComponent(replaced);
      var location_href = location.href.replace(/text=([^&]+)/, "text=" + replaced);
      location.href = location_href;
    });
  }

  // 屏蔽干扰元素
  function removeExtraElements() {
    // 头部
    const header = document.evaluate("/html/body/div[2]/header", document).iterateNext();
    // 头部占位
    const headerPlaceholder = document.evaluate("/html/body/c-wiz/div/div[1]", document).iterateNext();
    // 反馈
    const feedback = document.evaluate("/html/body/c-wiz/div/div[2]/c-wiz/div[2]/c-wiz/div[1]/div[3]", document).iterateNext();
    // 历史数据
    const historyData = document.evaluate("/html/body/c-wiz/div/div[2]/c-wiz/nav", document).iterateNext();

    // key
    const removeKey = "removeExtraElements";
    // 创建的按钮
    let button = null;
    // 获取是否移除状态
    const getRemoveState = () => localStorage.getItem(removeKey) === "true";
    // 设置移除状态
    const setRemoveState = (enabled) => localStorage.setItem(removeKey, enabled.toString());
    // 更新按钮显示
    function updateButton() {
      const state = getRemoveState();
      // 设置按钮背景颜色
      button.style.backgroundColor = state ? activeColor : inactiveColor;
      // 设置按钮文本
      setNavButtonContent(button, state ? "恢复干扰元素" : "屏蔽干扰元素");
    }
    // 更新元素显示
    function updateElements() {
      if (getRemoveState()) {
        if (header) header.style.display = "none";
        if (headerPlaceholder) headerPlaceholder.style.display = "none";
        if (feedback) feedback.style.display = "none";
        if (historyData) historyData.style.display = "none";
      } else {
        if (header) header.style.display = "";
        if (headerPlaceholder) headerPlaceholder.style.display = "";
        if (feedback) feedback.style.display = "";
        if (historyData) historyData.style.display = "";
      }
    }

    // 添加移除多余元素按钮
    button = addNavButton("", () => {
      setRemoveState(!getRemoveState());
      updateButton();
      updateElements();
    });

    // 恢复状态
    updateButton();
    updateElements();
  }

  // 添加分隔占位
  addNavButtonPlaceholder();
  // 内容全屏
  addFullScreenContent();
  // 替换换行
  replaceLineBreaks();
  // 屏蔽干扰元素
  removeExtraElements();
})();