From a3b838873fd04b83285fe3f955d012d5a0da71c5 Mon Sep 17 00:00:00 2001
From: Ted Trask <ttrask01@yahoo.com>
Date: Mon, 3 Feb 2014 21:35:45 +0000
Subject: Cleanup HTML including removing DL/DT/DD, use tablesorter where
 possible, and use lowercase tags

---
 opennhrp-editinterface-html.lsp  |  2 +-
 opennhrp-listinterfaces-html.lsp | 49 ++++++++++++++++++++++++++++------------
 opennhrp-show-html.lsp           | 27 ++++++++++------------
 3 files changed, 47 insertions(+), 31 deletions(-)

diff --git a/opennhrp-editinterface-html.lsp b/opennhrp-editinterface-html.lsp
index 76d37a2..ef5ebe6 100644
--- a/opennhrp-editinterface-html.lsp
+++ b/opennhrp-editinterface-html.lsp
@@ -25,7 +25,7 @@ html = require("acf.html")
 	});
 </script>
 
-<H1><%= html.html_escape(form.label) %></H1>
+<h1><%= html.html_escape(form.label) %></h1>
 <%
 	form.value.interface.readonly = true
 	local option = {"interface", "type", "map"}
diff --git a/opennhrp-listinterfaces-html.lsp b/opennhrp-listinterfaces-html.lsp
index 044de2e..a684c2d 100644
--- a/opennhrp-listinterfaces-html.lsp
+++ b/opennhrp-listinterfaces-html.lsp
@@ -3,24 +3,43 @@ htmlviewfunctions = require("htmlviewfunctions")
 html = require("acf.html")
 %>
 
+<script type="text/javascript">
+	if (typeof jQuery == 'undefined') {
+		document.write('<script type="text/javascript" src="<%= html.html_escape(page_info.wwwprefix) %>/js/jquery-latest.js"><\/script>');
+	}
+</script>
+
+<script type="text/javascript">
+	if (typeof $.tablesorter == 'undefined') {
+		document.write('<script type="text/javascript" src="<%= html.html_escape(page_info.wwwprefix) %>/js/jquery.tablesorter.js"><\/script>');
+	}
+</script>
+
+<script type="text/javascript">
+	$(document).ready(function() {
+		$("#list").tablesorter({headers: {0:{sorter: false}}, widgets: ['zebra']});
+	});
+</script>
+
 <% htmlviewfunctions.displaycommandresults({"editinterface"}, session) %>
 
 <h1><%= html.html_escape(view.label) %></h1>
-<DL><TABLE>
-	<TR style="background:#eee;font-weight:bold;">
-		<TD style="padding-right:20px;white-space:nowrap;text-align:left;" class="header">Action</TD>
-		<TD style="padding-right:20px;white-space:nowrap;text-align:right;" class="header">Interface</TD>
-		<TD style="padding-right:20px;white-space:nowrap;text-align:left;" class="header">Type</TD>
-		<TD style="white-space:nowrap;text-align:left;" class="header">Comment</TD>
-	</TR>		
+<table id="list" class="tablesorter"><thead>
+	<tr>
+		<th>Action</th>
+		<th>Interface</th>
+		<th>Type</th>
+		<th>Comment</th>
+	</tr>
+</thead><tbody>
 <% for i,intf in ipairs(view.value) do %>
-	<TR>
-		<TD style="padding-right:20px;white-space:nowrap;">
+	<tr>
+		<td>
 		<% io.write(html.link{value = "editinterface?interface="..intf.interface.."&redir="..page_info.orig_action, label="Edit " }) %>
-		</TD>
-		<TD style="padding-right:20px;white-space:nowrap;text-align:right;"><%= html.html_escape(intf.interface) %></TD>
-		<TD style="padding-right:20px;white-space:nowrap;"><%= html.html_escape(intf.type) %></TD>
-		<TD style="white-space:nowrap;" width="90%"><P class="error"><%= string.gsub(html.html_escape(intf.errtxt), "\n", "<BR>") %></P></TD>
-	</TR>
+		</td>
+		<td><%= html.html_escape(intf.interface) %></td>
+		<td><%= html.html_escape(intf.type) %></td>
+		<td><P class="error"><%= string.gsub(html.html_escape(intf.errtxt), "\n", "<br/>") %></P></td>
+	</tr>
 <% end %>
