treewide: convert HTML tables to div

Mostly convert HTML tables to div based markup to allow for easier styling
in the future. Also change JS accessor code accordingly.

Signed-off-by: Jo-Philipp Wich <jo@mein.io>

1 files changed, 29 insertions, 29 deletions

diff --git a/applications/luci-app-olsr/luasrc/view/status-olsr/routes.htm b/applications/luci-app-olsr/luasrc/view/status-olsr/routes.htm
index 8e46daa022..c75b94fcef 100644
--- a/applications/luci-app-olsr/luasrc/view/status-olsr/routes.htm
+++ b/applications/luci-app-olsr/luasrc/view/status-olsr/routes.htm
@@ -50,9 +50,9 @@ XHR.poll(20, '<%=REQUEST_URI%>', { status: 1 },
 					var route = info[idx];
 
 					s += String.format(
-						'<tr class="cbi-section-table-row cbi-rowstyle-'+(1 + (idx % 2))+' proto-%s">' +
-							'<td class="cbi-section-table-cell">%s/%s</td>' +
-							'<td class="cbi-section-table-cell">' +
+						'<div class="tr cbi-section-table-row cbi-rowstyle-'+(1 + (idx % 2))+' proto-%s">' +
+							'<div class="td cbi-section-table-cell">%s/%s</div>' +
+							'<div class="td cbi-section-table-cell">' +
 			                	                '<a href="http://%s/cgi-bin-status.html">%s</a>',
 								route.proto, route.dest, route.genmask, route.gw, route.gw
 						)
@@ -72,11 +72,11 @@ XHR.poll(20, '<%=REQUEST_URI%>', { status: 1 },
 
 					}
 					s += String.format(
-				                        '</td>' +
-							'<td class="cbi-section-table-cell">%s</td>' +
-							'<td class="cbi-section-table-cell">%s</td>' +
-							'<td class="cbi-section-table-cell" style="background-color:%s">%s</td>' +
-						'</tr>',
+				                        '</div>' +
+							'<div class="td cbi-section-table-cell">%s</div>' +
+							'<div class="td cbi-section-table-cell">%s</div>' +
+							'<div class="td cbi-section-table-cell" style="background-color:%s">%s</div>' +
+						'</div>',
 						route.interface, route.metric, route.color, route.etx || '?'
 					);
 				}
@@ -96,27 +96,27 @@ XHR.poll(20, '<%=REQUEST_URI%>', { status: 1 },
 <fieldset class="cbi-section">
 <legend><%:Overview of currently known routes to other OLSR nodes%></legend>
 
-<table class="cbi-section-table">
-	<thead>
-		<tr class="cbi-section-table-titles">
-			<th class="cbi-section-table-cell"><%:Announced network%></th>
-			<th class="cbi-section-table-cell"><%:OLSR gateway%></th>
-			<th class="cbi-section-table-cell"><%:Interface%></th>
-			<th class="cbi-section-table-cell"><%:Metric%></th>
-			<th class="cbi-section-table-cell">ETX</th>
-		</tr>
-	</thead>
+<div class="table cbi-section-table">
+	<div class="thead">
+		<div class="tr cbi-section-table-titles">
+			<div class="th cbi-section-table-cell"><%:Announced network%></div>
+			<div class="th cbi-section-table-cell"><%:OLSR gateway%></div>
+			<div class="th cbi-section-table-cell"><%:Interface%></div>
+			<div class="th cbi-section-table-cell"><%:Metric%></div>
+			<div class="th cbi-section-table-cell">ETX</div>
+		</div>
+	</div>
 
-	<tbody id="olsrd_routes">
+	<div class="tbody" id="olsrd_routes">
 
 	<% for k, route in ipairs(routes) do
 		ETX = tonumber(route.rtpMetricCost)/1024 or '0'
 		color = olsrtools.etx_color(ETX)
 	%>
 
-		<tr class="cbi-section-table-row cbi-rowstyle-<%=i%> proto-<%=route.proto%>">
-			<td class="cbi-section-table-cell"><%=route.destination%>/<%=route.genmask%></td>
-			<td class="cbi-section-table-cell">
+		<div class="tr cbi-section-table-row cbi-rowstyle-<%=i%> proto-<%=route.proto%>">
+			<div class="td cbi-section-table-cell"><%=route.destination%>/<%=route.genmask%></div>
+			<div class="td cbi-section-table-cell">
 				<% if route.proto == '6' then %>
 				<a href="http://[<%=route.gateway%>]/cgi-bin-status.html"><%=route.gateway%></a>
 				<% else  %>
@@ -125,16 +125,16 @@ XHR.poll(20, '<%=REQUEST_URI%>', { status: 1 },
 				<% if route.hostname then %>
 					/ <a href="http://<%=route.Hostname%>/cgi-bin-status.html"><%=route.hostname%></a>  
 				<% end %>
-			</td>
-			<td class="cbi-section-table-cell"><%=route.networkInterface%></td>
-			<td class="cbi-section-table-cell"><%=route.metric%></td>
-			<td class="cbi-section-table-cell" style="background-color:<%=color%>"><%=string.format("%.3f", ETX)%></td>
-		</tr>
+			</div>
+			<div class="td cbi-section-table-cell"><%=route.networkInterface%></div>
+			<div class="td cbi-section-table-cell"><%=route.metric%></div>
+			<div class="td cbi-section-table-cell" style="background-color:<%=color%>"><%=string.format("%.3f", ETX)%></div>
+		</div>
 	<% 
 		i = ((i % 2) + 1)
 	end %>
-	</tbody>
-</table>
+	</div>
+</div>
 
 <%+status-olsr/legend%>
 </fieldset>