bitbake: toaster: changes to the landing page

This patch brings in a new landing page to be shown
when there are no builds and no projects available.

The builds page now displays only only the builds part,
without the landing page bits.

There is a new projects page that displays the All Projects
table as specified in the design.

[YOCTO #6682]

(Bitbake rev: c6c7c05521daa9bf16c122d7d472330ca4c05e88)

Signed-off-by: Alexandru DAMIAN <alexandru.damian@intel.com>
Signed-off-by: Richard Purdie <richard.purdie@linuxfoundation.org>

7 files changed, 240 insertions, 76 deletions

diff --git a/bitbake/lib/toaster/toastergui/templates/basetable_top.html b/bitbake/lib/toaster/toastergui/templates/basetable_top.html
index e3f6a4ee23..92a3b50801 100644
--- a/bitbake/lib/toaster/toastergui/templates/basetable_top.html
+++ b/bitbake/lib/toaster/toastergui/templates/basetable_top.html
@@ -175,8 +175,8 @@
             <button class="btn" type="submit" value="Search">Search</button>
         </form>
         <div class="pull-right">
+            {% block custombuttons%} {% endblock %}
 {% if tablecols %}
-                {% block custombuttons%} {% endblock %}
             <div class="btn-group">
                 <button class="btn dropdown-toggle" data-toggle="dropdown">Edit columns
                     <span class="caret"></span>
diff --git a/bitbake/lib/toaster/toastergui/templates/basetable_top_buildprojects.html b/bitbake/lib/toaster/toastergui/templates/basetable_top_buildprojects.html
new file mode 100644
index 0000000000..d517179592
--- /dev/null
+++ b/bitbake/lib/toaster/toastergui/templates/basetable_top_buildprojects.html
@@ -0,0 +1,16 @@
+{% extends "basetable_top.html" %}
+
+{%block custombuttons %}
+{% if MANAGED %}
+  <div class="btn-group builds-projects">
+    <button class="btn dropdown-toggle" data-toggle="dropdown">
+        <span class="selection">Show all builds</span>
+        <i class="icon-caret-down"></i>
+    </button>
+    <ul class="dropdown-menu">
+        <li><a href="{% url 'all-builds'%}">Show all builds</a></li>
+        <li><a href="{% url 'all-projects'%}">Show all projects</a></li>
+    </ul>
+  </div>
+{% endif %}
+{%endblock%}
diff --git a/bitbake/lib/toaster/toastergui/templates/basetable_top_projectbuilds.html b/bitbake/lib/toaster/toastergui/templates/basetable_top_projectbuilds.html
new file mode 100644
index 0000000000..bfefff5e33
--- /dev/null
+++ b/bitbake/lib/toaster/toastergui/templates/basetable_top_projectbuilds.html
@@ -0,0 +1,16 @@
+{% extends "basetable_top.html" %}
+
+{%block custombuttons %}
+{% if MANAGED %}
+  <div class="btn-group builds-projects">
+    <button class="btn dropdown-toggle" data-toggle="dropdown">
+        <span class="selection">Show all projects</span>
+        <i class="icon-caret-down"></i>
+    </button>
+    <ul class="dropdown-menu">
+        <li><a href="{% url 'all-builds'%}">Show all builds</a></li>
+        <li><a href="{% url 'all-projects'%}">Show all projects</a></li>
+    </ul>
+  </div>
+{% endif %}
+{%endblock%}
diff --git a/bitbake/lib/toaster/toastergui/templates/build.html b/bitbake/lib/toaster/toastergui/templates/build.html
index bef1f15399..f20f041749 100644
--- a/bitbake/lib/toaster/toastergui/templates/build.html
+++ b/bitbake/lib/toaster/toastergui/templates/build.html
@@ -6,83 +6,11 @@
 
 {% block pagecontent %}
 <div class="row-fluid">
-  {% if not objects.paginator.count and not request.GET.filter and not request.GET.search %}
-    <!-- Empty - no data in database -->
-    <div class="hero-unit span12">
-        <button type="button" class="close" data-dismiss="alert">&times;</button>
-        <div class="row-fluid">
-            <div class="span6">
-                <h1>This is Toaster</h1>
-                <p>A web interface to <a href="http://www.yoctoproject.org/tools-resources/projects/bitbake">BitBake</a>, the <a href="http://www.yoctoproject.org">Yocto Project</a> build system.</p>
-                <p class="hero-actions">
-                    <a class="btn btn-primary btn-large" href="https://www.yoctoproject.org/documentation/toaster-manual">Show me the manual</a>
-                    <a class="btn btn-large" href="https://wiki.yoctoproject.org/wiki/Contribute_to_Toaster">I want to contribute</a>
-                </p>
-            </div>
-            <div class="span5">
-                <a href="http://www.yoctoproject.org"><img src="{% static 'img/toaster.png' %}" class="thumbnail" alt="Yocto Project"/> </a>
-            </div>
-        </div>
-    </div>
-  {% endif %}
 
-  {%if mru.count > 0%}
-  <div class="page-header top-air">
-      <h1>
-          Recent Builds
-       </h1>
-  </div>
-  {% for build in mru %}
-    <div class="alert {%if build.outcome == build.SUCCEEDED%}alert-success{%elif build.outcome == build.FAILED%}alert-error{%else%}alert-info{%endif%}">
-        <div class="row-fluid">
-            <div class="lead span5">
-                {%if build.outcome == build.SUCCEEDED%}<i class="icon-ok-sign success"></i>{%elif build.outcome == build.FAILED%}<i class="icon-minus-sign error"></i>{%else%}{%endif%}
-    {%if build.outcome == build.SUCCEEDED or build.outcome == build.FAILED %}
-                <a href="{%url 'builddashboard' build.pk%}" class="{%if build.outcome == build.SUCCEEDED %}success{%else%}error{%endif%}">
-    {% endif %}
-                <span data-toggle="tooltip" {%if build.target_set.all.count > 1%}title="Targets: {%for target in build.target_set.all%}{{target.target}} {%endfor%}"{%endif%}>{{build.target_set.all.0.target}} {%if build.target_set.all.count > 1%}(+ {{build.target_set.all.count|add:"-1"}}){%endif%} {{build.machine}} ({{build.completed_on|naturaltime}})</span>
-    {%if build.outcome == build.SUCCEEDED or build.outcome == build.FAILED %}
-                </a>
-    {% endif %}
-            </div>
-    {%if build.outcome == build.SUCCEEDED or build.outcome == build.FAILED %}
-            <div class="span2 lead">
-    {% if  build.errors_no %}
-                <i class="icon-minus-sign red"></i> <a href="{%url 'builddashboard' build.pk%}#errors" class="error">{{build.errors_no}} error{{build.errors_no|pluralize}}</a>
-    {% endif %}
-            </div>
-            <div class="span2 lead">
-    {% if  build.warnings_no %}
-                <i class="icon-warning-sign yellow"></i> <a href="{%url 'builddashboard' build.pk%}#warnings" class="warning">{{build.warnings_no}} warning{{build.warnings_no|pluralize}}</a>
-    {% endif %}
-            </div>
-            <div class="lead pull-right">
-                Build time: <a href="{% url 'buildtime' build.pk %}">{{ build.timespent|sectohms }}</a>
-            </div>
-    {%endif%}{%if build.outcome == build.IN_PROGRESS %}
-            <div class="span4">
-                <div class="progress" style="margin-top:5px;" data-toggle="tooltip" title="{{build.completeper}}% of tasks complete">
-                    <div style="width: {{build.completeper}}%;" class="bar"></div>
-                </div>
-            </div>
-            <div class="lead pull-right">ETA: in {{build.eta|naturaltime}}</div>
-    {%endif%}
-        </div>
-    </div>
+  {% include "mrb_section.html" %}
 
-  {% endfor %}{%endif%}
 
-  {% if not objects.paginator.count and not request.GET.filter and not request.GET.search %}
-    <!-- Empty - no data in database -->
-    {% if mru.count == 0 %}
-    <div class="page-header top-air">
-       <h1>All builds</h1>
-    </div>
-    <div class="alert alert-info lead">
-        Toaster has not recorded any builds yet. Go build something with <a href="http://www.yoctoproject.org/docs/current/yocto-project-qs/yocto-project-qs.html#test-run">Knotty</a> or <a href="https://www.yoctoproject.org/documentation/hob-manual">Hob</a>
-    </div>
-    {% endif %}
-  {% else %}
+  {% if 1 %}
   <div class="page-header top-air">
      <h1>
       {% if request.GET.filter and objects.paginator.count > 0 or request.GET.search and objects.paginator.count > 0 %}
@@ -108,7 +36,7 @@
 
 
   {% else %}
-  {% include "basetable_top.html" %}
+  {% include "basetable_top_buildprojects.html" %}
         <!-- Table data rows; the order needs to match the order of "tablecols" definitions; and the <td class value needs to match the tablecols clclass value for show/hide buttons to work -->
         {% for build in objects %}
         <tr class="data">
diff --git a/bitbake/lib/toaster/toastergui/templates/landing.html b/bitbake/lib/toaster/toastergui/templates/landing.html
new file mode 100644
index 0000000000..071edf86ef
--- /dev/null
+++ b/bitbake/lib/toaster/toastergui/templates/landing.html
@@ -0,0 +1,66 @@
+{% extends "base.html" %}
+
+{% load static %}
+{% load projecttags %}
+{% load humanize %}
+
+{% block pagecontent %}
+
+  <div class="container-fluid">
+   <div class="row-fluid">
+    <!-- Empty - no data in database -->
+    <div class="hero-unit span12">
+     <button class="close" data-dismiss="alert" type="button">
+      ×
+     </button>
+     <div class="row-fluid">
+      <div class="span6">
+       <h1>
+        This is Toaster
+       </h1>
+       <p>
+        A web interface to
+        <a href="http://www.yoctoproject.org/tools-resources/projects/bitbake">
+         BitBake
+        </a>
+        , the
+        <a href="http://www.yoctoproject.org">
+         Yocto Project
+        </a>
+        build system.
+       </p>
+       <p class="hero-actions">
+        <a class="btn btn-primary btn-large" href="https://www.yoctoproject.org/documentation/toaster-manual">
+         Show me the manual
+        </a>
+        <a class="btn btn-large" href="https://wiki.yoctoproject.org/wiki/Contribute_to_Toaster">
+         I want to contribute
+        </a>
+       </p>
+      </div>
+      <div class="span5">
+       <a href="http://www.yoctoproject.org">
+        <img alt="Yocto Project" class="thumbnail" src="/static/img/toaster.png"/>
+       </a>
+      </div>
+     </div>
+    </div>
+    <!-- Empty - no data in database -->
+    <div class="page-header top-air">
+     <h1>
+      All builds
+     </h1>
+    </div>
+    <div class="alert alert-info lead">
+     Toaster has not recorded any builds yet. Go build something with
+     <a href="http://www.yoctoproject.org/docs/current/yocto-project-qs/yocto-project-qs.html#test-run">
+      Knotty
+     </a>
+     or
+     <a href="https://www.yoctoproject.org/documentation/hob-manual">
+      Hob
+     </a>
+    </div>
+   </div>
+
+{% endblock %}
diff --git a/bitbake/lib/toaster/toastergui/templates/mrb_section.html b/bitbake/lib/toaster/toastergui/templates/mrb_section.html
new file mode 100644
index 0000000000..5ba0b08495
--- /dev/null
+++ b/bitbake/lib/toaster/toastergui/templates/mrb_section.html
@@ -0,0 +1,102 @@
+{% load static %}
+{% load projecttags %}
+{% load humanize %}
+
+
+{%if mru.count > 0%}
+
+  <div class="page-header top-air">
+      <h1>
+          Latest Builds
+       </h1>
+  </div>
+  <div id="latest-builds">
+  {% for build in mru %}
+    <div class="alert {%if build.outcome == build.SUCCEEDED%}alert-success{%elif build.outcome == build.FAILED%}alert-error{%else%}alert-info{%endif%}" style="padding-top: 0;">
+    {% if build.project %}
+       <span class="label {%if build.outcome == build.SUCCEEDED%}label-success{%elif build.outcome == build.FAILED%}label-danger{%else%}label-info{%endif%}" style="font-weight: normal; margin-bottom: 5px; margin-left:-15px; padding-top:5px;"> {{build.project.name}} </span>
+    {% endif %}
+
+        <div class="row-fluid">
+            <div class="span4 lead">
+                {%if build.outcome == build.SUCCEEDED%}<i class="icon-ok-sign success"></i>{%elif build.outcome == build.FAILED%}<i class="icon-minus-sign error"></i>{%else%}{%endif%}
+    {%if build.outcome == build.SUCCEEDED or build.outcome == build.FAILED %}
+                <a href="{%url 'builddashboard' build.pk%}" class="{%if build.outcome == build.SUCCEEDED %}success{%else%}error{%endif%}">
+    {% endif %}
+                <span data-toggle="tooltip" {%if build.target_set.all.count > 1%}title="Targets: {%for target in build.target_set.all%}{{target.target}} {%endfor%}"{%endif%}>{{build.target_set.all.0.target}} {%if build.target_set.all.count > 1%}(+ {{build.target_set.all.count|add:"-1"}}){%endif%} {{build.machine}} ({{build.completed_on|naturaltime}})</span>
+    {%if build.outcome == build.SUCCEEDED or build.outcome == build.FAILED %}
+                </a>
+    {% endif %}
+            </div>
+    {%if build.outcome == build.SUCCEEDED or build.outcome == build.FAILED %}
+            <div class="span2 lead">
+      {% if  build.errors_no %}
+                <i class="icon-minus-sign red"></i> <a href="{%url 'builddashboard' build.pk%}#errors" class="error">{{build.errors_no}} error{{build.errors_no|pluralize}}</a>
+      {% endif %}
+            </div>
+            <div class="span2 lead">
+      {% if  build.warnings_no %}
+                <i class="icon-warning-sign yellow"></i> <a href="{%url 'builddashboard' build.pk%}#warnings" class="warning">{{build.warnings_no}} warning{{build.warnings_no|pluralize}}</a>
+      {% endif %}
+            </div>
+            <div class="lead ">
+              <span class="lead{%if not build.project%} pull-right{%endif%}">
+                Build time: <a href="{% url 'buildtime' build.pk %}">{{ build.timespent|sectohms }}</a>
+              </span>
+          {% if build.project %}
+              <a class="btn {%if build.outcome == build.SUCCEEDED%}btn-success{%elif build.outcome == build.FAILED%}btn-danger{%else%}btn-info{%endif%} pull-right" onclick="scheduleBuild({{build.project.name|json}}, {{build.get_sorted_target_list|mapselect:'target'|json}})">Run again</a>
+          {% endif %}
+            </div>
+    {%endif%}
+    {%if build.outcome == build.IN_PROGRESS %}
+            <div class="span4">
+                <div class="progress" style="margin-top:5px;" data-toggle="tooltip" title="{{build.completeper}}% of tasks complete">
+                    <div style="width: {{build.completeper}}%;" class="bar"></div>
+                </div>
+            </div>
+            <div class="lead pull-right">ETA: in {{build.eta|naturaltime}}</div>
+    {%endif%}
+        </div>
+    </div>
+
+  {% endfor %}
+  </div>
+
+<script>
+
+function _makeXHRBuildCall(data, onsuccess, onfail) {
+    $.ajax( {
+        type: "POST",
+        url: "{% url 'xhr_projectbuild' project.id %}",
+        data: data,
+        headers: { 'X-CSRFToken' : $.cookie('csrftoken')},
+        success: function (_data) {
+            if (_data.error != "ok") {
+                alert(_data.error);
+            } else {
+                if (onsuccess != undefined) onsuccess(_data);
+            }
+        },
+        error: function (_data) {
+            alert("Call failed");
+            console.log(_data);
+            if (onfail) onfail(data);
+        }
+    });
+}
+
+
+function scheduleBuild(projectName, buildlist) {
+  console.log("scheduleBuild");
+//  _makeXHRBuildCall({targets: buildlist.join(" ")}, function (_data) {
+
+  $('#latest-builds').prepend('<div class="alert alert-info" style="padding-top:0px">' + '<span class="label label-info" style="font-weight: normal; margin-bottom: 5px; margin-left:-15px; padding-top:5px;">'+projectName+'</span><div class="row-fluid">' +
+  '<div class="span4 lead">' + buildlist.join(" ") +
+  '</div><div class="span4 lead pull-right">Build queued. Your build will start shortly.</div></div></div>');
+//  }
+}
+
+</script>
+
+{%endif%}
+
diff --git a/bitbake/lib/toaster/toastergui/templates/projects.html b/bitbake/lib/toaster/toastergui/templates/projects.html
new file mode 100644
index 0000000000..432f025d3c
--- /dev/null
+++ b/bitbake/lib/toaster/toastergui/templates/projects.html
@@ -0,0 +1,36 @@
+{% extends "base.html" %}
+
+{% load static %}
+{% load projecttags %}
+{% load humanize %}
+
+{% block pagecontent %}
+
+
+  {% include "mrb_section.html" %}
+
+
+  <div class="page-header top-air">
+      <h1>
+         All projects
+       </h1>
+  </div>
+
+{% include "basetable_top_projectbuilds.html" %}
+  {% for o in objects %}
+    <tr class="data">
+      <td><a href="{% url 'project' o.id %}">{{o.name}}</a></td>
+      <td><a href="{% url 'project' o.id %}">{{o.release.name}}</a></td>
+      <td>{{o.get_current_machine_name}}</td>
+      <td>{{o.get_number_of_builds}}</td>
+      <td>{{o.get_last_outcome}}</td>
+      <td>{{o.get_last_target}}</td>
+      <td>{{o.get_last_errors}}</td>
+      <td>{{o.get_last_warnings}}</td>
+      <td>{{o.get_last_imgfiles}}</td>
+      <td>{{o.updated|date:"d/m/y H:i"}}</td>
+    </tr>
+  {% endfor %}
+{% include "basetable_bottom.html" %}
+
+{% endblock %}