summaryrefslogtreecommitdiffhomepage
path: root/modules
diff options
context:
space:
mode:
authorJo-Philipp Wich <jo@mein.io>2018-05-28 14:57:54 +0200
committerJo-Philipp Wich <jo@mein.io>2018-05-28 15:18:45 +0200
commit067d7dc9f708d5ebeda1072fb6dc82e960de0d81 (patch)
tree10910cfcfc1d86a3f88d8b3239316564489585ea /modules
parent79c82237e373b9d9a101858e0cab96e4bd548f0c (diff)
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>
Diffstat (limited to 'modules')
-rw-r--r--modules/luci-base/luasrc/view/cbi/cell_valuefooter.htm2
-rw-r--r--modules/luci-base/luasrc/view/cbi/cell_valueheader.htm2
-rw-r--r--modules/luci-base/luasrc/view/cbi/tblsection.htm54
-rw-r--r--modules/luci-mod-admin-full/luasrc/view/admin_network/iface_overview.htm32
-rw-r--r--modules/luci-mod-admin-full/luasrc/view/admin_network/iface_status.htm18
-rw-r--r--modules/luci-mod-admin-full/luasrc/view/admin_network/lease_status.htm128
-rw-r--r--modules/luci-mod-admin-full/luasrc/view/admin_network/wifi_join.htm20
-rw-r--r--modules/luci-mod-admin-full/luasrc/view/admin_network/wifi_overview.htm144
-rw-r--r--modules/luci-mod-admin-full/luasrc/view/admin_network/wifi_status.htm18
-rw-r--r--modules/luci-mod-admin-full/luasrc/view/admin_status/bandwidth.htm44
-rw-r--r--modules/luci-mod-admin-full/luasrc/view/admin_status/connections.htm112
-rw-r--r--modules/luci-mod-admin-full/luasrc/view/admin_status/index.htm351
-rw-r--r--modules/luci-mod-admin-full/luasrc/view/admin_status/iptables.htm68
-rw-r--r--modules/luci-mod-admin-full/luasrc/view/admin_status/load.htm64
-rw-r--r--modules/luci-mod-admin-full/luasrc/view/admin_status/routes.htm112
-rw-r--r--modules/luci-mod-admin-full/luasrc/view/admin_status/wireless.htm56
-rw-r--r--modules/luci-mod-admin-full/luasrc/view/admin_system/packages.htm84
-rw-r--r--modules/luci-mod-freifunk/luasrc/view/freifunk/contact.htm30
-rw-r--r--modules/luci-mod-freifunk/luasrc/view/freifunk/public_status.htm84
19 files changed, 675 insertions, 748 deletions
diff --git a/modules/luci-base/luasrc/view/cbi/cell_valuefooter.htm b/modules/luci-base/luasrc/view/cbi/cell_valuefooter.htm
index 786ee43d10..bdd6bc9687 100644
--- a/modules/luci-base/luasrc/view/cbi/cell_valuefooter.htm
+++ b/modules/luci-base/luasrc/view/cbi/cell_valuefooter.htm
@@ -1,2 +1,2 @@
</div>
-</td>
+</div>
diff --git a/modules/luci-base/luasrc/view/cbi/cell_valueheader.htm b/modules/luci-base/luasrc/view/cbi/cell_valueheader.htm
index 9c9c21814b..a4b68cda72 100644
--- a/modules/luci-base/luasrc/view/cbi/cell_valueheader.htm
+++ b/modules/luci-base/luasrc/view/cbi/cell_valueheader.htm
@@ -1,2 +1,2 @@
-<td class="cbi-value-field<% if self.error and self.error[section] then %> cbi-value-error<% end %>">
+<div class="td cbi-value-field<% if self.error and self.error[section] then %> cbi-value-error<% end %>">
<div id="cbi-<%=self.config.."-"..section.."-"..self.option%>" data-index="<%=self.index%>" data-depends="<%=pcdata(self:deplist2json(section))%>">
diff --git a/modules/luci-base/luasrc/view/cbi/tblsection.htm b/modules/luci-base/luasrc/view/cbi/tblsection.htm
index 3cb87563f1..bb11cf1c06 100644
--- a/modules/luci-base/luasrc/view/cbi/tblsection.htm
+++ b/modules/luci-base/luasrc/view/cbi/tblsection.htm
@@ -27,52 +27,52 @@ end
<div class="cbi-section-descr"><%=self.description%></div>
<div class="cbi-section-node">
<%- local count = 0 -%>
- <table class="cbi-section-table">
- <tr class="cbi-section-table-titles">
+ <div class="table cbi-section-table">
+ <div class="tr cbi-section-table-titles">
<%- if not self.anonymous then -%>
<%- if self.sectionhead then -%>
- <th class="cbi-section-table-cell"><%=self.sectionhead%></th>
+ <div class="th cbi-section-table-cell"><%=self.sectionhead%></div>
<%- else -%>
- <th>&#160;</th>
+ <div class="th">&#160;</div>
<%- end -%>
<%- count = count +1; end -%>
<%- for i, k in pairs(self.children) do if not k.optional then -%>
- <th class="cbi-section-table-cell"<%=width(k)%>>
+ <div class="th cbi-section-table-cell"<%=width(k)%>>
<%- if k.titleref then -%><a title="<%=self.titledesc or translate('Go to relevant configuration page')%>" class="cbi-title-ref" href="<%=k.titleref%>"><%- end -%>
<%-=k.title-%>
<%- if k.titleref then -%></a><%- end -%>
- </th>
+ </div>
<%- count = count + 1; end; end; if self.sortable then -%>
- <th class="cbi-section-table-cell"><%:Sort%></th>
+ <div class="th cbi-section-table-cell"><%:Sort%></div>
<%- count = count + 1; end; if self.extedit or self.addremove then -%>
- <th class="cbi-section-table-cell">&#160;</th>
+ <div class="th cbi-section-table-cell">&#160;</div>
<%- count = count + 1; end -%>
- </tr>
- <tr class="cbi-section-table-descr">
+ </div>
+ <div class="tr cbi-section-table-descr">
<%- if not self.anonymous then -%>
<%- if self.sectiondesc then -%>
- <th class="cbi-section-table-cell"><%=self.sectiondesc%></th>
+ <div class="th cbi-section-table-cell"><%=self.sectiondesc%></div>
<%- else -%>
- <th></th>
+ <div class="th"></div>
<%- end -%>
<%- end -%>
<%- for i, k in pairs(self.children) do if not k.optional then -%>
- <th class="cbi-section-table-cell"<%=width(k)%>><%=k.description%></th>
+ <div class="th cbi-section-table-cell"<%=width(k)%>><%=k.description%></div>
<%- end; end; if self.sortable then -%>
- <th class="cbi-section-table-cell"></th>
+ <div class="th cbi-section-table-cell"></div>
<%- end; if self.extedit or self.addremove then -%>
- <th class="cbi-section-table-cell"></th>
+ <div class="th cbi-section-table-cell"></div>
<%- end -%>
- </tr>
+ </div>
<%- local isempty = true
for i, k in ipairs(self:cfgsections()) do
section = k
isempty = false
scope = { valueheader = "cbi/cell_valueheader", valuefooter = "cbi/cell_valuefooter" }
-%>
- <tr class="cbi-section-table-row<% if self.extedit or self.rowcolors then %> cbi-rowstyle-<%=rowstyle()%><% end %>" id="cbi-<%=self.config%>-<%=section%>">
+ <div class="tr cbi-section-table-row<% if self.extedit or self.rowcolors then %> cbi-rowstyle-<%=rowstyle()%><% end %>" id="cbi-<%=self.config%>-<%=section%>">
<% if not self.anonymous then -%>
- <th><h3><%=(type(self.sectiontitle) == "function") and self:sectiontitle(section) or k%></h3></th>
+ <div class="th"><h3><%=(type(self.sectiontitle) == "function") and self:sectiontitle(section) or k%></h3></div>
<%- end %>
@@ -85,14 +85,14 @@ end
-%>
<%- if self.sortable then -%>
- <td class="cbi-section-table-cell">
+ <div class="td cbi-section-table-cell">
<input class="cbi-button cbi-button-up" type="button" value="" onclick="return cbi_row_swap(this, true, 'cbi.sts.<%=self.config%>.<%=self.sectiontype%>')" alt="<%:Move up%>" title="<%:Move up%>" />
<input class="cbi-button cbi-button-down" type="button" value="" onclick="return cbi_row_swap(this, false, 'cbi.sts.<%=self.config%>.<%=self.sectiontype%>')" alt="<%:Move down%>" title="<%:Move down%>" />
- </td>
+ </div>
<%- end -%>
<%- if self.extedit or self.addremove then -%>
- <td class="cbi-section-table-cell">
+ <div class="td cbi-section-table-cell">
<%- if self.extedit then -%>
<input class="cbi-button cbi-button-edit" type="button" value="<%:Edit%>"
<%- if type(self.extedit) == "string" then
@@ -104,17 +104,17 @@ end
<%- end; if self.addremove then %>
<input class="cbi-button cbi-button-remove" type="submit" value="<%:Delete%>" onclick="this.form.cbi_state='del-section'; return true" name="cbi.rts.<%=self.config%>.<%=k%>" alt="<%:Delete%>" title="<%:Delete%>" />
<%- end -%>
- </td>
+ </div>
<%- end -%>
- </tr>
+ </div>
<%- end -%>
<%- if isempty then -%>
- <tr class="cbi-section-table-row">
- <td colspan="<%=count%>"><em><br /><%:This section contains no values yet%></em></td>
- </tr>
+ <div class="tr cbi-section-table-row">
+ <div class="td" colspan="<%=count%>"><em><br /><%:This section contains no values yet%></em></div>
+ </div>
<%- end -%>
- </table>
+ </div>
<% if self.error then %>
<div class="cbi-section-error">
diff --git a/modules/luci-mod-admin-full/luasrc/view/admin_network/iface_overview.htm b/modules/luci-mod-admin-full/luasrc/view/admin_network/iface_overview.htm
index 2512a35b3c..14be401697 100644
--- a/modules/luci-mod-admin-full/luasrc/view/admin_network/iface_overview.htm
+++ b/modules/luci-mod-admin-full/luasrc/view/admin_network/iface_overview.htm
@@ -164,7 +164,7 @@
ifc.ip6addrs[i]
);
}
-
+
if (ifc.ip6prefix)
{
html += String.format('<strong><%:IPv6-PD%>:</strong> %s<br />', ifc.ip6prefix);
@@ -212,20 +212,20 @@
<fieldset class="cbi-section">
<legend><%:Interface Overview%></legend>
- <table class="cbi-section-table" style="margin:10px; empty-cells:hide">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Network%></th>
- <th class="cbi-section-table-cell" style="text-align:left"><%:Status%></th>
- <th class="cbi-section-table-cell"><%:Actions%></th>
- </tr>
+ <div class="table cbi-section-table" style="margin:10px; empty-cells:hide">
+ <div class="tr cbi-section-table-titles">
+ <div class="th"><%:Network%></div>
+ <div class="th left"><%:Status%></div>
+ <div class="th"><%:Actions%></div>
+ </div>
<%
for i, net in ipairs(netlist) do
local z = net[3]
local c = z and z:get_color() or "#EEEEEE"
local t = z and translate("Part of zone %q" % z:name()) or translate("No zone assigned")
%>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=i % 2 + 1%>">
- <td class="cbi-value-field" style="padding:3px">
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=i % 2 + 1%>">
+ <div class="td">
<div class="ifacebox">
<div class="ifacebox-head" style="background-color:<%=c%>" title="<%=pcdata(t)%>">
<strong><%=net[1]:upper()%></strong>
@@ -235,19 +235,19 @@
<small>?</small>
</div>
</div>
- </td>
- <td class="cbi-value-field" style="vertical-align:middle; text-align:left; padding:3px" id="<%=net[1]%>-ifc-description">
+ </div>
+ <div class="td left" id="<%=net[1]%>-ifc-description">
<em><%:Collecting data...%></em>
- </td>
- <td style="width:420px">
+ </div>
+ <div class="td">
<input type="button" class="cbi-button cbi-button-reload" style="width:100px" onclick="iface_shutdown('<%=net[1]%>', true)" title="<%:Reconnect this interface%>" value="<%:Connect%>" />
<input type="button" class="cbi-button cbi-button-reset" style="width:100px" onclick="iface_shutdown('<%=net[1]%>', false)" title="<%:Shutdown this interface%>" value="<%:Stop%>" />
<input type="button" class="cbi-button cbi-button-edit" style="width:100px" onclick="location.href='<%=url("admin/network/network", net[1])%>'" title="<%:Edit this interface%>" value="<%:Edit%>" id="<%=net[1]%>-ifc-edit" />
<input type="button" class="cbi-button cbi-button-remove" style="width:100px" onclick="iface_delete('<%=net[1]%>')" value="<%:Delete%>" />
- </td>
- </tr>
+ </div>
+ </div>
<% end %>
- </table>
+ </div>
<input type="button" class="cbi-button cbi-button-add" value="<%:Add new interface...%>" onclick="location.href='<%=url("admin/network/iface_add")%>'" />
</fieldset>
diff --git a/modules/luci-mod-admin-full/luasrc/view/admin_network/iface_status.htm b/modules/luci-mod-admin-full/luasrc/view/admin_network/iface_status.htm
index b15dd13f39..58f5400da7 100644
--- a/modules/luci-mod-admin-full/luasrc/view/admin_network/iface_status.htm
+++ b/modules/luci-mod-admin-full/luasrc/view/admin_network/iface_status.htm
@@ -71,17 +71,17 @@
);
//]]></script>
-<table>
- <tr class="cbi-section-table">
- <td></td>
- <td class="cbi-value-field" style="min-width:16px; padding:3px; text-align:center" id="<%=self.option%>-ifc-signal">
+<div class="table">
+ <div class="tr cbi-section-table">
+ <div class="td"></div>
+ <div class="td cbi-value-field" style="min-width:16px; padding:3px; text-align:center" id="<%=self.option%>-ifc-signal">
<img src="<%=resource%>/icons/ethernet_disabled.png" style="width:16px; height:16px" /><br />
<small>?</small>
- </td>
- <td class="cbi-value-field" style="vertical-align:middle; text-align:left; padding:3px" id="<%=self.option%>-ifc-description">
+ </div>
+ <div class="td cbi-value-field" style="vertical-align:middle; text-align:left; padding:3px" id="<%=self.option%>-ifc-description">
<em><%:Collecting data...%></em>
- </td>
- </tr>
-</table>
+ </div>
+ </div>
+</div>
<%+cbi/valuefooter%>
diff --git a/modules/luci-mod-admin-full/luasrc/view/admin_network/lease_status.htm b/modules/luci-mod-admin-full/luasrc/view/admin_network/lease_status.htm
index 28a37dcd98..9005279a4e 100644
--- a/modules/luci-mod-admin-full/luasrc/view/admin_network/lease_status.htm
+++ b/modules/luci-mod-admin-full/luasrc/view/admin_network/lease_status.htm
@@ -20,10 +20,10 @@
if (st && st[0] && tb)
{
/* clear all rows */
- while( tb.rows.length > 1 )
- tb.deleteRow(1);
+ while (tb.firstElementChild !== tb.lastElementChild)
+ tb.removeChild(tb.lastElementChild);
- for( var i = 0; i < st[0].length; i++ )
+ for (var i = 0; i < st[0].length; i++)
{
var timestr;
@@ -34,24 +34,16 @@
else
timestr = String.format('%t', st[0][i].expires);
- var tr = tb.insertRow(-1);
- tr.className = 'cbi-section-table-row cbi-rowstyle-' + ((i % 2) + 1);
-
- tr.insertCell(-1).innerHTML = st[0][i].hostname ? st[0][i].hostname : '?';
- tr.insertCell(-1).innerHTML = st[0][i].ipaddr;
- tr.insertCell(-1).innerHTML = st[0][i].macaddr;
- tr.insertCell(-1).innerHTML = timestr;
+ tb.appendChild(E('<div class="tr cbi-section-table-row cbi-rowstyle-%d">'.format((i % 2) + 1), [
+ E('<div class="td">', st[0][i].hostname || '?'),
+ E('<div class="td">', st[0][i].ipaddr),
+ E('<div class="td">', st[0][i].macaddr),
+ E('<div class="td">', timestr)
+ ]));
}
- if( tb.rows.length == 1 )
- {
- var tr = tb.insertRow(-1);
- tr.className = 'cbi-section-table-row';
-
- var td = tr.insertCell(-1);
- td.colSpan = 4;
- td.innerHTML = '<em><br /><%:There are no active leases.%></em>';
- }
+ if (tb.firstElementChild === tb.lastElementChild)
+ tb.appendChild(E('<div class="tr cbi-section-table-row"><div class="td"><em><br /><%:There are no active leases.%></em></div></div>'));
}
var tb6 = document.getElementById('lease6_status_table');
@@ -60,10 +52,10 @@
tb6.parentNode.style.display = 'block';
/* clear all rows */
- while( tb6.rows.length > 1 )
- tb6.deleteRow(1);
+ while (tb6.firstElementChild !== tb6.lastElementChild)
+ tb6.removeChild(tb6.lastElementChild);
- for( var i = 0; i < st[1].length; i++ )
+ for (var i = 0; i < st[1].length; i++)
{
var timestr;
@@ -74,35 +66,29 @@
else
timestr = String.format('%t', st[1][i].expires);
- var tr = tb6.insertRow(-1);
- tr.className = 'cbi-section-table-row cbi-rowstyle-' + ((i % 2) + 1);
-
- var host = hosts[duid2mac(st[1][i].duid)];
- if (!st[1][i].hostname)
- tr.insertCell(-1).innerHTML =
- (host && (host.name || host.ipv4 || host.ipv6))
- ? '<div style="max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space: nowrap">? (%h)</div>'.format(host.name || host.ipv4 || host.ipv6)
- : '?';
- else
- tr.insertCell(-1).innerHTML =
- (host && host.name && st[1][i].hostname != host.name)
- ? '<div style="max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space: nowrap">%h (%h)</div>'.format(st[1][i].hostname, host.name)
- : st[1][i].hostname;
-
- tr.insertCell(-1).innerHTML = st[1][i].ip6addr;
- tr.insertCell(-1).innerHTML = st[1][i].duid;
- tr.insertCell(-1).innerHTML = timestr;
+ var host = hosts[duid2mac(st[1][i].duid)],
+ name = st[1][i].hostname,
+ hint = null;
+
+ if (!name) {
+ if (host)
+ hint = host.name || host.ipv4 || host.ipv6;
+ }
+ else {
+ if (host && host.name && st[1][i].hostname != host.name)
+ hint = host.name;
+ }
+
+ tb6.appendChild(E('<div class="tr cbi-section-table-row cbi-rowstyle-%d" style="max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space: nowrap">'.format((i % 2) + 1), [
+ E('<div class="td">', hint ? '<div style="max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space: nowrap">%h (%h)</div>'.format(name || '?', hint) : (name || '?')),
+ E('<div class="td">', st[1][i].ip6addr),
+ E('<div class="td">', st[1][i].duid),
+ E('<div class="td">', timestr)
+ ]));
}
- if( tb6.rows.length == 1 )
- {
- var tr = tb6.insertRow(-1);
- tr.className = 'cbi-section-table-row';
-
- var td = tr.insertCell(-1);
- td.colSpan = 4;
- td.innerHTML = '<em><br /><%:There are no active leases.%></em>';
- }
+ if (tb6.firstElementChild === tb6.lastElementChild)
+ tb6.appendChild(E('<div class="tr cbi-section-table-row"><div class="td"><em><br /><%:There are no active leases.%></em></div></div>'));
}
}
);
@@ -110,30 +96,30 @@
<fieldset class="cbi-section">
<legend><%:Active DHCP Leases%></legend>
- <table class="cbi-section-table" id="lease_status_table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Hostname%></th>
- <th class="cbi-section-table-cell"><%:IPv4-Address%></th>
- <th class="cbi-section-table-cell"><%:MAC-Address%></th>
- <th class="cbi-section-table-cell"><%:Leasetime remaining%></th>
- </tr>
- <tr class="cbi-section-table-row">
- <td colspan="4"><em><br /><%:Collecting data...%></em></td>
- </tr>
- </table>
+ <div class="table cbi-section-table" id="lease_status_table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:Hostname%></div>
+ <div class="th cbi-section-table-cell"><%:IPv4-Address%></div>
+ <div class="th cbi-section-table-cell"><%:MAC-Address%></div>
+ <div class="th cbi-section-table-cell"><%:Leasetime remaining%></div>
+ </div>
+ <div class="tr cbi-section-table-row">
+ <div class="td" colspan="4"><em><br /><%:Collecting data...%></em></div>
+ </div>
+ </div>
</fieldset>
<fieldset class="cbi-section" style="display:none">
<legend><%:Active DHCPv6 Leases%></legend>
- <table class="cbi-section-table" id="lease6_status_table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Host%></th>
- <th class="cbi-section-table-cell"><%:IPv6-Address%></th>
- <th class="cbi-section-table-cell"><%:DUID%></th>
- <th class="cbi-section-table-cell"><%:Leasetime remaining%></th>
- </tr>
- <tr class="cbi-section-table-row">
- <td colspan="4"><em><br /><%:Collecting data...%></em></td>
- </tr>
- </table>
+ <div class="table cbi-section-table" id="lease6_status_table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:Host%></div>
+ <div class="th cbi-section-table-cell"><%:IPv6-Address%></div>
+ <div class="th cbi-section-table-cell"><%:DUID%></div>
+ <div class="th cbi-section-table-cell"><%:Leasetime remaining%></div>
+ </div>
+ <div class="tr cbi-section-table-row">
+ <div class="td" colspan="4"><em><br /><%:Collecting data...%></em></div>
+ </div>
+ </div>
</fieldset>
diff --git a/modules/luci-mod-admin-full/luasrc/view/admin_network/wifi_join.htm b/modules/luci-mod-admin-full/luasrc/view/admin_network/wifi_join.htm
index 3533c6fa4d..e9cfb3e85b 100644
--- a/modules/luci-mod-admin-full/luasrc/view/admin_network/wifi_join.htm
+++ b/modules/luci-mod-admin-full/luasrc/view/admin_network/wifi_join.htm
@@ -91,24 +91,24 @@
<div class="cbi-map">
<fieldset class="cbi-section">
- <table class="cbi-section-table" style="empty-cells:hide">
+ <div class="table cbi-section-table" style="empty-cells:hide">
<!-- scan list -->
<% for i, net in ipairs(scanlist(3)) do net.encryption = net.encryption or { } %>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=1 + ((i-1) % 2)%>">
- <td class="cbi-value-field" style="width:16px; padding:3px">
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=1 + ((i-1) % 2)%>">
+ <div class="td cbi-value-field" style="width:16px; padding:3px">
<abbr title="<%:Signal%>: <%=net.signal%> <%:dB%> / <%:Quality%>: <%=net.quality%>/<%=net.quality_max%>">
<img src="<%=guess_wifi_signal(net)%>" /><br />
<small><%=percent_wifi_signal(net)%>%</small>
</abbr>
- </td>
- <td class="cbi-value-field" style="vertical-align:middle; text-align:left; padding:3px">
+ </div>
+ <div class="td cbi-value-field" style="vertical-align:middle; text-align:left; padding:3px">
<big><strong><%=net.ssid and utl.pcdata(net.ssid) or "<em>%s</em>" % translate("hidden")%></strong></big><br />
<strong>Channel:</strong> <%=net.channel%> |
<strong>Mode:</strong> <%=net.mode%> |
<strong>BSSID:</strong> <%=net.bssid%> |
<strong>Encryption:</strong> <%=format_wifi_encryption(net.encryption)%>
- </td>
- <td class="cbi-value-field" style="width:40px">
+ </div>
+ <div class="td cbi-value-field" style="width:40px">
<form action="<%=url('admin/network/wireless_join')%>" method="post">
<input type="hidden" name="token" value="<%=token%>" />
<input type="hidden" name="device" value="<%=utl.pcdata(dev)%>" />
@@ -128,11 +128,11 @@
<input class="cbi-button cbi-button-apply" type="submit" value="<%:Join Network%>" />
</form>
- </td>
- </tr>
+ </div>
+ </div>
<% end %>
<!-- /scan list -->
- </table>
+ </div>
</fieldset>
</div>
<div class="cbi-page-actions right">
diff --git a/modules/luci-mod-admin-full/luasrc/view/admin_network/wifi_overview.htm b/modules/luci-mod-admin-full/luasrc/view/admin_network/wifi_overview.htm
index 4465095ff2..31f1fed81f 100644
--- a/modules/luci-mod-admin-full/luasrc/view/admin_network/wifi_overview.htm
+++ b/modules/luci-mod-admin-full/luasrc/view/admin_network/wifi_overview.htm
@@ -195,8 +195,8 @@
{
var assoctable = document.getElementById('iw-assoclist');
if (assoctable)
- while (assoctable.rows.length > 1)
- assoctable.rows[1].parentNode.removeChild(assoctable.rows[1]);
+ while (assoctable.firstElementChild !== assoctable.lastElementChild)
+ assoctable.removeChild(assoctable.lastElementChild);
var devup = { };
var rowstyle = 1;
@@ -293,7 +293,7 @@
if (assoctable)
{
var assoclist = [ ];
- for( var bssid in iw.assoclist )
+ for (var bssid in iw.assoclist)
{
assoclist.push(iw.assoclist[bssid]);
assoclist[assoclist.length-1].bssid = bssid;
@@ -301,11 +301,8 @@
assoclist.sort(function(a, b) { a.bssid < b.bssid });
- for( var j = 0; j < assoclist.length; j++ )
+ for (var j = 0; j < assoclist.length; j++)
{
- var tr = assoctable.insertRow(-1);
- tr.className = 'cbi-section-table-row cbi-rowstyle-' + rowstyle;
-
var icon;
var q = (-1 * (assoclist[j].noise - assoclist[j].signal)) / 5;
if (q < 1)
@@ -319,48 +316,35 @@
else
icon = "<%=resource%>/icons/signal-75-100.png";
- tr.insertCell(-1).innerHTML = String.format(
- '<span class="ifacebadge" title="%q"><img src="<%=resource%>/icons/wifi.png" /> %h</span>',
- iw.device.name, iw.ifname
- );
-
- tr.insertCell(-1).innerHTML = nowrap(String.format('%h', iw.ssid ? iw.ssid : '?'));
- tr.insertCell(-1).innerHTML = assoclist[j].bssid;
-
- var host = hosts[assoclist[j].bssid];
- if (host)
- tr.insertCell(-1).innerHTML = String.format(
- '<div style="max-width:200px;overflow:hidden;text-overflow:ellipsis">%s</div>',
- ((host.name && (host.ipv4 || host.ipv6))
- ? '%h (%s)'.format(host.name, host.ipv4 || host.ipv6)
- : '%h'.format(host.name || host.ipv4 || host.ipv6)).nobr()
- );
- else
- tr.insertCell(-1).innerHTML = '?';
-
- tr.insertCell(-1).innerHTML = String.format(
- '<span class="ifacebadge" title="<%:Signal%>: %d <%:dBm%> / <%:Noise%>: %d <%:dBm%> / <%:SNR%>: %d"><img src="%s" /> %d / %d <%:dBm%></span>',
- assoclist[j].signal, assoclist[j].noise, assoclist[j].signal - assoclist[j].noise,
- icon,
- assoclist[j].signal, assoclist[j].noise
- );
-
- tr.insertCell(-1).innerHTML = nowrap(wifirate(assoclist[j], true)) + '<br />' + nowrap(wifirate(assoclist[j], false));
+ var host = hosts[assoclist[j].bssid],
+ name = host ? (host.name || host.ipv4 || host.ipv6) : null,
+ hint = (host && host.name && (host.ipv4 || host.ipv6)) ? (host.ipv4 || host.ipv6) : null;
+
+ assoctable.appendChild(E('<div class="tr cbi-section-table-row cbi-rowstyle-%d">'.format(rowstyle), [
+ E('<div class="td"><span class="ifacebadge" title="%q"><img src="<%=resource%>/icons/wifi.png" /> %h</span></div>'
+ .format(iw.device.name, iw.ifname)),
+ E('<div class="td" style="white-space:nowrap">%h</div>'
+ .format(iw.ssid || '?')),
+ E('<div class="td">%h</div>'
+ .format(assoclist[j].bssid)),
+ E('<div class="td">', hint ? '<div style="max-width:200px;overflow:hidden;text-overflow:ellipsis">%h (%h)</div>'
+ .format(name || '?', hint) : (name || '?')),
+ E('<div class="td"><span class="ifacebadge" title="<%:Signal%>: %d <%:dBm%> / <%:Noise%>: %d <%:dBm%> / <%:SNR%>: %d"><img src="%s" /> %d / %d <%:dBm%></span></div>'
+ .format(assoclist[j].signal, assoclist[j].noise, assoclist[j].signal - assoclist[j].noise, icon, assoclist[j].signal, assoclist[j].noise)),
+ E('<div class="td">', [
+ E('<span style="white-space:nowrap">', wifirate(assoclist[j], true)),
+ E('<br />'),
+ E('<span style="white-space:nowrap">', wifirate(assoclist[j], false))
+ ])
+ ]));
rowstyle = (rowstyle == 1) ? 2 : 1;
}
}
}
- if (assoctable && assoctable.rows.length == 1)
- {
- var tr = assoctable.insertRow(-1);
- tr.className = 'cbi-section-table-row';
-
- var td = tr.insertCell(-1);
- td.colSpan = 8;
- td.innerHTML = '<br /><em><%:No information available%></em>';
- }
+ if (assoctable && assoctable.firstElementChild === assoctable.lastElementChild)
+ assoctable.appendChild(E('<div class="tr cbi-section-table-row"><div class="td"><em><br /><%:No information available%></em></div></div>'));
for (var dev in devup)
{
@@ -386,15 +370,17 @@
<% for _, dev in ipairs(devices) do local nets = dev:get_wifinets() %>
<!-- device <%=dev:name()%> -->
<fieldset class="cbi-section">
- <table class="cbi-section-table" style="margin:10px; empty-cells:hide">
+ <div class="table cbi-section-table" style="margin:10px; empty-cells:hide">
<!-- physical device -->
- <tr>
- <td style="width:34px"><img src="<%=resource%>/icons/wifi_big_disabled.png" style="float:left; margin-right:10px" id="<%=dev:name()%>-iw-upstate" /></td>
- <td colspan="2" style="text-align:left">
+ <div class="tr">
+ <div class="td">
+ <img src="<%=resource%>/icons/wifi_big_disabled.png" id="<%=dev:name()%>-iw-upstate" />
+ </div>
+ <div class="td left">
<big><strong><%=guess_wifi_hw(dev)%> (<%=dev:name()%>)</strong></big><br />
<span id="<%=dev:name()%>-iw-devinfo"></span>
- </td>
- <td style="width:310px;text-align:right">
+ </div>
+ <div class="td right">
<form action="<%=url('admin/network/wireless_join')%>" method="post" class="inline">
<input type="hidden" name="device" value="<%=dev:name()%>" />
<input type="hidden" name="token" value="<%=token%>" />
@@ -405,38 +391,36 @@
<input type="hidden" name="token" value="<%=token%>" />
<input type="submit" class="cbi-button cbi-button-add" style="width:100px" title="<%:Provide new network%>" value="<%:Add%>" />
</form>
- </td>
- </tr>
+ </div>
+ </div>
<!-- /physical device -->
<!-- network list -->
<% if #nets > 0 then %>
<% for i, net in ipairs(nets) do %>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=1 + ((i-1) % 2)%>">
- <td></td>
- <td class="cbi-value-field" style="vertical-align:middle; padding:3px" id="<%=net:id()%>-iw-signal">
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=1 + ((i-1) % 2)%>">
+ <div class="td" id="<%=net:id()%>-iw-signal">
<span class="ifacebadge" title="<%:Not associated%>"><img src="<%=resource%>/icons/signal-none.png" /> 0%</span>
- </td>
- <td class="cbi-value-field" style="vertical-align:middle; text-align:left; padding:3px" id="<%=net:id()%>-iw-status">
+ </div>
+ <div class="td left" id="<%=net:id()%>-iw-status">
<em><%:Collecting data...%></em>
- </td>
- <td class="cbi-value-field" style="width:310px;text-align:right">
+ </div>
+ <div class="td right">
<input id="<%=net:id()%>-iw-toggle" type="button" class="cbi-button cbi-button-reload" style="width:100px" onclick="wifi_shutdown('<%=net:id()%>', this)" title="<%:Delete this network%>" value="<%:Enable%>" />
<input type="button" class="cbi-button cbi-button-edit" style="width:100px" onclick="location.href='<%=net:adminlink()%>'" title="<%:Edit this network%>" value="<%:Edit%>" />
<input type="button" class="cbi-button cbi-button-remove" style="width:100px" onclick="wifi_delete('<%=net:id()%>')" title="<%:Delete this network%>" value="<%:Remove%>" />
- </td>
- </tr>
+ </div>
+ </div>
<% end %>
<% else %>
- <tr class="cbi-section-table-row cbi-rowstyle-2">
- <td></td>
- <td colspan="3" class="cbi-value-field" style="vertical-align:middle; text-align:left; padding:3px">
+ <div class="tr cbi-section-table-row cbi-rowstyle-2">
+ <div class="td left">
<em><%:No network configured on this device%></em>
- </td>
- </tr>
+ </div>
+ </div>
<% end %>
<!-- /network list -->
- </table>
+ </div>
</fieldset>
<!-- /device <%=dev:name()%> -->
<% end %>
@@ -445,21 +429,21 @@
<h2><%:Associated Stations%></h2>
<fieldset class="cbi-section">
- <table class="cbi-section-table valign-middle" style="margin:10px" id="iw-assoclist">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"></th>
- <th class="cbi-section-table-cell"><%:SSID%></th>
- <th class="cbi-section-table-cell"><%:MAC-Address%></th>
- <th class="cbi-section-table-cell"><%:Host%></th>
- <th class="cbi-section-table-cell"><%:Signal%> / <%:Noise%></th>
- <th class="cbi-section-table-cell"><%:RX Rate%> / <%:TX Rate%></th>
- </tr>
- <tr class="cbi-section-table-row cbi-rowstyle-2">
- <td class="cbi-value-field" colspan="6">
+ <div class="table cbi-section-table valign-middle" style="margin:10px" id="iw-assoclist">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"></div>
+ <div class="th cbi-section-table-cell"><%:SSID%></div>
+ <div class="th cbi-section-table-cell"><%:MAC-Address%></div>
+ <div class="th cbi-section-table-cell"><%:Host%></div>
+ <div class="th cbi-section-table-cell"><%:Signal%> / <%:Noise%></div>
+ <div class="th cbi-section-table-cell"><%:RX Rate%> / <%:TX Rate%></div>
+ </div>
+ <div class="tr cbi-section-table-row cbi-rowstyle-2">
+ <div class="td">
<em><%:Collecting data...%></em>
- </td>
- </tr>
- </table>
+ </div>
+ </div>
+ </div>
</fieldset>
</div>
diff --git a/modules/luci-mod-admin-full/luasrc/view/admin_network/wifi_status.htm b/modules/luci-mod-admin-full/luasrc/view/admin_network/wifi_status.htm
index 04687f38e7..85468252e9 100644
--- a/modules/luci-mod-admin-full/luasrc/view/admin_network/wifi_status.htm
+++ b/modules/luci-mod-admin-full/luasrc/view/admin_network/wifi_status.htm
@@ -62,17 +62,17 @@
);
//]]></script>
-<table>
- <tr class="cbi-section-table">
- <td></td>
- <td class="cbi-value-field" style="width:16px; padding:3px" id="<%=self.option%>-iw-signal">
+<div class="table">
+ <div class="tr cbi-section-table">
+ <div class="td"></div>
+ <div class="td cbi-value-field" style="width:16px; padding:3px" id="<%=self.option%>-iw-signal">
<img src="<%=resource%>/icons/signal-none.png" title="<%:Not associated%>" /><br />
<small>0%</small>
- </td>
- <td class="cbi-value-field" style="vertical-align:middle; text-align:left; padding:3px" id="<%=self.option%>-iw-description">
+ </div>
+ <div class="td cbi-value-field" style="vertical-align:middle; text-align:left; padding:3px" id="<%=self.option%>-iw-description">
<em><%:Collecting data...%></em>
- </td>
- </tr>
-</table>
+ </div>
+ </div>
+</div>
<%+cbi/valuefooter%>
diff --git a/modules/luci-mod-admin-full/luasrc/view/admin_status/bandwidth.htm b/modules/luci-mod-admin-full/luasrc/view/admin_status/bandwidth.htm
index 33bbee7843..db1d0b8883 100644
--- a/modules/luci-mod-admin-full/luasrc/view/admin_status/bandwidth.htm
+++ b/modules/luci-mod-admin-full/luasrc/view/admin_status/bandwidth.htm
@@ -275,27 +275,27 @@
<div style="text-align:right"><small id="scale">-</small></div>
<br />
-<table style="width:100%; table-layout:fixed" cellspacing="5">
- <tr>
- <td style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid blue"><%:Inbound:%></strong></td>
- <td id="rx_bw_cur">0 <%:kbit/s%><br />(0 <%:kB/s%>)</td>
-
- <td style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></td>
- <td id="rx_bw_avg">0 <%:kbit/s%><br />(0 <%:kB/s%>)</td>
-
- <td style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></td>
- <td id="rx_bw_peak">0 <%:kbit/s%><br />(0 <%:kB/s%>)</td>
- </tr>
- <tr>
- <td style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid green"><%:Outbound:%></strong></td>
- <td id="tx_bw_cur">0 <%:kbit/s%><br />(0 <%:kB/s%>)</td>
-
- <td style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></td>
- <td id="tx_bw_avg">0 <%:kbit/s%><br />(0 <%:kB/s%>)</td>
-
- <td style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></td>
- <td id="tx_bw_peak">0 <%:kbit/s%><br />(0 <%:kB/s%>)</td>
- </tr>
-</table>
+<div class="table" style="width:100%; table-layout:fixed" cellspacing="5">
+ <div class="tr">
+ <div class="td" style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid blue"><%:Inbound:%></strong></div>
+ <div class="td" id="rx_bw_cur">0 <%:kbit/s%><br />(0 <%:kB/s%>)</div>
+
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></div>
+ <div class="td" id="rx_bw_avg">0 <%:kbit/s%><br />(0 <%:kB/s%>)</div>
+
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></div>
+ <div class="td" id="rx_bw_peak">0 <%:kbit/s%><br />(0 <%:kB/s%>)</div>
+ </div>
+ <div class="tr">
+ <div class="td" style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid green"><%:Outbound:%></strong></div>
+ <div class="td" id="tx_bw_cur">0 <%:kbit/s%><br />(0 <%:kB/s%>)</div>
+
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></div>
+ <div class="td" id="tx_bw_avg">0 <%:kbit/s%><br />(0 <%:kB/s%>)</div>
+
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></div>
+ <div class="td" id="tx_bw_peak">0 <%:kbit/s%><br />(0 <%:kB/s%>)</div>
+ </div>
+</div>
<%+footer%>
diff --git a/modules/luci-mod-admin-full/luasrc/view/admin_status/connections.htm b/modules/luci-mod-admin-full/luasrc/view/admin_status/connections.htm
index b7ebc41451..30d93f78bc 100644
--- a/modules/luci-mod-admin-full/luasrc/view/admin_status/connections.htm
+++ b/modules/luci-mod-admin-full/luasrc/view/admin_status/connections.htm
@@ -139,8 +139,8 @@
{
var conn = json.connections;
- while (conn_table.rows.length > 1)
- conn_table.rows[0].parentNode.deleteRow(-1);
+ while (conn_table.firstElementChild !== conn_table.lastElementChild)
+ conn_table.removeChild(conn_table.lastElementChild);
var lookup_queue = [ ];
@@ -153,13 +153,10 @@
{
var c = conn[i];
- if ((c.src == '127.0.0.1' && c.dst == '127.0.0.1')
- || (c.src == '::1' && c.dst == '::1'))
+ if ((c.src == '127.0.0.1' && c.dst == '127.0.0.1') ||
+ (c.src == '::1' && c.dst == '::1'))
continue;
- var tr = conn_table.rows[0].parentNode.insertRow(-1);
- tr.className = 'cbi-section-table-row cbi-rowstyle-' + (1 + (i % 2));
-
if (!dns_cache[c.src])
lookup_queue.push(c.src);
@@ -169,14 +166,13 @@
var src = dns_cache[c.src] || (c.layer3 == 'ipv6' ? '[' + c.src + ']' : c.src);
var dst = dns_cache[c.dst] || (c.layer3 == 'ipv6' ? '[' + c.dst + ']' : c.dst);
- tr.insertCell(-1).innerHTML = c.layer3.toUpperCase();
- tr.insertCell(-1).innerHTML = c.layer4.toUpperCase();
- tr.insertCell(-1).innerHTML = String.format('%s:%d', src, c.sport);
- tr.insertCell(-1).innerHTML = String.format('%s:%d', dst, c.dport);
-
- var traf = tr.insertCell(-1);
- traf.style.whiteSpace = 'nowrap';
- traf.innerHTML = String.format('%1024.2mB (%d <%:Pkts.%>)', c.bytes, c.packets);
+ conn_table.appendChild(E('<div class="tr cbi-section-table-row cbi-rowstyle-%d">'.format(1 + (i % 2)), [
+ E('<div class="td">', c.layer3.toUpperCase()),
+ E('<div class="td">', c.layer4.toUpperCase()),
+ E('<div class="td">', [ src, ':', c.sport ]),
+ E('<div class="td">', [ dst, ':', c.dport ]),
+ E('<div class="td" style="white-space:nowrap">', '%1024.2mB (%d <%:Pkts.%>)'.format(c.bytes, c.packets)),
+ ]));
}
if (lookup_queue.length > 0)
@@ -324,52 +320,52 @@
<div style="text-align:right"><small id="scale">-</small></div>
<br />
- <table style="width:100%; table-layout:fixed" cellspacing="5">
- <tr>
- <td style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid blue"><%:UDP:%></strong></td>
- <td id="lb_udp_cur">0</td>
-
- <td style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></td>
- <td id="lb_udp_avg">0</td>
-
- <td style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></td>
- <td id="lb_udp_peak">0</td>
- </tr>
- <tr>
- <td style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid green"><%:TCP:%></strong></td>
- <td id="lb_tcp_cur">0</td>
-
- <td style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></td>
- <td id="lb_tcp_avg">0</td>
-
- <td style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></td>
- <td id="lb_tcp_peak">0</td>
- </tr>
- <tr>
- <td style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid red"><%:Other:%></strong></td>
- <td id="lb_otr_cur">0</td>
-
- <td style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></td>
- <td id="lb_otr_avg">0</td>
-
- <td style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></td>
- <td id="lb_otr_peak">0</td>
- </tr>
- </table>
+ <div class="table" style="width:100%; table-layout:fixed" cellspacing="5">
+ <div class="tr">
+ <div class="td" style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid blue"><%:UDP:%></strong></div>
+ <div class="td" id="lb_udp_cur">0</div>
+
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></div>
+ <div class="td" id="lb_udp_avg">0</div>
+
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></div>
+ <div class="td" id="lb_udp_peak">0</div>
+ </div>
+ <div class="tr">
+ <div class="td" style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid green"><%:TCP:%></strong></div>
+ <div class="td" id="lb_tcp_cur">0</div>
+
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></div>
+ <div class="td" id="lb_tcp_avg">0</div>
+
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></div>
+ <div class="td" id="lb_tcp_peak">0</div>
+ </div>
+ <div class="tr">
+ <div class="td" style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid red"><%:Other:%></strong></div>
+ <div class="td" id="lb_otr_cur">0</div>
+
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></div>
+ <div class="td" id="lb_otr_avg">0</div>
+
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></div>
+ <div class="td" id="lb_otr_peak">0</div>
+ </div>
+ </div>
<br />
<div class="cbi-section-node">
- <table class="cbi-section-table" id="connections">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Network%></th>
- <th class="cbi-section-table-cell"><%:Protocol%></th>
- <th class="cbi-section-table-cell"><%:Source%></th>
- <th class="cbi-section-table-cell"><%:Destination%></th>
- <th class="cbi-section-table-cell"><%:Transfer%></th>
- </tr>
-
- <tr><td colspan="5"><em><%:Collecting data...%></em></td></tr>
- </table>
+ <div class="table cbi-section-table" id="connections">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:Network%></div>
+ <div class="th cbi-section-table-cell"><%:Protocol%></div>
+ <div class="th cbi-section-table-cell"><%:Source%></div>
+ <div class="th cbi-section-table-cell"><%:Destination%></div>
+ <div class="th cbi-section-table-cell"><%:Transfer%></div>
+ </div>
+
+ <div class="tr"><div class="td" colspan="5"><em><%:Collecting data...%></em></div></div>
+ </div>
</div>
</fieldset>
diff --git a/modules/luci-mod-admin-full/luasrc/view/admin_status/index.htm b/modules/luci-mod-admin-full/luasrc/view/admin_status/index.htm
index 5e6e494ad6..a72936f321 100644
--- a/modules/luci-mod-admin-full/luasrc/view/admin_status/index.htm
+++ b/modules/luci-mod-admin-full/luasrc/view/admin_status/index.htm
@@ -235,7 +235,7 @@
'<strong><%:Type%>: </strong>%s%s<br />',
ifc6.proto, (ifc6.ip6prefix) ? '-pd' : ''
);
-
+
if (!ifc6.ip6prefix)
{
s += String.format(
@@ -358,10 +358,10 @@
if (ls)
{
/* clear all rows */
- while( ls.rows.length > 1 )
- ls.rows[0].parentNode.deleteRow(1);
+ while (ls.firstElementChild !== ls.lastElementChild)
+ ls.removeChild(ls.lastElementChild);
- for( var i = 0; i < info.leases.length; i++ )
+ for (var i = 0; i < info.leases.length; i++)
{
var timestr;
@@ -372,24 +372,16 @@
else
timestr = String.format('%t', info.leases[i].expires);
- var tr = ls.rows[0].parentNode.insertRow(-1);
- tr.className = 'cbi-section-table-row cbi-rowstyle-' + ((i % 2) + 1);
-
- tr.insertCell(-1).innerHTML = info.leases[i].hostname ? info.leases[i].hostname : '?';
- tr.insertCell(-1).innerHTML = info.leases[i].ipaddr;
- tr.insertCell(-1).innerHTML = info.leases[i].macaddr;
- tr.insertCell(-1).innerHTML = timestr;
+ ls.appendChild(E('<div class="tr cbi-section-table-row cbi-rowstyle-%d">'.format((i % 2) + 1), [
+ E('<div class="td">', info.leases[i].hostname ? info.leases[i].hostname : '?'),
+ E('<div class="td">', info.leases[i].ipaddr),
+ E('<div class="td">', info.leases[i].macaddr),
+ E('<div class="td">', timestr)
+ ]));
}
- if( ls.rows.length == 1 )
- {
- var tr = ls.rows[0].parentNode.insertRow(-1);
- tr.className = 'cbi-section-table-row';
-
- var td = tr.insertCell(-1);
- td.colSpan = 4;
- td.innerHTML = '<em><br /><%:There are no active leases.%></em>';
- }
+ if (ls.firstElementChild === ls.lastElementChild)
+ ls.appendChild(E('<div class="tr cbi-section-table-row"><div class="td"><em><br /><%:There are no active leases.%></em></div></div>'));
}
var ls6 = document.getElementById('lease6_status_table');
@@ -398,10 +390,10 @@
ls6.parentNode.style.display = 'block';
/* clear all rows */
- while( ls6.rows.length > 1 )
- ls6.rows[0].parentNode.deleteRow(1);
+ while (ls6.firstElementChild !== ls6.lastElementChild)
+ ls6.removeChild(ls6.lastElementChild);
- for( var i = 0; i < info.leases6.length; i++ )
+ for (var i = 0; i < info.leases6.length; i++)
{
var timestr;
@@ -412,35 +404,29 @@
else
timestr = String.format('%t', info.leases6[i].expires);
- var tr = ls6.rows[0].parentNode.insertRow(-1);
- tr.className = 'cbi-section-table-row cbi-rowstyle-' + ((i % 2) + 1);
-
- var host = hosts[duid2mac(info.leases6[i].duid)];
- if (!info.leases6[i].hostname)
- tr.insertCell(-1).innerHTML =
- (host && (host.name || host.ipv4 || host.ipv6))
- ? '<div style="max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space: nowrap">? (%h)</div>'.format(host.name || host.ipv4 || host.ipv6)
- : '?';
- else
- tr.insertCell(-1).innerHTML =
- (host && host.name && info.leases6[i].hostname != host.name)
- ? '<div style="max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space: nowrap">%h (%h)</div>'.format(info.leases6[i].hostname, host.name)
- : info.leases6[i].hostname;
-
- tr.insertCell(-1).innerHTML = info.leases6[i].ip6addr;
- tr.insertCell(-1).innerHTML = info.leases6[i].duid;
- tr.insertCell(-1).innerHTML = timestr;
- }
+ var host = hosts[duid2mac(info.leases6[i].duid)],
+ name = info.leases6[i].hostname,
+ hint = null;
- if( ls6.rows.length == 1 )
- {
- var tr = ls6.rows[0].parentNode.insertRow(-1);
- tr.className = 'cbi-section-table-row';
+ if (!name) {
+ if (host)
+ hint = host.name || host.ipv4 || host.ipv6;
+ }
+ else {
+ if (host && host.name && info.leases6[i].hostname != host.name)
+ hint = host.name;
+ }
- var td = tr.insertCell(-1);
- td.colSpan = 4;
- td.innerHTML = '<em><br /><%:There are no active leases.%></em>';
+ ls6.appendChild(E('<div class="tr cbi-section-table-row cbi-rowstyle-%d" style="max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space: nowrap">'.format((i % 2) + 1), [
+ E('<div class="td">', hint ? '<div style="max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space: nowrap">%h (%h)</div>'.format(name || '?', hint) : (name || '?')),
+ E('<div class="td">', info.leases6[i].ip6addr),
+ E('<div class="td">', info.leases6[i].duid),
+ E('<div class="td">', timestr)
+ ]));
}
+
+ if (ls6.firstElementChild === ls6.lastElementChild)
+ ls6.appendChild(E('<div class="tr cbi-section-table-row"><div class="td"><em><br /><%:There are no active leases.%></em></div></div>'));
}
<% end %>
@@ -450,24 +436,12 @@
var ws = document.getElementById('wifi_status_table');
if (ws)
{
- var wsbody = ws.rows[0].parentNode;
- while (ws.rows.length > 0)
- wsbody.deleteRow(0);
+ while (ws.lastElementChild)
+ ws.removeChild(ws.lastElementChild);
for (var didx = 0; didx < info.wifinets.length; didx++)
{
var dev = info.wifinets[didx];
-
- var tr = wsbody.insertRow(-1);
- var td;
-
- td = tr.insertCell(-1);
- td.width = "33%";
- td.innerHTML = dev.name;
- td.style.verticalAlign = "top";
-
- td = tr.insertCell(-1);
-
var s = '';
for (var nidx = 0; nidx < dev.networks.length; nidx++)
@@ -490,10 +464,10 @@
icon = "<%=resource%>/icons/signal-75-100.png";
s += String.format(
- '<table><tr><td style="text-align:center; width:32px; padding:3px">' +
+ '<div class="table"><div class="tr"><div class="td" style="text-align:center; width:32px; padding:3px">' +
'<img src="%s" title="<%:Signal%>: %d dBm / <%:Noise%>: %d dBm" />' +
'<br /><small>%d%%</small>' +
- '</td><td style="text-align:left; padding:3px"><small>' +
+ '</div><div class="td" style="text-align:left; padding:3px"><small>' +
'<strong><%:SSID%>:</strong> <a href="%s">%h</a><br />' +
'<strong><%:Mode%>:</strong> %s<br />' +
'<strong><%:Channel%>:</strong> %d (%.3f <%:GHz%>)<br />' +
@@ -520,7 +494,7 @@
s += '<em><%:Wireless is disabled or not associated%></em>';
}
- s += '</small></td></tr></table>';
+ s += '</small></div></div></div>';
for (var bssid in net.assoclist)
{
@@ -539,7 +513,10 @@
if (!s)
s = '<em><%:No information available%></em>';
- td.innerHTML = s;
+ ws.appendChild(E('<div class="tr">', [
+ E('<div class="td left" width="33%" style="vertical-align:top">', dev.name),
+ E('<div class="td">', s)
+ ]));
}
}
@@ -547,8 +524,8 @@
if (ac)
{
/* clear all rows */
- while( ac.rows.length > 1 )
- ac.rows[0].parentNode.deleteRow(1);
+ while (ac.firstElementChild !== ac.lastElementChild)
+ ac.removeChild(ac.lastElementChild);
assoclist.sort(function(a, b) {
return (a.name == b.name)
@@ -557,11 +534,8 @@
;
});
- for( var i = 0; i < assoclist.length; i++ )
+ for (var i = 0; i < assoclist.length; i++)
{
- var tr = ac.rows[0].parentNode.insertRow(-1);
- tr.className = 'cbi-section-table-row cbi-rowstyle-' + (1 + (i % 2));
-
var icon;
var q = (-1 * (assoclist[i].noise - assoclist[i].signal)) / 5;
if (q < 1)
@@ -575,49 +549,31 @@
else
icon = "<%=resource%>/icons/signal-75-100.png";
- tr.insertCell(-1).innerHTML = String.format(
- '<span class="ifacebadge" title="%q"><img src="<%=resource%>/icons/wifi.png" /> %h</span>',
- assoclist[i].radio, assoclist[i].ifname
- );
-
- tr.insertCell(-1).innerHTML = String.format(
- '<a href="%s">%s</a>',
- assoclist[i].link,
- '%h'.format(assoclist[i].name).nobr()
- );
-
- tr.insertCell(-1).innerHTML = assoclist[i].bssid;
-
- var host = hosts[assoclist[i].bssid];
- if (host)
- tr.insertCell(-1).innerHTML = String.format(
- '<div style="max-width:200px;overflow:hidden;text-overflow:ellipsis">%s</div>',
- ((host.name && (host.ipv4 || host.ipv6))
- ? '%h (%s)'.format(host.name, host.ipv4 || host.ipv6)
- : '%h'.format(host.name || host.ipv4 || host.ipv6)).nobr()
- );
- else
- tr.insertCell(-1).innerHTML = '?';
-
- tr.insertCell(-1).innerHTML = String.format(
- '<span class="ifacebadge" title="<%:Signal%>: %d <%:dBm%> / <%:Noise%>: %d <%:dBm%> / <%:SNR%>: %d"><img src="%s" /> %d / %d <%:dBm%></span>',
- assoclist[i].signal, assoclist[i].noise, assoclist[i].signal - assoclist[i].noise,
- icon,
- assoclist[i].signal, assoclist[i].noise
- );
-
- tr.insertCell(-1).innerHTML = wifirate(assoclist[i], true).nobr() + '<br />' + wifirate(assoclist[i], false).nobr();
+ var host = hosts[assoclist[i].bssid],
+ name = host ? (host.name || host.ipv4 || host.ipv6) : null,
+ hint = (host && host.name && (host.ipv4 || host.ipv6)) ? (host.ipv4 || host.ipv6) : null;
+
+ ac.appendChild(E('<div class="tr cbi-section-table-row cbi-rowstyle-%d">'.format(1 + (i % 2)), [
+ E('<div class="td"><span class="ifacebadge" title="%q"><img src="<%=resource%>/icons/wifi.png" /> %h</span></div>'
+ .format(assoclist[i].radio, assoclist[i].ifname)),
+ E('<div class="td"><a href="%s" style="white-space:nowrap">%h</a></div>'
+ .format(assoclist[i].link, assoclist[i].name)),
+ E('<div class="td">',
+ assoclist[i].bssid),
+ E('<div class="td">',
+ hint ? '<div style="max-width:200px;overflow:hidden;text-overflow:ellipsis">%h (%h)</div>'.format(name || '?', hint) : (name || '?')),
+ E('<div class="td"><span class="ifacebadge" title="<%:Signal%>: %d <%:dBm%> / <%:Noise%>: %d <%:dBm%> / <%:SNR%>: %d"><img src="%s" /> %d / %d <%:dBm%></span></div>'
+ .format(assoclist[i].signal, assoclist[i].noise, assoclist[i].signal - assoclist[i].noise, icon, assoclist[i].signal, assoclist[i].noise)),
+ E('<div class="td">', [
+ E('<span style="white-space:nowrap">', wifirate(assoclist[i], true)),
+ E('<br />'),
+ E('<span style="white-space:nowrap">', wifirate(assoclist[i], false))
+ ])
+ ]));
}
- if (ac.rows.length == 1)
- {
- var tr = ac.rows[0].parentNode.insertRow(-1);
- tr.className = 'cbi-section-table-row';
-
- var td = tr.insertCell(-1);
- td.colSpan = 7;
- td.innerHTML = '<br /><em><%:No information available%></em>';
- }
+ if (ac.firstElementChild === ac.lastElementChild)
+ ac.appendChild(E('<div class="tr cbi-section-table-row"><div class="td"><em><br /><%:No information available%></em></div></div>'));
}
<% end %>
@@ -679,108 +635,113 @@
<fieldset class="cbi-section">
<legend><%:System%></legend>
- <table width="100%" cellspacing="10">
- <tr><td width="33%"><%:Hostname%></td><td><%=luci.sys.hostname() or "?"%></td></tr>
- <tr><td width="33%"><%:Model%></td><td><%=pcdata(boardinfo.model or boardinfo.system or "?")%></td></tr>
- <tr><td width="33%"><%:Firmware Version%></td><td>
+ <div class="table" width="100%">
+ <div class="tr"><div class="td left" width="33%"><%:Hostname%></div><div class="td left"><%=luci.sys.hostname() or "?"%></div></div>
+ <div class="tr"><div class="td left" width="33%"><%:Model%></div><div class="td left"><%=pcdata(boardinfo.model or boardinfo.system or "?")%></div></div>
+ <div class="tr"><div class="td left" width="33%"><%:Firmware Version%></div><div class="td left">
<%=pcdata(ver.distname)%> <%=pcdata(ver.distversion)%> /
<%=pcdata(ver.luciname)%> (<%=pcdata(ver.luciversion)%>)
- </td></tr>
- <tr><td width="33%"><%:Kernel Version%></td><td><%=unameinfo.release or "?"%></td></tr>
- <tr><td width="33%"><%:Local Time%></td><td id="localtime">-</td></tr>
- <tr><td width="33%"><%:Uptime%></td><td id="uptime">-</td></tr>
- <tr><td width="33%"><%:Load Average%></td><td id="loadavg">-</td></tr>
- </table>
+ </div></div>
+ <div class="tr"><div class="td left" width="33%"><%:Kernel Version%></div><div class="td left"><%=unameinfo.release or "?"%></div></div>
+ <div class="tr"><div class="td left" width="33%"><%:Local Time%></div><div class="td left" id="localtime">-</div></div>
+ <div class="tr"><div class="td left" width="33%"><%:Uptime%></div><div class="td left" id="uptime">-</div></div>
+ <div class="tr"><div class="td left" width="33%"><%:Load Average%></div><div class="td left" id="loadavg">-</div></div>
+ </div>
</fieldset>
<fieldset class="cbi-section">
<legend><%:Memory%></legend>
- <table width="100%" cellspacing="10">
- <tr><td width="33%"><%:Total Available%></td><td id="memtotal">-</td></tr>
- <tr><td width="33%"><%:Free%></td><td id="memfree">-</td></tr>
- <tr><td width="33%"><%:Buffered%></td><td id="membuff">-</td></tr>
- </table>
+ <div class="table" width="100%">
+ <div class="tr"><div class="td left" width="33%"><%:Total Available%></div><div class="td left" id="memtotal">-</div></div>
+ <div class="tr"><div class="td left" width="33%"><%:Free%></div><div class="td left" id="memfree">-</div></div>
+ <div class="tr"><div class="td left" width="33%"><%:Buffered%></div><div class="td left" id="membuff">-</div></div>
+ </div>
</fieldset>
<% if swapinfo.total > 0 then %>
<fieldset class="cbi-section">
<legend><%:Swap%></legend>
- <table width="100%" cellspacing="10">
- <tr><td width="33%"><%:Total Available%></td><td id="swaptotal">-</td></tr>
- <tr><td width="33%"><%:Free%></td><td id="swapfree">-</td></tr>
- </table>
+ <div class="table" width="100%">
+ <div class="tr"><div class="td left" width="33%"><%:Total Available%></div><div class="td left" id="swaptotal">-</div></div>
+ <div class="tr"><div class="td left" width="33%"><%:Free%></div><div class="td left" id="swapfree">-</div></div>
+ </div>
</fieldset>
<% end %>
<fieldset class="cbi-section">
<legend><%:Network%></legend>
- <table width="100%" cellspacing="10">
- <tr><td width="33%" style="vertical-align:top"><%:IPv4 WAN Status%></td><td>
- <table><tr>
- <td id="wan4_i" style="width:16px; text-align:center; padding:3px"><img src="<%=resource%>/icons/ethernet_disabled.png" /><br /><small>?</small></td>
- <td id="wan4_s" style="vertical-align:middle; padding: 3px"><em><%:Collecting data...%></em></td>
- </tr></table>
- </td></tr>
+ <div class="table" width="100%">
+ <div class="tr"><div class="td left" width="33%" style="vertical-align:top"><%:IPv4 WAN Status%></div><div class="td">
+ <div class="table"><div class="tr">
+ <div class="td" id="wan4_i" style="width:16px; text-align:center; padding:3px"><img src="<%=resource%>/icons/ethernet_disabled.png" /><br /><small>?</small></div>
+ <div class="td left" id="wan4_s" style="vertical-align:middle; padding: 3px"><em><%:Collecting data...%></em></div>
+ </div></div>
+ </div></div>
<% if has_ipv6 then %>
- <tr><td width="33%" style="vertical-align:top"><%:IPv6 WAN Status%></td><td>
- <table><tr>
- <td id="wan6_i" style="width:16px; text-align:center; padding:3px"><img src="<%=resource%>/icons/ethernet_disabled.png" /><br /><small>?</small></td>
- <td id="wan6_s" style="vertical-align:middle; padding: 3px"><em><%:Collecting data...%></em></td>
- </tr></table>
- </td></tr>
+ <div class="tr"><div class="td left" width="33%" style="vertical-align:top"><%:IPv6 WAN Status%></div><div class="td">
+ <div class="table"><div class="tr">
+ <div class="td" id="wan6_i" style="width:16px; text-align:center; padding:3px"><img src="<%=resource%>/icons/ethernet_disabled.png" /><br /><small>?</small></div>
+ <div class="td left" id="wan6_s" style="vertical-align:middle; padding: 3px"><em><%:Collecting data...%></em></div>
+ </div></div>
+ </div></div>
<% end %>
- <tr><td width="33%"><%:Active Connections%></td><td id="conns">-</td></tr>
- </table>
+ <div class="tr"><div class="td left" width="33%"><%:Active Connections%></div><div class="td left" id="conns">-</div></div>
+ </div>
</fieldset>
<% if has_dhcp then %>
<fieldset class="cbi-section">
<legend><%:DHCP Leases%></legend>
- <table class="cbi-section-table" id="lease_status_table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Hostname%></th>
- <th class="cbi-section-table-cell"><%:IPv4-Address%></th>
- <th class="cbi-section-table-cell"><%:MAC-Address%></th>
- <th class="cbi-section-table-cell"><%:Leasetime remaining%></th>
- </tr>
- <tr class="cbi-section-table-row">
- <td colspan="4"><em><br /><%:Collecting data...%></em></td>
- </tr>
- </table>
+ <div class="table cbi-section-table" id="lease_status_table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th"><%:Hostname%></div>
+ <div class="th"><%:IPv4-Address%></div>
+ <div class="th"><%:MAC-Address%></div>
+ <div class="th"><%:Leasetime remaining%></div>
+ </div>
+ <div class="tr cbi-section-table-row">
+ <div class="td" colspan="4"><em><br /><%:Collecting data...%></em></div>
+ </div>
+ </div>
</fieldset>
<fieldset class="cbi-section" style="display:none">
<legend><%:DHCPv6 Leases%></legend>
- <table class="cbi-section-table" id="lease6_status_table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Host%></th>
- <th class="cbi-section-table-cell"><%:IPv6-Address%></th>
- <th class="cbi-section-table-cell"><%:DUID%></th>
- <th class="cbi-section-table-cell"><%:Leasetime remaining%></th>
- </tr>
- <tr class="cbi-section-table-row">
- <td colspan="4"><em><br /><%:Collecting data...%></em></td>
- </tr>
- </table>
+ <div class="table cbi-section-table" id="lease6_status_table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th"><%:Host%></div>
+ <div class="th"><%:IPv6-Address%></div>
+ <div class="th"><%:DUID%></div>
+ <div class="th"><%:Leasetime remaining%></div>
+ </div>
+ <div class="tr cbi-section-table-row">
+ <div class="td" colspan="4"><em><br /><%:Collecting data...%></em></div>
+ </div>
+ </div>
</fieldset>
<% end %>
<% if has_dsl then %>
<fieldset class="cbi-section">
- <legend><%:DSL%></legend>
- <table width="100%" cellspacing="10">
- <tr><td width="33%" style="vertical-align:top"><%:DSL Status%></td><td>
- <table><tr>
- <td id="dsl_i" style="width:16px; text-align:center; padding:3px"><img src="<%=resource%>/icons/ethernet_disabled.png" /><br /><small>?</small></td>
- <td id="dsl_s" style="vertical-align:middle; padding: 3px"><em><%:Collecting data...%></em></td>
- </tr></table>
- </td></tr>
- </table>
+ <legend><%:DSL%></legend>
+ <div class="table" width="100%">
+ <div class="tr">
+ <div class="td left" width="33%" style="vertical-align:top"><%:DSL Status%></div>
+ <div class="td">
+ <div class="table">
+ <div class="tr">
+ <div class="td" id="dsl_i" style="width:16px; text-align:center; padding:3px"><img src="<%=resource%>/icons/ethernet_disabled.png" /><br /><small>?</small></div>
+ <div class="td left" id="dsl_s" style="vertical-align:middle; padding: 3px"><em><%:Collecting data...%></em></div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
</fieldset>
<% end %>
@@ -788,27 +749,27 @@
<fieldset class="cbi-section">
<legend><%:Wireless%></legend>
- <table id="wifi_status_table" width="100%" cellspacing="10">
- <tr><td><em><%:Collecting data...%></em></td></tr>
- </table>
+ <div class="table" id="wifi_status_table" width="100%">
+ <div class="tr"><div class="td"><em><%:Collecting data...%></em></div></div>
+ </div>
</fieldset>
<fieldset class="cbi-section">
<legend><%:Associated Stations%></legend>
- <table class="cbi-section-table valign-middle" id="wifi_assoc_table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell">&#160;</th>
- <th class="cbi-section-table-cell"><%:Network%></th>
- <th class="cbi-section-table-cell"><%:MAC-Address%></th>
- <th class="cbi-section-table-cell"><%:Host%></th>
- <th class="cbi-section-table-cell"><%:Signal%> / <%:Noise%></th>
- <th class="cbi-section-table-cell"><%:RX Rate%> / <%:TX Rate%></th>
- </tr>
- <tr class="cbi-section-table-row">
- <td colspan="6"><em><br /><%:Collecting data...%></em></td>
- </tr>
- </table>
+ <div class="table cbi-section-table valign-middle" id="wifi_assoc_table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th">&#160;</div>
+ <div class="th"><%:Network%></div>
+ <div class="th"><%:MAC-Address%></div>
+ <div class="th"><%:Host%></div>
+ <div class="th"><%:Signal%> / <%:Noise%></div>
+ <div class="th"><%:RX Rate%> / <%:TX Rate%></div>
+ </div>
+ <div class="tr cbi-section-table-row">
+ <div class="td" colspan="6"><em><br /><%:Collecting data...%></em></div>
+ </div>
+ </div>
</fieldset>
<% end %>
diff --git a/modules/luci-mod-admin-full/luasrc/view/admin_status/iptables.htm b/modules/luci-mod-admin-full/luasrc/view/admin_status/iptables.htm
index 3f4b83b80b..ced4d5f774 100644
--- a/modules/luci-mod-admin-full/luasrc/view/admin_status/iptables.htm
+++ b/modules/luci-mod-admin-full/luasrc/view/admin_status/iptables.htm
@@ -92,14 +92,14 @@
<% for _, tbl in ipairs(tables) do chaincnt = 0 %>
<h3><%:Table%>: <%=tbl%></h3>
- <table class="cbi-section-table" style="font-size:90%">
+ <div class="table cbi-section-table" style="font-size:90%">
<% for _, chain in ipairs(ipt:chains(tbl)) do
rowcnt = 0
chaincnt = chaincnt + 1
chaininfo = ipt:chain(tbl, chain)
%>
- <tr class="cbi-section-table-titles cbi-rowstyle-<%=rowstyle()%>">
- <th class="cbi-section-table-cell" style="text-align:left" colspan="11">
+ <div class="tr cbi-section-table-titles cbi-rowstyle-<%=rowstyle()%>">
+ <div class="th cbi-section-table-cell" style="text-align:left" colspan="11">
<br /><span id="rule_<%=tbl:lower()%>_<%=chain%>">
<%:Chain%> <em><%=chain%></em>
(<%- if chaininfo.policy then -%>
@@ -107,47 +107,47 @@
<%- else -%>
<%:References%>: <%=chaininfo.references-%>
<%- end -%>)</span>
- </th>
- </tr>
- <tr class="cbi-section-table-descr">
- <th class="cbi-section-table-cell"><%:Pkts.%></th>
- <th class="cbi-section-table-cell"><%:Traffic%></th>
- <th class="cbi-section-table-cell"><%:Target%></th>
- <th class="cbi-section-table-cell"><%:Prot.%></th>
- <th class="cbi-section-table-cell"><%:In%></th>
- <th class="cbi-section-table-cell"><%:Out%></th>
- <th class="cbi-section-table-cell"><%:Source%></th>
- <th class="cbi-section-table-cell"><%:Destination%></th>
- <th class="cbi-section-table-cell" style="width:30%"><%:Options%></th>
- </tr>
+ </div>
+ </div>
+ <div class="tr cbi-section-table-descr">
+ <div class="th cbi-section-table-cell"><%:Pkts.%></div>
+ <div class="th cbi-section-table-cell"><%:Traffic%></div>
+ <div class="th cbi-section-table-cell"><%:Target%></div>
+ <div class="th cbi-section-table-cell"><%:Prot.%></div>
+ <div class="th cbi-section-table-cell"><%:In%></div>
+ <div class="th cbi-section-table-cell"><%:Out%></div>
+ <div class="th cbi-section-table-cell"><%:Source%></div>
+ <div class="th cbi-section-table-cell"><%:Destination%></div>
+ <div class="th cbi-section-table-cell" style="width:30%"><%:Options%></div>
+ </div>
<% for _, rule in ipairs(ipt:find({table=tbl, chain=chain})) do %>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=rowstyle()%>">
- <td><%=rule.packets%></td>
- <td style="white-space: nowrap"><%=wba.byte_format(rule.bytes)%></td>
- <td><%=rule.target and link_target(tbl, rule.target) or "-"%></td>
- <td><%=rule.protocol%></td>
- <td><%=link_iface(rule.inputif)%></td>
- <td><%=link_iface(rule.outputif)%></td>
- <td><%=rule.source%></td>
- <td><%=rule.destination%></td>
- <td style="width:30%"><small><%=#rule.options > 0 and luci.util.pcdata(table.concat(rule.options, " ")) or "-"%></small></td>
- </tr>
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=rowstyle()%>">
+ <div class="td"><%=rule.packets%></div>
+ <div class="td" style="white-space: nowrap"><%=wba.byte_format(rule.bytes)%></div>
+ <div class="td"><%=rule.target and link_target(tbl, rule.target) or "-"%></div>
+ <div class="td"><%=rule.protocol%></div>
+ <div class="td"><%=link_iface(rule.inputif)%></div>
+ <div class="td"><%=link_iface(rule.outputif)%></div>
+ <div class="td"><%=rule.source%></div>
+ <div class="td"><%=rule.destination%></div>
+ <div class="td" style="width:30%"><small><%=#rule.options > 0 and luci.util.pcdata(table.concat(rule.options, " ")) or "-"%></small></div>
+ </div>
<% end %>
<% if rowcnt == 1 then %>
- <tr class="cbi-section-table-titles cbi-rowstyle-<%=rowstyle()%>">
- <td colspan="9"><em><%:No rules in this chain%></em></td>
- </tr>
+ <div class="tr cbi-section-table-titles cbi-rowstyle-<%=rowstyle()%>">
+ <div class="td" colspan="9"><em><%:No rules in this chain%></em></div>
+ </div>
<% end %>
<% end %>
<% if chaincnt == 0 then %>
- <tr class="cbi-section-table-titles cbi-rowstyle-<%=rowstyle()%>">
- <td colspan="9"><em><%:No chains in this table%></em></td>
- </tr>
+ <div class="tr cbi-section-table-titles cbi-rowstyle-<%=rowstyle()%>">
+ <div class="td" colspan="9"><em><%:No chains in this table%></em></div>
+ </div>
<% end %>
- </table>
+ </div>
<br /><br />
<% end %>
</fieldset>
diff --git a/modules/luci-mod-admin-full/luasrc/view/admin_status/load.htm b/modules/luci-mod-admin-full/luasrc/view/admin_status/load.htm
index 97a2f5ed59..c8ada71569 100644
--- a/modules/luci-mod-admin-full/luasrc/view/admin_status/load.htm
+++ b/modules/luci-mod-admin-full/luasrc/view/admin_status/load.htm
@@ -248,37 +248,37 @@
<div style="text-align:right"><small id="scale">-</small></div>
<br />
-<table style="width:100%; table-layout:fixed" cellspacing="5">
- <tr>
- <td style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid #ff0000; white-space:nowrap"><%:1 Minute Load:%></strong></td>
- <td id="lb_load01_cur">0</td>
-
- <td style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></td>
- <td id="lb_load01_avg">0</td>
-
- <td style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></td>
- <td id="lb_load01_peak">0</td>
- </tr>
- <tr>
- <td style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid #ff6600; white-space:nowrap"><%:5 Minute Load:%></strong></td>
- <td id="lb_load05_cur">0</td>
-
- <td style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></td>
- <td id="lb_load05_avg">0</td>
-
- <td style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></td>
- <td id="lb_load05_peak">0</td>
- </tr>
- <tr>
- <td style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid #ffaa00; white-space:nowrap"><%:15 Minute Load:%></strong></td>
- <td id="lb_load15_cur">0</td>
-
- <td style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></td>
- <td id="lb_load15_avg">0</td>
-
- <td style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></td>
- <td id="lb_load15_peak">0</td>
- </tr>
-</table>
+<div class="table" style="width:100%; table-layout:fixed" cellspacing="5">
+ <div class="tr">
+ <div class="td" style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid #ff0000; white-space:nowrap"><%:1 Minute Load:%></strong></div>
+ <div class="td" id="lb_load01_cur">0</div>
+
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></div>
+ <div class="td" id="lb_load01_avg">0</div>
+
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></div>
+ <div class="td" id="lb_load01_peak">0</div>
+ </div>
+ <div class="tr">
+ <div class="td" style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid #ff6600; white-space:nowrap"><%:5 Minute Load:%></strong></div>
+ <div class="td" id="lb_load05_cur">0</div>
+
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></div>
+ <div class="td" id="lb_load05_avg">0</div>
+
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></div>
+ <div class="td" id="lb_load05_peak">0</div>
+ </div>
+ <div class="tr">
+ <div class="td" style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid #ffaa00; white-space:nowrap"><%:15 Minute Load:%></strong></div>
+ <div class="td" id="lb_load15_cur">0</div>
+
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></div>
+ <div class="td" id="lb_load15_avg">0</div>
+
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></div>
+ <div class="td" id="lb_load15_peak">0</div>
+ </div>
+</div>
<%+footer%>
diff --git a/modules/luci-mod-admin-full/luasrc/view/admin_status/routes.htm b/modules/luci-mod-admin-full/luasrc/view/admin_status/routes.htm
index f474c71568..af80371353 100644
--- a/modules/luci-mod-admin-full/luasrc/view/admin_status/routes.htm
+++ b/modules/luci-mod-admin-full/luasrc/view/admin_status/routes.htm
@@ -39,28 +39,28 @@
<fieldset class="cbi-section">
<legend>ARP</legend>
<div class="cbi-section-node">
- <table class="cbi-section-table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%_<abbr title="Internet Protocol Version 4">IPv4</abbr>-Address%></th>
- <th class="cbi-section-table-cell"><%_<abbr title="Media Access Control">MAC</abbr>-Address%></th>
- <th class="cbi-section-table-cell"><%:Interface%></th>
- </tr>
+ <div class="table cbi-section-table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%_<abbr title="Internet Protocol Version 4">IPv4</abbr>-Address%></div>
+ <div class="th cbi-section-table-cell"><%_<abbr title="Media Access Control">MAC</abbr>-Address%></div>
+ <div class="th cbi-section-table-cell"><%:Interface%></div>
+ </div>
<%
for _, v in ipairs(ip.neighbors({ family = 4 })) do
if v.mac then
%>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=(style and 1 or 2)%>">
- <td class="cbi-value-field"><%=v.dest%></td>
- <td class="cbi-value-field"><%=v.mac%></td>
- <td class="cbi-value-field"><%=luci.tools.webadmin.iface_get_network(v.dev) or '(' .. v.dev .. ')'%></td>
- </tr>
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=(style and 1 or 2)%>">
+ <div class="td cbi-value-field"><%=v.dest%></div>
+ <div class="td cbi-value-field"><%=v.mac%></div>
+ <div class="td cbi-value-field"><%=luci.tools.webadmin.iface_get_network(v.dev) or '(' .. v.dev .. ')'%></div>
+ </div>
<%
style = not style
end
end
%>
- </table>
+ </div>
</div>
</fieldset>
<br />
@@ -69,24 +69,24 @@
<legend><%_Active <abbr title="Internet Protocol Version 4">IPv4</abbr>-Routes%></legend>
<div class="cbi-section-node">
- <table class="cbi-section-table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Network%></th>
- <th class="cbi-section-table-cell"><%:Target%></th>
- <th class="cbi-section-table-cell"><%_<abbr title="Internet Protocol Version 4">IPv4</abbr>-Gateway%></th>
- <th class="cbi-section-table-cell"><%:Metric%></th>
- <th class="cbi-section-table-cell"><%:Table%></th>
- </tr>
+ <div class="table cbi-section-table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:Network%></div>
+ <div class="th cbi-section-table-cell"><%:Target%></div>
+ <div class="th cbi-section-table-cell"><%_<abbr title="Internet Protocol Version 4">IPv4</abbr>-Gateway%></div>
+ <div class="th cbi-section-table-cell"><%:Metric%></div>
+ <div class="th cbi-section-table-cell"><%:Table%></div>
+ </div>
<% for _, v in ipairs(ip.routes({ family = 4, type = 1 })) do %>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=(style and 1 or 2)%>">
- <td class="cbi-value-field"><%=luci.tools.webadmin.iface_get_network(v.dev) or v.dev%></td>
- <td class="cbi-value-field"><%=v.dest%></td>
- <td class="cbi-value-field"><%=v.gw%></td>
- <td class="cbi-value-field"><%=v.metric or 0%></td>
- <td class="cbi-value-field"><%=rtn[v.table] or v.table%></td>
- </tr>
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=(style and 1 or 2)%>">
+ <div class="td cbi-value-field"><%=luci.tools.webadmin.iface_get_network(v.dev) or v.dev%></div>
+ <div class="td cbi-value-field"><%=v.dest%></div>
+ <div class="td cbi-value-field"><%=v.gw%></div>
+ <div class="td cbi-value-field"><%=v.metric or 0%></div>
+ <div class="td cbi-value-field"><%=rtn[v.table] or v.table%></div>
+ </div>
<% style = not style end %>
- </table>
+ </div>
</div>
</fieldset>
<br />
@@ -99,31 +99,31 @@
<legend><%_Active <abbr title="Internet Protocol Version 6">IPv6</abbr>-Routes%></legend>
<div class="cbi-section-node">
- <table class="cbi-section-table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Network%></th>
- <th class="cbi-section-table-cell"><%:Target%></th>
- <th class="cbi-section-table-cell"><%:Source%></th>
- <th class="cbi-section-table-cell"><%:Metric%></th>
- <th class="cbi-section-table-cell"><%:Table%></th>
- </tr>
+ <div class="table cbi-section-table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:Network%></div>
+ <div class="th cbi-section-table-cell"><%:Target%></div>
+ <div class="th cbi-section-table-cell"><%:Source%></div>
+ <div class="th cbi-section-table-cell"><%:Metric%></div>
+ <div class="th cbi-section-table-cell"><%:Table%></div>
+ </div>
<%
for _, v in ipairs(ip.routes({ family = 6, type = 1 })) do
if v.dest and not v.dest:is6linklocal() then
%>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=(style and 1 or 2)%>">
- <td class="cbi-value-field"><%=luci.tools.webadmin.iface_get_network(v.dev) or '(' .. v.dev .. ')'%></td>
- <td class="cbi-value-field"><%=v.dest%></td>
- <td class="cbi-value-field"><%=v.from%></td>
- <td class="cbi-value-field"><%=v.metric or 0%></td>
- <td class="cbi-value-field"><%=rtn[v.table] or v.table%></td>
- </tr>
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=(style and 1 or 2)%>">
+ <div class="td cbi-value-field"><%=luci.tools.webadmin.iface_get_network(v.dev) or '(' .. v.dev .. ')'%></div>
+ <div class="td cbi-value-field"><%=v.dest%></div>
+ <div class="td cbi-value-field"><%=v.from%></div>
+ <div class="td cbi-value-field"><%=v.metric or 0%></div>
+ <div class="td cbi-value-field"><%=rtn[v.table] or v.table%></div>
+ </div>
<%
style = not style
end
end
%>
- </table>
+ </div>
</div>
</fieldset>
<br />
@@ -132,27 +132,27 @@
<legend><%:IPv6 Neighbours%></legend>
<div class="cbi-section-node">
- <table class="cbi-section-table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:IPv6-Address%></th>
- <th class="cbi-section-table-cell"><%:MAC-Address%></th>
- <th class="cbi-section-table-cell"><%:Interface%></th>
- </tr>
+ <div class="table cbi-section-table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:IPv6-Address%></div>
+ <div class="th cbi-section-table-cell"><%:MAC-Address%></div>
+ <div class="th cbi-section-table-cell"><%:Interface%></div>
+ </div>
<%
for _, v in ipairs(ip.neighbors({ family = 6 })) do
if v.dest and not v.dest:is6linklocal() and v.mac then
%>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=(style and 1 or 2)%>">
- <td class="cbi-value-field"><%=v.dest%></td>
- <td class="cbi-value-field"><%=v.mac%></td>
- <td class="cbi-value-field"><%=luci.tools.webadmin.iface_get_network(v.dev) or '(' .. v.dev .. ')'%></td>
- </tr>
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=(style and 1 or 2)%>">
+ <div class="td cbi-value-field"><%=v.dest%></div>
+ <div class="td cbi-value-field"><%=v.mac%></div>
+ <div class="td cbi-value-field"><%=luci.tools.webadmin.iface_get_network(v.dev) or '(' .. v.dev .. ')'%></div>
+ </div>
<%
style = not style
end
end
%>
- </table>
+ </div>
</div>
</fieldset>
<br />
diff --git a/modules/luci-mod-admin-full/luasrc/view/admin_status/wireless.htm b/modules/luci-mod-admin-full/luasrc/view/admin_status/wireless.htm
index aa658ff0cb..4211b26471 100644
--- a/modules/luci-mod-admin-full/luasrc/view/admin_status/wireless.htm
+++ b/modules/luci-mod-admin-full/luasrc/view/admin_status/wireless.htm
@@ -325,28 +325,28 @@
<div style="text-align:right"><small id="scale">-</small></div>
<br />
-<table style="width:100%; table-layout:fixed" cellspacing="5">
- <tr>
- <td style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid blue"><%:Signal:%></strong></td>
- <td id="rssi_bw_cur">0 <%:dBm%></td>
+<div class="table" style="width:100%; table-layout:fixed" cellspacing="5">
+ <div class="tr">
+ <div class="td" style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid blue"><%:Signal:%></strong></div>
+ <div class="td" id="rssi_bw_cur">0 <%:dBm%></div>
- <td style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></td>
- <td id="rssi_bw_avg">0 <%:dBm%></td>
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></div>
+ <div class="td" id="rssi_bw_avg">0 <%:dBm%></div>
- <td style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></td>
- <td id="rssi_bw_peak">0 <%:dBm%></td>
- </tr>
- <tr>
- <td style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid red"><%:Noise:%></strong></td>
- <td id="noise_bw_cur">0 <%:dBm%></td>
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></div>
+ <div class="td" id="rssi_bw_peak">0 <%:dBm%></div>
+ </div>
+ <div class="tr">
+ <div class="td" style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid red"><%:Noise:%></strong></div>
+ <div class="td" id="noise_bw_cur">0 <%:dBm%></div>
- <td style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></td>
- <td id="noise_bw_avg">0 <%:dBm%></td>
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></div>
+ <div class="td" id="noise_bw_avg">0 <%:dBm%></div>
- <td style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></td>
- <td id="noise_bw_peak">0 <%:dBm%></td>
- </tr>
-</table>
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></div>
+ <div class="td" id="noise_bw_peak">0 <%:dBm%></div>
+ </div>
+</div>
<br />
@@ -354,17 +354,17 @@
<div style="text-align:right"><small id="scale2">-</small></div>
<br />
-<table style="width:100%; table-layout:fixed" cellspacing="5">
- <tr>
- <td style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid green"><%:Phy Rate:%></strong></td>
- <td id="rate_bw_cur">0 MBit/s</td>
+<div class="table" style="width:100%; table-layout:fixed" cellspacing="5">
+ <div class="tr">
+ <div class="td" style="text-align:right; vertical-align:top"><strong style="border-bottom:2px solid green"><%:Phy Rate:%></strong></div>
+ <div class="td" id="rate_bw_cur">0 MBit/s</div>
- <td style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></td>
- <td id="rate_bw_avg">0 MBit/s</td>
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Average:%></strong></div>
+ <div class="td" id="rate_bw_avg">0 MBit/s</div>
- <td style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></td>
- <td id="rate_bw_peak">0 MBit/s</td>
- </tr>
-</table>
+ <div class="td" style="text-align:right; vertical-align:top"><strong><%:Peak:%></strong></div>
+ <div class="td" id="rate_bw_peak">0 MBit/s</div>
+ </div>
+</div>
<%+footer%>
diff --git a/modules/luci-mod-admin-full/luasrc/view/admin_system/packages.htm b/modules/luci-mod-admin-full/luasrc/view/admin_system/packages.htm
index 88e0fffd9c..4944a232b2 100644
--- a/modules/luci-mod-admin-full/luasrc/view/admin_system/packages.htm
+++ b/modules/luci-mod-admin-full/luasrc/view/admin_system/packages.htm
@@ -128,34 +128,34 @@ end
<% if display ~= "available" then %>
<fieldset class="cbi-section">
- <table class="cbi-section-table" style="width:100%">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell" style="text-align:left">&#160;</th>
- <th class="cbi-section-table-cell" style="text-align:left"><%:Package name%></th>
- <th class="cbi-section-table-cell" style="text-align:left"><%:Version%></th>
- </tr>
+ <div class="table cbi-section-table" style="width:100%">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell" style="text-align:left">&#160;</div>
+ <div class="th cbi-section-table-cell" style="text-align:left"><%:Package name%></div>
+ <div class="th cbi-section-table-cell" style="text-align:left"><%:Version%></div>
+ </div>
<% local empty = true; luci.model.ipkg.list_installed(querypat, function(n, v, s, d) empty = false; filter[n] = true %>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=rowstyle()%>">
- <td style="text-align:left; width:10%">
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=rowstyle()%>">
+ <div class="td" style="text-align:left; width:10%">
<form method="post" class="inline" action="<%=REQUEST_URI%>">
<input type="hidden" name="exec" value="1" />
<input type="hidden" name="token" value="<%=token%>" />
<input type="hidden" name="remove" value="<%=pcdata(n)%>" />
<a onclick="window.confirm('<%:Remove%> &quot;<%=luci.util.pcdata(n)%>&quot; ?') &#38;&#38; this.parentNode.submit(); return false" href="#"><%:Remove%></a>
</form>
- </td>
- <td style="text-align:left"><%=luci.util.pcdata(n)%></td>
- <td style="text-align:left"><%=luci.util.pcdata(v)%></td>
- </tr>
+ </div>
+ <div class="td" style="text-align:left"><%=luci.util.pcdata(n)%></div>
+ <div class="td" style="text-align:left"><%=luci.util.pcdata(v)%></div>
+ </div>
<% end) %>
<% if empty then %>
- <tr class="cbi-section-table-row">
- <td style="text-align:left">&#160;</td>
- <td style="text-align:left"><em><%:none%></em></td>
- <td style="text-align:left"><em><%:none%></em></td>
- </tr>
+ <div class="tr cbi-section-table-row">
+ <div class="td" style="text-align:left">&#160;</div>
+ <div class="td" style="text-align:left"><em><%:none%></em></div>
+ <div class="td" style="text-align:left"><em><%:none%></em></div>
+ </div>
<% end %>
- </table>
+ </div>
</fieldset>
<% else %>
<fieldset class="cbi-section">
@@ -168,40 +168,40 @@ end
</ul>
<div class="cbi-section-node">
<% end %>
- <table class="cbi-section-table" style="width:100%">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell" style="text-align:left">&#160;</th>
- <th class="cbi-section-table-cell" style="text-align:left"><%:Package name%></th>
- <th class="cbi-section-table-cell" style="text-align:left"><%:Version%></th>
- <th class="cbi-section-table-cell" style="text-align:right"><%:Size (.ipk)%></th>
- <th class="cbi-section-table-cell" style="text-align:left"><%:Description%></th>
- </tr>
+ <div class="table cbi-section-table" style="width:100%">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell" style="text-align:left">&#160;</div>
+ <div class="th cbi-section-table-cell" style="text-align:left"><%:Package name%></div>
+ <div class="th cbi-section-table-cell" style="text-align:left"><%:Version%></div>
+ <div class="th cbi-section-table-cell" style="text-align:right"><%:Size (.ipk)%></div>
+ <div class="th cbi-section-table-cell" style="text-align:left"><%:Description%></div>
+ </div>
<% local empty = true; opkg_list(querypat or letterpat, function(n, v, s, d) if filter[n] then return end; empty = false %>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=rowstyle()%>">
- <td style="text-align:left; width:10%">
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=rowstyle()%>">
+ <div class="td" style="text-align:left; width:10%">
<form method="post" class="inline" action="<%=REQUEST_URI%>">
<input type="hidden" name="exec" value="1" />
<input type="hidden" name="token" value="<%=token%>" />
<input type="hidden" name="install" value="<%=pcdata(n)%>" />
<a onclick="window.confirm('<%:Install%> &quot;<%=luci.util.pcdata(n)%>&quot; ?') &#38;&#38; this.parentNode.submit(); return false" href="#"><%:Install%></a>
</form>
- </td>
- <td style="text-align:left"><%=luci.util.pcdata(n)%></td>
- <td style="text-align:left"><%=luci.util.pcdata(v)%></td>
- <td style="text-align:right"><%=luci.util.pcdata(s)%></td>
- <td style="text-align:left"><%=luci.util.pcdata(d)%></td>
- </tr>
+ </div>
+ <div class="td" style="text-align:left"><%=luci.util.pcdata(n)%></div>
+ <div class="td" style="text-align:left"><%=luci.util.pcdata(v)%></div>
+ <div class="td" style="text-align:right"><%=luci.util.pcdata(s)%></div>
+ <div class="td" style="text-align:left"><%=luci.util.pcdata(d)%></div>
+ </div>
<% end) %>
<% if empty then %>
- <tr class="cbi-section-table-row">
- <td style="text-align:left">&#160;</td>
- <td style="text-align:left"><em><%:none%></em></td>
- <td style="text-align:left"><em><%:none%></em></td>
- <td style="text-align:right"><em><%:none%></em></td>
- <td style="text-align:left"><em><%:none%></em></td>
- </tr>
+ <div class="tr cbi-section-table-row">
+ <div class="td" style="text-align:left">&#160;</div>
+ <div class="td" style="text-align:left"><em><%:none%></em></div>
+ <div class="td" style="text-align:left"><em><%:none%></em></div>
+ <div class="td" style="text-align:right"><em><%:none%></em></div>
+ <div class="td" style="text-align:left"><em><%:none%></em></div>
+ </div>
<% end %>
- </table>
+ </div>
<% if not querypat then %>
</div>
<% end %>
diff --git a/modules/luci-mod-freifunk/luasrc/view/freifunk/contact.htm b/modules/luci-mod-freifunk/luasrc/view/freifunk/contact.htm
index 1add595c6c..dca35376cb 100644
--- a/modules/luci-mod-freifunk/luasrc/view/freifunk/contact.htm
+++ b/modules/luci-mod-freifunk/luasrc/view/freifunk/contact.htm
@@ -31,33 +31,33 @@ end
<fieldset xmlns="http://www.w3.org/1999/xhtml" class="cbi-section">
<legend><%:Operator%></legend>
- <table cellspacing="10" width="100%" style="text-align:left">
- <tr><th width="33%"><%:Nickname%>:</th><td><%=nickname%></td></tr>
- <tr><th width="33%"><%:Realname%>:</th><td><%=name%></td></tr>
- <tr><th width="33%"><%:Homepage%>:</th><td>
+ <div class="table" cellspacing="10" width="100%" style="text-align:left">
+ <div class="tr"><div class="th" width="33%"><%:Nickname%>:</div><div class="td"><%=nickname%></div></div>
+ <div class="tr"><div class="th" width="33%"><%:Realname%>:</div><div class="td"><%=name%></div></div>
+ <div class="tr"><div class="th" width="33%"><%:Homepage%>:</div><div class="td">
<% for k, v in ipairs(homepage) do %>
<a href="<%=v%>"><%=v%></a><br />
<% end %>
- </td></tr>
- <tr><th width="33%"><%:E-Mail%>:</th><td><a href="mailto:<%=mail%>"><%=mail%></a></td></tr>
- <tr><th width="33%"><%:Phone%>:</th><td><%=phone%></td></tr>
- </table>
+ </div></div>
+ <div class="tr"><div class="th" width="33%"><%:E-Mail%>:</div><div class="td"><a href="mailto:<%=mail%>"><%=mail%></a></div></div>
+ <div class="tr"><div class="th" width="33%"><%:Phone%>:</div><div class="td"><%=phone%></div></div>
+ </div>
</fieldset>
<fieldset xmlns="http://www.w3.org/1999/xhtml" class="cbi-section">
<legend><%:Location%></legend>
- <table cellspacing="10" width="100%" style="text-align:left">
- <tr><th width="33%"><%:Location%>:</th><td><%=location%></td></tr>
- <tr><th width="33%"><%:Coordinates%>:</th><td><%=lat%> <%=lon%> (<a href="<%=pcdata(luci.dispatcher.build_url("freifunk/map"))%>"><%:Show on map%>)</a></td></tr>
- </table>
+ <div class="table" cellspacing="10" width="100%" style="text-align:left">
+ <div class="tr"><div class="th" width="33%"><%:Location%>:</div><div class="td"><%=location%></div></div>
+ <div class="tr"><div class="th" width="33%"><%:Coordinates%>:</div><div class="td"><%=lat%> <%=lon%> (<a href="<%=pcdata(luci.dispatcher.build_url("freifunk/map"))%>"><%:Show on map%>)</a></div></div>
+ </div>
</fieldset>
<% if note then %>
<fieldset xmlns="http://www.w3.org/1999/xhtml" class="cbi-section">
<legend><%:Notice%></legend>
- <table cellspacing="10" width="100%" style="text-align:left">
- <tr><td><%=note%></td></tr>
- </table>
+ <div class="table" cellspacing="10" width="100%" style="text-align:left">
+ <div class="tr"><div class="td"><%=note%></div></div>
+ </div>
</fieldset>
<%end%>
diff --git a/modules/luci-mod-freifunk/luasrc/view/freifunk/public_status.htm b/modules/luci-mod-freifunk/luasrc/view/freifunk/public_status.htm
index 1dc1d8b0d1..a71926141b 100644
--- a/modules/luci-mod-freifunk/luasrc/view/freifunk/public_status.htm
+++ b/modules/luci-mod-freifunk/luasrc/view/freifunk/public_status.htm
@@ -246,17 +246,17 @@ end
<div class="cbi-section">
<div class="cbi-section-node">
- <table class="cbi-section-table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Signal%></th>
- <th class="cbi-section-table-cell"><%:Bitrate%></th>
- <th class="cbi-section-table-cell"><%:SSID%></th>
- <th class="cbi-section-table-cell"><%:BSSID%></th>
- <th class="cbi-section-table-cell"><%:Channel%></th>
- <th class="cbi-section-table-cell"><%:Mode%></th>
- <th class="cbi-section-table-cell"><%:TX%>-<%:Power%></th>
- <th class="cbi-section-table-cell"><%:Interface%></th>
- </tr>
+ <div class="table cbi-section-table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:Signal%></div>
+ <div class="th cbi-section-table-cell"><%:Bitrate%></div>
+ <div class="th cbi-section-table-cell"><%:SSID%></div>
+ <div class="th cbi-section-table-cell"><%:BSSID%></div>
+ <div class="th cbi-section-table-cell"><%:Channel%></div>
+ <div class="th cbi-section-table-cell"><%:Mode%></div>
+ <div class="th cbi-section-table-cell"><%:TX%>-<%:Power%></div>
+ <div class="th cbi-section-table-cell"><%:Interface%></div>
+ </div>
<%
for _, dev in ipairs(devices) do
local net
@@ -301,20 +301,20 @@ end
end
local interface = net.iwinfo.ifname or "N/A"
%>
- <tr class="cbi-section-table-row cbi-rowstyle-1">
- <td class="cbi-value-field" id="<%=net:ifname()%>-signal"><%=signal_string%></td>
- <td class="cbi-value-field" id="<%=net:ifname()%>-bitrate"><%=bitrate%></td>
- <td class="cbi-value-field" id="<%=net:ifname()%>-ssid"><%=ssid%></td>
- <td class="cbi-value-field" id="<%=net:ifname()%>-bssid"><%=bssid%></td>
- <td class="cbi-value-field" id="<%=net:ifname()%>-channel"><%=chan%></td>
- <td class="cbi-value-field" id="<%=net:ifname()%>-mode"><%=mode%></td>
- <td class="cbi-value-field" id="<%=net:ifname()%>-txpower"><%=txpwr%></td>
- <td class="cbi-value-field"><%=interface%></td>
- </tr>
+ <div class="tr cbi-section-table-row cbi-rowstyle-1">
+ <div class="td cbi-value-field" id="<%=net:ifname()%>-signal"><%=signal_string%></div>
+ <div class="td cbi-value-field" id="<%=net:ifname()%>-bitrate"><%=bitrate%></div>
+ <div class="td cbi-value-field" id="<%=net:ifname()%>-ssid"><%=ssid%></div>
+ <div class="td cbi-value-field" id="<%=net:ifname()%>-bssid"><%=bssid%></div>
+ <div class="td cbi-value-field" id="<%=net:ifname()%>-channel"><%=chan%></div>
+ <div class="td cbi-value-field" id="<%=net:ifname()%>-mode"><%=mode%></div>
+ <div class="td cbi-value-field" id="<%=net:ifname()%>-txpower"><%=txpwr%></div>
+ <div class="td cbi-value-field"><%=interface%></div>
+ </div>
<% end
end
end %>
- </table>
+ </div>
</div>
</div>
</div>
@@ -328,35 +328,35 @@ end
<% if not def4 and not def6 then %>
<%:No default routes known.%>
<%else%>
- <table class="cbi-section-table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Network%></th>
- <th class="cbi-section-table-cell"><%:Interface%></th>
- <th class="cbi-section-table-cell"><%:Gateway%></th>
- <th class="cbi-section-table-cell"><%:Metric%></th>
- </tr>
+ <div class="table cbi-section-table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:Network%></div>
+ <div class="th cbi-section-table-cell"><%:Interface%></div>
+ <div class="th cbi-section-table-cell"><%:Gateway%></div>
+ <div class="th cbi-section-table-cell"><%:Metric%></div>
+ </div>
<% if def4 then %>
- <tr class="cbi-section-table-row cbi-rowstyle-1">
- <td class="cbi-value-field" id="v4dst"><%=def4.dest%></td>
- <td class="cbi-value-field" id="v4dev"><%=def4.dev%></td>
- <td class="cbi-value-field" id="v4gw"><%=def4.gateway%></td>
- <td class="cbi-value-field" id="v4metr"><%=def4.metr%></td>
- </tr>
+ <div class="tr cbi-section-table-row cbi-rowstyle-1">
+ <div class="td cbi-value-field" id="v4dst"><%=def4.dest%></div>
+ <div class="td cbi-value-field" id="v4dev"><%=def4.dev%></div>
+ <div class="td cbi-value-field" id="v4gw"><%=def4.gateway%></div>
+ <div class="td cbi-value-field" id="v4metr"><%=def4.metr%></div>
+ </div>
<% end
if def6 then %>
- <tr class="cbi-section-table-row cbi-rowstyle-2">
- <td class="cbi-value-field" id="v6dst"><%=def6.dest%></td>
- <td class="cbi-value-field" id="v6dev"><%=def6.dev%></td>
- <td class="cbi-value-field" id="v6gw"><%=def6.gateway%></td>
- <td class="cbi-value-field" id="v6metr"><%=def6.metr%></td>
- </tr>
+ <div class="tr cbi-section-table-row cbi-rowstyle-2">
+ <div class="td cbi-value-field" id="v6dst"><%=def6.dest%></div>
+ <div class="td cbi-value-field" id="v6dev"><%=def6.dev%></div>
+ <div class="td cbi-value-field" id="v6gw"><%=def6.gateway%></div>
+ <div class="td cbi-value-field" id="v6metr"><%=def6.metr%></div>
+ </div>
<% end %>
- </table>
+ </div>
<% end %>
</div>
</div>