From 02738ba3e01fd971bc4e548bb05503ed4b7639c5 Mon Sep 17 00:00:00 2001
From: Ryan Lerch <rlerch@redhat.com>
Date: May 30 2016 09:28:24 +0000
Subject: enable markdown preview on create pull request


Enables the markdown preview for the initial
comment field on the create pull request page.

This is implemented in the same way as the
preview on the create issue page

---

diff --git a/pagure/static/pagure.css b/pagure/static/pagure.css
index 34f7d57..22e57ac 100644
--- a/pagure/static/pagure.css
+++ b/pagure/static/pagure.css
@@ -107,11 +107,16 @@ white-space: nowrap;
 #preview
 {
     min-height: 16rem;
-    background:#ddd;
+    background:#efefef;
     padding:1em;
     border:1px solid #aaa;
 }
 
+.form-control#initial_comment
+{
+  min-height: 16rem;
+}
+
 
 .issue-metadata-form
 {
diff --git a/pagure/templates/pull_request.html b/pagure/templates/pull_request.html
index e17edca..65b202a 100644
--- a/pagure/templates/pull_request.html
+++ b/pagure/templates/pull_request.html
@@ -153,7 +153,29 @@
     </div>
     {% endif %}
     {{ render_bootstrap_field(form.title) }}
-    {{ render_bootstrap_field(form.initial_comment)}}
+    <fieldset class="form-group">
+      <label for="initial_comment"><strong>Inital Comment</strong></label>
+      <small class="text-muted pull-xs-right">
+        <span class="btn btn-sm btn-secondary inactive"
+          aria-pressed="false" id="previewinmarkdown">Preview</span>
+      </small>
+      <textarea class="form-control" id="initial_comment" name="initial_comment"
+          placeholder="Describe your Pull Request"></textarea>
+      <div>
+
+        {% if form.initial_comment.errors %}
+        <span class="pull-xs-right text-danger">
+          <small>
+          {% for error in form.initial_comment.errors %}
+            {{ error }}&nbsp;
+          {% endfor %}
+          </small>
+        </span>
+        {% endif %}
+      </div>
+      <div id="preview" style="display:none;">
+      </div>
+    </fieldset>
     <p class="buttons indent">
       <input type="submit" class="btn btn-primary" value="Create">
       {{ form.csrf_token }}
@@ -1086,7 +1108,46 @@ function updateHighlight(onload) {
     }
   }
 }
-$(document).ready(function () { updateHighlight(true) } );
+$(document).ready(function () {
+  updateHighlight(true)
+ {% if form %}
+  $( "#previewinmarkdown" ).click(
+    function(event, ui) {
+      if ($( "#previewinmarkdown" ).hasClass("inactive")){
+        var _text = $( "#initial_comment" ).val();
+        var _url = "{{ url_for('markdown_preview') }}";
+        $.ajax({
+          url: _url ,
+          type: 'POST',
+          data: {
+            content: _text,
+            csrf_token: "{{ form.csrf_token.current_token }}",
+          },
+          dataType: 'html',
+          success: function(res) {
+            var preview = emojione.toImage(res);
+            $( "#preview" ).html(preview);
+            $( "#previewinmarkdown" ).removeClass("inactive");
+            $( "#previewinmarkdown" ).addClass("active");
+            $( "#initial_comment" ).hide();
+            $( "#preview" ).show();
+          },
+          error: function() {
+            alert('Unable to generate preview!'+error);
+          }
+        });
+        return false;
+      } else if ($( "#previewinmarkdown" ).hasClass("active")){
+        $( "#previewinmarkdown" ).addClass("inactive");
+        $( "#previewinmarkdown" ).removeClass("active");
+        $( "#initial_comment" ).show();
+        $( "#preview" ).hide();
+      }
+    }
+  );
+  {% endif %}
+
+} );
 $(window).on('hashchange', updateHighlight);
 var selected = [];
 $("[data-line-number]").click(function (ev) {