src/App.vue

@@ -5,13 +5,14 @@
         <div class="navbar-brand">
           <router-link to="/" class="navbar-item">Ekster</router-link>
 
-          <a role="button" :class="{'navbar-burger':true,'is-active':menuActive}" aria-label="menu" aria-expanded="false" @click="toggleMenu">
+          <a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
             <span aria-hidden="true"></span>
             <span aria-hidden="true"></span>
             <span aria-hidden="true"></span>
           </a>
+
         </div>
-        <div :class="{'navbar-menu':true,'is-active':menuActive}">
+        <div class="navbar-menu">
           <div class="navbar-end">
             <div class="buttons">
               <button class="button is-light" @click="openSearch">Search</button>
@@ -41,18 +42,10 @@
         this.$store.dispatch('startEventListening', '?action=events')
       }
     },
-    computed: {
-      menuActive() {
-        return this.$store.state.menuActive
-      }
-    },
     methods: {
       openSearch () {
         this.$store.dispatch('openSearch')
-      },
-      toggleMenu () {
-        this.$store.dispatch('toggleMenu' )
-      },
+      }
     }
   }
 </script>

src/components/Channels.vue

@@ -3,7 +3,7 @@
     <div class="channels--channel" v-for="channel in channels" :key="channel.uid">
       <slot :channel="channel"></slot>
     </div>
-    <button class="button is-primary is-small" @click="open">New Channel</button>
+    <button class="button is-primary" @click="open">+ New Channel</button>
   </div>
 </template>
 

src/components/Entry.vue

@@ -216,18 +216,15 @@ export default {
       },
       toggleHiddenContent() {
         this.hiddenContentVisible = !this.hiddenContentVisible
-        // const el = this.$refs['content-container']
-        // el.scrollIntoView(true)
+        const el = this.$refs['content-container']
+        el.scrollIntoView(true)
       }
     },
 
     mounted() {
       this.showFooterButtons = true
       const el = this.$refs['content-container']
-      this.hiddenContentVisible = false
-      this.$nextTick(() => {
-        this.hasHiddenContent = el.scrollHeight > el.clientHeight
-      })
+      this.hasHiddenContent = el.scrollHeight > el.clientHeight
     },
 
     computed: {
@@ -380,10 +377,8 @@ export default {
             console.log('ref content-container not found')
             return
           }
+          this.hasHiddenContent = el.scrollHeight > el.clientHeight
           this.hiddenContentVisible = false
-          this.$nextTick(() => {
-            this.hasHiddenContent = el.scrollHeight > el.clientHeight
-          })
         })
       }
     }

src/components/SearchPopup.vue

@@ -16,14 +16,7 @@
             <button :class="searchClasses" @click="search">Search</button>
           </div>
         </div>
-
-        <div class="field">
-          <div class="control">
-            <label for="global" class="radio"><input type="radio" name="channel" id="global" value="global" v-model="searchChannel"> Global</label>
-            <label for="channel" class="radio"><input type="radio" name="channel" id="channel" value="channel" v-model="searchChannel"> Channel</label>
-          </div>
-        </div>
-
+        
         <div class="timeline--item" v-for="item in searchItems" :key="item.id">
           <TimelineEntry :item="item" :is-main-entry="true" @debug="debug" />
         </div>
