web reports: new skin

6 files changed, 211 insertions, 204 deletions

diff --git a/src/lib/Server/Reports/reports/templates/clients/client-nodebox.html b/src/lib/Server/Reports/reports/templates/clients/client-nodebox.html
deleted file mode 100644
index 8dbd01d9a..000000000
--- a/src/lib/Server/Reports/reports/templates/clients/client-nodebox.html
+++ /dev/null
@@ -1,63 +0,0 @@
-{% load django_templating_sigh %}
-{% if client %}
-        <a name="{{client.name}}"></a>
-        <div class="nodebox">
-            <span class="notebox">Time Ran: {{interaction.timestamp}}</span>
-              <!--<span class="configbox">(-Insert Profile Name Here-)</span>-->
-            
-            <table class="invisitable">
-            <tr><td width="43%"><h2>Node: <span class="nodename">
-	    <a href="{% url Bcfg2.Server.Reports.reports.views.client_detail hostname=client.name, pk=client.current_interaction.id %}">{{client.name}}</a></span></h2></td>
-            <td width="23%">
-	    {% if interaction.repo_rev_code %}Revision: {{interaction.repo_rev_code}}{% endif %}
-	    </td>
-            <td width="33%"><div class="statusborder">
-	        <div class="greenbar" style="width: {{interaction.percentgood}}%;">&nbsp;</div>
-		<div class="redbar" style="width: {{interaction.percentbad}}%;">&nbsp;</div>
-            </div>
-            </td></tr>
-            </table>
-	    {% if interaction.isclean %}
-            <div class="clean">
-	        <span class="nodelisttitle">Node is clean; Everything has been satisfactorily configured.</span>
-	    </div>
-	    {% endif %}
-	    {% if interaction.isstale %}
-	    <div class="warning">
-	        <span class="nodelisttitle">This node did not run within the last 24 hours-- it may be out of date.</span>
-	    </div>
-	{% endif %}
-	{% if interaction.bad %}
-	    <div class="bad">
-		<span class="nodelisttitle"><a href="javascript:toggleLayer('{{client.name}}-bad');" title="Click to expand" class="commentLink">{{interaction.bad.count}}</a> items did not verify and are considered Dirty.<br /></span>
-		<div class="items" id="{{client.name}}-bad"><ul class="plain">
-		{% for bad in interaction.bad|sortwell %}
-		    <li><strong>{{bad.entry.kind}}: </strong><tt><a href="{% url Bcfg2.Server.Reports.reports.views.config_item_bad bad.id%}">{{bad.entry.name}}</a></tt></li>
-		{% endfor %}
-		</ul></div>
-	    </div>
-	{% endif %}
-	{% if interaction.modified %}
-	    <div class="modified">
-		<span class="nodelisttitle"><a href="javascript:toggleLayer('{{client.name}}-modified');" title="Click to expand" class="commentLink">{{interaction.modified.count}}</a> items were modified in the last run.<br /></span>
-		<div class="items" id="{{client.name}}-modified"><ul class="plain">
-		{% for modified in interaction.modified|sortwell %}
-		    <li><strong>{{modified.entry.kind}}: </strong><tt><a href="{% url Bcfg2.Server.Reports.reports.views.config_item_modified modified.id %}">{{modified.entry.name}}</a></tt></li>
-		{% endfor %}
-		</ul></div>
-	    </div>
-	{% endif %}
-	{% if interaction.extra %}
-	    <div class="extra">
-		<span class="nodelisttitle"><a href="javascript:toggleLayer('{{client.name}}-extra');" title="Click to expand" class="commentLink">{{interaction.extra.count}}</a> extra configuration elements on the node.<br /></span>
-		<div class="items" id="{{client.name}}-extra"><ul class="plain">
-		{% for extra in interaction.extra|sortwell %}
-		    <li><strong>{{extra.entry.kind}}: </strong><tt>{{extra.entry.name}}</tt></li>
-		{% endfor %}
-		</ul></div>
-	    </div>
-	{% endif %}
-        </div>
-{% else %}
-    <p>No record could be found for this client.</p>
-{% endif %}
diff --git a/src/lib/Server/Reports/reports/templates/clients/detail.html b/src/lib/Server/Reports/reports/templates/clients/detail.html
index 77f505804..efd5f9e00 100644
--- a/src/lib/Server/Reports/reports/templates/clients/detail.html
+++ b/src/lib/Server/Reports/reports/templates/clients/detail.html
@@ -1,17 +1,127 @@
 {% extends "base.html" %}
