[bitbake-devel] [PATCH 69/94] bitbake: webhob: refactor CSS display in Simple

Alex DAMIAN alexandru.damian at intel.com
Tue Sep 24 16:52:38 UTC 2013


From: Alexandru DAMIAN <alexandru.damian at intel.com>

Refactoring CSS display in Simple to separate
the generic layout to the table display code.

With the new layout we can add the generic display
to more than just table pages.

Signed-off-by: Alexandru DAMIAN <alexandru.damian at intel.com>
---
 bitbake/lib/webhob/bldviewer/templates/base.html   | 51 ++++------------------
 .../lib/webhob/bldviewer/templates/basetable.html  | 46 +++++++++++++++++++
 bitbake/lib/webhob/bldviewer/templates/build.html  |  2 +-
 bitbake/lib/webhob/bldviewer/templates/layer.html  |  2 +-
 .../lib/webhob/bldviewer/templates/package.html    |  2 +-
 bitbake/lib/webhob/bldviewer/templates/recipe.html |  2 +-
 bitbake/lib/webhob/bldviewer/templates/task.html   |  2 +-
 7 files changed, 59 insertions(+), 48 deletions(-)
 create mode 100644 bitbake/lib/webhob/bldviewer/templates/basetable.html

diff --git a/bitbake/lib/webhob/bldviewer/templates/base.html b/bitbake/lib/webhob/bldviewer/templates/base.html
index e97c8f6..31abeb1 100644
--- a/bitbake/lib/webhob/bldviewer/templates/base.html
+++ b/bitbake/lib/webhob/bldviewer/templates/base.html
@@ -2,7 +2,7 @@
 
 <html>
 	<head>
-		<title>WebHob Simple Explorer</title>
+		<title>Toaster Simple Explorer</title>
 <script src="/static/js/jquery-2.0.3.js">
 </script>
 <script src="/static/js/bootstrap.js">
@@ -11,55 +11,20 @@
 	</head>
 
 <body style="height: 100%">
-<script>
-function showhideTableColumn(i, sh) {
-    if (sh)
-        $('td:nth-child('+i+'),th:nth-child('+i+')').show();
-    else
-        $('td:nth-child('+i+'),th:nth-child('+i+')').hide();
-}
-
-
-function filterTableRows(test) {
-    if (test.length > 0) {
-        var r = test.split(/[ ,]+/).map(function (e) { return new RegExp(e, 'i') });
-        $('tr.data').map( function (i, el) {
-            (! r.map(function (j) { return j.test($(el).html())}).reduce(function (c, p) { return c && p;} )) ? $(el).hide() : $(el).show();
-        });
-    } else
-    {
-        $('tr.data').show();
-    }
-}
-</script>
-<div style="position:fixed; top:0; z-index: 999; width: 100%; background:white"> 
+<div style="width:100%; height: 100%; position:absolute">
+<div style="width: 100%; height: 3em" class="nav">
     <ul class="nav nav-tabs">
         <li><a href="/simple/build/">All Builds</a></li>
         <li><a href="/simple/layer/">All Layers</a></li>
     </ul>
-    
-    {% block pagename %}
-    {% endblock %}
-    
-    <div style="padding-top:1em ;padding-bottom: 1em">
-    <div align="left" style="display:inline-block; width: 49%; margin-left: 2em"> Search: <input type="search" id="filterstring" style="width: 30em" onkeyup="filterTableRows($('#filterstring').val())" autocomplete="off">
-    </div>
-    {% if hideshowcols %}
-    <div align="right" style="display: inline-block; width: 49%">Show/Hide columns:
-    {% for i in hideshowcols %}
-        <span>{{i.name}} <input type="checkbox" id="ct{{i.name}}" onchange="showhideTableColumn({{i.order}}, $('#ct{{i.name}}').is(':checked'))" checked autocomplete="off"></span> |
-    {% endfor %}
-    </div>
-    {% endif %}
-    </div>
 </div>
-<div style="padding-top: 13em; width:98%; align:center; margin:auto;">
-    <table class="table table-striped table-condensed">
-{% block pagetable %}
+
+<div style="overflow-y:scroll; width: 100%; position: absolute; top: 3em; bottom:70px ">
+{% block pagecontent %}
 {% endblock %}
-    </table>
 </div>
-<div class="navbar"><br/>About Toaster | Yocto Project </div>
+<div class="navbar" style="position: absolute; bottom: 0; width:100%"><br/>About Toaster | Yocto Project </div>
+</div>
 </body>
 </html>
 
diff --git a/bitbake/lib/webhob/bldviewer/templates/basetable.html b/bitbake/lib/webhob/bldviewer/templates/basetable.html
new file mode 100644
index 0000000..083bcb8
--- /dev/null
+++ b/bitbake/lib/webhob/bldviewer/templates/basetable.html
@@ -0,0 +1,46 @@
+{% extends "base.html" %}
+
+{% block pagecontent %}
+<script>
+function showhideTableColumn(i, sh) {
+    if (sh)
+        $('td:nth-child('+i+'),th:nth-child('+i+')').show();
+    else
+        $('td:nth-child('+i+'),th:nth-child('+i+')').hide();
+}
+
+
+function filterTableRows(test) {
+    if (test.length > 0) {
+        var r = test.split(/[ ,]+/).map(function (e) { return new RegExp(e, 'i') });
+        $('tr.data').map( function (i, el) {
+            (! r.map(function (j) { return j.test($(el).html())}).reduce(function (c, p) { return c && p;} )) ? $(el).hide() : $(el).show();
+        });
+    } else
+    {
+        $('tr.data').show();
+    }
+}
+</script>
+<div style="margin-bottom: 0.5em">
+
+    {% block pagename %}
+    {% endblock %}
+    <div align="left" style="display:inline-block; width: 40%; margin-left: 2em"> Search: <input type="search" id="filterstring" style="width: 80%" onkeyup="filterTableRows($('#filterstring').val())" autocomplete="off">
+    </div>
+    {% if hideshowcols %}
+    <div align="right" style="display: inline-block; width: 40%">Show/Hide columns:
+    {% for i in hideshowcols %}
+        <span>{{i.name}} <input type="checkbox" id="ct{{i.name}}" onchange="showhideTableColumn({{i.order}}, $('#ct{{i.name}}').is(':checked'))" checked autocomplete="off"></span> |
+    {% endfor %}
+    </div>
+    {% endif %}
+</div>
+<div>
+    <table class="table table-striped table-condensed" style="width:95%">
+{% block pagetable %}
+{% endblock %}
+    </table>
+</div>
+
+{% endblock %}
diff --git a/bitbake/lib/webhob/bldviewer/templates/build.html b/bitbake/lib/webhob/bldviewer/templates/build.html
index 20c415b..53271a7 100644
--- a/bitbake/lib/webhob/bldviewer/templates/build.html
+++ b/bitbake/lib/webhob/bldviewer/templates/build.html
@@ -1,4 +1,4 @@
-{% extends "base.html" %}
+{% extends "basetable.html" %}
 
 {% block pagename %}
     <h1>Toaster - Builds</h1>
diff --git a/bitbake/lib/webhob/bldviewer/templates/layer.html b/bitbake/lib/webhob/bldviewer/templates/layer.html
index 5b317ba..508f254 100644
--- a/bitbake/lib/webhob/bldviewer/templates/layer.html
+++ b/bitbake/lib/webhob/bldviewer/templates/layer.html
@@ -1,4 +1,4 @@
-{% extends "base.html" %}
+{% extends "basetable.html" %}
 
 {% block pagename %}
     <h1>Toaster - Layers</h1>
diff --git a/bitbake/lib/webhob/bldviewer/templates/package.html b/bitbake/lib/webhob/bldviewer/templates/package.html
index f70b022..622c23d 100644
--- a/bitbake/lib/webhob/bldviewer/templates/package.html
+++ b/bitbake/lib/webhob/bldviewer/templates/package.html
@@ -1,4 +1,4 @@
-{% extends "base.html" %}
+{% extends "basetable.html" %}
 
 {% block pagename %}
     <h1>Toaster - Packages</h1>
diff --git a/bitbake/lib/webhob/bldviewer/templates/recipe.html b/bitbake/lib/webhob/bldviewer/templates/recipe.html
index 515053a..e855625 100644
--- a/bitbake/lib/webhob/bldviewer/templates/recipe.html
+++ b/bitbake/lib/webhob/bldviewer/templates/recipe.html
@@ -1,4 +1,4 @@
-{% extends "base.html" %}
+{% extends "basetable.html" %}
 
 {% block pagename %}
     <h1>Toaster - Recipes for a Layer</h1>
diff --git a/bitbake/lib/webhob/bldviewer/templates/task.html b/bitbake/lib/webhob/bldviewer/templates/task.html
index 6d06d0f..05d8e12 100644
--- a/bitbake/lib/webhob/bldviewer/templates/task.html
+++ b/bitbake/lib/webhob/bldviewer/templates/task.html
@@ -1,4 +1,4 @@
-{% extends "base.html" %}
+{% extends "basetable.html" %}
 
 {% block pagename %}
     <h1>Toaster - Tasks</h1>
-- 
1.8.1.2




More information about the bitbake-devel mailing list