Skip to content

v1.1.0

Latest

Choose a tag to compare

@m3chwj99 m3chwj99 released this 27 May 23:26
· 3 commits to main since this release
e7b09dc
// ==UserScript==
// @name        Comix Enhanced Zoom
// @namespace   https://github.com/m3chwj99/Comix-Enhanced-Zoom
// @version     1.1.0
//
// @match       https://comix.to/title/*
// @grant       none
//
// @author      m3chwj99
// @description Enable true browser zoom support on Comix.to manga pages.
// @license     MIT
// @updateURL   https://raw.githubusercontent.com/m3chwj99/Comix-Enhanced-Zoom/main/comix-enhanced-zoom.user.js
// @downloadURL https://raw.githubusercontent.com/m3chwj99/Comix-Enhanced-Zoom/main/comix-enhanced-zoom.user.js
// ==/UserScript==

(function () {
    'use strict';

    const STORAGE_KEY = 'comix_zoom_mode_enabled';

    function applyZoomMode(enabled) {
        let style = document.querySelector('#zoom-reading-style');

        if (!style) {
            style = document.createElement('style');
            style.id = 'zoom-reading-style';

            document.head.appendChild(style);
        }

        style.textContent = enabled
            ? `
                .rpage-page__img {
                    object-fit: unset !important;
                    width: unset !important;
                    height: unset !important;
                    max-width: unset !important;
                    max-height: unset !important;
                }

                .swiper.rpage-swiper.swiper-initialized.swiper-horizontal {
                    overflow: auto !important;
                }
            `
            : '';
    }

    function init(panel) {

        if (panel.querySelector('.zoom-reading-toggle')) {
            return;
        }

        panel.insertAdjacentHTML('beforeend', `
            <div class="zoom-reading-wrapper" style="margin-top:10px;">
                <button
                    class="zoom-reading-toggle"
                    style="
                        padding:8px 12px;
                        border:none;
                        border-radius:8px;
                        cursor:pointer;
                        font-weight:bold;
                        color:white;
                        width:100%;
                        border-radius:0;
                    "
                >
                </button>
            </div>
        `);

        const button = panel.querySelector('.zoom-reading-toggle');

        let enabled = localStorage.getItem(STORAGE_KEY) === 'true';

        function refresh() {

            button.textContent = enabled
                ? '🔍 Zoom : ON'
                : '🔍 Zoom : OFF';

            button.style.background = enabled
                ? '#30474b'
                : '#323a3e';

            button.style.color = enabled
                ? '#66e8fa'
                : '#4e5559';

            applyZoomMode(enabled);
        }

        button.addEventListener('click', () => {

            enabled = !enabled;

            localStorage.setItem(STORAGE_KEY, enabled);

            refresh();
        });

        refresh();
    }

    const interval = setInterval(() => {

        const panel = document.querySelector('.rpage-settings__panel');

        if (!panel) {
            return;
        }

        clearInterval(interval);

        init(panel);

    }, 500);

})();

Full Changelog: https://github.com/m3chwj99/Comix-Enhanced-Zoom/commits/v1.1.0