+{% load bcfg2_tags %}
 
-{% block title %}Info for: {{client.name}}{% endblock %}
+{% block title %}Bcfg2 - Client {{client.name}}{% endblock %}
+
+{% block extra_header_info %}
+<style type="text/css">
+.node_data {
+	border: 1px solid #98DBCC;
+	margin: 10px;
+	padding-left: 18px;
+}
+.node_data td {
+	padding: 1px 20px 1px 2px;
+}
+span.history_links {
+	font-size: 90%;
+	margin-left: 50px;
+}
+span.history_links a {
+	font-size: 90%;
+}
+</style>
+{% endblock %}
+
+{% block body_onload %}javascript:clientdetailload(){% endblock %}
+
+{% block pagebanner %}Client Details{% endblock %}
 
 {% block content %}
-<h2>Client Status Detail page for {{client.name}}</h2><br/>
-<b>Select time: </b>
-<select name=quick onChange="MM_jumpMenu('parent',this,0)">
-    {% for i in client.interactions.all %}
-        <option {% ifequal i.id interaction.id %}selected {% endifequal %} value="{% url Bcfg2.Server.Reports.reports.views.client_detail hostname=client.name, pk=i.id %}"> {{i.timestamp}}
+  <div class='detail_header'>
+    <h2>{{client.name}}</h2>
+    <a href='{% url reports_client_manage %}#{{ client.name }}'>[manage]</a>
+  <span class='history_links'><a href="{% url reports_client_history client.name %}">View History</a> | Jump to&nbsp;
+    <select id="quick" name="quick" onchange="javascript:pageJump('quick');">
+    <option value="" selected="selected">--- Time ---</option>
+    {% for i in client.interactions.all|slice:":25" %}
+        <option value="{% url reports_client_detail_pk hostname=client.name, pk=i.id %}">{{i.timestamp}}</option>
+    {% endfor %}
+  </select></span>
+  </div>
+
+  {% if interaction.isstale %}
+  <div class="warningbox">
+    This node did not run within the last 24 hours &#8212; it may be out of date.
+  </div>
+  {% endif %}
+  <table class='node_data'>
+    <tr><td>Timestamp</td><td>{{interaction.timestamp}}</td></tr>
+    {% if interaction.server %}
+    <tr><td>Served by</td><td>{{interaction.server}}</td></tr>
+    {% endif %}
+    {% if interaction.repo_rev_code %}
+    <tr><td>Revision</td><td>{{interaction.repo_rev_code}}</td></tr>
+    {% endif %}
+    <tr><td>State</td><td class='{{interaction.state}}-lineitem'>{{interaction.state|capfirst}}</td></tr>
+    <tr><td>Managed entries</td><td>{{interaction.totalcount}}</td></tr>
+    {% if not interaction.isclean %}
+    <tr><td>Deviation</td><td>{{interaction.percentbad|floatformat:"3"}}%</td></tr>
+    {% endif %}
+  </table>
+
+  {% if interaction.bad_entry_count %}
+  <div class='entry_list'>
+    <div class='entry_list_head dirty-lineitem'>
+      <div class='entry_expand_tab' onclick='javascript:toggleMe("bad_table");'>[+]</div>
+      <h3>Bad Entries &#8212; {{ interaction.bad_entry_count }}</h3>
+    </div>
+    <table id='bad_table' class='entry_list'>
+      {% for e in interaction.bad|sortwell %}
+        <tr class='{% cycle listview,listview_alt %}'>
+          <td class='entry_list_type'>{{e.entry.kind}}:</td>
+          <td><a href="{% url reports_item "bad",e.id %}">
+              {{e.entry.name}}</a></td>
+        </tr>
+      {% endfor %}
+    </table>
+  </div>
+  {% endif %}
+
+  {% if interaction.modified_entry_count %}
+  <div class='entry_list'>
+    <div class='entry_list_head modified-lineitem'>
+      <div class='entry_expand_tab' onclick='javascript:toggleMe("modified_table");'>[+]</div>
+      <h3>Modified Entries &#8212; {{ interaction.modified_entry_count }}</h3>
+    </div>
+    <table id='modified_table' class='entry_list'>
+      {% for e in interaction.modified|sortwell %}
+        <tr class='{% cycle listview,listview_alt %}'>
+          <td class='entry_list_type'>{{e.entry.kind}}:</td>
+          <td><a href="{% url reports_item "modified",e.id %}">
+              {{e.entry.name}}</a></td>
+        </tr>
+      {% endfor %}
+    </table>
+  </div>
+  {% endif %}
+
+  {% if interaction.extra_entry_count %}
+  <div class='entry_list'>
+    <div class='entry_list_head extra-lineitem'>
+      <div class='entry_expand_tab' onclick='javascript:toggleMe("extra_table");'>[+]</div>
+      <h3>Extra Entries &#8212; {{ interaction.extra_entry_count }}</h3>
+    </div>
+    <table id='extra_table' class='entry_list'>
+      {% for e in interaction.extra|sortwell %}
+        <tr class='{% cycle listview,listview_alt %}'>
+          <td class='entry_list_type'>{{e.entry.kind}}:</td>
+          <td><a href="{% url reports_item "extra",e.id %}">{{e.entry.name}}</a></td>
+        </tr>
     {% endfor %}
