qt-kaneko / Shikiplayer

Extension/script that adds Kodik player to Shikimori website.
https://t.me/shikiplayer
GNU Affero General Public License v3.0
21 stars 2 forks source link

Create a `script` branch and add script version of this extension #1

Closed neverlane closed 2 years ago

neverlane commented 2 years ago

shikiplayer.js code works in tampermonkey(for chrome) make a script version for tampermonkey in script branch image for add script version in tampermonkey user can use link like https://raw.githubusercontent.com/qt-kaneko/Shikiplayer/script/shikiplayer.user.js

// ==UserScript==
// @name         ShikiPlayer (script version)
// @version      1.0
// @description  Tampermonkey script that adds Kodik player to shikimori.one website.
// @author       qt-kaneko
// @match        https://shikimori.one/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=shikimori.one
// @grant        none
// ==/UserScript==

function insertAfter(newNode, existingNode) {
  existingNode.parentNode.insertBefore(newNode, existingNode.nextSibling);
}

let lastUrl = location.href;
new MutationObserver(() => {
  const url = location.href;
  if (url !== lastUrl) {
    lastUrl = url;

    location.reload(); // Make shikimori reload f@cking page when it changes (҂`ロ´)凸
  }
}).observe(document, { subtree: true, childList: true });

const isAnimePageRegEx = /https?:\/\/shikimori.one\/animes\/[0-9-a-z]*$/;
if (isAnimePageRegEx.test(window.location.href)) {
  const idExtractorRegEx =
    /(?<=https?:\/\/shikimori.one\/animes\/z?)[0-9]*?(?=-)/;

  const id = idExtractorRegEx.exec(location.href)[0];

  const block = document.createElement("div");
  block.className = "block";

  const subheadline = document.createElement("div");
  subheadline.className = "subheadline";
  subheadline.appendChild(document.createTextNode("СМОТРЕТЬ"));
  block.appendChild(subheadline);

  const player = document.createElement("iframe");
  player.id = "player";
  player.src = `https://kodikdb.com/find-player?shikimoriID=${id}`; //&season=1&only_season=true
  player.scrolling = "no";
  player.allowFullscreen = true;
  player.onload = function () {
    player.getElementsByClassName("serial-seasons-box")[0].remove();
  };
  block.appendChild(player);

  const before = document.getElementsByClassName("b-db_entry")[0];

  insertAfter(block, before);

  window.addEventListener("resize", onResize);
  onResize();

  function onResize() {
    player.width = player.parentNode.clientWidth;
    player.height = (9 * player.width) / 16;
  }
}
qt-kaneko commented 2 years ago

All done. Thanks for suggestion.