Add start of event sourcing

package.json

@@ -8,6 +8,7 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
+    "event-source-polyfill": "0.0.16",
     "isomorphic-fetch": "^2.2.1",
     "micropub-helper": "^1.4.0",
     "moment": "^2.22.2",

src/components/NewPost.vue

@@ -11,9 +11,19 @@
               <textarea class="textarea" v-model="newPost"></textarea>
             </div>
           </div>
-          <div class="field">
+          <div class="level">
-            <div class="control">
+            <div class="level-left">
-              <button class="button is-primary" @click="post">Post</button>
+              <div class="level-item">
+                <div class="field">
+                  <div class="control">
+                    <button class="button is-primary" @click="post">Post</button>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div class="level-right">
+              <div class="level-item">
+              </div>
             </div>
           </div>
         </div>
@@ -27,7 +37,8 @@
     name: "NewPost",
     data() {
       return {
-        newPost: ''
+        newPost: '',
+        tags: [{name:"twitter"},{name:"instagram"}]
       }
     },
     methods: {

src/store.js

@@ -1,6 +1,7 @@
 import Vue from 'vue'
 import Vuex from 'vuex'
 import Micropub from 'micropub-helper';
+import EventSource from 'eventsource'
 
 Vue.use(Vuex)
 
@@ -13,8 +14,9 @@ export default new Vuex.Store({
       debug: false,
       logged_in: false,
       micropubEndpoint: '',
-      microsubEndpoint: '',
+      microsubEndpoint: '/microsub',
-      channelCreatorIsOpen: false
+      channelCreatorIsOpen: false,
+      eventSource: null
     };
     let loginData = JSON.parse(window.localStorage.getItem('login_data'))
     if (loginData) {
@@ -51,6 +53,29 @@ export default new Vuex.Store({
     },
     setChannelCreatorState(state, open) {
       state.channelCreatorIsOpen = open
+    },
+    createEventSource(state, url) {
+      state.eventSource = new EventSource(state.microsubEndpoint + url, {
+        headers: {
+          '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('error', evt => {
+        // eslint-disable-next-line
+        console.log(evt)
+      })
     }
   },
 
@@ -153,6 +178,9 @@ export default new Vuex.Store({
       if (count > 0) {
         this.dispatch('fetchChannels')
       }
+    },
+    startEventListening({commit}, url) {
+      commit('createEventSource', url)
     }
   }
 })