-</select>
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
-<a href="{% url Bcfg2.Server.Reports.reports.views.client_manage hostname=client.name %}">Manage</a> {{client.name}} options.<br/>
+    </table>
+  </div>
+  {% endif %}
 
-{% include "clients/client-nodebox.html" %}
+  {% if entry_list %}
+  <div class="entry_list recent_history_wrapper">
+    <div class="entry_list_head" style="border-bottom: 2px solid #98DBCC;">
+      <h4 style="display: inline"><a href="{% url reports_client_history client.name %}">Recent Interactions</a></h4>
+    </div>
+    <div class='recent_history_box'>
+      {% include "widgets/interaction_list.inc" %}
+      <div style='padding-left: 5px'><a href="{% url reports_client_history client.name %}">more...</a></div>
+    </div>
+  </div>
+  {% endif %}
 {% endblock %}
diff --git a/src/lib/Server/Reports/reports/templates/clients/detailed-list.html b/src/lib/Server/Reports/reports/templates/clients/detailed-list.html
index 5a1352cff..0c1fae8d5 100644
--- a/src/lib/Server/Reports/reports/templates/clients/detailed-list.html
+++ b/src/lib/Server/Reports/reports/templates/clients/detailed-list.html
@@ -1,57 +1,15 @@
-{% extends "base.html" %}
+{% extends "base-timeview.html" %}
+{% load bcfg2_tags %}
 
-{% block title %}Detailed Client Listing{% endblock %}
-
-{% block extra_header_info %}
-<script type="text/javascript" src="{% url Bcfg2.Server.Reports.reports.views.client_index %}../site_media/CalendarPopup.js"></script>
-<script type="text/javascript">var cal = new CalendarPopup();</script>
-<style type="text/css">
-#client_list_header {
-  font-weight: bold;
-  border-bottom:1px solid;
-  /*color: #333366;*/
-}
-/*#client_list_box {
-  min-width:875px;
-}*/
-.listview {
-  padding-top:3px;
-  padding-bottom:3px;
-}
-.listview_alt {
-  background:#f1ffc9;
-  padding-top:3px;
-  padding-bottom:3px;
-}
-</style>
-{% endblock%}
-
-{% block pagebanner %}
-  <div class="header">
-      <h1>Detailed Client List</h1>
-  </div>
-  <br/>
-{% endblock %}
+{% block title %}Bcfg2 - Detailed Client Listing{% endblock %}
+{% block pagebanner %}Clients - Detailed View{% endblock %}
 
 {% block content %}
