diff options
| -rw-r--r-- | nuxt.config.js | 3 | ||||
| -rw-r--r-- | package.json | 1 | ||||
| -rw-r--r-- | src/site/components/grid/Grid.vue | 24 | ||||
| -rw-r--r-- | src/site/plugins/flexsearch.js | 16 | ||||
| -rw-r--r-- | yarn.lock | 5 |
5 files changed, 47 insertions, 2 deletions
diff --git a/nuxt.config.js b/nuxt.config.js index 42ccc4e..9f2b0c2 100644 --- a/nuxt.config.js +++ b/nuxt.config.js @@ -58,7 +58,8 @@ export default { '~/plugins/buefy', '~/plugins/v-clipboard', '~/plugins/vue-isyourpasswordsafe', - '~/plugins/vue-timeago' + '~/plugins/vue-timeago', + '~/plugins/flexsearch' ], serverMiddleware: [ { path: '/', handler: serveStatic(path.join(__dirname, 'uploads')) } diff --git a/package.json b/package.json index 8b43196..42a99eb 100644 --- a/package.json +++ b/package.json @@ -46,6 +46,7 @@ "express": "^4.16.4", "express-rate-limit": "^3.4.0", "file-saver": "^2.0.1", + "flexsearch": "^0.6.22", "fluent-ffmpeg": "^2.1.2", "fs-jetpack": "^2.2.2", "helmet": "^3.15.1", diff --git a/src/site/components/grid/Grid.vue b/src/site/components/grid/Grid.vue index 027bdf2..eaeb4f7 100644 --- a/src/site/components/grid/Grid.vue +++ b/src/site/components/grid/Grid.vue @@ -79,6 +79,13 @@ <Waterfall :gutterWidth="10" :gutterHeight="4"> + <!-- Gotta implement search and pagination here --> + <input v-model="searchTerm" + type="text" + placeholder="Search..." + @input="search()" + @keyup.enter="search()"> + <WaterfallItem v-for="(item, index) in files" v-if="showWaterfall && item.thumb" :key="index" @@ -153,14 +160,29 @@ export default { } }, data() { - return { showWaterfall: true }; + return { + showWaterfall: true, + searchTerm: null + }; }, computed: { config() { return this.$store.state.config; } }, + mounted() { + this.$search.items(this.files); + }, methods: { + async search() { + const data = await this.$search.do(this.searchTerm, [ + 'name', + 'original', + 'type', + 'albums:name' + ]); + console.log('> Search result data', data); + }, deleteFile(file, index) { this.$dialog.confirm({ title: 'Deleting file', diff --git a/src/site/plugins/flexsearch.js b/src/site/plugins/flexsearch.js new file mode 100644 index 0000000..595b180 --- /dev/null +++ b/src/site/plugins/flexsearch.js @@ -0,0 +1,16 @@ +import Vue from 'vue'; +import FlexSearch from 'flexsearch'; +const search = new FlexSearch('speed'); + +// https://github.com/nextapps-de/flexsearch + +Vue.prototype.$search = { + items: async items => { + await search.clear(); + await search.add(items); + }, + do: async (term, field) => { + const results = await search.search(term, { field }); + return results; + } +}; @@ -3618,6 +3618,11 @@ flatten@^1.0.2: resolved "https://registry.yarnpkg.com/flatten/-/flatten-1.0.2.tgz#dae46a9d78fbe25292258cc1e780a41d95c03782" integrity sha1-2uRqnXj74lKSJYzB54CkHZXAN4I= +flexsearch@^0.6.22: + version "0.6.22" + resolved "https://registry.yarnpkg.com/flexsearch/-/flexsearch-0.6.22.tgz#7e3966a3c117ffc4381f5ad065f0a89b2b7418ed" + integrity sha512-Nit36q5LQlFEaLPckjN3xO9y0dZEb6rTDT7MIqlNdLe+5kGiHcBvAiBZBUR5DNZ+ySW6WGF8gCaud4eQocTUnw== + fluent-ffmpeg@^2.1.2: version "2.1.2" resolved "https://registry.yarnpkg.com/fluent-ffmpeg/-/fluent-ffmpeg-2.1.2.tgz#c952de2240f812ebda0aa8006d7776ee2acf7d74" |