LuCI - Lua Configuration Interface
Copyright 2008 Steven Barth <steven@midlink.org>
- Copyright 2008-2012 Jo-Philipp Wich <jow@openwrt.org>
+ Copyright 2008-2018 Jo-Philipp Wich <jo@mein.io>
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
*/
var cbi_d = [];
-var cbi_t = [];
var cbi_strings = { path: {}, label: {} };
+function s8(bytes, off) {
+ var n = bytes[off];
+ return (n > 0x7F) ? (n - 256) >>> 0 : n;
+}
+
+function u16(bytes, off) {
+ return ((bytes[off + 1] << 8) + bytes[off]) >>> 0;
+}
+
+function sfh(s) {
+ if (s === null || s.length === 0)
+ return null;
+
+ var bytes = [];
+
+ for (var i = 0; i < s.length; i++) {
+ var ch = s.charCodeAt(i);
+
+ if (ch <= 0x7F)
+ bytes.push(ch);
+ else if (ch <= 0x7FF)
+ bytes.push(((ch >>> 6) & 0x1F) | 0xC0,
+ ( ch & 0x3F) | 0x80);
+ else if (ch <= 0xFFFF)
+ bytes.push(((ch >>> 12) & 0x0F) | 0xE0,
+ ((ch >>> 6) & 0x3F) | 0x80,
+ ( ch & 0x3F) | 0x80);
+ else if (code <= 0x10FFFF)
+ bytes.push(((ch >>> 18) & 0x07) | 0xF0,
+ ((ch >>> 12) & 0x3F) | 0x80,
+ ((ch >> 6) & 0x3F) | 0x80,
+ ( ch & 0x3F) | 0x80);
+ }
+
+ if (!bytes.length)
+ return null;
+
+ var hash = (bytes.length >>> 0),
+ len = (bytes.length >>> 2),
+ off = 0, tmp;
+
+ while (len--) {
+ hash += u16(bytes, off);
+ tmp = ((u16(bytes, off + 2) << 11) ^ hash) >>> 0;
+ hash = ((hash << 16) ^ tmp) >>> 0;
+ hash += hash >>> 11;
+ off += 4;
+ }
+
+ switch ((bytes.length & 3) >>> 0) {
+ case 3:
+ hash += u16(bytes, off);
+ hash = (hash ^ (hash << 16)) >>> 0;
+ hash = (hash ^ (s8(bytes, off + 2) << 18)) >>> 0;
+ hash += hash >>> 11;
+ break;
+
+ case 2:
+ hash += u16(bytes, off);
+ hash = (hash ^ (hash << 11)) >>> 0;
+ hash += hash >>> 17;
+ break;
+
+ case 1:
+ hash += s8(bytes, off);
+ hash = (hash ^ (hash << 10)) >>> 0;
+ hash += hash >>> 1;
+ break;
+ }
+
+ hash = (hash ^ (hash << 3)) >>> 0;
+ hash += hash >>> 5;
+ hash = (hash ^ (hash << 4)) >>> 0;
+ hash += hash >>> 17;
+ hash = (hash ^ (hash << 25)) >>> 0;
+ hash += hash >>> 6;
+
+ return (0x100000000 + hash).toString(16).substr(1);
+}
+
+function _(s) {
+ return (window.TR && TR[sfh(s)]) || s;
+}
+
function Int(x) {
return (/^-?\d+$/.test(x) ? +x : NaN);
}
return (/^-?\d+(?:\.\d+)?$/.test(x) ? +x : NaN);
}
-var cbi_validators = {
+function IPv4(x) {
+ if (!x.match(/^(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})$/))
+ return null;
- 'integer': function()
- {
- return !!Int(this);
- },
+ if (RegExp.$1 > 255 || RegExp.$2 > 255 || RegExp.$3 > 255 || RegExp.$4 > 255)
+ return null;
- 'uinteger': function()
- {
- return (Int(this) >= 0);
- },
+ return [ +RegExp.$1, +RegExp.$2, +RegExp.$3, +RegExp.$4 ];
+}
- 'float': function()
- {
- return !!Dec(this);
- },
+function IPv6(x) {
+ if (x.match(/^([a-fA-F0-9:]+):(\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3})$/)) {
+ var v6 = RegExp.$1, v4 = IPv4(RegExp.$2);
- 'ufloat': function()
- {
- return (Dec(this) >= 0);
- },
+ if (!v4)
+ return null;
- 'ipaddr': function()
- {
- return cbi_validators.ip4addr.apply(this) ||
- cbi_validators.ip6addr.apply(this);
- },
+ x = v6 + ':' + (v4[0] * 256 + v4[1]).toString(16)
+ + ':' + (v4[2] * 256 + v4[3]).toString(16);
+ }
- 'ip4addr': function()
- {
- if (this.match(/^(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})(\/(\S+))?$/))
- {
- return (RegExp.$1 >= 0) && (RegExp.$1 <= 255) &&
- (RegExp.$2 >= 0) && (RegExp.$2 <= 255) &&
- (RegExp.$3 >= 0) && (RegExp.$3 <= 255) &&
- (RegExp.$4 >= 0) && (RegExp.$4 <= 255) &&
- ((RegExp.$6.indexOf('.') < 0)
- ? ((RegExp.$6 >= 0) && (RegExp.$6 <= 32))
- : (cbi_validators.ip4addr.apply(RegExp.$6)))
- ;
- }
+ if (!x.match(/^[a-fA-F0-9:]+$/))
+ return null;
- return false;
- },
+ var prefix_suffix = x.split(/::/);
- 'ip6addr': function()
- {
- if( this.match(/^([a-fA-F0-9:.]+)(\/(\d+))?$/) )
- {
- if( !RegExp.$2 || ((RegExp.$3 >= 0) && (RegExp.$3 <= 128)) )
- {
- var addr = RegExp.$1;
+ if (prefix_suffix.length > 2)
+ return null;
- if( addr == '::' )
- {
- return true;
- }
+ var prefix = (prefix_suffix[0] || '0').split(/:/);
+ var suffix = prefix_suffix.length > 1 ? (prefix_suffix[1] || '0').split(/:/) : [];
- if( addr.indexOf('.') > 0 )
- {
- var off = addr.lastIndexOf(':');
+ if (suffix.length ? (prefix.length + suffix.length > 7)
+ : ((prefix_suffix.length < 2 && prefix.length < 8) || prefix.length > 8))
+ return null;
- if( !(off && cbi_validators.ip4addr.apply(addr.substr(off+1))) )
- return false;
+ var i, word;
+ var words = [];
- addr = addr.substr(0, off) + ':0:0';
- }
+ for (i = 0, word = parseInt(prefix[0], 16); i < prefix.length; word = parseInt(prefix[++i], 16))
+ if (prefix[i].length <= 4 && !isNaN(word) && word <= 0xFFFF)
+ words.push(word);
+ else
+ return null;
- if( addr.indexOf('::') >= 0 )
- {
- var colons = 0;
- var fill = '0';
+ for (i = 0; i < (8 - prefix.length - suffix.length); i++)
+ words.push(0);
- for( var i = 1; i < (addr.length-1); i++ )
- if( addr.charAt(i) == ':' )
- colons++;
+ for (i = 0, word = parseInt(suffix[0], 16); i < suffix.length; word = parseInt(suffix[++i], 16))
+ if (suffix[i].length <= 4 && !isNaN(word) && word <= 0xFFFF)
+ words.push(word);
+ else
+ return null;
- if( colons > 7 )
- return false;
+ return words;
+}
- for( var i = 0; i < (7 - colons); i++ )
- fill += ':0';
+var CBIValidatorPrototype = {
+ apply: function(name, value, args) {
+ var func;
- if (addr.match(/^(.*?)::(.*?)$/))
- addr = (RegExp.$1 ? RegExp.$1 + ':' : '') + fill +
- (RegExp.$2 ? ':' + RegExp.$2 : '');
- }
+ if (typeof(name) === 'function')
+ func = name;
+ else if (typeof(this.types[name]) === 'function')
+ func = this.types[name];
+ else
+ return false;
- return (addr.match(/^(?:[a-fA-F0-9]{1,4}:){7}[a-fA-F0-9]{1,4}$/) != null);
- }
- }
+ if (value !== undefined && value !== null)
+ this.value = value;
- return false;
+ return func.apply(this, args);
},
- 'ip4prefix': function()
- {
- return !isNaN(this) && this >= 0 && this <= 32;
- },
+ assert: function(condition, message) {
+ if (!condition) {
+ this.field.classList.add('cbi-input-invalid');
+ this.error = message;
+ return false;
+ }
- 'ip6prefix': function()
- {
- return !isNaN(this) && this >= 0 && this <= 128;
+ this.field.classList.remove('cbi-input-invalid');
+ this.error = null;
+ return true;
},
- 'cidr': function()
- {
- return cbi_validators.cidr4.apply(this) ||
- cbi_validators.cidr6.apply(this);
- },
+ compile: function(code) {
+ var pos = 0;
+ var esc = false;
+ var depth = 0;
+ var stack = [ ];
- 'cidr4': function()
- {
- if (this.match(/^(\S+)\/(\S+)$/))
- {
- ip = RegExp.$1;
- mask = RegExp.$2;
- return cbi_validators.ip4addr.apply(ip) &&
- cbi_validators.ip4prefix.apply(mask);
- }
- return false;
- },
+ code += ',';
- 'cidr6': function()
- {
- if (this.match(/^(\S+)\/(\S+)$/))
- {
- ip = RegExp.$1;
- mask = RegExp.$2;
- return cbi_validators.ip6addr.apply(ip) &&
- cbi_validators.ip6prefix.apply(mask);
- }
- return false;
- },
+ for (var i = 0; i < code.length; i++) {
+ if (esc) {
+ esc = false;
+ continue;
+ }
- 'ipnet4': function()
- {
- if (this.match(/^(\S+)\/(\S+)$/))
- {
- ip = RegExp.$1;
- net = RegExp.$2;
- return cbi_validators.ip4addr.apply(ip) &&
- cbi_validators.ip4addr.apply(net);
- }
- return false;
- },
+ switch (code.charCodeAt(i))
+ {
+ case 92:
+ esc = true;
+ break;
- 'ipnet6': function()
- {
- if (this.match(/^(\S+)\/(\S+)$/))
- {
- ip = RegExp.$1;
- net = RegExp.$2;
- return cbi_validators.ip6addr.apply(ip) &&
- cbi_validators.ip6addr.apply(net);
- }
- return false;
- },
+ case 40:
+ case 44:
+ if (depth <= 0) {
+ if (pos < i) {
+ var label = code.substring(pos, i);
+ label = label.replace(/\\(.)/g, '$1');
+ label = label.replace(/^[ \t]+/g, '');
+ label = label.replace(/[ \t]+$/g, '');
+
+ if (label && !isNaN(label)) {
+ stack.push(parseFloat(label));
+ }
+ else if (label.match(/^(['"]).*\1$/)) {
+ stack.push(label.replace(/^(['"])(.*)\1$/, '$2'));
+ }
+ else if (typeof this.types[label] == 'function') {
+ stack.push(this.types[label]);
+ stack.push(null);
+ }
+ else {
+ throw "Syntax error, unhandled token '"+label+"'";
+ }
+ }
- 'ipmask': function()
- {
- return cbi_validators.ipmask4.apply(this) ||
- cbi_validators.ipmask6.apply(this);
- },
+ pos = i+1;
+ }
- 'ipmask4': function()
- {
- return cbi_validators.cidr4.apply(this) ||
- cbi_validators.ipnet4.apply(this) ||
- cbi_validators.ip4addr.apply(this);
- },
+ depth += (code.charCodeAt(i) == 40);
+ break;
- 'ipmask6': function()
- {
- return cbi_validators.cidr6.apply(this) ||
- cbi_validators.ipnet6.apply(this) ||
- cbi_validators.ip6addr.apply(this);
- },
+ case 41:
+ if (--depth <= 0) {
+ if (typeof stack[stack.length-2] != 'function')
+ throw "Syntax error, argument list follows non-function";
- 'port': function()
- {
- var p = Int(this);
- return (p >= 0 && p <= 65535);
- },
+ stack[stack.length-1] = this.compile(code.substring(pos, i));
+ pos = i+1;
+ }
- 'portrange': function()
- {
- if (this.match(/^(\d+)-(\d+)$/))
- {
- var p1 = +RegExp.$1;
- var p2 = +RegExp.$2;
- return (p1 <= p2 && p2 <= 65535);
+ break;
+ }
}
- return cbi_validators.port.apply(this);
+ return stack;
},
- 'macaddr': function()
- {
- return (this.match(/^([a-fA-F0-9]{2}:){5}[a-fA-F0-9]{2}$/) != null);
- },
+ validate: function() {
+ /* element is detached */
+ if (!findParent(this.field, 'form'))
+ return true;
- 'host': function(ipv4only)
- {
- return cbi_validators.hostname.apply(this) ||
- ((ipv4only != 1) && cbi_validators.ipaddr.apply(this)) ||
- ((ipv4only == 1) && cbi_validators.ip4addr.apply(this));
- },
+ this.field.classList.remove('cbi-input-invalid');
+ this.value = matchesElem(this.field, 'select') ? this.field.options[this.field.selectedIndex].value : this.field.value;
+ this.error = null;
- 'hostname': function()
- {
- if (this.length <= 253)
- return (this.match(/^[a-zA-Z0-9]+$/) != null ||
- (this.match(/^[a-zA-Z0-9_][a-zA-Z0-9_\-.]*[a-zA-Z0-9]$/) &&
- this.match(/[^0-9.]/)));
+ var valid;
- return false;
- },
+ if (this.value.length === 0)
+ valid = this.assert(this.optional, _('non-empty value'));
+ else
+ valid = this.vstack[0].apply(this, this.vstack[1]);
- 'network': function()
- {
- return cbi_validators.uciname.apply(this) ||
- cbi_validators.host.apply(this);
+ if (!valid) {
+ this.field.setAttribute('data-tooltip', _('Expecting %s').format(this.error));
+ this.field.setAttribute('data-tooltip-style', 'error');
+ this.field.dispatchEvent(new CustomEvent('validation-failure', { bubbles: true }));
+ }
+ else {
+ this.field.removeAttribute('data-tooltip');
+ this.field.removeAttribute('data-tooltip-style');
+ this.field.dispatchEvent(new CustomEvent('validation-success', { bubbles: true }));
+ }
+
+ return valid;
},
- 'hostport': function(ipv4only)
- {
- var hp = this.split(/:/);
+ types: {
+ integer: function() {
+ return this.assert(Int(this.value) !== NaN, _('valid integer value'));
+ },
+
+ uinteger: function() {
+ return this.assert(Int(this.value) >= 0, _('positive integer value'));
+ },
+
+ float: function() {
+ return this.assert(Dec(this.value) !== NaN, _('valid decimal value'));
+ },
+
+ ufloat: function() {
+ return this.assert(Dec(this.value) >= 0, _('positive decimal value'));
+ },
+
+ ipaddr: function(nomask) {
+ return this.assert(this.apply('ip4addr', null, [nomask]) || this.apply('ip6addr', null, [nomask]),
+ nomask ? _('valid IP address') : _('valid IP address or prefix'));
+ },
+
+ ip4addr: function(nomask) {
+ var re = nomask ? /^(\d+\.\d+\.\d+\.\d+)$/ : /^(\d+\.\d+\.\d+\.\d+)(?:\/(\d+\.\d+\.\d+\.\d+)|\/(\d{1,2}))?$/,
+ m = this.value.match(re);
+
+ return this.assert(m && IPv4(m[1]) && (m[2] ? IPv4(m[2]) : (m[3] ? this.apply('ip4prefix', m[3]) : true)),
+ nomask ? _('valid IPv4 address') : _('valid IPv4 address or network'));
+ },
+
+ ip6addr: function(nomask) {
+ var re = nomask ? /^([0-9a-fA-F:.]+)$/ : /^([0-9a-fA-F:.]+)(?:\/(\d{1,3}))?$/,
+ m = this.value.match(re);
+
+ return this.assert(m && IPv6(m[1]) && (m[2] ? this.apply('ip6prefix', m[2]) : true),
+ nomask ? _('valid IPv6 address') : _('valid IPv6 address or prefix'));
+ },
+
+ ip4prefix: function() {
+ return this.assert(!isNaN(this.value) && this.value >= 0 && this.value <= 32,
+ _('valid IPv4 prefix value (0-32)'));
+ },
+
+ ip6prefix: function() {
+ return this.assert(!isNaN(this.value) && this.value >= 0 && this.value <= 128,
+ _('valid IPv6 prefix value (0-128)'));
+ },
+
+ cidr: function() {
+ return this.assert(this.apply('cidr4') || this.apply('cidr6'), _('valid IPv4 or IPv6 CIDR'));
+ },
+
+ cidr4: function() {
+ var m = this.value.match(/^(\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3})\/(\d{1,2})$/);
+ return this.assert(m && IPv4(m[1]) && this.apply('ip4prefix', m[2]), _('valid IPv4 CIDR'));
+ },
+
+ cidr6: function() {
+ var m = this.value.match(/^([0-9a-fA-F:.]+)\/(\d{1,3})$/);
+ return this.assert(m && IPv6(m[1]) && this.apply('ip6prefix', m[2]), _('valid IPv6 CIDR'));
+ },
+
+ ipnet4: function() {
+ var m = this.value.match(/^(\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3})\/(\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3})$/);
+ return this.assert(m && IPv4(m[1]) && IPv4(m[2]), _('IPv4 network in address/netmask notation'));
+ },
+
+ ipnet6: function() {
+ var m = this.value.match(/^([0-9a-fA-F:.]+)\/([0-9a-fA-F:.]+)$/);
+ return this.assert(m && IPv6(m[1]) && IPv6(m[2]), _('IPv6 network in address/netmask notation'));
+ },
+
+ ip6hostid: function() {
+ if (this.value == "eui64" || this.value == "random")
+ return true;
- if (hp.length == 2)
- return (cbi_validators.host.apply(hp[0], ipv4only) &&
- cbi_validators.port.apply(hp[1]));
+ var v6 = IPv6(this.value);
+ return this.assert(!(!v6 || v6[0] || v6[1] || v6[2] || v6[3]), _('valid IPv6 host id'));
+ },
+
+ ipmask: function() {
+ return this.assert(this.apply('ipmask4') || this.apply('ipmask6'),
+ _('valid network in address/netmask notation'));
+ },
+
+ ipmask4: function() {
+ return this.assert(this.apply('cidr4') || this.apply('ipnet4') || this.apply('ip4addr'),
+ _('valid IPv4 network'));
+ },
+
+ ipmask6: function() {
+ return this.assert(this.apply('cidr6') || this.apply('ipnet6') || this.apply('ip6addr'),
+ _('valid IPv6 network'));
+ },
+
+ port: function() {
+ var p = Int(this.value);
+ return this.assert(p >= 0 && p <= 65535, _('valid port value'));
+ },
+
+ portrange: function() {
+ if (this.value.match(/^(\d+)-(\d+)$/)) {
+ var p1 = +RegExp.$1;
+ var p2 = +RegExp.$2;
+ return this.assert(p1 <= p2 && p2 <= 65535,
+ _('valid port or port range (port1-port2)'));
+ }
- return false;
- },
+ return this.assert(this.apply('port'), _('valid port or port range (port1-port2)'));
+ },
+
+ macaddr: function() {
+ return this.assert(this.value.match(/^([a-fA-F0-9]{2}:){5}[a-fA-F0-9]{2}$/) != null,
+ _('valid MAC address'));
+ },
+
+ host: function(ipv4only) {
+ return this.assert(this.apply('hostname') || this.apply(ipv4only == 1 ? 'ip4addr' : 'ipaddr'),
+ _('valid hostname or IP address'));
+ },
+
+ hostname: function(strict) {
+ if (this.value.length <= 253)
+ return this.assert(
+ (this.value.match(/^[a-zA-Z0-9_]+$/) != null ||
+ (this.value.match(/^[a-zA-Z0-9_][a-zA-Z0-9_\-.]*[a-zA-Z0-9]$/) &&
+ this.value.match(/[^0-9.]/))) &&
+ (!strict || !this.value.match(/^_/)),
+ _('valid hostname'));
+
+ return this.assert(false, _('valid hostname'));
+ },
+
+ network: function() {
+ return this.assert(this.apply('uciname') || this.apply('host'),
+ _('valid UCI identifier, hostname or IP address'));
+ },
+
+ hostport: function(ipv4only) {
+ var hp = this.value.split(/:/);
+ return this.assert(hp.length == 2 && this.apply('host', hp[0], [ipv4only]) && this.apply('port', hp[1]),
+ _('valid host:port'));
+ },
+
+ ip4addrport: function() {
+ var hp = this.value.split(/:/);
+ return this.assert(hp.length == 2 && this.apply('ip4addr', hp[0], [true]) && this.apply('port', hp[1]),
+ _('valid IPv4 address:port'));
+ },
+
+ ipaddrport: function(bracket) {
+ var m4 = this.value.match(/^([^\[\]:]+):(\d+)$/),
+ m6 = this.value.match((bracket == 1) ? /^\[(.+)\]:(\d+)$/ : /^([^\[\]]+):(\d+)$/);
+
+ if (m4)
+ return this.assert(this.apply('ip4addr', m4[1], [true]) && this.apply('port', m4[2]),
+ _('valid address:port'));
+
+ return this.assert(m6 && this.apply('ip6addr', m6[1], [true]) && this.apply('port', m6[2]),
+ _('valid address:port'));
+ },
+
+ wpakey: function() {
+ var v = this.value;
+
+ if (v.length == 64)
+ return this.assert(v.match(/^[a-fA-F0-9]{64}$/), _('valid hexadecimal WPA key'));
+
+ return this.assert((v.length >= 8) && (v.length <= 63), _('key between 8 and 63 characters'));
+ },
+
+ wepkey: function() {
+ var v = this.value;
+
+ if (v.substr(0, 2) === 's:')
+ v = v.substr(2);
+
+ if ((v.length == 10) || (v.length == 26))
+ return this.assert(v.match(/^[a-fA-F0-9]{10,26}$/), _('valid hexadecimal WEP key'));
+
+ return this.assert((v.length === 5) || (v.length === 13), _('key with either 5 or 13 characters'));
+ },
+
+ uciname: function() {
+ return this.assert(this.value.match(/^[a-zA-Z0-9_]+$/), _('valid UCI identifier'));
+ },
+
+ range: function(min, max) {
+ var val = Dec(this.value);
+ return this.assert(val >= +min && val <= +max, _('value between %f and %f').format(min, max));
+ },
+
+ min: function(min) {
+ return this.assert(Dec(this.value) >= +min, _('value greater or equal to %f').format(min));
+ },
+
+ max: function(max) {
+ return this.assert(Dec(this.value) <= +max, _('value smaller or equal to %f').format(max));
+ },
+
+ rangelength: function(min, max) {
+ var val = '' + this.value;
+ return this.assert((val.length >= +min) && (val.length <= +max),
+ _('value between %d and %d characters').format(min, max));
+ },
+
+ minlength: function(min) {
+ return this.assert((''+this.value).length >= +min,
+ _('value with at least %d characters').format(min));
+ },
+
+ maxlength: function(max) {
+ return this.assert((''+this.value).length <= +max,
+ _('value with at most %d characters').format(max));
+ },
+
+ or: function() {
+ var errors = [];
+
+ for (var i = 0; i < arguments.length; i += 2) {
+ if (typeof arguments[i] != 'function') {
+ if (arguments[i] == this.value)
+ return this.assert(true);
+ errors.push('"%s"'.format(arguments[i]));
+ i--;
+ }
+ else if (arguments[i].apply(this, arguments[i+1])) {
+ return this.assert(true);
+ }
+ else {
+ errors.push(this.error);
+ }
+ }
- 'ip4addrport': function()
- {
- var hp = this.split(/:/);
+ return this.assert(false, _('one of:\n - %s'.format(errors.join('\n - '))));
+ },
- if (hp.length == 2)
- return (cbi_validators.ipaddr.apply(hp[0]) &&
- cbi_validators.port.apply(hp[1]));
- return false;
- },
+ and: function() {
+ for (var i = 0; i < arguments.length; i += 2) {
+ if (typeof arguments[i] != 'function') {
+ if (arguments[i] != this.value)
+ return this.assert(false, '"%s"'.format(arguments[i]));
+ i--;
+ }
+ else if (!arguments[i].apply(this, arguments[i+1])) {
+ return this.assert(false, this.error);
+ }
+ }
- 'ipaddrport': function(bracket)
- {
- if (this.match(/^([^\[\]:]+):([^:]+)$/)) {
- var addr = RegExp.$1
- var port = RegExp.$2
- return (cbi_validators.ip4addr.apply(addr) &&
- cbi_validators.port.apply(port));
- } else if ((bracket == 1) && (this.match(/^\[(.+)\]:([^:]+)$/))) {
- var addr = RegExp.$1
- var port = RegExp.$2
- return (cbi_validators.ip6addr.apply(addr) &&
- cbi_validators.port.apply(port));
- } else if ((bracket != 1) && (this.match(/^([^\[\]]+):([^:]+)$/))) {
- var addr = RegExp.$1
- var port = RegExp.$2
- return (cbi_validators.ip6addr.apply(addr) &&
- cbi_validators.port.apply(port));
- } else {
- return false;
- }
- },
+ return this.assert(true);
+ },
- 'wpakey': function()
- {
- var v = this;
+ neg: function() {
+ return this.apply('or', this.value.replace(/^[ \t]*![ \t]*/, ''), arguments);
+ },
- if( v.length == 64 )
- return (v.match(/^[a-fA-F0-9]{64}$/) != null);
- else
- return (v.length >= 8) && (v.length <= 63);
- },
+ list: function(subvalidator, subargs) {
+ this.field.setAttribute('data-is-list', 'true');
- 'wepkey': function()
- {
- var v = this;
+ var tokens = this.value.match(/[^ \t]+/g);
+ for (var i = 0; i < tokens.length; i++)
+ if (!this.apply(subvalidator, tokens[i], subargs))
+ return this.assert(false, this.error);
- if ( v.substr(0,2) == 's:' )
- v = v.substr(2);
+ return this.assert(true);
+ },
- if( (v.length == 10) || (v.length == 26) )
- return (v.match(/^[a-fA-F0-9]{10,26}$/) != null);
- else
- return (v.length == 5) || (v.length == 13);
- },
+ phonedigit: function() {
+ return this.assert(this.value.match(/^[0-9\*#!\.]+$/),
+ _('valid phone digit (0-9, "*", "#", "!" or ".")'));
+ },
- 'uciname': function()
- {
- return (this.match(/^[a-zA-Z0-9_]+$/) != null);
- },
+ timehhmmss: function() {
+ return this.assert(this.value.match(/^[0-6][0-9]:[0-6][0-9]:[0-6][0-9]$/),
+ _('valid time (HH:MM:SS)'));
+ },
- 'range': function(min, max)
- {
- var val = Dec(this);
- return (val >= +min && val <= +max);
- },
+ dateyyyymmdd: function() {
+ if (this.value.match(/^(\d\d\d\d)-(\d\d)-(\d\d)/)) {
+ var year = +RegExp.$1,
+ month = +RegExp.$2,
+ day = +RegExp.$3,
+ days_in_month = [ 31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31 ];
- 'min': function(min)
- {
- return (Dec(this) >= +min);
- },
+ function is_leap_year(year) {
+ return ((!(year % 4) && (year % 100)) || !(year % 400));
+ }
- 'max': function(max)
- {
- return (Dec(this) <= +max);
- },
+ function get_days_in_month(month, year) {
+ return (month === 2 && is_leap_year(year)) ? 29 : days_in_month[month - 1];
+ }
- 'rangelength': function(min, max)
- {
- var val = '' + this;
- return ((val.length >= +min) && (val.length <= +max));
- },
+ /* Firewall rules in the past don't make sense */
+ return this.assert(year >= 2015 && month && month <= 12 && day && day <= get_days_in_month(month, year),
+ _('valid date (YYYY-MM-DD)'));
- 'minlength': function(min)
- {
- return ((''+this).length >= +min);
- },
+ }
- 'maxlength': function(max)
- {
- return ((''+this).length <= +max);
- },
+ return this.assert(false, _('valid date (YYYY-MM-DD)'));
+ },
- 'or': function()
- {
- for (var i = 0; i < arguments.length; i += 2)
- {
- if (typeof arguments[i] != 'function')
- {
- if (arguments[i] == this)
- return true;
- i--;
- }
- else if (arguments[i].apply(this, arguments[i+1]))
- {
- return true;
- }
- }
- return false;
- },
+ unique: function(subvalidator, subargs) {
+ var ctx = this,
+ option = findParent(ctx.field, '[data-type][data-name]'),
+ section = findParent(option, '.cbi-section'),
+ query = '[data-type="%s"][data-name="%s"]'.format(option.getAttribute('data-type'), option.getAttribute('data-name')),
+ unique = true;
- 'and': function()
- {
- for (var i = 0; i < arguments.length; i += 2)
- {
- if (typeof arguments[i] != 'function')
- {
- if (arguments[i] != this)
- return false;
- i--;
- }
- else if (!arguments[i].apply(this, arguments[i+1]))
- {
- return false;
- }
- }
- return true;
- },
+ section.querySelectorAll(query).forEach(function(sibling) {
+ if (sibling === option)
+ return;
- 'neg': function()
- {
- return cbi_validators.or.apply(
- this.replace(/^[ \t]*![ \t]*/, ''), arguments);
- },
+ var input = sibling.querySelector('[data-type]'),
+ values = input ? (input.getAttribute('data-is-list') ? input.value.match(/[^ \t]+/g) : [ input.value ]) : null;
- 'list': function(subvalidator, subargs)
- {
- if (typeof subvalidator != 'function')
- return false;
+ if (values !== null && values.indexOf(ctx.value) !== -1)
+ unique = false;
+ });
- var tokens = this.match(/[^ \t]+/g);
- for (var i = 0; i < tokens.length; i++)
- if (!subvalidator.apply(tokens[i], subargs))
- return false;
+ if (!unique)
+ return this.assert(false, _('unique value'));
- return true;
- },
- 'phonedigit': function()
- {
- return (this.match(/^[0-9\*#!\.]+$/) != null);
- },
- 'timehhmmss': function()
- {
- return (this.match(/^[0-6][0-9]:[0-6][0-9]:[0-6][0-9]$/) != null);
- },
- 'dateyyyymmdd': function()
- {
- if (this == null) {
- return false;
- }
- if (this.match(/^(\d\d\d\d)-(\d\d)-(\d\d)/)) {
- var year = RegExp.$1;
- var month = RegExp.$2;
- var day = RegExp.$2
-
- var days_in_month = [ 31, 28, 31, 30, 31, 30, 31, 31, 30 , 31, 30, 31 ];
- function is_leap_year(year) {
- return ((year % 4) == 0) && ((year % 100) != 0) || ((year % 400) == 0);
- }
- function get_days_in_month(month, year) {
- if ((month == 2) && is_leap_year(year)) {
- return 29;
- } else {
- return days_in_month[month];
- }
- }
- /* Firewall rules in the past don't make sense */
- if (year < 2015) {
- return false;
- }
- if ((month <= 0) || (month > 12)) {
- return false;
- }
- if ((day <= 0) || (day > get_days_in_month(month, year))) {
- return false;
- }
- return true;
+ if (typeof(subvalidator) === 'function')
+ return this.apply(subvalidator, undefined, subargs);
- } else {
- return false;
+ return this.assert(true);
+ },
+
+ hexstring: function() {
+ return this.assert(this.value.match(/^([a-f0-9][a-f0-9]|[A-F0-9][A-F0-9])+$/),
+ _('hexadecimal encoded value'));
}
}
};
+function CBIValidator(field, type, optional)
+{
+ this.field = field;
+ this.optional = optional;
+ this.vstack = this.compile(type);
+}
+
+CBIValidator.prototype = CBIValidatorPrototype;
+
function cbi_d_add(field, dep, index) {
var obj = (typeof(field) === 'string') ? document.getElementById(field) : field;
}
function cbi_d_checkvalue(target, ref) {
- var t = document.getElementById(target);
- var value;
-
- if (!t) {
- var tl = document.getElementsByName(target);
-
- if( tl.length > 0 && (tl[0].type == 'radio' || tl[0].type == 'checkbox'))
- for( var i = 0; i < tl.length; i++ )
- if( tl[i].checked ) {
- value = tl[i].value;
- break;
- }
-
- value = value ? value : "";
- } else if (!t.value) {
- value = "";
- } else {
- value = t.value;
+ var value = null,
+ query = 'input[id="'+target+'"], input[name="'+target+'"], ' +
+ 'select[id="'+target+'"], select[name="'+target+'"]';
- if (t.type == "checkbox") {
- value = t.checked ? value : "";
- }
- }
+ document.querySelectorAll(query).forEach(function(i) {
+ if (value === null && ((i.type !== 'radio' && i.type !== 'checkbox') || i.checked === true))
+ value = i.value;
+ });
- return (value == ref)
+ return (((value !== null) ? value : "") == ref);
}
function cbi_d_check(deps) {
if (node && node.parentNode && !cbi_d_check(entry.deps)) {
node.parentNode.removeChild(node);
state = true;
- } else if (parent && (!node || !node.parentNode) && cbi_d_check(entry.deps)) {
+ }
+ else if (parent && (!node || !node.parentNode) && cbi_d_check(entry.deps)) {
var next = undefined;
for (next = parent.firstChild; next; next = next.nextSibling) {
- if (next.getAttribute && parseInt(next.getAttribute('data-index'), 10) > entry.index) {
+ if (next.getAttribute && parseInt(next.getAttribute('data-index'), 10) > entry.index)
break;
- }
}
- if (!next) {
+ if (!next)
parent.appendChild(entry.node);
- } else {
+ else
parent.insertBefore(entry.node, next);
- }
state = true;
}
parent.parentNode.style.display = (parent.options.length <= 1) ? 'none' : '';
}
- if (entry && entry.parent) {
- if (!cbi_t_update())
- cbi_tag_last(parent);
- }
+ if (entry && entry.parent)
+ cbi_tag_last(parent);
- if (state) {
+ if (state)
cbi_d_update();
- }
+ else if (parent)
+ parent.dispatchEvent(new CustomEvent('dependency-update', { bubbles: true }));
}
function cbi_init() {
var index = parseInt(node.getAttribute('data-index'), 10);
var depends = JSON.parse(node.getAttribute('data-depends'));
if (!isNaN(index) && depends.length > 0) {
- for (var alt = 0; alt < depends.length; alt++) {
+ for (var alt = 0; alt < depends.length; alt++)
cbi_d_add(node, depends[alt], index);
- }
}
}
for (var i = 0, node; (node = nodes[i]) !== undefined; i++) {
var events = node.getAttribute('data-update').split(' ');
- for (var j = 0, event; (event = events[j]) !== undefined; j++) {
- cbi_bind(node, event, cbi_d_update);
- }
+ for (var j = 0, event; (event = events[j]) !== undefined; j++)
+ node.addEventListener(event, cbi_d_update);
}
nodes = document.querySelectorAll('[data-choices]');
node.getAttribute('data-type'));
}
- cbi_d_update();
-}
+ document.querySelectorAll('.cbi-dropdown').forEach(cbi_dropdown_init);
+ document.querySelectorAll('[data-browser]').forEach(cbi_browser_init);
-function cbi_bind(obj, type, callback, mode) {
- if (!obj.addEventListener) {
- obj.attachEvent('on' + type,
- function(){
- var e = window.event;
-
- if (!e.target && e.srcElement)
- e.target = e.srcElement;
+ document.querySelectorAll('.cbi-tooltip:not(:empty)').forEach(function(s) {
+ s.parentNode.classList.add('cbi-tooltip-container');
+ });
- return !!callback(e);
- }
- );
- } else {
- obj.addEventListener(type, callback, !!mode);
- }
- return obj;
-}
+ document.querySelectorAll('.cbi-section-remove > input[name^="cbi.rts"]').forEach(function(i) {
+ var handler = function(ev) {
+ var bits = this.name.split(/\./),
+ section = document.getElementById('cbi-' + bits[2] + '-' + bits[3]);
-function cbi_combobox(id, values, def, man, focus) {
- var selid = "cbi.combobox." + id;
- if (document.getElementById(selid)) {
- return
- }
+ section.style.opacity = (ev.type === 'mouseover') ? 0.5 : '';
+ };
- var obj = document.getElementById(id)
- var sel = document.createElement("select");
- sel.id = selid;
- sel.index = obj.index;
- sel.className = obj.className.replace(/cbi-input-text/, 'cbi-input-select');
+ i.addEventListener('mouseover', handler);
+ i.addEventListener('mouseout', handler);
+ });
- if (obj.nextSibling) {
- obj.parentNode.insertBefore(sel, obj.nextSibling);
- } else {
- obj.parentNode.appendChild(sel);
- }
+ cbi_d_update();
+}
- var dt = obj.getAttribute('cbi_datatype');
- var op = obj.getAttribute('cbi_optional');
-
- if (!values[obj.value]) {
- if (obj.value == "") {
- var optdef = document.createElement("option");
- optdef.value = "";
- optdef.appendChild(document.createTextNode(typeof(def) === 'string' ? def : cbi_strings.label.choose));
- sel.appendChild(optdef);
- } else {
- var opt = document.createElement("option");
- opt.value = obj.value;
- opt.selected = "selected";
- opt.appendChild(document.createTextNode(obj.value));
- sel.appendChild(opt);
- }
+function cbi_combobox_init(id, values, def, man) {
+ var obj = (typeof(id) === 'string') ? document.getElementById(id) : id;
+ var sb = E('div', {
+ 'name': obj.name,
+ 'class': 'cbi-dropdown',
+ 'display-items': 5,
+ 'optional': obj.getAttribute('data-optional'),
+ 'placeholder': _('-- Please choose --'),
+ 'data-type': obj.getAttribute('data-type'),
+ 'data-optional': obj.getAttribute('data-optional')
+ }, [ E('ul') ]);
+
+ if (!(obj.value in values) && obj.value.length) {
+ sb.lastElementChild.appendChild(E('li', {
+ 'data-value': obj.value,
+ 'selected': ''
+ }, obj.value.length ? obj.value : (def || _('-- Please choose --'))));
}
for (var i in values) {
- var opt = document.createElement("option");
- opt.value = i;
-
- if (obj.value == i) {
- opt.selected = "selected";
- }
-
- opt.appendChild(document.createTextNode(values[i]));
- sel.appendChild(opt);
- }
-
- var optman = document.createElement("option");
- optman.value = "";
- optman.appendChild(document.createTextNode(typeof(man) === 'string' ? man : cbi_strings.label.custom));
- sel.appendChild(optman);
-
- obj.style.display = "none";
-
- if (dt)
- cbi_validate_field(sel, op == 'true', dt);
-
- cbi_bind(sel, "change", function() {
- if (sel.selectedIndex == sel.options.length - 1) {
- obj.style.display = "inline";
- sel.blur();
- sel.parentNode.removeChild(sel);
- obj.focus();
- } else {
- obj.value = sel.options[sel.selectedIndex].value;
- }
-
- try {
- cbi_d_update();
- } catch (e) {
- //Do nothing
- }
- })
-
- // Retrigger validation in select
- if (focus) {
- sel.focus();
- sel.blur();
+ sb.lastElementChild.appendChild(E('li', {
+ 'data-value': i,
+ 'selected': (i == obj.value) ? '' : null
+ }, values[i]));
}
-}
-function cbi_combobox_init(id, values, def, man) {
- var obj = (typeof(id) === 'string') ? document.getElementById(id) : id;
- cbi_bind(obj, "blur", function() {
- cbi_combobox(obj.id, values, def, man, true);
- });
- cbi_combobox(obj.id, values, def, man, false);
+ sb.lastElementChild.appendChild(E('li', { 'data-value': '-' }, [
+ E('input', {
+ 'type': 'text',
+ 'class': 'create-item-input',
+ 'data-type': obj.getAttribute('data-type'),
+ 'data-optional': true,
+ 'placeholder': (man || _('-- custom --'))
+ })
+ ]));
+
+ sb.value = obj.value;
+ obj.parentNode.replaceChild(sb, obj);
}
function cbi_filebrowser(id, defpath) {
- var field = document.getElementById(id);
+ var field = L.dom.elem(id) ? id : document.getElementById(id);
var browser = window.open(
- cbi_strings.path.browser + ( field.value || defpath || '' ) + '?field=' + id,
+ cbi_strings.path.browser + (field.value || defpath || '') + '?field=' + field.id,
"luci_filebrowser", "width=300,height=400,left=100,top=200,scrollbars=yes"
);
browser.focus();
}
-function cbi_browser_init(id, resource, defpath)
+function cbi_browser_init(field)
{
- function cbi_browser_btnclick(e) {
- cbi_filebrowser(id, defpath);
- return false;
- }
+ field.parentNode.insertBefore(
+ E('img', {
+ 'src': L.resource('cbi/folder.gif'),
+ 'class': 'cbi-image-button',
+ 'click': function(ev) {
+ cbi_filebrowser(field, field.getAttribute('data-browser'));
+ ev.preventDefault();
+ }
+ }), field.nextSibling);
+}
- var field = document.getElementById(id);
+CBIDynamicList = {
+ addItem: function(dl, value, text, flash) {
+ var exists = false,
+ new_item = E('div', { 'class': flash ? 'item flash' : 'item', 'tabindex': 0 }, [
+ E('span', {}, text || value),
+ E('input', {
+ 'type': 'hidden',
+ 'name': dl.getAttribute('data-prefix'),
+ 'value': value })]);
- var btn = document.createElement('img');
- btn.className = 'cbi-image-button';
- btn.src = (resource || cbi_strings.path.resource) + '/cbi/folder.gif';
- field.parentNode.insertBefore(btn, field.nextSibling);
+ dl.querySelectorAll('.item, .add-item').forEach(function(item) {
+ if (exists)
+ return;
- cbi_bind(btn, 'click', cbi_browser_btnclick);
-}
+ var hidden = item.querySelector('input[type="hidden"]');
-function cbi_dynlist_init(parent, datatype, optional, choices)
-{
- var prefix = parent.getAttribute('data-prefix');
- var holder = parent.getAttribute('data-placeholder');
+ if (hidden && hidden.value === value)
+ exists = true;
+ else if (!hidden || hidden.value >= value)
+ exists = !!item.parentNode.insertBefore(new_item, item);
+ });
- var values;
+ cbi_d_update();
+ },
- function cbi_dynlist_redraw(focus, add, del)
- {
- values = [ ];
+ removeItem: function(dl, item) {
+ var sb = dl.querySelector('.cbi-dropdown');
+ if (sb) {
+ var value = item.querySelector('input[type="hidden"]').value;
- while (parent.firstChild)
- {
- var n = parent.firstChild;
- var i = +n.index;
+ sb.querySelectorAll('ul > li').forEach(function(li) {
+ if (li.getAttribute('data-value') === value)
+ li.removeAttribute('unselectable');
+ });
+ }
- if (i != del)
- {
- if (n.nodeName.toLowerCase() == 'input')
- values.push(n.value || '');
- else if (n.nodeName.toLowerCase() == 'select')
- values[values.length-1] = n.options[n.selectedIndex].value;
- }
+ item.parentNode.removeChild(item);
+ cbi_d_update();
+ },
- parent.removeChild(n);
- }
+ handleClick: function(ev) {
+ var dl = ev.currentTarget,
+ item = findParent(ev.target, '.item');
- if (add >= 0)
- {
- focus = add+1;
- values.splice(focus, 0, '');
- }
- else if (values.length == 0)
- {
- focus = 0;
- values.push('');
+ if (item) {
+ this.removeItem(dl, item);
}
-
- for (var i = 0; i < values.length; i++)
- {
- var t = document.createElement('input');
- t.id = prefix + '.' + (i+1);
- t.name = prefix;
- t.value = values[i];
- t.type = 'text';
- t.index = i;
- t.className = 'cbi-input-text';
-
- if (i == 0 && holder)
- {
- t.placeholder = holder;
+ else if (matchesElem(ev.target, '.cbi-button-add')) {
+ var input = ev.target.previousElementSibling;
+ if (input.value.length && !input.classList.contains('cbi-input-invalid')) {
+ this.addItem(dl, input.value, null, true);
+ input.value = '';
}
+ }
+ },
- var b = document.createElement('img');
- b.src = cbi_strings.path.resource + ((i+1) < values.length ? '/cbi/remove.gif' : '/cbi/add.gif');
- b.className = 'cbi-image-button';
+ handleDropdownChange: function(ev) {
+ var dl = ev.currentTarget,
+ sbIn = ev.detail.instance,
+ sbEl = ev.detail.element,
+ sbVal = ev.detail.value;
- parent.appendChild(t);
- parent.appendChild(b);
- if (datatype == 'file')
- {
- cbi_browser_init(t.id, null, parent.getAttribute('data-browser-path'));
- }
+ if (sbVal === null)
+ return;
- parent.appendChild(document.createElement('br'));
+ sbIn.setValues(sbEl, null);
+ sbVal.element.setAttribute('unselectable', '');
- if (datatype)
- {
- cbi_validate_field(t.id, ((i+1) == values.length) || optional, datatype);
- }
+ this.addItem(dl, sbVal.value, sbVal.text, true);
+ },
- if (choices)
- {
- cbi_combobox_init(t.id, choices, '', cbi_strings.label.custom);
- b.index = i;
+ handleKeydown: function(ev) {
+ var dl = ev.currentTarget,
+ item = findParent(ev.target, '.item');
- cbi_bind(b, 'keydown', cbi_dynlist_keydown);
- cbi_bind(b, 'keypress', cbi_dynlist_keypress);
+ if (item) {
+ switch (ev.keyCode) {
+ case 8: /* backspace */
+ if (item.previousElementSibling)
+ item.previousElementSibling.focus();
- if (i == focus || -i == focus)
- b.focus();
- }
- else
- {
- cbi_bind(t, 'keydown', cbi_dynlist_keydown);
- cbi_bind(t, 'keypress', cbi_dynlist_keypress);
+ this.removeItem(dl, item);
+ break;
- if (i == focus)
- {
- t.focus();
- }
- else if (-i == focus)
- {
- t.focus();
-
- /* force cursor to end */
- var v = t.value;
- t.value = ' '
- t.value = v;
+ case 46: /* delete */
+ if (item.nextElementSibling) {
+ if (item.nextElementSibling.classList.contains('item'))
+ item.nextElementSibling.focus();
+ else
+ item.nextElementSibling.firstElementChild.focus();
}
+
+ this.removeItem(dl, item);
+ break;
}
+ }
+ else if (matchesElem(ev.target, '.cbi-input-text')) {
+ switch (ev.keyCode) {
+ case 13: /* enter */
+ if (ev.target.value.length && !ev.target.classList.contains('cbi-input-invalid')) {
+ this.addItem(dl, ev.target.value, null, true);
+ ev.target.value = '';
+ ev.target.blur();
+ ev.target.focus();
+ }
- cbi_bind(b, 'click', cbi_dynlist_btnclick);
+ ev.preventDefault();
+ break;
+ }
}
}
+};
- function cbi_dynlist_keypress(ev)
- {
- ev = ev ? ev : window.event;
-
- var se = ev.target ? ev.target : ev.srcElement;
+function cbi_dynlist_init(dl, datatype, optional, choices)
+{
+ if (!(this instanceof cbi_dynlist_init))
+ return new cbi_dynlist_init(dl, datatype, optional, choices);
+
+ dl.classList.add('cbi-dynlist');
+ dl.appendChild(E('div', { 'class': 'add-item' }, E('input', {
+ 'type': 'text',
+ 'name': 'cbi.dynlist.' + dl.getAttribute('data-prefix'),
+ 'class': 'cbi-input-text',
+ 'placeholder': dl.getAttribute('data-placeholder'),
+ 'data-type': datatype,
+ 'data-optional': true
+ })));
+
+ if (choices)
+ cbi_combobox_init(dl.lastElementChild.lastElementChild, choices, '', _('-- custom --'));
+ else
+ dl.lastElementChild.appendChild(E('div', { 'class': 'cbi-button cbi-button-add' }, '+'));
+
+ dl.addEventListener('click', this.handleClick.bind(this));
+ dl.addEventListener('keydown', this.handleKeydown.bind(this));
+ dl.addEventListener('cbi-dropdown-change', this.handleDropdownChange.bind(this));
+
+ try {
+ var values = JSON.parse(dl.getAttribute('data-values') || '[]');
+
+ if (typeof(values) === 'object' && Array.isArray(values))
+ for (var i = 0; i < values.length; i++)
+ this.addItem(dl, values[i], choices ? choices[values[i]] : null);
+ }
+ catch (e) {}
+}
- if (se.nodeType == 3)
- se = se.parentNode;
+cbi_dynlist_init.prototype = CBIDynamicList;
- switch (ev.keyCode)
- {
- /* backspace, delete */
- case 8:
- case 46:
- if (se.value.length == 0)
- {
- if (ev.preventDefault)
- ev.preventDefault();
- return false;
- }
+function cbi_validate_form(form, errmsg)
+{
+ /* if triggered by a section removal or addition, don't validate */
+ if (form.cbi_state == 'add-section' || form.cbi_state == 'del-section')
+ return true;
- return true;
+ if (form.cbi_validators) {
+ for (var i = 0; i < form.cbi_validators.length; i++) {
+ var validator = form.cbi_validators[i];
- /* enter, arrow up, arrow down */
- case 13:
- case 38:
- case 40:
- if (ev.preventDefault)
- ev.preventDefault();
-
- return false;
- }
-
- return true;
- }
-
- function cbi_dynlist_keydown(ev)
- {
- ev = ev ? ev : window.event;
-
- var se = ev.target ? ev.target : ev.srcElement;
-
- if (se.nodeType == 3)
- se = se.parentNode;
-
- var prev = se.previousSibling;
- while (prev && prev.name != prefix)
- prev = prev.previousSibling;
-
- var next = se.nextSibling;
- while (next && next.name != prefix)
- next = next.nextSibling;
-
- /* advance one further in combobox case */
- if (next && next.nextSibling.name == prefix)
- next = next.nextSibling;
-
- switch (ev.keyCode)
- {
- /* backspace, delete */
- case 8:
- case 46:
- var del = (se.nodeName.toLowerCase() == 'select')
- ? true : (se.value.length == 0);
-
- if (del)
- {
- if (ev.preventDefault)
- ev.preventDefault();
-
- var focus = se.index;
- if (ev.keyCode == 8)
- focus = -focus+1;
-
- cbi_dynlist_redraw(focus, -1, se.index);
-
- return false;
- }
-
- break;
-
- /* enter */
- case 13:
- cbi_dynlist_redraw(-1, se.index, -1);
- break;
-
- /* arrow up */
- case 38:
- if (prev)
- prev.focus();
-
- break;
-
- /* arrow down */
- case 40:
- if (next)
- next.focus();
-
- break;
- }
-
- return true;
- }
-
- function cbi_dynlist_btnclick(ev)
- {
- ev = ev ? ev : window.event;
-
- var se = ev.target ? ev.target : ev.srcElement;
- var input = se.previousSibling;
- while (input && input.name != prefix) {
- input = input.previousSibling;
- }
-
- if (se.src.indexOf('remove') > -1)
- {
- input.value = '';
-
- cbi_dynlist_keydown({
- target: input,
- keyCode: 8
- });
- }
- else
- {
- cbi_dynlist_keydown({
- target: input,
- keyCode: 13
- });
- }
-
- return false;
- }
-
- cbi_dynlist_redraw(NaN, -1, -1);
-}
-
-
-function cbi_t_add(section, tab) {
- var t = document.getElementById('tab.' + section + '.' + tab);
- var c = document.getElementById('container.' + section + '.' + tab);
-
- if( t && c ) {
- cbi_t[section] = (cbi_t[section] || [ ]);
- cbi_t[section][tab] = { 'tab': t, 'container': c, 'cid': c.id };
- }
-}
-
-function cbi_t_switch(section, tab) {
- if( cbi_t[section] && cbi_t[section][tab] ) {
- var o = cbi_t[section][tab];
- var h = document.getElementById('tab.' + section);
- for( var tid in cbi_t[section] ) {
- var o2 = cbi_t[section][tid];
- if( o.tab.id != o2.tab.id ) {
- o2.tab.className = o2.tab.className.replace(/(^| )cbi-tab( |$)/, " cbi-tab-disabled ");
- o2.container.style.display = 'none';
- }
- else {
- if(h) h.value = tab;
- o2.tab.className = o2.tab.className.replace(/(^| )cbi-tab-disabled( |$)/, " cbi-tab ");
- o2.container.style.display = 'block';
- }
- }
- }
- return false
-}
-
-function cbi_t_update() {
- var hl_tabs = [ ];
- var updated = false;
-
- for( var sid in cbi_t )
- for( var tid in cbi_t[sid] )
- {
- var t = cbi_t[sid][tid].tab;
- var c = cbi_t[sid][tid].container;
-
- if (!c.firstElementChild) {
- t.style.display = 'none';
- }
- else if (t.style.display == 'none') {
- t.style.display = '';
- t.className += ' cbi-tab-highlighted';
- hl_tabs.push(t);
- }
-
- cbi_tag_last(c);
- updated = true;
- }
-
- if (hl_tabs.length > 0)
- window.setTimeout(function() {
- for( var i = 0; i < hl_tabs.length; i++ )
- hl_tabs[i].className = hl_tabs[i].className.replace(/ cbi-tab-highlighted/g, '');
- }, 750);
-
- return updated;
-}
-
-
-function cbi_validate_form(form, errmsg)
-{
- /* if triggered by a section removal or addition, don't validate */
- if( form.cbi_state == 'add-section' || form.cbi_state == 'del-section' )
- return true;
-
- if( form.cbi_validators )
- {
- for( var i = 0; i < form.cbi_validators.length; i++ )
- {
- var validator = form.cbi_validators[i];
- if( !validator() && errmsg )
- {
+ if (!validator() && errmsg) {
alert(errmsg);
return false;
}
return true;
}
-function cbi_validate_compile(code)
-{
- var pos = 0;
- var esc = false;
- var depth = 0;
- var stack = [ ];
-
- code += ',';
-
- for (var i = 0; i < code.length; i++)
- {
- if (esc)
- {
- esc = false;
- continue;
- }
-
- switch (code.charCodeAt(i))
- {
- case 92:
- esc = true;
- break;
-
- case 40:
- case 44:
- if (depth <= 0)
- {
- if (pos < i)
- {
- var label = code.substring(pos, i);
- label = label.replace(/\\(.)/g, '$1');
- label = label.replace(/^[ \t]+/g, '');
- label = label.replace(/[ \t]+$/g, '');
-
- if (label && !isNaN(label))
- {
- stack.push(parseFloat(label));
- }
- else if (label.match(/^(['"]).*\1$/))
- {
- stack.push(label.replace(/^(['"])(.*)\1$/, '$2'));
- }
- else if (typeof cbi_validators[label] == 'function')
- {
- stack.push(cbi_validators[label]);
- stack.push(null);
- }
- else
- {
- throw "Syntax error, unhandled token '"+label+"'";
- }
- }
- pos = i+1;
- }
- depth += (code.charCodeAt(i) == 40);
- break;
-
- case 41:
- if (--depth <= 0)
- {
- if (typeof stack[stack.length-2] != 'function')
- throw "Syntax error, argument list follows non-function";
-
- stack[stack.length-1] =
- arguments.callee(code.substring(pos, i));
-
- pos = i+1;
- }
- break;
- }
- }
-
- return stack;
-}
-
function cbi_validate_field(cbid, optional, type)
{
- var field = (typeof cbid == "string") ? document.getElementById(cbid) : cbid;
- var vstack; try { vstack = cbi_validate_compile(type); } catch(e) { };
-
- if (field && vstack && typeof vstack[0] == "function")
- {
- var validator = function()
- {
- // is not detached
- if( field.form )
- {
- field.className = field.className.replace(/ cbi-input-invalid/g, '');
+ var field = isElem(cbid) ? cbid : document.getElementById(cbid);
+ var validatorFn;
- // validate value
- var value = (field.options && field.options.selectedIndex > -1)
- ? field.options[field.options.selectedIndex].value : field.value;
-
- if (!(((value.length == 0) && optional) || vstack[0].apply(value, vstack[1])))
- {
- // invalid
- field.className += ' cbi-input-invalid';
- return false;
- }
- }
+ try {
+ var cbiValidator = new CBIValidator(field, type, optional);
+ validatorFn = cbiValidator.validate.bind(cbiValidator);
+ }
+ catch(e) {
+ validatorFn = null;
+ };
- return true;
- };
+ if (validatorFn !== null) {
+ var form = findParent(field, 'form');
- if( ! field.form.cbi_validators )
- field.form.cbi_validators = [ ];
+ if (!form.cbi_validators)
+ form.cbi_validators = [ ];
- field.form.cbi_validators.push(validator);
+ form.cbi_validators.push(validatorFn);
- cbi_bind(field, "blur", validator);
- cbi_bind(field, "keyup", validator);
+ field.addEventListener("blur", validatorFn);
+ field.addEventListener("keyup", validatorFn);
+ field.addEventListener("cbi-dropdown-change", validatorFn);
- if (field.nodeName == 'SELECT')
- {
- cbi_bind(field, "change", validator);
- cbi_bind(field, "click", validator);
+ if (matchesElem(field, 'select')) {
+ field.addEventListener("change", validatorFn);
+ field.addEventListener("click", validatorFn);
}
- field.setAttribute("cbi_validate", validator);
- field.setAttribute("cbi_datatype", type);
- field.setAttribute("cbi_optional", (!!optional).toString());
-
- validator();
-
- var fcbox = document.getElementById('cbi.combobox.' + field.id);
- if (fcbox)
- cbi_validate_field(fcbox, optional, type);
+ validatorFn();
}
}
function cbi_row_swap(elem, up, store)
{
- var tr = elem.parentNode;
- while (tr && tr.nodeName.toLowerCase() != 'tr')
- tr = tr.parentNode;
+ var tr = findParent(elem.parentNode, '.cbi-section-table-row');
if (!tr)
return false;
- var table = tr.parentNode;
- while (table && table.nodeName.toLowerCase() != 'table')
- table = table.parentNode;
-
- if (!table)
- return false;
+ tr.classList.remove('flash');
- var s = up ? 3 : 2;
- var e = up ? table.rows.length : table.rows.length - 1;
+ if (up) {
+ var prev = tr.previousElementSibling;
- for (var idx = s; idx < e; idx++)
- {
- if (table.rows[idx] == tr)
- {
- if (up)
- tr.parentNode.insertBefore(table.rows[idx], table.rows[idx-1]);
- else
- tr.parentNode.insertBefore(table.rows[idx+1], table.rows[idx]);
+ if (prev && prev.classList.contains('cbi-section-table-row'))
+ tr.parentNode.insertBefore(tr, prev);
+ else
+ return;
+ }
+ else {
+ var next = tr.nextElementSibling ? tr.nextElementSibling.nextElementSibling : null;
- break;
- }
+ if (next && next.classList.contains('cbi-section-table-row'))
+ tr.parentNode.insertBefore(tr, next);
+ else if (!next)
+ tr.parentNode.appendChild(tr);
+ else
+ return;
}
var ids = [ ];
- for (idx = 2; idx < table.rows.length; idx++)
- {
- table.rows[idx].className = table.rows[idx].className.replace(
- /cbi-rowstyle-[12]/, 'cbi-rowstyle-' + (1 + (idx % 2))
- );
-
- if (table.rows[idx].id && table.rows[idx].id.match(/-([^\-]+)$/) )
- ids.push(RegExp.$1);
+
+ for (var i = 0, n = 0; i < tr.parentNode.childNodes.length; i++) {
+ var node = tr.parentNode.childNodes[i];
+ if (node.classList && node.classList.contains('cbi-section-table-row')) {
+ node.classList.remove('cbi-rowstyle-1');
+ node.classList.remove('cbi-rowstyle-2');
+ node.classList.add((n++ % 2) ? 'cbi-rowstyle-2' : 'cbi-rowstyle-1');
+
+ if (/-([^\-]+)$/.test(node.id))
+ ids.push(RegExp.$1);
+ }
}
var input = document.getElementById(store);
if (input)
input.value = ids.join(' ');
+ window.scrollTo(0, tr.offsetTop);
+ void tr.offsetWidth;
+ tr.classList.add('flash');
+
return false;
}
{
var last;
- for (var i = 0; i < container.childNodes.length; i++)
- {
+ for (var i = 0; i < container.childNodes.length; i++) {
var c = container.childNodes[i];
- if (c.nodeType == 1 && c.nodeName.toLowerCase() == 'div')
- {
- c.className = c.className.replace(/ cbi-value-last$/, '');
+ if (matchesElem(c, 'div')) {
+ c.classList.remove('cbi-value-last');
last = c;
}
}
if (last)
- {
- last.className += ' cbi-value-last';
- }
+ last.classList.add('cbi-value-last');
}
-String.prototype.serialize = function()
+function cbi_submit(elem, name, value, action)
{
- var o = this;
- switch(typeof(o))
- {
- case 'object':
- // null
- if( o == null )
- {
- return 'null';
- }
+ var form = elem.form || findParent(elem, 'form');
- // array
- else if( o.length )
- {
- var i, s = '';
-
- for( var i = 0; i < o.length; i++ )
- s += (s ? ', ' : '') + String.serialize(o[i]);
-
- return '[ ' + s + ' ]';
- }
-
- // object
- else
- {
- var k, s = '';
-
- for( k in o )
- s += (s ? ', ' : '') + k + ': ' + String.serialize(o[k]);
-
- return '{ ' + s + ' }';
- }
-
- break;
+ if (!form)
+ return false;
- case 'string':
- // complex string
- if( o.match(/[^a-zA-Z0-9_,.: -]/) )
- return 'decodeURIComponent("' + encodeURIComponent(o) + '")';
+ if (action)
+ form.action = action;
- // simple string
- else
- return '"' + o + '"';
+ if (name) {
+ var hidden = form.querySelector('input[type="hidden"][name="%s"]'.format(name)) ||
+ E('input', { type: 'hidden', name: name });
- break;
-
- default:
- return o.toString();
+ hidden.value = value || '1';
+ form.appendChild(hidden);
}
+
+ form.submit();
+ return true;
}
String.prototype.format = function()
if (typeof(s) !== 'string' && !(s instanceof String))
return '';
- for( var i = 0; i < r.length; i += 2 )
+ for (var i = 0; i < r.length; i += 2)
s = s.replace(r[i], r[i+1]);
+
return s;
}
var re = /^(([^%]*)%('.|0|\x20)?(-)?(\d+)?(\.\d+)?(%|b|c|d|u|f|o|s|x|X|q|h|j|t|m))/;
var a = b = [], numSubstitutions = 0, numMatches = 0;
- while (a = re.exec(str))
- {
+ while (a = re.exec(str)) {
var m = a[1];
var leftpart = a[2], pPad = a[3], pJustify = a[4], pMinLength = a[5];
var pPrecision = a[6], pType = a[7];
numMatches++;
- if (pType == '%')
- {
+ if (pType == '%') {
subst = '%';
}
- else
- {
- if (numSubstitutions < arguments.length)
- {
+ else {
+ if (numSubstitutions < arguments.length) {
var param = arguments[numSubstitutions++];
var pad = '';
var subst = param;
- switch(pType)
- {
+ switch(pType) {
case 'b':
subst = (+param || 0).toString(2);
break;
subst = esc(param, quot_esc);
break;
- case 'j':
- subst = String.serialize(param);
- break;
-
case 't':
var td = 0;
var th = 0;
return this.replace(/[\s\n]+/g, ' ');
}
-String.serialize = function()
-{
- var a = [ ];
- for (var i = 1; i < arguments.length; i++)
- a.push(arguments[i]);
- return ''.serialize.apply(arguments[0], a);
-}
-
String.format = function()
{
var a = [ ];
+
for (var i = 1; i < arguments.length; i++)
a.push(arguments[i]);
+
return ''.format.apply(arguments[0], a);
}
String.nobr = function()
{
var a = [ ];
+
for (var i = 1; i < arguments.length; i++)
a.push(arguments[i]);
+
return ''.nobr.apply(arguments[0], a);
}
+
+if (window.NodeList && !NodeList.prototype.forEach) {
+ NodeList.prototype.forEach = function (callback, thisArg) {
+ thisArg = thisArg || window;
+ for (var i = 0; i < this.length; i++) {
+ callback.call(thisArg, this[i], i, this);
+ }
+ };
+}
+
+if (!window.requestAnimationFrame) {
+ window.requestAnimationFrame = function(f) {
+ window.setTimeout(function() {
+ f(new Date().getTime())
+ }, 1000/30);
+ };
+}
+
+
+function isElem(e) { return L.dom.elem(e) }
+function toElem(s) { return L.dom.parse(s) }
+function matchesElem(node, selector) { return L.dom.matches(node, selector) }
+function findParent(node, selector) { return L.dom.parent(node, selector) }
+function E() { return L.dom.create.apply(L.dom, arguments) }
+
+if (typeof(window.CustomEvent) !== 'function') {
+ function CustomEvent(event, params) {
+ params = params || { bubbles: false, cancelable: false, detail: undefined };
+ var evt = document.createEvent('CustomEvent');
+ evt.initCustomEvent( event, params.bubbles, params.cancelable, params.detail );
+ return evt;
+ }
+
+ CustomEvent.prototype = window.Event.prototype;
+ window.CustomEvent = CustomEvent;
+}
+
+CBIDropdown = {
+ openDropdown: function(sb) {
+ var st = window.getComputedStyle(sb, null),
+ ul = sb.querySelector('ul'),
+ li = ul.querySelectorAll('li'),
+ fl = findParent(sb, '.cbi-value-field'),
+ sel = ul.querySelector('[selected]'),
+ rect = sb.getBoundingClientRect(),
+ items = Math.min(this.dropdown_items, li.length);
+
+ document.querySelectorAll('.cbi-dropdown[open]').forEach(function(s) {
+ s.dispatchEvent(new CustomEvent('cbi-dropdown-close', {}));
+ });
+
+ sb.setAttribute('open', '');
+
+ var pv = ul.cloneNode(true);
+ pv.classList.add('preview');
+
+ if (fl)
+ fl.classList.add('cbi-dropdown-open');
+
+ if ('ontouchstart' in window) {
+ var vpWidth = Math.max(document.documentElement.clientWidth, window.innerWidth || 0),
+ vpHeight = Math.max(document.documentElement.clientHeight, window.innerHeight || 0),
+ scrollFrom = window.pageYOffset,
+ scrollTo = scrollFrom + rect.top - vpHeight * 0.5,
+ start = null;
+
+ ul.style.top = sb.offsetHeight + 'px';
+ ul.style.left = -rect.left + 'px';
+ ul.style.right = (rect.right - vpWidth) + 'px';
+ ul.style.maxHeight = (vpHeight * 0.5) + 'px';
+ ul.style.WebkitOverflowScrolling = 'touch';
+
+ var scrollStep = function(timestamp) {
+ if (!start) {
+ start = timestamp;
+ ul.scrollTop = sel ? Math.max(sel.offsetTop - sel.offsetHeight, 0) : 0;
+ }
+
+ var duration = Math.max(timestamp - start, 1);
+ if (duration < 100) {
+ document.body.scrollTop = scrollFrom + (scrollTo - scrollFrom) * (duration / 100);
+ window.requestAnimationFrame(scrollStep);
+ }
+ else {
+ document.body.scrollTop = scrollTo;
+ }
+ };
+
+ window.requestAnimationFrame(scrollStep);
+ }
+ else {
+ ul.style.maxHeight = '1px';
+ ul.style.top = ul.style.bottom = '';
+
+ window.requestAnimationFrame(function() {
+ var height = items * li[Math.max(0, li.length - 2)].offsetHeight;
+
+ ul.scrollTop = sel ? Math.max(sel.offsetTop - sel.offsetHeight, 0) : 0;
+ ul.style[((rect.top + rect.height + height) > window.innerHeight) ? 'bottom' : 'top'] = rect.height + 'px';
+ ul.style.maxHeight = height + 'px';
+ });
+ }
+
+ ul.querySelectorAll('[selected] input[type="checkbox"]').forEach(function(c) {
+ c.checked = true;
+ });
+
+ ul.classList.add('dropdown');
+
+ sb.insertBefore(pv, ul.nextElementSibling);
+
+ li.forEach(function(l) {
+ l.setAttribute('tabindex', 0);
+ });
+
+ sb.lastElementChild.setAttribute('tabindex', 0);
+
+ this.setFocus(sb, sel || li[0], true);
+ },
+
+ closeDropdown: function(sb, no_focus) {
+ if (!sb.hasAttribute('open'))
+ return;
+
+ var pv = sb.querySelector('ul.preview'),
+ ul = sb.querySelector('ul.dropdown'),
+ li = ul.querySelectorAll('li'),
+ fl = findParent(sb, '.cbi-value-field');
+
+ li.forEach(function(l) { l.removeAttribute('tabindex'); });
+ sb.lastElementChild.removeAttribute('tabindex');
+
+ sb.removeChild(pv);
+ sb.removeAttribute('open');
+ sb.style.width = sb.style.height = '';
+
+ ul.classList.remove('dropdown');
+ ul.style.top = ul.style.bottom = ul.style.maxHeight = '';
+
+ if (fl)
+ fl.classList.remove('cbi-dropdown-open');
+
+ if (!no_focus)
+ this.setFocus(sb, sb);
+
+ this.saveValues(sb, ul);
+ },
+
+ toggleItem: function(sb, li, force_state) {
+ if (li.hasAttribute('unselectable'))
+ return;
+
+ if (this.multi) {
+ var cbox = li.querySelector('input[type="checkbox"]'),
+ items = li.parentNode.querySelectorAll('li'),
+ label = sb.querySelector('ul.preview'),
+ sel = li.parentNode.querySelectorAll('[selected]').length,
+ more = sb.querySelector('.more'),
+ ndisplay = this.display_items,
+ n = 0;
+
+ if (li.hasAttribute('selected')) {
+ if (force_state !== true) {
+ if (sel > 1 || this.optional) {
+ li.removeAttribute('selected');
+ cbox.checked = cbox.disabled = false;
+ sel--;
+ }
+ else {
+ cbox.disabled = true;
+ }
+ }
+ }
+ else {
+ if (force_state !== false) {
+ li.setAttribute('selected', '');
+ cbox.checked = true;
+ cbox.disabled = false;
+ sel++;
+ }
+ }
+
+ while (label.firstElementChild)
+ label.removeChild(label.firstElementChild);
+
+ for (var i = 0; i < items.length; i++) {
+ items[i].removeAttribute('display');
+ if (items[i].hasAttribute('selected')) {
+ if (ndisplay-- > 0) {
+ items[i].setAttribute('display', n++);
+ label.appendChild(items[i].cloneNode(true));
+ }
+ var c = items[i].querySelector('input[type="checkbox"]');
+ if (c)
+ c.disabled = (sel == 1 && !this.optional);
+ }
+ }
+
+ if (ndisplay < 0)
+ sb.setAttribute('more', '');
+ else
+ sb.removeAttribute('more');
+
+ if (ndisplay === this.display_items)
+ sb.setAttribute('empty', '');
+ else
+ sb.removeAttribute('empty');
+
+ more.innerHTML = (ndisplay === this.display_items) ? this.placeholder : '···';
+ }
+ else {
+ var sel = li.parentNode.querySelector('[selected]');
+ if (sel) {
+ sel.removeAttribute('display');
+ sel.removeAttribute('selected');
+ }
+
+ li.setAttribute('display', 0);
+ li.setAttribute('selected', '');
+
+ this.closeDropdown(sb, true);
+ }
+
+ this.saveValues(sb, li.parentNode);
+ },
+
+ transformItem: function(sb, li) {
+ var cbox = E('form', {}, E('input', { type: 'checkbox', tabindex: -1, onclick: 'event.preventDefault()' })),
+ label = E('label');
+
+ while (li.firstChild)
+ label.appendChild(li.firstChild);
+
+ li.appendChild(cbox);
+ li.appendChild(label);
+ },
+
+ saveValues: function(sb, ul) {
+ var sel = ul.querySelectorAll('li[selected]'),
+ div = sb.lastElementChild,
+ strval = '',
+ values = [];
+
+ while (div.lastElementChild)
+ div.removeChild(div.lastElementChild);
+
+ sel.forEach(function (s) {
+ if (s.hasAttribute('placeholder'))
+ return;
+
+ var v = {
+ text: s.innerText,
+ value: s.hasAttribute('data-value') ? s.getAttribute('data-value') : s.innerText,
+ element: s
+ };
+
+ div.appendChild(E('input', {
+ type: 'hidden',
+ name: s.hasAttribute('name') ? s.getAttribute('name') : (sb.getAttribute('name') || ''),
+ value: v.value
+ }));
+
+ values.push(v);
+
+ strval += strval.length ? ' ' + v.value : v.value;
+ });
+
+ var detail = {
+ instance: this,
+ element: sb
+ };
+
+ if (this.multi)
+ detail.values = values;
+ else
+ detail.value = values.length ? values[0] : null;
+
+ sb.value = strval;
+
+ sb.dispatchEvent(new CustomEvent('cbi-dropdown-change', {
+ bubbles: true,
+ detail: detail
+ }));
+
+ cbi_d_update();
+ },
+
+ setValues: function(sb, values) {
+ var ul = sb.querySelector('ul');
+
+ if (this.multi) {
+ ul.querySelectorAll('li[data-value]').forEach(function(li) {
+ if (values === null || !(li.getAttribute('data-value') in values))
+ this.toggleItem(sb, li, false);
+ else
+ this.toggleItem(sb, li, true);
+ });
+ }
+ else {
+ var ph = ul.querySelector('li[placeholder]');
+ if (ph)
+ this.toggleItem(sb, ph);
+
+ ul.querySelectorAll('li[data-value]').forEach(function(li) {
+ if (values !== null && (li.getAttribute('data-value') in values))
+ this.toggleItem(sb, li);
+ });
+ }
+ },
+
+ setFocus: function(sb, elem, scroll) {
+ if (sb && sb.hasAttribute && sb.hasAttribute('locked-in'))
+ return;
+
+ if (sb.target && findParent(sb.target, 'ul.dropdown'))
+ return;
+
+ document.querySelectorAll('.focus').forEach(function(e) {
+ if (!matchesElem(e, 'input')) {
+ e.classList.remove('focus');
+ e.blur();
+ }
+ });
+
+ if (elem) {
+ elem.focus();
+ elem.classList.add('focus');
+
+ if (scroll)
+ elem.parentNode.scrollTop = elem.offsetTop - elem.parentNode.offsetTop;
+ }
+ },
+
+ createItems: function(sb, value) {
+ var sbox = this,
+ val = (value || '').trim(),
+ ul = sb.querySelector('ul');
+
+ if (!sbox.multi)
+ val = val.length ? [ val ] : [];
+ else
+ val = val.length ? val.split(/\s+/) : [];
+
+ val.forEach(function(item) {
+ var new_item = null;
+
+ ul.childNodes.forEach(function(li) {
+ if (li.getAttribute && li.getAttribute('data-value') === item)
+ new_item = li;
+ });
+
+ if (!new_item) {
+ var markup,
+ tpl = sb.querySelector(sbox.template);
+
+ if (tpl)
+ markup = (tpl.textContent || tpl.innerHTML || tpl.firstChild.data).replace(/^<!--|-->$/, '').trim();
+ else
+ markup = '<li data-value="{{value}}">{{value}}</li>';
+
+ new_item = E(markup.replace(/{{value}}/g, item));
+
+ if (sbox.multi) {
+ sbox.transformItem(sb, new_item);
+ }
+ else {
+ var old = ul.querySelector('li[created]');
+ if (old)
+ ul.removeChild(old);
+
+ new_item.setAttribute('created', '');
+ }
+
+ new_item = ul.insertBefore(new_item, ul.lastElementChild);
+ }
+
+ sbox.toggleItem(sb, new_item, true);
+ sbox.setFocus(sb, new_item, true);
+ });
+ },
+
+ closeAllDropdowns: function() {
+ document.querySelectorAll('.cbi-dropdown[open]').forEach(function(s) {
+ s.dispatchEvent(new CustomEvent('cbi-dropdown-close', {}));
+ });
+ },
+
+ handleClick: function(ev) {
+ var sb = ev.currentTarget;
+
+ if (!sb.hasAttribute('open')) {
+ if (!matchesElem(ev.target, 'input'))
+ this.openDropdown(sb);
+ }
+ else {
+ var li = findParent(ev.target, 'li');
+ if (li && li.parentNode.classList.contains('dropdown'))
+ this.toggleItem(sb, li);
+ else if (li && li.parentNode.classList.contains('preview'))
+ this.closeDropdown(sb);
+ }
+
+ ev.preventDefault();
+ ev.stopPropagation();
+ },
+
+ handleKeydown: function(ev) {
+ var sb = ev.currentTarget;
+
+ if (matchesElem(ev.target, 'input'))
+ return;
+
+ if (!sb.hasAttribute('open')) {
+ switch (ev.keyCode) {
+ case 37:
+ case 38:
+ case 39:
+ case 40:
+ this.openDropdown(sb);
+ ev.preventDefault();
+ }
+ }
+ else {
+ var active = findParent(document.activeElement, 'li');
+
+ switch (ev.keyCode) {
+ case 27:
+ this.closeDropdown(sb);
+ break;
+
+ case 13:
+ if (active) {
+ if (!active.hasAttribute('selected'))
+ this.toggleItem(sb, active);
+ this.closeDropdown(sb);
+ ev.preventDefault();
+ }
+ break;
+
+ case 32:
+ if (active) {
+ this.toggleItem(sb, active);
+ ev.preventDefault();
+ }
+ break;
+
+ case 38:
+ if (active && active.previousElementSibling) {
+ this.setFocus(sb, active.previousElementSibling);
+ ev.preventDefault();
+ }
+ break;
+
+ case 40:
+ if (active && active.nextElementSibling) {
+ this.setFocus(sb, active.nextElementSibling);
+ ev.preventDefault();
+ }
+ break;
+ }
+ }
+ },
+
+ handleDropdownClose: function(ev) {
+ var sb = ev.currentTarget;
+
+ this.closeDropdown(sb, true);
+ },
+
+ handleDropdownSelect: function(ev) {
+ var sb = ev.currentTarget,
+ li = findParent(ev.target, 'li');
+
+ if (!li)
+ return;
+
+ this.toggleItem(sb, li);
+ this.closeDropdown(sb, true);
+ },
+
+ handleMouseover: function(ev) {
+ var sb = ev.currentTarget;
+
+ if (!sb.hasAttribute('open'))
+ return;
+
+ var li = findParent(ev.target, 'li');
+
+ if (li && li.parentNode.classList.contains('dropdown'))
+ this.setFocus(sb, li);
+ },
+
+ handleFocus: function(ev) {
+ var sb = ev.currentTarget;
+
+ document.querySelectorAll('.cbi-dropdown[open]').forEach(function(s) {
+ if (s !== sb || sb.hasAttribute('open'))
+ s.dispatchEvent(new CustomEvent('cbi-dropdown-close', {}));
+ });
+ },
+
+ handleCanaryFocus: function(ev) {
+ this.closeDropdown(ev.currentTarget.parentNode);
+ },
+
+ handleCreateKeydown: function(ev) {
+ var input = ev.currentTarget,
+ sb = findParent(input, '.cbi-dropdown');
+
+ switch (ev.keyCode) {
+ case 13:
+ ev.preventDefault();
+
+ if (input.classList.contains('cbi-input-invalid'))
+ return;
+
+ this.createItems(sb, input.value);
+ input.value = '';
+ input.blur();
+ break;
+ }
+ },
+
+ handleCreateFocus: function(ev) {
+ var input = ev.currentTarget,
+ cbox = findParent(input, 'li').querySelector('input[type="checkbox"]'),
+ sb = findParent(input, '.cbi-dropdown');
+
+ if (cbox)
+ cbox.checked = true;
+
+ sb.setAttribute('locked-in', '');
+ },
+
+ handleCreateBlur: function(ev) {
+ var input = ev.currentTarget,
+ cbox = findParent(input, 'li').querySelector('input[type="checkbox"]'),
+ sb = findParent(input, '.cbi-dropdown');
+
+ if (cbox)
+ cbox.checked = false;
+
+ sb.removeAttribute('locked-in');
+ },
+
+ handleCreateClick: function(ev) {
+ ev.currentTarget.querySelector(this.create).focus();
+ }
+};
+
+function cbi_dropdown_init(sb) {
+ if (!(this instanceof cbi_dropdown_init))
+ return new cbi_dropdown_init(sb);
+
+ this.multi = sb.hasAttribute('multiple');
+ this.optional = sb.hasAttribute('optional');
+ this.placeholder = sb.getAttribute('placeholder') || '---';
+ this.display_items = parseInt(sb.getAttribute('display-items') || 3);
+ this.dropdown_items = parseInt(sb.getAttribute('dropdown-items') || 5);
+ this.create = sb.getAttribute('item-create') || '.create-item-input';
+ this.template = sb.getAttribute('item-template') || 'script[type="item-template"]';
+
+ var ul = sb.querySelector('ul'),
+ more = sb.appendChild(E('span', { class: 'more', tabindex: -1 }, '···')),
+ open = sb.appendChild(E('span', { class: 'open', tabindex: -1 }, '▾')),
+ canary = sb.appendChild(E('div')),
+ create = sb.querySelector(this.create),
+ ndisplay = this.display_items,
+ n = 0;
+
+ if (this.multi) {
+ var items = ul.querySelectorAll('li');
+
+ for (var i = 0; i < items.length; i++) {
+ this.transformItem(sb, items[i]);
+
+ if (items[i].hasAttribute('selected') && ndisplay-- > 0)
+ items[i].setAttribute('display', n++);
+ }
+ }
+ else {
+ if (this.optional && !ul.querySelector('li[data-value=""]')) {
+ var placeholder = E('li', { placeholder: '' }, this.placeholder);
+ ul.firstChild ? ul.insertBefore(placeholder, ul.firstChild) : ul.appendChild(placeholder);
+ }
+
+ var items = ul.querySelectorAll('li'),
+ sel = sb.querySelectorAll('[selected]');
+
+ sel.forEach(function(s) {
+ s.removeAttribute('selected');
+ });
+
+ var s = sel[0] || items[0];
+ if (s) {
+ s.setAttribute('selected', '');
+ s.setAttribute('display', n++);
+ }
+
+ ndisplay--;
+ }
+
+ this.saveValues(sb, ul);
+
+ ul.setAttribute('tabindex', -1);
+ sb.setAttribute('tabindex', 0);
+
+ if (ndisplay < 0)
+ sb.setAttribute('more', '')
+ else
+ sb.removeAttribute('more');
+
+ if (ndisplay === this.display_items)
+ sb.setAttribute('empty', '')
+ else
+ sb.removeAttribute('empty');
+
+ more.innerHTML = (ndisplay === this.display_items) ? this.placeholder : '···';
+
+
+ sb.addEventListener('click', this.handleClick.bind(this));
+ sb.addEventListener('keydown', this.handleKeydown.bind(this));
+ sb.addEventListener('cbi-dropdown-close', this.handleDropdownClose.bind(this));
+ sb.addEventListener('cbi-dropdown-select', this.handleDropdownSelect.bind(this));
+
+ if ('ontouchstart' in window) {
+ sb.addEventListener('touchstart', function(ev) { ev.stopPropagation(); });
+ window.addEventListener('touchstart', this.closeAllDropdowns);
+ }
+ else {
+ sb.addEventListener('mouseover', this.handleMouseover.bind(this));
+ sb.addEventListener('focus', this.handleFocus.bind(this));
+
+ canary.addEventListener('focus', this.handleCanaryFocus.bind(this));
+
+ window.addEventListener('mouseover', this.setFocus);
+ window.addEventListener('click', this.closeAllDropdowns);
+ }
+
+ if (create) {
+ create.addEventListener('keydown', this.handleCreateKeydown.bind(this));
+ create.addEventListener('focus', this.handleCreateFocus.bind(this));
+ create.addEventListener('blur', this.handleCreateBlur.bind(this));
+
+ var li = findParent(create, 'li');
+
+ li.setAttribute('unselectable', '');
+ li.addEventListener('click', this.handleCreateClick.bind(this));
+ }
+}
+
+cbi_dropdown_init.prototype = CBIDropdown;
+
+function cbi_update_table(table, data, placeholder) {
+ var target = isElem(table) ? table : document.querySelector(table);
+
+ if (!isElem(target))
+ return;
+
+ target.querySelectorAll('.tr.table-titles, .cbi-section-table-titles').forEach(function(thead) {
+ var titles = [];
+
+ thead.querySelectorAll('.th').forEach(function(th) {
+ titles.push(th);
+ });
+
+ if (Array.isArray(data)) {
+ var n = 0, rows = target.querySelectorAll('.tr');
+
+ data.forEach(function(row) {
+ var trow = E('div', { 'class': 'tr' });
+
+ for (var i = 0; i < titles.length; i++) {
+ var text = (titles[i].innerText || '').trim();
+ var td = trow.appendChild(E('div', {
+ 'class': titles[i].className,
+ 'data-title': (text !== '') ? text : null
+ }, row[i] || ''));
+
+ td.classList.remove('th');
+ td.classList.add('td');
+ }
+
+ trow.classList.add('cbi-rowstyle-%d'.format((n++ % 2) ? 2 : 1));
+
+ if (rows[n])
+ target.replaceChild(trow, rows[n]);
+ else
+ target.appendChild(trow);
+ });
+
+ while (rows[++n])
+ target.removeChild(rows[n]);
+
+ if (placeholder && target.firstElementChild === target.lastElementChild) {
+ var trow = target.appendChild(E('div', { 'class': 'tr placeholder' }));
+ var td = trow.appendChild(E('div', { 'class': titles[0].className }, placeholder));
+
+ td.classList.remove('th');
+ td.classList.add('td');
+ }
+ }
+ else {
+ thead.parentNode.style.display = 'none';
+
+ thead.parentNode.querySelectorAll('.tr, .cbi-section-table-row').forEach(function(trow) {
+ if (trow !== thead) {
+ var n = 0;
+ trow.querySelectorAll('.th, .td').forEach(function(td) {
+ if (n < titles.length) {
+ var text = (titles[n++].innerText || '').trim();
+ if (text !== '')
+ td.setAttribute('data-title', text);
+ }
+ });
+ }
+ });
+
+ thead.parentNode.style.display = '';
+ }
+ });
+}
+
+function showModal(title, children)
+{
+ return L.showModal(title, children);
+}
+
+function hideModal()
+{
+ return L.hideModal();
+}
+
+
+document.addEventListener('DOMContentLoaded', function() {
+ document.addEventListener('validation-failure', function(ev) {
+ if (ev.target === document.activeElement)
+ L.showTooltip(ev);
+ });
+
+ document.addEventListener('validation-success', function(ev) {
+ if (ev.target === document.activeElement)
+ L.hideTooltip(ev);
+ });
+
+ document.querySelectorAll('.table').forEach(cbi_update_table);
+});
projects / librecmc / librecmc.git / blobdiff