-<div>
-<form name="timestamp-select" action='{{ path }}' method='get'>
-<span class="mini-date">
-<b>Enter date or use calendar popup: </b>
-<input type="text" name="date1" value="{{timestamp_date}}" size="10" />@
-<input type="text" name="time" value="{{timestamp_time}}" size="8" />
-<a href="#" onclick="cal.select(document.forms['timestamp-select'].date1,'anchor1','yyyy-MM-dd'); return false;"
-   name="anchor1" id="anchor1">Calendar</a>
-<input type="button" value="Go" onclick="document.forms['timestamp-select'].submit();"/>
- | <input type="button" name="now" value="Now" onclick="location.href='{{ path }}';"/>
-</span><br/><br/>
-</form>
-</div>
-
-<div id='client_list_box'>
+<div class='client_list_box'>
 {% if entry_list %}
+  {% filter_navigator %}
   <table cellpadding="3">
-  <tr id='client_list_header' class='listview'>
+  <tr id='table_list_header' class='listview'>
     <td class='left_column'>Node</td>
     <td class='right_column' style='width:75px'>State</td>
     <td class='right_column_narrow'>Good</td>
@@ -61,30 +19,19 @@
     <td class='right_column'>Last Run</td>
     <td class='right_column_wide'>Server</td>
   </tr>
-  {% for client,entry,stale in entry_list %}
+  {% for entry in entry_list %}
   <tr class='{% cycle listview,listview_alt %}'>
-    <td class='left_column'><a href='{% url Bcfg2.Server.Reports.reports.views.client_detail hostname=client, pk=entry.id %}'>{{ client }}</a></td>
-    <td class='right_column' style='width:75px'><a href=
-      {% if server %}
-        '{% url Bcfg2.Server.Reports.reports.views.client_detailed_list server=server,state=entry.state %}{{ qsa }}'
-      {% else %}
-        '{% url Bcfg2.Server.Reports.reports.views.client_detailed_list state=entry.state %}{{ qsa }}'
-      {% endif %}
-    {% ifequal entry.state 'dirty' %}style='background:#FF6A6A'{% endifequal %}>{{ entry.state }}</a></td>
+    <td class='left_column'><a href='{% url Bcfg2.Server.Reports.reports.views.client_detail hostname=entry.client.name, pk=entry.id %}'>{{ entry.client.name }}</a></td>
+    <td class='right_column' style='width:75px'><a href='{% add_url_filter state=entry.state %}'
+      {% ifequal entry.state 'dirty' %}class='dirty-lineitem'{% endifequal %}>{{ entry.state }}</a></td>
     <td class='right_column_narrow'>{{ entry.goodcount }}</td>
     <td class='right_column_narrow'>{{ entry.bad_entry_count }}</td>
     <td class='right_column_narrow'>{{ entry.modified_entry_count }}</td>
     <td class='right_column_narrow'>{{ entry.extra_entry_count }}</td>
-    <td class='right_column'><span {% if stale %}style='background:#FF6A6A'{% endif %}>{{ entry.timestamp|date:"Y-m-d H:i" }}</span></td>
+    <td class='right_column'><span {% if entry.timestamp|isstale:entry_max %}class='dirty-lineitem'{% endif %}>{{ entry.timestamp|date:"Y-m-d\&\n\b\s\p\;H:i"|safe }}</span></td>
     <td class='right_column_wide'>
        {% if entry.server %}
-         <a href=
-           {% if state %}
-             '{% url Bcfg2.Server.Reports.reports.views.client_detailed_list server=entry.server,state=state %}{{ qsa }}'
-           {% else %}
-             '{% url Bcfg2.Server.Reports.reports.views.client_detailed_list server=entry.server %}{{ qsa }}'
-           {% endif %}
-         >{{ entry.server }}</a>
+         <a href='{% add_url_filter server=entry.server %}'>{{ entry.server }}</a>
        {% else %}
          &nbsp;
        {% endif %}
