Небольшая панелька для LOR

чтобы мы убедились - у тебя обновленная версия

5.3.1, если ты стал менять версию после каждого коммита.

Проверил трекер, уведомления - все то же самое. Если открыть модалку и не дождаться прогрузки, скроллится основная страница. Если секунду подождать и потом скроллить - все нормально.

А, ну еще есть очень уж постараться и попасть между элементами - строками. Надо это пофиксить. Но туда очень уж сложно попасть.

Исправил модалки. Блокирую теперь сразу, можно прокручивать без ожидания. Сделал непрозрачный фон, так что между строк больше не попасть. Проверил - у меня вроде работает.

https://vkvideo.ru/clip-236906308_456239019.

Это же уже обновленная версия? Я обновил почаса назад где то.

А ты можешь чисто ради эксперимента поставить фаерфокс и проверить? Если в нем не будет бага, я поэкспериментирую с твоим.

Это же уже обновленная версия?

Конечно.

А ты можешь чисто ради эксперимента поставить фаерфокс и проверить?

Нет, не буду, сорян. Да и забей. :)

Стоп, это что, айфон?

Нет, Андроид 13 на Redmi Note 11.

Если тебя угрозами заставляют пользоваться этим браузером, просто моргни два раза и поставь мне клоуна.

https://disk.yandex.ru/i/_xEUekU5iFqEcA

Итак, я записал видео. Как ты видишь, все прокручивается в обоих браузерах, работает во всех видах панели. На самом деле я так и не понял как работать с твоей вариацией хромиума. Отладочной консоли у нее нет. Работал наугад. Сделал что смог.

Раньше в трекере панель не была видна - это я исправил. Если в трекере не видна - это потому что твой браузер масштабироание портит. Чуть подкрути и появится. Прокрутка сайт вроде не крутит. Пробуй, смотри. Но это пи кошмар.. хм.. Не пользуйся этим браузером, если сможешь. Попробуй фаерфокс как нибудь.

Обновил код.

Забыл в шаблонах ответов так же модалку поправить. Но пока хрен с ней. Не криично, думаю пока. Если что - исправлю.

Попробуй фаерфокс как нибудь.

Аллергия с незапамятных времён. И он мне не нужен нигде и ни в каком виде.

И еще небольшое наблюдение про твой браузер - простое обновление страницы не работает. Чтобы применился скрипт точно, надо убить браузер и запустить с нуля. Я сначала понять не мог что за фигня - меняю код, а он не меняется.

А можешь вот такой скрипт адаптировать? Он может в теме найти посты по нику или посты с текстом или по тексту и по нику.

У меня есть кнопки «Мои сообщения» и «Упоминания». Я могу сделать ПКП/длительное зажатие на них - откроется модалка с вводом ника и будет перелистывание сообщений этого юзера или ответов на сообщения этого юзера. Не пойдет? ИЛи нужен еще и поиск по тексту?

Ладно, я придумал. Левый клие на эти кнопки будет при первом клике переносить к последнему сообщению, при последующих на сообщения выше по порядку. Правый или длительное зажатие откроет модалку, куда можно будет ввести ник. В этой модалке появятся сообщения этого ника или ответы на этот ник списком. Так же добавлю чекбокс - подсчечивать сообщения в теме.

Про поиск подумаю отдельно.

Если что не так, отпишись отделно.

Уф.. не самая тривиальная задача оказалась, на удивление. Я потратил времени больше, чем на основную панель. В какой то момент я словил даже кернел паник впервые за 20 лет от китайского плеера и потерял кучу кода.. Кстати, красивенько сделали. Пингвинчик, лаконичная надпись, прикольно. Ну да ладно.

Итак, я не стал менять старый код, сделал новый модуль: NSLorNavPlus.user.js

Подключай его новым скриптом. Если он находит основную панель - интегрируется в нее. Если не находит, просто создаст кнопку поиска - то есть его можно использовать отдельно самостоятельно.

При интеграции в панель, меняется поведение кнопок «Мои сообщения» и «Упоминания». При ПКМ или длтельном зажатии ЛКМ на них можно выбрать ник и поиск будет по этому нику. В модалке список найденных для ника комментов. Можно перейти прямо там на нужный или же закрыть модалку и кликать ЛКМ по кнопке - тогда будет карусль переходов по сообщенийм от последнего к первому.

В поиске сохраняется поиск для темы. Сразу в модалке показываются результаты, точно так же - можно перейти сразу или при клике по кнопке карусель такая же переходов.

