mirror of
https://github.com/discourse/discourse.git
synced 2024-11-25 09:42:07 +08:00
114 lines
3.2 KiB
JavaScript
114 lines
3.2 KiB
JavaScript
import { h } from 'virtual-dom';
|
|
let _renderers = [];
|
|
|
|
const REPLACEMENTS = {
|
|
'd-tracking': 'circle',
|
|
'd-muted': 'times-circle',
|
|
'd-regular': 'circle-o',
|
|
'd-watching': 'exclamation-circle',
|
|
'd-watching-first': 'dot-circle-o',
|
|
'd-drop-expanded': 'caret-down',
|
|
'd-drop-collapsed': 'caret-right',
|
|
'd-unliked': 'heart',
|
|
'd-liked': 'heart',
|
|
'notification.mentioned': "at",
|
|
'notification.group_mentioned': "at",
|
|
'notification.quoted': "quote-right",
|
|
'notification.replied': "reply",
|
|
'notification.posted': "reply",
|
|
'notification.edited': "pencil",
|
|
'notification.liked': "heart",
|
|
'notification.liked_2': "heart",
|
|
'notification.liked_many': "heart",
|
|
'notification.private_message': "envelope-o",
|
|
'notification.invited_to_private_message': "envelope-o",
|
|
'notification.invited_to_topic': "hand-o-right",
|
|
'notification.invitee_accepted': "user",
|
|
'notification.moved_post': "sign-out",
|
|
'notification.linked': "link",
|
|
'notification.granted_badge': "certificate",
|
|
'notification.topic_reminder': "hand-o-right",
|
|
'notification.watching_first_post': "dot-circle-o",
|
|
'notification.group_message_summary': "group"
|
|
};
|
|
|
|
export function replaceIcon(source, destination) {
|
|
REPLACEMENTS[source] = destination;
|
|
}
|
|
|
|
export function renderIcon(renderType, id, params) {
|
|
for (let i=0; i<_renderers.length; i++) {
|
|
let renderer = _renderers[i];
|
|
let rendererForType = renderer[renderType];
|
|
|
|
if (rendererForType) {
|
|
const icon = { id, replacementId: REPLACEMENTS[id] };
|
|
let result = rendererForType(icon, params || {});
|
|
if (result) {
|
|
return result;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
export function iconHTML(id, params) {
|
|
return renderIcon('string', id, params);
|
|
}
|
|
|
|
export function iconNode(id, params) {
|
|
return renderIcon('node', id, params);
|
|
}
|
|
|
|
// TODO: Improve how helpers are registered for vdom compliation
|
|
if (typeof Discourse !== "undefined") {
|
|
Discourse.__widget_helpers.iconNode = iconNode;
|
|
}
|
|
|
|
export function registerIconRenderer(renderer) {
|
|
_renderers.unshift(renderer);
|
|
}
|
|
|
|
// Support for font awesome icons
|
|
function faClasses(icon, params) {
|
|
let classNames = `fa fa-${icon.replacementId || icon.id} d-icon d-icon-${icon.id}`;
|
|
|
|
if (params) {
|
|
if (params.modifier) { classNames += " fa-" + params.modifier; }
|
|
if (params['class']) { classNames += ' ' + params['class']; }
|
|
}
|
|
return classNames;
|
|
}
|
|
|
|
// default resolver is font awesome
|
|
registerIconRenderer({
|
|
name: 'font-awesome',
|
|
|
|
string(icon, params) {
|
|
let tagName = params.tagName || 'i';
|
|
let html = `<${tagName} class='${faClasses(icon, params)}'`;
|
|
if (params.title) { html += ` title='${I18n.t(params.title)}'`; }
|
|
if (params.label) { html += " aria-hidden='true'"; }
|
|
html += `></${tagName}>`;
|
|
if (params.label) {
|
|
html += "<span class='sr-only'>" + I18n.t(params.label) + "</span>";
|
|
}
|
|
return html;
|
|
},
|
|
|
|
node(icon, params) {
|
|
let tagName = params.tagName || 'i';
|
|
|
|
const properties = {
|
|
className: faClasses(icon, params),
|
|
attributes: { "aria-hidden": true }
|
|
};
|
|
|
|
if (params.title) { properties.attributes.title = params.title; }
|
|
if (params.label) {
|
|
return h(tagName, properties, h('span.sr-only', I18n.t(params.label)));
|
|
} else {
|
|
return h(tagName, properties);
|
|
}
|
|
}
|
|
});
|