summaryrefslogtreecommitdiffstats
path: root/bitbake/lib/toaster/toastergui/templates
diff options
context:
space:
mode:
authorDave Lerner <dave.lerner@windriver.com>2014-03-12 16:54:09 -0500
committerRichard Purdie <richard.purdie@linuxfoundation.org>2014-03-21 14:47:53 +0000
commit4cdd56fff3471669ff2372f0d8bf15f9a287374a (patch)
tree76b81b2cb87e3b3df9751d8487351b5dfb2c59a3 /bitbake/lib/toaster/toastergui/templates
parente94f0b4e8c2cbea92688975b1a45a061af48911e (diff)
downloadpoky-4cdd56fff3471669ff2372f0d8bf15f9a287374a.tar.gz
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>
Diffstat (limited to 'bitbake/lib/toaster/toastergui/templates')
-rw-r--r--bitbake/lib/toaster/toastergui/templates/base.html2
-rw-r--r--bitbake/lib/toaster/toastergui/templates/basebuildpage.html2
-rw-r--r--bitbake/lib/toaster/toastergui/templates/dirinfo.html237
-rw-r--r--bitbake/lib/toaster/toastergui/templates/package_included_detail.html2
-rw-r--r--bitbake/lib/toaster/toastergui/templates/target.html153
5 files changed, 390 insertions, 6 deletions
diff --git a/bitbake/lib/toaster/toastergui/templates/base.html b/bitbake/lib/toaster/toastergui/templates/base.html
index 5493e230b1..9ca9c9ac3b 100644
--- a/bitbake/lib/toaster/toastergui/templates/base.html
+++ b/bitbake/lib/toaster/toastergui/templates/base.html
@@ -49,6 +49,8 @@ function reload_params(params) {
49} 49}
50</script> 50</script>
51 51
52{% block extraheadcontent %}
53{% endblock %}
52 </head> 54 </head>
53 55
54<body style="height: 100%"> 56<body style="height: 100%">
diff --git a/bitbake/lib/toaster/toastergui/templates/basebuildpage.html b/bitbake/lib/toaster/toastergui/templates/basebuildpage.html
index 054a37cc8c..636fca28dd 100644
--- a/bitbake/lib/toaster/toastergui/templates/basebuildpage.html
+++ b/bitbake/lib/toaster/toastergui/templates/basebuildpage.html
@@ -26,7 +26,7 @@
26 <div id="nav" class="span2"> 26 <div id="nav" class="span2">
27 <ul class="nav nav-list well"> 27 <ul class="nav nav-list well">
28 <li class="nav-header">Images</li> 28 <li class="nav-header">Images</li>
29 {% for t in build.target_set.all %} 29 {% for t in build.target_set.all|dictsort:"target" %}
30 <li><a href="{% url 'target' build.pk t.pk %}">{{t.target}}</a><li> 30 <li><a href="{% url 'target' build.pk t.pk %}">{{t.target}}</a><li>
31 {% endfor %} 31 {% endfor %}
32 <li class="nav-header">Build</li> 32 <li class="nav-header">Build</li>
diff --git a/bitbake/lib/toaster/toastergui/templates/dirinfo.html b/bitbake/lib/toaster/toastergui/templates/dirinfo.html
new file mode 100644
index 0000000000..9b76a1cb8c
--- /dev/null
+++ b/bitbake/lib/toaster/toastergui/templates/dirinfo.html
@@ -0,0 +1,237 @@
1{% extends "basebuildpage.html" %}
2{% block extraheadcontent %}
3{% load static %}
4<link rel="stylesheet" href="{% static 'css/jquery.treetable.css' %}" type="text/css">
5<link rel="stylesheet" href="{% static 'css/jquery.treetable.theme.toaster.css' %}" type="text/css">
6{% endblock extraheadcontent %}
7
8{% block localbreadcrumb %}
9<li>{{target.target}}</li>
10{% endblock localbreadcrumb%}
11
12{% block buildinfomain %}
13
14{% load static %}
15<script src="{% static 'js/jquery.treetable.js' %}">
16</script>
17{% load projecttags %}
18
19<script type='text/javascript'>
20 function setupTreetable() {
21 $("#dirtable").treetable({
22 expandable: true,
23 branchAttr: "ttBranch",
24 clickableNodeNames: true,
25 onNodeCollapse: function() {
26 /* Do nothing, keep cached */
27 },
28 onNodeExpand: function() {
29 var start = this.id;
30 var n = $("#dirtable").treetable("node", start);
31 if (this.children.length > 0) {
32 /* already was expanded once */
33 $("#dirtable").treetable("reveal", start);
34 }
35 else {
36 var url = "{% url "dirinfo_ajax" build.id target.id %}";
37 $.ajax({
38 async: false,
39 type : "GET",
40 url : url,
41 data : "start=" + start,
42 success : function(response) {
43 var objects = $.parseJSON(response);
44 addRows(n, objects)
45 },
46 error : function(jqXHR, textStatus, errorThrown ) {alert(textStatus + ":" + errorThrown)},
47 });
48 }
49 },
50 });
51 }
52 function td(data) {
53 if (data == null) {
54 data = '';
55 }
56 return '<td>' + data + '</td>'
57 }
58
59 function formatRow(o) {
60 /* setup tr-wide formatting */
61 var tr = '<tr class="';
62 if (o.link_to != null) {
63 tr += 'muted ';
64 }
65 if (o.isdir && o.childcount) {
66 tr += 'branch" data-tt-branch="true" ';
67 }
68 else {
69 tr += 'leaf" data-tt-branch="false" ';
70 }
71 tr += ' data-tt-id="' + o.fullpath +'" ';
72 if (o.parent != "/") {
73 tr += ' data-tt-parent-id="' + o.parent +'" ';
74 }
75 tr += '>';
76
77 /* setup td specific formatting */
78 var link_to = td(o.link_to);
79 var size = td(o.size);
80 var permission = td(o.permission);
81 var owner = td(o.owner);
82 var group = td(o.group);
83
84 /* handle the name column */
85 var name = null;;
86 var namespan=1;
87 if (o.isdir) {
88 if (o.link_to == null) {
89 namespan = 2;
90 if (o.package == null) {
91 namespan = 3;
92 }
93 }
94 var colspan = 'colspan="' + namespan + '"';
95 name = '<td class="content-directory"' + colspan + '>';
96 if (o.childcount) {
97 name += '<a href="">';
98 }
99 name += '<i class="icon-folder-close"></i>';
100 name += '&nbsp;' + o.name;
101 if (o.childcount) {
102 name += '</a>';
103 }
104 name += '</td>';
105 }
106 else {
107 name = '<td>';
108 if (o.link_to == null) {
109 name += '<i class="icon-file"></i>';
110 }
111 else {
112 name += '<i class="icon-hand-right"></i>';
113 }
114 name += '&nbsp;' + o.name;
115 name += '</td>';
116 }
117
118 /* handle the package column */
119 var package = null;
120 if (o.package != null) {
121 /* add link to included package page */
122 build_id = {{ build.id }};
123 target_id = {{ target.id }};
124 /* Create a url for a dummy package id of 0 */
125 dummy = "{% url 'package_included_detail' build.id target.id 0 %}"
126 /* fill in the package id */
127 url = dummy.substr(0, dummy.length-1) + o.package_id;
128 package = '<a href=' + url + '>' ;
129 package += o.package;
130 package += '</a>';
131 if (o.installed_package != o.package) {
132 /* make class muted and add hover help */
133 package += '<span class="muted"> as ' + o.installed_package + ' </span>';
134 package += '<i class="icon-question-sign get-help hover-help" ';
135 package += 'title="' + o.package + ' was renamed at packaging time and was installed in your image as ' + o.installed_package + '">';
136 package += '</i>';
137 }
138 }
139 package = td(package);
140
141 var cols1to3;
142 switch (namespan) {
143 case 3:
144 cols1to3 = name;
145 break;
146 case 2:
147 cols1to3 = name + package;
148 break;
149 default:
150 cols1to3 = name + link_to + package;
151 }
152 r = tr + cols1to3 + size + permission + owner + group + "</tr>"
153 return r;
154 }
155
156 function addRows(n, objs) {
157 rows = "";
158 for (i=0; i<objs.length; i++) {
159 rows += formatRow(objs[i]);
160 }
161 $("#dirtable").treetable("loadBranch", n, rows);
162 }
163
164 $.fn.isOffScreen = function(){
165 var win = $(window);
166 viewportBottom = win.scrollTop() + win.height();
167
168 var bounds = this.offset();
169 bounds.bottom = bounds.top + this.outerHeight();
170
171 return (bounds.bottom > viewportBottom);
172 };
173
174 function selectRow(path) {
175 var row = $('tr[data-tt-id="' + path + '"]');
176 row.addClass(" highlight");
177 if (row.isOffScreen()) {
178 $('html, body').animate({ scrollTop: row.offset().top - 150}, 2000);
179 }
180 }
181</script>
182
183<div class="span10">
184
185 <div class="page-header">
186 <h1> {{target.target}} </h1>
187 </div>
188
189 <ul class="nav nav-pills">
190 <li class="">
191 <a href="{% url 'target' build.id target.id %}">
192 <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>
193 Packages included ({{target.package_count}} - {{packages_sum|filtered_filesizeformat}})
194 </a>
195 </li>
196 <li class="active">
197 <a href="{% url 'dirinfo' build.id target.id %}">
198 <i class="icon-question-sign get-help" data-toggle="tooltip" title="The directories and files in the root file system of this image"></i>
199 Directory structure
200 </a>
201 </li>
202 </ul>
203
204 <div id="directory-structure" class="tab-pane active">
205 <table id="dirtable" class="table table-bordered table-hover treetable">
206 <thead>
207 <tr>
208 <th>Directory / File</th>
209 <th>Symbolic link to</th>
210 <th>Source package</th>
211 <th>Size</th>
212 <th>Permissions</th>
213 <th>Owner</th>
214 <th>Group</th>
215 </tr>
216 </thead>
217 <tbody>
218 <script type='text/javascript'>
219 setupTreetable();
220 addRows(null, {{ objects|safe }} );
221 {% if file_path %}
222 {% comment %}
223 link from package_included_detail specifies file path
224 {% endcomment %}
225 {% for dir_elem in dir_list %}
226 $("#dirtable").treetable("expandNode", "{{dir_elem}}");
227 {% endfor %}
228 selectRow("{{file_path}}");
229 {% endif %}
230 </script>
231 </tbody>
232 </table>
233 </div> <!-- directory-structure -->
234</div> <!-- span10 -->
235
236{% endblock buildinfomain %}
237
diff --git a/bitbake/lib/toaster/toastergui/templates/package_included_detail.html b/bitbake/lib/toaster/toastergui/templates/package_included_detail.html
index df2588548c..ce4f1cb33c 100644
--- a/bitbake/lib/toaster/toastergui/templates/package_included_detail.html
+++ b/bitbake/lib/toaster/toastergui/templates/package_included_detail.html
@@ -24,7 +24,7 @@
24 {% for file in package.buildfilelist_package.all|dictsort:"path" %} 24 {% for file in package.buildfilelist_package.all|dictsort:"path" %}
25 <tr> 25 <tr>
26 <td> 26 <td>
27 <a href="{% url 'image_information_dir' build.id target.id file.id %}"> 27 <a href="{% url 'dirinfo_filepath' build.id target.id file.path %}">
28 {{file.path}} 28 {{file.path}}
29 </a> 29 </a>
30 </td> 30 </td>
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 @@
1{% extends "basebuildpage.html" %} 1{% extends "basebuildpage.html" %}
2
3{% block localbreadcrumb %} 2{% block localbreadcrumb %}
4<li>Target</li> 3<li>{{target.target}}</li>
5{% endblock %} 4{% endblock localbreadcrumb%}
5
6{% load projecttags %}
6 7
7{% block buildinfomain %} 8{% block buildinfomain %}
8{% endblock %} 9
10<div class="row-fluid span10">
11 <div class="page-header">
12 <h1>
13 {% if request.GET.search and objects.paginator.count > 0 %}
14 {{objects.paginator.count}} package{{objects.paginator.count|pluralize}} found
15 {% elif request.GET.search and objects.paginator.count == 0 %}
16 No packages found
17 {% else %}
18 {{target.target}}
19 {% endif %}
20 </h1>
21 </div>
22</div>
23
24<div class="row-fluid pull-right span10" id="navTab">
25 <ul class="nav nav-pills">
26 <li class="active">
27 <a href="#target">
28 <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>
29 Packages included ({{target.package_count}} - {{packages_sum|filtered_filesizeformat}})
30 </a>
31 </li>
32 <li>
33 <a href="{% url 'dirinfo' build.id target.id %}">
34 <i class="icon-question-sign get-help" data-toggle="tooltip" title="The directories and files in the root file system of this image"></i>
35 Directory structure
36 </a>
37 </li>
38 </ul>
39
40 <div id="image-packages" class="tab-pane">
41
42 {% if objects.paginator.count == 0 %}
43 <div class="row-fluid">
44 <div class="alert">
45 <form class="no-results input-append" id="searchform">
46 <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 %}
47 <button class="btn" type="submit" value="Search">Search</button>
48 <button class="btn btn-link" onclick="javascript:$('#search').val('');searchform.submit()">Show all packages</button>
49 </form>
50 </div>
51 </div>
52
53
54 {% else %}
55 {% include "basetable_top.html" %}
56 {% for package in objects %}
57 <tr>
58 <td class="package_name">
59 <a href="{% url 'package_included_detail' build.id target.id package.id %}">
60 {{package.name}}
61 </a>
62 {% if package.installed_name and package.name != package.installed_name %}
63 <span class="muted"> as {{package.installed_name}}</span>
64 <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>
65 {% endif %}
66 </td>
67 <td class="package_version">
68 <a href="{% url 'package_included_detail' build.id target.id package.id %}">
69 {{package.version|filtered_packageversion:package.revision}}
70 </a>
71 </td>
72 <td class="package_size">
73 {{package.size|filtered_installedsize:package.installed_size|filtered_filesizeformat}}
74 </td>
75 <td class="size_over_total">
76 {{package|filter_sizeovertotal:packages_sum}}
77 </td>
78 <td class="license">
79 {{package.license}}
80 </td>
81 <td class="depends">
82 {% with deps=package|runtime_dependencies:target.id %}
83 {% with deps_count=deps|length %}
84 {% if deps_count > 0 %}
85 <a class="btn"
86 title="<a href='{% url "package_included_dependencies" build.id target.id package.id %}'>{{package.name}}</a> depends on"
87 data-content="<ul class='unstyled'>
88 {% for i in deps|dictsort:'depends_on.name' %}
89 <li><a href='{% url "package_included_dependencies" build.pk target.id i.depends_on.pk %}'>{{i.depends_on.name}}</a></li>
90 {% endfor %}
91 </ul>">
92 {{deps_count}}
93 </a>
94 {% endif %}
95 {% endwith %}
96 {% endwith %}
97 </td>
98 <td class="brought_in_by">
99 {% with rdeps=package|reverse_runtime_dependencies:target.id %}
100 {% with rdeps_count=rdeps|length %}
101 {% if rdeps_count > 0 %}
102 <a class="btn"
103 title="<a href='{% url "package_included_reverse_dependencies" build.id target.id package.id %}'>{{package.name}}</a> is brought in by"
104 data-content="<ul class='unstyled'>
105 {% for i in rdeps|dictsort:'package.name' %}
106 <li><a href='{% url "package_included_dependencies" build.id target.id i.package.id %}'>{{i.package.name}}</a></li>
107 {% endfor %}
108 </ul>">
109 {{rdeps_count}}
110 </a>
111 {% endif %}
112 {% endwith %}
113 {% endwith %}
114 </td>
115 <td class="recipe_name">
116 {% if package.recipe.version %}
117 <a href="{% url 'recipe' build.id package.recipe_id %}">
118 {{ package.recipe.name }}
119 </a>
120 {% endif %}
121 </td>
122 <td class="recipe_version">
123 {% if package.recipe.version %}
124 <a href="{% url 'recipe' build.id package.recipe_id %}">
125 {{ package.recipe.version }}
126 </a>
127 {% endif %}
128 </td>
129 <td class="layer_name">
130 {{ package.recipe.layer_version.layer.name }}
131 </td>
132 <td class="layer_branch">
133 {{ package.recipe.layer_version.branch}}
134 </td>
135 <td class="layer_commit">
136 <a class="btn"
137 data-content="<ul class='unstyled'>
138 <li>{{package.recipe.layer_version.commit}}</li>
139 </ul>">
140 {{package.recipe.layer_version.commit|truncatechars:13}}
141 </a>
142 </td>
143 <td class="layer_directory">
144 {{ package.recipe.layer_version.layer.local_path }}
145 </td>
146 </tr>
147 {% endfor %}
148
149 {% include "basetable_bottom.html" %}
150 {% endif %}
151 </div> <!-- tabpane -->
152</div> <!--span 10-->
153{% endblock buildinfomain %}
generated by cgit v1.2.3-54-g00ecf (git 2.39.0) at 2024-05-24 17:37:26 +0000