Протестируй что работает, а что не очень. Если что - отпишись что не так, что доработать. Что изменить.

Ах да, так же есть чекбокс подсветки найденного на странице.

Внезапно оказалось, что при фильтрации черного списка я добавил интересную баго-фичу. В новостях под последним комментарием подгружается лента новостей. Но она подгружалась со второй страницы. И при этом кнопка «Вниз» прокручивала до конца страницы, что было нелепо - она по сути не работала.

Исправил:

1. Кнопка «Вниз» теперь прокручивает не до конца страницы, а до последнего комментария, если эти самые комментарии есть. Если комментариев нет - до конца страницы.

2. Под темой новости прогружаются с первой страницы. Фича оказалсь интересной - мне понраивлось, решил оставить, но исправил.

3. В настройках добавлен чекбокс, отключающий подгрузку ленты под темой - кому если фича не нравится.

Добавил весьма спорную опцию:

https://ns.fiber-gate.ru/uploads/images/img_1780330219737_5f2490fe.png

Подсвечивает модераторов. Кэширует, чтобы не было нагрузки на сервер лишней.

https://ns.fiber-gate.ru/uploads/images/img_1780330191619_d18315bb.png

Ну а вдруг кому надо.

Теперь при включении настройки модераторы в теме будут подсвечиваться брутальной радужной рамкой. И бейдж возле ника.

модераторы в теме будут подсвечиваться брутальной радужной рамкой.

У меня это только в новостях/галерее работает. Helium + Tampermonkey.

localStorage.removeItem('lor_mod_cache');
location.reload();

Нажми ка F12 и выполни это в консоли разработчика. Обнови страницу и скажи результат.

Вот умеешь ты найти нестандартный браузер. Как установить в него file:///home/diver/Загрузки/tm/tampermonkey_legacy.crx?

Или как вообще установить правильно? А то я минут 10 копаюсь, нихрена не понял.

А, кажется понял.

Или как вообще установить правильно?

С Google Play Chrome Store или как он там. :)

Не, я десктопный поставил. Он ругается, что надо хромиум поставить. Я же с браузером не ошибся?

Helium
Версия 0.12.5.1 (официальная сборка, Chromium 148.0.7778.215) appimage (64 бит)

Тестирую этот короче.

Я же с браузером не ошибся?

Да. А я сейчас и в Falkon попробую.

https://ns.fiber-gate.ru/uploads/images/img_1780334473871_97c5cbfe.png

В свежем гелиуме все работает. Как в новостях, так и в комментариях. Уточни где у тебя не работает. Платформа, версия.

Учти, обновить надо было два файла - основную панель NSLorPanel.user.js и скрипт фильтрации NSLorNewsFilter.user.js

Тормознутенький кстати браузер в плане скриптов. На сайтах работает так же быстро, как фф, а вот панелька подгружается чуть дольше.

и скрипт фильтрации NSLorNewsFilter.user.js

Ну вот, сразу бы так уточнил! :)
Корректоров бы тоже не обделять выделением! ;)

Обновил NSLorNewsFilter.user.js. Вроде как поправил кэширование модераторов, а то на некоторых страницах не отображались.

Ага, спасибо. Но пользоваться не буду – слишком модномолодёжная расцветка. :)

Специально для тебя обновил на более строгий старперский стиль:

https://ns.fiber-gate.ru/uploads/images/img_1780336394835_28ed47c1.png

Сойдет? Скажи как надо. Но как по мне - норм.

Вот, если что, функция для стиля:

function injectModStyles() {
    if (state.modStylesInjected) return;
    state.modStylesInjected = true;
    var style = document.createElement('style');
    style.id = 'lor-mod-highlight-styles';
    style.textContent = `
        .lor-mod-message {
            border-left: 5px solid #4a90d9 !important;
            background: none !important;
        }
        .lor-mod-badge {
            display: inline-flex;
            align-items: center;
            gap: 4px;
            margin-left: 8px;
            padding: 2px 10px;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
            color: white;
            font-size: 10px;
            font-weight: 900;
            letter-spacing: 1px;
            text-transform: uppercase;
            border-radius: 12px;
            box-shadow: 0 2px 8px rgba(102, 126, 234, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.3);
            text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
            vertical-align: middle;
            animation: lor-mod-pulse 2.5s ease-in-out infinite;
            user-select: none;
            cursor: help;
        }
        .lor-mod-badge::before {
            content: "🛡️";
            font-size: 11px;
            filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3));
        }
        .lor-mod-badge::after {
            content: "MOD";
        }
        @keyframes lor-mod-pulse {
            0%, 100% { transform: scale(1); box-shadow: 0 2px 8px rgba(102, 126, 234, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.3); }
            50% { transform: scale(1.05); box-shadow: 0 4px 14px rgba(102, 126, 234, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.4); }
        }
    `;
    document.head.appendChild(style);
}

