Fingers on the railsMousetrap — javascript-библиотека, позволяющая легко и непринужденно добавлять хоткеи на сайты, появилась не так давно. Но уже успела полюбиться мне настолько, что я решил сделать ее добавление к проекту на Ruby on Rails простым и приятным. А именно, завернуть в ruby-библиотеку для рельсов. Так появился gem mousetrap-rails.


Подключение


Чтобы использовать библиотеку в проекте, добавьте в Gemfile вашего приложения строчку
gem 'mousetrap-rails'

и выполните
$ bundle install

После чего запустите генератор, который создаст coffescript-файл с примерами использования keybindings.js.coffee и подключит библиотеку в Asset Pipeline, добавив //= require mousetrap в js манифест приложения.

$ rails generate mousetrap:install


Использование


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

Например, код вида
= link_to 'Homepage', root_path, data: { keybinding: 'h' }
позволит перейти на домашнюю страницу по нажатию на 'h'

А этот — заставит переключить фокус на поле ввода Username по кнопке 'u'
= text_field_tag 'Username', nil, data: { keybinding: 'u' }

Конечно, возможности библиотеки не ограничиваются только навигацией, вы можете вызвать любую javascript-функцию. Причем повесить ее вызов можно не только на одну кнопку, но и на целое клавиатурное комбо.
// одиночные кнопки
Mousetrap.bind '4', -> alert '4 pressed!'
Mousetrap.bind 'x', (-> alert 'x pressed!'), 'keyup'

// комбинации
Mousetrap.bind 'command+shift+k', ->
  alert 'command+shift+k pressed!'
  false

Mousetrap.bind ['command+k', 'ctrl+k'], ->
  alert 'command+k or ctrl+k pressed!'
  false

// последовательности нажатий
Mousetrap.bind 'g i', -> console.log 'g i sequence pressed!'
Mousetrap.bind '* a', -> console.log '* a sequence pressed!'

// мега-комбо
Mousetrap.bind 'up up down down left right left right b a enter', -> console.log 'You WIN!'

Подробнее о возможностях Mousetrap можно узнать на странице проекта.

В заключение


Mousetrap прекрасно справляется со своими обязанностями, и gem я собираюсь развивать дальше. Буду рад любому конструктивному фидбэку.

Ссылки (куда же без них)



© Photo by macrj