Open in MDBList button for IMDB (Userscript)

imdb-to-mdblist.js

// ==UserScript==
// @name         IMDB → MDBList
// @namespace    https://mdblist.com/
// @version      1.0
// @description  Adds an "Open in MDBList" button to IMDB title pages
// @author       cgarst
// @match        https://www.imdb.com/title/tt*
// @grant        none
// ==/UserScript==

(function () {
  'use strict';

  function getImdbId() {
    const match = window.location.pathname.match(/\/title\/(tt\d+)/);
    return match ? match[1] : null;
  }

  function getType() {
    try {
      const schema = JSON.parse(
        document.querySelector('script[type="application/ld+json"]').textContent
      );
      const t = schema['@type'];
      return (t && t.startsWith('TV') && t !== 'TVMovie') ? 'show' : 'movie';
    } catch (e) {
      return 'movie';
    }
  }

  function addButton() {
    if (document.querySelector('.mdblist-button-wrapper')) return;

    const imdbId = getImdbId();
    if (!imdbId) return;

    const titleSpan = document.querySelector('.hero__primary-text');
    if (!titleSpan) return;

    const type = getType();
    const section = type === 'show' ? 'show' : 'movie';
    const mdbUrl = 'https://mdblist.com/' + section + '/' + imdbId;

    const wrapper = document.createElement('span');
    wrapper.className = 'mdblist-button-wrapper';
    wrapper.style.cssText = 'display:inline-flex;align-items:center;margin-left:10px;vertical-align:middle;';

    const btn = document.createElement('a');
    btn.href = mdbUrl;
    btn.target = '_blank';
    btn.rel = 'noopener noreferrer';
    btn.title = 'Open ' + imdbId + ' in MDBList (' + section + ')';
    // Use IMDB's own button classes so it inherits their theme automatically
    btn.className = 'ipc-btn ipc-btn--no-padding ipc-btn--center-align-content ipc-btn--large-height ipc-btn--core-baseAlt ipc-btn--theme-baseAlt ipc-btn--media-radius ipc-btn--on-onBase ipc-secondary-button';
    btn.style.cssText = 'text-decoration:none;padding:0 12px;';

    const btnText = document.createElement('span');
    btnText.className = 'ipc-btn__text';
    btnText.textContent = 'MDBList';

    btn.appendChild(btnText);
    wrapper.appendChild(btn);
    titleSpan.parentNode.insertBefore(wrapper, titleSpan.nextSibling);
  }

  const observer = new MutationObserver(() => addButton());
  observer.observe(document.body, { childList: true, subtree: true });

  document.addEventListener('DOMContentLoaded', addButton);
  addButton();
})();