Можно поменять, посмотреть как лучше.

Сойдет? Скажи как надо.

Выделить в отдельные модули. Я NSLorNewsFilter вообще не пользуюсь, как и большей частью других возможностей панели.

Выделил подсветку в отдельный скрипт: NSLorModHighlighter.user.js

Он проверяет - есть ли панель. Если панель есть, подхватывает настройки. Если нету - безусловно работает без нее.

Вырезал код из NSLorNewsFilter.user.js

Здорово!
А в новостях должно работать без NSLorNewsFilter?

Обновил NSLorModHighlighter.user.js. Теперь в новостях тоже подсвечивает. И с панелью и без.

NSLorNewsFilter к модерторам вообще больше отношения не имеет. Там только черный список авторов новостей и отображение удаленных сообщений.

Лучшая тема на ЛОРе это всетаки блэк. Не понимаю почему на нее забили. Это уникальность ресурса, это сразу видимое отличие, это брутальность, контраст. Удобство.

Но, что мы видим?

Заходим на сайт:

https://ns.fiber-gate.ru/uploads/images/img_1780345481653_122e5bbe.jpg

Криво. Ладно, масштабируем:

https://ns.fiber-gate.ru/uploads/images/img_1780345529804_9b10d2ac.jpg

Ну такое.

Короче, буду потихоньку допиливать тему нормально. Ветаки я с ней 18 лет.

Пока допилил немного главную и трекер:

https://ns.fiber-gate.ru/uploads/images/img_1780345613678_b52d0ca6.jpg

https://ns.fiber-gate.ru/uploads/images/img_1780345667492_00d53b06.jpg

Придумаю как сделать удобнее, сделаю.

А то задолбало каждый раз на серое нечто переключаться, как на андроид зайдешь.

Заодно поправил трекер на мобильной панели. Теперь он работает и там.

lor-black-mobile-fix.user.js

Есть же клавиши PageUp и PageDown, End и Home на клавиатуре…

Сейчас поразмыслил, ИМХО самая удобная навигация по овтетам была бы как на имиджбордах. Еще лучше если это были бы не просто всплывающие сообщения при наведении на номера, а кликабельные, как в приложениях на телефоне, с модальными окнами. Т.е. провалился в ветку, сколько тебе надо глубоко, попутно можешь в еще одну ветку провалиться, а потом назад или просто закрываешь вконце модальное окно и все. Криво описал, но, думаю, тем кто пользовался на телефоне клиентами для имиджборд будет понятно.

Если рука на «мыши», то удобнее скроллить ей. Да и на гаджетах тоже.

Отрывать руку от клавиатуры - или мышки - такое себе. Они неудобно расположены.

Тебе сделать ветки обсуждений в модалках? Это не сложно.

Да можно и не в модалках. А хорошая идея. Сделаю и модалки и так.

Согласен, на вкус и цвет. У меня сейчас клавиатура 4Teck fstyler fk11, у нее клавиши навигации с права на краю вертикально расположены, а мышь прямо рядом, можно даже не отрывая руки от мыши большим пальцем правой руки жмакать на эти клавиши.

Ради одного меня не стоит, к тому же я не такой частый посетитель лора. Если найдутся те кому это интересно, вот тогда может и стоит, какое - то значительное количество. В любом случае, спасибо тебе за труд во благо общества!

Тогда я бы выбрал мышь с доп клавишами и забиндил на них навигацию. Тянуть курсор к кнопке и целиться по ней для навигации ИМХО такой себе вариант. Еще можно трекпад использовать с жестами. Или курсором жесты делать. Помню были решения такие что если сильно\быстро скрольнуть колесиком мыши – оно понимало что нужно с ускорением скрольнуть далеко.

Короче, накидал я тут быстренько: NSLorChain.user.js

Работать может автономно по штатным настройкам, если нет основной панели. Если есть панель - встраивает в нее настройки, должно подхватывать стили, масштабирования из основной панели.

