Twitter image viewing enhancement

Make Twitter photo viewing more humane

Verzia zo dňa 17.09.2020. Pozri najnovšiu verziu.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey, Greasemonkey alebo Violentmonkey.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey, % alebo Violentmonkey.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey, % alebo Violentmonkey.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey alebo Userscripts.

Na inštaláciu tohto skriptu je potrebné nainštalovať rozšírenie, ako napríklad Tampermonkey.

Na inštaláciu tohto skriptu je potrebné nainštalovať rozšírenie správcu používateľských skriptov.

(Už mám správcu používateľských skriptov, nechajte ma ho nainštalovať!)

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie, ako napríklad Stylus.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie, ako napríklad Stylus.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie, ako napríklad Stylus.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie správcu používateľských štýlov.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie správcu používateľských štýlov.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie správcu používateľských štýlov.

(Už mám správcu používateľských štýlov, nechajte ma ho nainštalovať!)

// ==UserScript==
// @name         Twitter image viewing enhancement
// @name:zh-CN   Twitter 图片查看增强
// @name:zh-TW   Twitter 圖像查看增強
// @icon         https://twitter.com/favicon.ico
// @namespace    https://moe.best/
// @version      1.0.0
// @description        Make Twitter photo viewing more humane
// @description:zh-CN  让推特图片浏览更加人性化
// @description:zh-TW  讓 Twitter 照片瀏覽更人性化
// @author       Jindai Kirin
// @include      https://twitter.com/*
// @license      MIT
// @grant        GM_getValue
// @grant        GM_setValue
// @grant        GM_registerMenuCommand
// @grant        GM_openInTab
// @grant        GM_addStyle
// @grant        GM_getResourceText
// @run-at       document-end
// @require      https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js
// @require      https://cdn.jsdelivr.net/npm/[email protected]/jquery.mousewheel.min.js
// @require      https://cdn.jsdelivr.net/npm/[email protected]/dist/snackbar.min.js
// @resource     snackbarcss https://cdn.jsdelivr.net/npm/[email protected]/dist/snackbar.min.css
// ==/UserScript==

// 注意 NOTICE
// v1.0.0 是一次实验性的重大更新,你将不再需要设置 aria-label,并且支持所有语言。如果某一天脚本突然无法正常工作,请于脚本页面反馈,或退回至 v0.6.3。
// v1.0.0 is an important experimental update, you will no longer need to set up aria-labels and it support all languages. If one day the script not work, please feedback on the script homepage or use v0.6.3.

(() => {
    'use strict';

    const labels = {};
    try {
        const kv = {
            af8fa2ad: 'close',
            c4d53ba2: 'prev',
            d70740d9: 'next',
        };
        webpackJsonp[2][1][webpackJsonp[2][2][0][0]](null, null, () => ({
            _register: () => (k, v) => {
                if (k in kv) labels[kv[k]] = v;
            },
        }));
    } catch (error) {}

    const getBtnByLabel = label => $(`div[aria-labelledby="modal-header"] div[aria-label="${label}"]`);
    const clickBtn = name => {
        const $btn = getBtnByLabel(labels[name]);
        if ($btn.length) {
            $btn.click();
            return true;
        }
        return false;
    };

    const closeImgView = () => clickBtn('close');
    const prevImg = () => clickBtn('prev');
    const nextImg = () => clickBtn('next');

    $(document).mousewheel(({ deltaY, target: { tagName, baseURI } }) => {
        if (tagName == 'IMG' && /\/photo\//.test(baseURI)) {
            switch (deltaY) {
                case 1:
                    prevImg();
                    break;
                case -1:
                    nextImg();
                    break;
            }
        }
    });

    (() => {
        let x = 0;
        let y = 0;
        $(document).mousedown(({ clientX, clientY }) => {
            x = clientX;
            y = clientY;
        });
        $(document).mouseup(({ button, clientX, clientY, target: { tagName, baseURI } }) => {
            if (button !== 0 || !(tagName == 'IMG' && /\/photo\//.test(baseURI))) return;
            const [sx, sy] = [clientX - x, clientY - y].map(Math.abs);
            const mx = clientX - x;
            if (sx <= 10 && sy <= 10) closeImgView();
            if (sy <= sx) {
                if (mx > 0) prevImg();
                else if (mx < 0) nextImg();
            }
        });
    })();
})();