Tokyo-Motion progress thumbnail viewer

Show progress thumbnail image on Tokyo-Motion video pages

K instalaci tototo skriptu si budete muset nainstalovat rozšíření jako Tampermonkey, Greasemonkey nebo Violentmonkey.

You will need to install an extension such as Tampermonkey to install this script.

K instalaci tohoto skriptu si budete muset nainstalovat rozšíření jako Tampermonkey nebo Violentmonkey.

K instalaci tohoto skriptu si budete muset nainstalovat rozšíření jako Tampermonkey nebo Userscripts.

You will need to install an extension such as Tampermonkey to install this script.

K instalaci tohoto skriptu si budete muset nainstalovat manažer uživatelských skriptů.

(Už mám manažer uživatelských skriptů, nechte mě ho nainstalovat!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(Už mám manažer uživatelských stylů, nechte mě ho nainstalovat!)

// ==UserScript==
// @name         Tokyo-Motion progress thumbnail viewer
// @namespace    tokyo-motion-progressthumb
// @version      1.0
// @description  Show progress thumbnail image on Tokyo-Motion video pages
// @match        https://www.tokyomotion.net/*
// @grant        none
// @license      MIT 
// ==/UserScript==

(function () {
  'use strict';

  // URLから動画IDを抽出
  const match = location.pathname.match(/\/([0-9]{1,})\/?/);
  if (!match) return;

  const id = match[1];

  // 上位ディレクトリ計算(3桁以下にも対応)
  const baseDir = id.length > 3 ? id.slice(0, -3) : '0';

  // 画像URL生成
  const imgUrl =
    `https://cdn.tokyo-motion.net/media/videos/vjsslides/${baseDir}/${id}_progressthumb.jpg`;

  // img要素作成
  const img = document.createElement('img');
  img.src = imgUrl;
  img.alt = 'progress thumbnail';
  img.style.maxWidth = '100%';
  img.style.display = 'block';
  img.style.margin = '10px auto';
  img.style.border = '1px solid #666';

  // 読み込み失敗時は何もしない
  img.onerror = () => img.remove();

  // ページ先頭に挿入
  document.body.prepend(img);
})();