diff options
Diffstat (limited to 'modules/luci-base/htdocs/luci-static')
8 files changed, 72 insertions, 19 deletions
diff --git a/modules/luci-base/htdocs/luci-static/resources/cbi.js b/modules/luci-base/htdocs/luci-static/resources/cbi.js index aef64d577e..9200954d1e 100644 --- a/modules/luci-base/htdocs/luci-static/resources/cbi.js +++ b/modules/luci-base/htdocs/luci-static/resources/cbi.js @@ -777,7 +777,7 @@ function cbi_update_table(table, data, placeholder) { var td = trow.appendChild(E('td', { 'class': titles[i].className, 'data-title': (text !== '') ? text : null - }, row[i] || '')); + }, (row[i] != null) ? row[i] : '')); td.classList.remove('th'); td.classList.add('td'); diff --git a/modules/luci-base/htdocs/luci-static/resources/firewall.js b/modules/luci-base/htdocs/luci-static/resources/firewall.js index 4fa4954ba6..a682af46d0 100644 --- a/modules/luci-base/htdocs/luci-static/resources/firewall.js +++ b/modules/luci-base/htdocs/luci-static/resources/firewall.js @@ -224,7 +224,17 @@ Firewall = L.Class.extend({ }, this)); }, - getColorForName: getColorForName + getColorForName: getColorForName, + + getZoneColorStyle: function(zone) { + var hex = (zone instanceof Zone) ? zone.getColor() : getColorForName((zone != null && zone != '*') ? zone : null); + + return '--zone-color-rgb:%d, %d, %d; background-color:rgb(var(--zone-color-rgb))'.format( + parseInt(hex.substring(1, 3), 16), + parseInt(hex.substring(3, 5), 16), + parseInt(hex.substring(5, 7), 16) + ); + }, }); diff --git a/modules/luci-base/htdocs/luci-static/resources/form.js b/modules/luci-base/htdocs/luci-static/resources/form.js index 4016007742..cf09a1da90 100644 --- a/modules/luci-base/htdocs/luci-static/resources/form.js +++ b/modules/luci-base/htdocs/luci-static/resources/form.js @@ -601,7 +601,7 @@ var CBIMap = CBIAbstractElement.extend(/** @lends LuCI.form.Map.prototype */ { if (!silent) { ui.showModal(_('Save error'), [ E('p', {}, [ _('An error occurred while saving the form:') ]), - E('p', {}, [ E('em', { 'style': 'white-space:pre' }, [ e.message ]) ]), + E('p', {}, [ E('em', { 'style': 'white-space:pre-wrap' }, [ e.message ]) ]), E('div', { 'class': 'right' }, [ E('button', { 'class': 'cbi-button', 'click': ui.hideModal }, [ _('Dismiss') ]) ]) @@ -1911,6 +1911,20 @@ var CBIAbstractValue = CBIAbstractElement.extend(/** @lends LuCI.form.AbstractVa }, /** + * Returns the current validation error for this input. + * + * @param {string} section_id + * The configuration section ID + * + * @returns {string} + * The validation error at this time + */ + getValidationError: function (section_id) { + var elem = this.getUIElement(section_id); + return elem ? elem.getValidationError() : ''; + }, + + /** * Test whether the option element is currently active. * * An element is active when it is not hidden due to unsatisfied dependency @@ -1971,7 +1985,9 @@ var CBIAbstractValue = CBIAbstractElement.extend(/** @lends LuCI.form.AbstractVa if (active && !this.isValid(section_id)) { var title = this.stripTags(this.title).trim(); - return Promise.reject(new TypeError(_('Option "%s" contains an invalid input value.').format(title || this.option))); + var error = this.getValidationError(section_id); + return Promise.reject(new TypeError( + _('Option "%s" contains an invalid input value.').format(title || this.option) + ' ' + error)); } if (fval != '' && fval != null) { @@ -3877,7 +3893,9 @@ var CBIFlagValue = CBIValue.extend(/** @lends LuCI.form.FlagValue.prototype */ { if (!this.isValid(section_id)) { var title = this.stripTags(this.title).trim(); - return Promise.reject(new TypeError(_('Option "%s" contains an invalid input value.').format(title || this.option))); + var error = this.getValidationError(section_id); + return Promise.reject(new TypeError( + _('Option "%s" contains an invalid input value.').format(title || this.option) + ' ' + error)); } if (fval == this.default && (this.optional || this.rmempty)) diff --git a/modules/luci-base/htdocs/luci-static/resources/luci.js b/modules/luci-base/htdocs/luci-static/resources/luci.js index 5699c9eb92..fcab3a4018 100644 --- a/modules/luci-base/htdocs/luci-static/resources/luci.js +++ b/modules/luci-base/htdocs/luci-static/resources/luci.js @@ -764,7 +764,7 @@ if (opt.content != null) { switch (typeof(opt.content)) { case 'function': - content = opt.content(xhr); + content = opt.content(opt.xhr); break; case 'object': diff --git a/modules/luci-base/htdocs/luci-static/resources/network.js b/modules/luci-base/htdocs/luci-static/resources/network.js index 2a402bcd57..8c9ee255ff 100644 --- a/modules/luci-base/htdocs/luci-static/resources/network.js +++ b/modules/luci-base/htdocs/luci-static/resources/network.js @@ -1149,7 +1149,7 @@ Network = baseclass.extend(/** @lends LuCI.network.prototype */ { if (name == null) return null; - if (_state.netdevs.hasOwnProperty(name) || isWifiIfname(name)) + if (_state.netdevs.hasOwnProperty(name)) return this.instantiateDevice(name); var netid = getWifiNetidBySid(name); 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 35a4dc8ec9..10b65be8ec 100644 --- a/modules/luci-base/htdocs/luci-static/resources/tools/widgets.js +++ b/modules/luci-base/htdocs/luci-static/resources/tools/widgets.js @@ -62,27 +62,27 @@ var CBIZoneSelect = form.ListValue.extend({ if (this.allowlocal) { choices[''] = E('span', { 'class': 'zonebadge', - 'style': 'background-color:' + firewall.getColorForName(null) + 'style': firewall.getZoneColorStyle(null) }, [ E('strong', _('Device')), (this.allowany || this.allowlocal) - ? ' (%s)'.format(this.option != 'dest' ? _('output') : _('input')) : '' + ? E('span', ' (%s)'.format(this.option != 'dest' ? _('output') : _('input'))) : '' ]); } else if (!this.multiple && (this.rmempty || this.optional)) { choices[''] = E('span', { 'class': 'zonebadge', - 'style': 'background-color:' + firewall.getColorForName(null) + 'style': firewall.getZoneColorStyle(null) }, E('em', _('unspecified'))); } if (this.allowany) { choices['*'] = E('span', { 'class': 'zonebadge', - 'style': 'background-color:' + firewall.getColorForName(null) + 'style': firewall.getZoneColorStyle(null) }, [ E('strong', _('Any zone')), - (this.allowany && this.allowlocal && !isOutputOnly) ? ' (%s)'.format(_('forward')) : '' + (this.allowany && this.allowlocal && !isOutputOnly) ? E('span', ' (%s)'.format(_('forward'))) : '' ]); } @@ -125,7 +125,7 @@ var CBIZoneSelect = form.ListValue.extend({ choices[name] = E('span', { 'class': 'zonebadge', - 'style': 'background-color:' + zone.getColor() + 'style': firewall.getZoneColorStyle(zone) }, [ E('strong', name) ].concat(ifaces)); } @@ -188,11 +188,11 @@ var CBIZoneSelect = form.ListValue.extend({ } L.dom.content(emptyval.querySelector('span'), [ - E('strong', _('Device')), ' (%s)'.format(_('input')) + E('strong', _('Device')), E('span', ' (%s)'.format(_('input'))) ]); L.dom.content(anyval.querySelector('span'), [ - E('strong', _('Any zone')), ' (%s)'.format(_('forward')) + E('strong', _('Any zone')), E('span', ' (%s)'.format(_('forward'))) ]); anyval.parentNode.insertBefore(emptyval, anyval); @@ -283,7 +283,7 @@ var CBIZoneForwards = form.DummyValue.extend({ return E('label', { 'class': 'zonebadge cbi-tooltip-container', - 'style': 'background-color:' + zone.getColor() + 'style': firewall.getZoneColorStyle(zone) }, [ E('strong', name), E('div', { 'class': 'cbi-tooltip' }, ifaces) diff --git a/modules/luci-base/htdocs/luci-static/resources/ui.js b/modules/luci-base/htdocs/luci-static/resources/ui.js index 9cc62c12db..9f3e74b935 100644 --- a/modules/luci-base/htdocs/luci-static/resources/ui.js +++ b/modules/luci-base/htdocs/luci-static/resources/ui.js @@ -156,6 +156,18 @@ var UIElement = baseclass.extend(/** @lends LuCI.ui.AbstractElement.prototype */ }, /** + * Returns the current validation error + * + * @instance + * @memberof LuCI.ui.AbstractElement + * @returns {string} + * The validation error at this time + */ + getValidationError: function() { + return this.validationError || ''; + }, + + /** * Force validation of the current input value. * * Usually input validation is automatically triggered by various DOM events @@ -243,10 +255,12 @@ var UIElement = baseclass.extend(/** @lends LuCI.ui.AbstractElement.prototype */ this.node.addEventListener('validation-success', L.bind(function(ev) { this.validState = true; + this.validationError = ''; }, this)); this.node.addEventListener('validation-failure', L.bind(function(ev) { this.validState = false; + this.validationError = ev.detail.message; }, this)); }, diff --git a/modules/luci-base/htdocs/luci-static/resources/validation.js b/modules/luci-base/htdocs/luci-static/resources/validation.js index fccce4ab0b..6dddf964fb 100644 --- a/modules/luci-base/htdocs/luci-static/resources/validation.js +++ b/modules/luci-base/htdocs/luci-static/resources/validation.js @@ -61,9 +61,15 @@ var Validator = baseclass.extend({ valid = this.vstack[0].apply(this, this.vstack[1]); if (valid !== true) { - this.field.setAttribute('data-tooltip', _('Expecting: %s').format(this.error)); + var message = _('Expecting: %s').format(this.error); + this.field.setAttribute('data-tooltip', message); this.field.setAttribute('data-tooltip-style', 'error'); - this.field.dispatchEvent(new CustomEvent('validation-failure', { bubbles: true })); + this.field.dispatchEvent(new CustomEvent('validation-failure', { + bubbles: true, + detail: { + message: message + } + })); return false; } @@ -74,7 +80,12 @@ var Validator = baseclass.extend({ this.assert(false, valid); this.field.setAttribute('data-tooltip', valid); this.field.setAttribute('data-tooltip-style', 'error'); - this.field.dispatchEvent(new CustomEvent('validation-failure', { bubbles: true })); + this.field.dispatchEvent(new CustomEvent('validation-failure', { + bubbles: true, + detail: { + message: valid + } + })); return false; } |