Refactored: index page

10 files changed, 79 insertions, 21 deletions

diff --git a/htdocs/static/css/custom.css b/htdocs/static/css/custom.css
index 620c6db..1d990d7 100644
--- a/htdocs/static/css/custom.css
+++ b/htdocs/static/css/custom.css
@@ -13,15 +13,24 @@ h1 {
 }
 
 #hostlist .list li {
+    clear: both;
     list-style-type: none;
-    text-align: center;
-    margin-top: 20px;
-    display: table;
+    margin-bottom: 50px;
+}
+
+#hostlist .logo img {
+  padding-top: 15px;
+  width: 50px;
+}
+
+.thumbnail {
+  padding: 10px;
+}
+.thumbnail:hover {
+    border-color: #999;
 }
 
 #hostlist .list li a {
-    height: 100px;
-    display: table-cell;
     vertical-align: middle;
 }
 
@@ -31,12 +40,22 @@ h1 {
     text-decoration: none;
 }
 
+#hostlist .ips {
+  margin: 0px;
+}
+
+#hostlist .ips li {
+    display: inline;
+    color: #999;
+}
+
 td.centering, p.centering {
     text-align: center;
 }
 
 .searchbox {
     margin-top: 2em;
+    margin-bottom: 1em;
 }
 
 table.tablesorter .header:after {
diff --git a/htdocs/static/img/archlinux-logo-dark-1200dpi.b42bd35d5916.png b/htdocs/static/img/archlinux-logo-dark-1200dpi.b42bd35d5916.png
new file mode 100644
index 0000000..62eeba1
--- /dev/null
+++ b/htdocs/static/img/archlinux-logo-dark-1200dpi.b42bd35d5916.png
diff --git a/htdocs/static/img/archlinux.png b/htdocs/static/img/archlinux.png
new file mode 100644
index 0000000..279b656
--- /dev/null
+++ b/htdocs/static/img/archlinux.png
diff --git a/htdocs/static/img/debian.png b/htdocs/static/img/debian.png
new file mode 100644
index 0000000..ee04572
--- /dev/null
+++ b/htdocs/static/img/debian.png
diff --git a/htdocs/static/img/gentoo.png b/htdocs/static/img/gentoo.png
new file mode 100644
index 0000000..8938831
--- /dev/null
+++ b/htdocs/static/img/gentoo.png
diff --git a/htdocs/static/img/openbsd.png b/htdocs/static/img/openbsd.png
new file mode 100644
index 0000000..dbb6eb9
--- /dev/null
+++ b/htdocs/static/img/openbsd.png
diff --git a/htdocs/static/img/unknown.png b/htdocs/static/img/unknown.png
new file mode 100644
index 0000000..100e14a
--- /dev/null
+++ b/htdocs/static/img/unknown.png
diff --git a/render.py b/render.py
index 3e1d215..be2bfef 100644
--- a/render.py
+++ b/render.py
@@ -4,18 +4,16 @@ import yaml
 import os
 import jinja2
 import optparse
+from utils import filters
 
 class Renderer:
     def __init__(self, output_dir):
         self.env = jinja2.Environment(
             loader = jinja2.FileSystemLoader('./templates'))
-        self.env.filters['select_with_attribute'] = self.select_with_attribute
+        self.env.filters.update(filters)
         self.output_dir = output_dir
         self.templates = {}
 
-    def select_with_attribute(self, iterable, attribute, result=True):
-        return [value for value in iterable if (attribute in value) == result]
-
     def _render(self, template, filename, **kwargs):
         if template not in self.templates:
             self.templates[template] = self.env.get_template(template)
diff --git a/templates/index.html b/templates/index.html
index ebc2408..9681fad 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -3,19 +3,46 @@
 {% block content %}
 <h1>Hostinfo</h1>
 
-<div id="hostlist">
-  <div class="row searchbox">
-    <span class="span4 offset4">
-      <input type="search" class="search span4" placeholder="Search" />
-    </spam>
+<div id="hostlist" class="row">
+  <div class="span12 searchbox">
+      <input type="search" class="search span4 pull-right"
+        placeholder="Search for Hostname or IP" />
   </div>
 
-  <ul class="row list">
-    {% for host in hosts %}
-    <li class="span2">
-      <a href={{host['url']}} class="thumbnail hostname">
-        {{host['hostname'] | replace(".spline.inf.fu-berlin.de","")}}
-      </a>
+  <ul class="list span12">
+    {% for host in hosts|sort(attribute='hostname') %}
+    <li class="row thumbnail">
+
+      <div class="logo span1">
+        {% set os = host['os'] | get_os_name %}
+        {% if os is not none %}
+        <img src="static/img/{{host['os'] | get_os_name}}.png" alt="{{host['os']}}" />
+        {% else %}
+        <img src="static/img/unknown.png" alt="unknown os" />
+        {% endif %}
+      </div>
+
+      <div class="span10">
+        <h3 class="hostname">
+          <a href="{{host['url']}}">
+          {{host['hostname'] | replace(".spline.inf.fu-berlin.de","")}}
+          </a>
+        </h3>
+
+        <p>
+        {% if host['description'] is defined %}
+          {{host['description']}}
+        {% else %}
+          No description available.
+        {% endif %}
+        </p>
+
+        <ul class="ips">
+          {% for ip in host['addresses'] | sort(attribute='address') %}
+          <li>{{ip['address']}}</li>
+          {% endfor %}
+        </ul>
+      </div>
     </li>
     {% endfor %}
   </ul>
@@ -24,7 +51,7 @@
 <script type='text/javascript'>
 <!--
 var options = {
-    valueNames: [ 'hostname' ]
+    valueNames: [ 'hostname', 'ips' ]
 };
 
 var featureList = new List('hostlist', options);
diff --git a/utils.py b/utils.py
new file mode 100644
index 0000000..1ba7137
--- /dev/null
+++ b/utils.py
@@ -0,0 +1,14 @@
+#!/usr/bin/python2
+
+def get_os_name(name):
+  try: return name.split(' ')[0].lower()
+  except: pass
+
+def select_with_attribute(iterable, attribute, result=True):
+    return [value for value in iterable if (attribute in value) == result]
+
+
+filters = [
+    ('select_with_attribute', select_with_attribute),
+    ('get_os_name', get_os_name)
+]