[Расширения для браузеров, Софт, Лайфхаки для гиков] Устанавливаем кастомную раскладку на klava.org
Автор
Сообщение
news_bot ®
Стаж: 6 лет 9 месяцев
Сообщений: 27286
Что будет рассказано?
- Очевидная проблема при изучении своих клавиатурных раскладок
- Немного о нашем пациенте: klava.org
- То, как получилось решить данную проблему (спасибо F12)
- Как правильно настраивать клавиши (при нажатии Shift или AltGr)
- Автоматизация ручного труда с помощью расширения User JS and CSS
То, с чего всё началосьКогда мы изучаем десятипальцевый метод, для ускорения обучения мы используем различные тренажёры: typingStudy, klava.org, ratatype, rapidTyping и другие. Однако, когда встаёт вопрос об освоении своей особенной, кастомной, раскладки, то "оказывается", что ни один сайт, ни одна программа не предусматривает их существование:
- В списке поддерживающихся раскладок, своей "конечно же" нет
- В настройках свою добавить невозможно
- Самому писать тренажёр - трындец полный
В качестве пациента я выбрал сайт klava.org: неплохой визуал, клавиатура на экране есть, пальцы показываются, разные режимы, ОК. Изначально на сайте есть весьма неплохой список раскладок для русского и английского языков, но нет кучи других, не менее интересных раскладок (да и разработчиков сайта нет смысла судить: раскладок куча, плюсом завтра может появиться новая -> всем не угодить).Откапываем словарь с раскладкамиКак многие из вас знают, есть нажать F12, то выскочит "волшебная" панель с HTML-кодом, CSS, JS, файлами, которые можно без проблем редактировать, и многим другим функционалом, необходимым для разработчиков. Если немного порассуждать, то можно прийти к следующему предположению:
Если сайт писали хорошие ребята, то скорее всего абсолютно всё: расположение символов на экране, автоматическая подсветка нужной буквы/клавиши, отрисовка, будет зависеть только от одного источника: словаря/массива/списка, соответственно, нужно найти тот самый словарь и расположить всё по-своему!
И, да, заветный словарь был найден! В JS этот "словарик" описан одной переменной keyboards. Там ооочень много кода и он, как назло, весь минимизирован, но разобраться можно. Найти этот код достаточно просто:
- Жмём F12
- Прожимаем Ctrl+F (появится поле для ввода)
- Вводим "var keyboards"
- Копируем словарик в блокнот (слово var удалите, оно нам больше не понадобится)
- Словарь полностью в нашем расположении!!!
Ставим кастомную раскладку вместо ненужнойТеперь нужно подобрать "жертву" - ненужную раскладку, которую будем редактировать. После этого её нужно отыскать (берём название из сайта и не забываем про Ctrl+F). В итоге, получаем массив строк, который нужно обработать: машинописть например выглядит так:
//название раскладки в процессе редактирования менять нельзя!!!
'машинопись': ['|<sup>+</sup>', '№<sup>1</sup>', '-<sup>2</sup>', '/<sup>3</sup>', '"<sup>4</sup>', ':<sup>5</sup>', ',<sup>6</sup>', '.<sup>7</sup>', '_<sup>8</sup>', '?<sup>9</sup>', '%<sup>0</sup>', '!<sup>=</sup>', ';<sup>\\</sup>', 'Й', 'Ц', 'У', 'К', 'Е', 'Н', 'Г', 'Ш', 'Щ', 'З', 'Х', 'Ъ', ')<sup>(</sup>', 'Ф', 'Ы', 'В', 'А', 'П', 'Р', 'О', 'Л', 'Д', 'Ж', 'Э', 'Я', 'Ч', 'С', 'М', 'И', 'Т', 'Ь', 'Б', 'Ю', 'Ё']
Теперь поясню, что здесь происходит:Строки, где находятся только заглавные буквы, это обычные символы, система с ними всё сама сделает (просто нажали - прописная буква, нажали Shift - заглавная). В остальных местах присутствуют знакомые HTML-теги: в такой строке следующие правила.
- Самый первый символ, символ, который вводится без Shift или AltGr, то есть, просто нажатие
- Внутри тегов <sup></sup> находятся символы, которые вводятся при нажатом Shift; символы отрисовываются сверху
- Внутри тегов <sub></sub> находятся символы, которые вводятся при нажатом AltGr; символы отрисовываются снизу
'S' //просто буква, и так всё понятно
'(<sup>{</sup><sub>[</sub>' //нажатие -> (
//+ Shift -> {
//+ AltGr -> [
'ь<sup>ъ</sup>' //разные буквы тоже можно
Отредактировали? Заменили? Теперь осталось протестировать.
- Отрываем сайт
- Жмём F12
- Открываем Console
- Вставляем наш "модифицированный код" (надеюсь var удалить не забыли)
- Жмём Enter
- Если всё сделано правильно, то сообщений об ошибке не будет
После этого закрываем панельку, выбираем нашу "жертву" и ЧУДО!!! кастомная раскладка работает (вот, что у меня получилось):
АвтоматизацияВсё-таки при каждом входе на сайт не хочется каждый раз вручную вставлять этот код. Для решения этой проблемы было создано расширение под названием User Javascript and CSS. Ставим расширение. После уставновки открываем наш сайт, жмём на иконку расширения и жмём Add new. Перед вами откроется 2 поля: JS и CSS, теперь остаётся вставить наш код в поле JS, сохраниться, проверить флажок и кайфануть, что всё работает "само́".
Ура!!!! Вы установили свою кастомную раскладку на сайт klava.org. Теперь тренить свою раскладку будет проще, быстрее и (наверное) интереснее.
===========
Источник:
habr.com
===========
Похожие новости:
- [Тестирование IT-систем, Agile, Управление продуктом, Софт] На ком лежит ответственность за качество программного обеспечения? (перевод)
- [Разработка под MacOS, Софт, IT-компании] 9to5Mac: Apple может запретить загрузку сторонних приложений на компьютеры с чипом M1
- [Софт, Настольные компьютеры] Обновление 21H2 для Windows 10 выйдет в июне
- [Интерфейсы, Разработка под Windows, Дизайн, Софт] Windows 10 Sun Valley: что мы знаем на сегодня (перевод)
- [Системное администрирование, Софт] Эксперт обнаружил критическую уязвимость в Windows 10. Однострочная команда повреждает любой диск с NTFS
- [Программирование, Git, Софт] Учимся писать информативные комментарии к GIT-коммитам используя общепринятую семантику (перевод)
- [Информационная безопасность, Криптография, Open source, Софт] Какое шифрование лучше: Signal или Telegram?
- [Развитие стартапа, Карьера в IT-индустрии, Бизнес-модели, Финансы в IT] 80% бизнеса построено на обмане под названием «Личный бренд»
- [Настройка Linux, Софт] Обход ограничений терминала
- [Читальный зал, Лайфхаки для гиков, Мозг, Здоровье] Человеческий организм различает только две поры года (перевод)
Теги для поиска: #_rasshirenija_dlja_brauzerov (Расширения для браузеров), #_soft (Софт), #_lajfhaki_dlja_gikov (Лайфхаки для гиков), #_klaviatura (клавиатура), #_klaviaturnye_trenazhery (клавиатурные тренажеры), #_lajfhak (лайфхак), #_raskladka (раскладка), #_raskladka_klaviatury (раскладка клавиатуры), #_kastomizatsija (кастомизация), #_rasshirenija_dlja_brauzerov (
Расширения для браузеров
), #_soft (
Софт
), #_lajfhaki_dlja_gikov (
Лайфхаки для гиков
)
Вы не можете начинать темы
Вы не можете отвечать на сообщения
Вы не можете редактировать свои сообщения
Вы не можете удалять свои сообщения
Вы не можете голосовать в опросах
Вы не можете прикреплять файлы к сообщениям
Вы не можете скачивать файлы
Текущее время: 22-Ноя 10:22
Часовой пояс: UTC + 5
| Автор | Сообщение |
|---|---|
|
news_bot ®
Стаж: 6 лет 9 месяцев |
|
 Что будет рассказано?
