Некоторые технические подробности по исходному коду расширения Russian Hacker Vision.
Применяемые технологии и API. Особенности настройки и использования. Локализация.

В этой статье:

• Отличия от прототипов и аналогов
• Исходный код, настройка и API
  • Применяемые API и отличия версий
  • Интерфейс управления и настроек
  • Тонкая настройка CSS для сайтов
  • Особенности режима (авто)чтения
• Дополнительные примечания по исходному коду
  • Модульная структура скриптов с разделением кода
  • Использование в браузерах старше CR49
• Локализация интерфейса и перевод

Отличия от прототипов и аналогов

В отличие от расширений-прототипов и функциональных аналогов Russian Hacker Vision:

• имеет 9 различных цветовых схем для выбора наиболее подходящей (в прототипе – только одна, "ночная");
• корректно сохраняет/включает схемы для разных сайтов (в прототипе – сброс при переключениях режима);
• переключается в режим чтения и обратно "на лету", без перезагрузки страницы (в прототипе – отсутствует);
• позволяет задавать собственные глобальные и/или посайтные стили для частной подстройки цветовых схем;
• может использоваться как универсальный менеджер пользовательских стилей, независимо от режимов работы;
• предоставляет адаптивный интерфейс с динамически изменяемым контентом окна настроек и значка на тулбаре;
• имеет простой и лёгкий, интуитивно понятный интерфейс Панели управления с повышенной функциональностью;
• полностью переведён на русский язык, включая интерфейс и все подсказки для элементов окна настроек;
• построен по модульной схеме для минимизации общего размера кода и ускорения загрузки/обработки страниц;
• не требует синхронизации, все настройки хранятся только локально, в профиле текущего пользователя;
• даёт возможность быстрого сохранения/восстановления настроек и схем для сайтов через внешний json-файл;
• очищен от мусора, код упрощён и оптимизирован, отсутствуют ссылки на соцсети и предложения "забашлять";)
• работает практически на любых браузерах, без ограничения по версии (29+, проверено на CR29-87).

  ---

  Все отличия указаны для текущей версии Russian Hacker Vision, в более ранних часть добавленных функций отсутствует.

Исходный код, интерфейс и API

Russian Hacker Vision не использует для работы никакие сторонние библиотеки (привет любителям JQuery и иже)).

В коде применён только чистый JS (ES5), любые неподдерживаемые в "старых" браузерах функции отсутствуют, все скрипты работают в "строгом" режиме – для гарантии выполнения функций и облегчения отлова ошибок. В интерфейсе и инжекторах применяются стили стандарта CSS2, неподдерживаемые в "старых" браузерах директивы отсутствуют.

Аддон запускается при старте браузера, имеет невыгружаемый фоновый процесс, служащий для стартовой загрузки инжектируемых скриптов и стилей во все открытые вкладки (на момент установки и/или после включения расширения), а также для обработки вызовов горячих клавиш с открытых страниц при переключениях режимов просмотра.

Применяемые API и отличия версий

Для работы со вкладками при переключении режимов просмотра задействуется API chrome.tabs (разрешение запрашивается в манифесте). Этот API применяется и для стартовой загрузки инжекторов* во все открытые вкладки, а также для загрузки дополнительных частных корректирующих стилей (глобальных и по отдельным сайтам).

* Начиная с версии [2022.9.16] процесс инжектирования ускорен для всех браузеров версий CR44+ за счёт максимально ранней загрузки инжекторов (параметр "runAt:'document_start'"). Для исключения ошибок рантайма на более старых версиях браузеров (без поддержки этого ключа) перед встраиванием скриптов и стилей производится проверка совместимости параметров.

Основные параметры стилизации содержатся в автоматически подгружаемом на страницы коде, запуск и работа которого регулируются API контент-скриптов (встраивание скриптов и стилей во все страницы при их загрузке).

Для обеспечения корректной работы аддона на всех вкладках, включая локальные страницы, в манифесте также запрашивается разрешение [ "<all_urls>" ]. Это же разрешение установлено и для инжектируемых скриптов и стилей.

Для вызова окна настроек при щелчке по кнопке на тулбаре применяется API chrome.browserAction. Этот API также применяется для отрисовки индикатора режима "авточтение" на бэджике значка на тулбаре.

