Netsyms/easy-markdown-editor
2
0
Fork 0
mirror of https://github.com/Ionaru/easy-markdown-editor synced 2025-09-24 16:40:55 -06:00
Code Issues Releases Wiki Activity

Allow imageUploadFunction to return a data-URI

Browse Source 
This allows to include images without uploading them onto a server first. Instead their content is specified inline in a
data-URI <https://developer.mozilla.org/en-US/docs/Web/URI/Reference/Schemes/data>.

Example of an `imageUploadFunction` that takes advantage of this:

(file, onSuccess, onError) => {
    const reader = new FileReader();
    reader.addEventListener('load', () => onSuccess(reader.result));
    reader.addEventListener('error', (event) => onError(event));
    reader.addEventListener('abort', (event) => onError(event));
    reader.readAsDataURL(file);
}
This commit is contained in:
Pablo Zmdl 2025-08-26 18:15:29 +02:00
parent 2996b67ec9
commit bc75c74d82
1 changed files with 11 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/js/easymde.js
View File

@ -878,11 +878,18 @@ function afterImageUploaded(editor, url) {
var cm = editor.codemirror; var cm = editor.codemirror;
var stat = getState(cm); var stat = getState(cm);
var options = editor.options; var options = editor.options;
var imageName = url.substr(url.lastIndexOf('/') + 1); var imageName = '';
var isImage = false;
if (url.startsWith('data:')) {
isImage = !!url.match(/^data:\s*image\/(\w+);/);
} else {
imageName = url.substr(url.lastIndexOf('/') + 1);
var ext = imageName.substring(imageName.lastIndexOf('.') + 1).replace(/\?.*$/, '').toLowerCase(); var ext = imageName.substring(imageName.lastIndexOf('.') + 1).replace(/\?.*$/, '').toLowerCase();
isImage = ['png', 'jpg', 'jpeg', 'gif', 'svg', 'apng', 'avif', 'webp'].includes(ext);
}
// Check if media is an image // Check if media is an image
if (['png', 'jpg', 'jpeg', 'gif', 'svg', 'apng', 'avif', 'webp'].includes(ext)) { if (isImage) {
_replaceSelection(cm, stat.image, options.insertTexts.uploadedImage, url); _replaceSelection(cm, stat.image, options.insertTexts.uploadedImage, url);
} else { } else {
var text_link = options.insertTexts.link; var text_link = options.insertTexts.link;
@ -2397,6 +2404,7 @@ EasyMDE.prototype.clearAutosavedValue = function () {
EasyMDE.prototype.openBrowseFileWindow = function (onSuccess, onError) { EasyMDE.prototype.openBrowseFileWindow = function (onSuccess, onError) {
var self = this; var self = this;
var imageInput = this.gui.toolbar.getElementsByClassName('imageInput')[0]; var imageInput = this.gui.toolbar.getElementsByClassName('imageInput')[0];
imageInput.value = ''; // Workaround so the 'change' event gets triggered even if the same file is selected repeatedly.
imageInput.click(); //dispatchEvent(new MouseEvent('click')); // replaced with click() for IE11 compatibility. imageInput.click(); //dispatchEvent(new MouseEvent('click')); // replaced with click() for IE11 compatibility.
function onChange(event) { function onChange(event) {
if (self.options.imageUploadFunction) { if (self.options.imageUploadFunction) {