@@ -45,8 +38,7 @@ export default {
     return {
       query: '',
       loading: false,
-      error: '',
-      searchChannel: 'global'
+      error: ''
     }
   },
   mounted () {
@@ -73,7 +65,7 @@ export default {
     search () {
       this.loading = true
       this.error = ''
-      this.$store.dispatch('startQuery', {query: this.query, channel: this.searchChannel})
+      this.$store.dispatch('startQuery', this.query)
         .then(result => {
           this.loading = false
           if (result.error) {

src/components/Timeline.vue

@@ -4,9 +4,6 @@
       <TimelineEntry :item="item" @debug="debug" @markRead="markRead(channel.uid, ...arguments)" @followFeed="$emit('followFeed', arguments[0])"
                      :is-main-entry="true"/>
     </div>
-    <div v-if="items.length === 0">
-      <p class="text-center">No items in this timeline</p>
-    </div>
     <div class="level">
       <div class="level-item">
         <button class="button" @click="prevPage" v-if="timeline.paging.before">Prev Page</button>

src/store.js

@@ -22,8 +22,7 @@ export default new Vuex.Store({
       globalTimeline: {items: []},
       debug: false,
       debugItem: {},
-      debugVisible: false,
-      menuActive: false,
+      debugVisible: false
     };
     let loginData = JSON.parse(window.localStorage.getItem('login_data'))
     if (loginData) {
@@ -80,19 +79,21 @@ export default new Vuex.Store({
           'Authorization': 'Bearer ' + this.state.access_token
         }
       })
-      // state.eventSource.addEventListener('open', evt => {
-      //   // eslint-disable-next-line
-      //   console.log(evt)
-      // })
-      // state.eventSource.addEventListener('ping', evt => {
-      //   // eslint-disable-next-line
-      //   console.log(evt)
-      // })
-      // state.eventSource.addEventListener('message', evt => {
-      //   // eslint-disable-next-line
-      //   console.log(evt)
-      // })
+      state.eventSource.addEventListener('open', evt => {
+        // eslint-disable-next-line
+        console.log(evt)
+      })
+      state.eventSource.addEventListener('ping', evt => {
+        // eslint-disable-next-line
+        console.log(evt)
+      })
+      state.eventSource.addEventListener('message', evt => {
+        // eslint-disable-next-line
+        console.log(evt)
+      })
       state.eventSource.addEventListener('error', evt => {
+        // eslint-disable-next-line
+        console.log(evt)
         if (evt.message === "network error") {
           state.eventSource.close()
         }
@@ -110,6 +111,8 @@ export default new Vuex.Store({
         }
       })
       state.eventSource.addEventListener('new item in channel', evt => {
+        // eslint-disable-next-line
+        console.log(evt)
         let msg = JSON.parse(evt.data)
         let channel = _.find(state.channels, item => item.uid === msg.uid)
         if (channel) {
@@ -118,6 +121,8 @@ export default new Vuex.Store({
       })
 
       state.eventSource.addEventListener('new channel', evt => {
+        // eslint-disable-next-line
+        console.log(evt)
         let msg = JSON.parse(evt.data)
         let channel = _.find(state.channels, it => it.uid === msg.channel.uid)
         if (!channel) {
@@ -126,6 +131,8 @@ export default new Vuex.Store({
       })
 
       state.eventSource.addEventListener('update channel', evt => {
+        // eslint-disable-next-line
+        console.log(evt)
         let msg = JSON.parse(evt.data)
         let channel = _.find(state.channels, it => it.uid === msg.channel.uid)
         if (channel) {
@@ -134,8 +141,10 @@ export default new Vuex.Store({
       })
 
       state.eventSource.addEventListener('delete channel', evt => {
+        // eslint-disable-next-line
+        console.log(evt)
         let msg = JSON.parse(evt.data)
-        state.channels = _.filter(state.channels, it => it.uid !== msg.uid)
+        state.channels = _.remove(state.channels, it => it.uid === msg.uid)
       })
     },
     newSearchResults(state, items) {
@@ -147,9 +156,6 @@ export default new Vuex.Store({
     },
     closeDebugPopup(state) {
       state.debugVisible = false
-    },
-    activateMenu(state) {
-      state.menuActive = !state.menuActive
     }
   },
 
@@ -169,9 +175,6 @@ export default new Vuex.Store({
       commit('clearTimeline', {channel: channel})
     },
     fetchTimeline({commit}, channel) {
-      if (!channel.uid) {
-        channel.uid = 'home';
-      }
       let url = this.state.microsubEndpoint + '?action=timeline&channel=' + channel.uid
       if (channel.after) {
         url += '&after=' + channel.after;
@@ -258,22 +261,14 @@ export default new Vuex.Store({
       commit('setSearchPopupState', false)
     },
     startQuery({state, commit}, query) {
-      let channel
-      if (query.channel) {
-        if (query.channel === 'global') {
-          channel = 'global'
-        } else if (query.channel === 'channel') {
-          if (state.channel !== null && state.channel.uid !== null) {
-            channel = state.channel.uid
-          }
-        } else {
-          channel = 'global'
-        }
+      let channel = 'global'
+      if (state.channel !== null && state.channel.uid !== null && state.channel.uid !== 'home') {
+        channel = state.channel.uid
       }
       const url = new URL(this.state.microsubEndpoint)
       url.searchParams.set('action', 'search')
       url.searchParams.set('channel', channel)
-      url.searchParams.set('query', query.query)
+      url.searchParams.set('query', query)
       return fetch(url.toString(), {
         headers: {
           'Authorization': 'Bearer ' + this.state.access_token
@@ -323,7 +318,7 @@ export default new Vuex.Store({
       }
     },
     startEventListening({commit}, url) {
-      return commit('createEventSource', url)
+      commit('createEventSource', url)
     },
     openDebug({commit}, item) {
       return commit('openDebugPopup', item)
@@ -331,8 +326,5 @@ export default new Vuex.Store({
     closeDebug({commit}) {
       return commit('closeDebugPopup')
     },
-    toggleMenu({commit}) {
-      return commit('activateMenu')
-    }
   }
 })

src/views/Home.vue

@@ -3,7 +3,7 @@
     <div class="column" style="padding-top: 20px">
       <button class="channels-toggle button" type="button" @click="showChannels">Channels</button>
 
-      <Channels :class="channelsClass" :channels="this.channels">
+      <Channels :class="channelsClass" :channels="this.$store.state.channels">
         <div slot-scope="{ channel }">
           <Channel :channel="channel" @channel-selected="selectChannel"></Channel>
         </div>
@@ -11,14 +11,14 @@
     </div>
 
     <div class="timeline column is-three-fifths">
-      <div class="level is-mobile">
+      <div class="level">
         <div class="level-left">
           <h1 class="title is-5">{{ channel.name }}</h1>
         </div>
         <div class="level-right timeline-buttons">
           <div class="level-item">
-            <button class="button is-small" @click.prevent="openPost">New Post</button>
-            <button class="button is-small" @click.prevent="openFeedFollower('')">Add feed</button>
+            <button class="button" @click.prevent="openPost">New Post</button>
+            <button class="button" @click.prevent="openFeedFollower('')">Add feed</button>
           </div>
         </div>
       </div>
@@ -80,9 +80,6 @@
       channel() {
         return this.$store.state.channel
       },
-      channels() {
-        return this.$store.state.channels
-      },
       channelsClass () {
         return {
           'channels-open': this.channelsVisible,