X-Git-Url: http://git.openwrt.org/?a=blobdiff_plain;f=modules%2Fluci-mod-status%2Fhtdocs%2Fluci-static%2Fresources%2Fview%2Fstatus%2Fiptables.js;h=2ce744c60e5acdadc5133437f77c064e3ab77d8d;hb=d3ba6ae3bd8b1f44f0743ffeb09d3e9497537c63;hp=a742243a036faee8ad6977e8b4c50bb14fbaf9fb;hpb=7f791e9cf428b9c5347a48b6f39e20bd7f7a24e7;p=project%2Fluci.git
diff --git a/modules/luci-mod-status/htdocs/luci-static/resources/view/status/iptables.js b/modules/luci-mod-status/htdocs/luci-static/resources/view/status/iptables.js
index a742243a03..2ce744c60e 100644
--- a/modules/luci-mod-status/htdocs/luci-static/resources/view/status/iptables.js
+++ b/modules/luci-mod-status/htdocs/luci-static/resources/view/status/iptables.js
@@ -1,232 +1,198 @@
-var table_names = [ 'Filter', 'NAT', 'Mangle', 'Raw' ],
- current_mode = document.querySelector('.cbi-tab[data-mode="6"]') ? 6 : 4;
-
-function create_table_section(table)
-{
- var idiv = document.getElementById('iptables'),
- tdiv = idiv.querySelector('[data-table="%s"]'.format(table)),
- title = '%s: %s'.format(_('Table'), table);
-
- if (!tdiv) {
- tdiv = E('div', { 'data-table': table }, [
- E('h3', {}, title),
- E('div')
- ]);
+'use strict';
+'require view';
+'require poll';
+'require fs';
+'require ui';
+
+var table_names = [ 'Filter', 'NAT', 'Mangle', 'Raw' ];
+
+return view.extend({
+ load: function() {
+ return L.resolveDefault(fs.stat('/usr/sbin/ip6tables'));
+ },
+
+ createTableSection: function(is_ipv6, table) {
+ var idiv = document.querySelector('div[data-tab="%s"]'.format(is_ipv6 ? 'ip6tables' : 'iptables')),
+ tdiv = idiv.querySelector('[data-table="%s-%s"]'.format(is_ipv6 ? 'ipv6' : 'ipv4', table)),
+ title = '%s: %s'.format(_('Table'), table);
+
+ if (!tdiv) {
+ tdiv = E('div', { 'data-table': '%s-%s'.format(is_ipv6 ? 'ipv6' : 'ipv4', table) }, [
+ E('h3', {}, title),
+ E('div')
+ ]);
- if (idiv.firstElementChild.nodeName.toLowerCase() === 'p')
- idiv.removeChild(idiv.firstElementChild);
+ if (idiv.firstElementChild.nodeName.toLowerCase() === 'p')
+ idiv.removeChild(idiv.firstElementChild);
- var added = false, thisIdx = table_names.indexOf(table);
+ var added = false, thisIdx = table_names.indexOf(table);
- idiv.querySelectorAll('[data-table]').forEach(function(child) {
- var childIdx = table_names.indexOf(child.getAttribute('data-table'));
+ idiv.querySelectorAll('[data-table]').forEach(function(child) {
+ var childIdx = table_names.indexOf(child.getAttribute('data-table').split(/-/)[1]);
- if (added === false && childIdx > thisIdx) {
- idiv.insertBefore(tdiv, child);
- added = true;
- }
- });
-
- if (added === false)
- idiv.appendChild(tdiv);
- }
-
- return tdiv.lastElementChild;
-}
-
-function create_chain_section(table, chain, policy, packets, bytes, references)
-{
- var tdiv = create_table_section(table),
- cdiv = tdiv.querySelector('[data-chain="%s"]'.format(chain)),
- title;
-
- if (policy)
- title = '%s %s (%s: %s, %d %s, %.2mB %s)'
- .format(_('Chain'), chain, _('Policy'), policy, packets, _('Packets'), bytes, _('Traffic'));
- else
- title = '%s %s (%d %s)'
- .format(_('Chain'), chain, references, _('References'));
-
- if (!cdiv) {
- cdiv = E('div', { 'data-chain': chain }, [
- E('h4', { 'id': 'rule_%s_%s'.format(table.toLowerCase(), chain) }, title),
- E('div', { 'class': 'table' }, [
- E('div', { 'class': 'tr table-titles' }, [
- E('div', { 'class': 'th center' }, _('Pkts.')),
- E('div', { 'class': 'th center' }, _('Traffic')),
- E('div', { 'class': 'th' }, _('Target')),
- E('div', { 'class': 'th' }, _('Prot.')),
- E('div', { 'class': 'th' }, _('In')),
- E('div', { 'class': 'th' }, _('Out')),
- E('div', { 'class': 'th' }, _('Source')),
- E('div', { 'class': 'th' }, _('Destination')),
- E('div', { 'class': 'th' }, _('Options')),
- E('div', { 'class': 'th' }, _('Comment'))
- ])
- ])
- ]);
+ if (added === false && childIdx > thisIdx) {
+ idiv.insertBefore(tdiv, child);
+ added = true;
+ }
+ });
- tdiv.appendChild(cdiv);
- }
- else {
- cdiv.firstElementChild.innerHTML = title;
- }
-
- return cdiv.lastElementChild;
-}
-
-function update_chain_section(chaintable, rows)
-{
- if (!chaintable)
- return;
-
- cbi_update_table(chaintable, rows, _('No rules in this chain.'));
-
- if (rows.length === 0 &&
- document.querySelector('form > [data-hide-empty="true"]'))
- chaintable.parentNode.style.display = 'none';
- else
- chaintable.parentNode.style.display = '';
-
- chaintable.parentNode.setAttribute('data-empty', rows.length === 0);
-}
-
-function hide_empty(btn)
-{
- var hide = (btn.getAttribute('data-hide-empty') === 'false');
-
- btn.setAttribute('data-hide-empty', hide);
- btn.value = hide ? _('Show empty chains') : _('Hide empty chains');
- btn.blur();
-
- document.querySelectorAll('[data-chain][data-empty="true"]')
- .forEach(function(chaintable) {
- chaintable.style.display = hide ? 'none' : '';
- });
-}
-
-function jump_target(ev)
-{
- var link = ev.target,
- table = findParent(link, '[data-table]').getAttribute('data-table'),
- chain = link.textContent,
- num = +link.getAttribute('data-num'),
- elem = document.getElementById('rule_%s_%s'.format(table.toLowerCase(), chain));
-
- if (elem) {
- (document.documentElement || document.body.parentNode || document.body).scrollTop = elem.offsetTop - 40;
- elem.classList.remove('flash');
- void elem.offsetWidth;
- elem.classList.add('flash');
-
- if (num) {
- var rule = elem.nextElementSibling.childNodes[num];
- if (rule) {
- rule.classList.remove('flash');
- void rule.offsetWidth;
- rule.classList.add('flash');
- }
+ if (added === false)
+ idiv.appendChild(tdiv);
}
- }
-}
-
-function parse_output(table, s)
-{
- var current_chain = null;
- var current_rules = [];
- var seen_chains = {};
- var chain_refs = {};
- var re = /([^\n]*)\n/g;
- var m, m2;
-
- while ((m = re.exec(s)) != null) {
- if (m[1].match(/^Chain (.+) \(policy (\w+) (\d+) packets, (\d+) bytes\)$/)) {
- var chain = RegExp.$1,
- policy = RegExp.$2,
- packets = +RegExp.$3,
- bytes = +RegExp.$4;
-
- update_chain_section(current_chain, current_rules);
-
- seen_chains[chain] = true;
- current_chain = create_chain_section(table, chain, policy, packets, bytes);
- current_rules = [];
- }
- else if (m[1].match(/^Chain (.+) \((\d+) references\)$/)) {
- var chain = RegExp.$1,
- references = +RegExp.$2;
- update_chain_section(current_chain, current_rules);
+ return tdiv.lastElementChild;
+ },
+
+ createChainSection: function(is_ipv6, table, chain, policy, packets, bytes, references) {
+ var tdiv = this.createTableSection(is_ipv6, table),
+ cdiv = tdiv.querySelector('[data-chain="%s"]'.format(chain)),
+ title;
+
+ if (policy)
+ title = '%s %s (%s: %s, %d %s, %.2mB %s)'
+ .format(_('Chain'), chain, _('Policy'), policy, packets, _('Packets'), bytes, _('Traffic'));
+ else
+ title = '%s %s (%d %s)'
+ .format(_('Chain'), chain, references, _('References'));
+
+ if (!cdiv) {
+ cdiv = E('div', { 'data-chain': chain }, [
+ E('h4', { 'id': 'rule_%s-%s_%s'.format(is_ipv6 ? 'ipv6' : 'ipv4', table.toLowerCase(), chain) }, title),
+ E('table', { 'class': 'table' }, [
+ E('tr', { 'class': 'tr table-titles' }, [
+ E('th', { 'class': 'th center' }, _('Pkts.')),
+ E('th', { 'class': 'th center' }, _('Traffic')),
+ E('th', { 'class': 'th' }, _('Target')),
+ E('th', { 'class': 'th' }, _('Prot.')),
+ E('th', { 'class': 'th' }, _('In')),
+ E('th', { 'class': 'th' }, _('Out')),
+ E('th', { 'class': 'th' }, _('Source')),
+ E('th', { 'class': 'th' }, _('Destination')),
+ E('th', { 'class': 'th' }, _('Options')),
+ E('th', { 'class': 'th' }, _('Comment'))
+ ])
+ ])
+ ]);
- seen_chains[chain] = true;
- current_chain = create_chain_section(table, chain, null, null, null, references);
- current_rules = [];
+ tdiv.appendChild(cdiv);
}
- else if (m[1].match(/^num /)) {
- continue;
+ else {
+ cdiv.firstElementChild.innerHTML = title;
}
- else if ((m2 = m[1].match(/^(\d+) +(\d+) +(\d+) +(.*?) +(\S+) +(\S*) +(\S+) +(\S+) +([a-f0-9:.]+(?:\/[a-f0-9:.]+)?) +([a-f0-9:.]+(?:\/[a-f0-9:.]+)?) +(.+)$/)) !== null) {
- var num = +m2[1],
- pkts = +m2[2],
- bytes = +m2[3],
- target = m2[4],
- proto = m2[5],
- indev = m2[7],
- outdev = m2[8],
- srcnet = m2[9],
- dstnet = m2[10],
- options = m2[11] || '-',
- comment = '-';
-
- options = options.trim().replace(/(?:^| )\/\* (.+) \*\//,
- function(m1, m2) {
- comment = m2.replace(/^!fw3(: |$)/, '').trim() || '-';
- return '';
- }) || '-';
-
- current_rules.push([
- '%.2m'.format(pkts).nobr(),
- '%.2mB'.format(bytes).nobr(),
- target ? '%s'.format(target) : '-',
- proto,
- (indev !== '*') ? '%s'.format(indev) : '*',
- (outdev !== '*') ? '%s'.format(outdev) : '*',
- srcnet,
- dstnet,
- options,
- comment
- ]);
- if (target) {
- chain_refs[target] = chain_refs[target] || [];
- chain_refs[target].push([ current_chain, num ]);
+ return cdiv.lastElementChild;
+ },
+
+ updateChainSection: function(chaintable, rows) {
+ if (!chaintable)
+ return;
+
+ cbi_update_table(chaintable, rows, _('No rules in this chain.'));
+
+ if (rows.length === 0 &&
+ document.querySelector('[data-hide-empty="true"]'))
+ chaintable.parentNode.style.display = 'none';
+ else
+ chaintable.parentNode.style.display = '';
+
+ chaintable.parentNode.setAttribute('data-empty', rows.length === 0);
+ },
+
+ parseIptablesDump: function(is_ipv6, table, s) {
+ var current_chain = null;
+ var current_rules = [];
+ var seen_chains = {};
+ var chain_refs = {};
+ var re = /([^\n]*)\n/g;
+ var m, m2;
+
+ while ((m = re.exec(s)) != null) {
+ if (m[1].match(/^Chain (.+) \(policy (\w+) (\d+) packets, (\d+) bytes\)$/)) {
+ var chain = RegExp.$1,
+ policy = RegExp.$2,
+ packets = +RegExp.$3,
+ bytes = +RegExp.$4;
+
+ this.updateChainSection(current_chain, current_rules);
+
+ seen_chains[chain] = true;
+ current_chain = this.createChainSection(is_ipv6, table, chain, policy, packets, bytes);
+ current_rules = [];
+ }
+ else if (m[1].match(/^Chain (.+) \((\d+) references\)$/)) {
+ var chain = RegExp.$1,
+ references = +RegExp.$2;
+
+ this.updateChainSection(current_chain, current_rules);
+
+ seen_chains[chain] = true;
+ current_chain = this.createChainSection(is_ipv6, table, chain, null, null, null, references);
+ current_rules = [];
+ }
+ else if (m[1].match(/^num /)) {
+ continue;
+ }
+ else if ((m2 = m[1].match(/^(\d+) +(\d+) +(\d+) +(.*?) +(\S+) +(\S*) +(\S+) +(\S+) +(!?[a-f0-9:.]+(?:\/[a-f0-9:.]+)?) +(!?[a-f0-9:.]+(?:\/[a-f0-9:.]+)?) +(.+)$/)) !== null) {
+ var num = +m2[1],
+ pkts = +m2[2],
+ bytes = +m2[3],
+ target = m2[4],
+ proto = m2[5],
+ indev = m2[7],
+ outdev = m2[8],
+ srcnet = m2[9],
+ dstnet = m2[10],
+ options = m2[11] || '-',
+ comment = '-';
+
+ options = options.trim().replace(/(?:^| )\/\* (.+) \*\//,
+ function(m1, m2) {
+ comment = m2.replace(/^!fw3(: |$)/, '').trim() || '-';
+ return '';
+ }) || '-';
+
+ current_rules.push([
+ '%.2m'.format(pkts).nobr(),
+ '%.2mB'.format(bytes).nobr(),
+ target ? '%s'.format(target) : '-',
+ proto,
+ (indev !== '*') ? '%s'.format(indev) : '*',
+ (outdev !== '*') ? '%s'.format(outdev) : '*',
+ srcnet,
+ dstnet,
+ options,
+ [ comment ]
+ ]);
+
+ if (target) {
+ chain_refs[target] = chain_refs[target] || [];
+ chain_refs[target].push([ current_chain, num ]);
+ }
}
}
- }
- update_chain_section(current_chain, current_rules);
+ this.updateChainSection(current_chain, current_rules);
- document.querySelectorAll('[data-table="%s"] [data-chain]'.format(table))
- .forEach(function(cdiv) {
+ document.querySelectorAll('[data-table="%s-%s"] [data-chain]'.format(is_ipv6 ? 'ipv6' : 'ipv4', table)).forEach(L.bind(function(cdiv) {
if (!seen_chains[cdiv.getAttribute('data-chain')]) {
cdiv.parentNode.removeChild(cdiv);
return;
}
- cdiv.querySelectorAll('.target').forEach(function(tspan) {
+ cdiv.querySelectorAll('.target').forEach(L.bind(function(tspan) {
if (seen_chains[tspan.textContent]) {
tspan.classList.add('jump');
- tspan.addEventListener('click', jump_target);
+ tspan.addEventListener('click', this.handleJumpTarget);
}
- });
+ }, this));
- cdiv.querySelectorAll('.references').forEach(function(rspan) {
+ cdiv.querySelectorAll('.references').forEach(L.bind(function(rspan) {
var refs = chain_refs[cdiv.getAttribute('data-chain')];
if (refs && refs.length) {
rspan.classList.add('cbi-tooltip-container');
rspan.appendChild(E('small', { 'class': 'cbi-tooltip ifacebadge', 'style': 'top:1em; left:auto' }, [ E('ul') ]));
- refs.forEach(function(ref) {
+ refs.forEach(L.bind(function(ref) {
var chain = ref[0].parentNode.getAttribute('data-chain'),
num = ref[1];
@@ -235,19 +201,136 @@ function parse_output(table, s)
E('span', {
'class': 'jump',
'data-num': num,
- 'onclick': 'jump_target(event)'
+ 'click': this.handleJumpTarget
}, chain),
', %s #%d'.format(_('Rule'), num)
]));
- });
+ }, this));
+ }
+ }, this));
+ }, this));
+ },
+
+ pollFirewallLists: function(has_ip6tables) {
+ var cmds = [ '/usr/sbin/iptables' ];
+
+ if (has_ip6tables)
+ cmds.push('/usr/sbin/ip6tables');
+
+ poll.add(L.bind(function() {
+ var tasks = [];
+
+ for (var i = 0; i < cmds.length; i++) {
+ for (var j = 0; j < table_names.length; j++) {
+ tasks.push(L.resolveDefault(
+ fs.exec_direct(cmds[i], [ '--line-numbers', '-w', '-nvxL', '-t', table_names[j].toLowerCase() ])
+ .then(this.parseIptablesDump.bind(this, i > 0, table_names[j]))));
+ }
+ }
+
+ return Promise.all(tasks);
+ }, this));
+ },
+
+ handleJumpTarget: function(ev) {
+ var link = ev.target,
+ table = findParent(link, '[data-table]').getAttribute('data-table'),
+ chain = link.textContent,
+ num = +link.getAttribute('data-num'),
+ elem = document.getElementById('rule_%s_%s'.format(table.toLowerCase(), chain));
+
+ if (elem) {
+ (document.documentElement || document.body.parentNode || document.body).scrollTop = elem.offsetTop - 40;
+ elem.classList.remove('flash');
+ void elem.offsetWidth;
+ elem.classList.add('flash');
+
+ if (num) {
+ var rule = elem.nextElementSibling.childNodes[num];
+ if (rule) {
+ rule.classList.remove('flash');
+ void rule.offsetWidth;
+ rule.classList.add('flash');
}
+ }
+ }
+ },
+
+ handleHideEmpty: function(ev) {
+ var btn = ev.currentTarget,
+ hide = (btn.getAttribute('data-hide-empty') === 'false');
+
+ btn.setAttribute('data-hide-empty', hide);
+ btn.firstChild.data = hide ? _('Show empty chains') : _('Hide empty chains');
+ btn.blur();
+
+ document.querySelectorAll('[data-chain][data-empty="true"]')
+ .forEach(function(chaintable) {
+ chaintable.style.display = hide ? 'none' : '';
});
- });
-}
-
-table_names.forEach(function(table) {
- L.poll(5, L.url('admin/status/iptables_dump', current_mode, table.toLowerCase()), null,
- function (xhr) {
- parse_output(table, xhr.responseText);
- });
+ },
+
+ handleCounterReset: function(has_ip6tables, ev) {
+ return Promise.all([
+ fs.exec('/usr/sbin/iptables', [ '-Z' ])
+ .catch(function(err) { ui.addNotification(null, E('p', {}, _('Unable to reset iptables counters: %s').format(err.message))) }),
+ has_ip6tables ? fs.exec('/usr/sbin/ip6tables', [ '-Z' ])
+ .catch(function(err) { ui.addNotification(null, E('p', {}, _('Unable to reset ip6tables counters: %s').format(err.message))) }) : null
+ ]);
+ },
+
+ handleRestart: function(ev) {
+ return fs.exec_direct('/etc/init.d/firewall', [ 'restart' ])
+ .catch(function(err) { ui.addNotification(null, E('p', {}, _('Unable to restart firewall: %s').format(err.message))) });
+ },
+
+ render: function(has_ip6tables) {
+ var view = E([], [
+ E('style', { 'type': 'text/css' }, [
+ '.cbi-tooltip-container, span.jump { border-bottom:1px dotted #00f;cursor:pointer }',
+ 'ul { list-style:none }',
+ '.references { position:relative }',
+ '.references .cbi-tooltip { left:0!important;top:1.5em!important }',
+ 'h4>span { font-size:90% }'
+ ]),
+
+ E('h2', {}, [ _('Firewall Status') ]),
+ E('div', { 'class': 'right', 'style': 'margin-bottom:-1.5em' }, [
+ E('button', {
+ 'class': 'cbi-button',
+ 'data-hide-empty': false,
+ 'click': ui.createHandlerFn(this, 'handleHideEmpty')
+ }, [ _('Hide empty chains') ]),
+ ' ',
+ E('button', {
+ 'class': 'cbi-button',
+ 'click': ui.createHandlerFn(this, 'handleCounterReset', has_ip6tables)
+ }, [ _('Reset Counters') ]),
+ ' ',
+ E('button', {
+ 'class': 'cbi-button',
+ 'click': ui.createHandlerFn(this, 'handleRestart')
+ }, [ _('Restart Firewall') ])
+ ]),
+ E('div', {}, [
+ E('div', { 'data-tab': 'iptables', 'data-tab-title': has_ip6tables ? _('IPv4 Firewall') : null }, [
+ E('p', {}, E('em', { 'class': 'spinning' }, [ _('Collecting data...') ]))
+ ]),
+ has_ip6tables ? E('div', { 'data-tab': 'ip6tables', 'data-tab-title': _('IPv6 Firewall') }, [
+ E('p', {}, E('em', { 'class': 'spinning' }, [ _('Collecting data...') ]))
+ ]) : E([])
+ ])
+ ]);
+
+ if (has_ip6tables)
+ ui.tabs.initTabGroup(view.lastElementChild.childNodes);
+
+ this.pollFirewallLists(has_ip6tables);
+
+ return view;
+ },
+
+ handleSaveApply: null,
+ handleSave: null,
+ handleReset: null
});