diff --git a/asset/style.css b/asset/style.css index 2a911f2..962ce85 100644 --- a/asset/style.css +++ b/asset/style.css @@ -79,6 +79,11 @@ h1, h2, h3, h4, h5, h6 { .blog-post { margin-bottom: 3rem; } + +.blog-post br + br { + display: none; +} + .blog-post-title { margin-bottom: .25rem; font-size: 2.5rem; @@ -104,4 +109,4 @@ h1, h2, h3, h4, h5, h6 { .markdown-body { font-family: inherit; -} \ No newline at end of file +} diff --git a/modules/posts/post/post.component.js b/modules/posts/post/post.component.js index 77097bb..e94df66 100644 --- a/modules/posts/post/post.component.js +++ b/modules/posts/post/post.component.js @@ -5,27 +5,36 @@ angular bindings: { post: '=', }, - controller: function ($sce, PostRepository, $q) { - this.commentsLoaded = false - this.showSpinner = true + controller: function ($sce, PostRepository, $q, $routeParams) { + this.commentsLoaded = false; + this.showSpinner = true; this.loadComments = () => { - this.commentsLoaded = true - } - this.likesCount = 0 - this.dislikesCount = 0 + this.commentsLoaded = true; + }; + this.likesCount = 0; + this.dislikesCount = 0; this.$onInit = () => { + setTimeout(()=> { + console.log(); + }, 0) + $q .resolve(PostRepository.getReactionCounters(this.post.id)) .then(result => { - this.likesCount = result.thumbUp - this.dislikesCount = result.thumbDown + this.likesCount = result.thumbUp; + this.dislikesCount = result.thumbDown; }); - this.post.body = $sce.trustAsHtml(this.post.body) - this.showSpinner = false + let description = this.post.body; + const delimiter = '
' + + if ($routeParams && !$routeParams.id && this.post.body.includes(delimiter)) { + description = Post().getShortDescription(this.post) + } + + this.post.body = $sce.trustAsHtml(description); + this.showSpinner = false; }; } - }) - -; + }); diff --git a/modules/posts/post/post.module.js b/modules/posts/post/post.module.js index 3a844e1..b032ac1 100644 --- a/modules/posts/post/post.module.js +++ b/modules/posts/post/post.module.js @@ -7,7 +7,7 @@ angular resolve: { post: function (PostRepository, $route) { post = PostRepository.getById($route.current.params.id); - return post + return post; }, } }) @@ -19,26 +19,26 @@ angular let tags = issue.labels.map((label) => label.name); if (!tags.includesArray(POST_REQUIRED_TAGS)) { - throw new Error("You can't see unpublished posts.") + throw new Error('You can\'t see unpublished posts.'); } - tags = tags.filter(n => !POST_REQUIRED_TAGS.includes(n)) + tags = tags.filter(n => !POST_REQUIRED_TAGS.includes(n)); return new Post(issue.number, issue.title, issue.body_html, author, tags, issue.comments, issue.created_at); } function createFromIssueList(issueList) { - return issueList.map(issue => createFromIssue(issue)) + return issueList.map(issue => createFromIssue(issue)); } return { createFromIssue: createFromIssue, createFromIssueList: createFromIssueList, - } + }; }) .factory('PostRepository', function ($http, $log, PostFactory, PromiseCacheService, $q, BASE_API_URL, POST_REQUIRED_TAGS) { return { getReactionCounters: async (id) => { - id = Number(id) + id = Number(id); const cacheKey = 'reactions-id-' + id; return PromiseCacheService.getOrSet( cacheKey, @@ -50,7 +50,7 @@ angular cache: true, }) .then(response => { - $log.debug('response', response.config.url, response.data) + $log.debug('response', response.config.url, response.data); let reactionCounters = { '+1': 0, '-1': 0, @@ -60,21 +60,21 @@ angular 'hooray': 0, 'rocket': 0, 'eyes': 0, - } + }; response.data.map(data => { const emoji = data.content; if (reactionCounters.hasOwnProperty(emoji)) { - reactionCounters[emoji]++ + reactionCounters[emoji]++; } - }) + }); const arguments = Object.entries(reactionCounters).map(property => property[1]); - return ReactionCounters.apply(null, arguments) + return ReactionCounters.apply(null, arguments); }) - ) + ); }, getById: async (id) => { - id = Number(id) + id = Number(id); const cacheKey = 'post-id-' + id; return PromiseCacheService.getOrSet( cacheKey, @@ -86,31 +86,31 @@ angular cache: true, }) .then(response => { - $log.debug('response', response.config.url, response.data) + $log.debug('response', response.config.url, response.data); const post = PostFactory.createFromIssue(response.data); - $log.debug('post', post) - return post + $log.debug('post', post); + return post; }), '5hours' - ) + ); }, getByFilter: async (filter) => { let url = `${BASE_API_URL}/issues`; - url += '?sort=created' + url += '?sort=created'; if (filter.state) { - url += '&state=' + filter.state + url += '&state=' + filter.state; } if (filter.limit) { - url += '&per_page=' + filter.limit + url += '&per_page=' + filter.limit; } if (filter.offset) { - url += '&page=' + filter.offset + url += '&page=' + filter.offset; } - url += '&labels=' + POST_REQUIRED_TAGS.join(',') + url += '&labels=' + POST_REQUIRED_TAGS.join(','); if (filter.tag) { - url += ',' + filter.tag + url += ',' + filter.tag; } - const cacheKey = 'posts-filter-' + Object.values(filter).join('-') + const cacheKey = 'posts-filter-' + Object.values(filter).join('-'); return PromiseCacheService.getOrSet( cacheKey, () => $http @@ -121,14 +121,14 @@ angular cache: true, }) .then(response => { - $log.debug('response', response.config.url, response.data) + $log.debug('response', response.config.url, response.data); const posts = PostFactory.createFromIssueList(response.data); - $log.debug('posts', posts) + $log.debug('posts', posts); - return posts + return posts; }), '2hours' - ) + ); } }; }) @@ -144,7 +144,7 @@ function ReactionCounters(thumbUp, thumbDown, laugh, confused, heart, hooray, ro hooray: hooray, rocket: rocket, eyes: eyes, - } + }; } function PostRepositoryFilter(limit, offset, tag) { @@ -153,11 +153,12 @@ function PostRepositoryFilter(limit, offset, tag) { offset: offset, state: 'open', tag: tag, - } + }; } -function Post(id, title, body, author, tags, commentsCount, createdAt) { +function Post(id, title, body, author, tags, commentsCount, createdAt, getShortDescription) { + return { id: id, title: title, @@ -167,7 +168,11 @@ function Post(id, title, body, author, tags, commentsCount, createdAt) { selfUrl: id, commentsCount: commentsCount, createdAt: createdAt, - } + getShortDescription: function (post) { + const delimiter = '
' + return post.body.substring(0, post.body.indexOf(delimiter)); + } + }; } function Author(username, url, avatarUrl) { @@ -175,5 +180,5 @@ function Author(username, url, avatarUrl) { username: username, url: url, avatarUrl: avatarUrl, - } + }; }