diff --git a/src/App.vue b/src/App.vue index 6d1e796..2fe76ad 100644 --- a/src/App.vue +++ b/src/App.vue @@ -13,7 +13,11 @@ @@ -37,6 +41,11 @@ this.$store.dispatch('isLoggedIn', loginData) this.$store.dispatch('startEventListening', '?action=events') } + }, + methods: { + openSearch () { + this.$store.dispatch('openSearch') + } } } diff --git a/src/components/SearchPopup.vue b/src/components/SearchPopup.vue new file mode 100644 index 0000000..9d18c83 --- /dev/null +++ b/src/components/SearchPopup.vue @@ -0,0 +1,74 @@ + + + + + diff --git a/src/components/Timeline.vue b/src/components/Timeline.vue index 8ccc2e2..2371f25 100644 --- a/src/components/Timeline.vue +++ b/src/components/Timeline.vue @@ -104,4 +104,4 @@ justify-content: end; padding: 12px; } - \ No newline at end of file + diff --git a/src/store.js b/src/store.js index 0a72fb9..cbec926 100644 --- a/src/store.js +++ b/src/store.js @@ -17,6 +17,8 @@ export default new Vuex.Store({ micropubEndpoint: '', microsubEndpoint: '/microsub', channelCreatorIsOpen: false, + searchPopupIsOpen: true, + searchItems: [], eventSource: null, globalTimeline: {items: [{name: 'Testing the global timeline'}]} }; @@ -58,6 +60,10 @@ export default new Vuex.Store({ setChannelCreatorState(state, open) { state.channelCreatorIsOpen = open }, + setSearchPopupState(state, open) { + state.searchPopupIsOpen = open + state.searchItems = [] + }, newEndpoints(state, endpoints) { state.micropubEndpoint = endpoints.micropubEndpoint state.microsubEndpoint = endpoints.microsubEndpoint @@ -138,6 +144,9 @@ export default new Vuex.Store({ let msg = JSON.parse(evt.data) state.channels = _.remove(state.channels, it => it.uid === msg.uid) }) + }, + newSearchResults(state, items) { + state.searchItems = items } }, @@ -236,6 +245,23 @@ export default new Vuex.Store({ closeChannelCreator({commit}) { commit('setChannelCreatorState', false) }, + openSearch({commit}) { + commit('setSearchPopupState', true) + }, + closeSearch({commit}) { + commit('setSearchPopupState', false) + }, + startQuery({commit}, query) { + fetch(this.state.microsubEndpoint + '?action=search&channel=global&query='+query, { + headers: { + 'Authorization': 'Bearer ' + this.state.access_token + }, + method: 'POST' + }).then(response => response.json()) + .then(response => { + commit('newSearchResults', response.items) + }) + }, createChannel(x, name) { let url = this.state.microsubEndpoint + '?action=channels&name=' + encodeURIComponent(name) return fetch(url, { diff --git a/src/views/Home.vue b/src/views/Home.vue index 67d56eb..1ce2aaa 100644 --- a/src/views/Home.vue +++ b/src/views/Home.vue @@ -33,6 +33,7 @@ + @@ -44,6 +45,7 @@ import FeedFollower from "../components/FeedFollower" import NewPost from "../components/NewPost" import ShortTimeline from "../components/ShortTimeline"; + import SearchPopup from "../components/SearchPopup"; export default { name: 'home', @@ -54,7 +56,8 @@ Channel, ChannelCreator, NewPost, - ShortTimeline + ShortTimeline, + SearchPopup }, data() { @@ -78,6 +81,9 @@ 'channels-open': this.channelsVisible, 'channels': true } + }, + searchPopupIsOpen () { + return this.$store.state.searchPopupIsOpen } },