luci-base: widgets.js: CBIZoneSelect: improve initial rendering

Ref: https://github.com/openwrt/luci/issues/2889
Signed-off-by: Jo-Philipp Wich <jo@mein.io>

1 files changed, 18 insertions, 13 deletions

diff --git a/modules/luci-base/htdocs/luci-static/resources/tools/widgets.js b/modules/luci-base/htdocs/luci-static/resources/tools/widgets.js
index e79cb2aeff..3de1f8258e 100644
--- a/modules/luci-base/htdocs/luci-static/resources/tools/widgets.js
+++ b/modules/luci-base/htdocs/luci-static/resources/tools/widgets.js
@@ -30,8 +30,22 @@ var CBIZoneSelect = form.ListValue.extend({
 
 	renderWidget: function(section_id, option_index, cfgvalue) {
 		var values = L.toArray((cfgvalue != null) ? cfgvalue : this.default),
+		    isOutputOnly = false,
 		    choices = {};
 
+		if (this.option == 'dest') {
+			for (var i = 0; i < this.section.children.length; i++) {
+				var opt = this.section.children[i];
+				if (opt.option == 'src') {
+					var val = opt.cfgvalue(section_id) || opt.default;
+					isOutputOnly = (val == null || val == '');
+					break;
+				}
+			}
+
+			this.title = isOutputOnly ? _('Output zone') :  _('Destination zone');
+		}
+
 		if (this.allowlocal) {
 			choices[''] = E('span', {
 				'class': 'zonebadge',
@@ -55,7 +69,7 @@ var CBIZoneSelect = form.ListValue.extend({
 				'style': 'background-color:' + firewall.getColorForName(null)
 			}, [
 				E('strong', _('Any zone')),
-				(this.allowany && this.allowlocal && this.option != 'src') ? ' (%s)'.format(_('forward')) : ''
+				(this.allowany && this.allowlocal && !isOutputOnly) ? ' (%s)'.format(_('forward')) : ''
 			]);
 		}
 
@@ -172,18 +186,9 @@ var CBIZoneSelect = form.ListValue.extend({
 
 			}, this));
 		}
-		else if (this.option == 'dest') {
-			for (var i = 0; i < this.section.children.length; i++) {
-				var opt = this.section.children[i];
-				if (opt.option == 'src') {
-					if (!opt.cfgvalue(section_id) && !opt.default) {
-						var emptyval = elem.querySelector('[data-value=""]');
-
-						if (emptyval != null)
-							emptyval.parentNode.removeChild(emptyval);
-					}
-				}
-			}
+		else if (isOutputOnly) {
+			var emptyval = elem.querySelector('[data-value=""]');
+			emptyval.parentNode.removeChild(emptyval);
 		}
 
 		return elem;