relief-ticket.jp 自動更新ユーザースクリプト

relief-ticket-watch.user.js

// ==UserScript==
// @name         チケットリリーフ自動更新
// @namespace    https://github.com/kmizu
// @version      1.0
// @description  relief-ticket.jp を自動更新します（スクロール位置を保持）
// @match        https://relief-ticket.jp/*
// @grant        none
// ==/UserScript==

(function () {
  "use strict";

  const STORAGE_KEY = "_ticket_watch";
  const saved = JSON.parse(sessionStorage.getItem(STORAGE_KEY) || "null");

  // --- Restore scroll position from previous reload ---
  if (saved && saved.active) {
    window.scrollTo(0, saved.scrollY || 0);
  }

  // --- Inject floating control panel ---
  const el = document.createElement("div");
  el.id = "_tw_root";
  el.innerHTML = `
    <style>
      #_tw_panel {
        position: fixed; bottom: 1rem; right: 1rem; z-index: 99999;
        background: #171412; color: #fff; border-radius: 10px;
        padding: 1rem 1.2rem; font-family: system-ui, sans-serif;
        font-size: 14px; box-shadow: 0 6px 32px rgba(0,0,0,.35);
        min-width: 220px; line-height: 1.6;
      }
      #_tw_panel b { font-size: 15px; }
      #_tw_panel input {
        width: 4.5rem; padding: .3rem .5rem; border-radius: 5px;
        border: 1px solid #555; background: #2a2a2a; color: #fff;
        font: inherit; text-align: center;
      }
      #_tw_panel button {
        padding: .4rem .9rem; border: none; border-radius: 5px;
        font: inherit; font-weight: 700; cursor: pointer;
      }
      #_tw_start { background: #b42318; color: #fff; }
      #_tw_stop  { background: #444; color: #fff; }
      #_tw_count { font-size: 2rem; font-weight: 800; font-variant-numeric: tabular-nums; }
      #_tw_info  { font-size: 12px; color: #aaa; }
    </style>
    <div id="_tw_panel">
      <b>自動更新</b>
      <div style="margin:.6rem 0">
        <label>間隔 <input id="_tw_sec" type="number" min="1" max="300" value="${saved ? saved.interval : 5}"> 秒</label>
      </div>
      <div style="display:flex;gap:.5rem;margin-bottom:.6rem">
        <button id="_tw_start">開始</button>
        <button id="_tw_stop">停止</button>
      </div>
      <div id="_tw_count"></div>
      <div id="_tw_info">停止中</div>
    </div>`;
  document.body.appendChild(el);

  const secInput = document.getElementById("_tw_sec");
  const countEl = document.getElementById("_tw_count");
  const infoEl = document.getElementById("_tw_info");

  let timer = null;
  let remaining = 0;
  let reloads = saved ? saved.reloads : 0;

  function stop(msg) {
    if (timer) clearInterval(timer);
    timer = null;
    sessionStorage.removeItem(STORAGE_KEY);
    countEl.textContent = "";
    infoEl.textContent = msg || "停止中";
  }

  function start(sec) {
    stop();
    remaining = sec;
    countEl.textContent = remaining;
    infoEl.textContent = reloads
      ? `確認中（${reloads}回更新済み）`
      : "確認中";
    timer = setInterval(() => {
      remaining -= 1;
      countEl.textContent = Math.max(0, remaining);
      if (remaining <= 0) {
        clearInterval(timer);
        sessionStorage.setItem(
          STORAGE_KEY,
          JSON.stringify({
            active: true,
            interval: sec,
            scrollY: window.scrollY,
            reloads: reloads + 1,
          })
        );
        location.reload();
      }
    }, 1000);
  }

  document.getElementById("_tw_start").addEventListener("click", () => {
    const sec = Math.max(1, Math.min(300, parseInt(secInput.value) || 5));
    secInput.value = sec;
    reloads = 0;
    start(sec);
  });

  document.getElementById("_tw_stop").addEventListener("click", () => stop("停止しました"));

  // Auto-resume after reload
  if (saved && saved.active) {
    start(saved.interval);
  }
})();