Для обработки вызовов горячих клавиш и некоторых внутренних функций расширения применяются API chrome.runtime, chrome.extension и chrome.windows*. Для их работы специальных разрешений в манифесте не требуется.

* Применялся до версии [2022.9.16] для работы со списком окон и вкладок. В текущих версиях функции этого API не используются, заменены на chrome.tabs.query с целью повышения общей скорости работы за счёт более короткого алгоритма обработки (теперь все групповые операции выполняются в одном цикле).

Расширение работает полностью автономно. Настройки также автономны и сохраняются только в локальном хранилище самого аддона, синхронизации нет. Для работы с хранилищем применяется API chrome.storage. Запрос отдельного разрешения в манифесте при этом необязателен* и не указан.

* Чисто исходя из практических соображений. Достаточно маловероятно, что размер локального хранилища у пользователя превысит стандартную квоту по умолчанию, даже при интенсивном использовании частных посайтных настроек цветовых схем и/или функции установки персональных стилевых корректоров для различных сайтов (в качестве универсального менеджера пользовательских стилей).

Тем не менее, проблема недостаточного объёма хранилища всё же не исключена у некоторых пользователей, поэтому в манифест текущих версий аддона превентивно добавлено разрешение [ "unlimitedStorage" ], снимающее ограничения на размер сохраняемых данных. Это может быть весьма полезно при активном использовании стилевого корректора (менеджера пользовательских стилей).

Упреждая вопросы "зачем оно нам" – это разрешение применяется и в некоторых известных менеджерах стилей (пример), давая пользователю полную свободу в применении любых стилей любого размера. И хотя, как уже сказано, на практике вряд ли будет превышен лимит размера, этот "запас карман не тянет".. :)

Начиная с версии [2022.8.28], API chrome.tabs применяется и для динамического* отслеживания ссылочных переходов в отдельных вкладках, работающих в режиме "авточтения". При необходимости (в случае изменения текущего адреса вкладки-"читалки") с помощью этого же API производится инжектирование дополнительного скрипта и стиля режима чтения в такие вкладки.

* Функция проверки переходов изначально не задействуется (не требуется для работы с основными цветовыми схемами) и активируется только при вызове режима "авточтения" (при разовых переходах в режим чтения на одиночных страницах она также не требуется). В дальнейшем, при отсутствии вкладок, открытых в режиме "авточтения", проверка останавливается и функция выгружается из памяти.

Такой подход, при незначительных разовых микрозадержках на момент первого запуска отдельной функции, даёт в итоге выигрыш по расходу памяти расширения и по общей скорости обработки открываемых страниц. Кроме того, за счёт модульной структуры инжектора, размер его подгружаемой части в целом будет меньше (для "ридера" используются отдельные скрипты и стили, не требующиеся при работе с основными цветовыми схемами), что также приводит к общему ускорению работы браузера.

Начиная с версии [2022.9.12], расширение может использоваться как простой и лёгкий менеджер пользовательских стилей. Эта функция (корректор стилей) работает независимо от остальных режимов, самостоятельно заданные глобальные и посайтные правила применяются в общем случае ко всем цветовым схемам и режимам просмотра.

Все пользовательские стили загружаются в память при запуске аддона, это обеспечивает практически мгновенное их применение при открытии страниц. Минусом такого подхода является рост объёма рабочей памяти аддона при достаточно большом количестве разнообразных стилевых корректоров.

Интерфейс управления и настроек

Russian Hacker Vision имеет интерфейс управления, выполненный в виде всплывающего окна, вызываемого по щелчку мышью на иконке аддона на тулбаре. Сохранение и применение настроек производится автоматически, сразу же после их изменения. Перезапуск расширения или иные действия при этом не требуются.

Все диалоги и сообщения выдаются с помощью стандартных операторов "alert" и "prompt". Интерфейс окна управления написан на чистом HTML-коде и не требует для работы различных внешних библиотек

Краткая сводка по управлению расширением и индикации режимов работы:

• смена текущих цветовых схем (в т.ч. для отдельных сайтов) – во всплывающем окне (по кнопке на тулбаре);
• при переключении выбранная схема сразу же применятся к вкладкам текущего сайта (или ко всем, глобально);
• интерфейс окна настроек также переключается в соответствующий режим, для оперативной визуальной оценки;
• быстрое переключение между разными цветовыми схемами (для подбора по сайтам) – по горячим* клавишам;
• временное включение/отключение (для просмотра страниц в оригинальном виде) – по горячим* клавишам;
• включение/отключение (авто)режима чтения – по горячим* клавишам, работает независимо от цветовых схем;
• включение/отключение встроенного менеджера стилей (корректора) – опция настроек, не зависит от схем;
• изменение/подстройка "под себя" глобальных/посайтных стилей и/или схем – поле редактора в окне настроек;
• оперативная краткая подсказка по доступным горячим клавишам выводится в тултипе к значку на тулбаре;
• режим "авточтения", установленный для отдельных вкладок, отмечается на них бэджиком с латинской буквой "R";
• режим "пауза", при временном отключении стилизатора, отмечается на всех вкладках бэджиком "OFF".

  ---

  * Наиболее удобный вариант переключения, также доступно через соответствующие кнопки в окне Панели управления.

Подробное описание функций каждого из элементов управления окна настроек и действия, выполняющиеся при нажатии горячих клавиш, приведены в статье Russian Hacker Vision : Настройка и применение.

Следует отметить, что для удобства возможных самостоятельных доработок исходного кода (при установке аддона в режиме разработчика) можно использовать встроенную функцию автопроверки типа установки с последующим автоперезапуском расширения для немедленного применения сделанных вами правок.

Эта функция вызывается по щелчку правой кнопкой мыши на строке с названием и номером версии (расположена в нижней части окна управления настройками) и будет задействована только в режиме разработчика (либо при использовании "самопальных" пакетов установки)).

При этом (установка в распакованном виде) соответственно изменяется и подсказка к экранной кнопке:

Других отличий между публичной и "девелоперской" версиями нет, все функции в обоих случаях работают одинаково.

Тонкая настройка CSS для отдельных сайтов

В отличие от расширения-прототипа, общий инжектируемый стиль страниц упрощён и не содержит никаких специфичных "подстроек" под наиболее распространённые сайты и сервисы (YouTube, Vimeo, Amazon, Netflix и др.). Такое упрощение вызвано бессмысленностью* отслеживания периодических изменений на сайтах (что приводит к неработоспособности "подстройки"), а также тем, что у конечных пользователей могут быть самые разные "любимые" сайты, для которых эти стили просто не требуются (при этом жёстко зашитые частные "подстройки" не нужны и становятся просто мусором, утяжеляющим внедряемый CSS и увеличивающим вероятность проблем при обработке стилей на страницах).

* Автор оригинального расширения-прототипа периодически пытается создать некую "универсальную и безглючную" схему CSS, внося отдельные изменения в инжектируемый стиль с каждой новой версией. Однако, такой подход не может считаться оперативным решением в силу отсутствия связи выпуска новых релизов с очередным "стильным выкрутасом" на каком-нибудь из общеизвестных ресурсов.)

И сюда же – "есть мнение", что отследить десятки (и даже сотни!) популярных сайтов, внося постоянные коррективы в код расширения, практически нереально для автора любого аддона. Да это и не нужно никому, юзер (при желании, естественно)) и сам подберёт подходящую "тему" для своего "уютного бложика"..:)

Кроме того, многие из сервисов уже имеют собственные "ночные темы" (как пример – YouTube), которые обеспечивают более комфортный* просмотр (как раз за счёт корректности стилевых настроек "от производителя")), нежели "грубая сила" глобального инжектора от "Русского хакера". В этих случаях намного предпочтительнее установить в настройках аддона для конкретных сайтов режим "Оригинальный вид страниц" и использовать "ночную тему" непосредственно с сайта. При этом не будет возникать никаких "нестыков" при наложении собственных стилей Russian Hacker Vision на частные стили сайтов.

* Относительно видео: после "обкатки" аддона в нескольких версиях, выявился общий минус "грубой силы" для embedded‑роликов – неправильное отображение видео в основных "ночных" схемах (инверсия), связано с "многослойностью" кода встраиваемых плейеров. Для оперативного решения проблемы в CSS инжектора добавлено "персональное" правило для видео‑фреймов с YouTube. Такое "отступление" сделано в целях упрощения обработки роликов и исходя из распространённости подобных элементов.

На текущий момент эта проблема устранена "подкруткой" общих стилей для фреймов и объектов, какая‑либо "персонификация" по конкретным видео‑сервисам при этом отсутствует.

