Archive.md Quick Jump

在主流新闻站点页面添加 archive.md 存档/查看按钮

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name         Archive.md Quick Jump
// @namespace    https://archive.md/
// @version      1.1
// @description  在主流新闻站点页面添加 archive.md 存档/查看按钮
// @author       ayaka
// @match        *://*.nytimes.com/*
// @match        *://*.washingtonpost.com/*
// @match        *://*.wsj.com/*
// @match        *://*.bbc.com/*
// @match        *://*.bbc.co.uk/*
// @match        *://*.cnn.com/*
// @match        *://*.reuters.com/*
// @match        *://*.apnews.com/*
// @match        *://*.theguardian.com/*
// @match        *://*.ft.com/*
// @match        *://*.economist.com/*
// @match        *://*.bloomberg.com/*
// @match        *://*.forbes.com/*
// @match        *://*.cnbc.com/*
// @match        *://*.foxnews.com/*
// @match        *://*.nbcnews.com/*
// @match        *://*.abcnews.go.com/*
// @match        *://*.politico.com/*
// @match        *://*.theatlantic.com/*
// @match        *://*.newyorker.com/*
// @match        *://*.latimes.com/*
// @match        *://*.usatoday.com/*
// @match        *://*.time.com/*
// @match        *://*.independent.co.uk/*
// @match        *://*.telegraph.co.uk/*
// @match        *://*.dailymail.co.uk/*
// @match        *://*.spiegel.de/*
// @match        *://*.lemonde.fr/*
// @match        *://*.nhk.or.jp/*
// @match        *://*.asahi.com/*
// @match        *://*.mainichi.jp/*
// @match        *://*.yomiuri.co.jp/*
// @match        *://*.nikkei.com/*
// @match        *://*.scmp.com/*
// @match        *://*.straitstimes.com/*
// @match        *://*.aljazeera.com/*
// @match        *://*.nature.com/*
// @match        *://*.science.org/*
// @match        *://*.wired.com/*
// @match        *://*.arstechnica.com/*
// @match        *://*.theverge.com/*
// @match        *://*.techcrunch.com/*
// @match        *://*.medium.com/*
// @match        *://*.substack.com/*
// @match        *://*.caixin.com/*
// @match        *://*.infzm.com/*
// @match        *://*.chinadaily.com.cn/*
// @license      MIT
// @grant        GM_addStyle
// @run-at       document-idle
// ==/UserScript==

(function () {
  'use strict';

  const currentURL = location.href;
  const archiveNewest = `https://archive.md/newest/${currentURL}`;
  const archiveSubmit = `https://archive.md/?run=1&url=${encodeURIComponent(currentURL)}`;

  GM_addStyle(`
    #archive-bar {
      position: fixed;
      top: 8px;
      right: 8px;
      z-index: 2147483647;
      display: flex;
      align-items: center;
      gap: 4px;
      background: rgba(15, 15, 20, 0.88);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border: 1px solid rgba(255,255,255,0.08);
      border-radius: 10px;
      padding: 4px;
      box-shadow: 0 4px 20px rgba(0,0,0,0.3);
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
      font-size: 0;
      line-height: 1;
      user-select: none;
      opacity: 0.45;
      transition: opacity .25s ease;
    }
    #archive-bar:hover {
      opacity: 1;
    }
    #archive-bar a,
    #archive-bar button {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 6px 10px;
      border-radius: 7px;
      border: none;
      background: transparent;
      color: rgba(255,255,255,0.8);
      font-size: 12px;
      font-weight: 500;
      font-family: inherit;
      text-decoration: none;
      white-space: nowrap;
      cursor: pointer;
      transition: background .15s, color .15s;
    }
    #archive-bar a:hover,
    #archive-bar button:hover {
      background: rgba(255,255,255,0.12);
      color: #fff;
    }
    #archive-bar .divider {
      width: 1px;
      height: 16px;
      background: rgba(255,255,255,0.12);
      flex-shrink: 0;
    }
    #archive-bar svg {
      width: 14px;
      height: 14px;
      flex-shrink: 0;
    }
    #archive-bar .toast {
      color: #6ee7b7;
      font-size: 12px;
      padding: 6px 10px;
    }
  `);

  const container = document.createElement('div');
  container.id = 'archive-bar';

  // 查看存档
  const viewLink = document.createElement('a');
  viewLink.href = archiveNewest;
  viewLink.target = '_blank';
  viewLink.rel = 'noopener';
  viewLink.innerHTML = `
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
      <path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"/>
      <path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"/>
    </svg>
    <span>查看存档</span>`;

  // 分隔线
  const d1 = document.createElement('span');
  d1.className = 'divider';
  const d2 = document.createElement('span');
  d2.className = 'divider';

  // 创建存档
  const saveLink = document.createElement('a');
  saveLink.href = archiveSubmit;
  saveLink.target = '_blank';
  saveLink.rel = 'noopener';
  saveLink.innerHTML = `
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
      <path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z"/>
      <polyline points="17 21 17 13 7 13 7 21"/>
      <polyline points="7 3 7 8 15 8"/>
    </svg>
    <span>创建存档</span>`;

  // 复制链接
  const copyBtn = document.createElement('button');
  copyBtn.innerHTML = `
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
      <rect x="9" y="9" width="13" height="13" rx="2" ry="2"/>
      <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/>
    </svg>
    <span>复制链接</span>`;
  copyBtn.addEventListener('click', () => {
    navigator.clipboard.writeText(archiveNewest).then(() => {
      const label = copyBtn.querySelector('span');
      label.textContent = '已复制 ✓';
      copyBtn.style.color = '#6ee7b7';
      setTimeout(() => {
        label.textContent = '复制链接';
        copyBtn.style.color = '';
      }, 1200);
    });
  });

  container.append(viewLink, d1, saveLink, d2, copyBtn);
  document.body.appendChild(container);
})();