From f6fb49f60e556197ac5ead314cfa4badc578afdb Mon Sep 17 00:00:00 2001
From: Paul Schneider <paul@pschneider.fr>
Date: Sun, 18 Sep 2016 00:06:03 +0200
Subject: [PATCH] Renders md to app@validate

---
 .../BookAStar.Droid/MarkdownEditor.cshtml     | 70 ++++++++++++++-----
 1 file changed, 52 insertions(+), 18 deletions(-)
diff --git a/BookAStar/BookAStar.Droid/MarkdownEditor.cshtml b/BookAStar/BookAStar.Droid/MarkdownEditor.cshtml
index 2d28ab19..95c8e56e 100644
--- a/BookAStar/BookAStar.Droid/MarkdownEditor.cshtml
+++ b/BookAStar/BookAStar.Droid/MarkdownEditor.cshtml
@@ -2,47 +2,81 @@
 <!DOCTYPE html>
 <html>
 <head>
+   
     <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width">
-
-    <link rel="stylesheet" href="katex.min.css" />
-
-    <link rel="stylesheet" href="monokai-sublime.min.css" />
 
     <link rel="stylesheet" href="quill.snow.css" />
 
     <style>
         .standalone-container {
-            margin: 20px auto;
+            margin: 0;
             width: 100%;
         }
 
-        #snow-container {
-            height: 100%;
+        #bubble-container {
+           height: 100%;
+        }
+
+        #bubble-container div.ql-editor {
+            margin-top:3em;
         }
-    </style>
 
+        .hidden {
+            display: none;
+        }
+    </style>
 
 </head>
 <body>
 
     <div class="standalone-container">
-        <div id="snow-container">@Html.Write(Model)</div>
+        <div id="bubble-container">@Html.Write(Model)</div>
     </div>
-
-    <script type="text/javascript" src="katex.min.js"></script>
-
-    <script type="text/javascript" src="highlight.min.js"></script>
-
+    <form><input type="hidden" name="md" id="md" />
+    <input id="btnSubmit" type="button" value="Valider" class="hidden" /></form>
     <script type="text/javascript" src="quill.min.js"></script>
+    <script type="text/javascript" src="jquery.js"></script>
+    <script type="text/javascript" src="showdown.js"></script>
+    <script type="text/javascript" src="to-markdown.js"></script>
+    <script type="text/javascript" src="md-helpers.js"></script>
 
     <script type="text/javascript">
-  var quill = new Quill('#snow-container', {
-    placeholder: 'Compose an epic...',
+        var toolbarOptions = [
+  ['bold', 'italic', 'underline', 'strike'],        // toggled buttons
+  ['blockquote', 'code-block'],
+
+  [{ 'header': 1 }, { 'header': 2 }],               // custom button values
+  [{ 'list': 'ordered' }, { 'list': 'bullet' }],
+  [{ 'indent': '-1' }, { 'indent': '+1' }],          // outdent/indent
+  
+  ['clean']                                         // remove formatting button
+        ];
+
+        var quill = new Quill('#bubble-container', {
+            modules: {
+                toolbar: toolbarOptions
+            },
+    placeholder: 'Composez votre texte ...',
     theme: 'snow'
   });
-    </script>
 
+  function getMD() {
+      return markdownize($('#bubble-container div.ql-editor').html())
+  }
+  quill.on('text-change', function (delta, oldDelta, source)
+  {
+      if (source === "user") {
+          $('#md').val(getMD());
+          $('#btnSubmit').removeClass('hidden');
+      }
+  });
+  $(document).ready(function () {
+      $('#btnSubmit').on('click', function () {
+          $.get("file:validate?md=" + encodeURIComponent(getMD()),
+       function (data, stat, jqXHR) { $('#result').html("Okay") })
+      })
+  });
+    </script>
 
 </body>
 </html>
