Coomer Card Resize

Resize card list and add margin

Устаревшая версия за 27.02.2025. Перейдите к последней версии.

Чтобы установить этот скрипт, вы сначала должны установить расширение браузера, например Tampermonkey, Greasemonkey или Violentmonkey.

Для установки этого скрипта вам необходимо установить расширение, такое как Tampermonkey.

Чтобы установить этот скрипт, вы сначала должны установить расширение браузера, например Tampermonkey или Violentmonkey.

Чтобы установить этот скрипт, вы сначала должны установить расширение браузера, например Tampermonkey или Userscripts.

Чтобы установить этот скрипт, сначала вы должны установить расширение браузера, например Tampermonkey.

Чтобы установить этот скрипт, вы должны установить расширение — менеджер скриптов.

(у меня уже есть менеджер скриптов, дайте мне установить скрипт!)

Чтобы установить этот стиль, сначала вы должны установить расширение браузера, например Stylus.

Чтобы установить этот стиль, сначала вы должны установить расширение браузера, например Stylus.

Чтобы установить этот стиль, сначала вы должны установить расширение браузера, например Stylus.

Чтобы установить этот стиль, сначала вы должны установить расширение — менеджер стилей.

Чтобы установить этот стиль, сначала вы должны установить расширение — менеджер стилей.

Чтобы установить этот стиль, сначала вы должны установить расширение — менеджер стилей.

(у меня уже есть менеджер стилей, дайте мне установить скрипт!)

// ==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);
  });
})();