Coomer Card Resize

Resize card list and add margin

Per 27-02-2025. Zie de nieuwste versie.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey, Greasemonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Userscripts.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een gebruikersscriptbeheerder nodig.

(Ik heb al een user script manager, laat me het downloaden!)

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

(Ik heb al een beheerder - laat me doorgaan met de installatie!)

// ==UserScript==
// @name        Coomer Card Resize
// @namespace   Violentmonkey Scripts
// @match       https://coomer.su/*
// @version     1.2
// @author      Nimby345
// @description Resize card list and add margin
// @grant       none
// ==/UserScript==

(function () {
  "use strict";

  // Regex to match allowed URLs
  const urlPattern = /^https:\/\/coomer\.su\/(?:fansly|onlyfans)\/user\/[^/?]+(?:\?o=\d+)?$|^https:\/\/coomer\.su\/posts\/popular(?:.*)?$/;

  const cardSize = 400; // Card size in px, original 400
  const cardGap = 0.25; // Gap in em, original 3.3

  function shouldUpdate() {
    return urlPattern.test(window.location.href);
  }

  function updateCardSize() {
    const cardList = document.querySelector(".card-list__items");
    if (cardList) {
      cardList.style.setProperty("--card-size", cardSize + "px", "important"); // Sets card-size
      cardList.style.gap = cardGap + "em"; // Adds space between the images
      //console.log("Card size and margin updated!");
    } //else {
      //console.log("Card list not found, retrying...");
      //setTimeout(updateCardSize, 500); // Retry if card list not found -> Now checks for URL changes further down in the script instead
    //}
  }
   
  // Function to observe page changes
  function observeChanges() {
    const observer = new MutationObserver((mutations) => {
      let updated = false;

      mutations.forEach((mutation) => {
        if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
          //console.log(New content detected");

          // Check if the URL matches the allowed pattern before updating
          if (shouldUpdate()) {
            updateCardSize();
            updated = true;
          }
        }
      });

      // if (!updated) {
        //console.log("New page detected, but no content updates");
      //}
    });

    observer.observe(document.body, { childList: true, subtree: true });
    //console.log("Observer attached");
  }
  // Function to run URL check, card size update and observer
  function init() {
    if (shouldUpdate()) {
      updateCardSize();
      observeChanges();
    } //else {
      //console.log("Script not applied, URL doesn't match allowed pattern: " + window.location.href);
    //}
  }

  // Listen for page navigation
  window.addEventListener('popstate', () => {
    init();
  });

  // Check the URL when the script is first loaded
  window.addEventListener("load", () => {
    init();
    // Check for URL changes every 500 ms
    setInterval(() => {
      if (shouldUpdate()) {
        updateCardSize(); // Update if URL is in the allowed pattern
      }
    }, 500);
  });
})();