jelly.js 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. /**
  2. * Peanut butter goes great with jelly.
  3. *
  4. * @author Dan Tao <daniel.tao@gmail.com>
  5. */
  6. var Jelly = (function() {
  7. var recordButton = $("button.test-record"),
  8. recordResult = $("div.test-record-result");
  9. function _formatSequenceAsHtml(sequence) {
  10. var combos = [],
  11. i;
  12. for (i = 0; i < sequence.length; ++i) {
  13. combos.push('<span>' + _formatKeysAsHtml(sequence[i].split('+')) + '</span>');
  14. }
  15. return combos.join(' ');
  16. }
  17. function _formatKeysAsHtml(keys) {
  18. var htmlKeys = [],
  19. i;
  20. for (i = 0; i < keys.length; ++i) {
  21. htmlKeys.push('<kbd>' + keys[i] + '</kbd>');
  22. }
  23. return htmlKeys.join('+');
  24. }
  25. function _prepareRecordTest() {
  26. recordButton.prop('disabled', true);
  27. recordButton.text('Recording');
  28. Mousetrap.record(function(sequence) {
  29. recordResult.html(_formatSequenceAsHtml(sequence));
  30. recordButton.prop('disabled', false);
  31. recordButton.text('Record');
  32. });
  33. // take focus away from the button so that Mousetrap will actually
  34. // capture keystrokes
  35. recordButton.blur();
  36. }
  37. return {
  38. spread: function() {
  39. recordButton.click(_prepareRecordTest);
  40. }
  41. };
  42. })();