Add autocomplete to the plugin API
This commit is contained in:
parent
73192f5762
commit
a0bee1846e
|
@ -23,6 +23,7 @@ import { WebpackModules } from './webpackmodules';
|
||||||
import DiscordApi from './discordapi';
|
import DiscordApi from './discordapi';
|
||||||
import { ReactComponents, ReactHelpers } from './reactcomponents';
|
import { ReactComponents, ReactHelpers } from './reactcomponents';
|
||||||
import { Patcher, MonkeyPatch } from './patcher';
|
import { Patcher, MonkeyPatch } from './patcher';
|
||||||
|
import GlobalAc from '../ui/autocomplete';
|
||||||
|
|
||||||
export default class PluginApi {
|
export default class PluginApi {
|
||||||
|
|
||||||
|
@ -349,6 +350,43 @@ export default class PluginApi {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Autocomplete
|
||||||
|
*/
|
||||||
|
|
||||||
|
get autocompleteSets() {
|
||||||
|
return this._autocompleteSets || (this._autocompleteSets = new Map());
|
||||||
|
}
|
||||||
|
addAutocompleteController(prefix, controller) {
|
||||||
|
if (!controller) controller = this.plugin;
|
||||||
|
if (GlobalAc.validPrefix(prefix)) return;
|
||||||
|
GlobalAc.add(prefix, controller);
|
||||||
|
this.autocompleteSets.set(prefix, controller);
|
||||||
|
}
|
||||||
|
removeAutocompleteController(prefix) {
|
||||||
|
if (this.autocompleteSets.get(prefix) !== GlobalAc.sets.get(prefix)) return;
|
||||||
|
GlobalAc.remove(prefix);
|
||||||
|
this.autocompleteSets.delete(prefix);
|
||||||
|
}
|
||||||
|
removeAllAutocompleteControllers() {
|
||||||
|
for (let [prefix] of this.autocompleteSets) {
|
||||||
|
this.removeAutocompleteController(prefix);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
validAutocompletePrefix(prefix) {
|
||||||
|
return GlobalAc.validPrefix(prefix);
|
||||||
|
}
|
||||||
|
get Autocomplete() {
|
||||||
|
return Object.defineProperty({
|
||||||
|
add: this.addAutocompleteController.bind(this),
|
||||||
|
remove: this.removeAutocompleteController.bind(this),
|
||||||
|
removeAll: this.removeAllAutocompleteControllers.bind(this),
|
||||||
|
validPrefix: this.validAutocompletePrefix.bind(this)
|
||||||
|
}, 'sets', {
|
||||||
|
get: () => this.autocompleteSets
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Emotes
|
* Emotes
|
||||||
*/
|
*/
|
||||||
|
|
|
@ -4,15 +4,15 @@ import { VueInjector } from 'ui';
|
||||||
import AutocompleteComponent from './components/common/Autocomplete.vue';
|
import AutocompleteComponent from './components/common/Autocomplete.vue';
|
||||||
import { Utils } from 'common';
|
import { Utils } from 'common';
|
||||||
|
|
||||||
export default new class AutoComplete {
|
export default new class Autocomplete {
|
||||||
|
|
||||||
get sets() {
|
get sets() {
|
||||||
return this._sets || (this._sets = {});
|
return this._sets || (this._sets = new Map());
|
||||||
}
|
}
|
||||||
|
|
||||||
async init() {
|
async init() {
|
||||||
this.cta = await ReactComponents.getComponent('ChannelTextArea', { selector: WebpackModules.getSelector('channelTextArea', 'emojiButton') });
|
this.cta = await ReactComponents.getComponent('ChannelTextArea', { selector: WebpackModules.getSelector('channelTextArea', 'emojiButton') });
|
||||||
MonkeyPatch('BD:EMOTEMODULE', this.cta.component.prototype).after('render', this.channelTextAreaAfterRender.bind(this));
|
MonkeyPatch('BD:Autocomplete', this.cta.component.prototype).after('render', this.channelTextAreaAfterRender.bind(this));
|
||||||
this.initialized = true;
|
this.initialized = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -32,21 +32,21 @@ export default new class AutoComplete {
|
||||||
|
|
||||||
add(prefix, controller) {
|
add(prefix, controller) {
|
||||||
if (!this.initialized) this.init();
|
if (!this.initialized) this.init();
|
||||||
if (this.sets.hasOwnProperty(prefix)) return;
|
if (this.validPrefix(prefix)) return;
|
||||||
this.sets[prefix] = controller;
|
this.sets.set(prefix, controller);
|
||||||
}
|
}
|
||||||
|
|
||||||
remove(prefix) {
|
remove(prefix) {
|
||||||
if (this.sets.hasOwnProperty(prefix)) delete this.sets[prefix];
|
this.sets.delete(prefix);
|
||||||
}
|
}
|
||||||
|
|
||||||
validPrefix(prefix) {
|
validPrefix(prefix) {
|
||||||
return this.sets.hasOwnProperty(prefix);
|
return this.sets.has(prefix);
|
||||||
}
|
}
|
||||||
|
|
||||||
items(prefix, sterm) {
|
items(prefix, sterm) {
|
||||||
if (!this.validPrefix(prefix)) return [];
|
if (!this.validPrefix(prefix)) return [];
|
||||||
return this.sets[prefix].acsearch(sterm);
|
return this.sets.get(prefix).acsearch(sterm);
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
exports.main = (Plugin, { Logger, Settings, Modals, BdMenu: { BdMenuItems }, CommonComponents, DiscordContextMenu, Api }) => class extends Plugin {
|
exports.main = (Plugin, { Logger, Settings, Modals, BdMenu: { BdMenuItems }, CommonComponents, DiscordContextMenu, Autocomplete, Api }) => class extends Plugin {
|
||||||
async onstart() {
|
async onstart() {
|
||||||
this.keybindEvent = this.keybindEvent.bind(this);
|
this.keybindEvent = this.keybindEvent.bind(this);
|
||||||
|
|
||||||
|
@ -89,6 +89,13 @@ exports.main = (Plugin, { Logger, Settings, Modals, BdMenu: { BdMenuItems }, Com
|
||||||
onClick: () => Modals.basic('Test', 'Hello from Plugin 4')
|
onClick: () => Modals.basic('Test', 'Hello from Plugin 4')
|
||||||
}
|
}
|
||||||
]);
|
]);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Autocomplete.
|
||||||
|
* This calls `acsearch` on the controller (the plugin object). You can add multiple autocomplete sets by passing another controller.
|
||||||
|
*/
|
||||||
|
|
||||||
|
Autocomplete.add('|');
|
||||||
}
|
}
|
||||||
|
|
||||||
onstop() {
|
onstop() {
|
||||||
|
@ -97,10 +104,33 @@ exports.main = (Plugin, { Logger, Settings, Modals, BdMenu: { BdMenuItems }, Com
|
||||||
|
|
||||||
BdMenuItems.removeAll();
|
BdMenuItems.removeAll();
|
||||||
DiscordContextMenu.removeAll();
|
DiscordContextMenu.removeAll();
|
||||||
|
Autocomplete.removeAll();
|
||||||
}
|
}
|
||||||
|
|
||||||
keybindEvent(event) {
|
keybindEvent(event) {
|
||||||
Logger.log('Keybind pressed', event);
|
Logger.log('Keybind pressed', event);
|
||||||
Modals.basic('Example Plugin 4', 'Test keybind activated.');
|
Modals.basic('Example Plugin 4', 'Test keybind activated.');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
acsearch(sterm) {
|
||||||
|
// sterm is the text after the prefix
|
||||||
|
Logger.log('Searching for', sterm);
|
||||||
|
|
||||||
|
return {
|
||||||
|
title: ['Plugin 4 autocomplete'],
|
||||||
|
items: [
|
||||||
|
{key: 'Item 1', value: {replaceWith: 'Something to insert when selected'}},
|
||||||
|
{key: 'Item 2', value: {replaceWith: 'Something to insert when selected'}},
|
||||||
|
{key: 'Item 3', value: {replaceWith: 'Something to insert when selected'}},
|
||||||
|
{key: 'Item 4', value: {replaceWith: 'Something to insert when selected'}}
|
||||||
|
]
|
||||||
|
|
||||||
|
// `title` can also be an array - the second item will be white
|
||||||
|
// You can also add `type: 'imagetext'` here and add an `src` property to each item's value to show an image
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
get api() {
|
||||||
|
return Api;
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
Loading…
Reference in New Issue