Sleazy Fork is available in English.

WhoresHub Fullwidth Scroll/Grid Gallery

fixes side scroll snapping to the current picture and adds a gallery view toggle

Terá de instalar uma extensão como Tampermonkey, Greasemonkey ou Violentmonkey para instalar este script.

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

Terá de instalar uma extensão como Tampermonkey ou Violentmonkey para instalar este script.

Terá de instalar uma extensão como Tampermonkey ou Userscripts para instalar este script.

Terá de instalar uma extensão como Tampermonkey para instalar este script.

Terá de instalar uma extensão de gestão de scripts de utilizador para instalar este script.

(Já tenho um gestor de scripts de utilizador, deixe-me instalá-lo!)

Terá de instalar uma extensão como Stylus para instalar este estilo.

Terá de instalar uma extensão como Stylus para instalar este estilo.

Terá de instalar uma extensão como Stylus para instalar este estilo.

Terá de instalar uma extensão de gestão de estilos de utilizador para instalar este estilo.

Terá de instalar uma extensão de gestão de estilos de utilizador para instalar este estilo.

Terá de instalar uma extensão de gestão de estilos de utilizador para instalar este estilo.

(Já tenho um gestor de estilos de utilizador, deixe-me instalá-lo!)

// ==UserScript==
// @name         WhoresHub Fullwidth Scroll/Grid Gallery
// @namespace    Violentmonkey Scripts
// @match        https://www.whoreshub.com/albums/*
// @version      1.2
// @author       Nimby345
// @description  fixes side scroll snapping to the current picture and adds a gallery view toggle
// @grant        none
// @license MIT
// ==/UserScript==

    (function() {
        'use strict';

        function enableGalleryToggle() {
            const galleryThumbs = document.querySelector('.gallery-thumbs');
            const thumbsWrapper = galleryThumbs?.querySelector('.swiper-wrapper');
            if (!galleryThumbs || !thumbsWrapper) return;

            // --- Wrap gallery in scrollable box ---
            if (!document.querySelector('#thumbsScrollWrapper')) {
                const wrapper = document.createElement('div');
                wrapper.id = 'thumbsScrollWrapper';
                wrapper.style.maxHeight = '400px'; // adjust height as needed
                wrapper.style.overflowY = 'auto';
                wrapper.style.overflowX = 'hidden';
                wrapper.style.padding = '0 5px';
                galleryThumbs.parentNode.insertBefore(wrapper, galleryThumbs);
                wrapper.appendChild(galleryThumbs);
            }

            const scrollWrapper = document.querySelector('#thumbsScrollWrapper');

            // --- Inject full-width CSS ---
            const style = document.createElement('style');
            style.textContent = `
                .container { max-width: 100% !important; padding: 0 !important; }
                .gallery-top, .gallery-thumbs { width: 100% !important; max-width: 100% !important; margin: 0 !important; }
                .swiper-wrapper { width: 100% !important; }
                .swiper-slide img { width: 100% !important; object-fit: contain; }
            `;
            document.head.appendChild(style);

            // Prevent duplicate toggle button
            if (document.querySelector('#galleryToggleBtn')) return;

            // --- Create toggle button ---
            const toggleBtn = document.createElement('button');
            toggleBtn.id = 'galleryToggleBtn';
            toggleBtn.textContent = 'Toggle Grid View';
            toggleBtn.style.position = 'fixed';
            toggleBtn.style.top = '50%';
            toggleBtn.style.right = '10px';
            toggleBtn.style.zIndex = 9999;
            toggleBtn.style.padding = '6px 12px';
            toggleBtn.style.background = '#000';
            toggleBtn.style.color = '#fff';
            toggleBtn.style.border = 'none';
            toggleBtn.style.cursor = 'pointer';
            toggleBtn.style.transform = 'translateY(-50%)';
            document.body.appendChild(toggleBtn);

            let isGrid = false;

            toggleBtn.addEventListener('click', () => {
                isGrid = !isGrid;

                if (isGrid) {
                    // --- Grid mode ---
                    thumbsWrapper.style.display = 'grid';
                    thumbsWrapper.style.gridTemplateColumns = 'repeat(auto-fill, minmax(150px, 1fr))';
                    thumbsWrapper.style.gridGap = '5px';
                    thumbsWrapper.style.transform = 'none';
                    thumbsWrapper.querySelectorAll('.swiper-slide').forEach(slide => {
                        slide.style.width = '100%';
                        slide.style.margin = '0';
                    });
                    // Enable scroll inside scrollWrapper
                    scrollWrapper.style.overflowY = 'auto';
                    scrollWrapper.style.overflowX = 'hidden';
                } else {
                    // --- Side-scroll mode ---
                    thumbsWrapper.style.display = '';
                    thumbsWrapper.style.gridTemplateColumns = '';
                    thumbsWrapper.style.gridGap = '';
                    thumbsWrapper.style.transform = '';
                    thumbsWrapper.querySelectorAll('.swiper-slide').forEach(slide => {
                        slide.style.width = '';
                        slide.style.margin = '';

                    });
                    scrollWrapper.style.overflowY = '';
                    scrollWrapper.style.overflowX = '';
                                    // Re-enable free scrolling without snapping
                if (galleryThumbs.swiper) {
                    galleryThumbs.swiper.params.freeMode = true;
                    galleryThumbs.swiper.update();
                }
                }
            });
        }

        // --- Wait for gallery to load ---
        const observer = new MutationObserver(() => {
            if (document.querySelector('.gallery-thumbs .swiper-slide img')) {
                enableGalleryToggle();
                observer.disconnect();
            }
        });
        observer.observe(document.body, { childList: true, subtree: true });

    })();