From f918951d42234790938da442a768c2bf80f87069 Mon Sep 17 00:00:00 2001 From: Sam Date: Tue, 28 Feb 2017 17:07:51 -0500 Subject: [PATCH] FEATURE: clean up tags extensibility centralizes all logic for topic tag rendering and provides API for extension --- .../discourse/helpers/discourse-tags.js.es6 | 6 +++ .../discourse/lib/plugin-api.js.es6 | 18 +++++++- .../discourse/lib/render-tag.js.es6 | 18 -------- .../discourse/lib/render-tags.js.es6 | 45 +++++++++++++++++++ .../components/latest-topic-list-item.hbs | 8 +--- .../templates/list/topic-list-item.raw.hbs | 10 +---- .../widgets/header-topic-info.js.es6 | 10 ++--- 7 files changed, 74 insertions(+), 41 deletions(-) create mode 100644 app/assets/javascripts/discourse/helpers/discourse-tags.js.es6 create mode 100644 app/assets/javascripts/discourse/lib/render-tags.js.es6 diff --git a/app/assets/javascripts/discourse/helpers/discourse-tags.js.es6 b/app/assets/javascripts/discourse/helpers/discourse-tags.js.es6 new file mode 100644 index 00000000000..7065a44f460 --- /dev/null +++ b/app/assets/javascripts/discourse/helpers/discourse-tags.js.es6 @@ -0,0 +1,6 @@ +import { registerUnbound } from 'discourse-common/lib/helpers'; +import renderTags from 'discourse/lib/render-tags'; + +export default registerUnbound('discourse-tags', function(topic, params) { + return new Handlebars.SafeString(renderTags(topic, params)); +}); diff --git a/app/assets/javascripts/discourse/lib/plugin-api.js.es6 b/app/assets/javascripts/discourse/lib/plugin-api.js.es6 index a56554047e3..e7118383597 100644 --- a/app/assets/javascripts/discourse/lib/plugin-api.js.es6 +++ b/app/assets/javascripts/discourse/lib/plugin-api.js.es6 @@ -14,9 +14,10 @@ import { addPopupMenuOptionsCallback } from 'discourse/controllers/composer'; import { extraConnectorClass } from 'discourse/lib/plugin-connectors'; import { addPostSmallActionIcon } from 'discourse/widgets/post-small-action'; import { addDiscoveryQueryParam } from 'discourse/controllers/discovery-sortable'; +import { addTagsHtmlCallback } from 'discourse/lib/render-tags'; // If you add any methods to the API ensure you bump up this number -const PLUGIN_API_VERSION = '0.8.1'; +const PLUGIN_API_VERSION = '0.8.2'; class PluginApi { constructor(version, container) { @@ -387,6 +388,21 @@ class PluginApi { addDiscoveryQueryParam(param, options) { addDiscoveryQueryParam(param, options); } + + /** + * Register a callback to be called every time tags render + * example: + * + * callback = function(topic, params) { + * if (topic.get("created_at") < "2000-00-01") { + * return "ANCIENT" + * } + * } + * + **/ + addTagsHtmlCallback(callback) { + addTagsHtmlCallback(callback); + }; } let _pluginv01; diff --git a/app/assets/javascripts/discourse/lib/render-tag.js.es6 b/app/assets/javascripts/discourse/lib/render-tag.js.es6 index 356ee4b2c22..127dc5c9fe4 100644 --- a/app/assets/javascripts/discourse/lib/render-tag.js.es6 +++ b/app/assets/javascripts/discourse/lib/render-tag.js.es6 @@ -1,5 +1,3 @@ -import { h } from 'virtual-dom'; - export default function renderTag(tag, params) { params = params || {}; tag = Handlebars.Utils.escapeExpression(tag); @@ -19,19 +17,3 @@ export default function renderTag(tag, params) { return val; }; - -export function tagNode(tag, params) { - const classes = ['tag-' + tag, 'discourse-tag']; - const tagName = params.tagName || "a"; - - if (Discourse.SiteSettings.tag_style || params.style) { - classes.push(params.style || Discourse.SiteSettings.tag_style); - } - - if (tagName === 'a') { - const href = Discourse.getURL(`/tags/${tag}`); - return h(tagName, { className: classes.join(' '), attributes: { href } }, tag); - } else { - return h(tagName, { className: classes.join(' ') }, tag); - } -} diff --git a/app/assets/javascripts/discourse/lib/render-tags.js.es6 b/app/assets/javascripts/discourse/lib/render-tags.js.es6 new file mode 100644 index 00000000000..9f66eb36cdc --- /dev/null +++ b/app/assets/javascripts/discourse/lib/render-tags.js.es6 @@ -0,0 +1,45 @@ +import renderTag from 'discourse/lib/render-tag'; + +let callbacks = null; + +export function addTagsHtmlCallback(callback) { + callbacks = callbacks || []; + callbacks.push(callback); +}; + +export default function(topic, params){ + let tags = topic.tags; + let buffer = ""; + + if (params && params.mode === "list") { + tags = topic.get("visibleListTags"); + } + + let customHtml = null; + if (callbacks) { + callbacks.forEach((c) => { + const html = c(topic, params); + if (html) { + if (customHtml) { + customHtml += html; + } else { + customHtml = html; + } + } + }); + } + + if (customHtml || (tags && tags.length > 0)) { + buffer = "
"; + if (tags) { + for(var i=0; i {{category-link topic.category}} - {{#if topic.tags}} -
- {{#each topic.visibleListTags as |tag|}} - {{discourse-tag tag}} - {{/each}} -
- {{/if}} + {{discourse-tags topic mode="list"}} diff --git a/app/assets/javascripts/discourse/templates/list/topic-list-item.raw.hbs b/app/assets/javascripts/discourse/templates/list/topic-list-item.raw.hbs index 79440b5f2db..b88602c0a08 100644 --- a/app/assets/javascripts/discourse/templates/list/topic-list-item.raw.hbs +++ b/app/assets/javascripts/discourse/templates/list/topic-list-item.raw.hbs @@ -18,15 +18,7 @@ {{/if}} - {{#if topic.tags}} -
- {{#each topic.visibleListTags as |tag|}} - {{discourse-tag tag}} - {{/each}} - {{raw-plugin-outlet name="topic-list-custom-tags"}} -
- {{/if}} - {{raw-plugin-outlet name="topic-list-tags"}} + {{discourse-tags topic mode="list"}} {{#if expandPinned}} {{raw "list/topic-excerpt" topic=topic}} {{/if}} diff --git a/app/assets/javascripts/discourse/widgets/header-topic-info.js.es6 b/app/assets/javascripts/discourse/widgets/header-topic-info.js.es6 index 7bed4883938..9aca1e16387 100644 --- a/app/assets/javascripts/discourse/widgets/header-topic-info.js.es6 +++ b/app/assets/javascripts/discourse/widgets/header-topic-info.js.es6 @@ -3,7 +3,7 @@ import { h } from 'virtual-dom'; import { iconNode } from 'discourse/helpers/fa-icon-node'; import DiscourseURL from 'discourse/lib/url'; import RawHtml from 'discourse/widgets/raw-html'; -import { tagNode } from 'discourse/lib/render-tag'; +import renderTags from 'discourse/lib/render-tags'; import { topicFeaturedLinkNode } from 'discourse/lib/render-topic-featured-link'; export default createWidget('header-topic-info', { @@ -46,11 +46,9 @@ export default createWidget('header-topic-info', { } let extra = []; - if (this.siteSettings.tagging_enabled) { - const tags = topic.get('tags') || []; - if (tags.length) { - extra.push(h('div.list-tags', tags.map(tagNode))); - } + const tags = renderTags(topic); + if (tags && tags.length > 0) { + extra.push(new RawHtml({html: tags})); } extra = extra.concat(applyDecorators(this, 'after-tags', attrs, state));