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

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

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

    })();