Added typings for image upload

README.md

@@ -154,7 +154,7 @@ easyMDE.value('New input for **EasyMDE**');
 - **imageAccept**: A comma-separated list of mime-types used to check image type before upload (note: never trust client, always check file types at server-side). Defaults to `image/png, image/jpeg`.
 - **imageUploadEndpoint**: The endpoint where the images data will be sent, via an asynchronous *POST* request. The server is supposed to save this image, and return a json response.
      - if the request was successfully processed (HTTP 200-OK): `{"data": {"filePath": "<filePath>"}}` where *filePath* is the relative path of the image;
-     - otherwise: `{"error": "<errorCode>"}`, where *errorCode* can be `noFileGiven` (HTTP 400), `typeNotAllowed` (HTTP 415), `fileTooLarge` (HTTP 413) or `importError` (see *errorMessages* below). If *errorCode* is not one of the *errorMessages*, it is alerted unchanged to the user. This allows for server side error messages.  
+     - otherwise: `{"error": "<errorCode>"}`, where *errorCode* can be `noFileGiven` (HTTP 400), `typeNotAllowed` (HTTP 415), `fileTooLarge` (HTTP 413) or `importError` (see *errorMessages* below). If *errorCode* is not one of the *errorMessages*, it is alerted unchanged to the user. This allows for server side error messages.
      No default value.
 - **imageCSRFToken**: CSRF token to include with AJAX call to upload image. For instance used with Django backend. 
 - **imageTexts**: Texts displayed to the user (mainly on the status bar) for the import image feature, where `#image_name#`, `#image_size#` and `#image_max_size#` will replaced by their respective values, that can be used for customization or internationalization:

types/easymde-test.ts

@@ -59,3 +59,28 @@ const editor2 = new EasyMDE({
 });
 
 editor2.clearAutosavedValue();
+
+const editorImages = new EasyMDE({
+    uploadImage: true,
+    imageAccept: 'image/png, image/bmp',
+    imageCSRFToken: undefined,
+    imageMaxSize: 10485760,
+    imageUploadEndpoint: 'https://my.domain/image-upload/',
+    imageTexts: {
+        sbInit: 'Drag & drop images!',
+        sbOnDragEnter: 'Let it go, let it go',
+        sbOnDrop: 'Uploading...',
+        sbProgress: 'Uploading... (#progress#)',
+        sbOnUploaded: 'Upload complete!',
+        sizeUnits: 'b,Kb,Mb'
+    },
+    errorMessages: {
+        noFileGiven: 'Please select a file',
+        imageTypeNotAllowed: 'This file type is not allowed!',
+        imageTooLarge: 'Image too big',
+        imageImportError: 'Something went oops!',
+    },
+    errorCallback: (errorMessage) => {
+        console.error(errorMessage);
+    },
+});

types/easymde.d.ts

@@ -86,6 +86,22 @@ declare namespace EasyMDE {
         noMobile?: boolean;
     }
 
+    interface ImageTextsOptions {
+        sbInit?: string;
+        sbOnDragEnter?: string;
+        sbOnDrop?: string;
+        sbProgress?: string;
+        sbOnUploaded?: string;
+        sizeUnits?: string;
+    }
+
+    interface ImageErrorTextsOptions {
+        noFileGiven?: string;
+        imageTypeNotAllowed?: string;
+        imageTooLarge?: string;
+        imageImportError?: string;
+    }
+
     interface Options {
         autoDownloadFontAwesome?: boolean;
         autofocus?: boolean;
@@ -114,6 +130,15 @@ declare namespace EasyMDE {
         toolbarTips?: boolean;
         onToggleFullScreen?: (goingIntoFullScreen: boolean) => void;
         theme?: string;
+
+        uploadImage?: boolean;
+        imageMaxSize?: number;
+        imageAccept?: string;
+        imageUploadEndpoint?: string;
+        imageCSRFToken?: string;
+        imageTexts?: ImageTextsOptions;
+        errorMessages?: ImageErrorTextsOptions;
+        errorCallback?: (errorMessage: string) => void;
     }
 }