From 880435d077a290cc69fa1b2e172320cc9152d265 Mon Sep 17 00:00:00 2001 From: Zach Bruggeman Date: Fri, 24 Mar 2017 16:49:07 -0700 Subject: [PATCH] Add autocomplete to search --- server/autocomplete.js | 30 +++++++ server/index.js | 15 +++- server/package.json | 5 ++ server/yarn.lock | 51 ++++++++++- src/App.vue | 5 +- src/components/Header.vue | 42 +-------- src/components/Search.vue | 175 ++++++++++++++++++++++++++++++++++++++ src/pages/Series.vue | 36 ++++++-- src/store/index.js | 1 + 9 files changed, 305 insertions(+), 55 deletions(-) create mode 100644 server/autocomplete.js create mode 100644 src/components/Search.vue diff --git a/server/autocomplete.js b/server/autocomplete.js new file mode 100644 index 0000000..8cf6828 --- /dev/null +++ b/server/autocomplete.js @@ -0,0 +1,30 @@ +const axios = require('axios') + +function autocompleteHandler (req, res) { + const country = req.url.replace('/autocomplete/', '') + axios.all([ + axios.get(`http://because.moe/json/${country}`), + axios.get('http://www.crunchyroll.com/ajax/?req=RpcApiSearch_GetSearchCandidates') + ]).then(axios.spread((a, b) => { + const moe = a.data.shows + const cr = JSON.parse(b.data.substring(10, b.data.length - 2)).data + + const filtered = cr + .filter((c) => c.type === 'Series' && !!(moe.find((m) => m.sites.crunchyroll && m.sites.crunchyroll === `http://www.crunchyroll.com${c.link}`))) + .map((c) => ({ + name: c.name, + id: c.id, + image: c.img + })) + + res.setHeader('Access-Control-Allow-Origin', '*') + res.setHeader('Content-Type', 'application/json') + res.end(JSON.stringify(filtered)) + })).catch((err) => { + console.error(err.message) + res.statusCode = 500 + res.end('something went wrong') + }) +} + +module.exports = autocompleteHandler diff --git a/server/index.js b/server/index.js index 03c834d..0dbe587 100644 --- a/server/index.js +++ b/server/index.js @@ -1,5 +1,16 @@ -const http = require('http'); -const srv = http.createServer((req, res) => res.end('love arrow shoot!')) +const http = require('http') +const compress = require('compression')() +const autocompleteHandler = require('./autocomplete') + +const srv = http.createServer((req, res) => { + compress(req, res, () => { + if (req.url.indexOf('/autocomplete') === 0) { + autocompleteHandler(req, res) + } else { + res.end('love arrow shoot!') + } + }) +}) const io = require('socket.io')(srv) io.origins('*:*') diff --git a/server/package.json b/server/package.json index 5b592d9..3e54431 100644 --- a/server/package.json +++ b/server/package.json @@ -6,9 +6,14 @@ "author": "Zach Bruggeman", "license": "MIT", "dependencies": { + "axios": "^0.15.3", + "compression": "^1.6.2", "socket.io": "^1.7.2" }, "scripts": { "start": "node index.js" + }, + "now": { + "alias": "umi-watch-api" } } diff --git a/server/yarn.lock b/server/yarn.lock index 24f0453..cd539ed 100644 --- a/server/yarn.lock +++ b/server/yarn.lock @@ -2,7 +2,7 @@ # yarn lockfile v1 -accepts@1.3.3: +accepts@1.3.3, accepts@~1.3.3: version "1.3.3" resolved "https://registry.yarnpkg.com/accepts/-/accepts-1.3.3.tgz#c3ca7434938648c3e0d9c1e328dd68b622c284ca" dependencies: @@ -17,6 +17,12 @@ arraybuffer.slice@0.0.6: version "0.0.6" resolved "https://registry.yarnpkg.com/arraybuffer.slice/-/arraybuffer.slice-0.0.6.tgz#f33b2159f0532a3f3107a272c0ccfbd1ad2979ca" +axios@^0.15.3: + version "0.15.3" + resolved "https://registry.yarnpkg.com/axios/-/axios-0.15.3.tgz#2c9d638b2e191a08ea1d6cc988eadd6ba5bdc053" + dependencies: + follow-redirects "1.0.0" + backo2@1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/backo2/-/backo2-1.0.2.tgz#31ab1ac8b129363463e35b3ebb69f4dfcfba7947" @@ -39,6 +45,10 @@ blob@0.0.4: version "0.0.4" resolved "https://registry.yarnpkg.com/blob/-/blob-0.0.4.tgz#bcf13052ca54463f30f9fc7e95b9a47630a94921" +bytes@2.3.0: + version "2.3.0" + resolved "https://registry.yarnpkg.com/bytes/-/bytes-2.3.0.tgz#d5b680a165b6201739acb611542aabc2d8ceb070" + callsite@1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/callsite/-/callsite-1.0.0.tgz#280398e5d664bd74038b6f0905153e6e8af1bc20" @@ -59,17 +69,34 @@ component-inherit@0.0.3: version "0.0.3" resolved "https://registry.yarnpkg.com/component-inherit/-/component-inherit-0.0.3.tgz#645fc4adf58b72b649d5cae65135619db26ff143" +compressible@~2.0.8: + version "2.0.10" + resolved "https://registry.yarnpkg.com/compressible/-/compressible-2.0.10.tgz#feda1c7f7617912732b29bf8cf26252a20b9eecd" + dependencies: + mime-db ">= 1.27.0 < 2" + +compression@^1.6.2: + version "1.6.2" + resolved "https://registry.yarnpkg.com/compression/-/compression-1.6.2.tgz#cceb121ecc9d09c52d7ad0c3350ea93ddd402bc3" + dependencies: + accepts "~1.3.3" + bytes "2.3.0" + compressible "~2.0.8" + debug "~2.2.0" + on-headers "~1.0.1" + vary "~1.1.0" + cookie@0.3.1: version "0.3.1" resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.3.1.tgz#e7e0a1f9ef43b4c8ba925c5c5a96e806d16873bb" -debug@2.2.0: +debug@2.2.0, debug@~2.2.0: version "2.2.0" resolved "https://registry.yarnpkg.com/debug/-/debug-2.2.0.tgz#f87057e995b1a1f6ae6a4960664137bc56f039da" dependencies: ms "0.7.1" -debug@2.3.3: +debug@2.3.3, debug@^2.2.0: version "2.3.3" resolved "https://registry.yarnpkg.com/debug/-/debug-2.3.3.tgz#40c453e67e6e13c901ddec317af8986cda9eff8c" dependencies: @@ -114,6 +141,12 @@ engine.io@1.8.3: engine.io-parser "1.3.2" ws "1.1.2" +follow-redirects@1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.0.0.tgz#8e34298cbd2e176f254effec75a1c78cc849fd37" + dependencies: + debug "^2.2.0" + has-binary@0.1.7: version "0.1.7" resolved "https://registry.yarnpkg.com/has-binary/-/has-binary-0.1.7.tgz#68e61eb16210c9545a0a5cce06a873912fe1e68c" @@ -136,6 +169,10 @@ json3@3.3.2: version "3.3.2" resolved "https://registry.yarnpkg.com/json3/-/json3-3.3.2.tgz#3c0434743df93e2f5c42aee7b19bcb483575f4e1" +"mime-db@>= 1.27.0 < 2": + version "1.27.0" + resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.27.0.tgz#820f572296bbd20ec25ed55e5b5de869e5436eb1" + mime-db@~1.26.0: version "1.26.0" resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.26.0.tgz#eaffcd0e4fc6935cf8134da246e2e6c35305adff" @@ -166,6 +203,10 @@ object-component@0.0.3: version "0.0.3" resolved "https://registry.yarnpkg.com/object-component/-/object-component-0.0.3.tgz#f0c69aa50efc95b866c186f400a33769cb2f1291" +on-headers@~1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/on-headers/-/on-headers-1.0.1.tgz#928f5d0f470d49342651ea6794b0857c100693f7" + options@>=0.0.5: version "0.0.6" resolved "https://registry.yarnpkg.com/options/-/options-0.0.6.tgz#ec22d312806bb53e731773e7cdaefcf1c643128f" @@ -240,6 +281,10 @@ ultron@1.0.x: version "1.0.2" resolved "https://registry.yarnpkg.com/ultron/-/ultron-1.0.2.tgz#ace116ab557cd197386a4e88f4685378c8b2e4fa" +vary@~1.1.0: + version "1.1.1" + resolved "https://registry.yarnpkg.com/vary/-/vary-1.1.1.tgz#67535ebb694c1d52257457984665323f587e8d37" + ws@1.1.2: version "1.1.2" resolved "https://registry.yarnpkg.com/ws/-/ws-1.1.2.tgz#8a244fa052401e08c9886cf44a85189e1fd4067f" diff --git a/src/App.vue b/src/App.vue index 76eb880..5343faf 100644 --- a/src/App.vue +++ b/src/App.vue @@ -61,14 +61,11 @@ export default { return `${window.location.origin}/room/${this.room.replace('umi//', '')}` }, routeName () { - return this.$store.state.route.name + return this.$route.name }, lights () { return this.$store.state.lights }, - showTabs () { - return this.$route.name === 'home' || this.$route.name === 'history' - }, roomBarClass () { return !this.connected ? 'hidden' : (this.hideBar ? 'peek' : 'show') } diff --git a/src/components/Header.vue b/src/components/Header.vue index 6f4aff8..f160fc4 100644 --- a/src/components/Header.vue +++ b/src/components/Header.vue @@ -13,10 +13,7 @@ History @@ -25,30 +22,20 @@ + + diff --git a/src/pages/Series.vue b/src/pages/Series.vue index c7468c5..bbbcd9c 100644 --- a/src/pages/Series.vue +++ b/src/pages/Series.vue @@ -33,6 +33,9 @@ +
+

