7 var CBIZoneSelect = form.ListValue.extend({
8 __name__: 'CBI.ZoneSelect',
10 load: function(section_id) {
11 return Promise.all([ firewall.getZones(), network.getNetworks() ]).then(L.bind(function(zn) {
13 this.networks = zn[1];
15 return this.super('load', section_id);
19 filter: function(section_id, value) {
23 lookupZone: function(name) {
24 return this.zones.filter(function(zone) { return zone.getName() == name })[0];
27 lookupNetwork: function(name) {
28 return this.networks.filter(function(network) { return network.getName() == name })[0];
31 renderWidget: function(section_id, option_index, cfgvalue) {
32 var values = L.toArray((cfgvalue != null) ? cfgvalue : this.default),
35 if (this.allowlocal) {
36 choices[''] = E('span', {
38 'style': 'background-color:' + firewall.getColorForName(null)
40 E('strong', _('Device')),
41 (this.allowany || this.allowlocal)
42 ? ' (%s)'.format(this.alias != 'dest' ? _('output') : _('input')) : ''
45 else if (!this.multiple && (this.rmempty || this.optional)) {
46 choices[''] = E('span', {
48 'style': 'background-color:' + firewall.getColorForName(null)
49 }, E('em', _('unspecified')));
53 choices['*'] = E('span', {
55 'style': 'background-color:' + firewall.getColorForName(null)
57 E('strong', _('Any zone')),
58 (this.allowany && this.allowlocal) ? ' (%s)'.format(_('forward')) : ''
62 for (var i = 0; i < this.zones.length; i++) {
63 var zone = this.zones[i],
64 name = zone.getName(),
65 networks = zone.getNetworks(),
68 if (!this.filter(section_id, name))
71 for (var j = 0; j < networks.length; j++) {
72 var network = this.lookupNetwork(networks[j]);
77 var span = E('span', {
78 'class': 'ifacebadge' + (network.getName() == this.network ? ' ifacebadge-active' : '')
79 }, network.getName() + ': ');
81 var devices = network.isBridge() ? network.getDevices() : L.toArray(network.getDevice());
83 for (var k = 0; k < devices.length; k++) {
84 span.appendChild(E('img', {
85 'title': devices[k].getI18n(),
86 'src': L.resource('icons/%s%s.png'.format(devices[k].getType(), devices[k].isUp() ? '' : '_disabled'))
91 span.appendChild(E('em', _('(empty)')));
97 ifaces.push(E('em', _('(empty)')));
99 choices[name] = E('span', {
100 'class': 'zonebadge',
101 'style': 'background-color:' + zone.getColor()
102 }, [ E('strong', name) ].concat(ifaces));
105 var widget = new ui.Dropdown(values, choices, {
106 id: this.cbid(section_id),
108 multiple: this.multiple,
109 optional: this.optional || this.rmempty,
110 select_placeholder: E('em', _('unspecified')),
111 display_items: this.display_size || this.size || 3,
112 dropdown_items: this.dropdown_size || this.size || 5,
113 validate: L.bind(this.validate, this, section_id),
114 create: !this.nocreate,
116 '<li data-value="{{value}}">' +
117 '<span class="zonebadge" style="background:repeating-linear-gradient(45deg,rgba(204,204,204,0.5),rgba(204,204,204,0.5) 5px,rgba(255,255,255,0.5) 5px,rgba(255,255,255,0.5) 10px)">' +
118 '<strong>{{value}}:</strong> <em>('+_('create')+')</em>' +
123 return widget.render();
127 var CBIZoneForwards = form.DummyValue.extend({
128 __name__: 'CBI.ZoneForwards',
130 load: function(section_id) {
131 return Promise.all([ firewall.getDefaults(), firewall.getZones(), network.getNetworks() ]).then(L.bind(function(dzn) {
132 this.defaults = dzn[0];
134 this.networks = dzn[2];
136 return this.super('load', section_id);
140 renderZone: function(zone) {
141 var name = zone.getName(),
142 networks = zone.getNetworks(),
145 for (var j = 0; j < networks.length; j++) {
146 var network = this.networks.filter(function(net) { return net.getName() == networks[j] })[0];
151 var span = E('span', {
152 'class': 'ifacebadge' + (network.getName() == this.network ? ' ifacebadge-active' : '')
153 }, network.getName() + ': ');
155 var devices = network.isBridge() ? network.getDevices() : L.toArray(network.getDevice());
157 for (var k = 0; k < devices.length && devices[k]; k++) {
158 span.appendChild(E('img', {
159 'title': devices[k].getI18n(),
160 'src': L.resource('icons/%s%s.png'.format(devices[k].getType(), devices[k].isUp() ? '' : '_disabled'))
165 span.appendChild(E('em', _('(empty)')));
171 ifaces.push(E('span', { 'class': 'ifacebadge' }, E('em', _('(empty)'))));
174 'class': 'zonebadge cbi-tooltip-container',
175 'style': 'background-color:' + zone.getColor()
178 E('div', { 'class': 'cbi-tooltip' }, ifaces)
182 renderWidget: function(section_id, option_index, cfgvalue) {
183 var value = (cfgvalue != null) ? cfgvalue : this.default,
184 zone = this.zones.filter(function(z) { return z.getName() == value })[0];
189 var forwards = zone.getForwardingsBy('src'),
192 for (var i = 0; i < forwards.length; i++) {
193 var dzone = forwards[i].getDestinationZone();
198 dzones.push(this.renderZone(dzone));
202 dzones.push(E('label', { 'class': 'zonebadge zonebadge-empty' },
203 E('strong', this.defaults.getForward())));
205 return E('div', { 'class': 'zone-forwards' }, [
206 E('div', { 'class': 'zone-src' }, this.renderZone(zone)),
208 E('div', { 'class': 'zone-dest' }, dzones)
213 var CBINetworkSelect = form.ListValue.extend({
214 __name__: 'CBI.NetworkSelect',
216 load: function(section_id) {
217 return network.getNetworks().then(L.bind(function(networks) {
218 this.networks = networks;
220 return this.super('load', section_id);
224 filter: function(section_id, value) {
228 renderIfaceBadge: function(network) {
229 var span = E('span', { 'class': 'ifacebadge' }, network.getName() + ': '),
230 devices = network.isBridge() ? network.getDevices() : L.toArray(network.getDevice());
232 for (var j = 0; j < devices.length && devices[j]; j++) {
233 span.appendChild(E('img', {
234 'title': devices[j].getI18n(),
235 'src': L.resource('icons/%s%s.png'.format(devices[j].getType(), devices[j].isUp() ? '' : '_disabled'))
239 if (!devices.length) {
240 span.appendChild(E('em', { 'class': 'hide-close' }, _('(no interfaces attached)')));
241 span.appendChild(E('em', { 'class': 'hide-open' }, '-'));
247 renderWidget: function(section_id, option_index, cfgvalue) {
248 var values = L.toArray((cfgvalue != null) ? cfgvalue : this.default),
252 for (var i = 0; i < values.length; i++)
253 checked[values[i]] = true;
257 if (!this.multiple && (this.rmempty || this.optional))
258 choices[''] = E('em', _('unspecified'));
260 for (var i = 0; i < this.networks.length; i++) {
261 var network = this.networks[i],
262 name = network.getName();
264 if (name == 'loopback' || !this.filter(section_id, name))
267 if (this.novirtual && network.isVirtual())
273 choices[name] = this.renderIfaceBadge(network);
276 var widget = new ui.Dropdown(this.multiple ? values : values[0], choices, {
277 id: this.cbid(section_id),
279 multiple: this.multiple,
280 optional: this.optional || this.rmempty,
281 select_placeholder: E('em', _('unspecified')),
282 display_items: this.display_size || this.size || 3,
283 dropdown_items: this.dropdown_size || this.size || 5,
284 validate: L.bind(this.validate, this, section_id),
285 create: !this.nocreate,
287 '<li data-value="{{value}}">' +
288 '<span class="ifacebadge" style="background:repeating-linear-gradient(45deg,rgba(204,204,204,0.5),rgba(204,204,204,0.5) 5px,rgba(255,255,255,0.5) 5px,rgba(255,255,255,0.5) 10px)">' +
289 '{{value}}: <em>('+_('create')+')</em>' +
294 return widget.render();
297 textvalue: function(section_id) {
298 var cfgvalue = this.cfgvalue(section_id),
299 values = L.toArray((cfgvalue != null) ? cfgvalue : this.default),
302 for (var i = 0; i < (this.networks || []).length; i++) {
303 var network = this.networks[i],
304 name = network.getName();
306 if (values.indexOf(name) == -1)
310 L.dom.append(rv, ' ');
312 L.dom.append(rv, this.renderIfaceBadge(network));
316 rv.appendChild(E('em', _('unspecified')));
323 return L.Class.extend({
324 ZoneSelect: CBIZoneSelect,
325 ZoneForwards: CBIZoneForwards,
326 NetworkSelect: CBINetworkSelect