kb ext bar: mark modifier key as modifier, add Esc

box-drawing
cpsdqs 7 years ago
parent 842d1fd93c
commit 8e513cbb70
Signed by untrusted user: cpsdqs
GPG Key ID: 3F59586BB7448DD1
  1. 15
      js/term/soft_keyboard.js
  2. 5
      sass/pages/_term.scss

@ -117,14 +117,17 @@ module.exports = function (screen, input) {
// shortcut bar // shortcut bar
const shortcuts = { const shortcuts = {
Control: 'ctrl',
Esc: 0x1b,
Tab: 0x09, Tab: 0x09,
'←': 0x25, '←': 0x25,
'↓': 0x28, '↓': 0x28,
'↑': 0x26, '↑': 0x26,
'→': 0x27, '→': 0x27
Control: 'ctrl'
} }
let touchMoved = false
for (const shortcut in shortcuts) { for (const shortcut in shortcuts) {
const button = document.createElement('button') const button = document.createElement('button')
button.classList.add('shortcut-button') button.classList.add('shortcut-button')
@ -132,22 +135,30 @@ module.exports = function (screen, input) {
shortcutBar.appendChild(button) shortcutBar.appendChild(button)
const key = shortcuts[shortcut] const key = shortcuts[shortcut]
if (typeof key === 'string') button.classList.add('modifier')
button.addEventListener('touchstart', e => { button.addEventListener('touchstart', e => {
touchMoved = false
if (typeof key === 'string') { if (typeof key === 'string') {
// modifier button // modifier button
input.softModifiers[key] = true input.softModifiers[key] = true
button.classList.add('enabled')
// prevent default. This prevents scrolling, but also prevents the // prevent default. This prevents scrolling, but also prevents the
// selection popup // selection popup
e.preventDefault() e.preventDefault()
} }
}) })
window.addEventListener('touchmove', e => {
touchMoved = true
})
button.addEventListener('touchend', e => { button.addEventListener('touchend', e => {
e.preventDefault() e.preventDefault()
if (typeof key === 'number') { if (typeof key === 'number') {
if (touchMoved) return
let fakeEvent = { which: key, preventDefault: () => {} } let fakeEvent = { which: key, preventDefault: () => {} }
input.handleKeyDown(fakeEvent) input.handleKeyDown(fakeEvent)
} else if (typeof key === 'string') { } else if (typeof key === 'string') {
button.classList.remove('enabled')
input.softModifiers[key] = false input.softModifiers[key] = false
} }
}) })

@ -229,6 +229,11 @@ body.term {
margin: 0 10px 0 0; margin: 0 10px 0 0;
font-family: -apple-system, sans-serif; font-family: -apple-system, sans-serif;
min-width: 2em; min-width: 2em;
&.modifier:not(.enabled) {
background: #9ea6b1;
color: #000;
}
} }
} }

Loading…
Cancel
Save