Shikimori RIP Button のソースコード

Shikimori RIP Button

Adds a button after Shikimori logo to open the same page on shikimori.rip
右端で折り返す
// ==UserScript==
// @name         Shikimori RIP Button
// @namespace    https://shikimori.io/
// @version      1.0
// @description  Adds a button after Shikimori logo to open the same page on shikimori.rip
// @author       evs
// @license      MIT
// @match        https://shikimori.one/*
// @match        http://shikimori.one/*
// @match        https://shikimori.io/*
// @match        http://shikimori.io/*
// @match        https://shiki.one/*
// @match        http://shiki.one/*
// @run-at       document-start
// @grant        none
// ==/UserScript==

(function () {
  'use strict';

  const BUTTON_ID = 'shiki-rip-button';
  const TARGET_HOST = 'shikimori.rip';

  function getTargetUrl() {
    const url = new URL(location.href);
    url.protocol = 'https:';
    url.hostname = TARGET_HOST;
    return url.toString();
  }

  function makeButton() {
    const a = document.createElement('a');

    a.id = BUTTON_ID;
    a.href = getTargetUrl();
    a.textContent = 'RIP';
    a.title = 'Открыть эту же страницу на shikimori.rip';

    a.style.display = 'inline-flex';
    a.style.alignItems = 'center';
    a.style.justifyContent = 'center';
    a.style.height = '46px';
    a.style.padding = '0 12px';
    a.style.margin = '0 4px';
    a.style.color = '#fff';
    a.style.fontSize = '13px';
    a.style.fontWeight = '700';
    a.style.lineHeight = '46px';
    a.style.textDecoration = 'none';
    a.style.textTransform = 'uppercase';
    a.style.cursor = 'pointer';
    a.style.verticalAlign = 'top';
    a.style.boxSizing = 'border-box';

    a.addEventListener('click', function () {
      a.href = getTargetUrl();
    });

    return a;
  }

  function insertButton() {
    const existing = document.getElementById(BUTTON_ID);

    if (existing) {
      existing.href = getTargetUrl();
      return true;
    }

    const logo =
      document.querySelector('.l-top_menu-v2 .logo-container') ||
      document.querySelector('.l-top_menu-v2 a[href="/"]') ||
      document.querySelector('.l-top_menu-v2 .logo') ||
      document.querySelector('.l-top_menu .inner > a:first-child') ||
      document.querySelector('a[href="/"]');

    if (!logo || !logo.parentNode) return false;

    logo.insertAdjacentElement('afterend', makeButton());
    return true;
  }

  function boot() {
    insertButton();

    const observer = new MutationObserver(() => {
      insertButton();
    });

    observer.observe(document.documentElement, {
      childList: true,
      subtree: true
    });
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', boot);
  } else {
    boot();
  }
})();