modules/luci-base/htdocs/luci-static/resources/luci.js

   1 /**
   2  * @class LuCI
   3  * @classdesc
   4  *
   5  * This is the LuCI base class. It is automatically instantiated and
   6  * accessible using the global `L` variable.
   7  *
   8  * @param {Object} env
   9  * The environment settings to use for the LuCI runtime.
  10  */
  11
  12 (function(window, document, undefined) {
  13         'use strict';
  14
  15         var env = {};
  16
  17         /* Object.assign polyfill for IE */
  18         if (typeof Object.assign !== 'function') {
  19                 Object.defineProperty(Object, 'assign', {
  20                         value: function assign(target, varArgs) {
  21                                 if (target == null)
  22                                         throw new TypeError('Cannot convert undefined or null to object');
  23
  24                                 var to = Object(target);
  25
  26                                 for (var index = 1; index < arguments.length; index++)
  27                                         if (arguments[index] != null)
  28                                                 for (var nextKey in arguments[index])
  29                                                         if (Object.prototype.hasOwnProperty.call(arguments[index], nextKey))
  30                                                                 to[nextKey] = arguments[index][nextKey];
  31
  32                                 return to;
  33                         },
  34                         writable: true,
  35                         configurable: true
  36                 });
  37         }
  38
  39         /* Promise.finally polyfill */
  40         if (typeof Promise.prototype.finally !== 'function') {
  41                 Promise.prototype.finally = function(fn) {
  42                         var onFinally = function(cb) {
  43                                 return Promise.resolve(fn.call(this)).then(cb);
  44                         };
  45
  46                         return this.then(
  47                                 function(result) { return onFinally.call(this, function() { return result }) },
  48                                 function(reason) { return onFinally.call(this, function() { return Promise.reject(reason) }) }
  49                         );
  50                 };
  51         }
  52
  53         /*
  54          * Class declaration and inheritance helper
  55          */
  56
  57         var toCamelCase = function(s) {
  58                 return s.replace(/(?:^|[\. -])(.)/g, function(m0, m1) { return m1.toUpperCase() });
  59         };
  60
  61         /**
  62          * @class baseclass
  63          * @hideconstructor
  64          * @memberof LuCI
  65          * @classdesc
  66          *
  67          * `LuCI.baseclass` is the abstract base class all LuCI classes inherit from.
  68          *
  69          * It provides simple means to create subclasses of given classes and
  70          * implements prototypal inheritance.
  71          */
  72         var superContext = {}, classIndex = 0, Class = Object.assign(function() {}, {
  73                 /**
  74                  * Extends this base class with the properties described in
  75                  * `properties` and returns a new subclassed Class instance
  76                  *
  77                  * @memberof LuCI.baseclass
  78                  *
  79                  * @param {Object<string, *>} properties
  80                  * An object describing the properties to add to the new
  81                  * subclass.
  82                  *
  83                  * @returns {LuCI.baseclass}
  84                  * Returns a new LuCI.baseclass sublassed from this class, extended
  85                  * by the given properties and with its prototype set to this base
  86                  * class to enable inheritance. The resulting value represents a
  87                  * class constructor and can be instantiated with `new`.
  88                  */
  89                 extend: function(properties) {
  90                         var props = {
  91                                 __id__: { value: classIndex },
  92                                 __base__: { value: this.prototype },
  93                                 __name__: { value: properties.__name__ || 'anonymous' + classIndex++ }
  94                         };
  95
  96                         var ClassConstructor = function() {
  97                                 if (!(this instanceof ClassConstructor))
  98                                         throw new TypeError('Constructor must not be called without "new"');
  99
 100                                 if (Object.getPrototypeOf(this).hasOwnProperty('__init__')) {
 101                                         if (typeof(this.__init__) != 'function')
 102                                                 throw new TypeError('Class __init__ member is not a function');
 103
 104                                         this.__init__.apply(this, arguments)
 105                                 }
 106                                 else {
 107                                         this.super('__init__', arguments);
 108                                 }
 109                         };
 110
 111                         for (var key in properties)
 112                                 if (!props[key] && properties.hasOwnProperty(key))
 113                                         props[key] = { value: properties[key], writable: true };
 114
 115                         ClassConstructor.prototype = Object.create(this.prototype, props);
 116                         ClassConstructor.prototype.constructor = ClassConstructor;
 117                         Object.assign(ClassConstructor, this);
 118                         ClassConstructor.displayName = toCamelCase(props.__name__.value + 'Class');
 119
 120                         return ClassConstructor;
 121                 },
 122
 123                 /**
 124                  * Extends this base class with the properties described in
 125                  * `properties`, instantiates the resulting subclass using
 126                  * the additional optional arguments passed to this function
 127                  * and returns the resulting subclassed Class instance.
 128                  *
 129                  * This function serves as a convenience shortcut for
 130                  * {@link LuCI.baseclass.extend Class.extend()} and subsequent
 131                  * `new`.
 132                  *
 133                  * @memberof LuCI.baseclass
 134                  *
 135                  * @param {Object<string, *>} properties
 136                  * An object describing the properties to add to the new
 137                  * subclass.
 138                  *
 139                  * @param {...*} [new_args]
 140                  * Specifies arguments to be passed to the subclass constructor
 141                  * as-is in order to instantiate the new subclass.
 142                  *
 143                  * @returns {LuCI.baseclass}
 144                  * Returns a new LuCI.baseclass instance extended by the given
 145                  * properties with its prototype set to this base class to
 146                  * enable inheritance.
 147                  */
 148                 singleton: function(properties /*, ... */) {
 149                         return Class.extend(properties)
 150                                 .instantiate(Class.prototype.varargs(arguments, 1));
 151                 },
 152
 153                 /**
 154                  * Calls the class constructor using `new` with the given argument
 155                  * array being passed as variadic parameters to the constructor.
 156                  *
 157                  * @memberof LuCI.baseclass
 158                  *
 159                  * @param {Array<*>} params
 160                  * An array of arbitrary values which will be passed as arguments
 161                  * to the constructor function.
 162                  *
 163                  * @param {...*} [new_args]
 164                  * Specifies arguments to be passed to the subclass constructor
 165                  * as-is in order to instantiate the new subclass.
 166                  *
 167                  * @returns {LuCI.baseclass}
 168                  * Returns a new LuCI.baseclass instance extended by the given
 169                  * properties with its prototype set to this base class to
 170                  * enable inheritance.
 171                  */
 172                 instantiate: function(args) {
 173                         return new (Function.prototype.bind.apply(this,
 174                                 Class.prototype.varargs(args, 0, null)))();
 175                 },
 176
 177                 /* unused */
 178                 call: function(self, method) {
 179                         if (typeof(this.prototype[method]) != 'function')
 180                                 throw new ReferenceError(method + ' is not defined in class');
 181
 182                         return this.prototype[method].apply(self, self.varargs(arguments, 1));
 183                 },
 184
 185                 /**
 186                  * Checks whether the given class value is a subclass of this class.
 187                  *
 188                  * @memberof LuCI.baseclass
 189                  *
 190                  * @param {LuCI.baseclass} classValue
 191                  * The class object to test.
 192                  *
 193                  * @returns {boolean}
 194                  * Returns `true` when the given `classValue` is a subclass of this
 195                  * class or `false` if the given value is not a valid class or not
 196                  * a subclass of this class'.
 197                  */
 198                 isSubclass: function(classValue) {
 199                         return (classValue != null &&
 200                                 typeof(classValue) == 'function' &&
 201                                 classValue.prototype instanceof this);
 202                 },
 203
 204                 prototype: {
 205                         /**
 206                          * Extract all values from the given argument array beginning from
 207                          * `offset` and prepend any further given optional parameters to
 208                          * the beginning of the resulting array copy.
 209                          *
 210                          * @memberof LuCI.baseclass
 211                          * @instance
 212                          *
 213                          * @param {Array<*>} args
 214                          * The array to extract the values from.
 215                          *
 216                          * @param {number} offset
 217                          * The offset from which to extract the values. An offset of `0`
 218                          * would copy all values till the end.
 219                          *
 220                          * @param {...*} [extra_args]
 221                          * Extra arguments to add to prepend to the resultung array.
 222                          *
 223                          * @returns {Array<*>}
 224                          * Returns a new array consisting of the optional extra arguments
 225                          * and the values extracted from the `args` array beginning with
 226                          * `offset`.
 227                          */
 228                         varargs: function(args, offset /*, ... */) {
 229                                 return Array.prototype.slice.call(arguments, 2)
 230                                         .concat(Array.prototype.slice.call(args, offset));
 231                         },
 232
 233                         /**
 234                          * Walks up the parent class chain and looks for a class member
 235                          * called `key` in any of the parent classes this class inherits
 236                          * from. Returns the member value of the superclass or calls the
 237                          * member as function and returns its return value when the
 238                          * optional `callArgs` array is given.
 239                          *
 240                          * This function has two signatures and is sensitive to the
 241                          * amount of arguments passed to it:
 242                          *  - `super('key')` -
 243                          *    Returns the value of `key` when found within one of the
 244                          *    parent classes.
 245                          *  - `super('key', ['arg1', 'arg2'])` -
 246                          *    Calls the `key()` method with parameters `arg1` and `arg2`
 247                          *    when found within one of the parent classes.
 248                          *
 249                          * @memberof LuCI.baseclass
 250                          * @instance
 251                          *
 252                          * @param {string} key
 253                          * The name of the superclass member to retrieve.
 254                          *
 255                          * @param {Array<*>} [callArgs]
 256                          * An optional array of function call parameters to use. When
 257                          * this parameter is specified, the found member value is called
 258                          * as function using the values of this array as arguments.
 259                          *
 260                          * @throws {ReferenceError}
 261                          * Throws a `ReferenceError` when `callArgs` are specified and
 262                          * the found member named by `key` is not a function value.
 263                          *
 264                          * @returns {*|null}
 265                          * Returns the value of the found member or the return value of
 266                          * the call to the found method. Returns `null` when no member
 267                          * was found in the parent class chain or when the call to the
 268                          * superclass method returned `null`.
 269                          */
 270                         super: function(key, callArgs) {
 271                                 if (key == null)
 272                                         return null;
 273
 274                                 var slotIdx = this.__id__ + '.' + key,
 275                                     symStack = superContext[slotIdx],
 276                                     protoCtx = null;
 277
 278                                 for (protoCtx = Object.getPrototypeOf(symStack ? symStack[0] : Object.getPrototypeOf(this));
 279                                      protoCtx != null && !protoCtx.hasOwnProperty(key);
 280                                      protoCtx = Object.getPrototypeOf(protoCtx)) {}
 281
 282                                 if (protoCtx == null)
 283                                         return null;
 284
 285                                 var res = protoCtx[key];
 286
 287                                 if (arguments.length > 1) {
 288                                         if (typeof(res) != 'function')
 289                                                 throw new ReferenceError(key + ' is not a function in base class');
 290
 291                                         if (typeof(callArgs) != 'object')
 292                                                 callArgs = this.varargs(arguments, 1);
 293
 294                                         if (symStack)
 295                                                 symStack.unshift(protoCtx);
 296                                         else
 297                                                 superContext[slotIdx] = [ protoCtx ];
 298
 299                                         res = res.apply(this, callArgs);
 300
 301                                         if (symStack && symStack.length > 1)
 302                                                 symStack.shift(protoCtx);
 303                                         else
 304                                                 delete superContext[slotIdx];
 305                                 }
 306
 307                                 return res;
 308                         },
 309
 310                         /**
 311                          * Returns a string representation of this class.
 312                          *
 313                          * @returns {string}
 314                          * Returns a string representation of this class containing the
 315                          * constructor functions `displayName` and describing the class
 316                          * members and their respective types.
 317                          */
 318                         toString: function() {
 319                                 var s = '[' + this.constructor.displayName + ']', f = true;
 320                                 for (var k in this) {
 321                                         if (this.hasOwnProperty(k)) {
 322                                                 s += (f ? ' {\n' : '') + '  ' + k + ': ' + typeof(this[k]) + '\n';
 323                                                 f = false;
 324                                         }
 325                                 }
 326                                 return s + (f ? '' : '}');
 327                         }
 328                 }
 329         });
 330
 331
 332         /**
 333          * @class headers
 334          * @memberof LuCI
 335          * @hideconstructor
 336          * @classdesc
 337          *
 338          * The `Headers` class is an internal utility class exposed in HTTP
 339          * response objects using the `response.headers` property.
 340          */
 341         var Headers = Class.extend(/** @lends LuCI.headers.prototype */ {
 342                 __name__: 'LuCI.headers',
 343                 __init__: function(xhr) {
 344                         var hdrs = this.headers = {};
 345                         xhr.getAllResponseHeaders().split(/\r\n/).forEach(function(line) {
 346                                 var m = /^([^:]+):(.*)$/.exec(line);
 347                                 if (m != null)
 348                                         hdrs[m[1].trim().toLowerCase()] = m[2].trim();
 349                         });
 350                 },
 351
 352                 /**
 353                  * Checks whether the given header name is present.
 354                  * Note: Header-Names are case-insensitive.
 355                  *
 356                  * @instance
 357                  * @memberof LuCI.headers
 358                  * @param {string} name
 359                  * The header name to check
 360                  *
 361                  * @returns {boolean}
 362                  * Returns `true` if the header name is present, `false` otherwise
 363                  */
 364                 has: function(name) {
 365                         return this.headers.hasOwnProperty(String(name).toLowerCase());
 366                 },
 367
 368                 /**
 369                  * Returns the value of the given header name.
 370                  * Note: Header-Names are case-insensitive.
 371                  *
 372                  * @instance
 373                  * @memberof LuCI.headers
 374                  * @param {string} name
 375                  * The header name to read
 376                  *
 377                  * @returns {string|null}
 378                  * The value of the given header name or `null` if the header isn't present.
 379                  */
 380                 get: function(name) {
 381                         var key = String(name).toLowerCase();
 382                         return this.headers.hasOwnProperty(key) ? this.headers[key] : null;
 383                 }
 384         });
 385
 386         /**
 387          * @class response
 388          * @memberof LuCI
 389          * @hideconstructor
 390          * @classdesc
 391          *
 392          * The `Response` class is an internal utility class representing HTTP responses.
 393          */
 394         var Response = Class.extend({
 395                 __name__: 'LuCI.response',
 396                 __init__: function(xhr, url, duration, headers, content) {
 397                         /**
 398                          * Describes whether the response is successful (status codes `200..299`) or not
 399                          * @instance
 400                          * @memberof LuCI.response
 401                          * @name ok
 402                          * @type {boolean}
 403                          */
 404                         this.ok = (xhr.status >= 200 && xhr.status <= 299);
 405
 406                         /**
 407                          * The numeric HTTP status code of the response
 408                          * @instance
 409                          * @memberof LuCI.response
 410                          * @name status
 411                          * @type {number}
 412                          */
 413                         this.status = xhr.status;
 414
 415                         /**
 416                          * The HTTP status description message of the response
 417                          * @instance
 418                          * @memberof LuCI.response
 419                          * @name statusText
 420                          * @type {string}
 421                          */
 422                         this.statusText = xhr.statusText;
 423
 424                         /**
 425                          * The HTTP headers of the response
 426                          * @instance
 427                          * @memberof LuCI.response
 428                          * @name headers
 429                          * @type {LuCI.headers}
 430                          */
 431                         this.headers = (headers != null) ? headers : new Headers(xhr);
 432
 433                         /**
 434                          * The total duration of the HTTP request in milliseconds
 435                          * @instance
 436                          * @memberof LuCI.response
 437                          * @name duration
 438                          * @type {number}
 439                          */
 440                         this.duration = duration;
 441
 442                         /**
 443                          * The final URL of the request, i.e. after following redirects.
 444                          * @instance
 445                          * @memberof LuCI.response
 446                          * @name url
 447                          * @type {string}
 448                          */
 449                         this.url = url;
 450
 451                         /* privates */
 452                         this.xhr = xhr;
 453
 454                         if (content instanceof Blob) {
 455                                 this.responseBlob = content;
 456                                 this.responseJSON = null;
 457                                 this.responseText = null;
 458                         }
 459                         else if (content != null && typeof(content) == 'object') {
 460                                 this.responseBlob = null;
 461                                 this.responseJSON = content;
 462                                 this.responseText = null;
 463                         }
 464                         else if (content != null) {
 465                                 this.responseBlob = null;
 466                                 this.responseJSON = null;
 467                                 this.responseText = String(content);
 468                         }
 469                         else {
 470                                 this.responseJSON = null;
 471
 472                                 if (xhr.responseType == 'blob') {
 473                                         this.responseBlob = xhr.response;
 474                                         this.responseText = null;
 475                                 }
 476                                 else {
 477                                         this.responseBlob = null;
 478                                         this.responseText = xhr.responseText;
 479                                 }
 480                         }
 481                 },
 482
 483                 /**
 484                  * Clones the given response object, optionally overriding the content
 485                  * of the cloned instance.
 486                  *
 487                  * @instance
 488                  * @memberof LuCI.response
 489                  * @param {*} [content]
 490                  * Override the content of the cloned response. Object values will be
 491                  * treated as JSON response data, all other types will be converted
 492                  * using `String()` and treated as response text.
 493                  *
 494                  * @returns {LuCI.response}
 495                  * The cloned `Response` instance.
 496                  */
 497                 clone: function(content) {
 498                         var copy = new Response(this.xhr, this.url, this.duration, this.headers, content);
 499
 500                         copy.ok = this.ok;
 501                         copy.status = this.status;
 502                         copy.statusText = this.statusText;
 503
 504                         return copy;
 505                 },
 506
 507                 /**
 508                  * Access the response content as JSON data.
 509                  *
 510                  * @instance
 511                  * @memberof LuCI.response
 512                  * @throws {SyntaxError}
 513                  * Throws `SyntaxError` if the content isn't valid JSON.
 514                  *
 515                  * @returns {*}
 516                  * The parsed JSON data.
 517                  */
 518                 json: function() {
 519                         if (this.responseJSON == null)
 520                                 this.responseJSON = JSON.parse(this.responseText);
 521
 522                         return this.responseJSON;
 523                 },
 524
 525                 /**
 526                  * Access the response content as string.
 527                  *
 528                  * @instance
 529                  * @memberof LuCI.response
 530                  * @returns {string}
 531                  * The response content.
 532                  */
 533                 text: function() {
 534                         if (this.responseText == null && this.responseJSON != null)
 535                                 this.responseText = JSON.stringify(this.responseJSON);
 536
 537                         return this.responseText;
 538                 },
 539
 540                 /**
 541                  * Access the response content as blob.
 542                  *
 543                  * @instance
 544                  * @memberof LuCI.response
 545                  * @returns {Blob}
 546                  * The response content as blob.
 547                  */
 548                 blob: function() {
 549                         return this.responseBlob;
 550                 }
 551         });
 552
 553
 554         var requestQueue = [];
 555
 556         function isQueueableRequest(opt) {
 557                 if (!classes.rpc)
 558                         return false;
 559
 560                 if (opt.method != 'POST' || typeof(opt.content) != 'object')
 561                         return false;
 562
 563                 if (opt.nobatch === true)
 564                         return false;
 565
 566                 var rpcBaseURL = Request.expandURL(classes.rpc.getBaseURL());
 567
 568                 return (rpcBaseURL != null && opt.url.indexOf(rpcBaseURL) == 0);
 569         }
 570
 571         function flushRequestQueue() {
 572                 if (!requestQueue.length)
 573                         return;
 574
 575                 var reqopt = Object.assign({}, requestQueue[0][0], { content: [], nobatch: true }),
 576                     batch = [];
 577
 578                 for (var i = 0; i < requestQueue.length; i++) {
 579                         batch[i] = requestQueue[i];
 580                         reqopt.content[i] = batch[i][0].content;
 581                 }
 582
 583                 requestQueue.length = 0;
 584
 585                 Request.request(rpcBaseURL, reqopt).then(function(reply) {
 586                         var json = null, req = null;
 587
 588                         try { json = reply.json() }
 589                         catch(e) { }
 590
 591                         while ((req = batch.shift()) != null)
 592                                 if (Array.isArray(json) && json.length)
 593                                         req[2].call(reqopt, reply.clone(json.shift()));
 594                                 else
 595                                         req[1].call(reqopt, new Error('No related RPC reply'));
 596                 }).catch(function(error) {
 597                         var req = null;
 598
 599                         while ((req = batch.shift()) != null)
 600                                 req[1].call(reqopt, error);
 601                 });
 602         }
 603
 604         /**
 605          * @class request
 606          * @memberof LuCI
 607          * @hideconstructor
 608          * @classdesc
 609          *
 610          * The `Request` class allows initiating HTTP requests and provides utilities
 611          * for dealing with responses.
 612          */
 613         var Request = Class.singleton(/** @lends LuCI.request.prototype */ {
 614                 __name__: 'LuCI.request',
 615
 616                 interceptors: [],
 617
 618                 /**
 619                  * Turn the given relative URL into an absolute URL if necessary.
 620                  *
 621                  * @instance
 622                  * @memberof LuCI.request
 623                  * @param {string} url
 624                  * The URL to convert.
 625                  *
 626                  * @returns {string}
 627                  * The absolute URL derived from the given one, or the original URL
 628                  * if it already was absolute.
 629                  */
 630                 expandURL: function(url) {
 631                         if (!/^(?:[^/]+:)?\/\//.test(url))
 632                                 url = location.protocol + '//' + location.host + url;
 633
 634                         return url;
 635                 },
 636
 637                 /**
 638                  * @typedef {Object} RequestOptions
 639                  * @memberof LuCI.request
 640                  *
 641                  * @property {string} [method=GET]
 642                  * The HTTP method to use, e.g. `GET` or `POST`.
 643                  *
 644                  * @property {Object<string, Object|string>} [query]
 645                  * Query string data to append to the URL. Non-string values of the
 646                  * given object will be converted to JSON.
 647                  *
 648                  * @property {boolean} [cache=false]
 649                  * Specifies whether the HTTP response may be retrieved from cache.
 650                  *
 651                  * @property {string} [username]
 652                  * Provides a username for HTTP basic authentication.
 653                  *
 654                  * @property {string} [password]
 655                  * Provides a password for HTTP basic authentication.
 656                  *
 657                  * @property {number} [timeout]
 658                  * Specifies the request timeout in seconds.
 659                  *
 660                  * @property {boolean} [credentials=false]
 661                  * Whether to include credentials such as cookies in the request.
 662                  *
 663                  * @property {string} [responseType=text]
 664                  * Overrides the request response type. Valid values or `text` to
 665                  * interpret the response as UTF-8 string or `blob` to handle the
 666                  * response as binary `Blob` data.
 667                  *
 668                  * @property {*} [content]
 669                  * Specifies the HTTP message body to send along with the request.
 670                  * If the value is a function, it is invoked and the return value
 671                  * used as content, if it is a FormData instance, it is used as-is,
 672                  * if it is an object, it will be converted to JSON, in all other
 673                  * cases it is converted to a string.
 674                  *
 675              * @property {Object<string, string>} [header]
 676              * Specifies HTTP headers to set for the request.
 677              *
 678              * @property {function} [progress]
 679              * An optional request callback function which receives ProgressEvent
 680              * instances as sole argument during the HTTP request transfer.
 681                  */
 682
 683                 /**
 684                  * Initiate an HTTP request to the given target.
 685                  *
 686                  * @instance
 687                  * @memberof LuCI.request
 688                  * @param {string} target
 689                  * The URL to request.
 690                  *
 691                  * @param {LuCI.request.RequestOptions} [options]
 692                  * Additional options to configure the request.
 693                  *
 694                  * @returns {Promise<LuCI.response>}
 695                  * The resulting HTTP response.
 696                  */
 697                 request: function(target, options) {
 698                         var state = { xhr: new XMLHttpRequest(), url: this.expandURL(target), start: Date.now() },
 699                             opt = Object.assign({}, options, state),
 700                             content = null,
 701                             contenttype = null,
 702                             callback = this.handleReadyStateChange;
 703
 704                         return new Promise(function(resolveFn, rejectFn) {
 705                                 opt.xhr.onreadystatechange = callback.bind(opt, resolveFn, rejectFn);
 706                                 opt.method = String(opt.method || 'GET').toUpperCase();
 707
 708                                 if ('query' in opt) {
 709                                         var q = (opt.query != null) ? Object.keys(opt.query).map(function(k) {
 710                                                 if (opt.query[k] != null) {
 711                                                         var v = (typeof(opt.query[k]) == 'object')
 712                                                                 ? JSON.stringify(opt.query[k])
 713                                                                 : String(opt.query[k]);
 714
 715                                                         return '%s=%s'.format(encodeURIComponent(k), encodeURIComponent(v));
 716                                                 }
 717                                                 else {
 718                                                         return encodeURIComponent(k);
 719                                                 }
 720                                         }).join('&') : '';
 721
 722                                         if (q !== '') {
 723                                                 switch (opt.method) {
 724                                                 case 'GET':
 725                                                 case 'HEAD':
 726                                                 case 'OPTIONS':
 727                                                         opt.url += ((/\?/).test(opt.url) ? '&' : '?') + q;
 728                                                         break;
 729
 730                                                 default:
 731                                                         if (content == null) {
 732                                                                 content = q;
 733                                                                 contenttype = 'application/x-www-form-urlencoded';
 734                                                         }
 735                                                 }
 736                                         }
 737                                 }
 738
 739                                 if (!opt.cache)
 740                                         opt.url += ((/\?/).test(opt.url) ? '&' : '?') + (new Date()).getTime();
 741
 742                                 if (isQueueableRequest(opt)) {
 743                                         requestQueue.push([opt, rejectFn, resolveFn]);
 744                                         requestAnimationFrame(flushRequestQueue);
 745                                         return;
 746                                 }
 747
 748                                 if ('username' in opt && 'password' in opt)
 749                                         opt.xhr.open(opt.method, opt.url, true, opt.username, opt.password);
 750                                 else
 751                                         opt.xhr.open(opt.method, opt.url, true);
 752
 753                                 opt.xhr.responseType = opt.responseType || 'text';
 754
 755                                 if ('overrideMimeType' in opt.xhr)
 756                                         opt.xhr.overrideMimeType('application/octet-stream');
 757
 758                                 if ('timeout' in opt)
 759                                         opt.xhr.timeout = +opt.timeout;
 760
 761                                 if ('credentials' in opt)
 762                                         opt.xhr.withCredentials = !!opt.credentials;
 763
 764                                 if (opt.content != null) {
 765                                         switch (typeof(opt.content)) {
 766                                         case 'function':
 767                                                 content = opt.content(xhr);
 768                                                 break;
 769
 770                                         case 'object':
 771                                                 if (!(opt.content instanceof FormData)) {
 772                                                         content = JSON.stringify(opt.content);
 773                                                         contenttype = 'application/json';
 774                                                 }
 775                                                 else {
 776                                                         content = opt.content;
 777                                                 }
 778                                                 break;
 779
 780                                         default:
 781                                                 content = String(opt.content);
 782                                         }
 783                                 }
 784
 785                                 if ('headers' in opt)
 786                                         for (var header in opt.headers)
 787                                                 if (opt.headers.hasOwnProperty(header)) {
 788                                                         if (header.toLowerCase() != 'content-type')
 789                                                                 opt.xhr.setRequestHeader(header, opt.headers[header]);
 790                                                         else
 791                                                                 contenttype = opt.headers[header];
 792                                                 }
 793
 794                                 if ('progress' in opt && 'upload' in opt.xhr)
 795                                         opt.xhr.upload.addEventListener('progress', opt.progress);
 796
 797                                 if (contenttype != null)
 798                                         opt.xhr.setRequestHeader('Content-Type', contenttype);
 799
 800                                 try {
 801                                         opt.xhr.send(content);
 802                                 }
 803                                 catch (e) {
 804                                         rejectFn.call(opt, e);
 805                                 }
 806                         });
 807                 },
 808
 809                 handleReadyStateChange: function(resolveFn, rejectFn, ev) {
 810                         var xhr = this.xhr,
 811                             duration = Date.now() - this.start;
 812
 813                         if (xhr.readyState !== 4)
 814                                 return;
 815
 816                         if (xhr.status === 0 && xhr.statusText === '') {
 817                                 if (duration >= this.timeout)
 818                                         rejectFn.call(this, new Error('XHR request timed out'));
 819                                 else
 820                                         rejectFn.call(this, new Error('XHR request aborted by browser'));
 821                         }
 822                         else {
 823                                 var response = new Response(
 824                                         xhr, xhr.responseURL || this.url, duration);
 825
 826                                 Promise.all(Request.interceptors.map(function(fn) { return fn(response) }))
 827                                         .then(resolveFn.bind(this, response))
 828                                         .catch(rejectFn.bind(this));
 829                         }
 830                 },
 831
 832                 /**
 833                  * Initiate an HTTP GET request to the given target.
 834                  *
 835                  * @instance
 836                  * @memberof LuCI.request
 837                  * @param {string} target
 838                  * The URL to request.
 839                  *
 840                  * @param {LuCI.request.RequestOptions} [options]
 841                  * Additional options to configure the request.
 842                  *
 843                  * @returns {Promise<LuCI.response>}
 844                  * The resulting HTTP response.
 845                  */
 846                 get: function(url, options) {
 847                         return this.request(url, Object.assign({ method: 'GET' }, options));
 848                 },
 849
 850                 /**
 851                  * Initiate an HTTP POST request to the given target.
 852                  *
 853                  * @instance
 854                  * @memberof LuCI.request
 855                  * @param {string} target
 856                  * The URL to request.
 857                  *
 858                  * @param {*} [data]
 859                  * The request data to send, see {@link LuCI.request.RequestOptions} for details.
 860                  *
 861                  * @param {LuCI.request.RequestOptions} [options]
 862                  * Additional options to configure the request.
 863                  *
 864                  * @returns {Promise<LuCI.response>}
 865                  * The resulting HTTP response.
 866                  */
 867                 post: function(url, data, options) {
 868                         return this.request(url, Object.assign({ method: 'POST', content: data }, options));
 869                 },
 870
 871                 /**
 872                  * Interceptor functions are invoked whenever an HTTP reply is received, in the order
 873                  * these functions have been registered.
 874                  * @callback LuCI.request.interceptorFn
 875                  * @param {LuCI.response} res
 876                  * The HTTP response object
 877                  */
 878
 879                 /**
 880                  * Register an HTTP response interceptor function. Interceptor
 881                  * functions are useful to perform default actions on incoming HTTP
 882                  * responses, such as checking for expired authentication or for
 883                  * implementing request retries before returning a failure.
 884                  *
 885                  * @instance
 886                  * @memberof LuCI.request
 887                  * @param {LuCI.request.interceptorFn} interceptorFn
 888                  * The interceptor function to register.
 889                  *
 890                  * @returns {LuCI.request.interceptorFn}
 891                  * The registered function.
 892                  */
 893                 addInterceptor: function(interceptorFn) {
 894                         if (typeof(interceptorFn) == 'function')
 895                                 this.interceptors.push(interceptorFn);
 896                         return interceptorFn;
 897                 },
 898
 899                 /**
 900                  * Remove an HTTP response interceptor function. The passed function
 901                  * value must be the very same value that was used to register the
 902                  * function.
 903                  *
 904                  * @instance
 905                  * @memberof LuCI.request
 906                  * @param {LuCI.request.interceptorFn} interceptorFn
 907                  * The interceptor function to remove.
 908                  *
 909                  * @returns {boolean}
 910                  * Returns `true` if any function has been removed, else `false`.
 911                  */
 912                 removeInterceptor: function(interceptorFn) {
 913                         var oldlen = this.interceptors.length, i = oldlen;
 914                         while (i--)
 915                                 if (this.interceptors[i] === interceptorFn)
 916                                         this.interceptors.splice(i, 1);
 917                         return (this.interceptors.length < oldlen);
 918                 },
 919
 920                 /**
 921                  * @class
 922                  * @memberof LuCI.request
 923                  * @hideconstructor
 924                  * @classdesc
 925                  *
 926                  * The `Request.poll` class provides some convience wrappers around
 927                  * {@link LuCI.poll} mainly to simplify registering repeating HTTP
 928                  * request calls as polling functions.
 929                  */
 930                 poll: {
 931                         /**
 932                          * The callback function is invoked whenever an HTTP reply to a
 933                          * polled request is received or when the polled request timed
 934                          * out.
 935                          *
 936                          * @callback LuCI.request.poll~callbackFn
 937                          * @param {LuCI.response} res
 938                          * The HTTP response object.
 939                          *
 940                          * @param {*} data
 941                          * The response JSON if the response could be parsed as such,
 942                          * else `null`.
 943                          *
 944                          * @param {number} duration
 945                          * The total duration of the request in milliseconds.
 946                          */
 947
 948                         /**
 949                          * Register a repeating HTTP request with an optional callback
 950                          * to invoke whenever a response for the request is received.
 951                          *
 952                          * @instance
 953                          * @memberof LuCI.request.poll
 954                          * @param {number} interval
 955                          * The poll interval in seconds.
 956                          *
 957                          * @param {string} url
 958                          * The URL to request on each poll.
 959                          *
 960                          * @param {LuCI.request.RequestOptions} [options]
 961                          * Additional options to configure the request.
 962                          *
 963                          * @param {LuCI.request.poll~callbackFn} [callback]
 964                          * {@link LuCI.request.poll~callbackFn Callback} function to
 965                          * invoke for each HTTP reply.
 966                          *
 967                          * @throws {TypeError}
 968                          * Throws `TypeError` when an invalid interval was passed.
 969                          *
 970                          * @returns {function}
 971                          * Returns the internally created poll function.
 972                          */
 973                         add: function(interval, url, options, callback) {
 974                                 if (isNaN(interval) || interval <= 0)
 975                                         throw new TypeError('Invalid poll interval');
 976
 977                                 var ival = interval >>> 0,
 978                                     opts = Object.assign({}, options, { timeout: ival * 1000 - 5 });
 979
 980                                 var fn = function() {
 981                                         return Request.request(url, options).then(function(res) {
 982                                                 if (!Poll.active())
 983                                                         return;
 984
 985                                                 try {
 986                                                         callback(res, res.json(), res.duration);
 987                                                 }
 988                                                 catch (err) {
 989                                                         callback(res, null, res.duration);
 990                                                 }
 991                                         });
 992                                 };
 993
 994                                 return (Poll.add(fn, ival) ? fn : null);
 995                         },
 996
 997                         /**
 998                          * Remove a polling request that has been previously added using `add()`.
 999                          * This function is essentially a wrapper around
1000                          * {@link LuCI.poll.remove LuCI.poll.remove()}.
1001                          *
1002                          * @instance
1003                          * @memberof LuCI.request.poll
1004                          * @param {function} entry
1005                          * The poll function returned by {@link LuCI.request.poll#add add()}.
1006                          *
1007                          * @returns {boolean}
1008                          * Returns `true` if any function has been removed, else `false`.
1009                          */
1010                         remove: function(entry) { return Poll.remove(entry) },
1011
1012                         /**
1013                           * Alias for {@link LuCI.poll.start LuCI.poll.start()}.
1014                           *
1015                           * @instance
1016                           * @memberof LuCI.request.poll
1017                           */
1018                         start: function() { return Poll.start() },
1019
1020                         /**
1021                           * Alias for {@link LuCI.poll.stop LuCI.poll.stop()}.
1022                           *
1023                           * @instance
1024                           * @memberof LuCI.request.poll
1025                           */
1026                         stop: function() { return Poll.stop() },
1027
1028                         /**
1029                           * Alias for {@link LuCI.poll.active LuCI.poll.active()}.
1030                           *
1031                           * @instance
1032                           * @memberof LuCI.request.poll
1033                           */
1034                         active: function() { return Poll.active() }
1035                 }
1036         });
1037
1038         /**
1039          * @class poll
1040          * @memberof LuCI
1041          * @hideconstructor
1042          * @classdesc
1043          *
1044          * The `Poll` class allows registering and unregistering poll actions,
1045          * as well as starting, stopping and querying the state of the polling
1046          * loop.
1047          */
1048         var Poll = Class.singleton(/** @lends LuCI.poll.prototype */ {
1049                 __name__: 'LuCI.poll',
1050
1051                 queue: [],
1052
1053                 /**
1054                  * Add a new operation to the polling loop. If the polling loop is not
1055                  * already started at this point, it will be implicitely started.
1056                  *
1057                  * @instance
1058                  * @memberof LuCI.poll
1059                  * @param {function} fn
1060                  * The function to invoke on each poll interval.
1061                  *
1062                  * @param {number} interval
1063                  * The poll interval in seconds.
1064                  *
1065                  * @throws {TypeError}
1066                  * Throws `TypeError` when an invalid interval was passed.
1067                  *
1068                  * @returns {boolean}
1069                  * Returns `true` if the function has been added or `false` if it
1070                  * already is registered.
1071                  */
1072                 add: function(fn, interval) {
1073                         if (interval == null || interval <= 0)
1074                                 interval = env.pollinterval || null;
1075
1076                         if (isNaN(interval) || typeof(fn) != 'function')
1077                                 throw new TypeError('Invalid argument to LuCI.poll.add()');
1078
1079                         for (var i = 0; i < this.queue.length; i++)
1080                                 if (this.queue[i].fn === fn)
1081                                         return false;
1082
1083                         var e = {
1084                                 r: true,
1085                                 i: interval >>> 0,
1086                                 fn: fn
1087                         };
1088
1089                         this.queue.push(e);
1090
1091                         if (this.tick != null && !this.active())
1092                                 this.start();
1093
1094                         return true;
1095                 },
1096
1097                 /**
1098                  * Remove an operation from the polling loop. If no further operatons
1099                  * are registered, the polling loop is implicitely stopped.
1100                  *
1101                  * @instance
1102                  * @memberof LuCI.poll
1103                  * @param {function} fn
1104                  * The function to remove.
1105                  *
1106                  * @throws {TypeError}
1107                  * Throws `TypeError` when the given argument isn't a function.
1108                  *
1109                  * @returns {boolean}
1110                  * Returns `true` if the function has been removed or `false` if it
1111                  * wasn't found.
1112                  */
1113                 remove: function(fn) {
1114                         if (typeof(fn) != 'function')
1115                                 throw new TypeError('Invalid argument to LuCI.poll.remove()');
1116
1117                         var len = this.queue.length;
1118
1119                         for (var i = len; i > 0; i--)
1120                                 if (this.queue[i-1].fn === fn)
1121                                         this.queue.splice(i-1, 1);
1122
1123                         if (!this.queue.length && this.stop())
1124                                 this.tick = 0;
1125
1126                         return (this.queue.length != len);
1127                 },
1128
1129                 /**
1130                  * (Re)start the polling loop. Dispatches a custom `poll-start` event
1131                  * to the `document` object upon successful start.
1132                  *
1133                  * @instance
1134                  * @memberof LuCI.poll
1135                  * @returns {boolean}
1136                  * Returns `true` if polling has been started (or if no functions
1137                  * where registered) or `false` when the polling loop already runs.
1138                  */
1139                 start: function() {
1140                         if (this.active())
1141                                 return false;
1142
1143                         this.tick = 0;
1144
1145                         if (this.queue.length) {
1146                                 this.timer = window.setInterval(this.step, 1000);
1147                                 this.step();
1148                                 document.dispatchEvent(new CustomEvent('poll-start'));
1149                         }
1150
1151                         return true;
1152                 },
1153
1154                 /**
1155                  * Stop the polling loop. Dispatches a custom `poll-stop` event
1156                  * to the `document` object upon successful stop.
1157                  *
1158                  * @instance
1159                  * @memberof LuCI.poll
1160                  * @returns {boolean}
1161                  * Returns `true` if polling has been stopped or `false` if it din't
1162                  * run to begin with.
1163                  */
1164                 stop: function() {
1165                         if (!this.active())
1166                                 return false;
1167
1168                         document.dispatchEvent(new CustomEvent('poll-stop'));
1169                         window.clearInterval(this.timer);
1170                         delete this.timer;
1171                         delete this.tick;
1172                         return true;
1173                 },
1174
1175                 /* private */
1176                 step: function() {
1177                         for (var i = 0, e = null; (e = Poll.queue[i]) != null; i++) {
1178                                 if ((Poll.tick % e.i) != 0)
1179                                         continue;
1180
1181                                 if (!e.r)
1182                                         continue;
1183
1184                                 e.r = false;
1185
1186                                 Promise.resolve(e.fn()).finally((function() { this.r = true }).bind(e));
1187                         }
1188
1189                         Poll.tick = (Poll.tick + 1) % Math.pow(2, 32);
1190                 },
1191
1192                 /**
1193                  * Test whether the polling loop is running.
1194                  *
1195                  * @instance
1196                  * @memberof LuCI.poll
1197                  * @returns {boolean} - Returns `true` if polling is active, else `false`.
1198                  */
1199                 active: function() {
1200                         return (this.timer != null);
1201                 }
1202         });
1203
1204         /**
1205          * @class dom
1206          * @memberof LuCI
1207          * @hideconstructor
1208          * @classdesc
1209          *
1210          * The `dom` class provides convenience method for creating and
1211          * manipulating DOM elements.
1212          *
1213          * To import the class in views, use `'require dom'`, to import it in
1214          * external JavaScript, use `L.require("dom").then(...)`.
1215          */
1216         var DOM = Class.singleton(/** @lends LuCI.dom.prototype */ {
1217                 __name__: 'LuCI.dom',
1218
1219                 /**
1220                  * Tests whether the given argument is a valid DOM `Node`.
1221                  *
1222                  * @instance
1223                  * @memberof LuCI.dom
1224                  * @param {*} e
1225                  * The value to test.
1226                  *
1227                  * @returns {boolean}
1228                  * Returns `true` if the value is a DOM `Node`, else `false`.
1229                  */
1230                 elem: function(e) {
1231                         return (e != null && typeof(e) == 'object' && 'nodeType' in e);
1232                 },
1233
1234                 /**
1235                  * Parses a given string as HTML and returns the first child node.
1236                  *
1237                  * @instance
1238                  * @memberof LuCI.dom
1239                  * @param {string} s
1240                  * A string containing an HTML fragment to parse. Note that only
1241                  * the first result of the resulting structure is returned, so an
1242                  * input value of `<div>foo</div> <div>bar</div>` will only return
1243                  * the first `div` element node.
1244                  *
1245                  * @returns {Node}
1246                  * Returns the first DOM `Node` extracted from the HTML fragment or
1247                  * `null` on parsing failures or if no element could be found.
1248                  */
1249                 parse: function(s) {
1250                         var elem;
1251
1252                         try {
1253                                 domParser = domParser || new DOMParser();
1254                                 elem = domParser.parseFromString(s, 'text/html').body.firstChild;
1255                         }
1256                         catch(e) {}
1257
1258                         if (!elem) {
1259                                 try {
1260                                         dummyElem = dummyElem || document.createElement('div');
1261                                         dummyElem.innerHTML = s;
1262                                         elem = dummyElem.firstChild;
1263                                 }
1264                                 catch (e) {}
1265                         }
1266
1267                         return elem || null;
1268                 },
1269
1270                 /**
1271                  * Tests whether a given `Node` matches the given query selector.
1272                  *
1273                  * This function is a convenience wrapper around the standard
1274                  * `Node.matches("selector")` function with the added benefit that
1275                  * the `node` argument may be a non-`Node` value, in which case
1276                  * this function simply returns `false`.
1277                  *
1278                  * @instance
1279                  * @memberof LuCI.dom
1280                  * @param {*} node
1281                  * The `Node` argument to test the selector against.
1282                  *
1283                  * @param {string} [selector]
1284                  * The query selector expression to test against the given node.
1285                  *
1286                  * @returns {boolean}
1287                  * Returns `true` if the given node matches the specified selector
1288                  * or `false` when the node argument is no valid DOM `Node` or the
1289                  * selector didn't match.
1290                  */
1291                 matches: function(node, selector) {
1292                         var m = this.elem(node) ? node.matches || node.msMatchesSelector : null;
1293                         return m ? m.call(node, selector) : false;
1294                 },
1295
1296                 /**
1297                  * Returns the closest parent node that matches the given query
1298                  * selector expression.
1299                  *
1300                  * This function is a convenience wrapper around the standard
1301                  * `Node.closest("selector")` function with the added benefit that
1302                  * the `node` argument may be a non-`Node` value, in which case
1303                  * this function simply returns `null`.
1304                  *
1305                  * @instance
1306                  * @memberof LuCI.dom
1307                  * @param {*} node
1308                  * The `Node` argument to find the closest parent for.
1309                  *
1310                  * @param {string} [selector]
1311                  * The query selector expression to test against each parent.
1312                  *
1313                  * @returns {Node|null}
1314                  * Returns the closest parent node matching the selector or
1315                  * `null` when the node argument is no valid DOM `Node` or the
1316                  * selector didn't match any parent.
1317                  */
1318                 parent: function(node, selector) {
1319                         if (this.elem(node) && node.closest)
1320                                 return node.closest(selector);
1321
1322                         while (this.elem(node))
1323                                 if (this.matches(node, selector))
1324                                         return node;
1325                                 else
1326                                         node = node.parentNode;
1327
1328                         return null;
1329                 },
1330
1331                 /**
1332                  * Appends the given children data to the given node.
1333                  *
1334                  * @instance
1335                  * @memberof LuCI.dom
1336                  * @param {*} node
1337                  * The `Node` argument to append the children to.
1338                  *
1339                  * @param {*} [children]
1340                  * The childrens to append to the given node.
1341                  *
1342                  * When `children` is an array, then each item of the array
1343                  * will be either appended as child element or text node,
1344                  * depending on whether the item is a DOM `Node` instance or
1345                  * some other non-`null` value. Non-`Node`, non-`null` values
1346                  * will be converted to strings first before being passed as
1347                  * argument to `createTextNode()`.
1348                  *
1349                  * When `children` is a function, it will be invoked with
1350                  * the passed `node` argument as sole parameter and the `append`
1351                  * function will be invoked again, with the given `node` argument
1352                  * as first and the return value of the `children` function as
1353                  * second parameter.
1354                  *
1355                  * When `children` is is a DOM `Node` instance, it will be
1356                  * appended to the given `node`.
1357                  *
1358                  * When `children` is any other non-`null` value, it will be
1359                  * converted to a string and appened to the `innerHTML` property
1360                  * of the given `node`.
1361                  *
1362                  * @returns {Node|null}
1363                  * Returns the last children `Node` appended to the node or `null`
1364                  * if either the `node` argument was no valid DOM `node` or if the
1365                  * `children` was `null` or didn't result in further DOM nodes.
1366                  */
1367                 append: function(node, children) {
1368                         if (!this.elem(node))
1369                                 return null;
1370
1371                         if (Array.isArray(children)) {
1372                                 for (var i = 0; i < children.length; i++)
1373                                         if (this.elem(children[i]))
1374                                                 node.appendChild(children[i]);
1375                                         else if (children !== null && children !== undefined)
1376                                                 node.appendChild(document.createTextNode('' + children[i]));
1377
1378                                 return node.lastChild;
1379                         }
1380                         else if (typeof(children) === 'function') {
1381                                 return this.append(node, children(node));
1382                         }
1383                         else if (this.elem(children)) {
1384                                 return node.appendChild(children);
1385                         }
1386                         else if (children !== null && children !== undefined) {
1387                                 node.innerHTML = '' + children;
1388                                 return node.lastChild;
1389                         }
1390
1391                         return null;
1392                 },
1393
1394                 /**
1395                  * Replaces the content of the given node with the given children.
1396                  *
1397                  * This function first removes any children of the given DOM
1398                  * `Node` and then adds the given given children following the
1399                  * rules outlined below.
1400                  *
1401                  * @instance
1402                  * @memberof LuCI.dom
1403                  * @param {*} node
1404                  * The `Node` argument to replace the children of.
1405                  *
1406                  * @param {*} [children]
1407                  * The childrens to replace into the given node.
1408                  *
1409                  * When `children` is an array, then each item of the array
1410                  * will be either appended as child element or text node,
1411                  * depending on whether the item is a DOM `Node` instance or
1412                  * some other non-`null` value. Non-`Node`, non-`null` values
1413                  * will be converted to strings first before being passed as
1414                  * argument to `createTextNode()`.
1415                  *
1416                  * When `children` is a function, it will be invoked with
1417                  * the passed `node` argument as sole parameter and the `append`
1418                  * function will be invoked again, with the given `node` argument
1419                  * as first and the return value of the `children` function as
1420                  * second parameter.
1421                  *
1422                  * When `children` is is a DOM `Node` instance, it will be
1423                  * appended to the given `node`.
1424                  *
1425                  * When `children` is any other non-`null` value, it will be
1426                  * converted to a string and appened to the `innerHTML` property
1427                  * of the given `node`.
1428                  *
1429                  * @returns {Node|null}
1430                  * Returns the last children `Node` appended to the node or `null`
1431                  * if either the `node` argument was no valid DOM `node` or if the
1432                  * `children` was `null` or didn't result in further DOM nodes.
1433                  */
1434                 content: function(node, children) {
1435                         if (!this.elem(node))
1436                                 return null;
1437
1438                         var dataNodes = node.querySelectorAll('[data-idref]');
1439
1440                         for (var i = 0; i < dataNodes.length; i++)
1441                                 delete this.registry[dataNodes[i].getAttribute('data-idref')];
1442
1443                         while (node.firstChild)
1444                                 node.removeChild(node.firstChild);
1445
1446                         return this.append(node, children);
1447                 },
1448
1449                 /**
1450                  * Sets attributes or registers event listeners on element nodes.
1451                  *
1452                  * @instance
1453                  * @memberof LuCI.dom
1454                  * @param {*} node
1455                  * The `Node` argument to set the attributes or add the event
1456                  * listeners for. When the given `node` value is not a valid
1457                  * DOM `Node`, the function returns and does nothing.
1458                  *
1459                  * @param {string|Object<string, *>} key
1460                  * Specifies either the attribute or event handler name to use,
1461                  * or an object containing multiple key, value pairs which are
1462                  * each added to the node as either attribute or event handler,
1463                  * depending on the respective value.
1464                  *
1465                  * @param {*} [val]
1466                  * Specifies the attribute value or event handler function to add.
1467                  * If the `key` parameter is an `Object`, this parameter will be
1468                  * ignored.
1469                  *
1470                  * When `val` is of type function, it will be registered as event
1471                  * handler on the given `node` with the `key` parameter being the
1472                  * event name.
1473                  *
1474                  * When `val` is of type object, it will be serialized as JSON and
1475                  * added as attribute to the given `node`, using the given `key`
1476                  * as attribute name.
1477                  *
1478                  * When `val` is of any other type, it will be added as attribute
1479                  * to the given `node` as-is, with the underlying `setAttribute()`
1480                  * call implicitely turning it into a string.
1481                  */
1482                 attr: function(node, key, val) {
1483                         if (!this.elem(node))
1484                                 return null;
1485
1486                         var attr = null;
1487
1488                         if (typeof(key) === 'object' && key !== null)
1489                                 attr = key;
1490                         else if (typeof(key) === 'string')
1491                                 attr = {}, attr[key] = val;
1492
1493                         for (key in attr) {
1494                                 if (!attr.hasOwnProperty(key) || attr[key] == null)
1495                                         continue;
1496
1497                                 switch (typeof(attr[key])) {
1498                                 case 'function':
1499                                         node.addEventListener(key, attr[key]);
1500                                         break;
1501
1502                                 case 'object':
1503                                         node.setAttribute(key, JSON.stringify(attr[key]));
1504                                         break;
1505
1506                                 default:
1507                                         node.setAttribute(key, attr[key]);
1508                                 }
1509                         }
1510                 },
1511
1512                 /**
1513                  * Creates a new DOM `Node` from the given `html`, `attr` and
1514                  * `data` parameters.
1515                  *
1516                  * This function has multiple signatures, it can be either invoked
1517                  * in the form `create(html[, attr[, data]])` or in the form
1518                  * `create(html[, data])`. The used variant is determined from the
1519                  * type of the second argument.
1520                  *
1521                  * @instance
1522                  * @memberof LuCI.dom
1523                  * @param {*} html
1524                  * Describes the node to create.
1525                  *
1526                  * When the value of `html` is of type array, a `DocumentFragment`
1527                  * node is created and each item of the array is first converted
1528                  * to a DOM `Node` by passing it through `create()` and then added
1529                  * as child to the fragment.
1530                  *
1531                  * When the value of `html` is a DOM `Node` instance, no new
1532                  * element will be created but the node will be used as-is.
1533                  *
1534                  * When the value of `html` is a string starting with `<`, it will
1535                  * be passed to `dom.parse()` and the resulting value is used.
1536                  *
1537                  * When the value of `html` is any other string, it will be passed
1538                  * to `document.createElement()` for creating a new DOM `Node` of
1539                  * the given name.
1540                  *
1541                  * @param {Object<string, *>} [attr]
1542                  * Specifies an Object of key, value pairs to set as attributes
1543                  * or event handlers on the created node. Refer to
1544                  * {@link LuCI.dom#attr dom.attr()} for details.
1545                  *
1546                  * @param {*} [data]
1547                  * Specifies children to append to the newly created element.
1548                  * Refer to {@link LuCI.dom#append dom.append()} for details.
1549                  *
1550                  * @throws {InvalidCharacterError}
1551                  * Throws an `InvalidCharacterError` when the given `html`
1552                  * argument contained malformed markup (such as not escaped
1553                  * `&` characters in XHTML mode) or when the given node name
1554                  * in `html` contains characters which are not legal in DOM
1555                  * element names, such as spaces.
1556                  *
1557                  * @returns {Node}
1558                  * Returns the newly created `Node`.
1559                  */
1560                 create: function() {
1561                         var html = arguments[0],
1562                             attr = arguments[1],
1563                             data = arguments[2],
1564                             elem;
1565
1566                         if (!(attr instanceof Object) || Array.isArray(attr))
1567                                 data = attr, attr = null;
1568
1569                         if (Array.isArray(html)) {
1570                                 elem = document.createDocumentFragment();
1571                                 for (var i = 0; i < html.length; i++)
1572                                         elem.appendChild(this.create(html[i]));
1573                         }
1574                         else if (this.elem(html)) {
1575                                 elem = html;
1576                         }
1577                         else if (html.charCodeAt(0) === 60) {
1578                                 elem = this.parse(html);
1579                         }
1580                         else {
1581                                 elem = document.createElement(html);
1582                         }
1583
1584                         if (!elem)
1585                                 return null;
1586
1587                         this.attr(elem, attr);
1588                         this.append(elem, data);
1589
1590                         return elem;
1591                 },
1592
1593                 registry: {},
1594
1595                 /**
1596                  * Attaches or detaches arbitrary data to and from a DOM `Node`.
1597                  *
1598                  * This function is useful to attach non-string values or runtime
1599                  * data that is not serializable to DOM nodes. To decouple data
1600                  * from the DOM, values are not added directly to nodes, but
1601                  * inserted into a registry instead which is then referenced by a
1602                  * string key stored as `data-idref` attribute in the node.
1603                  *
1604                  * This function has multiple signatures and is sensitive to the
1605                  * number of arguments passed to it.
1606                  *
1607                  *  - `dom.data(node)` -
1608                  *     Fetches all data associated with the given node.
1609                  *  - `dom.data(node, key)` -
1610                  *     Fetches a specific key associated with the given node.
1611                  *  - `dom.data(node, key, val)` -
1612                  *     Sets a specific key to the given value associated with the
1613                  *     given node.
1614                  *  - `dom.data(node, null)` -
1615                  *     Clears any data associated with the node.
1616                  *  - `dom.data(node, key, null)` -
1617                  *     Clears the given key associated with the node.
1618                  *
1619                  * @instance
1620                  * @memberof LuCI.dom
1621                  * @param {Node} node
1622                  * The DOM `Node` instance to set or retrieve the data for.
1623                  *
1624                  * @param {string|null} [key]
1625                  * This is either a string specifying the key to retrieve, or
1626                  * `null` to unset the entire node data.
1627                  *
1628                  * @param {*|null} [val]
1629                  * This is either a non-`null` value to set for a given key or
1630                  * `null` to remove the given `key` from the specified node.
1631                  *
1632                  * @returns {*}
1633                  * Returns the get or set value, or `null` when no value could
1634                  * be found.
1635                  */
1636                 data: function(node, key, val) {
1637                         if (!node || !node.getAttribute)
1638                                 return null;
1639
1640                         var id = node.getAttribute('data-idref');
1641
1642                         /* clear all data */
1643                         if (arguments.length > 1 && key == null) {
1644                                 if (id != null) {
1645                                         node.removeAttribute('data-idref');
1646                                         val = this.registry[id]
1647                                         delete this.registry[id];
1648                                         return val;
1649                                 }
1650
1651                                 return null;
1652                         }
1653
1654                         /* clear a key */
1655                         else if (arguments.length > 2 && key != null && val == null) {
1656                                 if (id != null) {
1657                                         val = this.registry[id][key];
1658                                         delete this.registry[id][key];
1659                                         return val;
1660                                 }
1661
1662                                 return null;
1663                         }
1664
1665                         /* set a key */
1666                         else if (arguments.length > 2 && key != null && val != null) {
1667                                 if (id == null) {
1668                                         do { id = Math.floor(Math.random() * 0xffffffff).toString(16) }
1669                                         while (this.registry.hasOwnProperty(id));
1670
1671                                         node.setAttribute('data-idref', id);
1672                                         this.registry[id] = {};
1673                                 }
1674
1675                                 return (this.registry[id][key] = val);
1676                         }
1677
1678                         /* get all data */
1679                         else if (arguments.length == 1) {
1680                                 if (id != null)
1681                                         return this.registry[id];
1682
1683                                 return null;
1684                         }
1685
1686                         /* get a key */
1687                         else if (arguments.length == 2) {
1688                                 if (id != null)
1689                                         return this.registry[id][key];
1690                         }
1691
1692                         return null;
1693                 },
1694
1695                 /**
1696                  * Binds the given class instance ot the specified DOM `Node`.
1697                  *
1698                  * This function uses the `dom.data()` facility to attach the
1699                  * passed instance of a Class to a node. This is needed for
1700                  * complex widget elements or similar where the corresponding
1701                  * class instance responsible for the element must be retrieved
1702                  * from DOM nodes obtained by `querySelector()` or similar means.
1703                  *
1704                  * @instance
1705                  * @memberof LuCI.dom
1706                  * @param {Node} node
1707                  * The DOM `Node` instance to bind the class to.
1708                  *
1709                  * @param {Class} inst
1710                  * The Class instance to bind to the node.
1711                  *
1712                  * @throws {TypeError}
1713                  * Throws a `TypeError` when the given instance argument isn't
1714                  * a valid Class instance.
1715                  *
1716                  * @returns {Class}
1717                  * Returns the bound class instance.
1718                  */
1719                 bindClassInstance: function(node, inst) {
1720                         if (!(inst instanceof Class))
1721                                 L.error('TypeError', 'Argument must be a class instance');
1722
1723                         return this.data(node, '_class', inst);
1724                 },
1725
1726                 /**
1727                  * Finds a bound class instance on the given node itself or the
1728                  * first bound instance on its closest parent node.
1729                  *
1730                  * @instance
1731                  * @memberof LuCI.dom
1732                  * @param {Node} node
1733                  * The DOM `Node` instance to start from.
1734                  *
1735                  * @returns {Class|null}
1736                  * Returns the founds class instance if any or `null` if no bound
1737                  * class could be found on the node itself or any of its parents.
1738                  */
1739                 findClassInstance: function(node) {
1740                         var inst = null;
1741
1742                         do {
1743                                 inst = this.data(node, '_class');
1744                                 node = node.parentNode;
1745                         }
1746                         while (!(inst instanceof Class) && node != null);
1747
1748                         return inst;
1749                 },
1750
1751                 /**
1752                  * Finds a bound class instance on the given node itself or the
1753                  * first bound instance on its closest parent node and invokes
1754                  * the specified method name on the found class instance.
1755                  *
1756                  * @instance
1757                  * @memberof LuCI.dom
1758                  * @param {Node} node
1759                  * The DOM `Node` instance to start from.
1760                  *
1761                  * @param {string} method
1762                  * The name of the method to invoke on the found class instance.
1763                  *
1764                  * @param {...*} params
1765                  * Additional arguments to pass to the invoked method as-is.
1766                  *
1767                  * @returns {*|null}
1768                  * Returns the return value of the invoked method if a class
1769                  * instance and method has been found. Returns `null` if either
1770                  * no bound class instance could be found, or if the found
1771                  * instance didn't have the requested `method`.
1772                  */
1773                 callClassMethod: function(node, method /*, ... */) {
1774                         var inst = this.findClassInstance(node);
1775
1776                         if (inst == null || typeof(inst[method]) != 'function')
1777                                 return null;
1778
1779                         return inst[method].apply(inst, inst.varargs(arguments, 2));
1780                 },
1781
1782                 /**
1783                  * The ignore callback function is invoked by `isEmpty()` for each
1784                  * child node to decide whether to ignore a child node or not.
1785                  *
1786                  * When this function returns `false`, the node passed to it is
1787                  * ignored, else not.
1788                  *
1789                  * @callback LuCI.dom~ignoreCallbackFn
1790                  * @param {Node} node
1791                  * The child node to test.
1792                  *
1793                  * @returns {boolean}
1794                  * Boolean indicating whether to ignore the node or not.
1795                  */
1796
1797                 /**
1798                  * Tests whether a given DOM `Node` instance is empty or appears
1799                  * empty.
1800                  *
1801                  * Any element child nodes which have the CSS class `hidden` set
1802                  * or for which the optionally passed `ignoreFn` callback function
1803                  * returns `false` are ignored.
1804                  *
1805                  * @instance
1806                  * @memberof LuCI.dom
1807                  * @param {Node} node
1808                  * The DOM `Node` instance to test.
1809                  *
1810                  * @param {LuCI.dom~ignoreCallbackFn} [ignoreFn]
1811                  * Specifies an optional function which is invoked for each child
1812                  * node to decide whether the child node should be ignored or not.
1813                  *
1814                  * @returns {boolean}
1815                  * Returns `true` if the node does not have any children or if
1816                  * any children node either has a `hidden` CSS class or a `false`
1817                  * result when testing it using the given `ignoreFn`.
1818                  */
1819                 isEmpty: function(node, ignoreFn) {
1820                         for (var child = node.firstElementChild; child != null; child = child.nextElementSibling)
1821                                 if (!child.classList.contains('hidden') && (!ignoreFn || !ignoreFn(child)))
1822                                         return false;
1823
1824                         return true;
1825                 }
1826         });
1827
1828         /**
1829          * @class session
1830          * @memberof LuCI
1831          * @hideconstructor
1832          * @classdesc
1833          *
1834          * The `session` class provides various session related functionality.
1835          */
1836         var Session = Class.singleton(/** @lends LuCI.session.prototype */ {
1837                 __name__: 'LuCI.session',
1838
1839                 /**
1840                  * Retrieve the current session ID.
1841                  *
1842                  * @returns {string}
1843                  * Returns the current session ID.
1844                  */
1845                 getID: function() {
1846                         return env.sessionid || '00000000000000000000000000000000';
1847                 },
1848
1849                 /**
1850                  * Retrieve data from the local session storage.
1851                  *
1852                  * @param {string} [key]
1853                  * The key to retrieve from the session data store. If omitted, all
1854                  * session data will be returned.
1855                  *
1856                  * @returns {*}
1857                  * Returns the stored session data or `null` if the given key wasn't
1858                  * found.
1859                  */
1860                 getLocalData: function(key) {
1861                         try {
1862                                 var sid = this.getID(),
1863                                     item = 'luci-session-store',
1864                                     data = JSON.parse(window.sessionStorage.getItem(item));
1865
1866                                 if (!LuCI.prototype.isObject(data) || !data.hasOwnProperty(sid)) {
1867                                         data = {};
1868                                         data[sid] = {};
1869                                 }
1870
1871                                 if (key != null)
1872                                         return data[sid].hasOwnProperty(key) ? data[sid][key] : null;
1873
1874                                 return data[sid];
1875                         }
1876                         catch (e) {
1877                                 return (key != null) ? null : {};
1878                         }
1879                 },
1880
1881                 /**
1882                  * Set data in the local session storage.
1883                  *
1884                  * @param {string} key
1885                  * The key to set in the session data store.
1886                  *
1887                  * @param {*} value
1888                  * The value to store. It will be internally converted to JSON before
1889                  * being put in the session store.
1890                  *
1891                  * @returns {boolean}
1892                  * Returns `true` if the data could be stored or `false` on error.
1893                  */
1894                 setLocalData: function(key, value) {
1895                         if (key == null)
1896                                 return false;
1897
1898                         try {
1899                                 var sid = this.getID(),
1900                                     item = 'luci-session-store',
1901                                     data = JSON.parse(window.sessionStorage.getItem(item));
1902
1903                                 if (!LuCI.prototype.isObject(data) || !data.hasOwnProperty(sid)) {
1904                                         data = {};
1905                                         data[sid] = {};
1906                                 }
1907
1908                                 if (value != null)
1909                                         data[sid][key] = value;
1910                                 else
1911                                         delete data[sid][key];
1912
1913                                 window.sessionStorage.setItem(item, JSON.stringify(data));
1914
1915                                 return true;
1916                         }
1917                         catch (e) {
1918                                 return false;
1919                         }
1920                 }
1921         });
1922
1923         /**
1924          * @class view
1925          * @memberof LuCI
1926          * @hideconstructor
1927          * @classdesc
1928          *
1929          * The `view` class forms the basis of views and provides a standard
1930          * set of methods to inherit from.
1931          */
1932         var View = Class.extend(/** @lends LuCI.view.prototype */ {
1933                 __name__: 'LuCI.view',
1934
1935                 __init__: function() {
1936                         var vp = document.getElementById('view');
1937
1938                         DOM.content(vp, E('div', { 'class': 'spinning' }, _('Loading view…')));
1939
1940                         return Promise.resolve(this.load())
1941                                 .then(L.bind(this.render, this))
1942                                 .then(L.bind(function(nodes) {
1943                                         var vp = document.getElementById('view');
1944
1945                                         DOM.content(vp, nodes);
1946                                         DOM.append(vp, this.addFooter());
1947                                 }, this)).catch(L.error);
1948                 },
1949
1950                 /**
1951                  * The load function is invoked before the view is rendered.
1952                  *
1953                  * The invocation of this function is wrapped by
1954                  * `Promise.resolve()` so it may return Promises if needed.
1955                  *
1956                  * The return value of the function (or the resolved values
1957                  * of the promise returned by it) will be passed as first
1958                  * argument to `render()`.
1959                  *
1960                  * This function is supposed to be overwritten by subclasses,
1961                  * the default implementation does nothing.
1962                  *
1963                  * @instance
1964                  * @abstract
1965                  * @memberof LuCI.view
1966                  *
1967                  * @returns {*|Promise<*>}
1968                  * May return any value or a Promise resolving to any value.
1969                  */
1970                 load: function() {},
1971
1972                 /**
1973                  * The render function is invoked after the
1974                  * {@link LuCI.view#load load()} function and responsible
1975                  * for setting up the view contents. It must return a DOM
1976                  * `Node` or `DocumentFragment` holding the contents to
1977                  * insert into the view area.
1978                  *
1979                  * The invocation of this function is wrapped by
1980                  * `Promise.resolve()` so it may return Promises if needed.
1981                  *
1982                  * The return value of the function (or the resolved values
1983                  * of the promise returned by it) will be inserted into the
1984                  * main content area using
1985                  * {@link LuCI.dom#append dom.append()}.
1986                  *
1987                  * This function is supposed to be overwritten by subclasses,
1988                  * the default implementation does nothing.
1989                  *
1990                  * @instance
1991                  * @abstract
1992                  * @memberof LuCI.view
1993                  * @param {*|null} load_results
1994                  * This function will receive the return value of the
1995                  * {@link LuCI.view#load view.load()} function as first
1996                  * argument.
1997                  *
1998                  * @returns {Node|Promise<Node>}
1999                  * Should return a DOM `Node` value or a `Promise` resolving
2000                  * to a `Node` value.
2001                  */
2002                 render: function() {},
2003
2004                 /**
2005                  * The handleSave function is invoked when the user clicks
2006                  * the `Save` button in the page action footer.
2007                  *
2008                  * The default implementation should be sufficient for most
2009                  * views using {@link form#Map form.Map()} based forms - it
2010                  * will iterate all forms present in the view and invoke
2011                  * the {@link form#Map#save Map.save()} method on each form.
2012                  *
2013                  * Views not using `Map` instances or requiring other special
2014                  * logic should overwrite `handleSave()` with a custom
2015                  * implementation.
2016                  *
2017                  * To disable the `Save` page footer button, views extending
2018                  * this base class should overwrite the `handleSave` function
2019                  * with `null`.
2020                  *
2021                  * The invocation of this function is wrapped by
2022                  * `Promise.resolve()` so it may return Promises if needed.
2023                  *
2024                  * @instance
2025                  * @memberof LuCI.view
2026                  * @param {Event} ev
2027                  * The DOM event that triggered the function.
2028                  *
2029                  * @returns {*|Promise<*>}
2030                  * Any return values of this function are discarded, but
2031                  * passed through `Promise.resolve()` to ensure that any
2032                  * returned promise runs to completion before the button
2033                  * is reenabled.
2034                  */
2035                 handleSave: function(ev) {
2036                         var tasks = [];
2037
2038                         document.getElementById('maincontent')
2039                                 .querySelectorAll('.cbi-map').forEach(function(map) {
2040                                         tasks.push(DOM.callClassMethod(map, 'save'));
2041                                 });
2042
2043                         return Promise.all(tasks);
2044                 },
2045
2046                 /**
2047                  * The handleSaveApply function is invoked when the user clicks
2048                  * the `Save & Apply` button in the page action footer.
2049                  *
2050                  * The default implementation should be sufficient for most
2051                  * views using {@link form#Map form.Map()} based forms - it
2052                  * will first invoke
2053                  * {@link LuCI.view.handleSave view.handleSave()} and then
2054                  * call {@link ui#changes#apply ui.changes.apply()} to start the
2055                  * modal config apply and page reload flow.
2056                  *
2057                  * Views not using `Map` instances or requiring other special
2058                  * logic should overwrite `handleSaveApply()` with a custom
2059                  * implementation.
2060                  *
2061                  * To disable the `Save & Apply` page footer button, views
2062                  * extending this base class should overwrite the
2063                  * `handleSaveApply` function with `null`.
2064                  *
2065                  * The invocation of this function is wrapped by
2066                  * `Promise.resolve()` so it may return Promises if needed.
2067                  *
2068                  * @instance
2069                  * @memberof LuCI.view
2070                  * @param {Event} ev
2071                  * The DOM event that triggered the function.
2072                  *
2073                  * @returns {*|Promise<*>}
2074                  * Any return values of this function are discarded, but
2075                  * passed through `Promise.resolve()` to ensure that any
2076                  * returned promise runs to completion before the button
2077                  * is reenabled.
2078                  */
2079                 handleSaveApply: function(ev, mode) {
2080                         return this.handleSave(ev).then(function() {
2081                                 L.ui.changes.apply(mode == '0');
2082                         });
2083                 },
2084
2085                 /**
2086                  * The handleReset function is invoked when the user clicks
2087                  * the `Reset` button in the page action footer.
2088                  *
2089                  * The default implementation should be sufficient for most
2090                  * views using {@link form#Map form.Map()} based forms - it
2091                  * will iterate all forms present in the view and invoke
2092                  * the {@link form#Map#save Map.reset()} method on each form.
2093                  *
2094                  * Views not using `Map` instances or requiring other special
2095                  * logic should overwrite `handleReset()` with a custom
2096                  * implementation.
2097                  *
2098                  * To disable the `Reset` page footer button, views extending
2099                  * this base class should overwrite the `handleReset` function
2100                  * with `null`.
2101                  *
2102                  * The invocation of this function is wrapped by
2103                  * `Promise.resolve()` so it may return Promises if needed.
2104                  *
2105                  * @instance
2106                  * @memberof LuCI.view
2107                  * @param {Event} ev
2108                  * The DOM event that triggered the function.
2109                  *
2110                  * @returns {*|Promise<*>}
2111                  * Any return values of this function are discarded, but
2112                  * passed through `Promise.resolve()` to ensure that any
2113                  * returned promise runs to completion before the button
2114                  * is reenabled.
2115                  */
2116                 handleReset: function(ev) {
2117                         var tasks = [];
2118
2119                         document.getElementById('maincontent')
2120                                 .querySelectorAll('.cbi-map').forEach(function(map) {
2121                                         tasks.push(DOM.callClassMethod(map, 'reset'));
2122                                 });
2123
2124                         return Promise.all(tasks);
2125                 },
2126
2127                 /**
2128                  * Renders a standard page action footer if any of the
2129                  * `handleSave()`, `handleSaveApply()` or `handleReset()`
2130                  * functions are defined.
2131                  *
2132                  * The default implementation should be sufficient for most
2133                  * views - it will render a standard page footer with action
2134                  * buttons labeled `Save`, `Save & Apply` and `Reset`
2135                  * triggering the `handleSave()`, `handleSaveApply()` and
2136                  * `handleReset()` functions respectively.
2137                  *
2138                  * When any of these `handle*()` functions is overwritten
2139                  * with `null` by a view extending this class, the
2140                  * corresponding button will not be rendered.
2141                  *
2142                  * @instance
2143                  * @memberof LuCI.view
2144                  * @returns {DocumentFragment}
2145                  * Returns a `DocumentFragment` containing the footer bar
2146                  * with buttons for each corresponding `handle*()` action
2147                  * or an empty `DocumentFragment` if all three `handle*()`
2148                  * methods are overwritten with `null`.
2149                  */
2150                 addFooter: function() {
2151                         var footer = E([]);
2152
2153                         var saveApplyBtn = this.handleSaveApply ? new L.ui.ComboButton('0', {
2154                                 0: [ _('Save & Apply') ],
2155                                 1: [ _('Apply unchecked') ]
2156                         }, {
2157                                 classes: {
2158                                         0: 'btn cbi-button cbi-button-apply important',
2159                                         1: 'btn cbi-button cbi-button-negative important'
2160                                 },
2161                                 click: L.ui.createHandlerFn(this, 'handleSaveApply')
2162                         }).render() : E([]);
2163
2164                         if (this.handleSaveApply || this.handleSave || this.handleReset) {
2165                                 footer.appendChild(E('div', { 'class': 'cbi-page-actions control-group' }, [
2166                                         saveApplyBtn, ' ',
2167                                         this.handleSave ? E('button', {
2168                                                 'class': 'cbi-button cbi-button-save',
2169                                                 'click': L.ui.createHandlerFn(this, 'handleSave')
2170                                         }, [ _('Save') ]) : '', ' ',
2171                                         this.handleReset ? E('button', {
2172                                                 'class': 'cbi-button cbi-button-reset',
2173                                                 'click': L.ui.createHandlerFn(this, 'handleReset')
2174                                         }, [ _('Reset') ]) : ''
2175                                 ]));
2176                         }
2177
2178                         return footer;
2179                 }
2180         });
2181
2182
2183         var dummyElem = null,
2184             domParser = null,
2185             originalCBIInit = null,
2186             rpcBaseURL = null,
2187             sysFeatures = null,
2188             preloadClasses = null;
2189
2190         /* "preload" builtin classes to make the available via require */
2191         var classes = {
2192                 baseclass: Class,
2193                 dom: DOM,
2194                 poll: Poll,
2195                 request: Request,
2196                 session: Session,
2197                 view: View
2198         };
2199
2200         var LuCI = Class.extend(/** @lends LuCI.prototype */ {
2201                 __name__: 'LuCI',
2202                 __init__: function(setenv) {
2203
2204                         document.querySelectorAll('script[src*="/luci.js"]').forEach(function(s) {
2205                                 if (setenv.base_url == null || setenv.base_url == '') {
2206                                         var m = (s.getAttribute('src') || '').match(/^(.*)\/luci\.js(?:\?v=([^?]+))?$/);
2207                                         if (m) {
2208                                                 setenv.base_url = m[1];
2209                                                 setenv.resource_version = m[2];
2210                                         }
2211                                 }
2212                         });
2213
2214                         if (setenv.base_url == null)
2215                                 this.error('InternalError', 'Cannot find url of luci.js');
2216
2217                         setenv.cgi_base = setenv.scriptname.replace(/\/[^\/]+$/, '');
2218
2219                         Object.assign(env, setenv);
2220
2221                         var domReady = new Promise(function(resolveFn, rejectFn) {
2222                                 document.addEventListener('DOMContentLoaded', resolveFn);
2223                         });
2224
2225                         Promise.all([
2226                                 domReady,
2227                                 this.require('ui'),
2228                                 this.require('rpc'),
2229                                 this.require('form'),
2230                                 this.probeRPCBaseURL()
2231                         ]).then(this.setupDOM.bind(this)).catch(this.error);
2232
2233                         originalCBIInit = window.cbi_init;
2234                         window.cbi_init = function() {};
2235                 },
2236
2237                 /**
2238                  * Captures the current stack trace and throws an error of the
2239                  * specified type as a new exception. Also logs the exception as
2240                  * error to the debug console if it is available.
2241                  *
2242                  * @instance
2243                  * @memberof LuCI
2244                  *
2245                  * @param {Error|string} [type=Error]
2246                  * Either a string specifying the type of the error to throw or an
2247                  * existing `Error` instance to copy.
2248                  *
2249                  * @param {string} [fmt=Unspecified error]
2250                  * A format string which is used to form the error message, together
2251                  * with all subsequent optional arguments.
2252                  *
2253                  * @param {...*} [args]
2254                  * Zero or more variable arguments to the supplied format string.
2255                  *
2256                  * @throws {Error}
2257                  * Throws the created error object with the captured stack trace
2258                  * appended to the message and the type set to the given type
2259                  * argument or copied from the given error instance.
2260                  */
2261                 raise: function(type, fmt /*, ...*/) {
2262                         var e = null,
2263                             msg = fmt ? String.prototype.format.apply(fmt, this.varargs(arguments, 2)) : null,
2264                             stack = null;
2265
2266                         if (type instanceof Error) {
2267                                 e = type;
2268
2269                                 if (msg)
2270                                         e.message = msg + ': ' + e.message;
2271                         }
2272                         else {
2273                                 try { throw new Error('stacktrace') }
2274                                 catch (e2) { stack = (e2.stack || '').split(/\n/) }
2275
2276                                 e = new (window[type || 'Error'] || Error)(msg || 'Unspecified error');
2277                                 e.name = type || 'Error';
2278                         }
2279
2280                         stack = (stack || []).map(function(frame) {
2281                                 frame = frame.replace(/(.*?)@(.+):(\d+):(\d+)/g, 'at $1 ($2:$3:$4)').trim();
2282                                 return frame ? '  ' + frame : '';
2283                         });
2284
2285                         if (!/^  at /.test(stack[0]))
2286                                 stack.shift();
2287
2288                         if (/\braise /.test(stack[0]))
2289                                 stack.shift();
2290
2291                         if (/\berror /.test(stack[0]))
2292                                 stack.shift();
2293
2294                         if (stack.length)
2295                                 e.message += '\n' + stack.join('\n');
2296
2297                         if (window.console && console.debug)
2298                                 console.debug(e);
2299
2300                         throw e;
2301                 },
2302
2303                 /**
2304                  * A wrapper around {@link LuCI#raise raise()} which also renders
2305                  * the error either as modal overlay when `ui.js` is already loaed
2306                  * or directly into the view body.
2307                  *
2308                  * @instance
2309                  * @memberof LuCI
2310                  *
2311                  * @param {Error|string} [type=Error]
2312                  * Either a string specifying the type of the error to throw or an
2313                  * existing `Error` instance to copy.
2314                  *
2315                  * @param {string} [fmt=Unspecified error]
2316                  * A format string which is used to form the error message, together
2317                  * with all subsequent optional arguments.
2318                  *
2319                  * @param {...*} [args]
2320                  * Zero or more variable arguments to the supplied format string.
2321                  *
2322                  * @throws {Error}
2323                  * Throws the created error object with the captured stack trace
2324                  * appended to the message and the type set to the given type
2325                  * argument or copied from the given error instance.
2326                  */
2327                 error: function(type, fmt /*, ...*/) {
2328                         try {
2329                                 L.raise.apply(L, Array.prototype.slice.call(arguments));
2330                         }
2331                         catch (e) {
2332                                 if (!e.reported) {
2333                                         if (L.ui)
2334                                                 L.ui.addNotification(e.name || _('Runtime error'),
2335                                                         E('pre', {}, e.message), 'danger');
2336                                         else
2337                                                 DOM.content(document.querySelector('#maincontent'),
2338                                                         E('pre', { 'class': 'alert-message error' }, e.message));
2339
2340                                         e.reported = true;
2341                                 }
2342
2343                                 throw e;
2344                         }
2345                 },
2346
2347                 /**
2348                  * Return a bound function using the given `self` as `this` context
2349                  * and any further arguments as parameters to the bound function.
2350                  *
2351                  * @instance
2352                  * @memberof LuCI
2353                  *
2354                  * @param {function} fn
2355                  * The function to bind.
2356                  *
2357                  * @param {*} self
2358                  * The value to bind as `this` context to the specified function.
2359                  *
2360                  * @param {...*} [args]
2361                  * Zero or more variable arguments which are bound to the function
2362                  * as parameters.
2363                  *
2364                  * @returns {function}
2365                  * Returns the bound function.
2366                  */
2367                 bind: function(fn, self /*, ... */) {
2368                         return Function.prototype.bind.apply(fn, this.varargs(arguments, 2, self));
2369                 },
2370
2371                 /**
2372                  * Load an additional LuCI JavaScript class and its dependencies,
2373                  * instantiate it and return the resulting class instance. Each
2374                  * class is only loaded once. Subsequent attempts to load the same
2375                  * class will return the already instantiated class.
2376                  *
2377                  * @instance
2378                  * @memberof LuCI
2379                  *
2380                  * @param {string} name
2381                  * The name of the class to load in dotted notation. Dots will
2382                  * be replaced by spaces and joined with the runtime-determined
2383                  * base URL of LuCI.js to form an absolute URL to load the class
2384                  * file from.
2385                  *
2386                  * @throws {DependencyError}
2387                  * Throws a `DependencyError` when the class to load includes
2388                  * circular dependencies.
2389                  *
2390                  * @throws {NetworkError}
2391                  * Throws `NetworkError` when the underlying {@link LuCI.request}
2392                  * call failed.
2393                  *
2394                  * @throws {SyntaxError}
2395                  * Throws `SyntaxError` when the loaded class file code cannot
2396                  * be interpreted by `eval`.
2397                  *
2398                  * @throws {TypeError}
2399                  * Throws `TypeError` when the class file could be loaded and
2400                  * interpreted, but when invoking its code did not yield a valid
2401                  * class instance.
2402                  *
2403                  * @returns {Promise<LuCI.baseclass>}
2404                  * Returns the instantiated class.
2405                  */
2406                 require: function(name, from) {
2407                         var L = this, url = null, from = from || [];
2408
2409                         /* Class already loaded */
2410                         if (classes[name] != null) {
2411                                 /* Circular dependency */
2412                                 if (from.indexOf(name) != -1)
2413                                         L.raise('DependencyError',
2414                                                 'Circular dependency: class "%s" depends on "%s"',
2415                                                 name, from.join('" which depends on "'));
2416
2417                                 return Promise.resolve(classes[name]);
2418                         }
2419
2420                         url = '%s/%s.js%s'.format(env.base_url, name.replace(/\./g, '/'), (env.resource_version ? '?v=' + env.resource_version : ''));
2421                         from = [ name ].concat(from);
2422
2423                         var compileClass = function(res) {
2424                                 if (!res.ok)
2425                                         L.raise('NetworkError',
2426                                                 'HTTP error %d while loading class file "%s"', res.status, url);
2427
2428                                 var source = res.text(),
2429                                     requirematch = /^require[ \t]+(\S+)(?:[ \t]+as[ \t]+([a-zA-Z_]\S*))?$/,
2430                                     strictmatch = /^use[ \t]+strict$/,
2431                                     depends = [],
2432                                     args = '';
2433
2434                                 /* find require statements in source */
2435                                 for (var i = 0, off = -1, quote = -1, esc = false; i < source.length; i++) {
2436                                         var chr = source.charCodeAt(i);
2437
2438                                         if (esc) {
2439                                                 esc = false;
2440                                         }
2441                                         else if (chr == 92) {
2442                                                 esc = true;
2443                                         }
2444                                         else if (chr == quote) {
2445                                                 var s = source.substring(off, i),
2446                                                     m = requirematch.exec(s);
2447
2448                                                 if (m) {
2449                                                         var dep = m[1], as = m[2] || dep.replace(/[^a-zA-Z0-9_]/g, '_');
2450                                                         depends.push(L.require(dep, from));
2451                                                         args += ', ' + as;
2452                                                 }
2453                                                 else if (!strictmatch.exec(s)) {
2454                                                         break;
2455                                                 }
2456
2457                                                 off = -1;
2458                                                 quote = -1;
2459                                         }
2460                                         else if (quote == -1 && (chr == 34 || chr == 39)) {
2461                                                 off = i + 1;
2462                                                 quote = chr;
2463                                         }
2464                                 }
2465
2466                                 /* load dependencies and instantiate class */
2467                                 return Promise.all(depends).then(function(instances) {
2468                                         var _factory, _class;
2469
2470                                         try {
2471                                                 _factory = eval(
2472                                                         '(function(window, document, L%s) { %s })\n\n//# sourceURL=%s\n'
2473                                                                 .format(args, source, res.url));
2474                                         }
2475                                         catch (error) {
2476                                                 L.raise('SyntaxError', '%s\n  in %s:%s',
2477                                                         error.message, res.url, error.lineNumber || '?');
2478                                         }
2479
2480                                         _factory.displayName = toCamelCase(name + 'ClassFactory');
2481                                         _class = _factory.apply(_factory, [window, document, L].concat(instances));
2482
2483                                         if (!Class.isSubclass(_class))
2484                                             L.error('TypeError', '"%s" factory yields invalid constructor', name);
2485
2486                                         if (_class.displayName == 'AnonymousClass')
2487                                                 _class.displayName = toCamelCase(name + 'Class');
2488
2489                                         var ptr = Object.getPrototypeOf(L),
2490                                             parts = name.split(/\./),
2491                                             instance = new _class();
2492
2493                                         for (var i = 0; ptr && i < parts.length - 1; i++)
2494                                                 ptr = ptr[parts[i]];
2495
2496                                         if (ptr)
2497                                                 ptr[parts[i]] = instance;
2498
2499                                         classes[name] = instance;
2500
2501                                         return instance;
2502                                 });
2503                         };
2504
2505                         /* Request class file */
2506                         classes[name] = Request.get(url, { cache: true }).then(compileClass);
2507
2508                         return classes[name];
2509                 },
2510
2511                 /* DOM setup */
2512                 probeRPCBaseURL: function() {
2513                         if (rpcBaseURL == null)
2514                                 rpcBaseURL = Session.getLocalData('rpcBaseURL');
2515
2516                         if (rpcBaseURL == null) {
2517                                 var rpcFallbackURL = this.url('admin/ubus');
2518
2519                                 rpcBaseURL = Request.get(env.ubuspath).then(function(res) {
2520                                         return (rpcBaseURL = (res.status == 400) ? env.ubuspath : rpcFallbackURL);
2521                                 }, function() {
2522                                         return (rpcBaseURL = rpcFallbackURL);
2523                                 }).then(function(url) {
2524                                         Session.setLocalData('rpcBaseURL', url);
2525                                         return url;
2526                                 });
2527                         }
2528
2529                         return Promise.resolve(rpcBaseURL);
2530                 },
2531
2532                 probeSystemFeatures: function() {
2533                         if (sysFeatures == null)
2534                                 sysFeatures = Session.getLocalData('features');
2535
2536                         if (!this.isObject(sysFeatures)) {
2537                                 sysFeatures = classes.rpc.declare({
2538                                         object: 'luci',
2539                                         method: 'getFeatures',
2540                                         expect: { '': {} }
2541                                 })().then(function(features) {
2542                                         Session.setLocalData('features', features);
2543                                         sysFeatures = features;
2544
2545                                         return features;
2546                                 });
2547                         }
2548
2549                         return Promise.resolve(sysFeatures);
2550                 },
2551
2552                 probePreloadClasses: function() {
2553                         if (preloadClasses == null)
2554                                 preloadClasses = Session.getLocalData('preload');
2555
2556                         if (!Array.isArray(preloadClasses)) {
2557                                 preloadClasses = this.resolveDefault(classes.rpc.declare({
2558                                         object: 'file',
2559                                         method: 'list',
2560                                         params: [ 'path' ],
2561                                         expect: { 'entries': [] }
2562                                 })(this.fspath(this.resource('preload'))), []).then(function(entries) {
2563                                         var classes = [];
2564
2565                                         for (var i = 0; i < entries.length; i++) {
2566                                                 if (entries[i].type != 'file')
2567                                                         continue;
2568
2569                                                 var m = entries[i].name.match(/(.+)\.js$/);
2570
2571                                                 if (m)
2572                                                         classes.push('preload.%s'.format(m[1]));
2573                                         }
2574
2575                                         Session.setLocalData('preload', classes);
2576                                         preloadClasses = classes;
2577
2578                                         return classes;
2579                                 });
2580                         }
2581
2582                         return Promise.resolve(preloadClasses);
2583                 },
2584
2585                 /**
2586                  * Test whether a particular system feature is available, such as
2587                  * hostapd SAE support or an installed firewall. The features are
2588                  * queried once at the beginning of the LuCI session and cached in
2589                  * `SessionStorage` throughout the lifetime of the associated tab or
2590                  * browser window.
2591                  *
2592                  * @instance
2593                  * @memberof LuCI
2594                  *
2595                  * @param {string} feature
2596                  * The feature to test. For detailed list of known feature flags,
2597                  * see `/modules/luci-base/root/usr/libexec/rpcd/luci`.
2598                  *
2599                  * @param {string} [subfeature]
2600                  * Some feature classes like `hostapd` provide sub-feature flags,
2601                  * such as `sae` or `11w` support. The `subfeature` argument can
2602                  * be used to query these.
2603                  *
2604                  * @return {boolean|null}
2605                  * Return `true` if the queried feature (and sub-feature) is available
2606                  * or `false` if the requested feature isn't present or known.
2607                  * Return `null` when a sub-feature was queried for a feature which
2608                  * has no sub-features.
2609                  */
2610                 hasSystemFeature: function() {
2611                         var ft = sysFeatures[arguments[0]];
2612
2613                         if (arguments.length == 2)
2614                                 return this.isObject(ft) ? ft[arguments[1]] : null;
2615
2616                         return (ft != null && ft != false);
2617                 },
2618
2619                 /* private */
2620                 notifySessionExpiry: function() {
2621                         Poll.stop();
2622
2623                         L.ui.showModal(_('Session expired'), [
2624                                 E('div', { class: 'alert-message warning' },
2625                                         _('A new login is required since the authentication session expired.')),
2626                                 E('div', { class: 'right' },
2627                                         E('div', {
2628                                                 class: 'btn primary',
2629                                                 click: function() {
2630                                                         var loc = window.location;
2631                                                         window.location = loc.protocol + '//' + loc.host + loc.pathname + loc.search;
2632                                                 }
2633                                         }, _('To login…')))
2634                         ]);
2635
2636                         L.raise('SessionError', 'Login session is expired');
2637                 },
2638
2639                 /* private */
2640                 setupDOM: function(res) {
2641                         var domEv = res[0],
2642                             uiClass = res[1],
2643                             rpcClass = res[2],
2644                             formClass = res[3],
2645                             rpcBaseURL = res[4];
2646
2647                         rpcClass.setBaseURL(rpcBaseURL);
2648
2649                         rpcClass.addInterceptor(function(msg, req) {
2650                                 if (!L.isObject(msg) || !L.isObject(msg.error) || msg.error.code != -32002)
2651                                         return;
2652
2653                                 if (!L.isObject(req) || (req.object == 'session' && req.method == 'access'))
2654                                         return;
2655
2656                                 return rpcClass.declare({
2657                                         'object': 'session',
2658                                         'method': 'access',
2659                                         'params': [ 'scope', 'object', 'function' ],
2660                                         'expect': { access: true }
2661                                 })('uci', 'luci', 'read').catch(L.notifySessionExpiry);
2662                         });
2663
2664                         Request.addInterceptor(function(res) {
2665                                 var isDenied = false;
2666
2667                                 if (res.status == 403 && res.headers.get('X-LuCI-Login-Required') == 'yes')
2668                                         isDenied = true;
2669
2670                                 if (!isDenied)
2671                                         return;
2672
2673                                 L.notifySessionExpiry();
2674                         });
2675
2676                         document.addEventListener('poll-start', function(ev) {
2677                                 uiClass.showIndicator('poll-status', _('Refreshing'), function(ev) {
2678                                         Request.poll.active() ? Request.poll.stop() : Request.poll.start();
2679                                 });
2680                         });
2681
2682                         document.addEventListener('poll-stop', function(ev) {
2683                                 uiClass.showIndicator('poll-status', _('Paused'), null, 'inactive');
2684                         });
2685
2686                         return Promise.all([
2687                                 this.probeSystemFeatures(),
2688                                 this.probePreloadClasses()
2689                         ]).finally(L.bind(function() {
2690                                 var tasks = [];
2691
2692                                 if (Array.isArray(preloadClasses))
2693                                         for (var i = 0; i < preloadClasses.length; i++)
2694                                                 tasks.push(this.require(preloadClasses[i]));
2695
2696                                 return Promise.all(tasks);
2697                         }, this)).finally(this.initDOM);
2698                 },
2699
2700                 /* private */
2701                 initDOM: function() {
2702                         originalCBIInit();
2703                         Poll.start();
2704                         document.dispatchEvent(new CustomEvent('luci-loaded'));
2705                 },
2706
2707                 /**
2708                  * The `env` object holds environment settings used by LuCI, such
2709                  * as request timeouts, base URLs etc.
2710                  *
2711                  * @instance
2712                  * @memberof LuCI
2713                  */
2714                 env: env,
2715
2716                 /**
2717                  * Construct an absolute filesystem path relative to the server
2718                  * document root.
2719                  *
2720                  * @instance
2721                  * @memberof LuCI
2722                  *
2723                  * @param {...string} [parts]
2724                  * An array of parts to join into a path.
2725                  *
2726                  * @return {string}
2727                  * Return the joined path.
2728                  */
2729                 fspath: function(/* ... */) {
2730                         var path = env.documentroot;
2731
2732                         for (var i = 0; i < arguments.length; i++)
2733                                 path += '/' + arguments[i];
2734
2735                         var p = path.replace(/\/+$/, '').replace(/\/+/g, '/').split(/\//),
2736                             res = [];
2737
2738                         for (var i = 0; i < p.length; i++)
2739                                 if (p[i] == '..')
2740                                         res.pop();
2741                                 else if (p[i] != '.')
2742                                         res.push(p[i]);
2743
2744                         return res.join('/');
2745                 },
2746
2747                 /**
2748                  * Construct a relative URL path from the given prefix and parts.
2749                  * The resulting URL is guaranteed to only contain the characters
2750                  * `a-z`, `A-Z`, `0-9`, `_`, `.`, `%`, `,`, `;`, and `-` as well
2751                  * as `/` for the path separator.
2752                  *
2753                  * @instance
2754                  * @memberof LuCI
2755                  *
2756                  * @param {string} [prefix]
2757                  * The prefix to join the given parts with. If the `prefix` is
2758                  * omitted, it defaults to an empty string.
2759                  *
2760                  * @param {string[]} [parts]
2761                  * An array of parts to join into an URL path. Parts may contain
2762                  * slashes and any of the other characters mentioned above.
2763                  *
2764                  * @return {string}
2765                  * Return the joined URL path.
2766                  */
2767                 path: function(prefix, parts) {
2768                         var url = [ prefix || '' ];
2769
2770                         for (var i = 0; i < parts.length; i++)
2771                                 if (/^(?:[a-zA-Z0-9_.%,;-]+\/)*[a-zA-Z0-9_.%,;-]+$/.test(parts[i]))
2772                                         url.push('/', parts[i]);
2773
2774                         if (url.length === 1)
2775                                 url.push('/');
2776
2777                         return url.join('');
2778                 },
2779
2780                 /**
2781                  * Construct an URL  pathrelative to the script path of the server
2782                  * side LuCI application (usually `/cgi-bin/luci`).
2783                  *
2784                  * The resulting URL is guaranteed to only contain the characters
2785                  * `a-z`, `A-Z`, `0-9`, `_`, `.`, `%`, `,`, `;`, and `-` as well
2786                  * as `/` for the path separator.
2787                  *
2788                  * @instance
2789                  * @memberof LuCI
2790                  *
2791                  * @param {string[]} [parts]
2792                  * An array of parts to join into an URL path. Parts may contain
2793                  * slashes and any of the other characters mentioned above.
2794                  *
2795                  * @return {string}
2796                  * Returns the resulting URL path.
2797                  */
2798                 url: function() {
2799                         return this.path(env.scriptname, arguments);
2800                 },
2801
2802                 /**
2803                  * Construct an URL path relative to the global static resource path
2804                  * of the LuCI ui (usually `/luci-static/resources`).
2805                  *
2806                  * The resulting URL is guaranteed to only contain the characters
2807                  * `a-z`, `A-Z`, `0-9`, `_`, `.`, `%`, `,`, `;`, and `-` as well
2808                  * as `/` for the path separator.
2809                  *
2810                  * @instance
2811                  * @memberof LuCI
2812                  *
2813                  * @param {string[]} [parts]
2814                  * An array of parts to join into an URL path. Parts may contain
2815                  * slashes and any of the other characters mentioned above.
2816                  *
2817                  * @return {string}
2818                  * Returns the resulting URL path.
2819                  */
2820                 resource: function() {
2821                         return this.path(env.resource, arguments);
2822                 },
2823
2824                 /**
2825                  * Construct an URL path relative to the media resource path of the
2826                  * LuCI ui (usually `/luci-static/$theme_name`).
2827                  *
2828                  * The resulting URL is guaranteed to only contain the characters
2829                  * `a-z`, `A-Z`, `0-9`, `_`, `.`, `%`, `,`, `;`, and `-` as well
2830                  * as `/` for the path separator.
2831                  *
2832                  * @instance
2833                  * @memberof LuCI
2834                  *
2835                  * @param {string[]} [parts]
2836                  * An array of parts to join into an URL path. Parts may contain
2837                  * slashes and any of the other characters mentioned above.
2838                  *
2839                  * @return {string}
2840                  * Returns the resulting URL path.
2841                  */
2842                 media: function() {
2843                         return this.path(env.media, arguments);
2844                 },
2845
2846                 /**
2847                  * Return the complete URL path to the current view.
2848                  *
2849                  * @instance
2850                  * @memberof LuCI
2851                  *
2852                  * @return {string}
2853                  * Returns the URL path to the current view.
2854                  */
2855                 location: function() {
2856                         return this.path(env.scriptname, env.requestpath);
2857                 },
2858
2859
2860                 /**
2861                  * Tests whether the passed argument is a JavaScript object.
2862                  * This function is meant to be an object counterpart to the
2863                  * standard `Array.isArray()` function.
2864                  *
2865                  * @instance
2866                  * @memberof LuCI
2867                  *
2868                  * @param {*} [val]
2869                  * The value to test
2870                  *
2871                  * @return {boolean}
2872                  * Returns `true` if the given value is of type object and
2873                  * not `null`, else returns `false`.
2874                  */
2875                 isObject: function(val) {
2876                         return (val != null && typeof(val) == 'object');
2877                 },
2878
2879                 /**
2880                  * Return an array of sorted object keys, optionally sorted by
2881                  * a different key or a different sorting mode.
2882                  *
2883                  * @instance
2884                  * @memberof LuCI
2885                  *
2886                  * @param {object} obj
2887                  * The object to extract the keys from. If the given value is
2888                  * not an object, the function will return an empty array.
2889                  *
2890                  * @param {string} [key]
2891                  * Specifies the key to order by. This is mainly useful for
2892                  * nested objects of objects or objects of arrays when sorting
2893                  * shall not be performed by the primary object keys but by
2894                  * some other key pointing to a value within the nested values.
2895                  *
2896                  * @param {string} [sortmode]
2897                  * May be either `addr` or `num` to override the natural
2898                  * lexicographic sorting with a sorting suitable for IP/MAC style
2899                  * addresses or numeric values respectively.
2900                  *
2901                  * @return {string[]}
2902                  * Returns an array containing the sorted keys of the given object.
2903                  */
2904                 sortedKeys: function(obj, key, sortmode) {
2905                         if (obj == null || typeof(obj) != 'object')
2906                                 return [];
2907
2908                         return Object.keys(obj).map(function(e) {
2909                                 var v = (key != null) ? obj[e][key] : e;
2910
2911                                 switch (sortmode) {
2912                                 case 'addr':
2913                                         v = (v != null) ? v.replace(/(?:^|[.:])([0-9a-fA-F]{1,4})/g,
2914                                                 function(m0, m1) { return ('000' + m1.toLowerCase()).substr(-4) }) : null;
2915                                         break;
2916
2917                                 case 'num':
2918                                         v = (v != null) ? +v : null;
2919                                         break;
2920                                 }
2921
2922                                 return [ e, v ];
2923                         }).filter(function(e) {
2924                                 return (e[1] != null);
2925                         }).sort(function(a, b) {
2926                                 return (a[1] > b[1]);
2927                         }).map(function(e) {
2928                                 return e[0];
2929                         });
2930                 },
2931
2932                 /**
2933                  * Converts the given value to an array. If the given value is of
2934                  * type array, it is returned as-is, values of type object are
2935                  * returned as one-element array containing the object, empty
2936                  * strings and `null` values are returned as empty array, all other
2937                  * values are converted using `String()`, trimmed, split on white
2938                  * space and returned as array.
2939                  *
2940                  * @instance
2941                  * @memberof LuCI
2942                  *
2943                  * @param {*} val
2944                  * The value to convert into an array.
2945                  *
2946                  * @return {Array<*>}
2947                  * Returns the resulting array.
2948                  */
2949                 toArray: function(val) {
2950                         if (val == null)
2951                                 return [];
2952                         else if (Array.isArray(val))
2953                                 return val;
2954                         else if (typeof(val) == 'object')
2955                                 return [ val ];
2956
2957                         var s = String(val).trim();
2958
2959                         if (s == '')
2960                                 return [];
2961
2962                         return s.split(/\s+/);
2963                 },
2964
2965                 /**
2966                  * Returns a promise resolving with either the given value or or with
2967                  * the given default in case the input value is a rejecting promise.
2968                  *
2969                  * @instance
2970                  * @memberof LuCI
2971                  *
2972                  * @param {*} value
2973                  * The value to resolve the promise with.
2974                  *
2975                  * @param {*} defvalue
2976                  * The default value to resolve the promise with in case the given
2977                  * input value is a rejecting promise.
2978                  *
2979                  * @returns {Promise<*>}
2980                  * Returns a new promise resolving either to the given input value or
2981                  * to the given default value on error.
2982                  */
2983                 resolveDefault: function(value, defvalue) {
2984                         return Promise.resolve(value).catch(function() { return defvalue });
2985                 },
2986
2987                 /**
2988                  * The request callback function is invoked whenever an HTTP
2989                  * reply to a request made using the `L.get()`, `L.post()` or
2990                  * `L.poll()` function is timed out or received successfully.
2991                  *
2992                  * @instance
2993                  * @memberof LuCI
2994                  *
2995                  * @callback LuCI.requestCallbackFn
2996                  * @param {XMLHTTPRequest} xhr
2997                  * The XMLHTTPRequest instance used to make the request.
2998                  *
2999                  * @param {*} data
3000                  * The response JSON if the response could be parsed as such,
3001                  * else `null`.
3002                  *
3003                  * @param {number} duration
3004                  * The total duration of the request in milliseconds.
3005                  */
3006
3007                 /**
3008                  * Issues a GET request to the given url and invokes the specified
3009                  * callback function. The function is a wrapper around
3010                  * {@link LuCI.request#request Request.request()}.
3011                  *
3012                  * @deprecated
3013                  * @instance
3014                  * @memberof LuCI
3015                  *
3016                  * @param {string} url
3017                  * The URL to request.
3018                  *
3019                  * @param {Object<string, string>} [args]
3020                  * Additional query string arguments to append to the URL.
3021                  *
3022                  * @param {LuCI.requestCallbackFn} cb
3023                  * The callback function to invoke when the request finishes.
3024                  *
3025                  * @return {Promise<null>}
3026                  * Returns a promise resolving to `null` when concluded.
3027                  */
3028                 get: function(url, args, cb) {
3029                         return this.poll(null, url, args, cb, false);
3030                 },
3031
3032                 /**
3033                  * Issues a POST request to the given url and invokes the specified
3034                  * callback function. The function is a wrapper around
3035                  * {@link LuCI.request#request Request.request()}. The request is
3036                  * sent using `application/x-www-form-urlencoded` encoding and will
3037                  * contain a field `token` with the current value of `LuCI.env.token`
3038                  * by default.
3039                  *
3040                  * @deprecated
3041                  * @instance
3042                  * @memberof LuCI
3043                  *
3044                  * @param {string} url
3045                  * The URL to request.
3046                  *
3047                  * @param {Object<string, string>} [args]
3048                  * Additional post arguments to append to the request body.
3049                  *
3050                  * @param {LuCI.requestCallbackFn} cb
3051                  * The callback function to invoke when the request finishes.
3052                  *
3053                  * @return {Promise<null>}
3054                  * Returns a promise resolving to `null` when concluded.
3055                  */
3056                 post: function(url, args, cb) {
3057                         return this.poll(null, url, args, cb, true);
3058                 },
3059
3060                 /**
3061                  * Register a polling HTTP request that invokes the specified
3062                  * callback function. The function is a wrapper around
3063                  * {@link LuCI.request.poll#add Request.poll.add()}.
3064                  *
3065                  * @deprecated
3066                  * @instance
3067                  * @memberof LuCI
3068                  *
3069                  * @param {number} interval
3070                  * The poll interval to use. If set to a value less than or equal
3071                  * to `0`, it will default to the global poll interval configured
3072                  * in `LuCI.env.pollinterval`.
3073                  *
3074                  * @param {string} url
3075                  * The URL to request.
3076                  *
3077                  * @param {Object<string, string>} [args]
3078                  * Specifies additional arguments for the request. For GET requests,
3079                  * the arguments are appended to the URL as query string, for POST
3080                  * requests, they'll be added to the request body.
3081                  *
3082                  * @param {LuCI.requestCallbackFn} cb
3083                  * The callback function to invoke whenever a request finishes.
3084                  *
3085                  * @param {boolean} [post=false]
3086                  * When set to `false` or not specified, poll requests will be made
3087                  * using the GET method. When set to `true`, POST requests will be
3088                  * issued. In case of POST requests, the request body will contain
3089                  * an argument `token` with the current value of `LuCI.env.token` by
3090                  * default, regardless of the parameters specified with `args`.
3091                  *
3092                  * @return {function}
3093                  * Returns the internally created function that has been passed to
3094                  * {@link LuCI.request.poll#add Request.poll.add()}. This value can
3095                  * be passed to {@link LuCI.poll.remove Poll.remove()} to remove the
3096                  * polling request.
3097                  */
3098                 poll: function(interval, url, args, cb, post) {
3099                         if (interval !== null && interval <= 0)
3100                                 interval = env.pollinterval;
3101
3102                         var data = post ? { token: env.token } : null,
3103                             method = post ? 'POST' : 'GET';
3104
3105                         if (!/^(?:\/|\S+:\/\/)/.test(url))
3106                                 url = this.url(url);
3107
3108                         if (args != null)
3109                                 data = Object.assign(data || {}, args);
3110
3111                         if (interval !== null)
3112                                 return Request.poll.add(interval, url, { method: method, query: data }, cb);
3113                         else
3114                                 return Request.request(url, { method: method, query: data })
3115                                         .then(function(res) {
3116                                                 var json = null;
3117                                                 if (/^application\/json\b/.test(res.headers.get('Content-Type')))
3118                                                         try { json = res.json() } catch(e) {}
3119                                                 cb(res.xhr, json, res.duration);
3120                                         });
3121                 },
3122
3123                 /**
3124                  * Check whether a view has sufficient permissions.
3125                  *
3126                  * @return {boolean|null}
3127                  * Returns `null` if the current session has no permission at all to
3128                  * load resources required by the view. Returns `false` if readonly
3129                  * permissions are granted or `true` if at least one required ACL
3130                  * group is granted with write permissions.
3131                  */
3132                 hasViewPermission: function() {
3133                         if (!this.isObject(env.nodespec) || !env.nodespec.satisfied)
3134                             return null;
3135
3136                         return !env.nodespec.readonly;
3137                 },
3138
3139                 /**
3140                  * Deprecated wrapper around {@link LuCI.poll.remove Poll.remove()}.
3141                  *
3142                  * @deprecated
3143                  * @instance
3144                  * @memberof LuCI
3145                  *
3146                  * @param {function} entry
3147                  * The polling function to remove.
3148                  *
3149                  * @return {boolean}
3150                  * Returns `true` when the function has been removed or `false` if
3151                  * it could not be found.
3152                  */
3153                 stop: function(entry) { return Poll.remove(entry) },
3154
3155                 /**
3156                  * Deprecated wrapper around {@link LuCI.poll.stop Poll.stop()}.
3157                  *
3158                  * @deprecated
3159                  * @instance
3160                  * @memberof LuCI
3161                  *
3162                  * @return {boolean}
3163                  * Returns `true` when the polling loop has been stopped or `false`
3164                  * when it didn't run to begin with.
3165                  */
3166                 halt: function() { return Poll.stop() },
3167
3168                 /**
3169                  * Deprecated wrapper around {@link LuCI.poll.start Poll.start()}.
3170                  *
3171                  * @deprecated
3172                  * @instance
3173                  * @memberof LuCI
3174                  *
3175                  * @return {boolean}
3176                  * Returns `true` when the polling loop has been started or `false`
3177                  * when it was already running.
3178                  */
3179                 run: function() { return Poll.start() },
3180
3181                 /**
3182                  * Legacy `L.dom` class alias. New view code should use `'require dom';`
3183                  * to request the `LuCI.dom` class.
3184                  *
3185                  * @instance
3186                  * @memberof LuCI
3187                  * @deprecated
3188                  */
3189                 dom: DOM,
3190
3191                 /**
3192                  * Legacy `L.view` class alias. New view code should use `'require view';`
3193                  * to request the `LuCI.view` class.
3194                  *
3195                  * @instance
3196                  * @memberof LuCI
3197                  * @deprecated
3198                  */
3199                 view: View,
3200
3201                 /**
3202                  * Legacy `L.Poll` class alias. New view code should use `'require poll';`
3203                  * to request the `LuCI.poll` class.
3204                  *
3205                  * @instance
3206                  * @memberof LuCI
3207                  * @deprecated
3208                  */
3209                 Poll: Poll,
3210
3211                 /**
3212                  * Legacy `L.Request` class alias. New view code should use `'require request';`
3213                  * to request the `LuCI.request` class.
3214                  *
3215                  * @instance
3216                  * @memberof LuCI
3217                  * @deprecated
3218                  */
3219                 Request: Request,
3220
3221                 /**
3222                  * Legacy `L.Class` class alias. New view code should use `'require baseclass';`
3223                  * to request the `LuCI.baseclass` class.
3224                  *
3225                  * @instance
3226                  * @memberof LuCI
3227                  * @deprecated
3228                  */
3229                 Class: Class
3230         });
3231
3232         /**
3233          * @class xhr
3234          * @memberof LuCI
3235          * @deprecated
3236          * @classdesc
3237          *
3238          * The `LuCI.xhr` class is a legacy compatibility shim for the
3239          * functionality formerly provided by `xhr.js`. It is registered as global
3240          * `window.XHR` symbol for compatibility with legacy code.
3241          *
3242          * New code should use {@link LuCI.request} instead to implement HTTP
3243          * request handling.
3244          */
3245         var XHR = Class.extend(/** @lends LuCI.xhr.prototype */ {
3246                 __name__: 'LuCI.xhr',
3247                 __init__: function() {
3248                         if (window.console && console.debug)
3249                                 console.debug('Direct use XHR() is deprecated, please use L.Request instead');
3250                 },
3251
3252                 _response: function(cb, res, json, duration) {
3253                         if (this.active)
3254                                 cb(res, json, duration);
3255                         delete this.active;
3256                 },
3257
3258                 /**
3259                  * This function is a legacy wrapper around
3260                  * {@link LuCI#get LuCI.get()}.
3261                  *
3262                  * @instance
3263                  * @deprecated
3264                  * @memberof LuCI.xhr
3265                  *
3266                  * @param {string} url
3267                  * The URL to request
3268                  *
3269                  * @param {Object} [data]
3270                  * Additional query string data
3271                  *
3272                  * @param {LuCI.requestCallbackFn} [callback]
3273                  * Callback function to invoke on completion
3274                  *
3275                  * @param {number} [timeout]
3276                  * Request timeout to use
3277                  *
3278                  * @return {Promise<null>}
3279                  */
3280                 get: function(url, data, callback, timeout) {
3281                         this.active = true;
3282                         L.get(url, data, this._response.bind(this, callback), timeout);
3283                 },
3284
3285                 /**
3286                  * This function is a legacy wrapper around
3287                  * {@link LuCI#post LuCI.post()}.
3288                  *
3289                  * @instance
3290                  * @deprecated
3291                  * @memberof LuCI.xhr
3292                  *
3293                  * @param {string} url
3294                  * The URL to request
3295                  *
3296                  * @param {Object} [data]
3297                  * Additional data to append to the request body.
3298                  *
3299                  * @param {LuCI.requestCallbackFn} [callback]
3300                  * Callback function to invoke on completion
3301                  *
3302                  * @param {number} [timeout]
3303                  * Request timeout to use
3304                  *
3305                  * @return {Promise<null>}
3306                  */
3307                 post: function(url, data, callback, timeout) {
3308                         this.active = true;
3309                         L.post(url, data, this._response.bind(this, callback), timeout);
3310                 },
3311
3312                 /**
3313                  * Cancels a running request.
3314                  *
3315                  * This function does not actually cancel the underlying
3316                  * `XMLHTTPRequest` request but it sets a flag which prevents the
3317                  * invocation of the callback function when the request eventually
3318                  * finishes or timed out.
3319                  *
3320                  * @instance
3321                  * @deprecated
3322                  * @memberof LuCI.xhr
3323                  */
3324                 cancel: function() { delete this.active },
3325
3326                 /**
3327                  * Checks the running state of the request.
3328                  *
3329                  * @instance
3330                  * @deprecated
3331                  * @memberof LuCI.xhr
3332                  *
3333                  * @returns {boolean}
3334                  * Returns `true` if the request is still running or `false` if it
3335                  * already completed.
3336                  */
3337                 busy: function() { return (this.active === true) },
3338
3339                 /**
3340                  * Ignored for backwards compatibility.
3341                  *
3342                  * This function does nothing.
3343                  *
3344                  * @instance
3345                  * @deprecated
3346                  * @memberof LuCI.xhr
3347                  */
3348                 abort: function() {},
3349
3350                 /**
3351                  * Existing for backwards compatibility.
3352                  *
3353                  * This function simply throws an `InternalError` when invoked.
3354                  *
3355                  * @instance
3356                  * @deprecated
3357                  * @memberof LuCI.xhr
3358                  *
3359                  * @throws {InternalError}
3360                  * Throws an `InternalError` with the message `Not implemented`
3361                  * when invoked.
3362                  */
3363                 send_form: function() { L.error('InternalError', 'Not implemented') },
3364         });
3365
3366         XHR.get = function() { return window.L.get.apply(window.L, arguments) };
3367         XHR.post = function() { return window.L.post.apply(window.L, arguments) };
3368         XHR.poll = function() { return window.L.poll.apply(window.L, arguments) };
3369         XHR.stop = Request.poll.remove.bind(Request.poll);
3370         XHR.halt = Request.poll.stop.bind(Request.poll);
3371         XHR.run = Request.poll.start.bind(Request.poll);
3372         XHR.running = Request.poll.active.bind(Request.poll);
3373
3374         window.XHR = XHR;
3375         window.LuCI = LuCI;
3376 })(window, document);