web reports: new skin

3 files changed, 131 insertions, 140 deletions

diff --git a/src/lib/Server/Reports/reports/templates/config_items/index.html b/src/lib/Server/Reports/reports/templates/config_items/index.html
deleted file mode 100644
index 04083344c..000000000
--- a/src/lib/Server/Reports/reports/templates/config_items/index.html
+++ /dev/null
@@ -1,100 +0,0 @@
-{% extends "base.html" %}
-
-{% load syntax_coloring %}
-
-{% block extra_header_info %}
-<link rel="stylesheet" type="text/css" href="{% url Bcfg2.Server.Reports.reports.views.client_index %}../site_media/syntax-coloring.css" />
-<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 %}Configuration Element Details{% endblock %}
-
-{% block pagebanner %}
-  <div class="header">
-      <h1>Configuration Element Details</h1>
-  </div>
-  <br/>
-{% endblock %}
-
-{% block content %}
-
-{% ifequal mod_or_bad "bad" %}
-<div class="bad">
-<h2>Bad {{item.entry.kind}}: {{item.entry.name}}</h2>
-</div>
-{% else %}
-<div class="modified">
-<h2>Modified {{item.entry.kind}}: {{item.entry.name}}</h2>
-</div>
-{% endifequal %}
-<center>
-<table border=1 padding=0 >
-<tr><th>Reason</th><th>Current Status</th><th>Specified in bcfg2</th></tr>
-{% if item.reason.current_owner %}
-<tr><td align="right"><b>Owner: </b></td><td>{{item.reason.current_owner}}</td><td>{{item.reason.owner}}</td></tr>
-{% endif %}{% if item.reason.current_group %}
-<tr><td align="right"><b>Group: </b></td><td>{{item.reason.current_group}}</td><td>{{item.reason.group}}</td></tr>
-{% endif %}{% if item.reason.current_perms %}
-<tr><td align="right"><b>Permissions: </b></td><td>{{item.reason.current_perms}}</td><td>{{item.reason.perms}}</td></tr>
-{% endif %}{% if item.reason.current_status %}
-<tr><td align="right"><b>Status: </b></td><td>{{item.reason.current_status}}</td><td>{{item.reason.status}}</td></tr>
-{% endif %}{% if item.reason.current_to %}
-<tr><td align="right"><b>Link Destination: </b></td><td>{{item.reason.current_to}}</td><td>{{item.reason.to}}</td></tr>
-{% endif %}{% if item.reason.current_version %}
-<tr><td align="right"><b>Version: </b></td><td>{{item.reason.current_version}}</td><td>{{item.reason.version}}</td></tr>
-{% endif %}{% if not item.reason.current_exists %}
-<tr><td align="right"><b>Existence: </b></td><td colspan=2>This item does not currently exist on the host but is specified to exist in the configuration.</td></tr>
-{% endif %}{% if item.reason.current_diff %}
-<tr><td align="right"><b>NDiff: </b></td><td colspan=2><pre>{{item.reason.current_diff|syntaxhilight:"diff"}}</pre></td></tr>
-{% endif %}
-</table></center>
-<hr/>
-<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>
-{% ifequal mod_or_bad "modified" %}
-    <input type="button"
-           name="go"
-           value="Go"
-           onClick="location.href='{% url Bcfg2.Server.Reports.reports.views.config_item_modified eyedee=item.id%}'+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.config_item_modified eyedee=item.id %}';"/>
-{% else %}
-    <input type="button"
-           name="go"
-           value="Go"
-           onClick="location.href='{% url Bcfg2.Server.Reports.reports.views.config_item_bad eyedee=item.id %}'+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.config_item_bad eyedee=item.id %}';"/>
-{% endifequal %}
-</span></form>
-<br/><br/><br/></div>
-{% if associated_client_list %}
-    <p>The following clients had this problem as of {{timestamp_date}}@{{timestamp_time}}:</p>
-    {% for client in associated_client_list %}
-        <a href="{% url Bcfg2.Server.Reports.reports.views.client_detail client.name %}">{{client.name}}</a><br/>
-    {% endfor %}
-    <br />
-    <br />
-{% else %}
-    <p>No Clients had this problem at {{timestamp}}</p>
-{% endif %}
-
-
-
-
-
-
-
-{% endblock %}
diff --git a/src/lib/Server/Reports/reports/templates/config_items/item.html b/src/lib/Server/Reports/reports/templates/config_items/item.html
new file mode 100644
index 000000000..41474922b
--- /dev/null
+++ b/src/lib/Server/Reports/reports/templates/config_items/item.html
@@ -0,0 +1,109 @@
+{% extends "base.html" %}
+{% load syntax_coloring %}
+
+
+{% block title %}Bcfg2 - Element Details{% endblock %}
+
+
+{% block extra_header_info %}
+<style type="text/css">
+#table_list_header {
+	font-size: 100%;
+}
+table.entry_list {
+        width: auto;
+}
+div.information_wrapper {
+	margin: 15px;
+}
+div.diff_wrapper {
+	overflow: auto;
+}
+div.entry_list h3 {
+	font-size: 90%;
+	padding: 5px;
+}
+</style>
+{% endblock%}
+
+{% block pagebanner %}Element Details{% endblock %}
+
+{% block content %}
+    <div class='detail_header'>
+      <h3>{{mod_or_bad|capfirst}} {{item.entry.kind}}: {{item.entry.name}}</h3>
+    </div>
+
+  <div class="information_wrapper">
+
+  {% if isextra %}
+  <p>This item exists on the host but is not defined in the configuration.</p>
+  {% endif %}
+
+  {% if not item.reason.current_exists %}
+  <div class="warning">This item does not currently exist on the host but is specified to exist in the configuration.</div>
+  {% endif %}
+
+  {% if item.reason.current_owner or item.reason.current_group or item.reason.current_perms or item.reason.current_status or item.reason.current_status or item.reason.current_to or item.reason.current_version %}
+  <table class='entry_list'>
+      <tr id='table_list_header'>
+          <td style='text-align: right;'>Problem Type</td><td>Expected</td><td style='border-bottom: 1px solid #98DBCC;'>Found</td></tr>
+    {% if item.reason.current_owner %}
+      <tr><td style='text-align: right'><b>Owner</b></td><td>{{item.reason.owner}}</td>
+          <td>{{item.reason.current_owner}}</td></tr>
+    {% endif %}
+    {% if item.reason.current_group %}
+      <tr><td style='text-align: right'><b>Group</b></td><td>{{item.reason.group}}</td>
+          <td>{{item.reason.current_group}}</td></tr>
+    {% endif %}
+    {% if item.reason.current_perms %}
+      <tr><td style='text-align: right'><b>Permissions</b></td><td>{{item.reason.perms}}</td>
+          <td>{{item.reason.current_perms}}</td></tr>
+    {% endif %}
+    {% if item.reason.current_status %}
+      <tr><td style='text-align: right'><b>Status</b></td><td>{{item.reason.status}}</td>
+          <td>{{item.reason.current_status}}</td></tr>
+    {% endif %}
+    {% if item.reason.current_to %}
+      <tr><td style='text-align: right'><b>Symlink Target</b></td><td>{{item.reason.to}}</td>
+          <td>{{item.reason.current_to}}</td></tr>
+    {% endif %}
+    {% if item.reason.current_version %}
+      <tr><td style='text-align: right'><b>Package Version</b></td><td>{{item.reason.version|cut:"("|cut:")"}}</td>
+          <td>{{item.reason.current_version|cut:"("|cut:")"}}</td></tr>
+    {% endif %}
+  </table>
+  {% endif %}
+
+  {% if item.reason.current_diff %}
+  <div class='entry_list'>
+    <div class='entry_list_head'>
+      <h3>Incorrect file contents</h3>
+    </div>
+    <div class='diff_wrapper'>
+      {{ item.reason.current_diff|syntaxhilight }}
+    </div>
+  </div>
+  {% endif %}
+
+
+  <div class='entry_list'>
+    <div class='entry_list_head'>
+      <h3>Occurances on {{ timestamp|date:"Y-m-d" }}</h3>
+    </div>
+    {% if associated_list %}
+      <table class="entry_list" cellpadding="3">
+        {% for inter in associated_list %}
+          <tr><td><a href="{% url reports_client_detail inter.client.name %}"
+              >{{inter.client.name}}</a></td>
+          <td><a href="{% url reports_client_detail_pk hostname=inter.client.name,pk=inter.id %}"
+              >{{inter.timestamp}}</a></td>
+          </tr>
+        {% endfor %}
+      </table>
+    {% else %}
+      <p>Missing client list</p>
+    {% endif %}
+  </div>
+
+  </div><!-- information_wrapper -->
+{% endblock %}
diff --git a/src/lib/Server/Reports/reports/templates/config_items/listing.html b/src/lib/Server/Reports/reports/templates/config_items/listing.html
index 64a60e506..572249470 100644
--- a/src/lib/Server/Reports/reports/templates/config_items/listing.html
+++ b/src/lib/Server/Reports/reports/templates/config_items/listing.html
@@ -1,50 +1,32 @@
-{% extends "base.html" %}
-{% load django_templating_sigh %}
+{% extends "base-timeview.html" %}
+{% load bcfg2_tags %}
 
