Merge branch 'master' into bugfix/simplemde-compatibility

.eslintrc

@@ -9,7 +9,8 @@
         "semi": [
             "error",
             "always"
-        ]
+        ],
+        "comma-dangle": ["error", "always-multiline"]
     },
     "env": {
         "browser": true,

.gitignore

@@ -1,3 +1,6 @@
+# generated files
+dist/
+
 # NPM files
 node_modules/
 

CONTRIBUTING.md

@@ -14,7 +14,7 @@ You can [submit an issue️](https://github.com/Ionaru/easy-markdown-editor/issu
 
 ### 📦 Prerequisites
 
-You need node.js and npm.
+You need Node.js and npm.
 
 To install them on Debian-based systems:
 
@@ -37,7 +37,7 @@ git clone https://github.com/Ionaru/easy-markdown-editor.git
 cd easy-markdown-editor
 ```
 
-Then install the EasyMDE with npm:
+Then install the required dependencies:
 
 ```bash
 npm install
@@ -50,12 +50,12 @@ Yay! You are ready! 🍾
 
 1. First, [create a fork of this project](https://github.com/Ionaru/easy-markdown-editor/fork), and copy the https URL (*clone or download* button) of your project (something like https://github.com/YOUR_USERNAME/easy-markdown-editor.git );
 2. a) If you already cloned and worked on the project: `git remote add source https://github.com/Ionaru/easy-markdown-editor.git`;
-b) otherwise, clone your fork: `git clone https://github.com/YOUR_USERNAME/easy-markdown-editor.git`;
+b) Otherwise, clone your fork: `git clone https://github.com/YOUR_USERNAME/easy-markdown-editor.git`;
-3. create a new dedicated branch `git checkout -b myMergeRequest`;
+3. Create a new dedicated branch `git checkout -b myMergeRequest`;
-4. write some nice code and commit your work;
+4. Write some nice code and commit your work;
-5. check files against the ESLint syntax and build minified versions: `gulp`;
+5. Check files against the ESLint syntax and build minified versions: `gulp`;
-6. push it to a dedicated branch `git push origin myMergeRequest`;
+6. Push it to a dedicated branch `git push origin myMergeRequest`;
-7. got to the [main project page](https://github.com/Ionaru/easy-markdown-editor) and click on the button *Compare and pull request*, then fill the description.
+7. Go to the [main project page](https://github.com/Ionaru/easy-markdown-editor) and click on the button *Compare and pull request*, then fill the description.
 
 If you want to make other pull requests, go back to the master branch (`git checkout master`), update it (`git pull --rebase source master`), then follow the instructions above from step 3.
 

README.md

@@ -2,7 +2,7 @@
 
 [![npm version](https://img.shields.io/npm/v/easymde.svg?style=for-the-badge)](https://www.npmjs.com/package/easymde)
 [![npm version](https://img.shields.io/npm/v/easymde/next.svg?style=for-the-badge)](https://www.npmjs.com/package/easymde/v/next)
-[![Build Status](https://img.shields.io/travis/Ionaru/easy-markdown-editor.svg?style=for-the-badge)](https://travis-ci.org/Ionaru/easy-markdown-editor)
+[![Build Status](https://img.shields.io/travis/Ionaru/easy-markdown-editor/master.svg?style=for-the-badge)](https://travis-ci.org/Ionaru/easy-markdown-editor)
 
 > This repository is a fork of
 [SimpleMDE, made by Sparksuite](https://github.com/sparksuite/simplemde-markdown-editor/).
@@ -151,7 +151,7 @@ easyMDE.value('New input for **EasyMDE**');
 - **renderingConfig**: Adjust settings for parsing the Markdown during previewing (not editing).
   - **codeSyntaxHighlighting**: If set to `true`, will highlight using [highlight.js](https://github.com/isagalaev/highlight.js). Defaults to `false`. To use this feature you must include highlight.js on your page or pass in using the `hljs` option. For example, include the script and the CSS files like:<br>`<script src="https://cdn.jsdelivr.net/highlight.js/latest/highlight.min.js"></script>`<br>`<link rel="stylesheet" href="https://cdn.jsdelivr.net/highlight.js/latest/styles/github.min.css">`
   - **hljs**: An injectible instance of [highlight.js](https://github.com/isagalaev/highlight.js). If you don't want to rely on the global namespace (`window.hljs`), you can provide an instance here. Defaults to `undefined`.
-  - **markedOptions**: Set the internal Markdown renderer's [options](https://github.com/chjj/marked#options-1). Other `renderingConfig` options will take precedence.
+  - **markedOptions**: Set the internal Markdown renderer's [options](https://marked.js.org/#/USING_ADVANCED.md#options). Other `renderingConfig` options will take precedence.
   - **singleLineBreaks**: If set to `false`, disable parsing GFM single line breaks. Defaults to `true`.
 - **shortcuts**: Keyboard shortcuts associated with this instance. Defaults to the [array of shortcuts](#keyboard-shortcuts).
 - **showIcons**: An array of icon names to show. Can be used to show specific icons hidden by default without completely customizing the toolbar.

package.json

@@ -2,6 +2,11 @@
     "name": "easymde",
     "version": "2.5.1",
     "description": "A simple, beautiful, and embeddable JavaScript Markdown editor that easy to use. Features include autosaving and spell checking.",
+    "files": [
+        "dist/**/*",
+        "src/**/*",
+        "types/easymde.d.ts"
+    ],
     "keywords": [
         "embeddable",
         "markdown",

src/js/easymde.js

@@ -42,7 +42,7 @@ var bindings = {
     'undo': undo,
     'redo': redo,
     'toggleSideBySide': toggleSideBySide,
-    'toggleFullScreen': toggleFullScreen
+    'toggleFullScreen': toggleFullScreen,
 };
 
 var shortcuts = {
@@ -59,7 +59,7 @@ var shortcuts = {
     'toggleCodeBlock': 'Cmd-Alt-C',
     'togglePreview': 'Cmd-P',
     'toggleSideBySide': 'F9',
-    'toggleFullScreen': 'F11'
+    'toggleFullScreen': 'F11',
 };
 
 var getBindingName = function (f) {
@@ -338,11 +338,11 @@ function toggleCodeBlock(editor) {
         line = line || cm.getLineHandle(line_num);
         firstTok = firstTok || cm.getTokenAt({
             line: line_num,
-            ch: 1
+            ch: 1,
         });
         lastTok = lastTok || (!!line.text && cm.getTokenAt({
             line: line_num,
-            ch: line.text.length - 1
+            ch: line.text.length - 1,
         }));
         var types = firstTok.type ? firstTok.type.split(' ') : [];
         if (lastTok && token_state(lastTok).indentedCode) {
@@ -375,10 +375,10 @@ function toggleCodeBlock(editor) {
         _replaceSelection(cm, false, [repl_start, repl_end]);
         cm.setSelection({
             line: start_line_sel,
-            ch: 0
+            ch: 0,
         }, {
             line: end_line_sel,
-            ch: 0
+            ch: 0,
         });
     }
 
@@ -387,7 +387,7 @@ function toggleCodeBlock(editor) {
         cur_end = cm.getCursor('end'),
         tok = cm.getTokenAt({
             line: cur_start.line,
-            ch: cur_start.ch || 1
+            ch: cur_start.ch || 1,
         }), // avoid ch 0 which is a cursor pos but not token
         line = cm.getLineHandle(cur_start.line),
         is_code = code_type(cm, cur_start.line, line, tok);
@@ -399,10 +399,10 @@ function toggleCodeBlock(editor) {
             end = line.text.slice(cur_start.ch).replace('`', '');
         cm.replaceRange(start + end, {
             line: cur_start.line,
-            ch: 0
+            ch: 0,
         }, {
             line: cur_start.line,
-            ch: 99999999999999
+            ch: 99999999999999,
         });
         cur_start.ch--;
         if (cur_start !== cur_end) {
@@ -423,7 +423,7 @@ function toggleCodeBlock(editor) {
             }
             var fencedTok = cm.getTokenAt({
                 line: block_start,
-                ch: 1
+                ch: 1,
             });
             var fence_chars = token_state(fencedTok).fencedChars;
             var start_text, start_line;
@@ -460,25 +460,25 @@ function toggleCodeBlock(editor) {
                 // end line first, so that line numbers don't change
                 cm.replaceRange(end_text, {
                     line: end_line,
-                    ch: 0
+                    ch: 0,
                 }, {
                     line: end_line + (end_text ? 0 : 1),
-                    ch: 0
+                    ch: 0,
                 });
                 cm.replaceRange(start_text, {
                     line: start_line,
-                    ch: 0
+                    ch: 0,
                 }, {
                     line: start_line + (start_text ? 0 : 1),
-                    ch: 0
+                    ch: 0,
                 });
             });
             cm.setSelection({
                 line: start_line + (start_text ? 1 : 0),
-                ch: 0
+                ch: 0,
             }, {
                 line: end_line + (start_text ? 1 : -1),
-                ch: 0
+                ch: 0,
             });
             cm.focus();
         } else {
@@ -513,17 +513,17 @@ function toggleCodeBlock(editor) {
             cm.operation(function () {
                 cm.replaceRange('', {
                     line: block_start,
-                    ch: 0
+                    ch: 0,
                 }, {
                     line: block_start + 1,
-                    ch: 0
+                    ch: 0,
                 });
                 cm.replaceRange('', {
                     line: block_end - 1,
-                    ch: 0
+                    ch: 0,
                 }, {
                     line: block_end,
-                    ch: 0
+                    ch: 0,
                 });
             });
             cm.focus();
@@ -569,13 +569,13 @@ function toggleCodeBlock(editor) {
         var next_line = cm.getLineHandle(block_end + 1),
             next_line_last_tok = next_line && cm.getTokenAt({
                 line: block_end + 1,
-                ch: next_line.text.length - 1
+                ch: next_line.text.length - 1,
             }),
             next_line_indented = next_line_last_tok && token_state(next_line_last_tok).indentedCode;
         if (next_line_indented) {
             cm.replaceRange('\n', {
                 line: block_end + 1,
-                ch: 0
+                ch: 0,
             });
         }
 
@@ -678,7 +678,7 @@ function drawLink(editor) {
     var options = editor.options;
     var url = 'https://';
     if (options.promptURLs) {
-        url = prompt(options.promptTexts.link);
+        url = prompt(options.promptTexts.link, 'https://');
         if (!url) {
             return false;
         }
@@ -695,7 +695,7 @@ function drawImage(editor) {
     var options = editor.options;
     var url = 'https://';
     if (options.promptURLs) {
-        url = prompt(options.promptTexts.image);
+        url = prompt(options.promptTexts.image, 'https://');
         if (!url) {
             return false;
         }
@@ -867,7 +867,7 @@ function _replaceSelection(cm, active, startEnd, url) {
         end = text.slice(startPoint.ch);
         cm.replaceRange(start + end, {
             line: startPoint.line,
-            ch: 0
+            ch: 0,
         });
     } else {
         text = cm.getSelection();
@@ -942,10 +942,10 @@ function _toggleHeading(cm, direction, size) {
 
             cm.replaceRange(text, {
                 line: i,
-                ch: 0
+                ch: 0,
             }, {
                 line: i,
-                ch: 99999999999999
+                ch: 99999999999999,
             });
         })(i);
     }
@@ -966,14 +966,14 @@ function _toggleLine(cm, name) {
     var repl = {
         'quote': /^(\s*)>\s+/,
         'unordered-list': listRegexp,
-        'ordered-list': listRegexp
+        'ordered-list': listRegexp,
     };
 
     var _getChar = function (name, i) {
         var map = {
             'quote': '>',
             'unordered-list': '*',
-            'ordered-list': '%%i.'
+            'ordered-list': '%%i.',
         };
 
         return map[name].replace('%%i', i);
@@ -983,7 +983,7 @@ function _toggleLine(cm, name) {
         var map = {
             'quote': '>',
             'unordered-list': '*',
-            'ordered-list': 'd+.'
+            'ordered-list': 'd+.',
         };
         var rt = new RegExp(map[name]);
 
@@ -1011,10 +1011,10 @@ function _toggleLine(cm, name) {
             }
             cm.replaceRange(text, {
                 line: i,
-                ch: 0
+                ch: 0,
             }, {
                 line: i,
-                ch: 99999999999999
+                ch: 99999999999999,
             });
         })(i);
     }
@@ -1052,10 +1052,10 @@ function _toggleBlock(editor, type, start_chars, end_chars) {
         }
         cm.replaceRange(start + end, {
             line: startPoint.line,
-            ch: 0
+            ch: 0,
         }, {
             line: startPoint.line,
-            ch: 99999999999999
+            ch: 99999999999999,
         });
 
         if (type == 'bold' || type == 'strikethrough') {
@@ -1104,10 +1104,10 @@ function _cleanBlock(cm) {
 
         cm.replaceRange(text, {
             line: line,
-            ch: 0
+            ch: 0,
         }, {
             line: line,
-            ch: 99999999999999
+            ch: 99999999999999,
         });
     }
 }
@@ -1144,7 +1144,7 @@ function extend(target) {
 
 /* The right word count in respect for CJK. */
 function wordCount(data) {
-    var pattern = /[a-zA-Z0-9_\u0392-\u03c9\u0410-\u04F9]+|[\u4E00-\u9FFF\u3400-\u4dbf\uf900-\ufaff\u3040-\u309f\uac00-\ud7af]+/g;
+    var pattern = /[a-zA-Z0-9_\u00A0-\u02AF\u0392-\u03c9\u0410-\u04F9]+|[\u4E00-\u9FFF\u3400-\u4dbf\uf900-\ufaff\u3040-\u309f\uac00-\ud7af]+/g;
     var m = data.match(pattern);
     var count = 0;
     if (m === null) return count;
@@ -1164,125 +1164,125 @@ var toolbarBuiltInButtons = {
         action: toggleBold,
         className: 'fa fa-bold',
         title: 'Bold',
-        default: true
+        default: true,
     },
     'italic': {
         name: 'italic',
         action: toggleItalic,
         className: 'fa fa-italic',
         title: 'Italic',
-        default: true
+        default: true,
     },
     'strikethrough': {
         name: 'strikethrough',
         action: toggleStrikethrough,
         className: 'fa fa-strikethrough',
-        title: 'Strikethrough'
+        title: 'Strikethrough',
     },
     'heading': {
         name: 'heading',
         action: toggleHeadingSmaller,
         className: 'fa fa-header fa-heading',
         title: 'Heading',
-        default: true
+        default: true,
     },
     'heading-smaller': {
         name: 'heading-smaller',
         action: toggleHeadingSmaller,
         className: 'fa fa-header fa-heading header-smaller',
-        title: 'Smaller Heading'
+        title: 'Smaller Heading',
     },
     'heading-bigger': {
         name: 'heading-bigger',
         action: toggleHeadingBigger,
         className: 'fa fa-header fa-heading header-bigger',
-        title: 'Bigger Heading'
+        title: 'Bigger Heading',
     },
     'heading-1': {
         name: 'heading-1',
         action: toggleHeading1,
         className: 'fa fa-header fa-heading header-1',
-        title: 'Big Heading'
+        title: 'Big Heading',
     },
     'heading-2': {
         name: 'heading-2',
         action: toggleHeading2,
         className: 'fa fa-header fa-heading header-2',
-        title: 'Medium Heading'
+        title: 'Medium Heading',
     },
     'heading-3': {
         name: 'heading-3',
         action: toggleHeading3,
         className: 'fa fa-header fa-heading header-3',
-        title: 'Small Heading'
+        title: 'Small Heading',
     },
     'separator-1': {
-        name: 'separator-1'
+        name: 'separator-1',
     },
     'code': {
         name: 'code',
         action: toggleCodeBlock,
         className: 'fa fa-code',
-        title: 'Code'
+        title: 'Code',
     },
     'quote': {
         name: 'quote',
         action: toggleBlockquote,
         className: 'fa fa-quote-left',
         title: 'Quote',
-        default: true
+        default: true,
     },
     'unordered-list': {
         name: 'unordered-list',
         action: toggleUnorderedList,
         className: 'fa fa-list-ul',
         title: 'Generic List',
-        default: true
+        default: true,
     },
     'ordered-list': {
         name: 'ordered-list',
         action: toggleOrderedList,
         className: 'fa fa-list-ol',
         title: 'Numbered List',
-        default: true
+        default: true,
     },
     'clean-block': {
         name: 'clean-block',
         action: cleanBlock,
         className: 'fa fa-eraser',
-        title: 'Clean block'
+        title: 'Clean block',
     },
     'separator-2': {
-        name: 'separator-2'
+        name: 'separator-2',
     },
     'link': {
         name: 'link',
         action: drawLink,
         className: 'fa fa-link',
         title: 'Create Link',
-        default: true
+        default: true,
     },
     'image': {
         name: 'image',
         action: drawImage,
         className: 'fa fa-image',
         title: 'Insert Image',
-        default: true
+        default: true,
     },
     'table': {
         name: 'table',
         action: drawTable,
         className: 'fa fa-table',
-        title: 'Insert Table'
+        title: 'Insert Table',
     },
     'horizontal-rule': {
         name: 'horizontal-rule',
         action: drawHorizontalRule,
         className: 'fa fa-minus',
-        title: 'Insert Horizontal Line'
+        title: 'Insert Horizontal Line',
     },
     'separator-3': {
-        name: 'separator-3'
+        name: 'separator-3',
     },
     'preview': {
         name: 'preview',
@@ -1290,7 +1290,7 @@ var toolbarBuiltInButtons = {
         className: 'fa fa-eye',
         noDisable: true,
         title: 'Toggle Preview',
-        default: true
+        default: true,
     },
     'side-by-side': {
         name: 'side-by-side',
@@ -1299,7 +1299,7 @@ var toolbarBuiltInButtons = {
         noDisable: true,
         noMobile: true,
         title: 'Toggle Side by Side',
-        default: true
+        default: true,
     },
     'fullscreen': {
         name: 'fullscreen',
@@ -1308,54 +1308,54 @@ var toolbarBuiltInButtons = {
         noDisable: true,
         noMobile: true,
         title: 'Toggle Fullscreen',
-        default: true
+        default: true,
     },
     'separator-4': {
-        name: 'separator-4'
+        name: 'separator-4',
     },
     'guide': {
         name: 'guide',
-        action: 'https://simplemde.com/markdown-guide',
+        action: 'https://www.markdownguide.org/basic-syntax/',
         className: 'fa fa-question-circle',
         noDisable: true,
         title: 'Markdown Guide',
-        default: true
+        default: true,
     },
     'separator-5': {
-        name: 'separator-5'
+        name: 'separator-5',
     },
     'undo': {
         name: 'undo',
         action: undo,
         className: 'fa fa-undo',
         noDisable: true,
-        title: 'Undo'
+        title: 'Undo',
     },
     'redo': {
         name: 'redo',
         action: redo,
         className: 'fa fa-repeat fa-redo',
         noDisable: true,
-        title: 'Redo'
+        title: 'Redo',
-    }
+    },
 };
 
 var insertTexts = {
     link: ['[', '](#url#)'],
     image: ['![](', '#url#)'],
     table: ['', '\n\n| Column 1 | Column 2 | Column 3 |\n| -------- | -------- | -------- |\n| Text     | Text     | Text     |\n\n'],
-    horizontalRule: ['', '\n\n-----\n\n']
+    horizontalRule: ['', '\n\n-----\n\n'],
 };
 
 var promptTexts = {
     link: 'URL for the link:',
-    image: 'URL of the image:'
+    image: 'URL of the image:',
 };
 
 var blockStyles = {
     'bold': '**',
     'code': '```',
-    'italic': '*'
+    'italic': '*',
 };
 
 /**
@@ -1443,7 +1443,7 @@ function EasyMDE(options) {
 
     // Set default options for parsing config
     options.parsingConfig = extend({
-        highlightFormatting: true // needed for toggleCodeBlock to detect types of code
+        highlightFormatting: true, // needed for toggleCodeBlock to detect types of code
     }, options.parsingConfig || {});
 
 
@@ -1585,7 +1585,7 @@ EasyMDE.prototype.render = function (el) {
         backdrop.gitHubSpice = false;
 
         CodeMirrorSpellChecker({
-            codeMirrorInstance: CodeMirror
+            codeMirrorInstance: CodeMirror,
         });
     } else {
         mode = options.parsingConfig;
@@ -1596,7 +1596,7 @@ EasyMDE.prototype.render = function (el) {
     // eslint-disable-next-line no-unused-vars
     function configureMouse(cm, repeat, event) {
         return {
-            addNew: false
+            addNew: false,
         };
     }
 
@@ -1614,7 +1614,7 @@ EasyMDE.prototype.render = function (el) {
         allowDropFileTypes: ['text/plain'],
         placeholder: options.placeholder || el.getAttribute('placeholder') || '',
         styleSelectedText: (options.styleSelectedText != undefined) ? options.styleSelectedText : !isMobile(),
-        configureMouse: configureMouse
+        configureMouse: configureMouse,
     });
 
     this.codemirror.getScrollerElement().style.minHeight = options.minHeight;
@@ -1914,7 +1914,7 @@ EasyMDE.prototype.createStatusbar = function (status) {
             items.push({
                 className: status[i].className,
                 defaultValue: status[i].defaultValue,
-                onUpdate: status[i].onUpdate
+                onUpdate: status[i].onUpdate,
             });
         } else {
             var name = status[i];
@@ -1952,7 +1952,7 @@ EasyMDE.prototype.createStatusbar = function (status) {
             items.push({
                 className: name,
                 defaultValue: defaultValue,
-                onUpdate: onUpdate
+                onUpdate: onUpdate,
             });
         }
     }

types/easymde-test.ts

@@ -1,14 +1,16 @@
 // Create new instance
 const editor = new EasyMDE({
     autoDownloadFontAwesome: false,
-    element: document.getElementById("mdEditor")!,
+    element: document.getElementById('mdEditor')!,
-    hideIcons: ["side-by-side", "fullscreen"],
+    hideIcons: ['side-by-side', 'fullscreen'],
     shortcuts: {
-        drawTable: "Cmd-Alt-T",
+        drawTable: 'Cmd-Alt-T',
         toggleFullScreen: null
     },
     spellChecker: false,
-    onToggleFullScreen: (full: boolean) => { console.log('FullscreenToggled', full); },
+    onToggleFullScreen: (full: boolean) => {
+        console.log('FullscreenToggled', full);
+    },
     theme: 'someOtherTheme',
 });
 
@@ -23,4 +25,6 @@ const fullscreen = editor.isFullscreenActive() as boolean;
 editor.codemirror.setOption('readOnly', true);
 
 // Static properties
-EasyMDE.toggleItalic = (editor: EasyMDE) => { console.log('SomeButtonOverride'); };
+EasyMDE.toggleItalic = (editor: EasyMDE) => {
+    console.log('SomeButtonOverride');
+};

types/easymde.d.ts

@@ -54,6 +54,7 @@ declare namespace EasyMDE {
 
     interface Shortcuts {
         [action: string]: string | undefined | null;
+
         toggleBlockquote?: string | null;
         toggleBold?: string | null;
         cleanBlock?: string | null;
@@ -78,7 +79,7 @@ declare namespace EasyMDE {
 
     interface ToolbarIcon {
         name: string;
-        action: string|((editor: EasyMDE) => void);
+        action: string | ((editor: EasyMDE) => void);
         className: string;
         title: string;
         noDisable?: boolean;
@@ -105,10 +106,10 @@ declare namespace EasyMDE {
         shortcuts?: Shortcuts;
         showIcons?: ReadonlyArray<string>;
         spellChecker?: boolean;
-        status?: boolean|ReadonlyArray<string|StatusBarItem>;
+        status?: boolean | ReadonlyArray<string | StatusBarItem>;
         styleSelectedText?: boolean;
         tabSize?: number;
-        toolbar?: boolean|ReadonlyArray<string|ToolbarIcon>;
+        toolbar?: boolean | ReadonlyArray<string | ToolbarIcon>;
         toolbarTips?: boolean;
         onToggleFullScreen?: (goingIntoFullScreen: boolean) => void;
         theme?: string;
@@ -117,13 +118,20 @@ declare namespace EasyMDE {
 
 declare class EasyMDE {
     constructor(options?: EasyMDE.Options);
+
     value(): string;
     value(val: string): void;
+
     codemirror: CodeMirror.Editor;
+
     toTextArea(): void;
+
     isPreviewActive(): boolean;
+
     isSideBySideActive(): boolean;
+
     isFullscreenActive(): boolean;
+
     clearAutosavedValue(): void;
 
     static toggleBold: (editor: EasyMDE) => void;