bitbake: toaster: image information views

[YOCTO # 4346]

When a target image is selected, this commit adds to the toaster
project a two-tabbed page that shows
1) 'packages included' a table of packages included in the image
(see target.html), and
2) 'directory structure', the target image's file system directory
and detailed information showing the source of each file in the
directory table (see dirinfo.html).

The directory structure tab relies on the open source jQuery plugin
jtreetable which provides hierarchical table expansions and contractions
of the directory entry tables as the user drills down into directories.

A file of jtreetable styles that are compatible with other toaster styles
is provided included as css/jquery.treetable.theme.toaster.css. The
complete unaltered jtreetable plugin is added via a separate commit.

This work was developed base on the bugzilla specification number 4346
and the document "Design 1.1 Image information" attached to that report.

Whitespace and typo fixes from Alex Damian.

(Bitbake rev: 1ba9f310a8b4fd0952a95be86ab43ae27fe6d983)

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

1 files changed, 149 insertions, 4 deletions

diff --git a/bitbake/lib/toaster/toastergui/templates/target.html b/bitbake/lib/toaster/toastergui/templates/target.html
index f2d0ad461b..45128986e1 100644
--- a/bitbake/lib/toaster/toastergui/templates/target.html
+++ b/bitbake/lib/toaster/toastergui/templates/target.html
@@ -1,8 +1,153 @@
 {% extends "basebuildpage.html" %}
-
 {% block localbreadcrumb %}
-<li>Target</li>
-{% endblock %}
+<li>{{target.target}}</li>
+{% endblock localbreadcrumb%}
+
+{% load projecttags %}
 
 {% block buildinfomain %}
-{% endblock %}
+
+<div class="row-fluid span10">
+    <div class="page-header">
+        <h1>
+            {% if request.GET.search and objects.paginator.count > 0 %}
+                {{objects.paginator.count}} package{{objects.paginator.count|pluralize}} found
+            {% elif request.GET.search and objects.paginator.count == 0 %}
+                No packages found
+            {% else %}
+                {{target.target}}
+            {% endif %}
+        </h1>
+    </div>
+</div>
+
+<div class="row-fluid pull-right span10" id="navTab">
+    <ul class="nav nav-pills">
+        <li class="active">
+            <a href="#target">
+            <i class="icon-question-sign get-help" data-toggle="tooltip" title="Of all the packages built, the subset installed in the root file system of this image"></i>
+                Packages included ({{target.package_count}} - {{packages_sum|filtered_filesizeformat}})
+            </a>
+        </li>
+        <li>
+            <a href="{% url 'dirinfo' build.id target.id %}">
+                <i class="icon-question-sign get-help" data-toggle="tooltip" title="The directories and files in the root file system of this image"></i>
+                Directory structure
+            </a>
+        </li>
+    </ul>
+
+    <div id="image-packages" class="tab-pane">
+
+    {% if objects.paginator.count == 0 %}
+    <div class="row-fluid">
+        <div class="alert">
+            <form class="no-results input-append" id="searchform">
+                <input id="search" name="search" class="input-xxlarge" type="text" value="{{request.GET.search}}"/>{% if request.GET.search %}<a href="javascript:$('#search').val('');searchform.submit()" class="add-on btn" tabindex="-1"><i class="icon-remove"></i></a>{% endif %}
+                <button class="btn" type="submit" value="Search">Search</button>
+                <button class="btn btn-link" onclick="javascript:$('#search').val('');searchform.submit()">Show all packages</button>
+            </form>
+        </div>
+    </div>
+
+
+    {% else %}
+    {% include "basetable_top.html" %}
+    {% for package in objects %}
+    <tr>
+        <td class="package_name">
+            <a href="{% url 'package_included_detail' build.id target.id package.id %}">
+            {{package.name}}
+            </a>
+            {% if package.installed_name and package.name != package.installed_name %}
+            <span class="muted"> as {{package.installed_name}}</span>
+            <i class="icon-question-sign get-help hover-help" title='{{package.name|add:" was renamed at packaging time and was installed in your image as "|add:package.installed_name}}'></i>
+            {% endif %}
+        </td>
+        <td class="package_version">
+            <a href="{% url 'package_included_detail' build.id target.id package.id %}">
+            {{package.version|filtered_packageversion:package.revision}}
+            </a>
+        </td>
+        <td class="package_size">
+            {{package.size|filtered_installedsize:package.installed_size|filtered_filesizeformat}}
+        </td>
+        <td class="size_over_total">
+            {{package|filter_sizeovertotal:packages_sum}}
+        </td>
+        <td class="license">
+            {{package.license}}
+        </td>
+        <td class="depends">
+            {% with deps=package|runtime_dependencies:target.id %}
+            {% with deps_count=deps|length %}
+            {% if deps_count > 0 %}
+            <a class="btn"
+                title="<a href='{% url "package_included_dependencies" build.id target.id package.id %}'>{{package.name}}</a> depends on"
+                data-content="<ul class='unstyled'>
+                  {% for i in deps|dictsort:'depends_on.name' %}
+                    <li><a href='{% url "package_included_dependencies" build.pk target.id i.depends_on.pk %}'>{{i.depends_on.name}}</a></li>
+                  {% endfor %}
+                </ul>">
+                {{deps_count}}
+            </a>
+            {% endif %}
+            {% endwith %}
+            {% endwith %}
+        </td>
+        <td class="brought_in_by">
+            {% with rdeps=package|reverse_runtime_dependencies:target.id %}
+            {% with rdeps_count=rdeps|length %}
+            {% if rdeps_count > 0 %}
+            <a class="btn"
+                title="<a href='{% url "package_included_reverse_dependencies" build.id target.id package.id %}'>{{package.name}}</a> is brought in by"
+                data-content="<ul class='unstyled'>
+                  {% for i in rdeps|dictsort:'package.name' %}
+                    <li><a href='{% url "package_included_dependencies" build.id target.id i.package.id %}'>{{i.package.name}}</a></li>
+                  {% endfor %}
+                </ul>">
+                {{rdeps_count}}
+            </a>
+            {% endif %}
+            {% endwith %}
+            {% endwith %}
+        </td>
+        <td class="recipe_name">
+            {% if package.recipe.version %}
+            <a href="{% url 'recipe' build.id package.recipe_id %}">
+            {{ package.recipe.name }}
+            </a>
+            {% endif %}
+        </td>
+        <td class="recipe_version">
+            {% if package.recipe.version %}
+            <a href="{% url 'recipe' build.id package.recipe_id %}">
+            {{ package.recipe.version }}
+            </a>
+            {% endif %}
+        </td>
+        <td class="layer_name">
+            {{ package.recipe.layer_version.layer.name }}
+        </td>
+        <td class="layer_branch">
+            {{ package.recipe.layer_version.branch}}
+        </td>
+        <td class="layer_commit">
+            <a class="btn"
+                data-content="<ul class='unstyled'>
+                  <li>{{package.recipe.layer_version.commit}}</li>
+                </ul>">
+                {{package.recipe.layer_version.commit|truncatechars:13}}
+            </a>
+        </td>
+        <td class="layer_directory">
+            {{ package.recipe.layer_version.layer.local_path }}
+        </td>
+    </tr>
+    {% endfor %}
+
+    {% include "basetable_bottom.html" %}
+    {% endif %}
+    </div> <!-- tabpane -->
+</div> <!--span 10-->
+{% endblock buildinfomain %}