github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-27 14:13:37 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Merge pull request #4777 from gdpelican/add-header-panels

Browse Source 
Allow plugins to add panels to header more easily
This commit is contained in:
Robin Ward 2017-03-29 12:53:08 -04:00 committed by GitHub
commit b240437b6f
2 changed files with 35 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
app/assets/javascripts/discourse/lib/plugin-api.js.es6
View File

@ -18,9 +18,11 @@ import { addTagsHtmlCallback } from 'discourse/lib/render-tags';
import { addUserMenuGlyph } from 'discourse/widgets/user-menu';
import { addPostClassesCallback } from 'discourse/widgets/post';
import { addPostTransformCallback } from 'discourse/widgets/post-stream';
import { attachAdditionalPanel } from 'discourse/widgets/header';
// If you add any methods to the API ensure you bump up this number
const PLUGIN_API_VERSION = '0.8.5';
const PLUGIN_API_VERSION = '0.8.6';
class PluginApi {
constructor(version, container) {
@ -333,6 +335,26 @@ class PluginApi {
return addFlagProperty(property);
}
/**
* Adds a panel to the header
*
* takes a widget name, a value to toggle on, and a function which returns the attrs for the widget
* Example:
* ```javascript
* api.addHeaderPanel('widget-name', 'widgetVisible', function(attrs, state) {
* return { name: attrs.name, description: state.description };
* });
* ```
* 'toggle' is an attribute on the state of the header widget,
*
* 'transformAttrs' is a function which is passed the current attrs and state of the widget,
* and returns a hash of values to pass to attach
*
**/
addHeaderPanel(name, toggle, transformAttrs) {
attachAdditionalPanel(name, toggle, transformAttrs);
}
/**
* Adds a pluralization to the store
*

12
app/assets/javascripts/discourse/widgets/header.js.es6
View File

@ -166,9 +166,15 @@ createWidget('header-buttons', {
const forceContextEnabled = ['category', 'user', 'private_messages'];
let additionalPanels = []
export function attachAdditionalPanel(name, toggle, transformAttrs) {
additionalPanels.push({ name, toggle, transformAttrs });
}
export default createWidget('header', {
tagName: 'header.d-header.clearfix',
buildKey: () => `header`,
additionalPanels: [],
defaultState() {
let states = {
@ -214,6 +220,12 @@ export default createWidget('header', {
panels.push(this.attach('user-menu'));
}
additionalPanels.map((panel) => {
if (this.state[panel.toggle]) {
panels.push(this.attach(panel.name, panel.transformAttrs.call(this, attrs, state)));
}
});
const contents = [ this.attach('home-logo', { minimized: !!attrs.topic }),
h('div.panel.clearfix', panels) ];