From b7661c137dfd93aefd96c4d82e72741582600b9f Mon Sep 17 00:00:00 2001 From: Rustam Mirzaev Date: Sun, 20 Sep 2020 17:19:35 +0300 Subject: [PATCH 1/4] short description in posts list --- asset/style.css | 7 ++++++- modules/posts/post/post.component.js | 12 ++++++++++-- 2 files changed, 16 insertions(+), 3 deletions(-) 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..28f90bd 100644 --- a/modules/posts/post/post.component.js +++ b/modules/posts/post/post.component.js @@ -5,7 +5,7 @@ angular bindings: { post: '=', }, - controller: function ($sce, PostRepository, $q) { + controller: function ($sce, PostRepository, $q, $routeParams) { this.commentsLoaded = false this.showSpinner = true this.loadComments = () => { @@ -22,8 +22,16 @@ angular this.dislikesCount = result.thumbDown }); - this.post.body = $sce.trustAsHtml(this.post.body) + const shortDescription = this.post.body.substring(0, this.post.body.indexOf('
')) + + if ($routeParams && $routeParams.id) { + this.post.body = $sce.trustAsHtml(this.post.body) + } else { + this.post.body = $sce.trustAsHtml(shortDescription || this.post.body) + } + this.showSpinner = false + }; } }) From 318280ccf44b1dce612c8e3cc9b43614bfa262ea Mon Sep 17 00:00:00 2001 From: Rustam Mirzaev Date: Sun, 4 Oct 2020 17:12:42 +0300 Subject: [PATCH 2/4] fix description --- modules/posts/post/post.component.js | 34 ++++++++++------------------ modules/posts/post/post.module.js | 14 +++++++++++- 2 files changed, 25 insertions(+), 23 deletions(-) diff --git a/modules/posts/post/post.component.js b/modules/posts/post/post.component.js index 28f90bd..d2f9008 100644 --- a/modules/posts/post/post.component.js +++ b/modules/posts/post/post.component.js @@ -5,35 +5,25 @@ angular bindings: { post: '=', }, - controller: function ($sce, PostRepository, $q, $routeParams) { - this.commentsLoaded = false - this.showSpinner = true + controller: function ($sce, PostRepository, PostFactory, $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 = () => { $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; }); - const shortDescription = this.post.body.substring(0, this.post.body.indexOf('
')) - - if ($routeParams && $routeParams.id) { - this.post.body = $sce.trustAsHtml(this.post.body) - } else { - this.post.body = $sce.trustAsHtml(shortDescription || this.post.body) - } - - this.showSpinner = false - + this.post.body = $sce.trustAsHtml(PostFactory.getDescription(this.post)); + this.showSpinner = false; }; } - }) - -; + }); diff --git a/modules/posts/post/post.module.js b/modules/posts/post/post.module.js index 3a844e1..98ca36d 100644 --- a/modules/posts/post/post.module.js +++ b/modules/posts/post/post.module.js @@ -13,7 +13,7 @@ angular }) ; }) - .factory('PostFactory', function (POST_REQUIRED_TAGS) { + .factory('PostFactory', function ($routeParams, POST_REQUIRED_TAGS) { function createFromIssue(issue) { const author = new Author(issue.user.login, issue.user.html_url, issue.user.avatar_url); let tags = issue.labels.map((label) => label.name); @@ -30,9 +30,21 @@ angular return issueList.map(issue => createFromIssue(issue)) } + function getDescription(post) { + const delimiter = '
' + let description = post.body + + if ($routeParams && !$routeParams.id && post.body.includes(delimiter)) { + description = post.body.substring(0, post.body.indexOf(delimiter)) + } + + return description; + } + return { createFromIssue: createFromIssue, createFromIssueList: createFromIssueList, + getDescription: getDescription, } }) .factory('PostRepository', function ($http, $log, PostFactory, PromiseCacheService, $q, BASE_API_URL, POST_REQUIRED_TAGS) { From 5bd9c22eeb060566a68fd4d5dda4cea676c63050 Mon Sep 17 00:00:00 2001 From: Rustam Mirzaev Date: Sun, 4 Oct 2020 17:49:34 +0300 Subject: [PATCH 3/4] fix description --- modules/posts/post/post.component.js | 9 ++++++++- modules/posts/post/post.module.js | 15 ++++----------- 2 files changed, 12 insertions(+), 12 deletions(-) diff --git a/modules/posts/post/post.component.js b/modules/posts/post/post.component.js index d2f9008..e41316a 100644 --- a/modules/posts/post/post.component.js +++ b/modules/posts/post/post.component.js @@ -22,7 +22,14 @@ angular this.dislikesCount = result.thumbDown; }); - this.post.body = $sce.trustAsHtml(PostFactory.getDescription(this.post)); + let description = this.post.body; + const delimiter = '
' + + if ($routeParams && !$routeParams.id && this.post.body.includes(delimiter)) { + description = PostFactory.getShortDescription(this.post, delimiter) + } + + 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 98ca36d..c8ca221 100644 --- a/modules/posts/post/post.module.js +++ b/modules/posts/post/post.module.js @@ -13,7 +13,7 @@ angular }) ; }) - .factory('PostFactory', function ($routeParams, POST_REQUIRED_TAGS) { + .factory('PostFactory', function (POST_REQUIRED_TAGS) { function createFromIssue(issue) { const author = new Author(issue.user.login, issue.user.html_url, issue.user.avatar_url); let tags = issue.labels.map((label) => label.name); @@ -30,21 +30,14 @@ angular return issueList.map(issue => createFromIssue(issue)) } - function getDescription(post) { - const delimiter = '
' - let description = post.body - - if ($routeParams && !$routeParams.id && post.body.includes(delimiter)) { - description = post.body.substring(0, post.body.indexOf(delimiter)) - } - - return description; + function getShortDescription(post, delimiter) { + return post.body.substring(0, post.body.indexOf(delimiter)); } return { createFromIssue: createFromIssue, createFromIssueList: createFromIssueList, - getDescription: getDescription, + getShortDescription: getShortDescription, } }) .factory('PostRepository', function ($http, $log, PostFactory, PromiseCacheService, $q, BASE_API_URL, POST_REQUIRED_TAGS) { From ae00e1abd00b3ee7536a7f1bbd1d023265650bb8 Mon Sep 17 00:00:00 2001 From: Rustam Mirzaev Date: Sun, 4 Oct 2020 18:25:43 +0300 Subject: [PATCH 4/4] fix description 3 --- modules/posts/post/post.component.js | 8 ++- modules/posts/post/post.module.js | 76 ++++++++++++++-------------- 2 files changed, 44 insertions(+), 40 deletions(-) diff --git a/modules/posts/post/post.component.js b/modules/posts/post/post.component.js index e41316a..e94df66 100644 --- a/modules/posts/post/post.component.js +++ b/modules/posts/post/post.component.js @@ -5,7 +5,7 @@ angular bindings: { post: '=', }, - controller: function ($sce, PostRepository, PostFactory, $q, $routeParams) { + controller: function ($sce, PostRepository, $q, $routeParams) { this.commentsLoaded = false; this.showSpinner = true; this.loadComments = () => { @@ -15,6 +15,10 @@ angular this.dislikesCount = 0; this.$onInit = () => { + setTimeout(()=> { + console.log(); + }, 0) + $q .resolve(PostRepository.getReactionCounters(this.post.id)) .then(result => { @@ -26,7 +30,7 @@ angular const delimiter = '
' if ($routeParams && !$routeParams.id && this.post.body.includes(delimiter)) { - description = PostFactory.getShortDescription(this.post, delimiter) + description = Post().getShortDescription(this.post) } this.post.body = $sce.trustAsHtml(description); diff --git a/modules/posts/post/post.module.js b/modules/posts/post/post.module.js index c8ca221..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,31 +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)) - } - - function getShortDescription(post, delimiter) { - return post.body.substring(0, post.body.indexOf(delimiter)); + return issueList.map(issue => createFromIssue(issue)); } return { createFromIssue: createFromIssue, createFromIssueList: createFromIssueList, - getShortDescription: getShortDescription, - } + }; }) .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, @@ -55,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, @@ -65,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, @@ -91,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 @@ -126,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' - ) + ); } }; }) @@ -149,7 +144,7 @@ function ReactionCounters(thumbUp, thumbDown, laugh, confused, heart, hooray, ro hooray: hooray, rocket: rocket, eyes: eyes, - } + }; } function PostRepositoryFilter(limit, offset, tag) { @@ -158,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, @@ -172,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) { @@ -180,5 +180,5 @@ function Author(username, url, avatarUrl) { username: username, url: url, avatarUrl: avatarUrl, - } + }; }