Adds plugin-outlet for topic menu buttons. Also a d-button component.

This commit is contained in:
Robin Ward 2015-01-14 15:01:41 -05:00
parent 28f702a5b6
commit e7443247dd
4 changed files with 47 additions and 23 deletions

View File

@ -0,0 +1,18 @@
import { iconHTML } from 'discourse/helpers/fa-icon';
export default Ember.Component.extend({
tagName: 'button',
classNameBindings: [':btn'],
render: function(buffer) {
var icon = this.get('icon');
if (icon) {
buffer.push(iconHTML(icon) + ' ');
}
buffer.push(I18n.t(this.get('label')));
},
click: function() {
this.sendAction();
}
});

View File

@ -1,12 +1,16 @@
Handlebars.registerHelper('fa-icon', function(icon, options) {
var labelKey;
if (options.hash) { labelKey = options.hash.label; }
export function iconHTML(icon, label) {
var html = "<i class='fa fa-" + icon + "'";
if (labelKey) { html += " aria-hidden='true'"; }
if (label) { html += " aria-hidden='true'"; }
html += "></i>";
if (labelKey) {
html += "<span class='sr-only'>" + I18n.t(labelKey) + "</span>";
if (label) {
html += "<span class='sr-only'>" + I18n.t(label) + "</span>";
}
return new Handlebars.SafeString(html);
return html;
}
Handlebars.registerHelper('fa-icon', function(icon, options) {
var label;
if (options.hash) { label = options.hash.label; }
return new Handlebars.SafeString(iconHTML(icon, label));
});

View File

@ -2,48 +2,48 @@
<ul>
<li>
<button {{action "toggleMultiSelect"}} class='btn btn-admin'>{{fa-icon "tasks"}} {{i18n 'topic.actions.multi_select'}}</button>
{{d-button action="toggleMultiSelect" icon="tasks" label="topic.actions.multi_select" class="btn-admin"}}
</li>
{{#if details.can_delete}}
<li>
<button {{action "deleteTopic"}} class='btn btn-admin btn-danger'>{{fa-icon "trash-o"}} {{i18n 'topic.actions.delete'}}</button>
{{d-button action="deleteTopic" icon="trash-o" label="topic.actions.delete" class="btn-admin btn-danger"}}
</li>
{{/if}}
{{#if showRecover}}
<li>
<button {{action "recoverTopic"}} class='btn btn-admin'>{{fa-icon "undo"}} {{i18n 'topic.actions.recover'}}</button>
{{d-button action="recoverTopic" icon="undo" label="topic.actions.recover" class="btn-admin"}}
</li>
{{/if}}
<li>
{{#if closed}}
<button {{action "toggleClosed"}} class='btn btn-admin'>{{fa-icon "unlock"}} {{i18n 'topic.actions.open'}}</button>
{{d-button action="toggleClosed" icon="unlock" label="topic.actions.open" class="btn-admin"}}
{{else}}
<button {{action "toggleClosed"}} class='btn btn-admin'>{{fa-icon "lock"}} {{i18n 'topic.actions.close'}}</button>
<button {{action "showAutoClose"}} class='btn btn-admin'>{{fa-icon "clock-o"}} {{i18n 'topic.actions.auto_close'}}</button>
{{d-button action="toggleClosed" icon="lock" label="topic.actions.close" class="btn-admin"}}
{{d-button action="showAutoClose" icon="clock-o" label="topic.actions.auto_close" class="btn-admin"}}
{{/if}}
</li>
{{#unless isPrivateMessage}}
<li>
{{#if isBanner}}
<button {{action "removeBanner"}} class='btn btn-admin'>{{fa-icon "bullhorn"}} {{i18n 'topic.actions.remove_banner'}}</button>
{{d-button action="removeBanner" icon="bullhorn" label="topic.actions.remove_banner" class="btn-admin"}}
{{else}}
{{#if visible}}
<button {{action "makeBanner"}} class='btn btn-admin'>{{fa-icon "bullhorn"}} {{i18n 'topic.actions.make_banner'}}</button>
{{d-button action="makeBanner" icon="bullhorn" label="topic.actions.make_banner" class="btn-admin"}}
{{/if}}
{{/if}}
</li>
<li>
{{#if pinned_at}}
<button {{action "togglePinned"}} class='btn btn-admin'>{{fa-icon "thumb-tack"}} {{i18n 'topic.actions.unpin'}}</button>
{{d-button action="togglePinned" icon="thumb-tack" label="topic.actions.unpin" class="btn-admin"}}
{{else}}
{{#if visible}}
<button {{action "togglePinned"}} class='btn btn-admin'>{{fa-icon "thumb-tack"}} {{i18n 'topic.actions.pin'}}</button>
<button {{action "togglePinnedGlobally"}} class='btn btn-admin'>{{fa-icon "thumb-tack"}} {{i18n 'topic.actions.pin_globally'}}</button>
{{d-button action="togglePinned" icon="thumb-tack" label="topic.actions.pin" class="btn-admin"}}
{{d-button action="togglePinnedGlobally" icon="thumb-tack" label="topic.actions.pin_globally" class="btn-admin"}}
{{/if}}
{{/if}}
</li>
@ -51,18 +51,19 @@
<li>
{{#if archived}}
<button {{action "toggleArchived"}} class='btn btn-admin'>{{fa-icon "folder"}} {{i18n 'topic.actions.unarchive'}}</button>
{{d-button action="toggleArchived" icon="folder" label="topic.actions.unarchive" class="btn-admin"}}
{{else}}
<button {{action "toggleArchived"}} class='btn btn-admin'>{{fa-icon "folder"}} {{i18n 'topic.actions.archive'}}</button>
{{d-button action="toggleArchived" icon="folder" label="topic.actions.archive" class="btn-admin"}}
{{/if}}
</li>
<li>
{{#if visible}}
<button {{action "toggleVisibility"}} class='btn btn-admin'>{{fa-icon "eye-slash"}} {{i18n 'topic.actions.invisible'}}</button>
{{d-button action="toggleVisibility" icon="eye-slash" label="topic.actions.invisible" class="btn-admin"}}
{{else}}
<button {{action "toggleVisibility"}} class='btn btn-admin'>{{fa-icon "eye"}} {{i18n 'topic.actions.visible'}}</button>
{{d-button action="toggleVisibility" icon="eye" label="topic.actions.visible" class="btn-admin"}}
{{/if}}
</li>
{{plugin-outlet "topic-admin-menu-buttons"}}
</ul>

View File

@ -12,6 +12,7 @@
// Stuff we need to load first
//= require ./discourse/lib/app-events
//= require ./discourse/helpers/i18n
//= require ./discourse/helpers/fa-icon
//= require ./discourse/lib/ember_compat_handlebars
//= require ./discourse/lib/computed
//= require ./discourse/helpers/register-unbound