До меня тут дошло, что нахрен мне не упилось выцеливать мышкой мелкие кнопочки вверх вниз. Я сделал опционально области сверху и снизу страницы. наводишь мышь - станет видна. Кликаешь или свайпаешь мышкой по ней и сработает промотка вверх или вниз. Разберешься, это не главное. Тут я сделал себе задел на будущие жесты, есть идеи.

А вот то, что ты просил - там же в настройках цепочки сообщений. В настройках выбираешь затенять или скрывать сообщения вне цепочки. Я рекомендую - скрывать. Затем кликаешь на заголовок сообщения и останутся на странице только те сообщения, которые входят в цепочку. Кликаешь на заголовок еще раз - вернешься к исходному сообщению. Если клиеншь ПКМ или зажмешь на заголовке ЛКМ - откроется модалка с цепочкой.

Короче, тестировать некогда. Можешь проверить, если что не так - опиши что именно не так и как поправить.

А я побежал баклажаны, перцы и томаты сажать.

Я сделал опционально области сверху и снизу страницы. наводишь мышь - станет видна. Кликаешь или свайпаешь мышкой по ней и сработает промотка вверх или вниз.

Интересно, а можно сделать так, чтобы работало на любом сайте?

// ==UserScript==
// @name         NS Gesture Zones (Universal)
// @namespace    test
// @version      1.1.0
// @description  Свайп-жесты сверху/снизу с блокировкой перетаскивания
// @match        *://*/*
// @grant        none
// @inject-into  content
// @run-at       document-idle
// ==/UserScript==

(function() {
    'use strict';

    const settings = {
        gestureZoneHeight: 70,  // высота зон в пикселях
        highlightOpacity: 0.15, // прозрачность подсветки при наведении
        minDistance: 30         // минимальное расстояние для срабатывания жеста
    };

    let gestureActive = false;
    let gestureStartY = 0;
    let gestureDirection = null;

    // Создаём визуальные индикаторы
    const topZone = document.createElement('div');
    topZone.style.cssText = `
        position: fixed; top: 0; left: 0; width: 100%;
        height: ${settings.gestureZoneHeight}px;
        z-index: 999999; pointer-events: none;
        transition: background 0.3s;
    `;

    const bottomZone = document.createElement('div');
    bottomZone.style.cssText = `
        position: fixed; bottom: 0; left: 0; width: 100%;
        height: ${settings.gestureZoneHeight}px;
        z-index: 999999; pointer-events: none;
        transition: background 0.3s;
    `;

    document.body.appendChild(topZone);
    document.body.appendChild(bottomZone);

    function isInZone(x, y) {
        const w = window.innerWidth;
        const h = window.innerHeight;
        return (x > 30 && x < w - 30) &&
               (y < settings.gestureZoneHeight || y > h - settings.gestureZoneHeight);
    }

    // Блокировка перетаскивания
    function preventDrag(e) {
        e.preventDefault();
        e.stopPropagation();
        return false;
    }

    // Набор событий для блокировки
    const dragEvents = ['dragstart', 'drag', 'dragend', 'selectstart'];

    function enableDragProtection() {
        dragEvents.forEach(event => {
            document.addEventListener(event, preventDrag, true);
        });
        
        // Блокировка выделения текста
        document.body.style.userSelect = 'none';
        document.body.style.webkitUserSelect = 'none';
        document.body.style.mozUserSelect = 'none';
        document.body.style.msUserSelect = 'none';
        
        // Отключаем pointer-events для картинок и ссылок во время жеста
        document.querySelectorAll('img, a, [draggable="true"]').forEach(el => {
            el.dataset.gestureOrigPE = el.style.pointerEvents;
            el.style.pointerEvents = 'none';
        });
    }

    function disableDragProtection() {
        dragEvents.forEach(event => {
            document.removeEventListener(event, preventDrag, true);
        });
        
        // Восстанавливаем выделение текста
        document.body.style.userSelect = '';
        document.body.style.webkitUserSelect = '';
        document.body.style.mozUserSelect = '';
        document.body.style.msUserSelect = '';
        
        // Восстанавливаем pointer-events
        document.querySelectorAll('img, a, [draggable="true"]').forEach(el => {
            el.style.pointerEvents = el.dataset.gestureOrigPE || '';
            delete el.dataset.gestureOrigPE;
        });
    }

    // Подсветка при наведении
    document.addEventListener('mousemove', (e) => {
        if (gestureActive) return;
        const y = e.clientY, x = e.clientX;

        if (isInZone(x, y)) {
            if (y < settings.gestureZoneHeight) {
                topZone.style.background = `rgba(74,144,217,${settings.highlightOpacity})`;
                bottomZone.style.background = '';
            } else {
                bottomZone.style.background = `rgba(74,144,217,${settings.highlightOpacity})`;
                topZone.style.background = '';
            }
        } else {
            topZone.style.background = '';
            bottomZone.style.background = '';
        }
    });

    // Начало жеста
    document.addEventListener('mousedown', (e) => {
        if (e.button !== 0) return;
        if (isInZone(e.clientX, e.clientY)) {
            gestureActive = true;
            gestureStartY = e.clientY;
            gestureDirection = null;
            enableDragProtection();
        }
    });

    // Движение мыши
    document.addEventListener('mousemove', (e) => {
        if (!gestureActive) return;
        
        // Блокируем скролл страницы во время жеста
        e.preventDefault();
        
        const deltaY = e.clientY - gestureStartY;

        if (Math.abs(deltaY) > settings.minDistance && !gestureDirection) {
            gestureDirection = deltaY > 0 ? 'down' : 'up';

            if (gestureDirection === 'up') {
                window.scrollTo({ top: 0, behavior: 'smooth' });
            } else {
                window.scrollTo({ top: document.body.scrollHeight, behavior: 'smooth' });
            }
            
            // Завершаем жест после выполнения
            finishGesture();
        }
    });

    // Завершение жеста
    function finishGesture() {
        gestureActive = false;
        gestureDirection = null;
        disableDragProtection();
    }

    document.addEventListener('mouseup', finishGesture);
    
    // На случай, если мышь выйдет за пределы окна
    document.addEventListener('mouseleave', finishGesture);

    // Клик по зоне быстрая прокрутка
    document.addEventListener('click', (e) => {
        if (gestureActive || e.button !== 0) return;
        if (!isInZone(e.clientX, e.clientY)) return;

        if (e.clientY < settings.gestureZoneHeight) {
            window.scrollTo({ top: 0, behavior: 'smooth' });
        } else {
            window.scrollTo({ top: document.body.scrollHeight, behavior: 'smooth' });
        }
    });

    // Отключаем контекстное меню в зонах жестов
    document.addEventListener('contextmenu', (e) => {
        if (isInZone(e.clientX, e.clientY)) {
            // e.preventDefault();
        }
    });

})();

