e621.net JSONボタン

e621.net JSONボタン


e621.netとe6ai.netウェブサイトのダウンロードボタンの横に新しいボタンを追加し、投稿のJSONデータに簡単にアクセスできるようにします。クリックすると、投稿のURLに".json"を追加して構築されたURLにユーザーを誘導します。スクリプトは、ページレイアウトに応じて、ダウンロードボタンの後ろか、投稿オプションメニューの新しいリストアイテムとして、ボタンを動的にページに挿入します。


// ==UserScript==
// @name e621.net JSONボタン
// @namespace https://cringe.live
// @version 1.0
// @description e621.netのダウンロードボタンの横にJSONボタンを追加します
// @author _ka_de
// @match https://e621.net/*
// @match https://e6ai.net/*
// @grant none
// ==/UserScript==

(function () {
  "use strict";

  function constructJSONUrl() {
    // 現在のURLを取得
    var currentUrl = window.location.href;
    // URLから投稿IDを抽出
    var postId = currentUrl.match(
      /^https?:\/\/(?:e621\.net|e6ai\.net)\/posts\/(\d+)/,
    )[1];
    // ホスト名を確認
    var hostname = window.location.hostname;
    // ホスト名に基づいてJSON URLを構築
    var jsonUrl = "https://" + hostname + "/posts/" + postId + ".json";
    return jsonUrl;
  }

  function createJSONButton() {
    // 新しいボタン要素を作成
    var jsonButton = document.createElement("a");
    // ボタンの属性を設定
    jsonButton.setAttribute("class", "button btn-info");
    var jsonUrl = constructJSONUrl();
    // ボタンのhref属性にJSON URLを設定
    jsonButton.setAttribute("href", jsonUrl);
    // ボタンの内部HTMLを設定
    jsonButton.innerHTML =
      '<i class="fa-solid fa-angle-double-right"></i><span>JSON</span>';

    // ボタンを挿入したいコンテナを探す
    var container = document.querySelector("#post-options > li:last-child");

    // #image-extra-controls要素が存在するか確認
    if (document.getElementById("image-extra-controls")) {
      // ダウンロードボタンの後にボタンを挿入
      container = document.getElementById("image-download-link");
      container.insertBefore(jsonButton, container.children[0].nextSibling);
    } else {
      // #post-optionsの最後のli要素の後にボタンを挿入
      container.parentNode.insertBefore(jsonButton, container.nextSibling);
    }
  }

  // JSONボタンを作成する関数を実行
  createJSONButton();
})();