mirror of
https://github.com/He4eT/tabswitcher.git
synced 2026-05-04 17:07:23 +00:00
pages/search: add hints for actionbox
This commit is contained in:
parent
6b3fa3fbb3
commit
85a8aaa8ff
3 changed files with 37 additions and 6 deletions
|
|
@ -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 }
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue