mirror of
https://github.com/TeamPiped/Piped.git
synced 2024-11-23 05:57:21 +00:00
Merge pull request #2980 from Bnyro/anchor-search-suggestions
feat: allow middle clicks to open search suggestions in new tab
This commit is contained in:
commit
1bedd48292
@ -183,7 +183,9 @@ export default {
|
|||||||
this.suggestionsVisible = true;
|
this.suggestionsVisible = true;
|
||||||
},
|
},
|
||||||
onInputBlur() {
|
onInputBlur() {
|
||||||
this.suggestionsVisible = false;
|
// the search suggestions will be hidden after some seconds
|
||||||
|
// otherwise anchor links won't work!
|
||||||
|
setTimeout(() => (this.suggestionsVisible = false), 200);
|
||||||
},
|
},
|
||||||
onSearchTextChange(searchText) {
|
onSearchTextChange(searchText) {
|
||||||
this.searchText = searchText;
|
this.searchText = searchText;
|
||||||
|
@ -1,15 +1,14 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="suggestions-container absolute">
|
<div class="suggestions-container absolute">
|
||||||
<ul>
|
<ul>
|
||||||
<li
|
<li v-for="(suggestion, i) in searchSuggestions" :key="i" @mouseover="onMouseOver(i)">
|
||||||
v-for="(suggestion, i) in searchSuggestions"
|
<router-link
|
||||||
:key="i"
|
class="suggestion"
|
||||||
class="suggestion"
|
:class="{ 'suggestion-selected': selected === i }"
|
||||||
:class="{ 'suggestion-selected': selected === i }"
|
:to="`/results?search_query=${encodeURIComponent(suggestion)}`"
|
||||||
@mouseover="onMouseOver(i)"
|
>{{ suggestion }}</router-link
|
||||||
@mousedown.stop="onClick(i)"
|
>
|
||||||
v-text="suggestion"
|
</li>
|
||||||
/>
|
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -71,10 +70,6 @@ export default {
|
|||||||
},
|
},
|
||||||
onClick(i) {
|
onClick(i) {
|
||||||
this.setSelected(i);
|
this.setSelected(i);
|
||||||
this.$router.push({
|
|
||||||
name: "SearchResults",
|
|
||||||
query: { search_query: this.searchSuggestions[i] },
|
|
||||||
});
|
|
||||||
},
|
},
|
||||||
setSelected(val) {
|
setSelected(val) {
|
||||||
this.selected = val;
|
this.selected = val;
|
||||||
@ -102,6 +97,6 @@ export default {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.suggestion {
|
.suggestion {
|
||||||
@apply p-1;
|
@apply block w-full p-1;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
Loading…
Reference in New Issue
Block a user