bitbake: toasterui: small changes to empty states

This commit:

* Makes some changes to the layout and styles of the
landing.html template

* Adds the empty state to layers.html

* Changes the message of the empty state of machines.html
to use the same wording used in all other pages

* Adds the project name and the right styles to
the empty state of the project.html template

* Makes small changes in style and wording to the
empty state of targets.html

* Updates all "configure a layer source" links to point
to the new Toaster manual.

(Bitbake rev: d886db3add1351a806ab58ec7519d2321687187b)

Signed-off-by: Belen Barros Pena <belen.barros.pena@linux.intel.com>
Signed-off-by: Alexandru DAMIAN <alexandru.damian@intel.com>
Signed-off-by: Richard Purdie <richard.purdie@linuxfoundation.org>

5 files changed, 74 insertions, 84 deletions

diff --git a/bitbake/lib/toaster/toastergui/templates/landing.html b/bitbake/lib/toaster/toastergui/templates/landing.html
index d5ae9f5e20..5bbe694f89 100644
--- a/bitbake/lib/toaster/toastergui/templates/landing.html
+++ b/bitbake/lib/toaster/toastergui/templates/landing.html
@@ -9,80 +9,64 @@
   <div class="container-fluid">
    <div class="row-fluid">
     <!-- Empty - no data in database -->
-    <div class="hero-unit span12" {%if MANAGED%}style="background-color: white"{%endif%}>
-    {% if not MANAGED %}
-     <button class="close" data-dismiss="alert" type="button">
-      ×
-     </button>
-    {% endif %}
+    <div class="hero-unit span12 {%if MANAGED%}well-transparent{%endif%}">
      <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>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>
 
         {% if MANAGED %}
 
                 {% if lvs_nos %}
-                       <p class="hero-actions">
-                        <a class="btn btn-primary btn-large" href="{% url 'newproject' %}">
-                                To start building, create your first Toaster project
-                        </a>
-                       </p>
+                    <p class="hero-actions">
+                            <a class="btn btn-primary btn-large" href="{% url 'newproject' %}">
+                                    To start building, create your first Toaster project
+                            </a>
+                    </p>
                 {% else %}
-                <div class="alert alert-info">
-                        <p>
-                        Toaster has no layer information; without layer information, you cannot run builds. To generate layer information you can:
-                        </p>
-                        <ul>
-                         <li> <a href="https://wiki.yoctoproject.org/wiki/Setting_up_a_hosted_managed_mode_for_Toaster#LayerSources">Configure a layer source</a>
-                         </li>
-                         <li> <a href="{% url 'newproject' %}">Create a project</a>, then import layers
-                        </ul>
-                </div>
-                {% endif %}
+                    <div class="alert alert-info lead air">
+                            Toaster has no layer information. Without layer information, you cannot run builds. To generate layer information you can:
+                            <ul>
+                                <li>
+                                    <a href="http://www.yoctoproject.org/docs/latest/toaster-manual/toaster-manual.html#layer-source">Configure a layer source</a>
+                                </li>
+                                <li>
+                                    <a href="{% url 'newproject' %}">Create a project</a>, then import layers
+                                </li>
+                            </ul>
+                    </div>
+        {% endif %}
 
-       <p style="margin-top: 2em">
-        <a href="https://www.yoctoproject.org/documentation/toaster-manual">
-         Read the Toaster manual
-        </a> <br/>
-        <a href="https://wiki.yoctoproject.org/wiki/Contribute_to_Toaster">
-         Contribute to Toaster
-        </a>
-       </p>
+        <ul class="unstyled">
+            <li>
+                <a href="http://www.yoctoproject.org/docs/latest/toaster-manual/toaster-manual.html">Read the Toaster manual</a>
+            </li>
+            <li>
+                <a href="https://wiki.yoctoproject.org/wiki/Contribute_to_Toaster">Contribute to Toaster</a>
+            </li>
+        </ul>
 
-         {% else %}
+        {% else %}
 
-       <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>
+        <p class="hero-actions">
+            <a class="btn btn-primary btn-large" href="http://www.yoctoproject.org/docs/latest/toaster-manual/toaster-manual.html">
+                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>
 
-         {% endif %}
+            {% endif %}
       </div>
-      <div class="span5">
-       <a href="http://www.yoctoproject.org">
+      <div class="span6">
         {% if MANAGED %}
-        <img alt="Yocto Project" class="thumbnail" src="{% static 'img/toaster_1.7.png' %}"/>
-        {% else %}
-        <img alt="Yocto Project" class="thumbnail" src="{% static 'img/toaster.png' %}"/>
-        {% endif %}
-       </a>
+            <img alt="Yocto Project" class="thumbnail" src="{% static 'img/toaster_1.7.png' %}"/>
+            {% else %}
+            <img alt="Yocto Project" class="thumbnail" src="{% static 'img/toaster.png' %}"/>
+            {% endif %}
       </div>
      </div>
     </div>
diff --git a/bitbake/lib/toaster/toastergui/templates/layers.html b/bitbake/lib/toaster/toastergui/templates/layers.html
index c35a299333..24d31c770e 100644
--- a/bitbake/lib/toaster/toastergui/templates/layers.html
+++ b/bitbake/lib/toaster/toastergui/templates/layers.html
@@ -9,9 +9,9 @@
 {% block projectinfomain %}
                 <div class="page-header">
                     <h1>
