Add a Markdown editor for article extracts

apps/rp/templates/rp/article_form.html

@@ -38,7 +38,6 @@
 
     {% crispy form %}
   </form>
-
 </div>
 </div>
 
@@ -49,5 +48,16 @@
     theme: "bootstrap"
   });
   $('.select2-container').width("auto");
+
+  var simplemde = new SimpleMDE({
+    element: $("#id_extracts")[0],
+    toolbar: ["bold", "italic", "strikethrough", "|", "heading", "quote", "link", "|", "side-by-side", "preview", "guide"],
+    spellChecker: false,
+    blockStyles: {
+      bold: "**",
+      italic: "_"
+    },
+  });
 </script>
+{{ form.media }}
 {% endblock %}

package.json

@@ -10,7 +10,8 @@
     "bootstrap": "4.0.0-alpha.6",
     "font-awesome": "^4.7.0",
     "select2": "^4.0.3",
-    "select2-bootstrap-theme": "^0.1.0-beta.10"
+    "select2-bootstrap-theme": "^0.1.0-beta.10",
+    "simplemde": "^1.11.2"
   },
   "devDependencies": {
     "css-loader": "^0.28.0",

static/src/admin.js

@@ -10,5 +10,9 @@ require('select2');
 require('select2/dist/css/select2.css');
 require('select2-bootstrap-theme/dist/select2-bootstrap.css');
 
+// Markdown editor
+global.SimpleMDE = require('simplemde');
+require('simplemde/dist/simplemde.min.css')
+
 // Local styles
 import styles from './admin.css';