Если говорить о частной реализации "подстроек" CSS под глобальные стили Russian Hacker Vision, для решения такой задачи в паре с этим аддоном можно применять любой менеджер стилей или простой аддон‑конструктор V-Link Color, обеспечивающий мгновенную инжекцию глобальных стилей и не расходующий ресурсов браузера (не висит в памяти).

Кроме того, начиная с версии [2022.9.12], в Russian Hacker Vision имеется встроенная возможность самостоятельно задавать любые* требуемые стили к любым сайтам, а также возможность дополнительной подстройки глобального общего стиля, применяемого ко всем сайтам сразу.

* Формально, при задействовании функции корректора стилей "Русский Хакер" становится универсальным менеджером пользовательских стилей. При этом не имеет значения, какие корректирующие правила вы задаёте, все они будут применены к соответствующим сайтам. Нужно также отметить, что помимо собственноручно написанных директив, для коррекции можно использовать и любые готовые стили, найденные "на просторах интернета", всё ограничивается только вашим желанием и потребностями. :)

Функция "тонкой подкрутки" реализована достаточно просто и интуитивно понятно – в окне настроек, вызванном на странице любого сайта, вы можете добавить и отредактировать любые требуемые вам стили, которые автоматически запоминаются и сразу же применяются* ко всем страницам этого сайта (точно также, как и встроенный инжектор).

* Должно быть понятно, что если вы при ваших экспериментах изменяете несколько раз подряд стиль конкретного сайта, для правильного отображения результата может потребоваться перезагрузка страниц этого сайта. Это связано с тем, что в ваших изменяемых правилах могут содержаться перекрывающие (или взаимоисключающие) директивы. В дальнейшем, конечно же, для этого сайта будет применяться итоговый сохранённый вариант корректирующего стиля.

При вызове окна настроек на любой из служебных страниц, вы можете аналогичным образом переопределить свой собственный глобальный стилевой "довесок", дополняющий или перекрывающий директивы по умолчанию (можно редактировать для любой из схем по отдельности или применять группировку правил, по желанию). Этот набор правил будет применён ко всем сайтам:

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

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

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

Конечно же, необходимо помнить, что слишком сложные корректоры могут серьёзно тормозить работу браузера из-за пересчёта большого числа стилей на открываемых страницах. В общем, старайтесь придерживаться разумного минимализма бритвы Оккама и "не плодите сущности".. :)

Описание элементов управления окна настроек и действия, доступные для установки и редактирования персональных стилевых корректоров, приведены в статье Russian Hacker Vision : Частная настройка коррекции стилей.