Если сайт писали хорошие ребята, то скорее всего абсолютно всё: расположение символов на экране, автоматическая подсветка нужной буквы/клавиши, отрисовка, будет зависеть только от одного источника: словаря/массива/списка, соответственно, нужно найти тот самый словарь и расположить всё по-своему!
 Ставим кастомную раскладку вместо ненужнойТеперь нужно подобрать "жертву" - ненужную раскладку, которую будем редактировать. После этого её нужно отыскать (берём название из сайта и не забываем про Ctrl+F). В итоге, получаем массив строк, который нужно обработать: машинописть например выглядит так: //название раскладки в процессе редактирования менять нельзя!!!
'машинопись': ['|<sup>+</sup>', '№<sup>1</sup>', '-<sup>2</sup>', '/<sup>3</sup>', '"<sup>4</sup>', ':<sup>5</sup>', ',<sup>6</sup>', '.<sup>7</sup>', '_<sup>8</sup>', '?<sup>9</sup>', '%<sup>0</sup>', '!<sup>=</sup>', ';<sup>\\</sup>', 'Й', 'Ц', 'У', 'К', 'Е', 'Н', 'Г', 'Ш', 'Щ', 'З', 'Х', 'Ъ', ')<sup>(</sup>', 'Ф', 'Ы', 'В', 'А', 'П', 'Р', 'О', 'Л', 'Д', 'Ж', 'Э', 'Я', 'Ч', 'С', 'М', 'И', 'Т', 'Ь', 'Б', 'Ю', 'Ё']
'S' //просто буква, и так всё понятно
'(<sup>{</sup><sub>[</sub>' //нажатие -> ( //+ Shift -> { //+ AltGr -> [ 'ь<sup>ъ</sup>' //разные буквы тоже можно
 После этого закрываем панельку, выбираем нашу "жертву" и ЧУДО!!! кастомная раскладка работает (вот, что у меня получилось):  АвтоматизацияВсё-таки при каждом входе на сайт не хочется каждый раз вручную вставлять этот код. Для решения этой проблемы было создано расширение под названием User Javascript and CSS. Ставим расширение. После уставновки открываем наш сайт, жмём на иконку расширения и жмём Add new. Перед вами откроется 2 поля: JS и CSS, теперь остаётся вставить наш код в поле JS, сохраниться, проверить флажок и кайфануть, что всё работает "само́".    Ура!!!! Вы установили свою кастомную раскладку на сайт klava.org. Теперь тренить свою раскладку будет проще, быстрее и (наверное) интереснее. =========== Источник: habr.com =========== Похожие новости:
Расширения для браузеров ), #_soft ( Софт ), #_lajfhaki_dlja_gikov ( Лайфхаки для гиков ) |
|
Вы не можете начинать темы
Вы не можете отвечать на сообщения
Вы не можете редактировать свои сообщения
Вы не можете удалять свои сообщения
Вы не можете голосовать в опросах
Вы не можете прикреплять файлы к сообщениям
Вы не можете скачивать файлы
Вы не можете отвечать на сообщения
Вы не можете редактировать свои сообщения
Вы не можете удалять свои сообщения
Вы не можете голосовать в опросах
Вы не можете прикреплять файлы к сообщениям
Вы не можете скачивать файлы
Текущее время: 22-Ноя 10:22
Часовой пояс: UTC + 5