diff --git a/src/lib/Server/Reports/reports/templates/clients/history.html b/src/lib/Server/Reports/reports/templates/clients/history.html
new file mode 100644
index 000000000..01d4ec2f4
--- /dev/null
+++ b/src/lib/Server/Reports/reports/templates/clients/history.html
@@ -0,0 +1,20 @@
+{% extends "base.html" %}
+{% load bcfg2_tags %}
+
+{% block title %}Bcfg2 - Interaction History{% endblock %}
+{% block pagebanner %}Interaction history{% if client %} for {{ client.name }}{% endif %}{% endblock %}
+
+{% block extra_header_info %}
+{% endblock %}
+
+{% block content %}
+<div class='client_list_box'>
+{% if entry_list %}
+    {% filter_navigator %}
+    {% include "widgets/interaction_list.inc" %}
+{% else %}
+    <p>No client records are available.</p>
+{% endif %}
+</div>
+{% page_navigator %}
+{% endblock %}
diff --git a/src/lib/Server/Reports/reports/templates/clients/index.html b/src/lib/Server/Reports/reports/templates/clients/index.html
index cfb8a6c83..e0c0d2d7a 100644
--- a/src/lib/Server/Reports/reports/templates/clients/index.html
+++ b/src/lib/Server/Reports/reports/templates/clients/index.html
@@ -1,56 +1,33 @@
-{% extends "base.html" %}
+{% extends "base-timeview.html" %}
 
 {% block extra_header_info %}
-<script type="text/javascript" src="{% url Bcfg2.Server.Reports.reports.views.client_index %}../site_media/sorttable.js"></script>
-<script type="text/javascript" src="{% url Bcfg2.Server.Reports.reports.views.client_index %}../site_media/CalendarPopup.js"></script>
-<script language="JavaScript" type="text/javascript">var cal = new CalendarPopup();</script>
 {% endblock%}
 
-{% block title %}Client Index Listing{% endblock %}
+{% block title %}Bcfg2 - Client Grid View{% endblock %}
 
-{% block pagebanner %}
-  <div class="header">
-      <h1>Clients List</h1>
-  </div>
-  <br/>
-{% endblock %}
+{% block pagebanner %}Clients - Grid View{% endblock %}
 
 {% block content %}
-<div>
-<span class="mini-date">
-<b>Enter date or use calendar popup: </b>
-</span>
-<form name="timestamp-select" action="{{path}}" method="get">
-<span class="mini-date">
-<input type="text" name="date1" value="{{timestamp_date}}" size=10 />@
-<input type="text" name="time" value="{{timestamp_time}}" size=8 />
-<a href="#" onClick="cal.select(document.forms['timestamp-select'].date1,'anchor1','yyyy-MM-dd'); return false;"
-   name="anchor1" ID="anchor1">Calendar</A>
-<input type="button" name="go" value="Go" onClick="location.href='{% url Bcfg2.Server.Reports.reports.views.client_index %}'+document.forms['timestamp-select'].date1.value+'@'+document.forms['timestamp-select'].time.value;" />
- | <input type="button" name="now" value="Now" onClick="location.href='{% url Bcfg2.Server.Reports.reports.views.client_index %}';"/>
-</span></form>
-<br/><br/><br/></div>
 
 {% if inter_list %}
-<table><tr><td valign="top">
-    <ul style="list-style-type:none;">
-    {% for client,inter in inter_list %}
-        <li><div class="{{inter.state}}-lineitem">
-		<a href="{% spaceless %}{% ifequal timestamp 'now' %}
-			{% url Bcfg2.Server.Reports.reports.views.client_detail client %}
+    <table class='grid-view' align='center'>
+  {% for inter in inter_list %}
+      {% if forloop.first %}<tr>{% endif %}
+        <td class="{{inter.state}}-lineitem">
+            <a href="{% spaceless %}{% if not timestamp %}
+                    {% url reports_client_detail inter.client.name %}
+                {% else %}
+                    {% url reports_client_detail_pk inter.client.name,inter.id %}
+                {% endif %}
+                {% endspaceless %}">{{ inter.client.name }}</a>
+        </td>
+      {% if forloop.last %}
+        </tr>
 			{% else %}