Простейший пример использования кода глобального корректора для изменения цвета ссылок на всех сайтах:
a:visited{color:#090!important}
Результатом его применения станет отображение ссылок на ранее посещённые страницы зелёным цветом.

Как другой пример частной "подстройки", можно рассмотреть фрагмент CSS, удалённый из кода прототипа.

/* General Videos Fix */
html[rhv="a3"] video:not(.flideo), html[rhv="b3"] video:not(.flideo),
/* Vimeo Fix */
html[rhv="a3"] .flideo, html[rhv="b3"] .flideo,
/* Flash Videos Fix */
html[rhv="a3"] object[type="application/x-shockwave-flash"],
html[rhv="b3"] object[type="application/x-shockwave-flash"],
/* General Videos Fix */
html[rhv="a3"] embed[type="application/x-shockwave-flash"],
 html[rhv="b3"] embed[type="application/x-shockwave-flash"],
/* Youtube Fix */
html[rhv="a3"] #movie-player, html[rhv="b3"] #movie-player,
/* Amazon Thumbnails Fix */
html[rhv="a3"] .swatchImageOverlay, html[rhv="b3"] .swatchImageOverlay,
/* iFrame Videos Fix */
html[rhv="a3"] iframe:not(.youtube-player),
html[rhv="b3"] iframe:not(.youtube-player),
/* youTube html5 videos fix 12/9/13 */
html[rhv="a3"] body[data-player-size=fullscreen] .html5-video-container,
html[rhv="b3"] body[data-player-size=fullscreen] .html5-video-container,
/* Facebook Photos Fix */
html[rhv="a3"] .fbStarGrid, html[rhv="b3"] .fbStarGrid,
html[rhv="a3"] .fbPhotosGrid, html[rhv="b3"] .fbPhotosGrid,
/* Netflix Fix */
html[rhv="a3"] #SLPlayer, html[rhv="b3"] #SLPlayer
{ -webkit-filter: invert(1) }

/* youTube html5 videos fix 12/9/13 */
html[rhv="a3"] body[data-player-size=fullscreen] .html5-video-container,
html[rhv="b3"] body[data-player-size=fullscreen] .html5-video-container
{ background-color: #000 }

/* Google Images Fix */
html[rhv="a3"] #irc_cc, html[rhv="b3"] #irc_cc { background-color: #fff }
/* Google Images Fix BETA */
#irc_cl :not(#irc_mi){ background-color: #ababab }
/* Google Maps Fix */
html[rhv="a3"] #tileContainer, html[rhv="b3"] #tileContainer
{ -webkit-filter: contrast(.8) brightness(1.2) }

/* Youtube Embedded Fix
html[rhv="a3"] .youtube-player, html[rhv="b3"] .youtube-player,
/ * Vimeo Videos Fix * /
html[rhv="a3"] #cols[itemprop="video"], html[rhv="b3"] #cols[itemprop="video"]
{ -webkit-filter: invert() }

Данный фрагмент можно применить* как корректирующий глобальный стиль в "Русском Хакере", либо в любом другом глобальном "стилизаторе" или менеджере стилей. При этом у пользователя есть возможность самостоятельно изменять "подкрутки" для любого нужного ему сайта.

* Точнее – попытаться применить, потому как реальная работоспособность этих "подкруток" семилетней давности на текущий момент автором не проверялась и не гарантируется, важно понимание вами общего принципа "спаривания" правил и стилей для достижения нужного результата.

Ещё один простой пример – подстройка "ночных" режимов для любого из сайтов Проекта GoodCRX:

html[rhv*='3'] #header, html[rhv*='3'] nav, html[rhv*='3'] #footer,
html[rhv*='4'] #header, html[rhv*='4'] nav, html[rhv*='4'] #footer,
html[rhv*='7'] #header, html[rhv*='7'] nav, html[rhv*='7'] #footer,
html[rhv*='9'] #header, html[rhv*='9'] nav, html[rhv*='9'] #footer
{ -webkit-filter: invert(1) }

Результатом его применения станет "ровное" отображение страниц этих сайтов – "шапка", верхнее меню и "подвал" страницы будут соответствовать "тёмной теме" и не будут сильно контрастировать с областью основного контента.

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

Важное примечание:
Для обеспечения совместимости персональных корректирующих CSS с управлением через Russian Hacker Vision необходимо учитывать наличие в таких стилях соответствующих специфичных атрибутов:
html[rhv="a3"] и/или html[rhv="b3"]

Цифра в значении атрибута указывает на конкретный подстраиваемый режим Russian Hacker Vision, а буквы "a" и "b", соответственно, означают применение к основной странице и ко встраиваемой (т.е., например, фрейм на странице будет регулироваться стилевым правилом с "b").

Соответствие цифр и режимов применительно к текущей версии Russian Hacker Vision:

• a0/b0 = Оригинальный вид страниц
• a1/b1 = Пониженная контрастность
• a2/b2 = Монохромная "серая шкала"
• a3/b3 = Тема "Russian Hacker Vision"
• a4/b4 = Режим "Инверсный серый"
• a5/b5 = Режим "Суперконтрастный"
• a6/b6 = Сглаживание текста страниц
• a7/b7 = Тема "Russian Hacker Vision+"
• a8/b8 = Тёплый "ламповый" монитор
• a9/b9 = Тема "Russian Hacker Smart+"

  ---

  Примечание: Номера цветовых схем не соответствуют порядку их следования в меню аддона.
  Последовательность изменяется по мере добавления новых режимов и цветовых схем.

Для лучшего понимания, как построены и работают внутренние стили цветовых схем, рекомендуется изучить содержимое файла RHV.css, входящего в комплект расширения. Для корректировки стилей режима чтения следует ознакомиться с правилами, заданными в файле RHVa.css.

Резюмируя вышесказанное: у пользователя есть достаточно простые возможности самостоятельно переопределять любой стиль любого сайта, поэтому никакая частная настройка для любого сервиса, даже самого суперпопулярного, не является предметом доработок расширения Russian Hacker Vision, подобный "тюнинг" не будет рассматриваться автором в качестве "заявки на будущую фичу"..:)

Особенности режима (авто)чтения

Опциональный режим комфортного просмотра текстового контента (режим "чтения") не является альтернативой основным цветовым схемам расширения Russian Hacker Vision и предназначен для работы с объёмными текстовыми документами (электронные книги, руководства, справочники и т.п.). Текущие цветовые схемы сайтов при этом остаются неизменными и применяются и к текстовому просмотру. Переключение схем также производится независимо.

Режим "чтения" характерен укрупнённым шрифтом "книжной" гарнитуры (шрифт с засечками, "таймс"), отсутствием на странице "лишних" элементов (кнопок, фреймов, видео и т.д.) и "аскетичным" видом заголовков и основного текста – отсутствуют различные отвлекающие "украшательства", CSS-инжектор принудительно устанавливает простой и максимально "читабельный" стиль оформления текстовых блоков, единый для всех сайтов.

Для примера ниже показан фрагмент страницы одного из сайтов, работающей в текстовом режиме:

^{Щёлкните по изображению, чтобы просмотреть другой скриншот.}

Специальный стиль просмотра текста применяется к любой текущей странице, включается только вручную по горячим клавишам (наиболее быстрый и удобный вариант переключения) или соответствующими кнопками в окне настроек.

При этом в любой момент пользователь может "на лету" переключить просматриваемую страницу на оригинальный вид сайта (хоткей CTRL+F11). Переходы производятся мгновенно, и, в отличие от прототипа, БЕЗ перезагрузки* страницы.

* Это реализовано следующим образом: в отличие от прототипа, "Русский Хакер" НЕ удаляет содержимое оригинальной страницы и НЕ заменяет его на собственный текстовый блок. Вместо грубой зачистки кода страницы используется полное дублирование её контента в отдельный блок и применение текстового стиля и скрипта инжектора только к копии содержимого страницы (оригинал остаётся "как есть").

Таким образом, на текущей странице имеются в результате два контент-блока, один из которых содержит весь исходный контент и в котором полностью сохраняется работа оригинальных скриптов и стилей для его содержимого. При переключении между текстовым и оригинальным видом, достаточно просто менять видимость этих двух блоков (что происходит мгновенно!) и именно поэтому и НЕ требуется перезагрузка страницы при обратной смене режима.

В целях повышения удобства чтения в этом режиме применяется достаточно жёсткая фильтрация "лишних" элементов страниц. Оригинальные стили и встроенные скрипты страницы игнорируются, шрифты и размер текста жёстко прописаны правилами CSS-инжектора. Кроме того, для всех ссылок удаляются атрибуты "target", "onclick" и другие, связанные со ссылочными переходами (проще говоря, все ссылки на странице будут открываться в текущей вкладке). Также из блока текста удаляются все фреймы, флэш, аудио и видео объекты, кнопки и поля ввода, мешающие чтению.

Следует помнить, что режим чтения включается только на полностью загруженных страницах! Если страница ещё грузится, инжектор будет ждать окончания загрузки и только после этого переведёт страницу в режим чтения.

Совет: при желании вы можете в любой момент вручную прервать "бесконечную подгрузку" отдельных страниц, нажав клавишу ESC (или кнопку "крестик" на панели браузера). После этого инжектор сразу же запустит преобразование страницы в текстовый вид. Этот "хинт" будет весьма полезен на некоторых сайтах, страдающих "автоподсосом мусора" после загрузки основного контента.

Кроме ручного вызова просмотра страниц в режиме чтения, в расширении доступно автоматическое применение специального стиля просмотра текста для всех ссылок/переходов, открываемых* в выбранной вкладке ("авточтение"). Такой авторежим эквивалентен ручному вызову режима чтения после каждой (пере)загрузки страницы в этой вкладке.

Этот режим предназначен для комфортной работы с многостраничными подгружаемыми текстами, не требуя от пользователя многократного ручного переключения каждой страницы, открываемой во вкладке "читалке". В частности, режим может быть полезен при чтении объёмных "юзер-мануалов" или книг.

Автоматический режим чтения можно вызвать по горячей клавише (SHIFT+F11) или кнопкой в Панели управления, при этом все последующие переключения "на лету" также производятся мгновенно и БЕЗ перезагрузки страницы.

После включения "авточтения" можно в любой момент временно переключиться обратно на оригинальный стиль сайта по хоткею CTRL+F11. Эти переходы не отключают "автоматику" и также производятся БЕЗ перезагрузки страницы.

Любой из режимов чтения является динамическим и работает только в пределах браузерной сессии. Режим "авточтения" никак НЕ привязывается к конкретному сайту и НЕ сохраняется в настройках! Автопереход в этот режим работает до перезагрузки аддона либо до момента его (режима или аддона)) отключения (вами, вручную) или до закрытия вкладки.

Авторежим применяется/включается только в пределах текущей вкладки и индицируется для неё символом "R" на значке расширения на тулбаре (см. скриншот выше). Индикатор включается после перевода страницы в режим чтения.

При вызове окна настроек на такой вкладке слева от имени домена отображается экранная кнопка "R", позволяющая выключить текстовый авторежим щелчком мыши по ней (см. скриншот выше).

Дополнительные примечания по исходному коду

Практических ограничений по версии браузера не имеется, используемые API работают в версиях 29+. Рекомендуемая "беспроблемная" версия с полной поддержкой всех функций аддона – не ниже 31+.

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

Исходный код текущей версии расширения можно просмотреть в режиме онлайн на любом из ресурсов, приведённых в материале Russian Hacker Vision : LBSC*.

* См.также: LBSC: Что это такое и как работать с этим архивом.

Модульная структура скриптов с разделением кода

В аддоне используется модульная схема, как основа для минимизации размера кода и общего повышения скорости его работы. Модульность применяется также для инжектируемых скриптов и стилей, в частности – загрузка инжекторов режима чтения производится только при его вызове (в т.ч. для "авточтения"). Часть фоновых скриптов и инжектируемых стилей также используется в качестве общих ресурсов для интерфейса и функционала окна настроек.

Зачем/почему – за счёт этого разделения основной скрипт аддона уменьшен в размере, выше его "отзывчивость" и скорость загрузки и работы. В основном скрипте оставлены только наиболее часто применяемые операции, связанные непосредственно с работой инжекторов цветовых схем. Инжекторы опционально используемого режима "чтения", требующего дополнительных функций обработки страницы и применения дополнительных стилей, и корректирующие стили для "старых" браузеров подгружаются только при необходимости, падение производительности при этом чисто теоретическое, "на глаз" заметно не будет.

В связи с указанным подходом, в комплект аддона входят следующие файлы скриптов и стилей:

• RHV.js(css) – основной инжектор (скрипт и стиль) с функциями обработки и вызова других модулей;

  Запускаются всегда, при вызове любых страниц, указаны как основные инжекторы в манифесте.

  Этот же стиль (CSS-файл) используется для визуализации режимов просмотра в окне Панели управления.

• RHVa.js(css) – инжектор (скрипт и стиль) режима чтения с функцией переключения режима;

  Запускаются только при вызове режима (авто)чтения, работают только в пределах текущей страницы/вкладки.

• RHVb.js – основной фоновый скрипт с функциями обработки запросов и загрузки инжекторов;

  Запускается всегда, автоматически, не выгружается из памяти, указан как основной фоновый скрипт в манифесте.

• RHVc.js – разделяемый фоновый скрипт с общими функциями для интерфейса и инжекторов;

  Запускается всегда, автоматически, не выгружается из памяти, указан как основной фоновый скрипт в манифесте.

  Также запускается при вызове окна настроек, для "стыковки" интерфейса управления с фоновым скриптом.

• RHVo.css – корректирующий инжектор (стиль) для "ночных" (инверсных) цветовых схем;

  Запускается только на "старых" браузерах (версий до CR48), работает для всех страниц.

  Использовался только в версии [2022.9.8], заменён на глобальный корректирующий стиль.

• RHVp.js(html) – скрипт и код окна Панели управления.

  Запускаются только при вызове окна настроек, выгружаются автоматически, указаны как попап в манифесте.

Об использовании расширения в браузерах версий старше CR49

При использовании "Russian Hacker Vision" в браузерах достаточно старых версий возможна некорректная работа отдельных цветовых схем. Это не является ошибкой расширения и связано с ограничениями в некоторых браузерах полноценной поддержки современных стандартов CSS3.

Подобная ситуация возможна при работе с любым браузером версии старше CR49. В частности, она наблюдается в браузерах SRWare Iron 29/31/36, где часть сайтов, применяющих операторы CSS3, может некорректно отображаться в "ночных" (инверсных) режимах* просмотра (пример). Для смягчения подобных проблем в аддон добавлены некоторые** дополнительные "костыли", устраняющие часть подобных ошибок.

 * Речь не идёт об общей "корявости" вывода контента в принципе, только о том, что "ночные" схемы не отрабатывают как должны и в них полностью теряется текст большинства элементов страницы на таких сайтах. Проблема решаема корректировкой CSS инжектора, но такая коррекция приводит к ошибкам отображения в более новых браузерах.

** В частности, проблема "пропажи" текста в "ночных" схемах решена подгрузкой дополнительного корректирующего CSS-кода, применяемого к просматриваемым страницам только по необходимости и только по результатам проверки возможностей пользовательского браузера. Этот стиль устанавливается автоматически и по умолчанию включен только в старых "браузерах" (версий старше CR48).

Кроме того, в достаточно старых браузерах не исключены и другие проблемы, связанные с применением современных технологий (скрипты, стили и т.д.). Это также не связано с ошибками в аддоне и зависит только от дизайнеров сайтов и их стремления к поддержке старых версий браузеров.

Впрочем, не "всё так печально", подобные "новомодные" сайты нормально отображаются во всех цветовых схемах при использовании режима "чтения". При этом даже на самых "упёртых" сайтах страница в режиме чтения отображается в полном соответствии с выбранной цветовой схемой. К тому же, в текстовом режиме отсутствует "кривость" контента из-за "непонимания" браузером новых операторов CSS.

В общем, рабочий вариант просмотра у "олдскульных" пользователей всё же есть.. :)

В общем и целом, инженерное тестирование этого расширения (на этапе разработки) в браузерах версий старше CR49 проводится по остаточному принципу и в большинстве случаев связано только с проверкой общей работоспособности основных ключевых функций аддона и только если эти версии заявлены в числе поддерживаемых.

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

Поскольку достаточно простые решения подобной "кроссбраузерности" (по версиям движка) отсутствуют, автор считает нецелесообразным увеличение размера кода и изменение логики работы скриптов только ради поддержки достаточно старых браузеров (тем более – ради поддержки в них лишь части режимов).

При этом, при обоснованной потребности, полная поддержка всех цветовых схем в "ретро-браузерах" может быть добавлена и для достаточно старых версий браузеров путём дополнительной доработки исходного кода. Доработка* выполняется на условиях частного партнёрства с конкретным заказчиком (по обоюдной договорённости).

* В этом случае возможен публичный выпуск и авторская поддержка "спецверсий" для старых браузеров. Такие релизы также могут быть размещены в разделе официальных загрузок этого сайта и в дальнейшем будут доступны всем "любителям старины". :)

Локализация интерфейса и перевод на другие языки

Язык интерфейса – только русский (локализация жёсткая, зашита в коде), добавление других* локализаций на текущий момент не планируется. Это связано со значительным упрощением кода, а также с тем, что при создании расширения автор в первую очередь ориентируется на русскоязычных пользователей.

* Впрочем, если "дело пойдёт", прикрутить ещё и "басурманский" не является особой проблемой…)

При необходимости пользователи-энтузиасты могут самостоятельно изменить локализацию интерфейса и описания, исправив все подсказки, названия пунктов списка цветовых схем, кнопки и т.д.. Думаю, должно быть понятно, что эти действия вы можете выполнить только на свой страх и риск, никакие претензии типа "я вот тут поменял и у меня не пашет" автором не принимаются.)

Тем не менее, при реальной необходимости полная поддержка иных локалей может быть добавлена и автором путём дополнительной доработки исходного кода. Эта доработка* может быть выполнена на условиях частного партнёрства с конкретным заказчиком (по обоюдной договорённости).

* В этом случае будет выполнен публичный выпуск с авторской поддержкой мультиязычных версий. Такие релизы также будут размещены в разделе официальных загрузок этого сайта и в дальнейшем будут доступны всем "любителям иностранщины". :)

Короче, велкам… :)