Настройки в начале файла. Можно расширить до жестов на сайте, вся функциональность есть уже, если что. Но жесты всетаки проще сделать отдельным аддоном.

Можно свайп вообще убрать. В принципе он тут не нужен. Будет вдвое короче скрипт.

А вот вариант поинтереснее. Я наверное его буду дорабатывать. Без зон сверху и снизу, просто свайп левой кнопкой мыши в любое место. Пока потестирую так, может сменю на праву кнопку и добавлю жесты разные.

Свайпаешь в любое место вниз - прокручивает вниз, свайпаешь вверх - прокручивает вверх. Но надо тестировать.

NSUniversalSwipeGestures.user.js

А вот вариант поинтереснее.

Спасибо, но в Helium я сейчас установил https://github.com/liicos/Cesturefy вместо «Mouse Gesture and Wheel Action». Пока тестирую. :)

Создаём визуальные индикаторы

Панелька перекрывает ссылки вверху, если они есть, и они перестают кликаться.

Да, аддоны на жесты есть разные готовые. У меня самого есть Gesturefy в фаерфокс.

Но настройки там ограничены, как и действия. Например можно выбрать лишь одну активационную кнопку. А я сделаю так, как надо мне. Например прокрутки левой кнопкой, другие жесты правой.

А вот именно поэтому я хочу и жесты - свайп вниз вверх. Потому что универсально не угадаешь что там будет сверху и снизу на сайтах.

Лучшая тема на ЛОРе это всетаки блэк. Не понимаю почему на нее забили

Синий фон не нравится, должно быть нейтральное бесцветное или близко к бесцветному. Полностью черный выглядит как бездна, пустота, ещё и текст часто делают яркий в черных темах, аж глаз режет. Мой фон в пределах 222222-333333 и это позволяет сделать боковой фон 000000 или фон встроенных блоков кода сделать темнее, то есть плюс минус есть допуск в обе стороны. Было бы здорово иметь больший выбор тем.