-			{% url Bcfg2.Server.Reports.reports.views.client_detail client,inter.id %}
-			{% endifequal %}
-			{% endspaceless %}">{{ client }}</a>
-		</div></li>
-  {% ifequal half_list forloop.counter0 %}
-    </ul>
-</td><td valign="top">
-    <ul style="list-style-type:none;">
-  {% endifequal %}
+        {% if forloop.counter|divisibleby:"4" %}</tr><tr>{% endif %}
+      {% endif %}
     {% endfor %}
-    </ul>
-</tr></table>
+     </table>
 {% else %}
     <p>No client records are available.</p>
 {% endif %}
diff --git a/src/lib/Server/Reports/reports/templates/clients/manage.html b/src/lib/Server/Reports/reports/templates/clients/manage.html
index 61f0fe017..5725ae577 100644
--- a/src/lib/Server/Reports/reports/templates/clients/manage.html
+++ b/src/lib/Server/Reports/reports/templates/clients/manage.html
@@ -1,29 +1,45 @@
 {% extends "base.html" %}
+
 {% block extra_header_info %}
-<script type="text/javascript" src="{% url Bcfg2.Server.Reports.reports.views.client_index %}../site_media/CalendarPopup.js"></script>
-<script language="JavaScript" type="text/javascript">var cal = new CalendarPopup();</script>
 {% endblock%}
-{% block title %}{{client.name}}{% endblock %}
 
-{% block content %}
-<h2>Client Options Management page for {{client.name}}</h2><br/>
-<p>Client status detail page: <a href="{% url Bcfg2.Server.Reports.reports.views.client_detail client.name %}">{{client.name}}</a>.</p>
-<p>Hosts may be prevented from showing up in the reporting system if they have been retired, are no longer managed by bcfg2 :(, etc. </p>
-<b>Select deactivation date: </b>
-<div>
-<span class="mini-date">
-<b>Enter date or use calendar popup: </b>
-</span>
-<form name="timestamp-select" action="{% url Bcfg2.Server.Reports.reports.views.client_manage client.name %}" method="post">
-<span class="mini-date">
-<input type="text" name="date1" value="{{timestamp_date}}" size="10" />@
-<input type="text" name="time" value="{{timestamp_time}}" size="8" />
-<a href="#" onClick="cal.select(document.forms['timestamp-select'].date1,'anchor1','yyyy-MM-dd'); return false;"
-   name="anchor1" ID="anchor1">Calendar</a>
-<input type="submit" value="Submit">
-</span></form>
-<br/><br/><br/></div>
-<br/><br/>
-<p>{{message}}</p>
+{% block title %}Bcfg2 - Manage Clients{% endblock %}
 
+{% block pagebanner %}Clients - Manage{% endblock %}
+
+{% block content %}
+<div class='client_list_box'>
+  {% if message %}
+    <div class="warningbox">{{ message }}</div>
+  {% endif %}
+{% if clients %}
+  <table cellpadding="3">
+    <tr id='table_list_header' class='listview'>
+      <td class='left_column'>Node</td>
+      <td class='right_column'>Expiration</td>
+      <td class='right_column_narrow'>Manage</td>
+    </tr>
+  {% for client in clients %}
+    <tr class='{% cycle listview,listview_alt %}'>
+      <td><span id="{{ client.name }}"> </span>
+          <span id="ttag-{{ client.name }}"> </span>
+          <span id="s-ttag-{{ client.name }}"> </span>
+          <a href="{% url reports_client_detail client.name %}">{{ client.name }}</a></td>
+      <td>{% firstof client.expiration 'Active' %}</td>
+      <td>
+          <form method="post" action="{% url reports_client_manage %}">
+            <div> {# here for no reason other then to validate #}
+              <input type="hidden" name="client_name" value="{{ client.name }}" />
+              <input type="hidden" name="client_action" value="{% if client.expiration %}unexpire{% else %}expire{% endif %}" />
+              <input type="submit" value="{% if client.expiration %}Activate{% else %}Expire Now{% endif %}" />
+            </div>
+          </form>
+      </td>
+    </tr>
+  {% endfor %}
+  </table>
+  </div>
+{% else %}
+  <p>No client records are available.</p>
+{% endif %}
 {% endblock %}