This series is not available.

+
@@ -54,17 +57,21 @@ data () { return { selectedCollection: '', - sort: 'new' + sort: 'new', + seriesError: false } }, computed: { + seriesId () { + return this.$route.params.id + }, series () { const {$store, $route} = this - return $store.state.series[$route.params.id] + return $store.state.series[this.seriesId] }, collections () { const {$store, $route} = this - return $store.state.seriesCollections[$route.params.id] + return $store.state.seriesCollections[this.seriesId] }, sortedCollections () { return this.sort === 'old' ? this.collections : Array.from(this.collections).reverse() @@ -74,6 +81,17 @@ } }, methods: { + async getSeriesInfo () { + const {$store, $route} = this + + try { + await $store.dispatch('getSeriesInfo', this.seriesId) + await $store.dispatch('getCollectionsForSeries', this.series.series_id) + this.selectedCollection = this.sortedCollections[0] + } catch (err) { + this.seriesError = true + } + }, selectCollection ({target}) { if (this.selectedCollection === target.dataset.id) return @@ -87,12 +105,14 @@ this.selectedCollection = this.sortedCollections[0] } }, + watch: { + seriesId (curr) { + this.seriesError = false + this.getSeriesInfo() + } + }, async beforeMount () { - const {$store, $route} = this - - await $store.dispatch('getSeriesInfo', $route.params.id) - await $store.dispatch('getCollectionsForSeries', this.series.series_id) - this.selectedCollection = this.sortedCollections[0] + this.getSeriesInfo() } } diff --git a/src/store/index.js b/src/store/index.js index fbd7b36..842c39b 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -49,6 +49,7 @@ const store = new Vuex.Store({ const data = resp.data.data commit('UPDATE_AUTH', { session_id: data.session_id, + country: data.country_code.toLowerCase(), token: data.auth, expires: data.expires })