diff --git a/README.md b/README.md index 36c7afb..ceb6609 100644 --- a/README.md +++ b/README.md @@ -94,6 +94,15 @@ text_max_lines: "0", // Customize the text of the link pointing to the Mastodon page (appears after the last toot) link_see_more: "See more posts at Mastodon", + +//set the font icon for replies counter, e.g. (make sure to add FontAwesome to you page to make this sample work) +replies_count_icon: '', + +//set the font icon for boosts counter, e.g. (make sure to add FontAwesome to you page to make this sample work) +boosts_count_icon: '', + +//set the font icon for favourites counter, e.g. (make sure to add FontAwesome to you page to make this sample work) +favourites_count_icon: '', ``` ### Tip diff --git a/src/mastodon-timeline.js b/src/mastodon-timeline.js index 452ce5c..bdffc86 100644 --- a/src/mastodon-timeline.js +++ b/src/mastodon-timeline.js @@ -55,6 +55,15 @@ window.addEventListener("load", () => { // Converts Markdown symbol ">" at the beginning of a paragraph into a blockquote HTML tag. Ddefault: don't apply markdown_blockquote: false, + //set the font icon for replies counter + replies_count_icon: undefined, + + //set the font icon for boosts counter + boosts_count_icon: undefined, + + //set the font icon for favourites counter + favourites_count_icon: undefined, + // Limit the text content to a maximum number of lines. Default: 0 (unlimited) text_max_lines: "0", @@ -100,6 +109,10 @@ const MastodonApi = function (params_) { this.LINK_SEE_MORE = params_.link_see_more; this.FETCHED_DATA = {}; + this.REPLIES_COUNT_ICON = params_.replies_count_icon || '[Replies]'; + this.BOOSTS_COUNT_ICON = params_.boosts_count_icon || '[Boost]'; + this.FAVOURITES_COUNT_ICON = params_.favourites_count_icon || '[Favourite]'; + this.mtBodyContainer = document.getElementById(this.CONTAINER_BODY_ID); this.buildTimeline(); @@ -531,6 +544,20 @@ MastodonApi.prototype.assambleToot = function (c, i) { "" + ""; + // stats (boosts + favourites counts) >>> + // data + var repliesCountIcon = '' + this.REPLIES_COUNT_ICON +": "+ c.replies_count + ' '; + var boostsCountIcon = '' + this.BOOSTS_COUNT_ICON +": "+ c.reblogs_count + ' '; + var favouritesCountIcon = '' + this.FAVOURITES_COUNT_ICON +": "+ c.favourites_count + ' '; + + // html nodes + var statusBar = '
' + + repliesCountIcon + + boostsCountIcon + + favouritesCountIcon + + '
'; + + // Add all to main toot container const toot = '
"; return toot;