-{% block extra_header_info %}
-<link rel="stylesheet" type="text/css" href="{% url Bcfg2.Server.Reports.reports.views.client_index %}../site_media/yui/tabview/assets/tabview.css" />
-<link rel="stylesheet" type="text/css" href="{% url Bcfg2.Server.Reports.reports.views.client_index %}../site_media/yui/round_tabs.css" />
-
-<script type="text/javascript" src="{% url Bcfg2.Server.Reports.reports.views.client_index %}../site_media/yui/yahoo/yahoo.js"></script>
-<script type="text/javascript" src="{% url Bcfg2.Server.Reports.reports.views.client_index %}../site_media/yui/event/event.js"></script>
-<script type="text/javascript" src="{% url Bcfg2.Server.Reports.reports.views.client_index %}../site_media/yui/dom/dom.js"></script>
-<script type="text/javascript" src="{% url Bcfg2.Server.Reports.reports.views.client_index %}../site_media/yui/tabview/tabview.js"></script>
-<script type="text/javascript">
-YAHOO.example.init = function( ){
-    var tabView = new YAHOO.widget.TabView( { id: 'demo' } );
-    {% for item_list in item_list_pseudodict %}
-    tabView.addTab( new YAHOO.widget.Tab({
-        label: '{{item_list.0}}',
-        content: '<p><ul style="list-style-type:none;">{% for item in item_list.1|sortwell %}<li><strong>{{item.entry.kind}}: <'+'/strong><tt>{% ifequal mod_or_bad "modified" %}<a href="{%url Bcfg2.Server.Reports.reports.views.config_item_modified eyedee=item.id%}">{{item.entry.name}}<'+'/a>{% else %}<a href="{%url Bcfg2.Server.Reports.reports.views.config_item_bad eyedee=item.id%}">{{item.entry.name}}<'+'/a>{% endifequal %}<'+'/tt><'+'/li>{% endfor %}<'+'/ul><'+'/p>',
-        active: 'True'
-    }));
-    {% endfor %}
+{% block title %}Bcfg2 - Element Listing{% endblock %}
 
-    YAHOO.util.Event.onContentReady('tabview', function() {
-        tabView.appendTo(this); /* append to #doc */
-    });
-
-};
-YAHOO.example.init();
+{% block extra_header_info %}
+{% endblock%}
 
