github-mirror/framework
github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2025-02-27 04:00:28 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fix extension to work with Composer state changes

Browse Source 
Refs flarum/core#2162.
This commit is contained in:
Franz Liedke 2020-07-25 00:28:06 +02:00
parent 86e77812b8
commit 505068de95
1 changed files with 4 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
extensions/emoji/js/src/forum/addComposerAutocomplete.js
View File

@ -2,7 +2,6 @@ import getCaretCoordinates from 'textarea-caret';
import emojiMap from 'simple-emoji-map'; import emojiMap from 'simple-emoji-map';
import { extend } from 'flarum/extend'; import { extend } from 'flarum/extend';
import ComposerBody from 'flarum/components/ComposerBody';
import TextEditor from 'flarum/components/TextEditor'; import TextEditor from 'flarum/components/TextEditor';
import TextEditorButton from 'flarum/components/TextEditorButton'; import TextEditorButton from 'flarum/components/TextEditorButton';
import getEmojiIconCode from './helpers/getEmojiIconCode'; import getEmojiIconCode from './helpers/getEmojiIconCode';
@ -13,26 +12,17 @@ import AutocompleteDropdown from './components/AutocompleteDropdown';
export default function addComposerAutocomplete() { export default function addComposerAutocomplete() {
const emojiKeys = Object.keys(emojiMap); const emojiKeys = Object.keys(emojiMap);
extend(ComposerBody.prototype, 'config', function(original, isInitialized) { extend(TextEditor.prototype, 'config', function(original, isInitialized) {
if (isInitialized) return; if (isInitialized) return;
const composer = this;
const $container = $('<div class="ComposerBody-emojiDropdownContainer"></div>'); const $container = $('<div class="ComposerBody-emojiDropdownContainer"></div>');
const dropdown = new AutocompleteDropdown({items: []}); const dropdown = new AutocompleteDropdown({items: []});
const $textarea = this.$('textarea').wrap('<div class="ComposerBody-emojiWrapper"></div>'); const $textarea = this.$('textarea').wrap('<div class="ComposerBody-emojiWrapper"></div>');
let emojiStart; let emojiStart;
let typed; let typed;
const applySuggestion = function(replacement) { const applySuggestion = (replacement) => {
const insert = replacement + ' '; this.props.composer.editor.replaceBeforeCursor(emojiStart - 1, replacement + ' ');
// When calling setValue(), emojiStart will be set back to 0 so we need to compute this beforehand
const index = emojiStart - 1 + insert.length;
const content = composer.content();
composer.editor.setValue(content.substring(0, emojiStart - 1) + insert + content.substr($textarea[0].selectionStart));
composer.editor.setSelectionRange(index, index);
dropdown.hide(); dropdown.hide();
}; };
@ -168,7 +158,7 @@ export default function addComposerAutocomplete() {
extend(TextEditor.prototype, 'toolbarItems', function(items) { extend(TextEditor.prototype, 'toolbarItems', function(items) {
items.add('emoji', ( items.add('emoji', (
<TextEditorButton onclick={() => this.insertAtCursor(':')} icon="far fa-smile"> <TextEditorButton onclick={() => this.props.composer.editor.insertAtCursor(':')} icon="far fa-smile">
{app.translator.trans('flarum-emoji.forum.composer.emoji_tooltip')} {app.translator.trans('flarum-emoji.forum.composer.emoji_tooltip')}
</TextEditorButton> </TextEditorButton>
)); ));