Pull to refresh

Хоткеи в приложенях Ruby on Rails

Ruby on Rails
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
Tags:rubygemsruby on railsmousetraphotkeysjavascript librarygemruby
Hubs: Ruby on Rails
Total votes 24: ↑23 and ↓1 +22
Views5.1K

Comments 28

Only those users with full accounts are able to leave comments. Log in, please.

Popular right now

Node.js: серверный JavaScript
April 26, 202127,000 ₽Loftschool
Интенсив «Full stack разработчик. JavaScript»
April 26, 2021245,000 ₽Elbrus Coding Bootcamp
Интенсив «Full stack разработчик. JavaScript»
April 26, 2021190,000 ₽Elbrus Coding Bootcamp
Специалист JavaScript
May 24, 202122,690 ₽Специалист.ру