bustle
diff --git a/‎assets/demo/demo.js‎
Lines changed: 31 additions & 32 deletions b/‎assets/demo/demo.js‎
Lines changed: 31 additions & 32 deletions
diff --git a/‎assets/demo/index.html‎
Lines changed: 1 addition & 2 deletions b/‎assets/demo/index.html‎
Lines changed: 1 addition & 2 deletions
@@ -1,16 +1,26 @@
-/* global Mobiledoc */
-'use strict';
+import { Editor } from './mobiledoc.js';
 
-$(() => {
-  bootstrapEditor();
-  bootstrapSimpleDemo();
-  bootstrapToolbarEditor();
-  bootstrapCardEditor();
-});
+function bootstrapSimpleDemo() {
+  let el = $('#editor-basic')[0];
+  let editor = new Editor({
+    placeholder: 'Welcome to Mobiledoc'
+  });
+  editor.render(el);
+}
 
-let bootstrapEditor = () => {
+function activateButtons(parentSelector, editor) {
+  $(`${parentSelector} button`).click(function () {
+    let button = $(this);
+    let action = button.data('action');
+    let args = button.data('args').split(',');
+
+    editor[action](...args);
+  });
+}
+
+function bootstrapEditor() {
   let el = $('#editor')[0];
-  let editor = new Mobiledoc.Editor({
+  let editor = new Editor({
     placeholder: 'Type here',
     autofocus: true
   });
@@ -23,35 +33,17 @@ let bootstrapEditor = () => {
   };
   editor.postDidChange(displayMobiledoc);
   displayMobiledoc();
-};
-
-let bootstrapSimpleDemo = () => {
-  let el = $('#editor-basic')[0];
-  let editor = new Mobiledoc.Editor({
-    placeholder: 'Welcome to Mobiledoc',
-  });
-  editor.render(el);
-};
-
-let activateButtons = (parentSelector, editor) => {
-  $(`${parentSelector} button`).click(function() {
-    let button = $(this);
-    let action = button.data('action');
-    let args = button.data('args').split(',');
-
-    editor[action](...args);
-  });
-};
+}
 
 let bootstrapToolbarEditor = () => {
   let el = $('#editor-toolbar')[0];
-  let editor = new Mobiledoc.Editor({
+  let editor = new Editor({
     placeholder: 'Editor with toolbar'
   });
   editor.render(el);
 
   activateButtons('#editor-toolbar-wrapper', editor);
-}
+};
 
 let bootstrapCardEditor = () => {
   let card = {
@@ -73,11 +65,18 @@ let bootstrapCardEditor = () => {
     }
   };
   let el = $('#editor-card')[0];
-  let editor = new Mobiledoc.Editor({
+  let editor = new Editor({
     placeholder: 'Editor with card',
     cards: [card],
     atoms: [atom]
   });
   editor.render(el);
   activateButtons('#editor-card-wrapper', editor);
 };
+
+$(() => {
+  bootstrapEditor();
+  bootstrapSimpleDemo();
+  bootstrapToolbarEditor();
+  bootstrapCardEditor();
+});
@@ -6,9 +6,8 @@
 </head>
 <body>
   <script src="../tests/jquery/jquery.js"></script>
-  <script src="../global/mobiledoc-kit.js"></script>
   <script src="./vendor/mobiledoc-pretty-json-renderer.js"></script>
-  <script src="./demo.js"></script>
+  <script type="module" src="./demo.js"></script>
   <link rel="stylesheet" href="../css/mobiledoc-kit.css">
   <link rel="stylesheet" href="./demo.css">
   <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.8.0/styles/default.min.css">