-  {% if request.GET.filter and total_count >  0 or request.GET.search and total_count >  0 %}
-      {{total_count}} layer{{total_count|pluralize}} found
-  {% elif request.GET.filter and total_count ==  0 or request.GET.search and total_count == 0 %}
+  {% if request.GET.filter and objects.paginator.count >  0 or request.GET.search and objects.paginator.count >  0 %}
+      {{objects.paginator.count}} layer{{objects.paginator.count|pluralize}} found
+  {% elif request.GET.filter and objects.paginator.count ==  0 or request.GET.search and objects.paginator.count == 0 %}
       No layers found
   {%else%}
       All compatible layers
@@ -24,6 +24,7 @@
   </div>
 
 {% if objects.paginator.count == 0 %}
+  {% if request.GET.filter or request.GET.search %}
   <div class="row-fluid">
       <div class="alert">
         <form class="no-results input-append" id="searchform">
@@ -33,6 +34,15 @@
         </form>
       </div>
   </div>
+  {% else %}
+    <div class="alert alert-info lead">
+      <p>Toaster has no layer information. To generate layer information you can:</p>
+      <ul>
+       <li><a href="http://www.yoctoproject.org/docs/latest/toaster-manual/toaster-manual.html#layer-source">Configure a layer source</a></li>
+       <li><a href="{% url 'importlayer' %}">Import a layer</a></li>
+      </ul>
+    </div>
+  {% endif %}
 
 {% else %}
 
diff --git a/bitbake/lib/toaster/toastergui/templates/machines.html b/bitbake/lib/toaster/toastergui/templates/machines.html
index 1057bdda3f..2ac35378e0 100644
--- a/bitbake/lib/toaster/toastergui/templates/machines.html
+++ b/bitbake/lib/toaster/toastergui/templates/machines.html
@@ -59,10 +59,8 @@
             </form>
           </div>
     {% else %}
-            <div class="alert alert-info">
-              <p class="lead">
-               Toaster has no machine information. To fetch machine information you should <a href="https://wiki.yoctoproject.org/wiki/Setting_up_a_hosted_managed_mode_for_Toaster#LayerSources">configure a layer source</a>
-              </p>
+            <div class="alert alert-info lead">
+               Toaster has no machine information. To generate machine information you should <a href="http://www.yoctoproject.org/docs/latest/toaster-manual/toaster-manual.html#layer-source">configure a layer source</a>
             </div>
     {% endif %}
 
diff --git a/bitbake/lib/toaster/toastergui/templates/project.html b/bitbake/lib/toaster/toastergui/templates/project.html
index ae9ee9b44d..40048c2f2c 100644
--- a/bitbake/lib/toaster/toastergui/templates/project.html
+++ b/bitbake/lib/toaster/toastergui/templates/project.html
@@ -15,22 +15,22 @@ vim: expandtab tabstop=2
 <script src="{% static "js/angular-sanitize.min.js" %}"></script>
 <script src="{% static "js/ui-bootstrap-tpls-0.11.0.js" %}"></script>
 
-
 {% if lvs_nos == 0 %}
-<div class="alert alert-info">
-                        <p>
-                        Toaster has no layer information; without layer information, you cannot run builds.<br/> To generate layer information you can:
-                        </p>
-                        <ul>
-                         <li> <a href="https://wiki.yoctoproject.org/wiki/Setting_up_a_hosted_managed_mode_for_Toaster#LayerSources">Configure a layer source</a>
-                         </li>
-                         <li> <a href="{% url 'importlayer' %}">Import a layer</a>
-                        </ul>
+
+  <div class="page-header">
+    <h1> {{ project.name }} </h1>
+  </div>
+  <div class="alert alert-info lead">
+          <p>Toaster has no layer information. Without layer information, you cannot run builds. To generate layer information you can:</p>
+                <ul>
+                         <li> <a href="http://www.yoctoproject.org/docs/latest/toaster-manual/toaster-manual.html#layer-source">Configure a layer source</a></li>
+                         <li> <a href="{% url 'importlayer' %}">Import a layer</a></li>
+                </ul>
 </div>
 
 {%else%}
-<div id="main" role="main" ng-app="project" ng-controller="prjCtrl" class="top-padded">
 
+<div id="main" role="main" ng-app="project" ng-controller="prjCtrl" class="top-padded">
 
   <!-- project name -->
   <div class="page-header">
diff --git a/bitbake/lib/toaster/toastergui/templates/targets.html b/bitbake/lib/toaster/toastergui/templates/targets.html
index 27ff2be928..6f59a6cdab 100644
--- a/bitbake/lib/toaster/toastergui/templates/targets.html
+++ b/bitbake/lib/toaster/toastergui/templates/targets.html
@@ -36,14 +36,12 @@
       </div>
   </div>
   {% else %}
-    <div class="alert alert-info">
-      <p class="lead">
-       Toaster has no target information. To generate target information you can:<br/>
-       <ul class="lead">
-       <li style="margin-top: 10px"> <a href="https://wiki.yoctoproject.org/wiki/Setting_up_a_hosted_managed_mode_for_Toaster#LayerSources">Configure a layer source</a></li>
-       <li style="margin-top: 10px">  <a href="{% url 'importlayer' %}">Import a layer</a></li>
-       </ul>
-      </p>
+    <div class="alert alert-info lead">
+      <p>Toaster has no target information. To generate target information you can:</p>
+      <ul>
+       <li><a href="http://www.yoctoproject.org/docs/latest/toaster-manual/toaster-manual.html#layer-source">Configure a layer source</a></li>
+       <li><a href="{% url 'importlayer' %}">Import a layer</a>, then run a build</li>
+      </ul>
     </div>
   {% endif %}