Make a previsualization button in page edit

core/templates/core/base.html

@@ -6,6 +6,7 @@
     <title>{% block title %}Bienvenue sur le Sith de l'AE!{% endblock %}</title>
     <link rel="stylesheet" href="{% static 'core/style.css' %}">
     <script src="{% static 'core/script.js' %}"></script>
+    <script src="http://code.jquery.com/jquery-2.2.0.min.js"></script>
     {% endblock %}
 </head>
 

core/templates/core/pagerev_edit.html

@@ -2,6 +2,17 @@
 
 {% block head %}
 {{ block.super }}
+<script>
+function make_preview() {
+    $.ajax({
+        url: "{% url 'core:api_markdown' %}",
+        method: "GET",
+        data: { text: $("#id_content").val() }
+    }).done(function (msg) {
+        $("#preview").html(msg);
+    });
+}
+</script>
 {% endblock %}
 
 {% block page %}
@@ -9,9 +20,11 @@
     <form action="{% url 'core:page_edit' page_name=page.get_full_name %}" method="post">
         {% csrf_token %}
         {{ form.as_p }}
-        {# TODO:  NOW THAT WE HAVE JAVASCRIPT, MAKE A PREVISUALISATION BUTTON USING api/markdown?text=guyguyguy #}
+        <p><input type="button" value="Preview" onclick="javascript:make_preview();" /></p>
         <p><input type="submit" value="Save!" /></p>
     </form>
+    <div id="preview">
+    </div>
 {% endblock %}
 
 

core/views/api.py

@@ -1,4 +1,5 @@
-from django.shortcuts import render
+from core.templatetags.renderer import markdown
+from django.http import HttpResponse
 
 def render_markdown(request):
-    return render(request, 'core/api/markdown.html', context={'text': request.GET['text']})
+    return HttpResponse(markdown(request.GET['text']))