-</script>
-<style type="text/css">
-#demo .yui-content { padding:1em; } /* pad content container */
-</style>
-{% endblock %}
+{% block pagebanner %}{{mod_or_bad|capfirst}} Element Listing{% endblock %}
 
-{% block title %}{{mod_or_bad|capfirst}} Item Listing{% endblock %}
+{% block content %}
+{% if item_list_dict %}
+  {% for kind, entries in item_list_dict.items %}
 
-{% block pagebanner %}
-  <div class="header">
-      <h1>{{mod_or_bad|capfirst}} Configuration Elements</h1>
+    <div class='entry_list'>
+      <div class='entry_list_head element_list_head'>
+        <div class='entry_expand_tab' onclick='javascript:toggleMe("table_{{ kind }}");'>[+]</div>
+        <h3>{{ kind }} &#8212; {{ entries|length }}</h3>
   </div>
-  <br/>
-{% endblock %}
 
-{% block content %}
-{% if item_list_pseudodict %}
-<div id="tabview"></div>
+      <table id='table_{{ kind }}' class='entry_list'>
+        {% for e in entries %}
+          <tr class='{% cycle listview,listview_alt %}'>
+            <td><a href="{% url reports_item type=mod_or_bad,pk=e.id %}">{{e.entry.name}}</a></td>
+          </tr>
+        {% endfor %}
+      </table>
+    </div>
+  {% endfor %}
 {% else %}
     <p>There are currently no inconsistent configuration entries.</p>
 {% endif %}