FIX: simplify wizard composer event handling
Dieser Commit ist enthalten in:
Ursprung
7386be3ac0
Commit
9e1dfd9cf9
3 geänderte Dateien mit 64 neuen und 24 gelöschten Zeilen
|
@ -1,5 +1,6 @@
|
||||||
import ComposerEditor from "discourse/components/composer-editor";
|
import ComposerEditor from "discourse/components/composer-editor";
|
||||||
import {
|
import {
|
||||||
|
bind,
|
||||||
default as discourseComputed,
|
default as discourseComputed,
|
||||||
on,
|
on,
|
||||||
} from "discourse-common/utils/decorators";
|
} from "discourse-common/utils/decorators";
|
||||||
|
@ -12,6 +13,9 @@ import Site from "discourse/models/site";
|
||||||
import { uploadIcon } from "discourse/lib/uploads";
|
import { uploadIcon } from "discourse/lib/uploads";
|
||||||
import { dasherize } from "@ember/string";
|
import { dasherize } from "@ember/string";
|
||||||
|
|
||||||
|
const IMAGE_MARKDOWN_REGEX =
|
||||||
|
/!\[(.*?)\|(\d{1,4}x\d{1,4})(,\s*\d{1,3}%)?(.*?)\]\((upload:\/\/.*?)\)(?!(.*`))/g;
|
||||||
|
|
||||||
export default ComposerEditor.extend({
|
export default ComposerEditor.extend({
|
||||||
classNameBindings: ["fieldClass"],
|
classNameBindings: ["fieldClass"],
|
||||||
allowUpload: true,
|
allowUpload: true,
|
||||||
|
@ -25,7 +29,7 @@ export default ComposerEditor.extend({
|
||||||
popupMenuOptions: [],
|
popupMenuOptions: [],
|
||||||
draftStatus: "null",
|
draftStatus: "null",
|
||||||
replyPlaceholder: alias("field.translatedPlaceholder"),
|
replyPlaceholder: alias("field.translatedPlaceholder"),
|
||||||
uploadingFieldId: null,
|
wizardEventFieldId: null,
|
||||||
|
|
||||||
@on("didInsertElement")
|
@on("didInsertElement")
|
||||||
_composerEditorInit() {
|
_composerEditorInit() {
|
||||||
|
@ -76,7 +80,6 @@ export default ComposerEditor.extend({
|
||||||
|
|
||||||
const wizardEventNames = ["insert-text", "replace-text"];
|
const wizardEventNames = ["insert-text", "replace-text"];
|
||||||
const eventPrefix = this.eventPrefix;
|
const eventPrefix = this.eventPrefix;
|
||||||
const session = this.get("session");
|
|
||||||
this.appEvents.reopen({
|
this.appEvents.reopen({
|
||||||
trigger(name, ...args) {
|
trigger(name, ...args) {
|
||||||
let eventParts = name.split(":");
|
let eventParts = name.split(":");
|
||||||
|
@ -87,26 +90,8 @@ export default ComposerEditor.extend({
|
||||||
currentEventPrefix !== "wizard-editor" &&
|
currentEventPrefix !== "wizard-editor" &&
|
||||||
wizardEventNames.some((wen) => wen === currentEventName)
|
wizardEventNames.some((wen) => wen === currentEventName)
|
||||||
) {
|
) {
|
||||||
let wizardName = name.replace(eventPrefix, "wizard-editor");
|
let wizardEventName = name.replace(eventPrefix, "wizard-editor");
|
||||||
if (currentEventName === "insert-text") {
|
return this._super(wizardEventName, ...args);
|
||||||
args = {
|
|
||||||
text: args[0],
|
|
||||||
};
|
|
||||||
}
|
|
||||||
if (currentEventName === "replace-text") {
|
|
||||||
args = {
|
|
||||||
oldVal: args[0],
|
|
||||||
newVal: args[1],
|
|
||||||
};
|
|
||||||
}
|
|
||||||
let wizardArgs = Object.assign(
|
|
||||||
{},
|
|
||||||
{
|
|
||||||
fieldId: session.get("uploadingFieldId"),
|
|
||||||
},
|
|
||||||
args
|
|
||||||
);
|
|
||||||
return this._super(wizardName, wizardArgs);
|
|
||||||
} else {
|
} else {
|
||||||
return this._super(name, ...args);
|
return this._super(name, ...args);
|
||||||
}
|
}
|
||||||
|
@ -138,6 +123,28 @@ export default ComposerEditor.extend({
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@bind
|
||||||
|
_handleImageDeleteButtonClick(event) {
|
||||||
|
if (!event.target.classList.contains("delete-image-button")) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const index = parseInt(
|
||||||
|
event.target.closest(".button-wrapper").dataset.imageIndex,
|
||||||
|
10
|
||||||
|
);
|
||||||
|
const matchingPlaceholder =
|
||||||
|
this.get("composer.reply").match(IMAGE_MARKDOWN_REGEX);
|
||||||
|
|
||||||
|
this.session.set("wizardEventFieldId", this.field.id);
|
||||||
|
this.appEvents.trigger(
|
||||||
|
"composer:replace-text",
|
||||||
|
matchingPlaceholder[index],
|
||||||
|
"",
|
||||||
|
{ regex: IMAGE_MARKDOWN_REGEX, index }
|
||||||
|
);
|
||||||
|
},
|
||||||
|
|
||||||
actions: {
|
actions: {
|
||||||
extraButtons(toolbar) {
|
extraButtons(toolbar) {
|
||||||
const component = this;
|
const component = this;
|
||||||
|
@ -213,7 +220,7 @@ export default ComposerEditor.extend({
|
||||||
},
|
},
|
||||||
|
|
||||||
showUploadModal() {
|
showUploadModal() {
|
||||||
this.session.set("uploadingFieldId", this.field.id);
|
this.session.set("wizardEventFieldId", this.field.id);
|
||||||
document.getElementById(this.fileUploadElementId).click();
|
document.getElementById(this.fileUploadElementId).click();
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
|
@ -47,6 +47,39 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
api.modifyClass("component:d-editor", {
|
||||||
|
pluginId: "custom-wizard",
|
||||||
|
|
||||||
|
didInsertElement() {
|
||||||
|
this._super(...arguments);
|
||||||
|
|
||||||
|
if (this.wizardComposer) {
|
||||||
|
this.appEvents.on(
|
||||||
|
`wizard-editor:insert-text`,
|
||||||
|
this,
|
||||||
|
"_wizardInsertText"
|
||||||
|
);
|
||||||
|
this.appEvents.on(
|
||||||
|
"wizard-editor:replace-text",
|
||||||
|
this,
|
||||||
|
"_wizardReplaceText"
|
||||||
|
);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
_wizardInsertText(text, options) {
|
||||||
|
if (this.session.wizardEventFieldId === this.fieldId) {
|
||||||
|
this.insertText(text, options);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
_wizardReplaceText(oldVal, newVal, opts = {}) {
|
||||||
|
if (this.session.wizardEventFieldId === this.fieldId) {
|
||||||
|
this.replaceText(oldVal, newVal, opts);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
});
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
|
@ -11,7 +11,7 @@
|
||||||
validation=validation
|
validation=validation
|
||||||
loading=composer.loading
|
loading=composer.loading
|
||||||
showLink=showLink
|
showLink=showLink
|
||||||
wizardComposerEvents=true
|
wizardComposer=true
|
||||||
fieldId=field.id
|
fieldId=field.id
|
||||||
disabled=disableTextarea
|
disabled=disableTextarea
|
||||||
outletArgs=(hash composer=composer editorType="composer")}}
|
outletArgs=(hash composer=composer editorType="composer")}}
|
||||||
|
|
Laden …
In neuem Issue referenzieren