pages/search: add hints for actionbox

This commit is contained in:
He4eT 2024-01-26 16:28:41 +01:00
commit 85a8aaa8ff
3 changed files with 37 additions and 6 deletions

View file

@ -2,7 +2,11 @@ import { actionboxHandlers } from './actionboxHandlers.js'
const focusButtonsWithArrows = (e, abortCallback) => {
if (['ArrowUp', 'ArrowDown'].includes(e.key)) {
e.preventDefault()
if (document.activeElement.dataset.arrowNavigation === 'ignore') {
return
} else {
e.preventDefault()
}
const buttons = document.querySelectorAll('#searchResults > button')
if (buttons.length === 0) { return }

View file

@ -8,8 +8,35 @@
</head>
<body>
<header>
<input type='search' id='searchbox' placeholder='Enter search terms' autofocus />
<input type='search' id='actionbox' placeholder='Action (? for help)' />
<input
type='search'
id='searchbox'
placeholder='Enter search terms'
autofocus
/>
<input
type='input'
id='actionbox'
list='actions'
data-arrow-navigation='ignore'
placeholder='Action (? for help)'
/>
<datalist id='actions'>
<!-- @see actionboxHandlers.js -->
<option value='d'>d: Close (delete) tab</option>
<option value='D'>D: Close top tab</option>
<option value='c'>c: Duplicate (copy) tab</option>
<option value='C'>C: Duplicate top tab</option>
<option value='s'>s: Discard tab (put to sleep)</option>
<option value='S'>S: Discard all visible tabs</option>
<option value='e'>e: Move (extract) tab to popup window</option>
<option value='p'>p: Pin or unpin tab</option>
<option value='f'>f: Switch to tab</option>
<option value='F'>F: Switch to top tab</option>
<option value='q'>q: Close current tab</option>
<option value='?'>?: Open help page</option>
</datalist>
</header>
<main id='searchResults'></main>