diff options
author | Andrew Dolgov <[email protected]> | 2021-02-19 15:31:50 +0300 |
---|---|---|
committer | Andrew Dolgov <[email protected]> | 2021-02-19 15:31:50 +0300 |
commit | e73779fec18a417ac04d694f75b6f9bbce0f47ea (patch) | |
tree | d77c6540de5a9055801c706cc12d7b7f6aa53428 /js | |
parent | d9fe14a0123eb90008a1be4b6ab9bb21b42f3776 (diff) |
render tags on the client
Diffstat (limited to 'js')
-rw-r--r-- | js/Article.js | 22 | ||||
-rwxr-xr-x | js/Headlines.js | 2 |
2 files changed, 16 insertions, 8 deletions
diff --git a/js/Article.js b/js/Article.js index 4f3a162de..a11004a0a 100644 --- a/js/Article.js +++ b/js/Article.js @@ -130,6 +130,14 @@ const Article = { Headlines.toggleUnread(id, 0); }, + renderTags: function (id, tags) { + const tags_short = tags.length > 5 ? tags.slice(0, 5) : tags; + + return `<span class="tags" title="${tags.join(", ")}" data-tags-for="${id}"> + ${tags_short.length > 0 ? tags_short.map((tag) => ` + <a href="#" onclick="Feeds.open({feed: '${tag.trim()}'})" class="tag">${tag}</a>` + ).join(", ") : `${__("no tags")}`}</span>`; + }, renderLabels: function(id, labels) { return `<span class="labels" data-labels-for="${id}">${labels.map((label) => ` <span class="label" data-label-id="${label[0]}" @@ -286,7 +294,7 @@ const Article = { <div class="comments">${comments}</div> <div class="author">${hl.author}</div> <i class="material-icons">label_outline</i> - <span id="ATSTR-${hl.id}">${hl.tags_str}</span> + ${Article.renderTags(hl.id, hl.tags)} <a title="${__("Edit tags for this article")}" href="#" onclick="Article.editTags(${hl.id})">(+)</a> <div class="buttons right">${hl.buttons}</div> @@ -343,13 +351,13 @@ const Article = { dialog.hide(); if (data) { - const id = data.id; - - const tags = App.byId("ATSTR-" + id); - const tooltip = dijit.byId("ATSTRTIP-" + id); + if (Headlines.headlines[data.id]) { + Headlines.headlines[data.id].tags = data.tags; + } - if (tags) tags.innerHTML = data.content; - if (tooltip) tooltip.attr('label', data.content_full); + App.findAll(`span[data-tags-for="${data.id}"`).forEach((ctr) => { + ctr.innerHTML = Article.renderTags(data.id, data.tags); + }); } } catch (e) { App.Error.report(e); diff --git a/js/Headlines.js b/js/Headlines.js index 2effc9192..f98b3dcce 100755 --- a/js/Headlines.js +++ b/js/Headlines.js @@ -495,7 +495,7 @@ const Headlines = { <div class="left"> ${hl.buttons_left} <i class="material-icons">label_outline</i> - <span id="ATSTR-${hl.id}">${hl.tags_str}</span> + ${Article.renderTags(hl.id, hl.tags)} <a title="${__("Edit tags for this article")}" href="#" onclick="Article.editTags(${hl.id})">(+)</a> ${comments} |