TabelogSmokingAlert.user.js

// ==UserScript==
// @name           Tabelog Smoking Alert
// @description    食べログの禁煙・喫煙情報を目立たせる
// @author         mirka
// @include        https://tabelog.com/*
// @namespace      http://jaguchi.com
// @grant          GM_addStyle
// @grant          GM_log
// @version        1.3.2
// ==/UserScript==

(function () {
  const types = {
    喫煙: "#e10a17",
    分煙: "#fd9f28",
    禁煙: "#93c526",
  };

  function getLinkTarget() {
    const linkTarget = Array.from(document.querySelectorAll("th")).find((th) =>
      th.textContent?.includes("禁煙・喫煙")
    );

    if (!linkTarget) {
      GM_log("禁煙・喫煙ヘッダーが見つかりません");
      return;
    }

    linkTarget.id = linkTarget.id || "smoking-info-section";
    linkTarget.style.backgroundColor = "#ffecd0";
    GM_addStyle(`#${linkTarget.id} { scroll-margin-top: 60px; }`);

    return linkTarget;
  }

  function getSmokingString() {
    const str = getLinkTarget()
      ?.nextElementSibling?.textContent?.trim()
      .split("\n")[0]
      ?.trim();

    if (!str) {
      GM_log("禁煙・喫煙情報が見つかりません");
    }

    return str;
  }

  function getInsertionTarget() {
    const target = document.querySelector(".rdheader-rstname-wrap");

    if (!target) {
      GM_log("禁煙・喫煙情報の挿入先が見つかりません");
    }

    return target;
  }

  /**
   * @param {string | undefined} str
   * @param {Element | null} insertionTarget
   */
  function insertSmokingData(str, insertionTarget) {
    if (!str || !insertionTarget) {
      return;
    }

    const [matchedKey, alertColor] = Object.entries(types).find(([key]) =>
      str?.includes(key)
    ) ?? ["不明", "#e10a17"];

    // Create and insert alert element
    const alertId = "smoking-alert";
    const alert = document.createElement("a");

    alert.textContent = matchedKey;
    alert.style.backgroundColor = alertColor;

    alert.href = `#${getLinkTarget()?.id || ""}`;
    alert.id = alertId;
    alert.style.position = "absolute";
    alert.style.left = "-4em";
    alert.style.padding = "3px";
    alert.style.color = "#fff";

    // Insert alert element
    insertionTarget.insertBefore(alert, insertionTarget.firstChild);

    // Suppress underline on alert element hover
    GM_addStyle("a#" + alertId + ":hover { text-decoration: none }");

    GM_addStyle("html { scroll-behavior: smooth; }");
  }

  insertSmokingData(getSmokingString(), getInsertionTarget());
})();