better search with configurable simultaneous search limit, fixes #234

This commit is contained in:
Milos Stojanovic
2021-07-08 14:26:05 +02:00
parent 9612793c98
commit 203d422ad5
2 changed files with 20 additions and 4 deletions

View File

@@ -19,6 +19,7 @@ return [
'editable' => ['.txt', '.css', '.js', '.ts', '.html', '.php', '.json', '.md'], 'editable' => ['.txt', '.css', '.js', '.ts', '.html', '.php', '.json', '.md'],
'date_format' => 'YY/MM/DD hh:mm:ss', // see: https://momentjs.com/docs/#/displaying/format/ 'date_format' => 'YY/MM/DD hh:mm:ss', // see: https://momentjs.com/docs/#/displaying/format/
'guest_redirection' => '', // useful for external auth adapters 'guest_redirection' => '', // useful for external auth adapters
'search_simultaneous' => 5,
'filter_entries' => [], 'filter_entries' => [],
], ],

View File

@@ -4,11 +4,11 @@
<p class="modal-card-title"> <p class="modal-card-title">
{{ lang('Search') }} {{ lang('Search') }}
</p> </p>
<b-loading :is-full-page="false" :active.sync="searching" />
</header> </header>
<section class="modal-card-body"> <section class="modal-card-body">
<b-input ref="input" v-model="term" @input="searchFiles" :placeholder="lang('Name')" /> <b-input ref="input" v-model="term" @input="searchFiles" :placeholder="lang('Name')" />
<br> <br>
<b-loading :is-full-page="false" :active.sync="searching" />
<ul ref="results"> <ul ref="results">
<li v-for="(item, index) in results" :key="index"> <li v-for="(item, index) in results" :key="index">
<a @click="select(item)">{{ item.file.path }}</a> <a @click="select(item)">{{ item.file.path }}</a>
@@ -33,6 +33,7 @@ export default {
return { return {
active: false, active: false,
searching: false, searching: false,
pending_getdirs: 0,
term: '', term: '',
results: [], results: [],
} }
@@ -40,7 +41,12 @@ export default {
mounted() { mounted() {
this.active = true this.active = true
this.searching = false this.searching = false
this.pending_getdirs = 0
this.$refs.input.focus() this.$refs.input.focus()
if (!this.$store.state.config.search_simultaneous) {
this.$store.state.config.search_simultaneous = 5
}
}, },
beforeDestroy() { beforeDestroy() {
this.active = false this.active = false
@@ -55,17 +61,26 @@ export default {
this.results = [] this.results = []
if (val.length > 0) { if (val.length > 0) {
this.searching = true this.searching = true
this.getDir('/') this.getDirLimited('/')
} }
}, 1000), }, 1000),
getDirLimited(path) {
let interval = setInterval(() => {
if (this.active && this.pending_getdirs < this.$store.state.config.search_simultaneous) {
this.pending_getdirs++
clearInterval(interval)
this.getDir(path)
}
}, 200)
},
getDir(path) { getDir(path) {
if (!this.active) return
this.searching = true this.searching = true
api.getDir({ api.getDir({
dir: path dir: path
}) })
.then(ret => { .then(ret => {
this.searching = false this.searching = false
this.pending_getdirs--
_.forEach(ret.files, item => { _.forEach(ret.files, item => {
if (item.name.toLowerCase().indexOf(this.term.toLowerCase()) > -1) { if (item.name.toLowerCase().indexOf(this.term.toLowerCase()) > -1) {
this.results.push({ this.results.push({
@@ -75,7 +90,7 @@ export default {
} }
}) })
_.forEach(_.filter(ret.files, ['type', 'dir']), subdir => { _.forEach(_.filter(ret.files, ['type', 'dir']), subdir => {
this.getDir(subdir.path) this.getDirLimited(subdir.path)
}) })
}) })
.catch(error => this.handleError(error)) .catch(error => this.handleError(error))