-</TABLE></DL>
+</tbody></table>
diff --git a/opennhrp-show-html.lsp b/opennhrp-show-html.lsp
index e168863..0ea960a 100644
--- a/opennhrp-show-html.lsp
+++ b/opennhrp-show-html.lsp
@@ -7,22 +7,21 @@ html = require("acf.html")
 	viewlibrary.dispatch_component("status")
 end %>
 
-<H2><%= html.html_escape(data.label) %></H2>
-<DL>
+<h2><%= html.html_escape(data.label) %></h2>
 <%
 htmlviewfunctions.displayitem(data.value.status)
 %>
-<DT><%= html.html_escape(data.value.peers_list.label) %></DT>
-<DD>
+<div class='item'><p class='left'><%= html.html_escape(data.value.peers_list.label) %></p>
+<div class='right'>
 <%
 	local found
 	for intf,addresses in pairs(data.value.peers_list.value) do
 		found = true
 %>
-		<TABLE STYLE='margin-bottom:10px;'>
-		<TR><TD STYLE='font-weight:bold;border:none;'><IMG SRC='<%= html.html_escape(page_info.wwwprefix..page_info.staticdir) %>/tango/16x16/places/network-server.png' width='16' height='16' alt> <%= html.html_escape(intf) %></TD><TD STYLE='border:none;'></TD></TR>
+		<table style='margin-bottom:10px;'>
+		<tr><td style='font-weight:bold;border:none;'><img src='<%= html.html_escape(page_info.wwwprefix..page_info.staticdir) %>/tango/16x16/places/network-server.png' width='16' height='16' alt> <%= html.html_escape(intf) %></td><td style='border:none;'></td></tr>
 <%		for i,entries in ipairs(addresses) do
-			io.write("<TR STYLE='padding-bottom:10px;'><TD WIDTH='150px' STYLE='font-weight:bold;padding-left:20px;border:none;'><IMG SRC='"..html.html_escape(page_info.wwwprefix..page_info.staticdir).."/tango/16x16/status/")
+			io.write("<tr style='padding-bottom:10px;'><td width='150px' style='font-weight:bold;padding-left:20px;border:none;'><img src='"..html.html_escape(page_info.wwwprefix..page_info.staticdir).."/tango/16x16/status/")
 
 			if entries.Type and (entries.Type.value == "negative") then
 				io.write("network-offline")
@@ -33,22 +32,20 @@ htmlviewfunctions.displayitem(data.value.status)
 			else
 				io.write("network-error")
 			end
-			io.write(".png' width='16' height='16' title='" .. html.html_escape(entries.Type.descr) .. "'> " .. html.html_escape(entries["Protocol-Address"].value) .. "</TD><TD STYLE='font-weight:bold;border:none;'></TD></TR>\n")
+			io.write(".png' width='16' height='16' title='" .. html.html_escape(entries.Type.descr) .. "'> " .. html.html_escape(entries["Protocol-Address"].value) .. "</td><td style='font-weight:bold;border:none;'></td></tr>\n")
 
     			for j,entry in pairs(entries) do
 				if  j ~= "Protocol-Address" then
-					io.write("<TR><TD STYLE='font-weight:bold;padding-left:40px;border:none;'>"..html.html_escape(entry.label).."</TD><TD STYLE='border:none;'>"..html.html_escape(entry.value))
+					io.write("<tr><td style='font-weight:bold;padding-left:40px;border:none;'>"..html.html_escape(entry.label).."</td><td style='border:none;'>"..html.html_escape(entry.value))
 					if entry.descr then
-						io.write(" <I>(" .. html.html_escape(entry.descr) .. ")</I>")
+						io.write(" <i>(" .. html.html_escape(entry.descr) .. ")</i>")
 					end
-					io.write("</TD></TR>\n")
+					io.write("</td></tr>\n")
 				end
 			end
 		end
-		io.write("\t\t\t</TABLE>")
+		io.write("\t\t\t</table>")
 	end
 	if not found then io.write("No peers found\n") end
 %>
-</DD>
-</DL>
-
+</div></div><!-- end .item -->
-- 
cgit v1.2.3