diff options
Diffstat (limited to 'modules/luci-mod-status/htdocs/luci-static/resources/view/status/iptables.js')
| -rw-r--r-- | modules/luci-mod-status/htdocs/luci-static/resources/view/status/iptables.js | 503 |
1 files changed, 291 insertions, 212 deletions
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 966cd560c..04abcba9d 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,196 @@ -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 fs'; +'require ui'; + +var table_names = [ 'Filter', 'NAT', 'Mangle', 'Raw' ]; + +return L.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 <em>%s</em> <span>(%s: <em>%s</em>, %d %s, %.2mB %s)</span>' - .format(_('Chain'), chain, _('Policy'), policy, packets, _('Packets'), bytes, _('Traffic')); - else - title = '%s <em>%s</em> <span class="references">(%d %s)</span>' - .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 <em>%s</em> <span>(%s: <em>%s</em>, %d %s, %.2mB %s)</span>' + .format(_('Chain'), chain, _('Policy'), policy, packets, _('Packets'), bytes, _('Traffic')); + else + title = '%s <em>%s</em> <span class="references">(%d %s)</span>' + .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('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')) + ]) + ]) + ]); - 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 ? '<span class="target">%s</span>'.format(target) : '-', - proto, - (indev !== '*') ? '<span class="ifacebadge">%s</span>'.format(indev) : '*', - (outdev !== '*') ? '<span class="ifacebadge">%s</span>'.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 ? '<span class="target">%s</span>'.format(target) : '-', + proto, + (indev !== '*') ? '<span class="ifacebadge">%s</span>'.format(indev) : '*', + (outdev !== '*') ? '<span class="ifacebadge">%s</span>'.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,21 +199,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'); + + L.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.add(function() { - var cmd = (current_mode == 6) ? '/usr/sbin/ip6tables' : '/usr/sbin/iptables'; - return L.fs.exec_direct(cmd, [ '--line-numbers', '-w', '-nvxL', '-t', table.toLowerCase() ]).then(function(output) { - parse_output(table, output); - }); - }, 5); + }, + + 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 }); |