diff options
Diffstat (limited to 'app/components/posts.js')
| -rw-r--r-- | app/components/posts.js | 24 |
1 files changed, 12 insertions, 12 deletions
diff --git a/app/components/posts.js b/app/components/posts.js index c41707f..d0e0338 100644 --- a/app/components/posts.js +++ b/app/components/posts.js @@ -3,26 +3,21 @@ import Vue from 'vue'; import AuthService from '../services/auth'; import PostFormComponent from './post_form'; +import PostComponent from './post'; import DatetimeFilter from '../filters/datetime'; import UsertimeFilter from '../filters/usertime'; const internals = {}; internals.kPostsRoute = '/api/posts'; +internals.kPollFrequency = 5000; export default internals.PostsComponent = Vue.component('posts', { - template: '<div class="posts-container">' + + template: '<div v-if="authService.authenticated" class="posts-container">' + '<post-form v-on:post-submitted="addPost"></post-form>' + '<h1>Posts.</h1>' + '<p v-show="message" class="posts-error">{{message}}</p>' + - '<article class="post" v-for="post in posts">' + - '<aside class="post-meta">' + - '<img :src="post.userImage" v-bind:alt="\'Avatar for @\' + post.userId">' + - '<a v-bind:href="\'https://twitter.com/\' + post.userId">{{post.userName}}</a> said on ' + - '<time v-bind:datetime="post.timestamp | datetime">{{post.timestamp | usertime}}</time>' + - '</aside>' + - '<div class="post-content">{{post.content}}</div>' + - '</article>' + + '<post v-for="post in posts" v-bind:post="post" :key="post.uuid"></post>' + '</div>', data() { @@ -46,9 +41,12 @@ export default internals.PostsComponent = Vue.component('posts', { }).then((response) => { this.posts = response.data; + if (!this._isBeingDestroyed) { + setTimeout(this.fetchPosts.bind(this), internals.kPollFrequency); + } }).catch((err) => { - console.err(err.stack); + console.error(err.stack); this.message = 'Error while loading the posts...'; }); }, @@ -61,17 +59,19 @@ export default internals.PostsComponent = Vue.component('posts', { components: { postForm: PostFormComponent, + post: PostComponent, datetime: DatetimeFilter, usertime: UsertimeFilter }, - mounted: function mounted() { + mounted() { if (!this.authService.authenticated) { return this.$router.push('/login'); } - return this.fetchPosts(); + this.fetchPosts(); + } }); |