[Toaster] [PATCH 10/10] toaster: mrb_section template Add build cancel button

[Michael Wood]

Add the cancel build button to the mrb section template and add the event
handlers to cancelABuild.
Also clean up the calls to startABuild to use the updated libtoaster methods
and to make the code consistent with it's cancelABuild counterpart.

Co-Author: Sujith H <sujith.h at gmail.com>

Signed-off-by: Michael Wood <michael.g.wood at intel.com>
---
 .../toaster/toastergui/templates/mrb_section.html  | 102 ++++++++++++++-------
 1 file changed, 71 insertions(+), 31 deletions(-)

diff --git a/bitbake/lib/toaster/toastergui/templates/mrb_section.html b/bitbake/lib/toaster/toastergui/templates/mrb_section.html
index cceee7d..b440023 100644
--- a/bitbake/lib/toaster/toastergui/templates/mrb_section.html
+++ b/bitbake/lib/toaster/toastergui/templates/mrb_section.html
@@ -99,7 +99,7 @@
                   " title="Builds in this project cannot be started from Toaster: they are started from the command line">
                   </i>
               {% else %}
-                  <button class="btn
+                  <button class="run-again-btn btn
                       {% if build.outcome == build.SUCCEEDED %}
                           btn-success
                       {% elif build.outcome == build.FAILED %}
@@ -108,10 +108,9 @@
                           btn-info
                       {%endif%}
                       pull-right"
-                      onclick='scheduleBuild({% url 'projectbuilds' build.project.id as bpi %}{{bpi|json}},
-                        {{build.project.name|json}},
-                        {% url 'project' build.project.id as purl %}{{purl|json}},
-                        {{build.target_set.all|get_tasks|json}})'>
+                      data-request-url="{% url 'xhr_buildrequest' build.project.pk %}"
+                      data-target='{{build.target_set.all|get_tasks|json}}'>
+
 
                         Run again
                   </button>
@@ -119,46 +118,87 @@
             </div>
     {%endif%}
     {%if build.outcome == build.IN_PROGRESS %}
-            <div class="span4 offset1">
-              <div class="progress" id="build-pc-done-title-{{build.pk}}" style="margin-top:5px;" data-toggle="tooltip" title="{{build.completeper}}% of tasks complete">
-                  <div id="build-pc-done-bar-{{build.pk}}" style="width: {{build.completeper}}%;" class="bar"></div>
-                </div>
-            </div>
-            <div class="lead pull-right"><span id="build-pc-done-{{build.pk}}">{{build.completeper}}</span>% of tasks complete</div>
-    {%endif%}
-        </div>
+    <div class="span4" style="display:none" id="cancelling-msg-{{build.buildrequest.pk}}">
+      <p class="lead">Cancelling the build ...</p>
+    </div>
+    <div class="span4 offset1 progress-info">
+      <div class="progress" id="build-pc-done-title-{{build.pk}}" style="margin-top:5px;" data-toggle="tooltip" title="{{build.completeper}}% of tasks complete">
+        <div id="build-pc-done-bar-{{build.pk}}" style="width: {{build.completeper}}%;" class="bar"></div>
+      </div>
     </div>
+    <div class="lead span3 progress-info"><span id="build-pc-done-{{build.pk}}">{{build.completeper}}</span>% of tasks complete</div>
+    {# No build cancel for command line builds project #}
+    {% if build.project.is_default %}
+    <i class="icon-question-sign get-help get-help-blue pull-right" title="" data-original-title="Builds in this project cannot be cancelled from Toaster: they can only be cancalled from the command line"></i>
+    {% else %}
+    <div class="lead pull-right progress-info">
+      <button class="cancel-build-btn btn btn-info pull-right"
+          data-buildrequest-id={{build.buildrequest.pk}}
+          data-request-url="{% url 'xhr_buildrequest' build.project.pk %}" >
+        Cancel
+      </button>
+    </div>
+    {% endif %}
+
+    {%endif%} {# end if in progress #}
+
+    {% if build.outcome == build.CANCELLED %}
+    <div class="span4">
+      <p class="lead">Build cancelled</p>
+    </div>
+    <button class="btn btn-info pull-right run-again-btn"
+        data-request-url="{% url 'xhr_buildrequest' build.project.pk %}"
+        data-target='{{build.target_set.all|get_tasks|json}}'>
+      Run again
+
+    </button>
+    {% endif %}
+  </div>
+</div>
 
   {% endfor %}
   </div>
 
 <script>
 
-function scheduleBuild(url, projectName, projectUrl, buildlist) {
-  console.log("scheduleBuild");
-  libtoaster.startABuild(url, null, buildlist.join(" "), function(){
-    console.log("reloading page");
-    window.location.reload();
-  }, null);
-}
-
 $(document).ready(function(){
+  {%if mrb_type == 'project' %}
+  var projectBuilds = true;
+  {% else %}
+  var projectBuilds = false;
+  {% endif %}
+
+  $(".cancel-build-btn").click(function(e){
+    e.preventDefault();
 
-  $(".cancel-build-btn").click(function (){
     var url = $(this).data('request-url');
-    var buildIds = $(this).data('build-id');
-    var btn = $(this);
+    var buildReqIds = $(this).data('buildrequest-id');
+    var banner = $(this).parents(".alert");
+
+    banner.find(".progress-info").fadeOut(function(){
+      $("#cancelling-msg-" + buildReqIds).show();
+      libtoaster.cancelABuild(url, buildReqIds, function(){
+        if (projectBuilds == false){
+          /* the all builds page is not 'self updating' like thei
+           * project Builds
+           */
+          window.location.reload();
+        }
+      }, null);
+    });
+  });
+
+  $(".run-again-btn").click(function(e){
+    e.preventDefault();
 
-    libtoaster.cancelABuild(url, buildIds, function(){
-      btn.parents(".alert").fadeOut();
+    var url = $(this).data('request-url');
+    var target = $(this).data('target');
+
+    libtoaster.startABuild(url, target, function(){
+      window.location.reload();
     }, null);
   });
 
-  {%if mrb_type == 'project' %}
-  var projectBuilds = true;
-  {% else %}
-  var projectBuilds = false;
-  {% endif %}
 
   var progressTimer;
 
-- 
2.5.0