Commit a2793e72faf8165dbb3e94f713d5670e7c557606
refactor message opening into keyboard shortcuts file
mix irving committed on 3/28/2017, 11:01:10 AMParent: 0c82b5ef7a36d201a465e8fd4f91ebafc925ab4c
Files changed
| main/sync/catch-keyboard-shortcut.js | changed |
| message/html/layout/default.js | changed |
| main/sync/catch-keyboard-shortcut.js | ||
|---|---|---|
| @@ -9,9 +9,9 @@ | ||
| 9 | 9 | var gPressed = false |
| 10 | 10 | |
| 11 | 11 | root.addEventListener('keydown', (ev) => { |
| 12 | 12 | isTextFieldEvent(ev) |
| 13 | - ? textFieldShortcuts(ev, opts) | |
| 13 | + ? textFieldShortcuts(ev) | |
| 14 | 14 | : genericShortcuts(ev, opts) |
| 15 | 15 | }) |
| 16 | 16 | } |
| 17 | 17 | } |
| @@ -19,9 +19,9 @@ | ||
| 19 | 19 | // TODO build better apis for navigation, search, and publishing |
| 20 | 20 | |
| 21 | 21 | function isTextFieldEvent (ev) { |
| 22 | 22 | const tag = ev.target.nodeName |
| 23 | - return (tag === 'INPUT' || tag === 'TEXTAREA') | |
| 23 | + return (tag === 'INPUT' || tag === 'TEXTAREA') | |
| 24 | 24 | } |
| 25 | 25 | |
| 26 | 26 | function textFieldShortcuts (ev) { |
| 27 | 27 | if (ev.keyCode === 13 && ev.ctrlKey) { |
| @@ -30,10 +30,10 @@ | ||
| 30 | 30 | } |
| 31 | 31 | |
| 32 | 32 | function genericShortcuts (ev, { tabs, search }) { |
| 33 | 33 | |
| 34 | - // scroll to top | |
| 35 | - if (ev.keyCode === 71) { // g | |
| 34 | + // Messages | |
| 35 | + if (ev.keyCode === 71) { // gg = scroll to top | |
| 36 | 36 | if (!gPressed) { |
| 37 | 37 | gPressed = true |
| 38 | 38 | return |
| 39 | 39 | } |
| @@ -42,48 +42,55 @@ | ||
| 42 | 42 | gPressed = false |
| 43 | 43 | |
| 44 | 44 | switch (ev.keyCode) { |
| 45 | 45 | |
| 46 | - // scroll through messages | |
| 47 | - case 74: // j | |
| 46 | + // Messages (cont'd) | |
| 47 | + case 74: // j = older | |
| 48 | 48 | return tabs.get(tabs.selected[0]).firstChild.scroll(1) |
| 49 | - case 75: // k | |
| 49 | + case 75: // k = newer | |
| 50 | 50 | return tabs.get(tabs.selected[0]).firstChild.scroll(-1) |
| 51 | + case 13: // enter = open | |
| 52 | + return goToMessage(ev) | |
| 53 | + case 79: // o = open | |
| 54 | + return goToMessage(ev) | |
| 51 | 55 | |
| 52 | - // scroll through tabs | |
| 53 | - case 72: // h | |
| 56 | + // Tabs | |
| 57 | + case 72: // h = left | |
| 54 | 58 | return tabs.selectRelative(-1) |
| 55 | - case 76: // l | |
| 59 | + case 76: // l = right | |
| 56 | 60 | return tabs.selectRelative(1) |
| 57 | - | |
| 58 | - // close current tab | |
| 59 | - case 88: // x | |
| 61 | + case 88: // x = close | |
| 60 | 62 | if (tabs.selected) { |
| 61 | 63 | var sel = tabs.selected |
| 62 | 64 | var i = sel.reduce(function (a, b) { return Math.min(a, b) }) |
| 63 | 65 | tabs.remove(sel) |
| 64 | 66 | tabs.select(Math.max(i - 1, 0)) |
| 65 | 67 | } |
| 66 | 68 | return |
| 67 | 69 | |
| 68 | - // activate the search field | |
| 69 | - case 191: // / | |
| 70 | + // Search | |
| 71 | + case 191: // / = routes search | |
| 70 | 72 | if (ev.shiftKey) search.activate('?', ev) |
| 71 | 73 | else search.activate('/', ev) |
| 72 | 74 | return |
| 73 | - | |
| 74 | - // navigate to a feed | |
| 75 | - case 50: // 2 | |
| 75 | + case 50: // @ = mention search | |
| 76 | 76 | if (ev.shiftKey) search.activate('@', ev) |
| 77 | 77 | return |
| 78 | - | |
| 79 | - // navigate to a channel | |
| 80 | - case 51: // 3 | |
| 78 | + case 51: // # = channel search | |
| 81 | 79 | if (ev.shiftKey) search.activate('#', ev) |
| 82 | 80 | return |
| 83 | - | |
| 84 | - // navigate to a message | |
| 85 | - case 53: // 5 | |
| 81 | + case 53: // % = message search | |
| 86 | 82 | if (ev.shiftKey) search.activate('%', ev) |
| 87 | 83 | return |
| 88 | 84 | } |
| 89 | 85 | } |
| 86 | + | |
| 87 | + | |
| 88 | +function goToMessage (ev) { | |
| 89 | + const msg = ev.target | |
| 90 | + if (!msg.classList.contains('Message')) return | |
| 91 | + | |
| 92 | + // this uses a crudely exported nav api | |
| 93 | + const search = document.querySelector('input[type=search]') | |
| 94 | + search.go(msg.dataset.root) | |
| 95 | +} | |
| 96 | + | |
| message/html/layout/default.js | ||
|---|---|---|
| @@ -22,12 +22,12 @@ | ||
| 22 | 22 | |
| 23 | 23 | var rawMessage = Value(null) |
| 24 | 24 | |
| 25 | 25 | return h('Message', { |
| 26 | - 'ev-keydown': navigateToMessageOnEnter, | |
| 27 | 26 | attributes: { |
| 28 | 27 | tabindex: '0', // needed to be able to navigate and show focus() |
| 29 | 28 | 'data-key': msg.key, |
| 29 | + 'data-root': msg.value.content.root, | |
| 30 | 30 | 'data-text': msg.value.content.text |
| 31 | 31 | } |
| 32 | 32 | }, [ |
| 33 | 33 | h('section.avatar', {}, api.about.html.image(msg.value.author)), |
| @@ -39,19 +39,7 @@ | ||
| 39 | 39 | h('section.raw-content', rawMessage), |
| 40 | 40 | h('section.actions', {}, api.message.html.action(msg)), |
| 41 | 41 | h('footer.backlinks', {}, api.message.html.backlinks(msg)) |
| 42 | 42 | ]) |
| 43 | - | |
| 44 | - function navigateToMessageOnEnter (ev) { | |
| 45 | - // on enter (or 'o'), hit first meta. | |
| 46 | - if (!(ev.keyCode === 13 || ev.keyCode === 79)) return | |
| 47 | - | |
| 48 | - // unless in an input | |
| 49 | - if (ev.target.nodeName === 'INPUT' || ev.target.nodeName === 'TEXTAREA') return | |
| 50 | - | |
| 51 | - // this uses a crudely exported nav api | |
| 52 | - const search = document.querySelector('input[type=search]') | |
| 53 | - search.go(msg.value.content.root) | |
| 54 | - } | |
| 55 | 43 | } |
| 56 | 44 | } |
| 57 | 45 | |
Built with git-ssb-web