Merge pull request #58 from Ionaru/bugfix/simplemde-compatibility

Restore backwards compatibility with SimpleMDE
Ionaru · Mar 4, 2019 · 14bfa67 · 14bfa67
2 parents 07d96c3 + b14d7dd
commit 14bfa67
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 7 deletions.
diff --git a/package.json b/package.json
@@ -22,9 +22,9 @@
         "url": "https://github.com/ionaru/easy-markdown-editor/issues"
     },
     "dependencies": {
-        "codemirror": "^5.42.2",
+        "codemirror": "^5.43.0",
         "codemirror-spell-checker": "1.1.2",
-        "marked": "^0.6.0"
+        "marked": "^0.6.1"
     },
     "devDependencies": {
         "@types/codemirror": "0.0.72",
@@ -36,7 +36,7 @@
         "gulp-header": "^2.0.7",
         "gulp-rename": "^1.4.0",
         "gulp-uglify": "^3.0.1",
-        "typescript": "^3.2.2",
+        "typescript": "^3.3.3",
         "vinyl-buffer": "^1.0.0",
         "vinyl-source-stream": "^2.0.0"
     },

diff --git a/src/js/easymde.js b/src/js/easymde.js
@@ -113,9 +113,9 @@ function fixShortcut(name) {
 
 
 /**
- * Create icon element for toolbar.
+ * Create button element for toolbar.
  */
-function createIcon(options, enableTooltips, shortcuts) {
+function createToolbarButton(options, enableTooltips, shortcuts) {
     options = options || {};
     var el = document.createElement('button');
     el.className = options.name;
@@ -139,11 +139,28 @@ function createIcon(options, enableTooltips, shortcuts) {
         el.classList.add('no-mobile');
     }
 
+    // Provide backwards compatibility with simple-markdown-editor by adding custom classes to the button.
+    var classNameParts = options.className.split(' ');
+    var iconClasses = [];
+    for (var classNameIndex = 0; classNameIndex < classNameParts.length; classNameIndex++) {
+        var classNamePart = classNameParts[classNameIndex];
+        // Split icon classes from the button.
+        // Regex will detect "fa" and "fa-something", but not "fanfare".
+        if (classNamePart.match(/^fa((-.*)|$)/)) {
+            iconClasses.push(classNamePart);
+        } else {
+            el.classList.add(classNamePart);
+        }
+    }
+
     el.tabIndex = -1;
 
     // Create icon element and append as a child to the button
     var icon = document.createElement('i');
-    icon.className = options.className;
+    for (var iconClassIndex = 0; iconClassIndex < iconClasses.length; iconClassIndex++) {
+        var iconClass = iconClasses[iconClassIndex];
+        icon.classList.add(iconClass);
+    }
     el.appendChild(icon);
 
     return el;
@@ -1824,7 +1841,7 @@ EasyMDE.prototype.createToolbar = function (items) {
             if (item === '|') {
                 el = createSep();
             } else {
-                el = createIcon(item, self.options.toolbarTips, self.options.shortcuts);
+                el = createToolbarButton(item, self.options.toolbarTips, self.options.shortcuts);
             }
 
             // bind events, special for info

diff --git a/types/easymde.d.ts b/types/easymde.d.ts
@@ -82,6 +82,8 @@ declare namespace EasyMDE {
         action: string | ((editor: EasyMDE) => void);
         className: string;
         title: string;
+        noDisable?: boolean;
+        noMobile?: boolean;
     }
 
     interface Options {