☰

Motherless.com Improved

Reveal all related galleries to video at desktop

As of 2024-04-19. See the latest version.

// ==UserScript==
// @name         Motherless.com Improved
// @namespace    http://tampermonkey.net/
// @license MIT
// @version      0.1.1
// @description  Reveal all related galleries to video at desktop
// @author       smartacephale
// @match        https://motherless.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=motherless.com
// @grant        none
// ==/UserScript==

//====================================================================================================

function $(x, e = document.body) { return e.querySelector(x); }
function $$(x, e = document.body) { return e.querySelectorAll(x); }

function parseDOM(html) {
  const parsed = new DOMParser().parseFromString(html, 'text/html').body;
  return parsed.children.length > 1 ? parsed : parsed.firstElementChild;
}

const MOBILE_UA = 'Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Mobile Safari/537.36';

function fetchCustomUA(url, ua = MOBILE_UA) {
  const headers = new Headers({ "User-Agent": ua });
  return fetch(url, { headers });
}

function fetchHtml(url) { return fetchCustomUA(url).then((r) => r.text()).then((h) => parseDOM(h)); }

//====================================================================================================

const GALLERIES_TAG = '.media-related-galleries';
const GALLERY_TAG = '.gallery-container';
const GALLERY_MOB_TAG = '.ml-gallery-thumb';
const GROUP_TAG = '.group-minibio';

function displayAll() {
  // biome-ignore lint/complexity/noForEach: <explanation>
  $$(GROUP_TAG).forEach(e => { e.style = 'display: block !important' });
  // biome-ignore lint/complexity/noForEach: <explanation>
  $$(GALLERY_TAG).forEach(e => { e.style = 'display: block !important' });
}

function cloneAttributes(target, source) {
  // biome-ignore lint/complexity/noForEach: <explanation>
  [...source.attributes].forEach(attr => { target.setAttribute(attr.nodeName === "id" ? 'data-id' : attr.nodeName, attr.nodeValue) })
}

function replaceElementTag(e, tagName) {
  const newTagElement = document.createElement(tagName);
  newTagElement.className = e.className;
  newTagElement.href = e.href;
  newTagElement.style = e.style;
  cloneAttributes(newTagElement, e);
  newTagElement.innerHTML = e.innerHTML;
  e.parentNode.replaceChild(newTagElement, e);
}

function mobileGalleryToDesktop(e) {
  e.firstElementChild.nextElementSibling.nextElementSibling.remove();
  e.firstElementChild.appendChild(e.firstElementChild.nextElementSibling);
  e.className = 'thumb-container gallery-container';
  e.firstElementChild.className = 'desktop-thumb image medium';
  e.firstElementChild.firstElementChild.nextElementSibling.className = 'gallery-captions';
  replaceElementTag(e.firstElementChild.firstElementChild, 'a');
}

async function desktopAddMobGalleries() {
  const galleries = $(GALLERIES_TAG);
  if (galleries != null) {
    const galleriesContainer = galleries.firstElementChild.nextElementSibling.firstElementChild;
    const galleriesCount = galleries.querySelectorAll(GALLERY_TAG).length;
    const mobDom = await fetchHtml(window.location.href);
    const mobGalleries = $$(GALLERY_MOB_TAG, mobDom);
    for (const [i, x] of mobGalleries.entries()) {
      if (i > galleriesCount - 1) {
        mobileGalleryToDesktop(x);
        galleriesContainer.appendChild(x);
      }
    }
    displayAll();
  }
}

//====================================================================================================

(async () => {
  'use strict';
  await desktopAddMobGalleries();
})();