[Findit] UI change and triage change for cl level trige.

appengine/findit/templates/build_failure.html

Index: appengine/findit/templates/build_failure.html
diff --git a/appengine/findit/templates/build_failure.html b/appengine/findit/templates/build_failure.html
index d8745af817f2ef4d26198aed50711553c0469c98..1dc8143f32d8acf85333cba35d5a7334e458f8c2 100644
--- a/appengine/findit/templates/build_failure.html
+++ b/appengine/findit/templates/build_failure.html
@@ -73,9 +73,52 @@
     findit.analysisIsDuplicate = '{{analysis_is_duplicate}}' == 'True';
     findit.showTriageHelpButton = '{{show_triage_help_button}}' == 'True';
     findit.showDebugInfo = '{{show_debug_info}}' == 'True';
+    findit.suspectedCLs = {{suspected_cls | tojson | safe}};
 
     {% block constant %}{% endblock constant %}
 
+    function displaySuspectedCls() {
+      if (! jQuery.isEmptyObject(findit.suspectedCLs)) {
+        var tableString = '<table>';
+        for (var i=0; i < findit.suspectedCLs.length; i++) {

[stgao, 2016/09/28 00:21:27]

As this is a simple table, can we just use NINJA template instead of pure
javascript.

We should not use javascript if possible.

[chanli, 2016/10/03 00:00:28]

Done.

+          var suspectedCL = findit.suspectedCLs[i];
+          var revision = suspectedCL.revision;
+          var commit_position = suspectedCL.commit_position || revision;
+          var cl_info = suspectedCL.repo_name + '/' + revision;
+          var status = suspectedCL.status;
+          tableString += '<tr><td>';
+          tableString += suspectedCL.repo_name + ' <a href="' + suspectedCL.url + '">' + commit_position + '</a></td>';
+          tableString += '<td>';
+
+          var str_radio_correct = '<input type="radio" name="' + cl_info + '" value="0" onclick="triageSuspectedCL(this)"';
+          var str_radio_incorrect = '<input type="radio" name="' + cl_info + '" value="1" onclick="triageSuspectedCL(this)"';
+          if (status == '0') {
+            str_radio_correct += ' checked="checked"';
+          } else if (status == '1') {
+            str_radio_incorrect += ' checked="checked"';
+          }
+          tableString += str_radio_correct + '>Correct &nbsp;&nbsp;';
+          tableString += str_radio_incorrect + '>Incorrect';
+          tableString += '</td></tr>';
+        }
+        tableString += '</table>';
+        $('#suspected_cls').html('<b>Feedback on Findit result:</b><br>' + tableString);
+      }
+    }
+
+    function triageSuspectedCL(e) {
+      $.getJSON('/waterfall/triage-suspected-cl?cl_info=' + e.name +'&status=' + e.value + '&url=' + findit.buildUrl, function(data) {
+        if (! data[success]) {
+          alert('Failed to update datastore. Please refresh and try again.');
+        }
+      }).error(function(xhr) {
+        // Replace the whole page with errors from server side.
+        document.body.outerHTML = xhr.responseText;
+      });
+
+      e.preventDefault();
+    }
+
     function triageAnalysisResult(e) {
       var target = $(this);
       if (target.hasClass('triaged'))
@@ -157,11 +200,7 @@
 
           {% block failure_classification %}{% endblock failure_classification %}
 
-          if (findit.analysisCorrect == 'True') {
-            $('.thumb-up').addClass('triaged').removeClass('triage');
-          } else if (findit.analysisCorrect == 'False') {
-            $('.thumb-down').addClass('triaged').removeClass('triage');
-          }
+          displaySuspectedCls();
 
           {% if show_debug_info %}
             if (findit.analysisIsDuplicate) {
@@ -232,10 +271,7 @@
   {% if analysis_completed %}
   <br>
   <div>
-    <b>Feedback on Findit result:</b><br>
-    <div class="thumbs-up-down">
-      <div class="triage thumb-up">Correct <img src="https://www.gstatic.com/images/icons/material/system/1x/thumb_up_black_24dp.png"/></div>
-      <div class="triage thumb-down"><img src="https://www.gstatic.com/images/icons/material/system/1x/thumb_down_black_24dp.png"/> Incorrect</div>
+    <div id="suspected_cls">
     </div>
     {% if show_debug_info %}
       <div id="duplicates_marked"></div>
@@ -259,12 +295,13 @@
     <b>Triage history:</b>
     <div>
       <table>
-        <tr><th>When</th><th>Who</th><th>Result</th><th>Version</th></tr>
+        <tr><th>When</th><th>Who</th><th>CL</th><th>Result</th><th>Version</th></tr>
         <tbody>
           {% for triage_record in triage_history %}
             <tr>
               <td>{{triage_record.triage_time}}</td>
               <td>{{triage_record.user_name}}</td>
+              <td>{{triage_record.triaged_cl.repo_name}} <a href="{{triage_record.triaged_cl.url}}">{{triage_record.triaged_cl.commit_position or triage_record.triaged_cl.revision}}</a></td>
               <td>{{triage_record.result_status}}</td>
               <td>{{triage_record.version | default('N/A', true)}}</td>
             </tr>