From ee4eb73c61c3141d2106f060aa6df5963ff8fc38 Mon Sep 17 00:00:00 2001
From: Pierre-Yves Chibon <pingou@pingoured.fr>
Date: Mar 30 2018 10:01:21 +0000
Subject: Support adding comments to issues without reloading and without the SSE


Note this currently only supports adding new comments, no
metadata-changes.

Signed-off-by: Pierre-Yves Chibon <pingou@pingoured.fr>

---

diff --git a/pagure/static/issue_ev.js b/pagure/static/issue_ev.js
index 53ec345..f5cd990 100644
--- a/pagure/static/issue_ev.js
+++ b/pagure/static/issue_ev.js
@@ -148,9 +148,11 @@ add_comment = function(data, username) {
       <img class="avatar circle" src="' + data.avatar_url + '"/> \
       <a href="/user/' + data.comment_user + '"> ' + data.comment_user + '\
         </a> \
-        <a class="headerlink pull-xs-right" title="Permalink to this headline" \
-          href="#comment-' + data.comment_id + '"> \
-          <span title="">seconds ago</span> \
+        <a class="headerlink pull-xs-right" title="Permalink to this headline"';
+    if (data.comment_id) {
+        _data += 'href="#comment-' + data.comment_id + '">';
+    }
+    _data += '<span title="">seconds ago</span> \
          </a>\
       </div>\
       <div class="card-block">\
@@ -163,11 +165,14 @@ add_comment = function(data, username) {
         </section> \
         <div class="issue_actions m-t-2"> \
           <aside class="issue_action icon pull-xs-right p-b-1"> \
-          <div class="btn-group" aria-label="Basic example" role="group"> \
+          <div class="btn-group" aria-label="Basic example" role="group">';
+    if (data.comment_id) {
+        _data += '\
           <a class="reply btn btn-secondary btn-sm" title="" data-toggle="tooltip" data-original-title="Reply to this comment - lose formatting"> \
               <span class="oi" data-glyph="share-boxed"></span> \
           </a>';
-      if ( data.comment_user == username) {
+    }
+      if ( data.comment_user == username && data.comment_id) {
             _data += '<a class="btn btn-secondary btn-sm" data-objid="' + data.issue_id
             + '" data-comment="' + data.comment_id
             + '" href="/' + data.project + '/issue/' + data.issue_id + '/comment/' + data.comment_id + '/edit"> \
diff --git a/pagure/templates/issue.html b/pagure/templates/issue.html
index e2ab290..9a979f8 100644
--- a/pagure/templates/issue.html
+++ b/pagure/templates/issue.html
@@ -661,29 +661,11 @@ $(document).ready(function() {
 });
 </script>
 
-{% if config['EVENTSOURCE_SOURCE'] and not issue.private %}
 <script type="text/javascript"
   src="{{ url_for('static', filename='issue_ev.js') }}"></script>
 
 <script type="text/javascript">
-var source = null;
-var sse = true;
-if (!!window.EventSource) {
-  source = new EventSource('{{ config["EVENTSOURCE_SOURCE"]
-    + request.script_root + request.path }}');
-  source.addEventListener('error', function(e) {
-    sse = false;
-  }, false);
-}
-
-window.onbeforeunload = function() {
-    source.close()
-};
-
-source.addEventListener('message', function(e) {
-  console.log(e.data);
-  var data = $.parseJSON(e.data);
-  var _issues_url ='{{
+    var _issues_url ='{{
     url_for('ui_ns.view_issues',
             repo=repo.name,
             username=username,
@@ -706,6 +688,26 @@ source.addEventListener('message', function(e) {
             username=username,
             namespace=repo.namespace,
             milestone='-123456789')}}';
+
+{% if config['EVENTSOURCE_SOURCE'] and not issue.private %}
+var source = null;
+var sse = true;
+if (!!window.EventSource) {
+  source = new EventSource('{{ config["EVENTSOURCE_SOURCE"]
+    + request.script_root + request.path }}');
+  source.addEventListener('error', function(e) {
+    sse = false;
+  }, false);
+}
+
+window.onbeforeunload = function() {
+    source.close()
+};
+
+source.addEventListener('message', function(e) {
+  console.log(e.data);
+  var data = $.parseJSON(e.data);
+
   process_event(data, "{{ issue.uid }}", _issue_url,
                 _issues_url, _api_issues_url, _roadmap_url,
                 "{{ g.fas_user.username if g.authenticated or '' }}");
@@ -713,6 +715,7 @@ source.addEventListener('message', function(e) {
   setup_reply_btns();
 
   }, false);
+{% endif %}
 
 {% if g.authenticated and form %}
 function set_ui_for_comment(setting){
@@ -724,9 +727,10 @@ function set_ui_for_comment(setting){
     document.body.style.cursor = 'wait';
   }
 }
+
 function try_async_comment(form) {
   console.log('Submitting form:');
-  console.log(form);
+
   set_ui_for_comment(true);
   var _data = $(form).serialize();
   var btn = $(document.activeElement);
@@ -735,12 +739,12 @@ function try_async_comment(form) {
     set_ui_for_comment(false);
     return true;
   }
-  if (!sse) {
-    $(form).off('submit');
-    form.submit();
-    return false;
-  }
   var _url = form.action + "?js=1";
+
+  /* Keep some variable in memory before sending them in case the SSE is down */
+  var _comment = $(form).find('#comment').val();
+  var _token = "{{ form.csrf_token.current_token }}";
+
   $.post( _url, _data )
     .done(function(data) {
       if(data == 'ok') {
@@ -757,7 +761,37 @@ function try_async_comment(form) {
         $( ".issue-metadata-display" ).show();
         $( ".issue-custom-form" ).hide();
         $( ".issue-custom-display" ).show();
-        set_ui_for_comment(false);
+        if (!sse) {
+            console.log('no sse, adding the comment manually');
+            $.ajax({
+              url: "{{ url_for('ui_ns.markdown_preview') }}" ,
+              type: 'POST',
+              data: {
+                content: _comment,
+                csrf_token: _token,
+              },
+              dataType: 'html',
+              success: function(res) {
+                var _comment = emojione.toImage(res);
+                var data = {
+                    comment_added: _comment,
+                    comment_user: "{{ g.fas_user.username }}",
+                    comment_date: Date.now(),
+                    avatar_url: "{{ g.fas_user.email | avatar_url(16) }}",
+                }
+                process_event(
+                    data,
+                    "{{ issue.uid }}", _issue_url,
+                    _issues_url, _api_issues_url, _roadmap_url,
+                    "{{ g.fas_user.username if g.authenticated or '' }}");
+                set_ui_for_comment(false);
+                return false;
+              }
+            });
+            return false;
+        } else {
+            set_ui_for_comment(false);
+        }
       } else {
         // Make the browser submit the form sync
         $(form).off('submit');
@@ -772,11 +806,10 @@ function try_async_comment(form) {
   return false;
 };
 {% endif %}
-
 </script>
-{% endif %}
-<script type="text/javascript">
 
+
+<script type="text/javascript">
 {% if g.authenticated and g.repo_user %}
 function take_issue(){
   var _url = "{{ url_for('api_ns.api_assign_issue',