Add menu items to the plugin API
This commit is contained in:
parent
5e259f50f8
commit
e78089a509
|
@ -16,7 +16,7 @@ import ThemeManager from './thememanager';
|
||||||
import Events from './events';
|
import Events from './events';
|
||||||
import WebpackModules from './webpackmodules';
|
import WebpackModules from './webpackmodules';
|
||||||
import { SettingsSet, SettingsCategory, Setting, SettingsScheme } from 'structs';
|
import { SettingsSet, SettingsCategory, Setting, SettingsScheme } from 'structs';
|
||||||
import { Modals, DOM } from 'ui';
|
import { BdMenuItems, Modals, DOM } from 'ui';
|
||||||
import SettingsModal from '../ui/components/bd/modals/SettingsModal.vue';
|
import SettingsModal from '../ui/components/bd/modals/SettingsModal.vue';
|
||||||
|
|
||||||
class EventsWrapper {
|
class EventsWrapper {
|
||||||
|
@ -153,6 +153,54 @@ export default class PluginApi {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* BdMenu
|
||||||
|
*/
|
||||||
|
|
||||||
|
get BdMenu() {
|
||||||
|
return {
|
||||||
|
BdMenuItems: this.BdMenuItems
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* BdMenuItems
|
||||||
|
*/
|
||||||
|
|
||||||
|
get menuItems() {
|
||||||
|
return this._menuItems || (this._menuItems = []);
|
||||||
|
}
|
||||||
|
addMenuItem(item) {
|
||||||
|
return BdMenuItems.add(item);
|
||||||
|
}
|
||||||
|
addMenuSettingsSet(category, set, text) {
|
||||||
|
const item = BdMenuItems.addSettingsSet(category, set, text);
|
||||||
|
return this.menuItems.push(item);
|
||||||
|
}
|
||||||
|
addMenuVueComponent(category, text, component) {
|
||||||
|
const item = BdMenuItems.addVueComponent(category, text, component);
|
||||||
|
return this.menuItems.push(item);
|
||||||
|
}
|
||||||
|
removeMenuItem(item) {
|
||||||
|
BdMenuItems.remove(item);
|
||||||
|
Utils.removeFromArray(this.menuItems, item);
|
||||||
|
}
|
||||||
|
removeAllMenuItems() {
|
||||||
|
for (let item of this.menuItems)
|
||||||
|
BdMenuItems.remove(item);
|
||||||
|
}
|
||||||
|
get BdMenuItems() {
|
||||||
|
return Object.defineProperty({
|
||||||
|
add: this.addMenuItem.bind(this),
|
||||||
|
addSettingsSet: this.addMenuSettingsSet.bind(this),
|
||||||
|
addVueComponent: this.addMenuVueComponent.bind(this),
|
||||||
|
remove: this.removeMenuItem.bind(this),
|
||||||
|
removeAll: this.removeAllMenuItems.bind(this)
|
||||||
|
}, 'items', {
|
||||||
|
get: () => this.menuItems
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* CssUtils
|
* CssUtils
|
||||||
*/
|
*/
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
module.exports = (Plugin, { Logger, Settings }) => class extends Plugin {
|
module.exports = (Plugin, { Logger, Settings, BdMenu: { BdMenuItems }, Api }) => class extends Plugin {
|
||||||
async onstart() {
|
async onstart() {
|
||||||
// Some array event examples
|
// Some array event examples
|
||||||
const arraySetting = this.settings.getSetting('default', 'array-1');
|
const arraySetting = this.settings.getSetting('default', 'array-1');
|
||||||
|
@ -7,8 +7,10 @@ module.exports = (Plugin, { Logger, Settings }) => class extends Plugin {
|
||||||
arraySetting.on('item-updated', event => Logger.log('Item', event.item, 'of the array setting was updated', event));
|
arraySetting.on('item-updated', event => Logger.log('Item', event.item, 'of the array setting was updated', event));
|
||||||
arraySetting.on('item-removed', event => Logger.log('Item', event.item, 'removed from the array setting'));
|
arraySetting.on('item-removed', event => Logger.log('Item', event.item, 'removed from the array setting'));
|
||||||
|
|
||||||
// Create a new settings set and show it in a modal
|
// Create a new settings set and add it to the menu
|
||||||
const set = Settings.createSet({});
|
const set = Settings.createSet({
|
||||||
|
text: this.name
|
||||||
|
});
|
||||||
const category = await set.addCategory({ id: 'default' });
|
const category = await set.addCategory({ id: 'default' });
|
||||||
|
|
||||||
const setting = await category.addSetting({
|
const setting = await category.addSetting({
|
||||||
|
@ -33,6 +35,29 @@ module.exports = (Plugin, { Logger, Settings }) => class extends Plugin {
|
||||||
set.setSaved();
|
set.setSaved();
|
||||||
})
|
})
|
||||||
|
|
||||||
set.showModal('Custom settings panel');
|
const setting2 = await category.addSetting({
|
||||||
|
id: 'setting-2',
|
||||||
|
type: 'text',
|
||||||
|
text: 'Enter some text',
|
||||||
|
fullwidth: true
|
||||||
|
});
|
||||||
|
|
||||||
|
setting2.on('setting-updated', event => Logger.log('Setting 2 was changed to', event.value));
|
||||||
|
|
||||||
|
this.menuItem = BdMenuItems.addSettingsSet('Plugins', set, 'Plugin 4');
|
||||||
|
|
||||||
|
this.menuItem2 = BdMenuItems.addVueComponent('Plugins', 'Also Plugin 4', {
|
||||||
|
template: `<component :is="SettingsWrapper" :headertext="plugin.name + ' custom menu panel'">
|
||||||
|
<p style="margin-top: 0; color: #f6f6f7;">Test</p>
|
||||||
|
</component>`,
|
||||||
|
props: ['SettingsWrapper'],
|
||||||
|
data() { return {
|
||||||
|
Api, plugin: Api.plugin
|
||||||
|
}; }
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
onstop() {
|
||||||
|
BdMenuItems.removeAll();
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
Loading…
Reference in New Issue