Keymaster.js: painless keyboard shortcuts for javascript(github.com)

164 pointsby bmaeser15 anni fa19 comments

Keymaster.js: painless keyboard shortcuts for javascript

https://github.com/madrobby/keymaster

22 comments

Hmm. Binds all events to `document`, which means that if you type something in a text field, it'll still trigger the event. (One of the TODOs is "Make behavior with INPUT / SELECT / TEXTAREA configurable.)

Thing is, jQuery Hotkeys (https://github.com/jeresig/jquery.hotkeys) is more versatile (since you can bind events to any element), works under a wider range of browsers, and is nearly as lightweight (if you already depend on jQuery).

Though, I do like the hipness of using "⌥" and "⌘" instead of "alt" and "meta". I might make a fork of jQuery Hotkeys just for that.

madrobby15 anni fa

It doesn't trigger events if you're in a INPUT/TEXTAREA/SELECT.

The todo refers to making this configurable in a per-shortcut fashion.

TrevorBurnham15 anni fa

Ah, my bad. I didn't catch the line "if (tagName == 'INPUT' || tagName == 'SELECT' || tagName == 'TEXTAREA') return;", which is indeed a sensible default.

fbnt15 anni fa

I recently had the need of using multiple hotkeys for a web application I'm building.

I tried jQuery hotkeys but I had to drop it for a number of reasons: First of all is the unbind problem (well documented on their bug-tracker), if you bind N different keys combination, the callback function for each hotkey is called N times, and that's really annoying and there are no easy workaround. Other than that, not all keys combination are supported, some keys just doesen't work, and it also bind keys per value instead of code: it's basically designed for american keyboards only, the same key value might have different key-codes for different keyboard layouts.

So I came up with a simple homemade solution that words flawlessly for my needs: http://jsfiddle.net/2Saj8/

I'm looking forward to try out keymaster.js though.

TrevorBurnham15 anni fa

In case anyone wants it, here's my unicode-friendly fork of jQuery Hotkeys: https://github.com/TrevorBurnham/jquery.hotkeys

Note that because of the way the library works, you can only use the unicode equivalents on this fork—aliases like "ctrl" and "alt" will not work. (jQuery Hotkeys was written with a pretty hardcore approach to efficiency, so everything is 1:1. Keymaster uses an `indexOf` search each time a key is pressed, which has a negligible impact on performance in modern browsers.)

maratd15 anni fa

We don't use Keymaster, but our homebrew solution works the same way. You can solve the problem by adding an event to elements that you don't want to react that stops bubbling. Since those elements are focused when a key is pressed, the event for that element will be triggered first. Our form validation script adds this automatically. Problem solved.

[deleted]15 anni fa

jstepien15 anni fa

Why would you store a minified version in the VCS, especially not having it in sync with the original source code? Shouldn't it be an artefact kept out of the VCS and built automatically by, for example, make and UglifyJS?

thomasfl15 anni fa

It's more convenient with a minified source layoung around somewhere. Also it's quite small:

(function(a){function j(a){d=a||"all"}function i(a,c,d){var g,h;d===undefined&&(d=c,c="all"),a=a.replace(/\s/g,""),g=a.split(","),g.forEach(function(a){h=[],a=a.split("+"),a.length>1&&(h=a.slice(0,a.length-1).map(function(a){return e[a]}),a=[a[a.length-1]]),a=a[0],a=a.length>1?f[a]:a.toUpperCase().charCodeAt(0),a in b||(b[a]=[]),b[a].push({scope:c,method:d,mods:h})})}function h(a){var b=""+a.keyCode;b in c&&(c[b]=!1)}function g(a){var e,f;f=a.target.tagName,e=""+a.keyCode;if(e in c)return c[e]=!0;if(f!="INPUT"&&f!="SELECT"&&f!="TEXTAREA"){if(!(e in b))return;b[e].forEach(function(b){(b.scope==d||b.scope=="all")&&(b.mods.length==0&&!c[16]&&!c[18]&&!c[17]&&!c[91]||b.mods.length>0&&b.mods.every(function(a){return c[a]}))&&b.method(a,b.key,b.scope)===!1&&(a.stopPropagation(),a.preventDefault())})}}var b={},c={16:!1,18:!1,17:!1,91:!1},d="all",e={shift:16,option:18,"⌥":18,alt:18,ctrl:17,control:17,command:91,"⌘":91},f={backspace:8,tab:9,enter:13,"return":13,escape:27,space:32,left:37,up:38,right:39,down:40};document.addEventListener("keydown",g,!1),document.addEventListener("keyup",h,!1),a.key=i,a.keyScope=j})(this)

joelhaasnoot15 anni fa

By putting the source on github you're inviting people to use your code in their projects, and pick it apart. It's next to impossible to pick apart like this. In addition, a minified version is a build product, which you don't put in a VCS. Offer the minified version as a download, that's what that feature is there for.

exogen15 anni fa

Putting build artifacts in source control does seem a bit strange. Nevertheless, it's very common practice with JavaScript libraries.

studiofellow15 anni fa

To a javascript mortal (i.e. someone who lacks sufficient proficiency to write or contribute to a library) this is refreshing. Looking forward to ignoring event.keyCode in my next project. Thanks for this.

program15 anni fa

I like the fact that this library has no dependencies. I suggest that the _MAP variable in keymaster.js should be equal to the specialKeys variable defined in jquery.hotkeys.js.

https://github.com/jeresig/jquery.hotkeys/blob/master/jquery...

in order to cover all special keys.

anon_koder15 anni fa

Did I miss the demo gh-page ?

mrbogle15 anni fa

Cool. I have a nit:

91 for Mac meta/command is the left-hand button in webkit only. It's 224 in Firefox, and the right-hand one in webkit is 93.

Also, how to I bind to page up/down?

timdown15 anni fa

Why is IE < 9 support a low priority? Adding support would be pretty simple and wouldn't add much code, and IE < 9 is still used by a significant proportion of users.

Myrth15 anni fa

Please add todo for unbinding key maps (specific/all). For example if page contains ajax loaded partials.

ruffdev15 anni fa

Why do we have a semicolon at the start?

;(function(global)

oscargodson15 anni fa

tomlin15 anni fa

Look, github is great and all, but will linking to your github repo really entice me to use your library? If its brownie points you're looking for in using github, you lost them by not providing a demo of the library and only a tiny bit of code that explains what it does.

joeshaw15 anni fa

One of things I like about github is that it's done a great job of enticing developers to write good README files. I've seen many projects that do a fine job of introducing the project, listing things like license, dependencies, etc., and showing example code of how it works. Often times it also links to a demo or screencasts. For most projects, this seems good enough -- most project web sites don't add any more value.

oscargodson15 anni fa