<%- end %>
<div class="cbi-section-descr"><%=self.description%></div>
<div class="cbi-section-node">
- <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 self.sectionhead then -%>
- <th class="cbi-section-table-cell"><%=self.sectionhead%></th>
+ <div class="th cbi-section-table-cell"><%=self.sectionhead%></div>
<%- else -%>
- <th> </th>
+ <div class="th"> </div>
<%- end -%>
<%- for i, k in pairs(self.children) do -%>
- <th class="cbi-section-table-cell"<%=width(k)%>>
+ <div class="th cbi-section-table-cell"<%=width(k)%>>
<%-=k.title-%>
- </th>
+ </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" id="cbi-<%=self.config%>-<%=section%>">
- <th><%=k%></th>
+ <div class="tr cbi-section-table-row" id="cbi-<%=self.config%>-<%=section%>">
+ <div class="th"><%=k%></div>
<%-
for k, node in ipairs(self.children) do
node:render(section, scope or {})
end
if not scope.cbid:match("adb_src_cat") then
-%>
- <td class="cbi-value-field"> </td>
+ <div class="td cbi-value-field"> </div>
<%- end -%>
- </tr>
+ </div>
<%- end -%>
- </table>
+ </div>
</div>
</fieldset>
<%- if device_name then -%>
<fieldset class="cbi-section">
<legend><%=device_name%><%: Partitions%></legend>
- <table class="cbi-section-table" id="partitions">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Partition%></th>
- <th class="cbi-section-table-cell"><%:Status%></th>
- <th class="cbi-section-table-cell"><%:Firmware/OS (Kernel)%></th>
- <th class="cbi-section-table-cell"><%:Action%></th>
- </tr>
- <tr class="cbi-section-table-row">
- <td>
+ <div class="table cbi-section-table" id="partitions">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:Partition%></div>
+ <div class="th cbi-section-table-cell"><%:Status%></div>
+ <div class="th cbi-section-table-cell"><%:Firmware/OS (Kernel)%></div>
+ <div class="th cbi-section-table-cell"><%:Action%></div>
+ </div>
+ <div class="tr cbi-section-table-row">
+ <div class="td">
<%=string.format("%X", boot_envvar1_partition_one)%>
- </td>
- <td>
+ </div>
+ <div class="td">
<%- if boot_envvar1_partition_one == current_partition then -%><%:Current%><%- else -%><%:Alternative%><%- end -%>
- </td>
- <td>
+ </div>
+ <div class="td">
<%=partition_one_os%>
- </td>
- <td>
+ </div>
+ <div class="td">
<%- if boot_envvar1_partition_one == current_partition then -%>
<form method="post" action="<%=url('admin/system/advanced_reboot/reboot')%>">
<input type="hidden" name="token" value="<%=token%>" />
<input id="altreboot-button" type="submit" class="cbi-button cbi-button-apply" value="<%:Reboot to alternative partition...%>" />
</form>
<%- end -%>
- </td>
- </tr>
- <tr class="cbi-section-table-row">
- <td>
+ </div>
+ </div>
+ <div class="tr cbi-section-table-row">
+ <div class="td">
<%=string.format("%X", boot_envvar1_partition_two)%>
- </td>
- <td>
+ </div>
+ <div class="td">
<%- if boot_envvar1_partition_two == current_partition then -%><%:Current%><%- else -%><%:Alternative%><%- end -%>
- </td>
- <td>
+ </div>
+ <div class="td">
<%=partition_two_os%>
- </td>
- <td>
+ </div>
+ <div class="td">
<%- if boot_envvar1_partition_two == current_partition then -%>
<form method="post" action="<%=url('admin/system/advanced_reboot/reboot')%>">
<input type="hidden" name="token" value="<%=token%>" />
<input id="altreboot-button" type="submit" class="cbi-button cbi-button-apply" value="<%:Reboot to alternative partition...%>" />
</form>
<%- end -%>
- </td>
- </tr>
- </table>
+ </div>
+ </div>
+ </div>
</fieldset>
<%- else -%>
<p class="alert-message warning"><%:Warning: This system does not have two partitions!%></p>
if (st && tb && tx)
{
/* 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.leases.length; i++ )
+ for (var i = 0; i < st.leases.length; i++)
{
- var tr = tb.insertRow(-1);
- tr.className = 'cbi-section-table-row cbi-rowstyle-' + ((i % 2) + 1);
-
- tr.insertCell(-1).innerHTML = st.leases[i].addr;
- tr.insertCell(-1).innerHTML = String.format('%t', st.leases[i].age);
+ tb.appendChild(E('<div class="tr cbi-section-table-row cbi-rowstyle-%d">'.format((i % 2) + 1), [
+ E('<div class="td">', st.leases[i].addr),
+ E('<div class="td">', '%t'.format(st.leases[i].age))
+ ]));
}
- if( tb.rows.length == 1 )
- {
- var tr = tb.insertRow(-1);
- tr.className = 'cbi-section-table-row';
-
- var td = tr.insertCell(-1);
- td.colSpan = 2;
- 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>'));
- if( st.uid == '00:00:00:00:00:00:00:00' )
+ if (st.uid == '00:00:00:00:00:00:00:00')
tx.innerHTML = '<%:The AHCP Service is not running.%>';
else
tx.innerHTML = String.format('<%:The AHCP Service is running with ID %s.%>', st.uid);
<fieldset class="cbi-section">
<legend><%:Active AHCP Leases%></legend>
<p id="ahcpd_status_text"></p>
- <table class="cbi-section-table" id="ahcpd_status_table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Address%></th>
- <th class="cbi-section-table-cell"><%:Age%></th>
- </tr>
- <tr class="cbi-section-table-row">
- <td colspan="5"><em><br /><%:Collecting data...%></em></td>
- </tr>
- </table>
+ <div class="table cbi-section-table" id="ahcpd_status_table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:Address%></div>
+ <div class="th cbi-section-table-cell"><%:Age%></div>
+ </div>
+ <div class="tr cbi-section-table-row">
+ <div class="td" colspan="5"><em><br /><%:Collecting data...%></em></div>
+ </div>
+ </div>
</fieldset>
<% for i, plan in pairs(ast.dialplan.plans()) do %>
<div class="cbi-section-node">
- <table class="cbi-section-table">
- <tr class="cbi-section-table-titles">
- <th style="text-align: left; padding: 3px" class="cbi-section-table-cell">
+ <div class="table cbi-section-table">
+ <div class="tr cbi-section-table-titles">
+ <div style="text-align: left; padding: 3px" class="th cbi-section-table-cell">
<big>Dialplan <em><%=plan.name%></em></big>
- </th>
- <td>
+ </div>
+ <div class="td">
<a href="<%=url('admin/asterisk/dialplans')%>?delplan=<%=plan.name%>">
<img style="border:none" alt="Remove this dialplan" title="Remove this dialplan" src="/luci-static/resources/cbi/remove.gif" />
</a>
- </td>
- </tr>
+ </div>
+ </div>
<!-- dialzones -->
<% local zones_used = { }; local row = 0 %>
<% for i, zone in ipairs(plan.zones) do zones_used[zone.name] = true %>
- <tr class="cbi-section-table-row <%=rowstyle(row)%>">
- <td style="text-align: left; padding: 3px" class="cbi-section-table-cell">
+ <div class="tr cbi-section-table-row <%=rowstyle(row)%>">
+ <div style="text-align: left; padding: 3px" class="td cbi-section-table-cell">
<strong>└ Dialzone <em><%=zone.name%></em></strong> (<%=zone.description%>)
<p style="padding-left: 1em; margin-bottom:0">
Lines:
Matches:
<%=format_matches(zone)%>
</p>
- </td>
- <td style="width:5%" class="cbi-value-field">
+ </div>
+ <div style="width:5%" class="td cbi-value-field">
<a href="<%=url('admin/asterisk/dialplans/out', zone.name)%>">
<img style="border:none" alt="Edit dialzone" title="Edit dialzone" src="/luci-static/resources/cbi/edit.gif" />
</a>
<a href="<%=url('admin/asterisk/dialplans')%>?delzone.<%=plan.name%>=<%=zone.name%>">
<img style="border:none" alt="Remove from this dialplan" title="Remove from this dialplan" src="/luci-static/resources/cbi/remove.gif" />
</a>
- </td>
- </tr>
+ </div>
+ </div>
<% row = row + 1; end %>
<!-- /dialzones -->
<!-- voicemail -->
<% local boxes_used = { } %>
<% for ext, box in luci.util.kspairs(plan.voicemailboxes) do boxes_used[box.id] = true %>
- <tr class="cbi-section-table-row <%=rowstyle(row)%>">
- <td style="text-align: left; padding: 3px" class="cbi-section-table-cell">
+ <div class="tr cbi-section-table-row <%=rowstyle(row)%>">
+ <div style="text-align: left; padding: 3px" class="td cbi-section-table-cell">
<strong>└ Voicemailbox <em><%=box.id%></em></strong> (<%=box.name%>)
<p style="padding-left: 1em; margin-bottom:0">
Owner: <%=box.name%> |
Pager: <%=#box.page > 0 and box.page or 'n/a'%><br />
Matches: <%=format_matches(ext)%>
</p>
- </td>
- <td style="width:5%" class="cbi-value-field">
+ </div>
+ <div style="width:5%" class="td cbi-value-field">
<a href="<%=url('admin/asterisk/voicemail/mailboxes')%>">
<img style="border:none" alt="Manage mailboxes ..." title="Manage mailboxes ..." src="/luci-static/resources/cbi/edit.gif" />
</a>
<a href="<%=url('admin/asterisk/dialplans')%>?delvbox.<%=plan.name%>=<%=ext%>">
<img style="border:none" alt="Remove from this dialplan" title="Remove from this dialplan" src="/luci-static/resources/cbi/remove.gif" />
</a>
- </td>
- </tr>
+ </div>
+ </div>
<% row = row + 1; end %>
<!-- /voicemail -->
<!-- meetme -->
<% local rooms_used = { } %>
<% for ext, room in luci.util.kspairs(plan.meetmerooms) do rooms_used[room.room] = true %>
- <tr class="cbi-section-table-row <%=rowstyle(row)%>">
- <td style="text-align: left; padding: 3px" class="cbi-section-table-cell">
+ <div class="tr cbi-section-table-row <%=rowstyle(row)%>">
+ <div style="text-align: left; padding: 3px" class="td cbi-section-table-cell">
<strong>└ MeetMe Room <em><%=room.room%></em></strong>
<% if room.description and #room.description > 0 then %> (<%=room.description%>)<% end %>
<p style="padding-left: 1em; margin-bottom:0">
Matches: <%=format_matches(ext)%>
</p>
- </td>
- <td style="width:5%" class="cbi-value-field">
+ </div>
+ <div style="width:5%" class="td cbi-value-field">
<a href="<%=url('admin/asterisk/meetme/rooms')%>">
<img style="border:none" alt="Manage conferences ..." title="Manage conferences ..." src="/luci-static/resources/cbi/edit.gif" />
</a>
<a href="<%=url('admin/asterisk/dialplans')%>?delmeetme.<%=plan.name%>=<%=ext%>">
<img style="border:none" alt="Remove from this dialplan" title="Remove from this dialplan" src="/luci-static/resources/cbi/remove.gif" />
</a>
- </td>
- </tr>
+ </div>
+ </div>
<% row = row + 1; end %>
<!-- /meetme -->
- <tr class="cbi-section-table-row">
- <td style="text-align: left; padding: 3px" class="cbi-section-table-cell" colspan="2">
+ <div class="tr cbi-section-table-row">
+ <div style="text-align: left; padding: 3px" class="td cbi-section-table-cell" colspan="2">
<hr style="margin-bottom:0.5em; border-width:0 0 1px 0" />
Add Dialzone:<br />
<br /><br />
<input type="submit" class="cbi-button cbi-button-add" value="Add item »" title="Add item ..."/>
- </td>
- </tr>
+ </div>
+ </div>
- </table>
+ </div>
<div class="cbi-section-create cbi-tblsection-create"></div>
</div>
<!-- tblsection -->
<fieldset class="cbi-section" id="cbi-asterisk-sip">
<div class="cbi-section-node">
- <table class="cbi-section-table">
- <tr class="cbi-section-table-titles">
- <th style="text-align: left; padding: 3px" class="cbi-section-table-cell" colspan="6">
+ <div class="table cbi-section-table">
+ <div class="tr cbi-section-table-titles">
+ <div style="text-align: left; padding: 3px" class="th cbi-section-table-cell" colspan="6">
<h3>Dialzone Overview</h3>
- </th>
- </tr>
-
- <tr class="cbi-section-table-descr">
- <th style="width: 5%; text-align:right" class="cbi-section-table-cell">Name</th>
- <th style="width: 5%; text-align:right" class="cbi-section-table-cell">Prepend</th>
- <th style="width: 20%; text-align:left" class="cbi-section-table-cell">- Match</th>
- <th style="text-align:left" class="cbi-section-table-cell">Trunk</th>
- <th style="width: 35%; text-align:left" class="cbi-section-table-cell">Description</th>
- <th style="width: 4%; text-align:left" class="cbi-section-table-cell"></th>
- </tr>
+ </div>
+ </div>
+
+ <div class="tr cbi-section-table-descr">
+ <div style="width: 5%; text-align:right" class="th cbi-section-table-cell">Name</div>
+ <div style="width: 5%; text-align:right" class="th cbi-section-table-cell">Prepend</div>
+ <div style="width: 20%; text-align:left" class="th cbi-section-table-cell">- Match</div>
+ <div style="text-align:left" class="th cbi-section-table-cell">Trunk</div>
+ <div style="width: 35%; text-align:left" class="th cbi-section-table-cell">Description</div>
+ <div style="width: 4%; text-align:left" class="th cbi-section-table-cell"></div>
+ </div>
<% for i, rule in pairs(ast.dialzone.zones()) do %>
- <tr class="cbi-section-table-row <%=rowstyle(i)%>">
- <td style="text-align:right" class="cbi-value-field">
+ <div class="tr cbi-section-table-row <%=rowstyle(i)%>">
+ <div style="text-align:right" class="td cbi-value-field">
<%=rule.name%>
- </td>
- <td style="text-align:right" class="cbi-value-field">
+ </div>
+ <div style="text-align:right" class="td cbi-value-field">
<% for _ in ipairs(rule.matches) do %>
<%=rule.addprefix and digit_pattern(rule.addprefix)%> <br />
<% end %>
- </td>
- <td style="text-align:left" class="cbi-value-field">
+ </div>
+ <div style="text-align:left" class="td cbi-value-field">
<% for _, m in ipairs(rule.matches) do %>
<%=rule.localprefix and "%s " % digit_pattern(rule.localprefix)%>
<%=digit_pattern(m)%><br />
<% end %>
- </td>
- <td style="text-align:left" class="cbi-value-field">
+ </div>
+ <div style="text-align:left" class="td cbi-value-field">
<%=ast.tools.hyperlinks(
rule.trunks, function(v)
return luci.dispatcher.build_url("admin", "asterisk", "trunks", "%s") % v:lower()
end
)%>
- </td>
- <td style="text-align:left" class="cbi-value-field">
+ </div>
+ <div style="text-align:left" class="td cbi-value-field">
<%=rule.description or rule.name%>
- </td>
- <td style="text-align:left" class="cbi-value-field">
+ </div>
+ <div style="text-align:left" class="td cbi-value-field">
<a href="<%=url('admin/asterisk/dialplans/out', rule.name)%>">
<img style="border:none" alt="Edit entry" title="Edit entry" src="/luci-static/resources/cbi/edit.gif" />
</a>
<a href="<%=url('admin/asterisk/dialplans/zones')%>?delzone=<%=rule.name%>">
<img style="border:none" alt="Delete entry" title="Delete entry" src="/luci-static/resources/cbi/remove.gif" />
</a>
- </td>
- </tr>
+ </div>
+ </div>
<% end %>
- </table>
+ </div>
<div class="cbi-section-create cbi-tblsection-create"></div>
</div>
<br />
<br /><span style="color:red">Invalid name given!</span><br />
<% end -%>
- <table>
- <tr>
- <td style="padding:3px">
+ <div class="table">
+ <div class="tr">
+ <div class="td" style="padding:3px">
<label for="create1">1) Name</label><br />
<input type="text" class="cbi-section-create-name" id="create1" name="newzone_name" style="width:200px" />
<br /><br />
<label for="create2">2) Number Match</label><br />
<input type="text" class="cbi-section-create-name" id="create2" name="newzone_match" style="width:200px" />
- </td>
- <td style="padding:3px">
+ </div>
+ <div class="td" style="padding:3px">
<label for="create3">3) Trunks</label><br />
<select class="cbi-input-select" multiple="multiple" id="create3" name="newzone_uses" size="4" style="width:200px">
<% for i, t in ipairs(find_trunks()) do %>
<option value="<%=t[1]%>"><%=t[2]%></option>
<% end %>
</select>
- </td>
- </tr>
- </table>
+ </div>
+ </div>
+ </div>
<br />
<input type="submit" class="cbi-button cbi-button-add" name="newzone" value="Add entry" title="Add entry"/>
-%>
<div class="cbi-section-create cbi-tblsection-create">
<br />
- <table class="cbi-section-table" style="width:810px; margin-left:5px">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell" colspan="8"><%:New port forward%>:</th>
- </tr>
- <tr class="cbi-section-table-descr">
- <th class="cbi-section-table-cell"><%:Name%></th>
- <th class="cbi-section-table-cell"><%:Protocol%></th>
- <th class="cbi-section-table-cell"><%:External zone%></th>
- <th class="cbi-section-table-cell"><%:External port%></th>
- <th class="cbi-section-table-cell"><%:Internal zone%></th>
- <th class="cbi-section-table-cell"><%:Internal IP address%></th>
- <th class="cbi-section-table-cell"><%:Internal port%></th>
- <th class="cbi-section-table-cell"></th>
- </tr>
- <tr class="cbi-section-table-row">
- <td class="cbi-section-table-cell">
+ <div class="table cbi-section-table" style="width:810px; margin-left:5px">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell" colspan="8"><%:New port forward%>:</div>
+ </div>
+ <div class="tr cbi-section-table-descr">
+ <div class="th cbi-section-table-cell"><%:Name%></div>
+ <div class="th cbi-section-table-cell"><%:Protocol%></div>
+ <div class="th cbi-section-table-cell"><%:External zone%></div>
+ <div class="th cbi-section-table-cell"><%:External port%></div>
+ <div class="th cbi-section-table-cell"><%:Internal zone%></div>
+ <div class="th cbi-section-table-cell"><%:Internal IP address%></div>
+ <div class="th cbi-section-table-cell"><%:Internal port%></div>
+ <div class="th cbi-section-table-cell"></div>
+ </div>
+ <div class="tr cbi-section-table-row">
+ <div class="td cbi-section-table-cell">
<input type="text" class="cbi-input-text" id="_newfwd.name" name="_newfwd.name" placeholder="<%:New port forward%>" />
- </td>
- <td class="cbi-section-table-cell" style="width:110px">
+ </div>
+ <div class="td cbi-section-table-cell" style="width:110px">
<select class="cbi-input-select" id="_newfwd.proto" name="_newfwd.proto">
<option value="tcp udp">TCP+UDP</option>
<option value="tcp">TCP</option>
<option value="udp">UDP</option>
<option value="other"><%:Other...%></option>
</select>
- </td>
- <td class="cbi-section-table-cell" style="width:55px">
+ </div>
+ <div class="td cbi-section-table-cell" style="width:55px">
<select class="cbi-input-select" id="_newfwd.extzone" name="_newfwd.extzone">
<% for _, z in ipairs(ezl) do -%><option value="<%=z:name()%>"><%=z:name()%></option><%- end %>
</select>
- </td>
- <td class="cbi-section-table-cell" style="width:110px">
+ </div>
+ <div class="td cbi-section-table-cell" style="width:110px">
<input type="text" class="cbi-input-text" id="_newfwd.extport" name="_newfwd.extport" data-type="portrange" data-optional="true" />
- </td>
- <td class="cbi-section-table-cell" style="width:55px">
+ </div>
+ <div class="td cbi-section-table-cell" style="width:55px">
<select class="cbi-input-select" id="_newfwd.intzone" name="_newfwd.intzone">
<% for _, z in ipairs(izl) do -%><option value="<%=z:name()%>"><%=z:name()%></option><%- end %>
</select>
- </td>
- <td class="cbi-section-table-cell" style="width:110px">
+ </div>
+ <div class="td cbi-section-table-cell" style="width:110px">
<input type="text" class="cbi-input-text" id="_newfwd.intaddr" name="_newfwd.intaddr" data-type="host" data-optional="true"<%=
ifattr(#keys > 0, "data-choices", {keys, vals})
%>/>
- </td>
- <td class="cbi-section-table-cell" style="width:110px">
+ </div>
+ <div class="td cbi-section-table-cell" style="width:110px">
<input type="text" class="cbi-input-text" id="_newfwd.intport" name="_newfwd.intport" data-type="portrange" data-optional="true" />
- </td>
- <td class="cbi-section-table-cell">
+ </div>
+ <div class="td cbi-section-table-cell">
<input type="submit" class="cbi-button cbi-button-add" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>.<%=section%>" value="<%:Add%>" />
- </td>
- </tr>
- </table>
+ </div>
+ </div>
+ </div>
<script type="text/javascript">//<![CDATA[
cbi_bind(document.getElementById('_newfwd.extport'), 'blur',
<div class="cbi-section-create cbi-tblsection-create">
<% if wz then %>
<br />
- <table class="cbi-section-table" style="margin-left:5px">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell left" colspan="4"><%:Open ports on router%>:</th>
- </tr>
- <tr class="cbi-section-table-descr">
- <th class="cbi-section-table-cell"><%:Name%></th>
- <th class="cbi-section-table-cell"><%:Protocol%></th>
- <th class="cbi-section-table-cell"><%:External port%></th>
- <th class="cbi-section-table-cell"></th>
- </tr>
- <tr class="cbi-section-table-row">
- <td class="cbi-section-table-cell" style="width:130px">
+ <div class="table cbi-section-table" style="margin-left:5px">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell left" colspan="4"><%:Open ports on router%>:</div>
+ </div>
+ <div class="tr cbi-section-table-descr">
+ <div class="th cbi-section-table-cell"><%:Name%></div>
+ <div class="th cbi-section-table-cell"><%:Protocol%></div>
+ <div class="th cbi-section-table-cell"><%:External port%></div>
+ <div class="th cbi-section-table-cell"></div>
+ </div>
+ <div class="tr cbi-section-table-row">
+ <div class="td cbi-section-table-cell" style="width:130px">
<input type="text" class="cbi-input-text" id="_newopen.name" name="_newopen.name" placeholder="<%:New input rule%>" />
- </td>
- <td class="cbi-section-table-cell" style="width:110px">
+ </div>
+ <div class="td cbi-section-table-cell" style="width:110px">
<select class="cbi-input-select" id="_newopen.proto" name="_newopen.proto">
<option value="tcp udp">TCP+UDP</option>
<option value="tcp">TCP</option>
<option value="udp">UDP</option>
<option value="other"><%:Other...%></option>
</select>
- </td>
- <td class="cbi-section-table-cell" style="width:110px">
+ </div>
+ <div class="td cbi-section-table-cell" style="width:110px">
<input type="text" class="cbi-input-text" id="_newopen.extport" name="_newopen.extport" />
- </td>
- <td class="cbi-section-table-cell left">
+ </div>
+ <div class="td cbi-section-table-cell left">
<input type="submit" class="cbi-button cbi-button-add" name="_newopen.submit" value="<%:Add%>" />
- </td>
- </tr>
- </table>
+ </div>
+ </div>
+ </div>
<% end %>
<% if #zones > 1 then %>
- <table class="cbi-section-table" style="margin-left:5px">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell left" colspan="6"><br /><%:New forward rule%>:</th>
- </tr>
- <tr class="cbi-section-table-descr">
- <th class="cbi-section-table-cell"><%:Name%></th>
- <th class="cbi-section-table-cell"><%:Source zone%></th>
- <th class="cbi-section-table-cell"><%:Destination zone%></th>
- <th class="cbi-section-table-cell"></th>
- </tr>
- <tr class="cbi-section-table-row">
- <td class="cbi-section-table-cell" style="width:130px">
+ <div class="table cbi-section-table" style="margin-left:5px">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell left" colspan="6"><br /><%:New forward rule%>:</div>
+ </div>
+ <div class="tr cbi-section-table-descr">
+ <div class="th cbi-section-table-cell"><%:Name%></div>
+ <div class="th cbi-section-table-cell"><%:Source zone%></div>
+ <div class="th cbi-section-table-cell"><%:Destination zone%></div>
+ <div class="th cbi-section-table-cell"></div>
+ </div>
+ <div class="tr cbi-section-table-row">
+ <div class="td cbi-section-table-cell" style="width:130px">
<input type="text" class="cbi-input-text" id="_newfwd.name" name="_newfwd.name" placeholder="<%:New forward rule%>" />
- </td>
- <td class="cbi-section-table-cell" style="width:110px">
+ </div>
+ <div class="td cbi-section-table-cell" style="width:110px">
<select class="cbi-input-text" id="_newfwd.src" name="_newfwd.src">
<% local k, v; for k, v in ipairs(fw:get_zones()) do -%>
<option<%=ifattr(v:name() == "wan", "selected", "selected")%> value="<%=v:name()%>"><%=v:name()%></option>
<%- end %>
</select>
- </td>
- <td class="cbi-section-table-cell" style="width:110px">
+ </div>
+ <div class="td cbi-section-table-cell" style="width:110px">
<select class="cbi-input-text" id="_newfwd.dest" name="_newfwd.dest">
<% local k, v; for k, v in ipairs(fw:get_zones()) do -%>
<option<%=ifattr(v:name() == "lan", "selected", "selected")%> value="<%=v:name()%>"><%=v:name()%></option>
<%- end %>
</select>
- </td>
- <td class="cbi-section-table-cell left">
+ </div>
+ <div class="td cbi-section-table-cell left">
<input type="submit" class="cbi-button cbi-button-link" name="_newfwd.submit" value="<%:Add and edit...%>" />
- </td>
- </tr>
- </table>
+ </div>
+ </div>
+ </div>
<% else %>
<input type="submit" class="cbi-button cbi-button-add" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>.<%=section%>" value="<%:Add%>" />
<% end %>
<div class="cbi-section-create cbi-tblsection-create">
<% if #zones > 1 then %>
<br />
- <table class="cbi-section-table" style="width:700px; margin-left:5px">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell left" colspan="6"><%:New source NAT%>:</th>
- </tr>
- <tr class="cbi-section-table-descr">
- <th class="cbi-section-table-cell"><%:Name%></th>
- <th class="cbi-section-table-cell"><%:Source zone%></th>
- <th class="cbi-section-table-cell"><%:Destination zone%></th>
- <th class="cbi-section-table-cell"><%:To source IP%></th>
- <th class="cbi-section-table-cell"><%:To source port%></th>
- <th class="cbi-section-table-cell"></th>
- </tr>
- <tr class="cbi-section-table-row">
- <td class="cbi-section-table-cell">
+ <div class="table cbi-section-table" style="width:700px; margin-left:5px">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell left" colspan="6"><%:New source NAT%>:</div>
+ </div>
+ <div class="tr cbi-section-table-descr">
+ <div class="th cbi-section-table-cell"><%:Name%></div>
+ <div class="th cbi-section-table-cell"><%:Source zone%></div>
+ <div class="th cbi-section-table-cell"><%:Destination zone%></div>
+ <div class="th cbi-section-table-cell"><%:To source IP%></div>
+ <div class="th cbi-section-table-cell"><%:To source port%></div>
+ <div class="th cbi-section-table-cell"></div>
+ </div>
+ <div class="tr cbi-section-table-row">
+ <div class="td cbi-section-table-cell">
<input type="text" class="cbi-input-text" id="_newsnat.name" name="_newsnat.name" placeholder="<%:New SNAT rule%>" />
- </td>
- <td class="cbi-section-table-cell" style="width:110px">
+ </div>
+ <div class="td cbi-section-table-cell" style="width:110px">
<select class="cbi-input-text" id="_newsnat.src" name="_newsnat.src">
<% local k, v; for k, v in ipairs(fw:get_zones()) do -%>
<option<%=ifattr(v:name() == "lan", "selected", "selected")%> value="<%=v:name()%>"><%=v:name()%></option>
<%- end %>
</select>
- </td>
- <td class="cbi-section-table-cell" style="width:110px">
+ </div>
+ <div class="td cbi-section-table-cell" style="width:110px">
<select class="cbi-input-text" id="_newsnat.dest" name="_newsnat.dest">
<% local k, v; for k, v in ipairs(fw:get_zones()) do -%>
<option<%=ifattr(v:name() == "wan", "selected", "selected")%> value="<%=v:name()%>"><%=v:name()%></option>
<%- end %>
</select>
- </td>
- <td class="cbi-section-table-cell" style="width:110px">
+ </div>
+ <div class="td cbi-section-table-cell" style="width:110px">
<input type="text" class="cbi-input-text" id="_newsnat.dip" name="_newsnat.dip" placeholder="<%:Do not rewrite%>" data-type="ip4addr" data-optional="true"<%=
ifattr(#keys > 0, "data-choices", { keys, vals })
%> />
- </td>
- <td class="cbi-section-table-cell" style="width:110px">
+ </div>
+ <div class="td cbi-section-table-cell" style="width:110px">
<input type="text" class="cbi-input-text" id="_newsnat.dport" name="_newsnat.dport" placeholder="<%:Do not rewrite%>" data-type="portrange" data-optional="true" />
- </td>
- <td class="cbi-section-table-cell">
+ </div>
+ <div class="td cbi-section-table-cell">
<input type="submit" class="cbi-button cbi-button-link" name="_newsnat.submit" value="<%:Add and edit...%>" />
- </td>
- </tr>
- </table>
+ </div>
+ </div>
+ </div>
<% else %>
<input type="submit" class="cbi-button cbi-button-add" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>.<%=section%>" value="<%:Add%>" />
<% end %>
var tb = document.getElementById('telephony_status_table');
if (st && tb)
{
- tb.deleteRow(1);
- var tr = tb.insertRow(-1);
- tr.className = 'cbi-section-table-row cbi-rowstyle-1';
-
- tr.insertCell(-1).innerHTML = st.status;
- tr.insertCell(-1).innerHTML = st.line1;
- tr.insertCell(-1).innerHTML = st.line2;
+ tb.removeChild(tb.firstChild);
+ tb.appendChild(E('<div class="tr cbi-section-table-row cbi-rowstyle-1">', [
+ E('<div class="td">', st.status),
+ E('<div class="td">', st.line1),
+ E('<div class="td">', st.line2)
+ ]));
}
}
);
<fieldset class="cbi-section">
<legend><%:Current Telephony State%></legend>
- <table class="cbi-section-table" id="telephony_status_table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Uplink%></th>
- <th class="cbi-section-table-cell"><%:Port1%></th>
- <th class="cbi-section-table-cell"><%:Port2%></th>
- </tr>
- <tr class="cbi-section-table-row">
- <td colspan="5"><em><br /><%:Collecting data...%></em></td>
- </tr>
- </table>
+ <div class="table cbi-section-table" id="telephony_status_table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:Uplink%></div>
+ <div class="th cbi-section-table-cell"><%:Port1%></div>
+ <div class="th cbi-section-table-cell"><%:Port2%></div>
+ </div>
+ <div class="tr cbi-section-table-row">
+ <div class="td" colspan="5"><em><br /><%:Collecting data...%></em></div>
+ </div>
+ </div>
</fieldset>
<fieldset class="cbi-section">
<legend><%:Recognized Clients%></legend>
<div class="cbi-section-node">
- <table class="cbi-section-table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Hostname%></th>
- <th class="cbi-section-table-cell"><%:IPv4%></th>
- <th class="cbi-section-table-cell"><%:MAC%></th>
- <th class="cbi-section-table-cell"><%:Manufacturer%></th>
- <th class="cbi-section-table-cell"><%:Model%></th>
- <th class="cbi-section-table-cell"><%:Class%></th>
- </tr>
+ <div class="table cbi-section-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%></div>
+ <div class="th cbi-section-table-cell"><%:MAC%></div>
+ <div class="th cbi-section-table-cell"><%:Manufacturer%></div>
+ <div class="th cbi-section-table-cell"><%:Model%></div>
+ <div class="th cbi-section-table-cell"><%:Class%></div>
+ </div>
<%
for i,v in ipairs(devdump) do
if v.DeviceProfileUuid ~= "" then
%>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=(style and 1 or 2)%>">
- <td class="cbi-value-field"><%=v.Hostname%></td>
- <td class="cbi-value-field"><%=v.Ipv4Address%></td>
- <td class="cbi-value-field"><a href="/cgi-bin/clientdetails?mac=<%=v.MacAddress%>"><%=v.MacAddress%></a></td>
- <td class="cbi-value-field"><%=devicevalues[v.DeviceProfileUuid].Manufacturer%></td>
- <td class="cbi-value-field"><%=devicevalues[v.DeviceProfileUuid].Model%></td>
- <td class="cbi-value-field"><%=devicevalues[v.DeviceProfileUuid].ThingClass%></td>
- </tr>
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=(style and 1 or 2)%>">
+ <div class="td cbi-value-field"><%=v.Hostname%></div>
+ <div class="td cbi-value-field"><%=v.Ipv4Address%></div>
+ <div class="td cbi-value-field"><a href="/cgi-bin/clientdetails?mac=<%=v.MacAddress%>"><%=v.MacAddress%></a></div>
+ <div class="td cbi-value-field"><%=devicevalues[v.DeviceProfileUuid].Manufacturer%></div>
+ <div class="td cbi-value-field"><%=devicevalues[v.DeviceProfileUuid].Model%></div>
+ <div class="td cbi-value-field"><%=devicevalues[v.DeviceProfileUuid].ThingClass%></div>
+ </div>
<%
style=false
end
end
%>
- </table>
+ </div>
</div>
</fieldset>
<br />
<fieldset class="cbi-section">
<legend><%:Unrecognized Clients%></legend>
<div class="cbi-section-node">
- <table class="cbi-section-table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Hostname%></th>
- <th class="cbi-section-table-cell"><%:IPv4%></th>
- <th class="cbi-section-table-cell"><%:MAC%></th>
- <th class="cbi-section-table-cell"><%:Manufacturer%></th>
- <th class="cbi-section-table-cell"><%:Model%></th>
- <th class="cbi-section-table-cell"><%:DhcpVendor%></th>
- <th class="cbi-section-table-cell"><%:DhcpHostname%></th>
- </tr>
+ <div class="table cbi-section-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%></div>
+ <div class="th cbi-section-table-cell"><%:MAC%></div>
+ <div class="th cbi-section-table-cell"><%:Manufacturer%></div>
+ <div class="th cbi-section-table-cell"><%:Model%></div>
+ <div class="th cbi-section-table-cell"><%:DhcpVendor%></div>
+ <div class="th cbi-section-table-cell"><%:DhcpHostname%></div>
+ </div>
<%
for i,v in ipairs(devdump) do
if v.DeviceProfileUuid == "" then
%>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=(style and 1 or 2)%>">
- <td class="cbi-value-field"><%=v.Hostname%></td>
- <td class="cbi-value-field"><%=v.Ipv4Address%></td>
- <td class="cbi-value-field"><a href="/cgi-bin/clientdetails?mac=<%=v.MacAddress%>"><%=v.MacAddress%></a></td>
- <td class="cbi-value-field"><%=v.SsdpManufacturer%></td>
- <td class="cbi-value-field"><%=v.SsdpModelName%></td>
- <td class="cbi-value-field"><%=v.DhcpVendor1%></td>
- <td class="cbi-value-field"><%=v.DhcpHostname%></td>
- </tr>
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=(style and 1 or 2)%>">
+ <div class="td cbi-value-field"><%=v.Hostname%></div>
+ <div class="td cbi-value-field"><%=v.Ipv4Address%></div>
+ <div class="td cbi-value-field"><a href="/cgi-bin/clientdetails?mac=<%=v.MacAddress%>"><%=v.MacAddress%></a></div>
+ <div class="td cbi-value-field"><%=v.SsdpManufacturer%></div>
+ <div class="td cbi-value-field"><%=v.SsdpModelName%></div>
+ <div class="td cbi-value-field"><%=v.DhcpVendor1%></div>
+ <div class="td cbi-value-field"><%=v.DhcpHostname%></div>
+ </div>
<%
style=false
end
end
%>
- </table>
+ </div>
</div>
</fieldset>
function(x)
{
var tb = document.getElementById('ocserv_status_table');
- if (tb && (idx < tb.rows.length))
- tb.rows[0].parentNode.removeChild(tb.rows[idx]);
+ if (tb && (idx + 1 < tb.childNodes.length))
+ tb.removeChild(tb.childNodes[idx + 1]);
}
);
}
if (st && 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.length; i++ )
+ for (var i = 0; i < st.length; i++)
{
- var tr = tb.insertRow(-1);
- tr.className = 'cbi-section-table-row cbi-rowstyle-' + ((i % 2) + 1);
-
- tr.insertCell(-1).innerHTML = st[i].user;
- tr.insertCell(-1).innerHTML = st[i].group;
- tr.insertCell(-1).innerHTML = st[i].vpn_ip;
- tr.insertCell(-1).innerHTML = st[i].ip;
- tr.insertCell(-1).innerHTML = st[i].device;
- tr.insertCell(-1).innerHTML = st[i].time;
- tr.insertCell(-1).innerHTML = st[i].cipher;
- tr.insertCell(-1).innerHTML = st[i].status;
-
- tr.insertCell(-1).innerHTML = String.format(
- '<input class="cbi-button cbi-input-remove" type="button" value="<%:Disconnect%>" onclick="ocserv_disconnect(%d)" />',
- st[i].id
- );
+ tb.appendChild(E('<div class="tr cbi-section-table-row cbi-rowstyle-%d">'.format((i % 2) + 1), [
+ E('<div class="td">', st[i].user),
+ E('<div class="td">', st[i].group),
+ E('<div class="td">', st[i].vpn_ip),
+ E('<div class="td">', st[i].ip),
+ E('<div class="td">', st[i].device),
+ E('<div class="td">', st[i].time),
+ E('<div class="td">', st[i].cipher),
+ E('<div class="td">', st[i].status),
+ E('<div class="td">',
+ E('<input class="cbi-button cbi-input-remove" type="button" value="<%:Disconnect%>" onclick="ocserv_disconnect(%d)" />'
+ .format(st[i].id)))
+ ]));
}
- if( tb.rows.length == 1 )
- {
- var tr = tb.insertRow(-1);
- tr.className = 'cbi-section-table-row';
-
- var td = tr.insertCell(-1);
- td.colSpan = 5;
- td.innerHTML = '<em><br /><%:There are no active users.%></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 users.%></em></div></div>'));
}
}
);
<fieldset class="cbi-section">
<legend><%:Active OpenConnect Users%></legend>
- <table class="cbi-section-table" id="ocserv_status_table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:User%></th>
- <th class="cbi-section-table-cell"><%:Group%></th>
- <th class="cbi-section-table-cell"><%:IP Address%></th>
- <th class="cbi-section-table-cell"><%:VPN IP Address%></th>
- <th class="cbi-section-table-cell"><%:Device%></th>
- <th class="cbi-section-table-cell"><%:Time%></th>
- <th class="cbi-section-table-cell"><%:Cipher%></th>
- <th class="cbi-section-table-cell"><%:Status%></th>
- <th class="cbi-section-table-cell"> </th>
- </tr>
- <tr class="cbi-section-table-row">
- <td colspan="5"><em><br /><%:Collecting data...%></em></td>
- </tr>
- </table>
+ <div class="table cbi-section-table" id="ocserv_status_table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:User%></div>
+ <div class="th cbi-section-table-cell"><%:Group%></div>
+ <div class="th cbi-section-table-cell"><%:IP Address%></div>
+ <div class="th cbi-section-table-cell"><%:VPN IP Address%></div>
+ <div class="th cbi-section-table-cell"><%:Device%></div>
+ <div class="th cbi-section-table-cell"><%:Time%></div>
+ <div class="th cbi-section-table-cell"><%:Cipher%></div>
+ <div class="th cbi-section-table-cell"><%:Status%></div>
+ <div class="th cbi-section-table-cell"> </div>
+ </div>
+ <div class="tr cbi-section-table-row">
+ <div class="td" colspan="5"><em><br /><%:Collecting data...%></em></div>
+ </div>
+ </div>
</fieldset>
+
{
var service = info[idx];
s += String.format(
- '<tr class="cbi-section-table-row cbi-rowstyle-'+(1 + (idx % 2))+'">' +
- '<td class="cbi-section-table-titles"><a href="%s">%s</a></td>' +
- '<td class="cbi-section-table-titles">%s</td>' +
- '<td class="cbi-section-table-titles"><a href="http://%s/cgi-bin-status.html">%s</a></td>' +
- '</tr>',
+ '<div class="tr cbi-section-table-row cbi-rowstyle-'+(1 + (idx % 2))+'">' +
+ '<div class="td cbi-section-table-titles"><a href="%s">%s</a></div>' +
+ '<div class="td cbi-section-table-titles">%s</div>' +
+ '<div class="td cbi-section-table-titles"><a href="http://%s/cgi-bin-status.html">%s</a></div>' +
+ '</div>',
service.url, service.descr, service.proto, service.origin_link, service.origin || '?'
);
}
<fieldset class="cbi-section">
<legend><%:Internal services%></legend>
- <table class="cbi-section-table">
- <thead>
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Url%></th>
- <th class="cbi-section-table-cell"><%:Protocol%></th>
- <th class="cbi-section-table-cell"><%:Source%></th>
- </tr>
- </thead>
-
- <tbody id="olsr_services">
+ <div class="table cbi-section-table">
+ <div class="thead">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:Url%></div>
+ <div class="th cbi-section-table-cell"><%:Protocol%></div>
+ <div class="th cbi-section-table-cell"><%:Source%></div>
+ </div>
+ </div>
+
+ <div class="tbody" id="olsr_services">
<%
for k, line in ipairs(services) do
local field = {}
local url, proto, descr, origin = pcdata(field[1]), pcdata(field[2]), utl.trim(pcdata(field[3])), pcdata(field[4])
%>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=i%>">
- <td class="cbi-section-table-titles"><a href="<%=url%>"><%=descr%></a></td>
- <td class="cbi-section-table-titles"><%=proto%></td>
- <td class="cbi-section-table-titles"><a href="http://<%=origin_link%>/cgi-bin-status.html"><%=origin%></a></td>
- </tr>
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=i%>">
+ <div class="td cbi-section-table-titles"><a href="<%=url%>"><%=descr%></a></div>
+ <div class="td cbi-section-table-titles"><%=proto%></div>
+ <div class="td cbi-section-table-titles"><a href="http://<%=origin_link%>/cgi-bin-status.html"><%=origin%></a></div>
+ </div>
<% i = ((i % 2) + 1)
end %>
- </tbody>
- </table>
+ </div>
+ </div>
<br />
<%=last_update%>
</fieldset>
{
var hna = info[idx];
var linkgw = ''
- s += '<tr class="cbi-section-table-row cbi-rowstyle-'+(1 + (idx % 2))+' proto-' + hna.proto + '">'
+ s += '<div class="tr cbi-section-table-row cbi-rowstyle-'+(1 + (idx % 2))+' proto-' + hna.proto + '">'
if (hna.proto == '6') {
linkgw = '<a href="http://[' + hna.gateway + ']/cgi-bin-status.html">' + hna.gateway + '</a>'
} else {
}
s += String.format(
- '<td class="cbi-section-table-cell">%s</td>' +
- '<td class="cbi-section-table-cell">%s</td>' +
- '<td class="cbi-section-table-cell">%s</td>', hna.destination + '/' + hna.genmask, linkgw + hostname, validity
+ '<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">%s</div>', hna.destination + '/' + hna.genmask, linkgw + hostname, validity
)
- s += '</tr>'
+ s += '</div>'
}
hnadiv.innerHTML = s;
}
<fieldset class="cbi-section">
<legend><%:Overview of currently active OLSR host net announcements%></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"><%:Validity Time%></th>
- </tr>
+ <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"><%:Validity Time%></div>
+ </div>
- </thead>
- <tbody id="olsrd_hna">
+ </div>
+ <div class="tbody" id="olsrd_hna">
<% for k, route in ipairs(hna) do %>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=i%> proto-<%=hna[k].proto%>">
- <td class="cbi-section-table-cell"><%=hna[k].destination%>/<%=hna[k].genmask%> </td>
- <td class="cbi-section-table-cell">
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=i%> proto-<%=hna[k].proto%>">
+ <div class="td cbi-section-table-cell"><%=hna[k].destination%>/<%=hna[k].genmask%> </div>
+ <div class="td cbi-section-table-cell">
<% if hna[k].proto == '6' then %>
<a href="http://[<%=hna[k].gateway%>]/cgi-bin-status.html"><%=hna[k].gateway%></a>
<% else %>
<% if hna[k].hostname then %>
/ <a href="http://<%=hna[k].hostname%>/cgi-bin-status.html"><%=hna[k].hostname%></a>
<% end %>
- </td>
+ </div>
<% if hna[k].validityTime then
validity = hna[k].validityTime .. 's'
else
validity = '-'
end %>
- <td class="cbi-section-table-cell"><%=validity%></td>
- </tr>
+ <div class="td cbi-section-table-cell"><%=validity%></div>
+ </div>
<% i = ((i % 2) + 1)
end %>
- </tbody>
- </table>
+ </div>
+ </div>
</fieldset>
<%+status-olsr/common_js%>
<fieldset class="cbi-section">
<legend><%:Overview of interfaces where OLSR is running%></legend>
- <table class="cbi-section-table">
- <tr>
- <th class="cbi-section-table-cell"><%:Interface%></th>
- <th class="cbi-section-table-cell"><%:State%></th>
- <th class="cbi-section-table-cell"><%:MTU%></th>
- <th class="cbi-section-table-cell"><%:WLAN%></th>
- <th class="cbi-section-table-cell"><%:Source address%></th>
- <th class="cbi-section-table-cell"><%:Netmask%></th>
- <th class="cbi-section-table-cell"><%:Broadcast address%></th>
- </tr>
+ <div class="table cbi-section-table">
+ <div class="tr">
+ <div class="th cbi-section-table-cell"><%:Interface%></div>
+ <div class="th cbi-section-table-cell"><%:State%></div>
+ <div class="th cbi-section-table-cell"><%:MTU%></div>
+ <div class="th cbi-section-table-cell"><%:WLAN%></div>
+ <div class="th cbi-section-table-cell"><%:Source address%></div>
+ <div class="th cbi-section-table-cell"><%:Netmask%></div>
+ <div class="th cbi-section-table-cell"><%:Broadcast address%></div>
+ </div>
<% for k, iface in ipairs(iface) do %>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=i%> proto-<%=iface.proto%>">
- <td class="cbi-section-table-cell"><%=iface.name%></td>
- <td class="cbi-section-table-cell"><%=iface.state%></td>
- <td class="cbi-section-table-cell"><%=iface.olsrMTU%></td>
- <td class="cbi-section-table-cell"><%=iface.wireless and luci.i18n.translate('yes') or luci.i18n.translate('no')%></td>
- <td class="cbi-section-table-cell"><%=iface.ipv4Address or iface.ipv6Address%></td>
- <td class="cbi-section-table-cell"><%=iface.netmask%></td>
- <td class="cbi-section-table-cell"><%=iface.broadcast or iface.multicast%></td>
- </tr>
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=i%> proto-<%=iface.proto%>">
+ <div class="td cbi-section-table-cell"><%=iface.name%></div>
+ <div class="td cbi-section-table-cell"><%=iface.state%></div>
+ <div class="td cbi-section-table-cell"><%=iface.olsrMTU%></div>
+ <div class="td cbi-section-table-cell"><%=iface.wireless and luci.i18n.translate('yes') or luci.i18n.translate('no')%></div>
+ <div class="td cbi-section-table-cell"><%=iface.ipv4Address or iface.ipv6Address%></div>
+ <div class="td cbi-section-table-cell"><%=iface.netmask%></div>
+ <div class="td cbi-section-table-cell"><%=iface.broadcast or iface.multicast%></div>
+ </div>
<% i = ((i % 2) + 1)
end %>
- </table>
+ </div>
</fieldset>
<%+status-olsr/common_js%>
<%+footer%>
<div id="togglebuttons"></div>
<fieldset class="cbi-section">
<legend><%:Overview of known multiple interface announcements%></legend>
- <table class="cbi-section-table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:OLSR node%></th>
- <th class="cbi-section-table-cell" ><%:Secondary OLSR interfaces%></th>
- </tr>
+ <div class="table cbi-section-table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:OLSR node%></div>
+ <div class="th cbi-section-table-cell" ><%:Secondary OLSR interfaces%></div>
+ </div>
<% for k, mid in ipairs(mids) do
local aliases = ''
end
%>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=i%> proto-<%=mid.proto%>">
- <td class="cbi-section-table-cell"><a href="http://<%=host%>/cgi-bin-status.html"><%=mid.ipAddress%></a></td>
- <td class="cbi-section-table-cell"><%=aliases%></td>
- </tr>
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=i%> proto-<%=mid.proto%>">
+ <div class="td cbi-section-table-cell"><a href="http://<%=host%>/cgi-bin-status.html"><%=mid.ipAddress%></a></div>
+ <div class="td cbi-section-table-cell"><%=aliases%></div>
+ </div>
<% i = ((i % 2) + 1)
end %>
- </table>
+ </div>
</fieldset>
<%+status-olsr/common_js%>
<%+footer%>
if (neigh.proto == '6') {
s += String.format(
- '<tr class="cbi-section-table-row cbi-rowstyle-'+(1 + (idx % 2))+' proto-%s">' +
- '<td class="cbi-section-table-titles" style="background-color:%s"><a href="http://[%s]/cgi-bin-status.html">%s</a></td>',
+ '<div class="tr cbi-section-table-row cbi-rowstyle-'+(1 + (idx % 2))+' proto-%s">' +
+ '<div class="td cbi-section-table-titles" style="background-color:%s"><a href="http://[%s]/cgi-bin-status.html">%s</a></div>',
neigh.proto, neigh.dfgcolor, neigh.rip, neigh.rip
);
} else {
s += String.format(
- '<tr class="cbi-section-table-row cbi-rowstyle-'+(1 + (idx % 2))+' proto-%s">' +
- '<td class="cbi-section-table-titles" style="background-color:%s"><a href="http://%s/cgi-bin-status.html">%s</a></td>',
+ '<div class="tr cbi-section-table-row cbi-rowstyle-'+(1 + (idx % 2))+' proto-%s">' +
+ '<div class="td cbi-section-table-titles" style="background-color:%s"><a href="http://%s/cgi-bin-status.html">%s</a></div>',
neigh.proto, neigh.dfgcolor, neigh.rip, neigh.rip
);
}
if (neigh.hn) {
s += String.format(
- '<td class="cbi-section-table-titles" style="background-color:%s"><a href="http://%s/cgi-bin-status.html">%s</a></td>',
+ '<div class="td cbi-section-table-titles" style="background-color:%s"><a href="http://%s/cgi-bin-status.html">%s</a></div>',
neigh.dfgcolor, neigh.hn, neigh.hn
);
} else {
s += String.format(
- '<td class="cbi-section-table-titles" style="background-color:%s">?</td>',
+ '<div class="td cbi-section-table-titles" style="background-color:%s">?</div>',
neigh.dfgcolor
);
}
s += String.format(
- '<td class="cbi-section-table-titles" style="background-color:%s">%s</td>' +
- '<td class="cbi-section-table-titles" style="background-color:%s">%s</td>' +
- '<td class="cbi-section-table-titles" style="background-color:%s">%s</td>' +
- '<td class="cbi-section-table-titles" style="background-color:%s">%s</td>' +
- '<td class="cbi-section-table-titles" style="background-color:%s">%s</td>' +
- '<td class="cbi-section-table-titles" style="background-color:%s" title="Signal: %s Noise: %s">%s</td>' +
- '</tr>',
+ '<div class="td cbi-section-table-titles" style="background-color:%s">%s</div>' +
+ '<div class="td cbi-section-table-titles" style="background-color:%s">%s</div>' +
+ '<div class="td cbi-section-table-titles" style="background-color:%s">%s</div>' +
+ '<div class="td cbi-section-table-titles" style="background-color:%s">%s</div>' +
+ '<div class="td cbi-section-table-titles" style="background-color:%s">%s</div>' +
+ '<div class="td cbi-section-table-titles" style="background-color:%s" title="Signal: %s Noise: %s">%s</div>' +
+ '</div>',
neigh.dfgcolor, neigh.ifn, neigh.dfgcolor, neigh.lip, neigh.dfgcolor, neigh.lq, neigh.dfgcolor, neigh.nlq, neigh.color, neigh.cost, neigh.snr_color, neigh.signal, neigh.noise, neigh.snr || '?'
);
}
<fieldset class="cbi-section">
<legend><%:Overview of currently established OLSR connections%></legend>
- <table class="cbi-section-table">
- <thead>
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Neighbour IP%></th>
- <th class="cbi-section-table-cell"><%:Hostname%></th>
- <th class="cbi-section-table-cell"><%:Interface%></th>
- <th class="cbi-section-table-cell"><%:Local interface IP%></th>
- <th class="cbi-section-table-cell">LQ</th>
- <th class="cbi-section-table-cell">NLQ</th>
- <th class="cbi-section-table-cell">ETX</th>
- <th class="cbi-section-table-cell">SNR</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"><%:Neighbour IP%></div>
+ <div class="th cbi-section-table-cell"><%:Hostname%></div>
+ <div class="th cbi-section-table-cell"><%:Interface%></div>
+ <div class="th cbi-section-table-cell"><%:Local interface IP%></div>
+ <div class="th cbi-section-table-cell">LQ</div>
+ <div class="th cbi-section-table-cell">NLQ</div>
+ <div class="th cbi-section-table-cell">ETX</div>
+ <div class="th cbi-section-table-cell">SNR</div>
+ </div>
+ </div>
- <tbody id="olsr_neigh_table">
+ <div class="tbody" id="olsr_neigh_table">
<% local i = 1
for k, link in ipairs(links) do
link.linkCost = tonumber(link.linkCost) or 0
end
%>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=i%> proto-<%=link.proto%>">
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=i%> proto-<%=link.proto%>">
<% if link.proto == "6" then %>
- <td class="cbi-section-table-titles" style="background-color:<%=defaultgw_color%>"><a href="http://[<%=link.remoteIP%>]/cgi-bin-status.html"><%=link.remoteIP%></a></td>
+ <div class="td cbi-section-table-titles" style="background-color:<%=defaultgw_color%>"><a href="http://[<%=link.remoteIP%>]/cgi-bin-status.html"><%=link.remoteIP%></a></div>
<% else %>
- <td class="cbi-section-table-titles" style="background-color:<%=defaultgw_color%>"><a href="http://<%=link.remoteIP%>/cgi-bin-status.html"><%=link.remoteIP%></a></td>
+ <div class="td cbi-section-table-titles" style="background-color:<%=defaultgw_color%>"><a href="http://<%=link.remoteIP%>/cgi-bin-status.html"><%=link.remoteIP%></a></div>
<% end %>
- <td class="cbi-section-table-titles" style="background-color:<%=defaultgw_color%>"><a href="http://<%=link.hostname%>/cgi-bin-status.html"><%=link.hostname%></a></td>
- <td class="cbi-section-table-titles" style="background-color:<%=defaultgw_color%>"><%=link.interface%></td>
- <td class="cbi-section-table-titles" style="background-color:<%=defaultgw_color%>"><%=link.localIP%></td>
- <td class="cbi-section-table-titles" style="background-color:<%=defaultgw_color%>"><%=string.format("%.3f", link.linkQuality)%></td>
- <td class="cbi-section-table-titles" style="background-color:<%=defaultgw_color%>"><%=string.format("%.3f", link.neighborLinkQuality)%></td>
- <td class="cbi-section-table-titles" style="background-color:<%=color%>"><%=string.format("%.3f", link.linkCost)%></td>
- <td class="cbi-section-table-titles" style="background-color:<%=snr_color%>" title="Signal: <%=link.signal%> Noise: <%=link.noise%>"><%=link.snr%></td>
- </tr>
+ <div class="td cbi-section-table-titles" style="background-color:<%=defaultgw_color%>"><a href="http://<%=link.hostname%>/cgi-bin-status.html"><%=link.hostname%></a></div>
+ <div class="td cbi-section-table-titles" style="background-color:<%=defaultgw_color%>"><%=link.interface%></div>
+ <div class="td cbi-section-table-titles" style="background-color:<%=defaultgw_color%>"><%=link.localIP%></div>
+ <div class="td cbi-section-table-titles" style="background-color:<%=defaultgw_color%>"><%=string.format("%.3f", link.linkQuality)%></div>
+ <div class="td cbi-section-table-titles" style="background-color:<%=defaultgw_color%>"><%=string.format("%.3f", link.neighborLinkQuality)%></div>
+ <div class="td cbi-section-table-titles" style="background-color:<%=color%>"><%=string.format("%.3f", link.linkCost)%></div>
+ <div class="td cbi-section-table-titles" style="background-color:<%=snr_color%>" title="Signal: <%=link.signal%> Noise: <%=link.noise%>"><%=link.snr%></div>
+ </div>
<%
i = ((i % 2) + 1)
end %>
- </tbody>
- </table>
+ </div>
+ </div>
<br />
<%+status-olsr/legend%>
<fieldset class="cbi-section">
<legend><%:Network%></legend>
- <table width="100%" cellspacing="10">
- <tr><td width="33%"><%:Interfaces%></td><td>
+ <div class="table" width="100%" cellspacing="10">
+ <div class="tr"><div class="td" width="33%"><%:Interfaces%></div><div class="td">
<a href="<%=REQUEST_URI%>/interfaces">
<span id="nr_ifaces">-<span>
</a>
- </td></tr>
- <tr><td width="33%"><%:Neighbors%></td><td>
+ </div></div>
+ <div class="tr"><div class="td" width="33%"><%:Neighbors%></div><div class="td">
<a href="<%=REQUEST_URI%>/neighbors">
<span id="nr_neigh">-</span>
</a>
- </td></tr>
- <tr><td width="33%"><%:Nodes%></td><td>
+ </div></div>
+ <div class="tr"><div class="td" width="33%"><%:Nodes%></div><div class="td">
<a href="<%=REQUEST_URI%>/topology">
<span id="nr_nodes">-</span>
</a>
- </td></tr>
- <tr><td width="33%"><%:HNA%></td><td>
+ </div></div>
+ <div class="tr"><div class="td" width="33%"><%:HNA%></div><div class="td">
<a href="<%=REQUEST_URI%>/hna">
<span id="nr_hna">-</span>
</a>
- </td></tr>
- <tr><td width="33%"><%:Links total%></td><td>
+ </div></div>
+ <div class="tr"><div class="td" width="33%"><%:Links total%></div><div class="td">
<a href="<%=REQUEST_URI%>/topology">
<span id="nr_topo">-</span>
</a>
- </td></tr>
- <tr><td width="33%"><%:Links per node (average)%></td><td>
+ </div></div>
+ <div class="tr"><div class="td" width="33%"><%:Links per node (average)%></div><div class="td">
<span id="meshfactor">-</span>
- </td></tr>
+ </div></div>
- </table>
+ </div>
</fieldset>
<fieldset class="cbi-section">
<legend>OLSR <%:Configuration%></legend>
- <table width="100%" cellspacing="10">
- <tr><td width="33%"><%:Version%></td><td>
+ <div class="table" width="100%" cellspacing="10">
+ <div class="tr"><div class="td" width="33%"><%:Version%></div><div class="td">
<span id="version">-<span>
- </td></tr>
- <tr><td width="33%"><%:Download Config%></td><td>
+ </div></div>
+ <div class="tr"><div class="td" width="33%"><%:Download Config%></div><div class="td">
<% if has_ipv4_conf then %>
<a href="<%=REQUEST_URI%>?openwrt_v4">OpenWrt (IPv4)</a>,
<% end %>
<% if has_ipv6_conf then %>
<a href="<%=REQUEST_URI%>?conf_v6">OLSRD (IPv6)</a>
<% end %>
- </td></tr>
- </table>
+ </div></div>
+ </div>
</fieldset>
<%+footer%>
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
)
}
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 || '?'
);
}
<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 %>
<% 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>
for (var idx = 0; idx < info.length; idx++)
{
var smartgw = info[idx];
- s += '<tr class="cbi-section-table-row cbi-rowstyle-'+(1 + (idx % 2))+' proto-' + smartgw.proto + '">'
+ s += '<div class="tr cbi-section-table-row cbi-rowstyle-'+(1 + (idx % 2))+' proto-' + smartgw.proto + '">'
if (smartgw.proto == '6') {
linkgw = '<a href="http://[' + smartgw.ipAddress + ']/cgi-bin-status.html">' + smartgw.ipAddress + '</a>'
} else {
}
s += String.format(
- '<td class="cbi-section-table-cell">%s</td>' +
- '<td class="cbi-section-table-cell">%s</td>' +
- '<td class="cbi-section-table-cell">%s</td>' +
- '<td class="cbi-section-table-cell">%s</td>' +
- '<td class="cbi-section-table-cell">%s</td>' +
- '<td class="cbi-section-table-cell">%s</td>' +
- '<td class="cbi-section-table-cell">%s</td>' +
- '<td class="cbi-section-table-cell">%s</td>' +
- '<td class="cbi-section-table-cell">%s</td>',
+ '<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">%s</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">%s</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">%s</div>',
linkgw, smartgw.status, smartgw.tcPathCost, smartgw.hopCount, smartgw.uplinkSpeed, smartgw.downlinkSpeed, smartgw.v4, smartgw.v6, smartgw.externalPrefix
)
- s += '</tr>'
+ s += '</div>'
}
smartgwdiv.innerHTML = s;
}
<fieldset class="cbi-section">
<legend><%:Overview of smart gateways in this network%></legend>
- <table class="cbi-section-table">
- <thead>
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Gateway%></th>
- <th class="cbi-section-table-cell"><%:Status%></th>
- <th class="cbi-section-table-cell"><%:ETX%></th>
- <th class="cbi-section-table-cell"><%:Hops%></th>
- <th class="cbi-section-table-cell"><%:Uplink%></th>
- <th class="cbi-section-table-cell"><%:Downlink%></th>
- <th class="cbi-section-table-cell"><%:IPv4%></th>
- <th class="cbi-section-table-cell"><%:IPv6%></th>
- <th class="cbi-section-table-cell"><%:Prefix%></th>
-
- </tr>
- </thead>
-
- <tbody id="olsrd_smartgw">
+ <div class="table cbi-section-table">
+ <div class="thead">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:Gateway%></div>
+ <div class="th cbi-section-table-cell"><%:Status%></div>
+ <div class="th cbi-section-table-cell"><%:ETX%></div>
+ <div class="th cbi-section-table-cell"><%:Hops%></div>
+ <div class="th cbi-section-table-cell"><%:Uplink%></div>
+ <div class="th cbi-section-table-cell"><%:Downlink%></div>
+ <div class="th cbi-section-table-cell"><%:IPv4%></div>
+ <div class="th cbi-section-table-cell"><%:IPv6%></div>
+ <div class="th cbi-section-table-cell"><%:Prefix%></div>
+
+ </div>
+ </div>
+
+ <div class="tbody" id="olsrd_smartgw">
<% for k, gw in ipairs(gws) do
gw.tcPathCost = tonumber(gw.tcPathCost)/1024 or 0
end
%>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=i%> proto-<%=proto%>">
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=i%> proto-<%=proto%>">
<% if gw.proto == '6' then %>
- <td class="cbi-section-table-cell"><a href="http://[<%=gw.ipAddress%>]/cgi-bin-status.html"><%=gw.ipAddress%></a></td>
+ <div class="td cbi-section-table-cell"><a href="http://[<%=gw.ipAddress%>]/cgi-bin-status.html"><%=gw.ipAddress%></a></div>
<% else %>
- <td class="cbi-section-table-cell"><a href="http://<%=gw.ipAddress%>/cgi-bin-status.html"><%=gw.ipAddress%></a></td>
+ <div class="td cbi-section-table-cell"><a href="http://<%=gw.ipAddress%>/cgi-bin-status.html"><%=gw.ipAddress%></a></div>
<% end %>
- <td class="cbi-section-table-cell"><%=gw.ipv4Status or gw.ipv6Status or '-' %></td>
- <td class="cbi-section-table-cell"><%=string.format("%.3f", gw.tcPathCost)%></td>
- <td class="cbi-section-table-cell"><%=gw.hopCount%></td>
- <td class="cbi-section-table-cell"><%=gw.uplinkSpeed%></td>
- <td class="cbi-section-table-cell"><%=gw.downlinkSpeed%></td>
- <td class="cbi-section-table-cell"><%=gw.ipv4 and luci.i18n.translate('yes') or luci.i18n.translate('no')%></td>
- <td class="cbi-section-table-cell"><%=gw.ipv6 and luci.i18n.translate('yes') or luci.i18n.translate('no')%></td>
- <td class="cbi-section-table-cell"><%=gw.externalPrefix%></td>
- </tr>
+ <div class="td cbi-section-table-cell"><%=gw.ipv4Status or gw.ipv6Status or '-' %></div>
+ <div class="td cbi-section-table-cell"><%=string.format("%.3f", gw.tcPathCost)%></div>
+ <div class="td cbi-section-table-cell"><%=gw.hopCount%></div>
+ <div class="td cbi-section-table-cell"><%=gw.uplinkSpeed%></div>
+ <div class="td cbi-section-table-cell"><%=gw.downlinkSpeed%></div>
+ <div class="td cbi-section-table-cell"><%=gw.ipv4 and luci.i18n.translate('yes') or luci.i18n.translate('no')%></div>
+ <div class="td cbi-section-table-cell"><%=gw.ipv6 and luci.i18n.translate('yes') or luci.i18n.translate('no')%></div>
+ <div class="td cbi-section-table-cell"><%=gw.externalPrefix%></div>
+ </div>
<% i = ((i % 2) + 1)
end %>
- </tbody>
- </table>
+ </div>
+ </div>
</fieldset>
<% else %>
<fieldset class="cbi-section">
<legend><%:Overview of currently known OLSR nodes%></legend>
- <table class="cbi-section-table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:OLSR node%></th>
- <th class="cbi-section-table-cell"><%:Last hop%></th>
- <th class="cbi-section-table-cell"><%:LQ%></th>
- <th class="cbi-section-table-cell"><%:NLQ%></th>
- <th class="cbi-section-table-cell"><%:ETX%></th>
- </tr>
+ <div class="table cbi-section-table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:OLSR node%></div>
+ <div class="th cbi-section-table-cell"><%:Last hop%></div>
+ <div class="th cbi-section-table-cell"><%:LQ%></div>
+ <div class="th cbi-section-table-cell"><%:NLQ%></div>
+ <div class="th cbi-section-table-cell"><%:ETX%></div>
+ </div>
<% for k, route in ipairs(routes) do
local cost = string.format("%.3f", tonumber(route.tcEdgeCost/1024) or 0)
local nlq = string.format("%.3f", tonumber(route.neighborLinkQuality) or 0)
%>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=i%> proto-<%=route.proto%>">
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=i%> proto-<%=route.proto%>">
<% if route.proto == "6" then %>
- <td class="cbi-section-table-cell"><a href="http://[<%=route.destinationIP%>]/cgi-bin-status.html"><%=route.destinationIP%></a></td>
- <td class="cbi-section-table-cell"><a href="http://[<%=route.lastHopIP%>]/cgi-bin-status.html"><%=route.lastHopIP%></a></td>
+ <div class="td cbi-section-table-cell"><a href="http://[<%=route.destinationIP%>]/cgi-bin-status.html"><%=route.destinationIP%></a></div>
+ <div class="td cbi-section-table-cell"><a href="http://[<%=route.lastHopIP%>]/cgi-bin-status.html"><%=route.lastHopIP%></a></div>
<% else %>
- <td class="cbi-section-table-cell"><a href="http://<%=route.destinationIP%>/cgi-bin-status.html"><%=route.destinationIP%></a></td>
- <td class="cbi-section-table-cell"><a href="http://<%=route.lastHopIP%>/cgi-bin-status.html"><%=route.lastHopIP%></a></td>
+ <div class="td cbi-section-table-cell"><a href="http://<%=route.destinationIP%>/cgi-bin-status.html"><%=route.destinationIP%></a></div>
+ <div class="td cbi-section-table-cell"><a href="http://<%=route.lastHopIP%>/cgi-bin-status.html"><%=route.lastHopIP%></a></div>
<%end%>
- <td class="cbi-section-table-cell"><%=lq%></td>
- <td class="cbi-section-table-cell"><%=nlq%></td>
- <td class="cbi-section-table-cell" style="background-color:<%=color%>"><%=cost%></td>
- </tr>
+ <div class="td cbi-section-table-cell"><%=lq%></div>
+ <div class="td cbi-section-table-cell"><%=nlq%></div>
+ <div class="td cbi-section-table-cell" style="background-color:<%=color%>"><%=cost%></div>
+ </div>
<% i = ((i % 2) + 1)
end %>
- </table>
+ </div>
<%+status-olsr/legend%>
</fieldset>
<div class="cbi-section-create cbi-tblsection-create">
<br />
- <table class="cbi-section-table">
- <tr class="cbi-section-table-row">
- <td class="cbi-section-table-cell" style="width:140px">
+ <div class="table cbi-section-table">
+ <div class="tr cbi-section-table-row">
+ <div class="td cbi-section-table-cell" style="width:140px">
<select class="cbi-input-select" id="_newinst.type" name="_newinst.type">
<option value="_dummy">-- instance type --</option>
<option value="ss_local">ss-local</option>
<option value="ss_redir">ss-redir</option>
<option value="ss_server">ss-server</option>
</select>
- </td>
- <td class="cbi-section-table-cell" style="width:110px">
+ </div>
+ <div class="td cbi-section-table-cell" style="width:110px">
<input type="text" class="cbi-input-text" id="_newinst.name" name="_newinst.name" placeholder="<%:Name%>"/>
- </td>
- <td class="cbi-section-table-cell left">
+ </div>
+ <div class="td cbi-section-table-cell left">
<input type="submit" class="cbi-button cbi-button-add" name="cbi.cts.<%=self.config%>" value="<%:Add%>" />
- </td>
- </tr>
- </table>
+ </div>
+ </div>
+ </div>
</div>
<script type="text/javascript">//<![CDATA[
XHR.poll(5, '<%=url('admin/services/shadowsocks-libev/status')%>', null,
{
var s = '';
if (info.length == undefined) {
- s += '<tr class="cbi-section-table-row"><td colspan="7" class="cbi-section-table-cell"><br /><em><%:No clients connected%></em><br /></td></tr>'
+ s += '<div class="tr cbi-section-table-row"><div colspan="7" class="td cbi-section-table-cell"><br /><em><%:No clients connected%></em><br /></div></div>'
};
for (var idx = 0; idx < info.length; idx++)
{
var splash = info[idx];
s += String.format(
- '<tr class="cbi-section-table-row cbi-rowstyle-'+(1 + (idx % 2))+'">' +
- '<td class="cbi-section-table-cell">%s</td>' +
- '<td class="cbi-section-table-cell">%s</td>' +
- '<td class="cbi-section-table-cell">%s</td>' +
- '<td class="cbi-section-table-cell">%s</td>' +
- '<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))+'">' +
+ '<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">%s</div>' +
+ '<div class="td cbi-section-table-cell">%s</div>' +
+ '<div class="td cbi-section-table-cell">%s/%s</div>' +
+ '<div class="td cbi-section-table-cell">',
splash.hostname, splash.ip, splash.mac, splash.timeleft, splash.trafficin, splash.trafficout);
<% if is_admin then %>
<% else %>
s += String.format('%s', splash.policy);
<% end %>
- s += '</td></tr>'
+ s += '</div></div>'
}
tbody.innerHTML = s;
}
<legend><%:Active Clients%></legend>
<div class="cbi-section-node">
<% if is_admin then %><form action="<%=REQUEST_URI%>" method="post"><input type="hidden" name="token" value="<%=token%>" /><% end %>
- <table class="cbi-section-table">
- <thead>
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Hostname%></th>
- <th class="cbi-section-table-cell"><%:IP Address%></th>
- <th class="cbi-section-table-cell"><%:MAC Address%></th>
- <th class="cbi-section-table-cell"><%:Time remaining%></th>
- <th class="cbi-section-table-cell"><%:Traffic in/out%></th>
- <th class="cbi-section-table-cell"><%:Policy%></th>
- </tr>
- </thead>
- <tbody id="splash_table">
+ <div class="table cbi-section-table">
+ <div class="thead">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:Hostname%></div>
+ <div class="th cbi-section-table-cell"><%:IP Address%></div>
+ <div class="th cbi-section-table-cell"><%:MAC Address%></div>
+ <div class="th cbi-section-table-cell"><%:Time remaining%></div>
+ <div class="th cbi-section-table-cell"><%:Traffic in/out%></div>
+ <div class="th cbi-section-table-cell"><%:Policy%></div>
+ </div>
+ </div>
+ <div class="tbody" id="splash_table">
<%-
local count = 0
if c.ip then
count = count + 1
-%>
- <tr class="cbi-section-table-row cbi-rowstyle-<%=2-(count%2)%>">
- <td class="cbi-section-table-cell"><%=c.hostname or "<em>" .. translate("unknown") .. "</em>"%></td>
- <td class="cbi-section-table-cell"><%=c.ip or "<em>" .. translate("unknown") .. "</em>"%></td>
- <td class="cbi-section-table-cell"><%=showmac(c.mac)%></td>
- <td class="cbi-section-table-cell"><%=
+ <div class="tr cbi-section-table-row cbi-rowstyle-<%=2-(count%2)%>">
+ <div class="td cbi-section-table-cell"><%=c.hostname or "<em>" .. translate("unknown") .. "</em>"%></div>
+ <div class="td cbi-section-table-cell"><%=c.ip or "<em>" .. translate("unknown") .. "</em>"%></div>
+ <div class="td cbi-section-table-cell"><%=showmac(c.mac)%></div>
+ <div class="td cbi-section-table-cell"><%=
(c.limit >= os.time()) and wat.date_format(c.limit-os.time()) or
(c.policy ~= "normal") and "-" or "<em>" .. translate("expired") .. "</em>"
- %></td>
- <td class="cbi-section-table-cell"><%=wat.byte_format(c.bytes_in)%> / <%=wat.byte_format(c.bytes_out)%></td>
- <td class="cbi-section-table-cell">
+ %></div>
+ <div class="td cbi-section-table-cell"><%=wat.byte_format(c.bytes_in)%> / <%=wat.byte_format(c.bytes_out)%></div>
+ <div class="td cbi-section-table-cell">
<% if is_admin then %>
<select name="policy.<%=c.mac:lower()%>" style="width:200px">
<option value="whitelist"<%=c.policy=="whitelist" and ' selected="selected"'%>><%:whitelisted%></option>
<% else %>
<%=c.policy%>
<% end %>
- </td>
- </tr>
+ </div>
+ </div>
<%-
end
end
if count == 0 then
-%>
- <tr class="cbi-section-table-row">
- <td colspan="7" class="cbi-section-table-cell">
+ <div class="tr cbi-section-table-row">
+ <div colspan="7" class="td cbi-section-table-cell">
<br /><em><%:No clients connected%></em><br />
- </td>
- </tr>
+ </div>
+ </div>
<%- end -%>
- </tbody>
- </table>
+ </div>
+ </div>
<% if is_admin then %></form><% end %>
</div>
</fieldset>
</div>
<fieldset class="cbi-section">
- <table class="cbi-section-table" style="empty-cells:hide">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell" style="text-align:left"><%:Device%></th>
- <th class="cbi-section-table-cell" style="text-align:left"><%:SSID%></th>
- <th class="cbi-section-table-cell" style="text-align:left"><%:BSSID%></th>
- <th class="cbi-section-table-cell" style="text-align:left"><%:Encryption%></th>
- <th class="cbi-section-table-cell" style="text-align:center" colspan="2"><%:Actions%></th>
- </tr>
+ <div class="table cbi-section-table" style="empty-cells:hide">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell" style="text-align:left"><%:Device%></div>
+ <div class="th cbi-section-table-cell" style="text-align:left"><%:SSID%></div>
+ <div class="th cbi-section-table-cell" style="text-align:left"><%:BSSID%></div>
+ <div class="th cbi-section-table-cell" style="text-align:left"><%:Encryption%></div>
+ <div class="th cbi-section-table-cell" style="text-align:center" colspan="2"><%:Actions%></div>
+ </div>
<%
uci:foreach("wireless", "wifi-iface", function(s)
local iface = s.network or ""
style = "text-align:left;color:#0069d6;font-weight:bold"
end
%>
- <tr class="cbi-section-table-row cbi-rowstyle-1" style="<%=style%>">
- <td style="<%=style%>"><%=device%></td>
- <td style="<%=style%>"><%=ssid%></td>
- <td style="<%=style%>"><%=bssid%></td>
- <td style="<%=style%>"><%=encryption%></td>
- <td class="cbi-value-field" style="width:80px">
+ <div class="tr cbi-section-table-row cbi-rowstyle-1" style="<%=style%>">
+ <div class="td" style="<%=style%>"><%=device%></div>
+ <div class="td" style="<%=style%>"><%=ssid%></div>
+ <div class="td" style="<%=style%>"><%=bssid%></div>
+ <div class="td" style="<%=style%>"><%=encryption%></div>
+ <div class="td cbi-value-field" style="width:80px">
<input class="cbi-button cbi-button-up" type="button" value="" onclick="location.href='<%=luci.dispatcher.build_url('admin/services/travelmate/wifiorder')%>?cfg=<%=section%>&dir=up'" alt="<%:Move up%>" title="<%:Move up%>"/>
<input class="cbi-button cbi-button-down" type="button" value="" onclick="location.href='<%=luci.dispatcher.build_url('admin/services/travelmate/wifiorder')%>?cfg=<%=section%>&dir=down'" alt="<%:Move down%>" title="<%:Move down%>"/>
- </td>
- <td class="cbi-value-field" style="width:150px">
+ </div>
+ <div class="td cbi-value-field" style="width:150px">
<input type="button" class="cbi-button cbi-button-edit" onclick="location.href='<%=luci.dispatcher.build_url('admin/services/travelmate/wifiedit')%>?cfg=<%=section%>'" title="<%:Edit this Uplink%>" value="<%:Edit%>"/>
<input type="button" class="cbi-button cbi-button-remove" onclick="location.href='<%=luci.dispatcher.build_url('admin/services/travelmate/wifidelete')%>?cfg=<%=section%>'" title="<%:Delete this Uplink%>" value="<%:Delete%>"/>
- </td>
- </tr>
+ </div>
+ </div>
<%
end
end)
%>
- </table>
+ </div>
</fieldset>
<div class="cbi-page-actions right">
<%
<div class="cbi-map">
<h2 name="content"><%:Wireless Scan%></h2>
<fieldset class="cbi-section">
- <table class="cbi-section-table" style="empty-cells:hide">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell" style="text-align:left"><%:Uplink SSID%></th>
- <th class="cbi-section-table-cell" style="text-align:left"><%:Uplink BSSID%></th>
- <th class="cbi-section-table-cell" style="text-align:left"><%:Encryption%></th>
- <th class="cbi-section-table-cell" style="text-align:left" colspan="2"><%:Signal strength%></th>
- </tr>
+ <div class="table cbi-section-table" style="empty-cells:hide">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell" style="text-align:left"><%:Uplink SSID%></div>
+ <div class="th cbi-section-table-cell" style="text-align:left"><%:Uplink BSSID%></div>
+ <div class="th cbi-section-table-cell" style="text-align:left"><%:Encryption%></div>
+ <div class="th cbi-section-table-cell" style="text-align:left" colspan="2"><%:Signal strength%></div>
+ </div>
<% for i, net in ipairs(iw.scanlist or { }) do %>
- <tr class="cbi-section-table-row cbi-rowstyle-1">
- <td class="cbi-value-field" style="text-align:left">
+ <div class="tr cbi-section-table-row cbi-rowstyle-1">
+ <div class="td cbi-value-field" style="text-align:left">
<%=net.ssid and utl.pcdata(net.ssid) or "<em>%s</em>" % translate("hidden")%>
- </td>
- <td class="cbi-value-field" style="text-align:left">
+ </div>
+ <div class="td cbi-value-field" style="text-align:left">
<%=net.bssid and utl.pcdata(net.bssid)%>
- </td>
- <td class="cbi-value-field" style="text-align:left">
+ </div>
+ <div class="td cbi-value-field" style="text-align:left">
<%=format_wifi_encryption(net.encryption)%>
- </td>
- <td class="cbi-value-field" style="text-align:left">
+ </div>
+ <div class="td cbi-value-field" style="text-align:left">
<%=percent_wifi_signal(net)%> %
- </td>
- <td class="cbi-value-field" style="width:100px;text-align:right">
+ </div>
+ <div class="td cbi-value-field" style="width:100px;text-align:right">
<form class="inline" action="<%=luci.dispatcher.build_url('admin/services/travelmate/wifiadd')%>" method="post">
<input type="hidden" name="token" value="<%=token%>"/>
<input type="hidden" name="device" value="<%=utl.pcdata(dev)%>"/>
<% end %>
<input class="cbi-button cbi-button-apply" type="submit" value="<%:Add Uplink%>"/>
</form>
- </td>
- </tr>
+ </div>
+ </div>
<% end %>
- </table>
+ </div>
</fieldset>
<div class="cbi-page-actions right">
<form class="inline" action="<%=luci.dispatcher.build_url('admin/services/travelmate/wifiscan')%>" method="post">
function(x)
{
var tb = document.getElementById('upnp_status_table');
- if (tb && (idx < tb.rows.length))
- tb.rows[0].parentNode.removeChild(tb.rows[idx]);
+ if (tb && (idx + 1 < tb.childNodes.length))
+ tb.removeChild(tb.childNodes[idx + 1]);
}
);
}
if (st && 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.length; i++ )
- {
- var tr = tb.insertRow(-1);
- tr.className = 'cbi-section-table-row cbi-rowstyle-' + ((i % 2) + 1);
+ for (var i = 0; i < st.length; i++)
+ tb.appendChild(E('<div class="tr cbi-section-table-row cbi-rowstyle-%d">'.format((i % 2) + 1), [
+ E('<div class="td">', st[i].proto),
+ E('<div class="td">', st[i].extport),
+ E('<div class="td">', st[i].intaddr),
+ E('<div class="td">', st[i].intport),
+ E('<div class="td">', st[i].descr),
+ E('<input class="cbi-button cbi-input-remove" type="button" value="<%:Delete%>" onclick="upnp_delete_fwd(%d)" />'.format(st[i].num))
+ ]));
- tr.insertCell(-1).innerHTML = st[i].proto;
- tr.insertCell(-1).innerHTML = st[i].extport;
- tr.insertCell(-1).innerHTML = st[i].intaddr;
- tr.insertCell(-1).innerHTML = st[i].intport;
- tr.insertCell(-1).innerHTML = st[i].descr;
-
- tr.insertCell(-1).innerHTML = String.format(
- '<input class="cbi-button cbi-input-remove" type="button" value="<%:Delete%>" onclick="upnp_delete_fwd(%d)" />',
- st[i].num
- );
- }
-
- if( tb.rows.length == 1 )
- {
- var tr = tb.insertRow(-1);
- tr.className = 'cbi-section-table-row';
-
- var td = tr.insertCell(-1);
- td.colSpan = 5;
- td.innerHTML = '<em><br /><%:There are no active redirects.%></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 redirects.%></em></div></div>'));
}
}
);
<fieldset class="cbi-section">
<legend><%:Active UPnP Redirects%></legend>
- <table class="cbi-section-table" id="upnp_status_table">
- <tr class="cbi-section-table-titles">
- <th class="cbi-section-table-cell"><%:Protocol%></th>
- <th class="cbi-section-table-cell"><%:External Port%></th>
- <th class="cbi-section-table-cell"><%:Client Address%></th>
- <th class="cbi-section-table-cell"><%:Client Port%></th>
- <th class="cbi-section-table-cell"><%:Description%></th>
- <th class="cbi-section-table-cell"> </th>
- </tr>
- <tr class="cbi-section-table-row">
- <td colspan="5"><em><br /><%:Collecting data...%></em></td>
- </tr>
- </table>
+ <div class="table cbi-section-table" id="upnp_status_table">
+ <div class="tr cbi-section-table-titles">
+ <div class="th cbi-section-table-cell"><%:Protocol%></div>
+ <div class="th cbi-section-table-cell"><%:External Port%></div>
+ <div class="th cbi-section-table-cell"><%:Client Address%></div>
+ <div class="th cbi-section-table-cell"><%:Client Port%></div>
+ <div class="th cbi-section-table-cell"><%:Description%></div>
+ <div class="th cbi-section-table-cell"> </div>
+ </div>
+ <div class="tr cbi-section-table-row">
+ <div class="td" colspan="5"><em><br /><%:Collecting data...%></em></div>
+ </div>
+ </div>
</fieldset>
for ikey, iface in pairs(data) do
-%>
<legend><%:Interface%> <%=ikey%></legend>
- <table width="100%" cellspacing="10">
- <tr>
- <td width="33%" style="vertical-align:top"><%:Configuration%></td>
- <td>
- <table>
- <tr>
- <td id="<%=ikey%>_icon" style="width:16px; text-align:center; padding:3px">
+ <div class="table" width="100%" cellspacing="10">
+ <div class="tr">
+ <div class="td" width="33%" style="vertical-align:top"><%:Configuration%></div>
+ <div class="td">
+ <div class="table">
+ <div class="tr">
+ <div class="td" id="<%=ikey%>_icon" style="width:16px; text-align:center; padding:3px">
- </td>
- <td id="<%=ikey%>_info" style="vertical-align:middle; padding: 3px">
+ </div>
+ <div class="td" id="<%=ikey%>_info" style="vertical-align:middle; padding: 3px">
<em><%:Collecting data...%></em>
- </td>
- </tr></table>
- </td>
- </tr>
+ </div>
+ </div></div>
+ </div>
+ </div>
<%-
for pkey, peer in pairs(iface.peers) do
-%>
- <tr>
- <td width="33%" style="vertical-align:top"><%:Peer%></td>
- <td>
- <table>
- <tr>
- <td id="<%=ikey%>_<%=peer.public_key%>_icon" style="width:16px; text-align:center; padding:3px">
+ <div class="tr">
+ <div class="td" width="33%" style="vertical-align:top"><%:Peer%></div>
+ <div class="td">
+ <div class="table">
+ <div class="tr">
+ <div class="td" id="<%=ikey%>_<%=peer.public_key%>_icon" style="width:16px; text-align:center; padding:3px">
<img src="<%=resource%>/icons/tunnel_disabled.png" /><br />
<small>?</small>
- </td>
- <td id="<%=ikey%>_<%=peer.public_key%>_info" style="vertical-align:middle; padding: 3px">
+ </div>
+ <div class="td" id="<%=ikey%>_<%=peer.public_key%>_info" style="vertical-align:middle; padding: 3px">
<em><%:Collecting data...%></em>
- </td>
- </tr></table>
- </td>
- </tr>
+ </div>
+ </div></div>
+ </div>
+ </div>
<%-
end
-%>
- </table>
+ </div>
<%-
end
-%>
-<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))%>">
<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> </th>
+ <div class="th"> </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"> </th>
+ <div class="th cbi-section-table-cell"> </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 %>
-%>
<%- 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
<%- 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">
ifc.ip6addrs[i]
);
}
-
+
if (ifc.ip6prefix)
{
html += String.format('<strong><%:IPv6-PD%>:</strong> %s<br />', ifc.ip6prefix);
<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>
<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>
);
//]]></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%>
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;
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');
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;
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>'));
}
}
);
<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>
<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)%>" />
<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">
{
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;
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;
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)
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)
{
<% 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%>" />
<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 %>
<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>
);
//]]></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%>
<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%>
{
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 = [ ];
{
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);
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)
<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>
'<strong><%:Type%>: </strong>%s%s<br />',
ifc6.proto, (ifc6.ip6prefix) ? '-pd' : ''
);
-
+
if (!ifc6.ip6prefix)
{
s += String.format(
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;
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');
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;
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 %>
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++)
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 />' +
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)
{
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)
+ ]));
}
}
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)
;
});
- 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)
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 %>
<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 %>
<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"> </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"> </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 %>
<% 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 -%>
<%- 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>
<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%>
<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 />
<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 />
<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 />
<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 />
<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 />
<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%>
<% 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"> </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"> </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%> "<%=luci.util.pcdata(n)%>" ?') && 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"> </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"> </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">
</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"> </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"> </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%> "<%=luci.util.pcdata(n)%>" ?') && 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"> </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"> </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 %>
<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%>
<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
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>
<% 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>
projects / project / luci.git / commitdiff