mirror of
https://github.com/He4eT/tabswitcher.git
synced 2026-05-04 17:07:23 +00:00
pages/search: improve usability
This commit is contained in:
parent
9c24d16071
commit
dbb7724253
3 changed files with 16 additions and 10 deletions
|
|
@ -10,19 +10,25 @@ export const actionboxHandlers = (commandQuery, store, flush) => {
|
||||||
|
|
||||||
({
|
({
|
||||||
'?': openHelp,
|
'?': openHelp,
|
||||||
'x': closeCurrentTab,
|
'q': closeCurrentTab,
|
||||||
'r': reloadCurrentTab,
|
'r': reloadCurrentTab,
|
||||||
/* */
|
/* */
|
||||||
'f': switchToTab,
|
'f': switchToTab,
|
||||||
'd': closeTab,
|
'd': closeTab,
|
||||||
'c': duplicateTab,
|
'c': duplicateTab,
|
||||||
|
/* TODO */
|
||||||
|
// 'p': Pin or unpin the tab
|
||||||
|
// 'm': Mute or unmute the tab
|
||||||
|
// 's': Put the tab to sleep
|
||||||
|
// 'e': Pop the tab into it's own window with minimal UI
|
||||||
}[command] ?? noop(command))(store, label, flush)
|
}[command] ?? noop(command))(store, label, flush)
|
||||||
}
|
}
|
||||||
|
|
||||||
/* */
|
/* */
|
||||||
|
|
||||||
function openHelp () {
|
function openHelp () {
|
||||||
|
const helpLink = 'https://github.com/He4eT/tabswitcher#Tabswitcher'
|
||||||
|
location.href = helpLink
|
||||||
}
|
}
|
||||||
|
|
||||||
function closeCurrentTab () {
|
function closeCurrentTab () {
|
||||||
|
|
@ -44,7 +50,6 @@ function switchToTab (store, label) {
|
||||||
const tab = getTabByLabel(store, label)
|
const tab = getTabByLabel(store, label)
|
||||||
if (tab) {
|
if (tab) {
|
||||||
store.actions.goToTab(tab.id)
|
store.actions.goToTab(tab.id)
|
||||||
flush()
|
|
||||||
closeCurrentTab()
|
closeCurrentTab()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -52,18 +57,18 @@ function switchToTab (store, label) {
|
||||||
function closeTab (store, label, flush) {
|
function closeTab (store, label, flush) {
|
||||||
const tab = getTabByLabel(store, label)
|
const tab = getTabByLabel(store, label)
|
||||||
if (tab) {
|
if (tab) {
|
||||||
store.actions.closeTab(tab.id)
|
|
||||||
flush()
|
flush()
|
||||||
|
store.actions.closeTab(tab.id)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function duplicateTab (store, label, flush) {
|
function duplicateTab (store, label, flush) {
|
||||||
const tab = getTabByLabel(store, label)
|
const tab = getTabByLabel(store, label)
|
||||||
if (tab) {
|
if (tab) {
|
||||||
|
flush()
|
||||||
browser.tabs.create({
|
browser.tabs.create({
|
||||||
active: false,
|
active: false,
|
||||||
url: tab.url,
|
url: tab.url,
|
||||||
}).then(store.actions.updateState)
|
}).then(store.actions.updateState)
|
||||||
flush()
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -80,11 +80,9 @@ export const attachInputHandlers = (store) => {
|
||||||
searchBox.addEventListener('keydown', (e) => {
|
searchBox.addEventListener('keydown', (e) => {
|
||||||
if (e.key === 'Enter') {
|
if (e.key === 'Enter') {
|
||||||
let visibleTabs = store.getCurrentState().results
|
let visibleTabs = store.getCurrentState().results
|
||||||
if (visibleTabs.length === 1) {
|
if (visibleTabs.length > 0) {
|
||||||
const tabId = visibleTabs[0].obj.id
|
const tabId = visibleTabs[0].obj.id
|
||||||
switchToTab(tabId)
|
switchToTab(tabId)
|
||||||
} else {
|
|
||||||
actionbox.focus()
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
||||||
|
|
@ -8,11 +8,14 @@
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
<header>
|
||||||
<input type='search' id='searchbox' placeholder='Filter' autofocus />
|
<input type='search' id='searchbox' placeholder='Enter search terms' autofocus />
|
||||||
<input type='search' id='actionbox' placeholder='Action (? for help)' />
|
<input type='search' id='actionbox' placeholder='Action (? for help)' />
|
||||||
</header>
|
</header>
|
||||||
<main id='searchResults'></main>
|
<main id='searchResults'></main>
|
||||||
<script type="text/javascript" src="./vendor/fuzzysort.js"></script>
|
|
||||||
|
<!-- https://github.com/farzher/fuzzysort/blob/4096947da28d0831ee2a8ca67257c0b0c84915d1/fuzzysort.js -->
|
||||||
|
<script src="./vendor/fuzzysort.js"></script>
|
||||||
|
<!-- -->
|
||||||
<script type='module' src='./search.js'></script>
|
<script type='module' src='./search.js'></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue