Colours

hsman/TODO.md

@@ -1,5 +1,2 @@
-- improve APP_PREFIX
-- edit bootstrap CSS to fix fonts and colors
 - try to use a datatable for routes, with grouping
-- more tooltips, for hosts, showing IP addresses (?)
 - move to github and set up pipeline

hsman/app/filters.py

@@ -60,9 +60,9 @@ def fmt_datetime(datetime):
 
 def fancyBool(bool_):
     if bool_:
-        return '<span style="color: green">&#x2714;</span>'
+        return '<span class="fancyTrue">&#x2714;</span>'
     else:
-        return '<span style="color: red">&#x2718;</span>'
+        return '<span class="fancyFalse">&#x2718;</span>'
 
 
 def fancyOnline(online):

hsman/app/static/main.css

@@ -80,6 +80,14 @@ div.data:hover{
   background-color: #444;
 }
 
+.fancyTrue {
+  color: #10932f
+}
+
+.fancyFalse {
+  color: #9b0f0f
+}
+
 /* primary route */
 a.route.primary {
   font-weight: bold;

hsman/app/templates/nodes.html

@@ -11,6 +11,7 @@
             <th>user</th>
             <th>expire</th>
             <th>last event</th>
+            <th>addresses</th>
             <th>online</th>
             <th>&nbsp;</th>
         </tr>
@@ -20,7 +21,9 @@
         <tr>
             <td>
                 <a class="plain" href="{{ url_for('main.node', nodeId=node.id)}}">
+                <span data-toggle="tooltip" data-placement="right" title="{{ node.ipAddresses | join('\n') }}">
                     {{node.givenName}}
+                </span>
                 </a>
             </td>
             <td>
@@ -40,6 +43,9 @@
                     {{node.lastSeen | htime_dt }}
                 </span>
             </td>
+            <td>
+                {{ node.ipAddresses | join(', ') }}
+            </td>
             <td data-filter="{{ node.online | fancyOnline }}">
                 {{node.online | fancyBool | safe}}
             </td>
@@ -79,6 +85,13 @@
             aoColumnDefs: [
               { 'bSortable': false, 'aTargets': [ -1 ] }
            ],
+           columnDefs: [
+               {
+                   target: 4,
+                   visible: false,
+                   searchable: true
+               }
+            ]
         });
     })
 </script>