(function(window, document, undefined) {
'use strict';
+ var env = {};
+
/* Object.assign polyfill for IE */
if (typeof Object.assign !== 'function') {
Object.defineProperty(Object, 'assign', {
};
/**
- * @class Class
+ * @class baseclass
* @hideconstructor
* @memberof LuCI
* @classdesc
*
- * `LuCI.Class` is the abstract base class all LuCI classes inherit from.
+ * `LuCI.baseclass` is the abstract base class all LuCI classes inherit from.
*
* It provides simple means to create subclasses of given classes and
* implements prototypal inheritance.
* Extends this base class with the properties described in
* `properties` and returns a new subclassed Class instance
*
- * @memberof LuCI.Class
+ * @memberof LuCI.baseclass
*
* @param {Object<string, *>} properties
* An object describing the properties to add to the new
* subclass.
*
- * @returns {LuCI.Class}
- * Returns a new LuCI.Class sublassed from this class, extended
+ * @returns {LuCI.baseclass}
+ * Returns a new LuCI.baseclass sublassed from this class, extended
* by the given properties and with its prototype set to this base
* class to enable inheritance. The resulting value represents a
* class constructor and can be instantiated with `new`.
* and returns the resulting subclassed Class instance.
*
* This function serves as a convenience shortcut for
- * {@link LuCI.Class.extend Class.extend()} and subsequent
+ * {@link LuCI.baseclass.extend Class.extend()} and subsequent
* `new`.
*
- * @memberof LuCI.Class
+ * @memberof LuCI.baseclass
*
* @param {Object<string, *>} properties
* An object describing the properties to add to the new
* Specifies arguments to be passed to the subclass constructor
* as-is in order to instantiate the new subclass.
*
- * @returns {LuCI.Class}
- * Returns a new LuCI.Class instance extended by the given
+ * @returns {LuCI.baseclass}
+ * Returns a new LuCI.baseclass instance extended by the given
* properties with its prototype set to this base class to
* enable inheritance.
*/
* Calls the class constructor using `new` with the given argument
* array being passed as variadic parameters to the constructor.
*
- * @memberof LuCI.Class
+ * @memberof LuCI.baseclass
*
* @param {Array<*>} params
* An array of arbitrary values which will be passed as arguments
* Specifies arguments to be passed to the subclass constructor
* as-is in order to instantiate the new subclass.
*
- * @returns {LuCI.Class}
- * Returns a new LuCI.Class instance extended by the given
+ * @returns {LuCI.baseclass}
+ * Returns a new LuCI.baseclass instance extended by the given
* properties with its prototype set to this base class to
* enable inheritance.
*/
/**
* Checks whether the given class value is a subclass of this class.
*
- * @memberof LuCI.Class
+ * @memberof LuCI.baseclass
*
- * @param {LuCI.Class} classValue
+ * @param {LuCI.baseclass} classValue
* The class object to test.
*
* @returns {boolean}
* `offset` and prepend any further given optional parameters to
* the beginning of the resulting array copy.
*
- * @memberof LuCI.Class
+ * @memberof LuCI.baseclass
* @instance
*
* @param {Array<*>} args
* Calls the `key()` method with parameters `arg1` and `arg2`
* when found within one of the parent classes.
*
- * @memberof LuCI.Class
+ * @memberof LuCI.baseclass
* @instance
*
* @param {string} key
/**
- * @class
+ * @class headers
* @memberof LuCI
* @hideconstructor
* @classdesc
* The `Headers` class is an internal utility class exposed in HTTP
* response objects using the `response.headers` property.
*/
- var Headers = Class.extend(/** @lends LuCI.Headers.prototype */ {
- __name__: 'LuCI.XHR.Headers',
+ var Headers = Class.extend(/** @lends LuCI.headers.prototype */ {
+ __name__: 'LuCI.headers',
__init__: function(xhr) {
var hdrs = this.headers = {};
xhr.getAllResponseHeaders().split(/\r\n/).forEach(function(line) {
* Note: Header-Names are case-insensitive.
*
* @instance
- * @memberof LuCI.Headers
+ * @memberof LuCI.headers
* @param {string} name
* The header name to check
*
* Note: Header-Names are case-insensitive.
*
* @instance
- * @memberof LuCI.Headers
+ * @memberof LuCI.headers
* @param {string} name
* The header name to read
*
});
/**
- * @class
+ * @class response
* @memberof LuCI
* @hideconstructor
* @classdesc
* The `Response` class is an internal utility class representing HTTP responses.
*/
var Response = Class.extend({
- __name__: 'LuCI.XHR.Response',
+ __name__: 'LuCI.response',
__init__: function(xhr, url, duration, headers, content) {
/**
* Describes whether the response is successful (status codes `200..299`) or not
* @instance
- * @memberof LuCI.Response
+ * @memberof LuCI.response
* @name ok
* @type {boolean}
*/
/**
* The numeric HTTP status code of the response
* @instance
- * @memberof LuCI.Response
+ * @memberof LuCI.response
* @name status
* @type {number}
*/
/**
* The HTTP status description message of the response
* @instance
- * @memberof LuCI.Response
+ * @memberof LuCI.response
* @name statusText
* @type {string}
*/
/**
* The HTTP headers of the response
* @instance
- * @memberof LuCI.Response
+ * @memberof LuCI.response
* @name headers
- * @type {LuCI.Headers}
+ * @type {LuCI.headers}
*/
this.headers = (headers != null) ? headers : new Headers(xhr);
/**
* The total duration of the HTTP request in milliseconds
* @instance
- * @memberof LuCI.Response
+ * @memberof LuCI.response
* @name duration
* @type {number}
*/
/**
* The final URL of the request, i.e. after following redirects.
* @instance
- * @memberof LuCI.Response
+ * @memberof LuCI.response
* @name url
* @type {string}
*/
/* privates */
this.xhr = xhr;
- if (content != null && typeof(content) == 'object') {
+ if (content instanceof Blob) {
+ this.responseBlob = content;
+ this.responseJSON = null;
+ this.responseText = null;
+ }
+ else if (content != null && typeof(content) == 'object') {
+ this.responseBlob = null;
this.responseJSON = content;
this.responseText = null;
}
else if (content != null) {
+ this.responseBlob = null;
this.responseJSON = null;
this.responseText = String(content);
}
else {
this.responseJSON = null;
- this.responseText = xhr.responseText;
+
+ if (xhr.responseType == 'blob') {
+ this.responseBlob = xhr.response;
+ this.responseText = null;
+ }
+ else {
+ this.responseBlob = null;
+ this.responseText = xhr.responseText;
+ }
}
},
* of the cloned instance.
*
* @instance
- * @memberof LuCI.Response
+ * @memberof LuCI.response
* @param {*} [content]
* Override the content of the cloned response. Object values will be
* treated as JSON response data, all other types will be converted
* using `String()` and treated as response text.
*
- * @returns {LuCI.Response}
+ * @returns {LuCI.response}
* The cloned `Response` instance.
*/
clone: function(content) {
* Access the response content as JSON data.
*
* @instance
- * @memberof LuCI.Response
+ * @memberof LuCI.response
* @throws {SyntaxError}
* Throws `SyntaxError` if the content isn't valid JSON.
*
* Access the response content as string.
*
* @instance
- * @memberof LuCI.Response
+ * @memberof LuCI.response
* @returns {string}
* The response content.
*/
this.responseText = JSON.stringify(this.responseJSON);
return this.responseText;
+ },
+
+ /**
+ * Access the response content as blob.
+ *
+ * @instance
+ * @memberof LuCI.response
+ * @returns {Blob}
+ * The response content as blob.
+ */
+ blob: function() {
+ return this.responseBlob;
}
});
}
/**
- * @class
+ * @class request
* @memberof LuCI
* @hideconstructor
* @classdesc
* The `Request` class allows initiating HTTP requests and provides utilities
* for dealing with responses.
*/
- var Request = Class.singleton(/** @lends LuCI.Request.prototype */ {
- __name__: 'LuCI.Request',
+ var Request = Class.singleton(/** @lends LuCI.request.prototype */ {
+ __name__: 'LuCI.request',
interceptors: [],
* Turn the given relative URL into an absolute URL if necessary.
*
* @instance
- * @memberof LuCI.Request
+ * @memberof LuCI.request
* @param {string} url
* The URL to convert.
*
/**
* @typedef {Object} RequestOptions
- * @memberof LuCI.Request
+ * @memberof LuCI.request
*
* @property {string} [method=GET]
* The HTTP method to use, e.g. `GET` or `POST`.
* @property {boolean} [credentials=false]
* Whether to include credentials such as cookies in the request.
*
+ * @property {string} [responseType=text]
+ * Overrides the request response type. Valid values or `text` to
+ * interpret the response as UTF-8 string or `blob` to handle the
+ * response as binary `Blob` data.
+ *
* @property {*} [content]
* Specifies the HTTP message body to send along with the request.
* If the value is a function, it is invoked and the return value
* Initiate an HTTP request to the given target.
*
* @instance
- * @memberof LuCI.Request
+ * @memberof LuCI.request
* @param {string} target
* The URL to request.
*
- * @param {LuCI.Request.RequestOptions} [options]
+ * @param {LuCI.request.RequestOptions} [options]
* Additional options to configure the request.
*
- * @returns {Promise<LuCI.Response>}
+ * @returns {Promise<LuCI.response>}
* The resulting HTTP response.
*/
request: function(target, options) {
else
opt.xhr.open(opt.method, opt.url, true);
- opt.xhr.responseType = 'text';
+ opt.xhr.responseType = opt.responseType || 'text';
if ('overrideMimeType' in opt.xhr)
opt.xhr.overrideMimeType('application/octet-stream');
* Initiate an HTTP GET request to the given target.
*
* @instance
- * @memberof LuCI.Request
+ * @memberof LuCI.request
* @param {string} target
* The URL to request.
*
- * @param {LuCI.Request.RequestOptions} [options]
+ * @param {LuCI.request.RequestOptions} [options]
* Additional options to configure the request.
*
- * @returns {Promise<LuCI.Response>}
+ * @returns {Promise<LuCI.response>}
* The resulting HTTP response.
*/
get: function(url, options) {
* Initiate an HTTP POST request to the given target.
*
* @instance
- * @memberof LuCI.Request
+ * @memberof LuCI.request
* @param {string} target
* The URL to request.
*
* @param {*} [data]
- * The request data to send, see {@link LuCI.Request.RequestOptions} for details.
+ * The request data to send, see {@link LuCI.request.RequestOptions} for details.
*
- * @param {LuCI.Request.RequestOptions} [options]
+ * @param {LuCI.request.RequestOptions} [options]
* Additional options to configure the request.
*
- * @returns {Promise<LuCI.Response>}
+ * @returns {Promise<LuCI.response>}
* The resulting HTTP response.
*/
post: function(url, data, options) {
/**
* Interceptor functions are invoked whenever an HTTP reply is received, in the order
* these functions have been registered.
- * @callback LuCI.Request.interceptorFn
- * @param {LuCI.Response} res
+ * @callback LuCI.request.interceptorFn
+ * @param {LuCI.response} res
* The HTTP response object
*/
* implementing request retries before returning a failure.
*
* @instance
- * @memberof LuCI.Request
- * @param {LuCI.Request.interceptorFn} interceptorFn
+ * @memberof LuCI.request
+ * @param {LuCI.request.interceptorFn} interceptorFn
* The interceptor function to register.
*
- * @returns {LuCI.Request.interceptorFn}
+ * @returns {LuCI.request.interceptorFn}
* The registered function.
*/
addInterceptor: function(interceptorFn) {
* function.
*
* @instance
- * @memberof LuCI.Request
- * @param {LuCI.Request.interceptorFn} interceptorFn
+ * @memberof LuCI.request
+ * @param {LuCI.request.interceptorFn} interceptorFn
* The interceptor function to remove.
*
* @returns {boolean}
/**
* @class
- * @memberof LuCI.Request
+ * @memberof LuCI.request
* @hideconstructor
* @classdesc
*
* The `Request.poll` class provides some convience wrappers around
- * {@link LuCI.Poll} mainly to simplify registering repeating HTTP
+ * {@link LuCI.poll} mainly to simplify registering repeating HTTP
* request calls as polling functions.
*/
poll: {
* polled request is received or when the polled request timed
* out.
*
- * @callback LuCI.Request.poll~callbackFn
- * @param {LuCI.Response} res
+ * @callback LuCI.request.poll~callbackFn
+ * @param {LuCI.response} res
* The HTTP response object.
*
* @param {*} data
* to invoke whenever a response for the request is received.
*
* @instance
- * @memberof LuCI.Request.poll
+ * @memberof LuCI.request.poll
* @param {number} interval
* The poll interval in seconds.
*
* @param {string} url
* The URL to request on each poll.
*
- * @param {LuCI.Request.RequestOptions} [options]
+ * @param {LuCI.request.RequestOptions} [options]
* Additional options to configure the request.
*
- * @param {LuCI.Request.poll~callbackFn} [callback]
- * {@link LuCI.Request.poll~callbackFn Callback} function to
+ * @param {LuCI.request.poll~callbackFn} [callback]
+ * {@link LuCI.request.poll~callbackFn Callback} function to
* invoke for each HTTP reply.
*
* @throws {TypeError}
/**
* Remove a polling request that has been previously added using `add()`.
* This function is essentially a wrapper around
- * {@link LuCI.Poll.remove LuCI.Poll.remove()}.
+ * {@link LuCI.poll.remove LuCI.poll.remove()}.
*
* @instance
- * @memberof LuCI.Request.poll
+ * @memberof LuCI.request.poll
* @param {function} entry
- * The poll function returned by {@link LuCI.Request.poll#add add()}.
+ * The poll function returned by {@link LuCI.request.poll#add add()}.
*
* @returns {boolean}
* Returns `true` if any function has been removed, else `false`.
remove: function(entry) { return Poll.remove(entry) },
/**
- * Alias for {@link LuCI.Poll.start LuCI.Poll.start()}.
+ * Alias for {@link LuCI.poll.start LuCI.poll.start()}.
*
* @instance
- * @memberof LuCI.Request.poll
+ * @memberof LuCI.request.poll
*/
start: function() { return Poll.start() },
/**
- * Alias for {@link LuCI.Poll.stop LuCI.Poll.stop()}.
+ * Alias for {@link LuCI.poll.stop LuCI.poll.stop()}.
*
* @instance
- * @memberof LuCI.Request.poll
+ * @memberof LuCI.request.poll
*/
stop: function() { return Poll.stop() },
/**
- * Alias for {@link LuCI.Poll.active LuCI.Poll.active()}.
+ * Alias for {@link LuCI.poll.active LuCI.poll.active()}.
*
* @instance
- * @memberof LuCI.Request.poll
+ * @memberof LuCI.request.poll
*/
active: function() { return Poll.active() }
}
});
/**
- * @class
+ * @class poll
* @memberof LuCI
* @hideconstructor
* @classdesc
* as well as starting, stopping and querying the state of the polling
* loop.
*/
- var Poll = Class.singleton(/** @lends LuCI.Poll.prototype */ {
- __name__: 'LuCI.Poll',
+ var Poll = Class.singleton(/** @lends LuCI.poll.prototype */ {
+ __name__: 'LuCI.poll',
queue: [],
* already started at this point, it will be implicitely started.
*
* @instance
- * @memberof LuCI.Poll
+ * @memberof LuCI.poll
* @param {function} fn
* The function to invoke on each poll interval.
*
*/
add: function(fn, interval) {
if (interval == null || interval <= 0)
- interval = window.L ? window.L.env.pollinterval : null;
+ interval = env.pollinterval || null;
if (isNaN(interval) || typeof(fn) != 'function')
- throw new TypeError('Invalid argument to LuCI.Poll.add()');
+ throw new TypeError('Invalid argument to LuCI.poll.add()');
for (var i = 0; i < this.queue.length; i++)
if (this.queue[i].fn === fn)
* are registered, the polling loop is implicitely stopped.
*
* @instance
- * @memberof LuCI.Poll
+ * @memberof LuCI.poll
* @param {function} fn
* The function to remove.
*
*/
remove: function(fn) {
if (typeof(fn) != 'function')
- throw new TypeError('Invalid argument to LuCI.Poll.remove()');
+ throw new TypeError('Invalid argument to LuCI.poll.remove()');
var len = this.queue.length;
* to the `document` object upon successful start.
*
* @instance
- * @memberof LuCI.Poll
+ * @memberof LuCI.poll
* @returns {boolean}
* Returns `true` if polling has been started (or if no functions
* where registered) or `false` when the polling loop already runs.
* to the `document` object upon successful stop.
*
* @instance
- * @memberof LuCI.Poll
+ * @memberof LuCI.poll
* @returns {boolean}
* Returns `true` if polling has been stopped or `false` if it din't
* run to begin with.
* Test whether the polling loop is running.
*
* @instance
- * @memberof LuCI.Poll
+ * @memberof LuCI.poll
* @returns {boolean} - Returns `true` if polling is active, else `false`.
*/
active: function() {
}
});
+ /**
+ * @class dom
+ * @memberof LuCI
+ * @hideconstructor
+ * @classdesc
+ *
+ * The `dom` class provides convenience method for creating and
+ * manipulating DOM elements.
+ *
+ * To import the class in views, use `'require dom'`, to import it in
+ * external JavaScript, use `L.require("dom").then(...)`.
+ */
+ var DOM = Class.singleton(/** @lends LuCI.dom.prototype */ {
+ __name__: 'LuCI.dom',
- var dummyElem = null,
- domParser = null,
- originalCBIInit = null,
- rpcBaseURL = null,
- sysFeatures = null,
- classes = {};
+ /**
+ * Tests whether the given argument is a valid DOM `Node`.
+ *
+ * @instance
+ * @memberof LuCI.dom
+ * @param {*} e
+ * The value to test.
+ *
+ * @returns {boolean}
+ * Returns `true` if the value is a DOM `Node`, else `false`.
+ */
+ elem: function(e) {
+ return (e != null && typeof(e) == 'object' && 'nodeType' in e);
+ },
- var LuCI = Class.extend(/** @lends LuCI.prototype */ {
- __name__: 'LuCI',
- __init__: function(env) {
+ /**
+ * Parses a given string as HTML and returns the first child node.
+ *
+ * @instance
+ * @memberof LuCI.dom
+ * @param {string} s
+ * A string containing an HTML fragment to parse. Note that only
+ * the first result of the resulting structure is returned, so an
+ * input value of `<div>foo</div> <div>bar</div>` will only return
+ * the first `div` element node.
+ *
+ * @returns {Node}
+ * Returns the first DOM `Node` extracted from the HTML fragment or
+ * `null` on parsing failures or if no element could be found.
+ */
+ parse: function(s) {
+ var elem;
- document.querySelectorAll('script[src*="/luci.js"]').forEach(function(s) {
- if (env.base_url == null || env.base_url == '') {
- var m = (s.getAttribute('src') || '').match(/^(.*)\/luci\.js(?:\?v=([^?]+))?$/);
- if (m) {
- env.base_url = m[1];
- env.resource_version = m[2];
- }
+ try {
+ domParser = domParser || new DOMParser();
+ elem = domParser.parseFromString(s, 'text/html').body.firstChild;
+ }
+ catch(e) {}
+
+ if (!elem) {
+ try {
+ dummyElem = dummyElem || document.createElement('div');
+ dummyElem.innerHTML = s;
+ elem = dummyElem.firstChild;
}
- });
+ catch (e) {}
+ }
- if (env.base_url == null)
- this.error('InternalError', 'Cannot find url of luci.js');
+ return elem || null;
+ },
+
+ /**
+ * Tests whether a given `Node` matches the given query selector.
+ *
+ * This function is a convenience wrapper around the standard
+ * `Node.matches("selector")` function with the added benefit that
+ * the `node` argument may be a non-`Node` value, in which case
+ * this function simply returns `false`.
+ *
+ * @instance
+ * @memberof LuCI.dom
+ * @param {*} node
+ * The `Node` argument to test the selector against.
+ *
+ * @param {string} [selector]
+ * The query selector expression to test against the given node.
+ *
+ * @returns {boolean}
+ * Returns `true` if the given node matches the specified selector
+ * or `false` when the node argument is no valid DOM `Node` or the
+ * selector didn't match.
+ */
+ matches: function(node, selector) {
+ var m = this.elem(node) ? node.matches || node.msMatchesSelector : null;
+ return m ? m.call(node, selector) : false;
+ },
- env.cgi_base = env.scriptname.replace(/\/[^\/]+$/, '');
+ /**
+ * Returns the closest parent node that matches the given query
+ * selector expression.
+ *
+ * This function is a convenience wrapper around the standard
+ * `Node.closest("selector")` function with the added benefit that
+ * the `node` argument may be a non-`Node` value, in which case
+ * this function simply returns `null`.
+ *
+ * @instance
+ * @memberof LuCI.dom
+ * @param {*} node
+ * The `Node` argument to find the closest parent for.
+ *
+ * @param {string} [selector]
+ * The query selector expression to test against each parent.
+ *
+ * @returns {Node|null}
+ * Returns the closest parent node matching the selector or
+ * `null` when the node argument is no valid DOM `Node` or the
+ * selector didn't match any parent.
+ */
+ parent: function(node, selector) {
+ if (this.elem(node) && node.closest)
+ return node.closest(selector);
- Object.assign(this.env, env);
+ while (this.elem(node))
+ if (this.matches(node, selector))
+ return node;
+ else
+ node = node.parentNode;
- document.addEventListener('poll-start', function(ev) {
- document.querySelectorAll('[id^="xhr_poll_status"]').forEach(function(e) {
- e.style.display = (e.id == 'xhr_poll_status_off') ? 'none' : '';
- });
- });
+ return null;
+ },
- document.addEventListener('poll-stop', function(ev) {
- document.querySelectorAll('[id^="xhr_poll_status"]').forEach(function(e) {
- e.style.display = (e.id == 'xhr_poll_status_on') ? 'none' : '';
- });
- });
+ /**
+ * Appends the given children data to the given node.
+ *
+ * @instance
+ * @memberof LuCI.dom
+ * @param {*} node
+ * The `Node` argument to append the children to.
+ *
+ * @param {*} [children]
+ * The childrens to append to the given node.
+ *
+ * When `children` is an array, then each item of the array
+ * will be either appended as child element or text node,
+ * depending on whether the item is a DOM `Node` instance or
+ * some other non-`null` value. Non-`Node`, non-`null` values
+ * will be converted to strings first before being passed as
+ * argument to `createTextNode()`.
+ *
+ * When `children` is a function, it will be invoked with
+ * the passed `node` argument as sole parameter and the `append`
+ * function will be invoked again, with the given `node` argument
+ * as first and the return value of the `children` function as
+ * second parameter.
+ *
+ * When `children` is is a DOM `Node` instance, it will be
+ * appended to the given `node`.
+ *
+ * When `children` is any other non-`null` value, it will be
+ * converted to a string and appened to the `innerHTML` property
+ * of the given `node`.
+ *
+ * @returns {Node|null}
+ * Returns the last children `Node` appended to the node or `null`
+ * if either the `node` argument was no valid DOM `node` or if the
+ * `children` was `null` or didn't result in further DOM nodes.
+ */
+ append: function(node, children) {
+ if (!this.elem(node))
+ return null;
- var domReady = new Promise(function(resolveFn, rejectFn) {
- document.addEventListener('DOMContentLoaded', resolveFn);
- });
+ if (Array.isArray(children)) {
+ for (var i = 0; i < children.length; i++)
+ if (this.elem(children[i]))
+ node.appendChild(children[i]);
+ else if (children !== null && children !== undefined)
+ node.appendChild(document.createTextNode('' + children[i]));
- Promise.all([
- domReady,
- this.require('ui'),
- this.require('rpc'),
- this.require('form'),
- this.probeRPCBaseURL()
- ]).then(this.setupDOM.bind(this)).catch(this.error);
+ return node.lastChild;
+ }
+ else if (typeof(children) === 'function') {
+ return this.append(node, children(node));
+ }
+ else if (this.elem(children)) {
+ return node.appendChild(children);
+ }
+ else if (children !== null && children !== undefined) {
+ node.innerHTML = '' + children;
+ return node.lastChild;
+ }
- originalCBIInit = window.cbi_init;
- window.cbi_init = function() {};
+ return null;
},
/**
- * Captures the current stack trace and throws an error of the
- * specified type as a new exception. Also logs the exception as
- * error to the debug console if it is available.
+ * Replaces the content of the given node with the given children.
+ *
+ * This function first removes any children of the given DOM
+ * `Node` and then adds the given given children following the
+ * rules outlined below.
*
* @instance
- * @memberof LuCI
+ * @memberof LuCI.dom
+ * @param {*} node
+ * The `Node` argument to replace the children of.
+ *
+ * @param {*} [children]
+ * The childrens to replace into the given node.
+ *
+ * When `children` is an array, then each item of the array
+ * will be either appended as child element or text node,
+ * depending on whether the item is a DOM `Node` instance or
+ * some other non-`null` value. Non-`Node`, non-`null` values
+ * will be converted to strings first before being passed as
+ * argument to `createTextNode()`.
+ *
+ * When `children` is a function, it will be invoked with
+ * the passed `node` argument as sole parameter and the `append`
+ * function will be invoked again, with the given `node` argument
+ * as first and the return value of the `children` function as
+ * second parameter.
+ *
+ * When `children` is is a DOM `Node` instance, it will be
+ * appended to the given `node`.
+ *
+ * When `children` is any other non-`null` value, it will be
+ * converted to a string and appened to the `innerHTML` property
+ * of the given `node`.
+ *
+ * @returns {Node|null}
+ * Returns the last children `Node` appended to the node or `null`
+ * if either the `node` argument was no valid DOM `node` or if the
+ * `children` was `null` or didn't result in further DOM nodes.
+ */
+ content: function(node, children) {
+ if (!this.elem(node))
+ return null;
+
+ var dataNodes = node.querySelectorAll('[data-idref]');
+
+ for (var i = 0; i < dataNodes.length; i++)
+ delete this.registry[dataNodes[i].getAttribute('data-idref')];
+
+ while (node.firstChild)
+ node.removeChild(node.firstChild);
+
+ return this.append(node, children);
+ },
+
+ /**
+ * Sets attributes or registers event listeners on element nodes.
*
- * @param {Error|string} [type=Error]
- * Either a string specifying the type of the error to throw or an
- * existing `Error` instance to copy.
+ * @instance
+ * @memberof LuCI.dom
+ * @param {*} node
+ * The `Node` argument to set the attributes or add the event
+ * listeners for. When the given `node` value is not a valid
+ * DOM `Node`, the function returns and does nothing.
+ *
+ * @param {string|Object<string, *>} key
+ * Specifies either the attribute or event handler name to use,
+ * or an object containing multiple key, value pairs which are
+ * each added to the node as either attribute or event handler,
+ * depending on the respective value.
*
- * @param {string} [fmt=Unspecified error]
- * A format string which is used to form the error message, together
- * with all subsequent optional arguments.
+ * @param {*} [val]
+ * Specifies the attribute value or event handler function to add.
+ * If the `key` parameter is an `Object`, this parameter will be
+ * ignored.
*
- * @param {...*} [args]
- * Zero or more variable arguments to the supplied format string.
+ * When `val` is of type function, it will be registered as event
+ * handler on the given `node` with the `key` parameter being the
+ * event name.
*
- * @throws {Error}
- * Throws the created error object with the captured stack trace
- * appended to the message and the type set to the given type
- * argument or copied from the given error instance.
+ * When `val` is of type object, it will be serialized as JSON and
+ * added as attribute to the given `node`, using the given `key`
+ * as attribute name.
+ *
+ * When `val` is of any other type, it will be added as attribute
+ * to the given `node` as-is, with the underlying `setAttribute()`
+ * call implicitely turning it into a string.
*/
- raise: function(type, fmt /*, ...*/) {
- var e = null,
- msg = fmt ? String.prototype.format.apply(fmt, this.varargs(arguments, 2)) : null,
- stack = null;
+ attr: function(node, key, val) {
+ if (!this.elem(node))
+ return null;
- if (type instanceof Error) {
- e = type;
+ var attr = null;
- if (msg)
- e.message = msg + ': ' + e.message;
- }
- else {
- try { throw new Error('stacktrace') }
- catch (e2) { stack = (e2.stack || '').split(/\n/) }
+ if (typeof(key) === 'object' && key !== null)
+ attr = key;
+ else if (typeof(key) === 'string')
+ attr = {}, attr[key] = val;
- e = new (window[type || 'Error'] || Error)(msg || 'Unspecified error');
- e.name = type || 'Error';
- }
+ for (key in attr) {
+ if (!attr.hasOwnProperty(key) || attr[key] == null)
+ continue;
- stack = (stack || []).map(function(frame) {
- frame = frame.replace(/(.*?)@(.+):(\d+):(\d+)/g, 'at $1 ($2:$3:$4)').trim();
- return frame ? ' ' + frame : '';
- });
+ switch (typeof(attr[key])) {
+ case 'function':
+ node.addEventListener(key, attr[key]);
+ break;
- if (!/^ at /.test(stack[0]))
- stack.shift();
+ case 'object':
+ node.setAttribute(key, JSON.stringify(attr[key]));
+ break;
- if (/\braise /.test(stack[0]))
- stack.shift();
+ default:
+ node.setAttribute(key, attr[key]);
+ }
+ }
+ },
- if (/\berror /.test(stack[0]))
- stack.shift();
+ /**
+ * Creates a new DOM `Node` from the given `html`, `attr` and
+ * `data` parameters.
+ *
+ * This function has multiple signatures, it can be either invoked
+ * in the form `create(html[, attr[, data]])` or in the form
+ * `create(html[, data])`. The used variant is determined from the
+ * type of the second argument.
+ *
+ * @instance
+ * @memberof LuCI.dom
+ * @param {*} html
+ * Describes the node to create.
+ *
+ * When the value of `html` is of type array, a `DocumentFragment`
+ * node is created and each item of the array is first converted
+ * to a DOM `Node` by passing it through `create()` and then added
+ * as child to the fragment.
+ *
+ * When the value of `html` is a DOM `Node` instance, no new
+ * element will be created but the node will be used as-is.
+ *
+ * When the value of `html` is a string starting with `<`, it will
+ * be passed to `dom.parse()` and the resulting value is used.
+ *
+ * When the value of `html` is any other string, it will be passed
+ * to `document.createElement()` for creating a new DOM `Node` of
+ * the given name.
+ *
+ * @param {Object<string, *>} [attr]
+ * Specifies an Object of key, value pairs to set as attributes
+ * or event handlers on the created node. Refer to
+ * {@link LuCI.dom#attr dom.attr()} for details.
+ *
+ * @param {*} [data]
+ * Specifies children to append to the newly created element.
+ * Refer to {@link LuCI.dom#append dom.append()} for details.
+ *
+ * @throws {InvalidCharacterError}
+ * Throws an `InvalidCharacterError` when the given `html`
+ * argument contained malformed markup (such as not escaped
+ * `&` characters in XHTML mode) or when the given node name
+ * in `html` contains characters which are not legal in DOM
+ * element names, such as spaces.
+ *
+ * @returns {Node}
+ * Returns the newly created `Node`.
+ */
+ create: function() {
+ var html = arguments[0],
+ attr = arguments[1],
+ data = arguments[2],
+ elem;
+
+ if (!(attr instanceof Object) || Array.isArray(attr))
+ data = attr, attr = null;
+
+ if (Array.isArray(html)) {
+ elem = document.createDocumentFragment();
+ for (var i = 0; i < html.length; i++)
+ elem.appendChild(this.create(html[i]));
+ }
+ else if (this.elem(html)) {
+ elem = html;
+ }
+ else if (html.charCodeAt(0) === 60) {
+ elem = this.parse(html);
+ }
+ else {
+ elem = document.createElement(html);
+ }
- if (stack.length)
- e.message += '\n' + stack.join('\n');
+ if (!elem)
+ return null;
- if (window.console && console.debug)
- console.debug(e);
+ this.attr(elem, attr);
+ this.append(elem, data);
- throw e;
+ return elem;
},
+ registry: {},
+
/**
- * A wrapper around {@link LuCI#raise raise()} which also renders
- * the error either as modal overlay when `ui.js` is already loaed
- * or directly into the view body.
+ * Attaches or detaches arbitrary data to and from a DOM `Node`.
+ *
+ * This function is useful to attach non-string values or runtime
+ * data that is not serializable to DOM nodes. To decouple data
+ * from the DOM, values are not added directly to nodes, but
+ * inserted into a registry instead which is then referenced by a
+ * string key stored as `data-idref` attribute in the node.
+ *
+ * This function has multiple signatures and is sensitive to the
+ * number of arguments passed to it.
+ *
+ * - `dom.data(node)` -
+ * Fetches all data associated with the given node.
+ * - `dom.data(node, key)` -
+ * Fetches a specific key associated with the given node.
+ * - `dom.data(node, key, val)` -
+ * Sets a specific key to the given value associated with the
+ * given node.
+ * - `dom.data(node, null)` -
+ * Clears any data associated with the node.
+ * - `dom.data(node, key, null)` -
+ * Clears the given key associated with the node.
*
* @instance
- * @memberof LuCI
- *
- * @param {Error|string} [type=Error]
- * Either a string specifying the type of the error to throw or an
- * existing `Error` instance to copy.
+ * @memberof LuCI.dom
+ * @param {Node} node
+ * The DOM `Node` instance to set or retrieve the data for.
*
- * @param {string} [fmt=Unspecified error]
- * A format string which is used to form the error message, together
- * with all subsequent optional arguments.
+ * @param {string|null} [key]
+ * This is either a string specifying the key to retrieve, or
+ * `null` to unset the entire node data.
*
- * @param {...*} [args]
- * Zero or more variable arguments to the supplied format string.
+ * @param {*|null} [val]
+ * This is either a non-`null` value to set for a given key or
+ * `null` to remove the given `key` from the specified node.
*
- * @throws {Error}
- * Throws the created error object with the captured stack trace
- * appended to the message and the type set to the given type
- * argument or copied from the given error instance.
+ * @returns {*}
+ * Returns the get or set value, or `null` when no value could
+ * be found.
*/
- error: function(type, fmt /*, ...*/) {
- try {
- L.raise.apply(L, Array.prototype.slice.call(arguments));
+ data: function(node, key, val) {
+ if (!node || !node.getAttribute)
+ return null;
+
+ var id = node.getAttribute('data-idref');
+
+ /* clear all data */
+ if (arguments.length > 1 && key == null) {
+ if (id != null) {
+ node.removeAttribute('data-idref');
+ val = this.registry[id]
+ delete this.registry[id];
+ return val;
+ }
+
+ return null;
}
- catch (e) {
- if (!e.reported) {
- if (L.ui)
- L.ui.addNotification(e.name || _('Runtime error'),
- E('pre', {}, e.message), 'danger');
- else
- L.dom.content(document.querySelector('#maincontent'),
- E('pre', { 'class': 'alert-message error' }, e.message));
- e.reported = true;
+ /* clear a key */
+ else if (arguments.length > 2 && key != null && val == null) {
+ if (id != null) {
+ val = this.registry[id][key];
+ delete this.registry[id][key];
+ return val;
}
- throw e;
+ return null;
+ }
+
+ /* set a key */
+ else if (arguments.length > 2 && key != null && val != null) {
+ if (id == null) {
+ do { id = Math.floor(Math.random() * 0xffffffff).toString(16) }
+ while (this.registry.hasOwnProperty(id));
+
+ node.setAttribute('data-idref', id);
+ this.registry[id] = {};
+ }
+
+ return (this.registry[id][key] = val);
}
+
+ /* get all data */
+ else if (arguments.length == 1) {
+ if (id != null)
+ return this.registry[id];
+
+ return null;
+ }
+
+ /* get a key */
+ else if (arguments.length == 2) {
+ if (id != null)
+ return this.registry[id][key];
+ }
+
+ return null;
},
/**
- * Return a bound function using the given `self` as `this` context
- * and any further arguments as parameters to the bound function.
+ * Binds the given class instance ot the specified DOM `Node`.
*
- * @instance
- * @memberof LuCI
+ * This function uses the `dom.data()` facility to attach the
+ * passed instance of a Class to a node. This is needed for
+ * complex widget elements or similar where the corresponding
+ * class instance responsible for the element must be retrieved
+ * from DOM nodes obtained by `querySelector()` or similar means.
*
- * @param {function} fn
- * The function to bind.
+ * @instance
+ * @memberof LuCI.dom
+ * @param {Node} node
+ * The DOM `Node` instance to bind the class to.
*
- * @param {*} self
- * The value to bind as `this` context to the specified function.
+ * @param {Class} inst
+ * The Class instance to bind to the node.
*
- * @param {...*} [args]
- * Zero or more variable arguments which are bound to the function
- * as parameters.
+ * @throws {TypeError}
+ * Throws a `TypeError` when the given instance argument isn't
+ * a valid Class instance.
*
- * @returns {function}
- * Returns the bound function.
+ * @returns {Class}
+ * Returns the bound class instance.
*/
- bind: function(fn, self /*, ... */) {
- return Function.prototype.bind.apply(fn, this.varargs(arguments, 2, self));
+ bindClassInstance: function(node, inst) {
+ if (!(inst instanceof Class))
+ LuCI.prototype.error('TypeError', 'Argument must be a class instance');
+
+ return this.data(node, '_class', inst);
},
/**
- * Load an additional LuCI JavaScript class and its dependencies,
- * instantiate it and return the resulting class instance. Each
- * class is only loaded once. Subsequent attempts to load the same
- * class will return the already instantiated class.
+ * Finds a bound class instance on the given node itself or the
+ * first bound instance on its closest parent node.
*
* @instance
- * @memberof LuCI
+ * @memberof LuCI.dom
+ * @param {Node} node
+ * The DOM `Node` instance to start from.
*
- * @param {string} name
- * The name of the class to load in dotted notation. Dots will
- * be replaced by spaces and joined with the runtime-determined
- * base URL of LuCI.js to form an absolute URL to load the class
- * file from.
- *
- * @throws {DependencyError}
- * Throws a `DependencyError` when the class to load includes
- * circular dependencies.
+ * @returns {Class|null}
+ * Returns the founds class instance if any or `null` if no bound
+ * class could be found on the node itself or any of its parents.
+ */
+ findClassInstance: function(node) {
+ var inst = null;
+
+ do {
+ inst = this.data(node, '_class');
+ node = node.parentNode;
+ }
+ while (!(inst instanceof Class) && node != null);
+
+ return inst;
+ },
+
+ /**
+ * Finds a bound class instance on the given node itself or the
+ * first bound instance on its closest parent node and invokes
+ * the specified method name on the found class instance.
*
- * @throws {NetworkError}
- * Throws `NetworkError` when the underlying {@link LuCI.Request}
- * call failed.
+ * @instance
+ * @memberof LuCI.dom
+ * @param {Node} node
+ * The DOM `Node` instance to start from.
*
- * @throws {SyntaxError}
- * Throws `SyntaxError` when the loaded class file code cannot
- * be interpreted by `eval`.
+ * @param {string} method
+ * The name of the method to invoke on the found class instance.
*
- * @throws {TypeError}
- * Throws `TypeError` when the class file could be loaded and
- * interpreted, but when invoking its code did not yield a valid
- * class instance.
+ * @param {...*} params
+ * Additional arguments to pass to the invoked method as-is.
*
- * @returns {Promise<LuCI#Class>}
- * Returns the instantiated class.
+ * @returns {*|null}
+ * Returns the return value of the invoked method if a class
+ * instance and method has been found. Returns `null` if either
+ * no bound class instance could be found, or if the found
+ * instance didn't have the requested `method`.
*/
- require: function(name, from) {
- var L = this, url = null, from = from || [];
+ callClassMethod: function(node, method /*, ... */) {
+ var inst = this.findClassInstance(node);
- /* Class already loaded */
- if (classes[name] != null) {
- /* Circular dependency */
- if (from.indexOf(name) != -1)
- L.raise('DependencyError',
- 'Circular dependency: class "%s" depends on "%s"',
- name, from.join('" which depends on "'));
+ if (inst == null || typeof(inst[method]) != 'function')
+ return null;
- return Promise.resolve(classes[name]);
- }
+ return inst[method].apply(inst, inst.varargs(arguments, 2));
+ },
- url = '%s/%s.js%s'.format(L.env.base_url, name.replace(/\./g, '/'), (L.env.resource_version ? '?v=' + L.env.resource_version : ''));
- from = [ name ].concat(from);
+ /**
+ * The ignore callback function is invoked by `isEmpty()` for each
+ * child node to decide whether to ignore a child node or not.
+ *
+ * When this function returns `false`, the node passed to it is
+ * ignored, else not.
+ *
+ * @callback LuCI.dom~ignoreCallbackFn
+ * @param {Node} node
+ * The child node to test.
+ *
+ * @returns {boolean}
+ * Boolean indicating whether to ignore the node or not.
+ */
- var compileClass = function(res) {
- if (!res.ok)
- L.raise('NetworkError',
- 'HTTP error %d while loading class file "%s"', res.status, url);
+ /**
+ * Tests whether a given DOM `Node` instance is empty or appears
+ * empty.
+ *
+ * Any element child nodes which have the CSS class `hidden` set
+ * or for which the optionally passed `ignoreFn` callback function
+ * returns `false` are ignored.
+ *
+ * @instance
+ * @memberof LuCI.dom
+ * @param {Node} node
+ * The DOM `Node` instance to test.
+ *
+ * @param {LuCI.dom~ignoreCallbackFn} [ignoreFn]
+ * Specifies an optional function which is invoked for each child
+ * node to decide whether the child node should be ignored or not.
+ *
+ * @returns {boolean}
+ * Returns `true` if the node does not have any children or if
+ * any children node either has a `hidden` CSS class or a `false`
+ * result when testing it using the given `ignoreFn`.
+ */
+ isEmpty: function(node, ignoreFn) {
+ for (var child = node.firstElementChild; child != null; child = child.nextElementSibling)
+ if (!child.classList.contains('hidden') && (!ignoreFn || !ignoreFn(child)))
+ return false;
- var source = res.text(),
- requirematch = /^require[ \t]+(\S+)(?:[ \t]+as[ \t]+([a-zA-Z_]\S*))?$/,
- strictmatch = /^use[ \t]+strict$/,
- depends = [],
- args = '';
+ return true;
+ }
+ });
- /* find require statements in source */
- for (var i = 0, off = -1, quote = -1, esc = false; i < source.length; i++) {
- var chr = source.charCodeAt(i);
+ /**
+ * @class session
+ * @memberof LuCI
+ * @hideconstructor
+ * @classdesc
+ *
+ * The `session` class provides various session related functionality.
+ */
+ var Session = Class.singleton(/** @lends LuCI.session.prototype */ {
+ __name__: 'LuCI.session',
- if (esc) {
- esc = false;
- }
- else if (chr == 92) {
- esc = true;
- }
- else if (chr == quote) {
- var s = source.substring(off, i),
- m = requirematch.exec(s);
+ /**
+ * Retrieve the current session ID.
+ *
+ * @returns {string}
+ * Returns the current session ID.
+ */
+ getID: function() {
+ return env.sessionid || '00000000000000000000000000000000';
+ },
- if (m) {
- var dep = m[1], as = m[2] || dep.replace(/[^a-zA-Z0-9_]/g, '_');
- depends.push(L.require(dep, from));
- args += ', ' + as;
- }
- else if (!strictmatch.exec(s)) {
- break;
- }
+ /**
+ * Retrieve the current session token.
+ *
+ * @returns {string|null}
+ * Returns the current session token or `null` if not logged in.
+ */
+ getToken: function() {
+ return env.token || null;
+ },
- off = -1;
- quote = -1;
- }
- else if (quote == -1 && (chr == 34 || chr == 39)) {
- off = i + 1;
- quote = chr;
- }
+ /**
+ * Retrieve data from the local session storage.
+ *
+ * @param {string} [key]
+ * The key to retrieve from the session data store. If omitted, all
+ * session data will be returned.
+ *
+ * @returns {*}
+ * Returns the stored session data or `null` if the given key wasn't
+ * found.
+ */
+ getLocalData: function(key) {
+ try {
+ var sid = this.getID(),
+ item = 'luci-session-store',
+ data = JSON.parse(window.sessionStorage.getItem(item));
+
+ if (!LuCI.prototype.isObject(data) || !data.hasOwnProperty(sid)) {
+ data = {};
+ data[sid] = {};
}
- /* load dependencies and instantiate class */
- return Promise.all(depends).then(function(instances) {
- var _factory, _class;
+ if (key != null)
+ return data[sid].hasOwnProperty(key) ? data[sid][key] : null;
- try {
- _factory = eval(
- '(function(window, document, L%s) { %s })\n\n//# sourceURL=%s\n'
- .format(args, source, res.url));
- }
- catch (error) {
- L.raise('SyntaxError', '%s\n in %s:%s',
- error.message, res.url, error.lineNumber || '?');
- }
+ return data[sid];
+ }
+ catch (e) {
+ return (key != null) ? null : {};
+ }
+ },
- _factory.displayName = toCamelCase(name + 'ClassFactory');
- _class = _factory.apply(_factory, [window, document, L].concat(instances));
+ /**
+ * Set data in the local session storage.
+ *
+ * @param {string} key
+ * The key to set in the session data store.
+ *
+ * @param {*} value
+ * The value to store. It will be internally converted to JSON before
+ * being put in the session store.
+ *
+ * @returns {boolean}
+ * Returns `true` if the data could be stored or `false` on error.
+ */
+ setLocalData: function(key, value) {
+ if (key == null)
+ return false;
- if (!Class.isSubclass(_class))
- L.error('TypeError', '"%s" factory yields invalid constructor', name);
+ try {
+ var sid = this.getID(),
+ item = 'luci-session-store',
+ data = JSON.parse(window.sessionStorage.getItem(item));
- if (_class.displayName == 'AnonymousClass')
- _class.displayName = toCamelCase(name + 'Class');
+ if (!LuCI.prototype.isObject(data) || !data.hasOwnProperty(sid)) {
+ data = {};
+ data[sid] = {};
+ }
- var ptr = Object.getPrototypeOf(L),
- parts = name.split(/\./),
- instance = new _class();
+ if (value != null)
+ data[sid][key] = value;
+ else
+ delete data[sid][key];
- for (var i = 0; ptr && i < parts.length - 1; i++)
- ptr = ptr[parts[i]];
+ window.sessionStorage.setItem(item, JSON.stringify(data));
- if (ptr)
- ptr[parts[i]] = instance;
+ return true;
+ }
+ catch (e) {
+ return false;
+ }
+ }
+ });
- classes[name] = instance;
+ /**
+ * @class view
+ * @memberof LuCI
+ * @hideconstructor
+ * @classdesc
+ *
+ * The `view` class forms the basis of views and provides a standard
+ * set of methods to inherit from.
+ */
+ var View = Class.extend(/** @lends LuCI.view.prototype */ {
+ __name__: 'LuCI.view',
- return instance;
- });
- };
+ __init__: function() {
+ var vp = document.getElementById('view');
- /* Request class file */
- classes[name] = Request.get(url, { cache: true }).then(compileClass);
+ DOM.content(vp, E('div', { 'class': 'spinning' }, _('Loading view…')));
- return classes[name];
+ return Promise.resolve(this.load())
+ .then(LuCI.prototype.bind(this.render, this))
+ .then(LuCI.prototype.bind(function(nodes) {
+ var vp = document.getElementById('view');
+
+ DOM.content(vp, nodes);
+ DOM.append(vp, this.addFooter());
+ }, this)).catch(LuCI.prototype.error);
},
- /* DOM setup */
- probeRPCBaseURL: function() {
- if (rpcBaseURL == null) {
- try {
- rpcBaseURL = window.sessionStorage.getItem('rpcBaseURL');
- }
- catch (e) { }
- }
+ /**
+ * The load function is invoked before the view is rendered.
+ *
+ * The invocation of this function is wrapped by
+ * `Promise.resolve()` so it may return Promises if needed.
+ *
+ * The return value of the function (or the resolved values
+ * of the promise returned by it) will be passed as first
+ * argument to `render()`.
+ *
+ * This function is supposed to be overwritten by subclasses,
+ * the default implementation does nothing.
+ *
+ * @instance
+ * @abstract
+ * @memberof LuCI.view
+ *
+ * @returns {*|Promise<*>}
+ * May return any value or a Promise resolving to any value.
+ */
+ load: function() {},
- if (rpcBaseURL == null) {
- var rpcFallbackURL = this.url('admin/ubus');
+ /**
+ * The render function is invoked after the
+ * {@link LuCI.view#load load()} function and responsible
+ * for setting up the view contents. It must return a DOM
+ * `Node` or `DocumentFragment` holding the contents to
+ * insert into the view area.
+ *
+ * The invocation of this function is wrapped by
+ * `Promise.resolve()` so it may return Promises if needed.
+ *
+ * The return value of the function (or the resolved values
+ * of the promise returned by it) will be inserted into the
+ * main content area using
+ * {@link LuCI.dom#append dom.append()}.
+ *
+ * This function is supposed to be overwritten by subclasses,
+ * the default implementation does nothing.
+ *
+ * @instance
+ * @abstract
+ * @memberof LuCI.view
+ * @param {*|null} load_results
+ * This function will receive the return value of the
+ * {@link LuCI.view#load view.load()} function as first
+ * argument.
+ *
+ * @returns {Node|Promise<Node>}
+ * Should return a DOM `Node` value or a `Promise` resolving
+ * to a `Node` value.
+ */
+ render: function() {},
- rpcBaseURL = Request.get(this.env.ubuspath).then(function(res) {
- return (rpcBaseURL = (res.status == 400) ? L.env.ubuspath : rpcFallbackURL);
- }, function() {
- return (rpcBaseURL = rpcFallbackURL);
- }).then(function(url) {
- try {
- window.sessionStorage.setItem('rpcBaseURL', url);
- }
- catch (e) { }
+ /**
+ * The handleSave function is invoked when the user clicks
+ * the `Save` button in the page action footer.
+ *
+ * The default implementation should be sufficient for most
+ * views using {@link form#Map form.Map()} based forms - it
+ * will iterate all forms present in the view and invoke
+ * the {@link form#Map#save Map.save()} method on each form.
+ *
+ * Views not using `Map` instances or requiring other special
+ * logic should overwrite `handleSave()` with a custom
+ * implementation.
+ *
+ * To disable the `Save` page footer button, views extending
+ * this base class should overwrite the `handleSave` function
+ * with `null`.
+ *
+ * The invocation of this function is wrapped by
+ * `Promise.resolve()` so it may return Promises if needed.
+ *
+ * @instance
+ * @memberof LuCI.view
+ * @param {Event} ev
+ * The DOM event that triggered the function.
+ *
+ * @returns {*|Promise<*>}
+ * Any return values of this function are discarded, but
+ * passed through `Promise.resolve()` to ensure that any
+ * returned promise runs to completion before the button
+ * is reenabled.
+ */
+ handleSave: function(ev) {
+ var tasks = [];
- return url;
+ document.getElementById('maincontent')
+ .querySelectorAll('.cbi-map').forEach(function(map) {
+ tasks.push(DOM.callClassMethod(map, 'save'));
});
- }
- return Promise.resolve(rpcBaseURL);
+ return Promise.all(tasks);
},
- probeSystemFeatures: function() {
- var sessionid = classes.rpc.getSessionID();
-
- if (sysFeatures == null) {
- try {
- var data = JSON.parse(window.sessionStorage.getItem('sysFeatures'));
-
- if (this.isObject(data) && this.isObject(data[sessionid]))
- sysFeatures = data[sessionid];
- }
- catch (e) {}
- }
-
- if (!this.isObject(sysFeatures)) {
- sysFeatures = classes.rpc.declare({
- object: 'luci',
- method: 'getFeatures',
- expect: { '': {} }
- })().then(function(features) {
- try {
- var data = {};
- data[sessionid] = features;
-
- window.sessionStorage.setItem('sysFeatures', JSON.stringify(data));
- }
- catch (e) {}
+ /**
+ * The handleSaveApply function is invoked when the user clicks
+ * the `Save & Apply` button in the page action footer.
+ *
+ * The default implementation should be sufficient for most
+ * views using {@link form#Map form.Map()} based forms - it
+ * will first invoke
+ * {@link LuCI.view.handleSave view.handleSave()} and then
+ * call {@link ui#changes#apply ui.changes.apply()} to start the
+ * modal config apply and page reload flow.
+ *
+ * Views not using `Map` instances or requiring other special
+ * logic should overwrite `handleSaveApply()` with a custom
+ * implementation.
+ *
+ * To disable the `Save & Apply` page footer button, views
+ * extending this base class should overwrite the
+ * `handleSaveApply` function with `null`.
+ *
+ * The invocation of this function is wrapped by
+ * `Promise.resolve()` so it may return Promises if needed.
+ *
+ * @instance
+ * @memberof LuCI.view
+ * @param {Event} ev
+ * The DOM event that triggered the function.
+ *
+ * @returns {*|Promise<*>}
+ * Any return values of this function are discarded, but
+ * passed through `Promise.resolve()` to ensure that any
+ * returned promise runs to completion before the button
+ * is reenabled.
+ */
+ handleSaveApply: function(ev, mode) {
+ return this.handleSave(ev).then(function() {
+ classes.ui.changes.apply(mode == '0');
+ });
+ },
- sysFeatures = features;
+ /**
+ * The handleReset function is invoked when the user clicks
+ * the `Reset` button in the page action footer.
+ *
+ * The default implementation should be sufficient for most
+ * views using {@link form#Map form.Map()} based forms - it
+ * will iterate all forms present in the view and invoke
+ * the {@link form#Map#save Map.reset()} method on each form.
+ *
+ * Views not using `Map` instances or requiring other special
+ * logic should overwrite `handleReset()` with a custom
+ * implementation.
+ *
+ * To disable the `Reset` page footer button, views extending
+ * this base class should overwrite the `handleReset` function
+ * with `null`.
+ *
+ * The invocation of this function is wrapped by
+ * `Promise.resolve()` so it may return Promises if needed.
+ *
+ * @instance
+ * @memberof LuCI.view
+ * @param {Event} ev
+ * The DOM event that triggered the function.
+ *
+ * @returns {*|Promise<*>}
+ * Any return values of this function are discarded, but
+ * passed through `Promise.resolve()` to ensure that any
+ * returned promise runs to completion before the button
+ * is reenabled.
+ */
+ handleReset: function(ev) {
+ var tasks = [];
- return features;
+ document.getElementById('maincontent')
+ .querySelectorAll('.cbi-map').forEach(function(map) {
+ tasks.push(DOM.callClassMethod(map, 'reset'));
});
- }
- return Promise.resolve(sysFeatures);
+ return Promise.all(tasks);
},
/**
- * Test whether a particular system feature is available, such as
- * hostapd SAE support or an installed firewall. The features are
- * queried once at the beginning of the LuCI session and cached in
- * `SessionStorage` throughout the lifetime of the associated tab or
- * browser window.
- *
- * @instance
- * @memberof LuCI
+ * Renders a standard page action footer if any of the
+ * `handleSave()`, `handleSaveApply()` or `handleReset()`
+ * functions are defined.
*
- * @param {string} feature
- * The feature to test. For detailed list of known feature flags,
- * see `/modules/luci-base/root/usr/libexec/rpcd/luci`.
+ * The default implementation should be sufficient for most
+ * views - it will render a standard page footer with action
+ * buttons labeled `Save`, `Save & Apply` and `Reset`
+ * triggering the `handleSave()`, `handleSaveApply()` and
+ * `handleReset()` functions respectively.
*
- * @param {string} [subfeature]
- * Some feature classes like `hostapd` provide sub-feature flags,
- * such as `sae` or `11w` support. The `subfeature` argument can
- * be used to query these.
+ * When any of these `handle*()` functions is overwritten
+ * with `null` by a view extending this class, the
+ * corresponding button will not be rendered.
*
- * @return {boolean|null}
- * Return `true` if the queried feature (and sub-feature) is available
- * or `false` if the requested feature isn't present or known.
- * Return `null` when a sub-feature was queried for a feature which
- * has no sub-features.
+ * @instance
+ * @memberof LuCI.view
+ * @returns {DocumentFragment}
+ * Returns a `DocumentFragment` containing the footer bar
+ * with buttons for each corresponding `handle*()` action
+ * or an empty `DocumentFragment` if all three `handle*()`
+ * methods are overwritten with `null`.
*/
- hasSystemFeature: function() {
- var ft = sysFeatures[arguments[0]];
-
- if (arguments.length == 2)
- return this.isObject(ft) ? ft[arguments[1]] : null;
-
- return (ft != null && ft != false);
- },
-
- /* private */
- notifySessionExpiry: function() {
- Poll.stop();
-
- L.ui.showModal(_('Session expired'), [
- E('div', { class: 'alert-message warning' },
- _('A new login is required since the authentication session expired.')),
- E('div', { class: 'right' },
- E('div', {
- class: 'btn primary',
- click: function() {
- var loc = window.location;
- window.location = loc.protocol + '//' + loc.host + loc.pathname + loc.search;
- }
- }, _('To login…')))
- ]);
+ addFooter: function() {
+ var footer = E([]),
+ vp = document.getElementById('view'),
+ hasmap = false,
+ readonly = true;
+
+ vp.querySelectorAll('.cbi-map').forEach(function(map) {
+ var m = DOM.findClassInstance(map);
+ if (m) {
+ hasmap = true;
+
+ if (!m.readonly)
+ readonly = false;
+ }
+ });
- L.raise('SessionError', 'Login session is expired');
- },
+ if (!hasmap)
+ readonly = !LuCI.prototype.hasViewPermission();
+
+ var saveApplyBtn = this.handleSaveApply ? new classes.ui.ComboButton('0', {
+ 0: [ _('Save & Apply') ],
+ 1: [ _('Apply unchecked') ]
+ }, {
+ classes: {
+ 0: 'btn cbi-button cbi-button-apply important',
+ 1: 'btn cbi-button cbi-button-negative important'
+ },
+ click: classes.ui.createHandlerFn(this, 'handleSaveApply'),
+ disabled: readonly || null
+ }).render() : E([]);
+
+ if (this.handleSaveApply || this.handleSave || this.handleReset) {
+ footer.appendChild(E('div', { 'class': 'cbi-page-actions control-group' }, [
+ saveApplyBtn, ' ',
+ this.handleSave ? E('button', {
+ 'class': 'cbi-button cbi-button-save',
+ 'click': classes.ui.createHandlerFn(this, 'handleSave'),
+ 'disabled': readonly || null
+ }, [ _('Save') ]) : '', ' ',
+ this.handleReset ? E('button', {
+ 'class': 'cbi-button cbi-button-reset',
+ 'click': classes.ui.createHandlerFn(this, 'handleReset'),
+ 'disabled': readonly || null
+ }, [ _('Reset') ]) : ''
+ ]));
+ }
- /* private */
- setupDOM: function(res) {
- var domEv = res[0],
- uiClass = res[1],
- rpcClass = res[2],
- formClass = res[3],
- rpcBaseURL = res[4];
+ return footer;
+ }
+ });
- rpcClass.setBaseURL(rpcBaseURL);
- rpcClass.addInterceptor(function(msg, req) {
- if (!L.isObject(msg) || !L.isObject(msg.error) || msg.error.code != -32002)
- return;
+ var dummyElem = null,
+ domParser = null,
+ originalCBIInit = null,
+ rpcBaseURL = null,
+ sysFeatures = null,
+ preloadClasses = null;
+
+ /* "preload" builtin classes to make the available via require */
+ var classes = {
+ baseclass: Class,
+ dom: DOM,
+ poll: Poll,
+ request: Request,
+ session: Session,
+ view: View
+ };
- if (!L.isObject(req) || (req.object == 'session' && req.method == 'access'))
- return;
+ var LuCI = Class.extend(/** @lends LuCI.prototype */ {
+ __name__: 'LuCI',
+ __init__: function(setenv) {
- return rpcClass.declare({
- 'object': 'session',
- 'method': 'access',
- 'params': [ 'scope', 'object', 'function' ],
- 'expect': { access: true }
- })('uci', 'luci', 'read').catch(L.notifySessionExpiry);
+ document.querySelectorAll('script[src*="/luci.js"]').forEach(function(s) {
+ if (setenv.base_url == null || setenv.base_url == '') {
+ var m = (s.getAttribute('src') || '').match(/^(.*)\/luci\.js(?:\?v=([^?]+))?$/);
+ if (m) {
+ setenv.base_url = m[1];
+ setenv.resource_version = m[2];
+ }
+ }
});
- Request.addInterceptor(function(res) {
- var isDenied = false;
+ if (setenv.base_url == null)
+ this.error('InternalError', 'Cannot find url of luci.js');
- if (res.status == 403 && res.headers.get('X-LuCI-Login-Required') == 'yes')
- isDenied = true;
+ setenv.cgi_base = setenv.scriptname.replace(/\/[^\/]+$/, '');
- if (!isDenied)
- return;
+ Object.assign(env, setenv);
- L.notifySessionExpiry();
+ var domReady = new Promise(function(resolveFn, rejectFn) {
+ document.addEventListener('DOMContentLoaded', resolveFn);
});
- return this.probeSystemFeatures().finally(this.initDOM);
- },
+ Promise.all([
+ domReady,
+ this.require('ui'),
+ this.require('rpc'),
+ this.require('form'),
+ this.probeRPCBaseURL()
+ ]).then(this.setupDOM.bind(this)).catch(this.error);
- /* private */
- initDOM: function() {
- originalCBIInit();
- Poll.start();
- document.dispatchEvent(new CustomEvent('luci-loaded'));
+ originalCBIInit = window.cbi_init;
+ window.cbi_init = function() {};
},
/**
- * The `env` object holds environment settings used by LuCI, such
- * as request timeouts, base URLs etc.
+ * Captures the current stack trace and throws an error of the
+ * specified type as a new exception. Also logs the exception as
+ * error to the debug console if it is available.
*
* @instance
* @memberof LuCI
- */
- env: {},
-
- /**
- * Construct a relative URL path from the given prefix and parts.
- * The resulting URL is guaranteed to only contain the characters
- * `a-z`, `A-Z`, `0-9`, `_`, `.`, `%`, `,`, `;`, and `-` as well
- * as `/` for the path separator.
*
- * @instance
- * @memberof LuCI
+ * @param {Error|string} [type=Error]
+ * Either a string specifying the type of the error to throw or an
+ * existing `Error` instance to copy.
*
- * @param {string} [prefix]
- * The prefix to join the given parts with. If the `prefix` is
- * omitted, it defaults to an empty string.
+ * @param {string} [fmt=Unspecified error]
+ * A format string which is used to form the error message, together
+ * with all subsequent optional arguments.
*
- * @param {string[]} [parts]
- * An array of parts to join into an URL path. Parts may contain
- * slashes and any of the other characters mentioned above.
+ * @param {...*} [args]
+ * Zero or more variable arguments to the supplied format string.
*
- * @return {string}
- * Return the joined URL path.
+ * @throws {Error}
+ * Throws the created error object with the captured stack trace
+ * appended to the message and the type set to the given type
+ * argument or copied from the given error instance.
*/
- path: function(prefix, parts) {
- var url = [ prefix || '' ];
+ raise: function(type, fmt /*, ...*/) {
+ var e = null,
+ msg = fmt ? String.prototype.format.apply(fmt, this.varargs(arguments, 2)) : null,
+ stack = null;
- for (var i = 0; i < parts.length; i++)
- if (/^(?:[a-zA-Z0-9_.%,;-]+\/)*[a-zA-Z0-9_.%,;-]+$/.test(parts[i]))
- url.push('/', parts[i]);
+ if (type instanceof Error) {
+ e = type;
- if (url.length === 1)
- url.push('/');
+ if (msg)
+ e.message = msg + ': ' + e.message;
+ }
+ else {
+ try { throw new Error('stacktrace') }
+ catch (e2) { stack = (e2.stack || '').split(/\n/) }
- return url.join('');
+ e = new (window[type || 'Error'] || Error)(msg || 'Unspecified error');
+ e.name = type || 'Error';
+ }
+
+ stack = (stack || []).map(function(frame) {
+ frame = frame.replace(/(.*?)@(.+):(\d+):(\d+)/g, 'at $1 ($2:$3:$4)').trim();
+ return frame ? ' ' + frame : '';
+ });
+
+ if (!/^ at /.test(stack[0]))
+ stack.shift();
+
+ if (/\braise /.test(stack[0]))
+ stack.shift();
+
+ if (/\berror /.test(stack[0]))
+ stack.shift();
+
+ if (stack.length)
+ e.message += '\n' + stack.join('\n');
+
+ if (window.console && console.debug)
+ console.debug(e);
+
+ throw e;
},
/**
- * Construct an URL pathrelative to the script path of the server
- * side LuCI application (usually `/cgi-bin/luci`).
- *
- * The resulting URL is guaranteed to only contain the characters
- * `a-z`, `A-Z`, `0-9`, `_`, `.`, `%`, `,`, `;`, and `-` as well
- * as `/` for the path separator.
+ * A wrapper around {@link LuCI#raise raise()} which also renders
+ * the error either as modal overlay when `ui.js` is already loaed
+ * or directly into the view body.
*
* @instance
* @memberof LuCI
*
- * @param {string[]} [parts]
- * An array of parts to join into an URL path. Parts may contain
- * slashes and any of the other characters mentioned above.
+ * @param {Error|string} [type=Error]
+ * Either a string specifying the type of the error to throw or an
+ * existing `Error` instance to copy.
*
- * @return {string}
- * Returns the resulting URL path.
+ * @param {string} [fmt=Unspecified error]
+ * A format string which is used to form the error message, together
+ * with all subsequent optional arguments.
+ *
+ * @param {...*} [args]
+ * Zero or more variable arguments to the supplied format string.
+ *
+ * @throws {Error}
+ * Throws the created error object with the captured stack trace
+ * appended to the message and the type set to the given type
+ * argument or copied from the given error instance.
*/
- url: function() {
- return this.path(this.env.scriptname, arguments);
+ error: function(type, fmt /*, ...*/) {
+ try {
+ LuCI.prototype.raise.apply(LuCI.prototype,
+ Array.prototype.slice.call(arguments));
+ }
+ catch (e) {
+ if (!e.reported) {
+ if (classes.ui)
+ classes.ui.addNotification(e.name || _('Runtime error'),
+ E('pre', {}, e.message), 'danger');
+ else
+ DOM.content(document.querySelector('#maincontent'),
+ E('pre', { 'class': 'alert-message error' }, e.message));
+
+ e.reported = true;
+ }
+
+ throw e;
+ }
},
/**
- * Construct an URL path relative to the global static resource path
- * of the LuCI ui (usually `/luci-static/resources`).
- *
- * The resulting URL is guaranteed to only contain the characters
- * `a-z`, `A-Z`, `0-9`, `_`, `.`, `%`, `,`, `;`, and `-` as well
- * as `/` for the path separator.
+ * Return a bound function using the given `self` as `this` context
+ * and any further arguments as parameters to the bound function.
*
* @instance
* @memberof LuCI
*
- * @param {string[]} [parts]
- * An array of parts to join into an URL path. Parts may contain
- * slashes and any of the other characters mentioned above.
+ * @param {function} fn
+ * The function to bind.
*
- * @return {string}
- * Returns the resulting URL path.
+ * @param {*} self
+ * The value to bind as `this` context to the specified function.
+ *
+ * @param {...*} [args]
+ * Zero or more variable arguments which are bound to the function
+ * as parameters.
+ *
+ * @returns {function}
+ * Returns the bound function.
*/
- resource: function() {
- return this.path(this.env.resource, arguments);
+ bind: function(fn, self /*, ... */) {
+ return Function.prototype.bind.apply(fn, this.varargs(arguments, 2, self));
},
/**
- * Return the complete URL path to the current view.
+ * Load an additional LuCI JavaScript class and its dependencies,
+ * instantiate it and return the resulting class instance. Each
+ * class is only loaded once. Subsequent attempts to load the same
+ * class will return the already instantiated class.
*
* @instance
* @memberof LuCI
*
- * @return {string}
- * Returns the URL path to the current view.
- */
- location: function() {
- return this.path(this.env.scriptname, this.env.requestpath);
- },
-
-
- /**
- * Tests whether the passed argument is a JavaScript object.
- * This function is meant to be an object counterpart to the
- * standard `Array.isArray()` function.
- *
- * @instance
- * @memberof LuCI
- *
- * @param {*} [val]
- * The value to test
- *
- * @return {boolean}
- * Returns `true` if the given value is of type object and
- * not `null`, else returns `false`.
- */
- isObject: function(val) {
- return (val != null && typeof(val) == 'object');
- },
-
- /**
- * Return an array of sorted object keys, optionally sorted by
- * a different key or a different sorting mode.
+ * @param {string} name
+ * The name of the class to load in dotted notation. Dots will
+ * be replaced by spaces and joined with the runtime-determined
+ * base URL of LuCI.js to form an absolute URL to load the class
+ * file from.
*
- * @instance
- * @memberof LuCI
+ * @throws {DependencyError}
+ * Throws a `DependencyError` when the class to load includes
+ * circular dependencies.
*
- * @param {object} obj
- * The object to extract the keys from. If the given value is
- * not an object, the function will return an empty array.
+ * @throws {NetworkError}
+ * Throws `NetworkError` when the underlying {@link LuCI.request}
+ * call failed.
*
- * @param {string} [key]
- * Specifies the key to order by. This is mainly useful for
- * nested objects of objects or objects of arrays when sorting
- * shall not be performed by the primary object keys but by
- * some other key pointing to a value within the nested values.
+ * @throws {SyntaxError}
+ * Throws `SyntaxError` when the loaded class file code cannot
+ * be interpreted by `eval`.
*
- * @param {string} [sortmode]
- * May be either `addr` or `num` to override the natural
- * lexicographic sorting with a sorting suitable for IP/MAC style
- * addresses or numeric values respectively.
+ * @throws {TypeError}
+ * Throws `TypeError` when the class file could be loaded and
+ * interpreted, but when invoking its code did not yield a valid
+ * class instance.
*
- * @return {string[]}
- * Returns an array containing the sorted keys of the given object.
+ * @returns {Promise<LuCI.baseclass>}
+ * Returns the instantiated class.
*/
- sortedKeys: function(obj, key, sortmode) {
- if (obj == null || typeof(obj) != 'object')
- return [];
+ require: function(name, from) {
+ var L = this, url = null, from = from || [];
- return Object.keys(obj).map(function(e) {
- var v = (key != null) ? obj[e][key] : e;
+ /* Class already loaded */
+ if (classes[name] != null) {
+ /* Circular dependency */
+ if (from.indexOf(name) != -1)
+ LuCI.prototype.raise('DependencyError',
+ 'Circular dependency: class "%s" depends on "%s"',
+ name, from.join('" which depends on "'));
- switch (sortmode) {
- case 'addr':
- v = (v != null) ? v.replace(/(?:^|[.:])([0-9a-fA-F]{1,4})/g,
- function(m0, m1) { return ('000' + m1.toLowerCase()).substr(-4) }) : null;
- break;
+ return Promise.resolve(classes[name]);
+ }
- case 'num':
- v = (v != null) ? +v : null;
- break;
+ url = '%s/%s.js%s'.format(env.base_url, name.replace(/\./g, '/'), (env.resource_version ? '?v=' + env.resource_version : ''));
+ from = [ name ].concat(from);
+
+ var compileClass = function(res) {
+ if (!res.ok)
+ LuCI.prototype.raise('NetworkError',
+ 'HTTP error %d while loading class file "%s"', res.status, url);
+
+ var source = res.text(),
+ requirematch = /^require[ \t]+(\S+)(?:[ \t]+as[ \t]+([a-zA-Z_]\S*))?$/,
+ strictmatch = /^use[ \t]+strict$/,
+ depends = [],
+ args = '';
+
+ /* find require statements in source */
+ for (var i = 0, off = -1, quote = -1, esc = false; i < source.length; i++) {
+ var chr = source.charCodeAt(i);
+
+ if (esc) {
+ esc = false;
+ }
+ else if (chr == 92) {
+ esc = true;
+ }
+ else if (chr == quote) {
+ var s = source.substring(off, i),
+ m = requirematch.exec(s);
+
+ if (m) {
+ var dep = m[1], as = m[2] || dep.replace(/[^a-zA-Z0-9_]/g, '_');
+ depends.push(LuCI.prototype.require(dep, from));
+ args += ', ' + as;
+ }
+ else if (!strictmatch.exec(s)) {
+ break;
+ }
+
+ off = -1;
+ quote = -1;
+ }
+ else if (quote == -1 && (chr == 34 || chr == 39)) {
+ off = i + 1;
+ quote = chr;
+ }
}
- return [ e, v ];
- }).filter(function(e) {
- return (e[1] != null);
- }).sort(function(a, b) {
- return (a[1] > b[1]);
- }).map(function(e) {
- return e[0];
- });
+ /* load dependencies and instantiate class */
+ return Promise.all(depends).then(function(instances) {
+ var _factory, _class;
+
+ try {
+ _factory = eval(
+ '(function(window, document, L%s) { %s })\n\n//# sourceURL=%s\n'
+ .format(args, source, res.url));
+ }
+ catch (error) {
+ LuCI.prototype.raise('SyntaxError', '%s\n in %s:%s',
+ error.message, res.url, error.lineNumber || '?');
+ }
+
+ _factory.displayName = toCamelCase(name + 'ClassFactory');
+ _class = _factory.apply(_factory, [window, document, L].concat(instances));
+
+ if (!Class.isSubclass(_class))
+ LuCI.prototype.error('TypeError', '"%s" factory yields invalid constructor', name);
+
+ if (_class.displayName == 'AnonymousClass')
+ _class.displayName = toCamelCase(name + 'Class');
+
+ var ptr = Object.getPrototypeOf(L),
+ parts = name.split(/\./),
+ instance = new _class();
+
+ for (var i = 0; ptr && i < parts.length - 1; i++)
+ ptr = ptr[parts[i]];
+
+ if (ptr)
+ ptr[parts[i]] = instance;
+
+ classes[name] = instance;
+
+ return instance;
+ });
+ };
+
+ /* Request class file */
+ classes[name] = Request.get(url, { cache: true }).then(compileClass);
+
+ return classes[name];
},
- /**
- * Converts the given value to an array. If the given value is of
- * type array, it is returned as-is, values of type object are
- * returned as one-element array containing the object, empty
- * strings and `null` values are returned as empty array, all other
- * values are converted using `String()`, trimmed, split on white
- * space and returned as array.
- *
- * @instance
- * @memberof LuCI
- *
- * @param {*} val
- * The value to convert into an array.
- *
- * @return {Array<*>}
- * Returns the resulting array.
- */
- toArray: function(val) {
- if (val == null)
- return [];
- else if (Array.isArray(val))
- return val;
- else if (typeof(val) == 'object')
- return [ val ];
+ /* DOM setup */
+ probeRPCBaseURL: function() {
+ if (rpcBaseURL == null)
+ rpcBaseURL = Session.getLocalData('rpcBaseURL');
- var s = String(val).trim();
+ if (rpcBaseURL == null) {
+ var rpcFallbackURL = this.url('admin/ubus');
- if (s == '')
- return [];
+ rpcBaseURL = Request.get(env.ubuspath).then(function(res) {
+ return (rpcBaseURL = (res.status == 400) ? env.ubuspath : rpcFallbackURL);
+ }, function() {
+ return (rpcBaseURL = rpcFallbackURL);
+ }).then(function(url) {
+ Session.setLocalData('rpcBaseURL', url);
+ return url;
+ });
+ }
- return s.split(/\s+/);
+ return Promise.resolve(rpcBaseURL);
+ },
+
+ probeSystemFeatures: function() {
+ if (sysFeatures == null)
+ sysFeatures = Session.getLocalData('features');
+
+ if (!this.isObject(sysFeatures)) {
+ sysFeatures = classes.rpc.declare({
+ object: 'luci',
+ method: 'getFeatures',
+ expect: { '': {} }
+ })().then(function(features) {
+ Session.setLocalData('features', features);
+ sysFeatures = features;
+
+ return features;
+ });
+ }
+
+ return Promise.resolve(sysFeatures);
+ },
+
+ probePreloadClasses: function() {
+ if (preloadClasses == null)
+ preloadClasses = Session.getLocalData('preload');
+
+ if (!Array.isArray(preloadClasses)) {
+ preloadClasses = this.resolveDefault(classes.rpc.declare({
+ object: 'file',
+ method: 'list',
+ params: [ 'path' ],
+ expect: { 'entries': [] }
+ })(this.fspath(this.resource('preload'))), []).then(function(entries) {
+ var classes = [];
+
+ for (var i = 0; i < entries.length; i++) {
+ if (entries[i].type != 'file')
+ continue;
+
+ var m = entries[i].name.match(/(.+)\.js$/);
+
+ if (m)
+ classes.push('preload.%s'.format(m[1]));
+ }
+
+ Session.setLocalData('preload', classes);
+ preloadClasses = classes;
+
+ return classes;
+ });
+ }
+
+ return Promise.resolve(preloadClasses);
},
/**
- * Returns a promise resolving with either the given value or or with
- * the given default in case the input value is a rejecting promise.
+ * Test whether a particular system feature is available, such as
+ * hostapd SAE support or an installed firewall. The features are
+ * queried once at the beginning of the LuCI session and cached in
+ * `SessionStorage` throughout the lifetime of the associated tab or
+ * browser window.
*
* @instance
* @memberof LuCI
*
- * @param {*} value
- * The value to resolve the promise with.
+ * @param {string} feature
+ * The feature to test. For detailed list of known feature flags,
+ * see `/modules/luci-base/root/usr/libexec/rpcd/luci`.
*
- * @param {*} defvalue
- * The default value to resolve the promise with in case the given
- * input value is a rejecting promise.
+ * @param {string} [subfeature]
+ * Some feature classes like `hostapd` provide sub-feature flags,
+ * such as `sae` or `11w` support. The `subfeature` argument can
+ * be used to query these.
*
- * @returns {Promise<*>}
- * Returns a new promise resolving either to the given input value or
- * to the given default value on error.
+ * @return {boolean|null}
+ * Return `true` if the queried feature (and sub-feature) is available
+ * or `false` if the requested feature isn't present or known.
+ * Return `null` when a sub-feature was queried for a feature which
+ * has no sub-features.
*/
- resolveDefault: function(value, defvalue) {
- return Promise.resolve(value).catch(function() { return defvalue });
+ hasSystemFeature: function() {
+ var ft = sysFeatures[arguments[0]];
+
+ if (arguments.length == 2)
+ return this.isObject(ft) ? ft[arguments[1]] : null;
+
+ return (ft != null && ft != false);
+ },
+
+ /* private */
+ notifySessionExpiry: function() {
+ Poll.stop();
+
+ classes.ui.showModal(_('Session expired'), [
+ E('div', { class: 'alert-message warning' },
+ _('A new login is required since the authentication session expired.')),
+ E('div', { class: 'right' },
+ E('div', {
+ class: 'btn primary',
+ click: function() {
+ var loc = window.location;
+ window.location = loc.protocol + '//' + loc.host + loc.pathname + loc.search;
+ }
+ }, _('To login…')))
+ ]);
+
+ LuCI.prototype.raise('SessionError', 'Login session is expired');
+ },
+
+ /* private */
+ setupDOM: function(res) {
+ var domEv = res[0],
+ uiClass = res[1],
+ rpcClass = res[2],
+ formClass = res[3],
+ rpcBaseURL = res[4];
+
+ rpcClass.setBaseURL(rpcBaseURL);
+
+ rpcClass.addInterceptor(function(msg, req) {
+ if (!LuCI.prototype.isObject(msg) ||
+ !LuCI.prototype.isObject(msg.error) ||
+ msg.error.code != -32002)
+ return;
+
+ if (!LuCI.prototype.isObject(req) ||
+ (req.object == 'session' && req.method == 'access'))
+ return;
+
+ return rpcClass.declare({
+ 'object': 'session',
+ 'method': 'access',
+ 'params': [ 'scope', 'object', 'function' ],
+ 'expect': { access: true }
+ })('uci', 'luci', 'read').catch(LuCI.prototype.notifySessionExpiry);
+ });
+
+ Request.addInterceptor(function(res) {
+ var isDenied = false;
+
+ if (res.status == 403 && res.headers.get('X-LuCI-Login-Required') == 'yes')
+ isDenied = true;
+
+ if (!isDenied)
+ return;
+
+ LuCI.prototype.notifySessionExpiry();
+ });
+
+ document.addEventListener('poll-start', function(ev) {
+ uiClass.showIndicator('poll-status', _('Refreshing'), function(ev) {
+ Request.poll.active() ? Request.poll.stop() : Request.poll.start();
+ });
+ });
+
+ document.addEventListener('poll-stop', function(ev) {
+ uiClass.showIndicator('poll-status', _('Paused'), null, 'inactive');
+ });
+
+ return Promise.all([
+ this.probeSystemFeatures(),
+ this.probePreloadClasses()
+ ]).finally(LuCI.prototype.bind(function() {
+ var tasks = [];
+
+ if (Array.isArray(preloadClasses))
+ for (var i = 0; i < preloadClasses.length; i++)
+ tasks.push(this.require(preloadClasses[i]));
+
+ return Promise.all(tasks);
+ }, this)).finally(this.initDOM);
+ },
+
+ /* private */
+ initDOM: function() {
+ originalCBIInit();
+ Poll.start();
+ document.dispatchEvent(new CustomEvent('luci-loaded'));
},
/**
- * The request callback function is invoked whenever an HTTP
- * reply to a request made using the `L.get()`, `L.post()` or
- * `L.poll()` function is timed out or received successfully.
+ * The `env` object holds environment settings used by LuCI, such
+ * as request timeouts, base URLs etc.
*
* @instance
* @memberof LuCI
- *
- * @callback LuCI.requestCallbackFn
- * @param {XMLHTTPRequest} xhr
- * The XMLHTTPRequest instance used to make the request.
- *
- * @param {*} data
- * The response JSON if the response could be parsed as such,
- * else `null`.
- *
- * @param {number} duration
- * The total duration of the request in milliseconds.
*/
+ env: env,
/**
- * Issues a GET request to the given url and invokes the specified
- * callback function. The function is a wrapper around
- * {@link LuCI.Request#request Request.request()}.
+ * Construct an absolute filesystem path relative to the server
+ * document root.
*
- * @deprecated
* @instance
* @memberof LuCI
*
- * @param {string} url
- * The URL to request.
- *
- * @param {Object<string, string>} [args]
- * Additional query string arguments to append to the URL.
- *
- * @param {LuCI.requestCallbackFn} cb
- * The callback function to invoke when the request finishes.
+ * @param {...string} [parts]
+ * An array of parts to join into a path.
*
- * @return {Promise<null>}
- * Returns a promise resolving to `null` when concluded.
+ * @return {string}
+ * Return the joined path.
*/
- get: function(url, args, cb) {
- return this.poll(null, url, args, cb, false);
+ fspath: function(/* ... */) {
+ var path = env.documentroot;
+
+ for (var i = 0; i < arguments.length; i++)
+ path += '/' + arguments[i];
+
+ var p = path.replace(/\/+$/, '').replace(/\/+/g, '/').split(/\//),
+ res = [];
+
+ for (var i = 0; i < p.length; i++)
+ if (p[i] == '..')
+ res.pop();
+ else if (p[i] != '.')
+ res.push(p[i]);
+
+ return res.join('/');
},
/**
- * Issues a POST request to the given url and invokes the specified
- * callback function. The function is a wrapper around
- * {@link LuCI.Request#request Request.request()}. The request is
- * sent using `application/x-www-form-urlencoded` encoding and will
- * contain a field `token` with the current value of `LuCI.env.token`
- * by default.
+ * Construct a relative URL path from the given prefix and parts.
+ * The resulting URL is guaranteed to only contain the characters
+ * `a-z`, `A-Z`, `0-9`, `_`, `.`, `%`, `,`, `;`, and `-` as well
+ * as `/` for the path separator.
*
- * @deprecated
* @instance
* @memberof LuCI
*
- * @param {string} url
- * The URL to request.
- *
- * @param {Object<string, string>} [args]
- * Additional post arguments to append to the request body.
+ * @param {string} [prefix]
+ * The prefix to join the given parts with. If the `prefix` is
+ * omitted, it defaults to an empty string.
*
- * @param {LuCI.requestCallbackFn} cb
- * The callback function to invoke when the request finishes.
+ * @param {string[]} [parts]
+ * An array of parts to join into an URL path. Parts may contain
+ * slashes and any of the other characters mentioned above.
*
- * @return {Promise<null>}
- * Returns a promise resolving to `null` when concluded.
+ * @return {string}
+ * Return the joined URL path.
*/
- post: function(url, args, cb) {
- return this.poll(null, url, args, cb, true);
+ path: function(prefix, parts) {
+ var url = [ prefix || '' ];
+
+ for (var i = 0; i < parts.length; i++)
+ if (/^(?:[a-zA-Z0-9_.%,;-]+\/)*[a-zA-Z0-9_.%,;-]+$/.test(parts[i]))
+ url.push('/', parts[i]);
+
+ if (url.length === 1)
+ url.push('/');
+
+ return url.join('');
},
/**
- * Register a polling HTTP request that invokes the specified
- * callback function. The function is a wrapper around
- * {@link LuCI.Request.poll#add Request.poll.add()}.
+ * Construct an URL pathrelative to the script path of the server
+ * side LuCI application (usually `/cgi-bin/luci`).
+ *
+ * The resulting URL is guaranteed to only contain the characters
+ * `a-z`, `A-Z`, `0-9`, `_`, `.`, `%`, `,`, `;`, and `-` as well
+ * as `/` for the path separator.
*
- * @deprecated
* @instance
* @memberof LuCI
*
- * @param {number} interval
- * The poll interval to use. If set to a value less than or equal
- * to `0`, it will default to the global poll interval configured
- * in `LuCI.env.pollinterval`.
- *
- * @param {string} url
- * The URL to request.
- *
- * @param {Object<string, string>} [args]
- * Specifies additional arguments for the request. For GET requests,
- * the arguments are appended to the URL as query string, for POST
- * requests, they'll be added to the request body.
- *
- * @param {LuCI.requestCallbackFn} cb
- * The callback function to invoke whenever a request finishes.
- *
- * @param {boolean} [post=false]
- * When set to `false` or not specified, poll requests will be made
- * using the GET method. When set to `true`, POST requests will be
- * issued. In case of POST requests, the request body will contain
- * an argument `token` with the current value of `LuCI.env.token` by
- * default, regardless of the parameters specified with `args`.
+ * @param {string[]} [parts]
+ * An array of parts to join into an URL path. Parts may contain
+ * slashes and any of the other characters mentioned above.
*
- * @return {function}
- * Returns the internally created function that has been passed to
- * {@link LuCI.Request.poll#add Request.poll.add()}. This value can
- * be passed to {@link LuCI.Poll.remove Poll.remove()} to remove the
- * polling request.
+ * @return {string}
+ * Returns the resulting URL path.
*/
- poll: function(interval, url, args, cb, post) {
- if (interval !== null && interval <= 0)
- interval = this.env.pollinterval;
-
- var data = post ? { token: this.env.token } : null,
- method = post ? 'POST' : 'GET';
-
- if (!/^(?:\/|\S+:\/\/)/.test(url))
- url = this.url(url);
-
- if (args != null)
- data = Object.assign(data || {}, args);
-
- if (interval !== null)
- return Request.poll.add(interval, url, { method: method, query: data }, cb);
- else
- return Request.request(url, { method: method, query: data })
- .then(function(res) {
- var json = null;
- if (/^application\/json\b/.test(res.headers.get('Content-Type')))
- try { json = res.json() } catch(e) {}
- cb(res.xhr, json, res.duration);
- });
+ url: function() {
+ return this.path(env.scriptname, arguments);
},
/**
- * Deprecated wrapper around {@link LuCI.Poll.remove Poll.remove()}.
+ * Construct an URL path relative to the global static resource path
+ * of the LuCI ui (usually `/luci-static/resources`).
+ *
+ * The resulting URL is guaranteed to only contain the characters
+ * `a-z`, `A-Z`, `0-9`, `_`, `.`, `%`, `,`, `;`, and `-` as well
+ * as `/` for the path separator.
*
- * @deprecated
* @instance
* @memberof LuCI
*
- * @param {function} entry
- * The polling function to remove.
+ * @param {string[]} [parts]
+ * An array of parts to join into an URL path. Parts may contain
+ * slashes and any of the other characters mentioned above.
*
- * @return {boolean}
- * Returns `true` when the function has been removed or `false` if
- * it could not be found.
+ * @return {string}
+ * Returns the resulting URL path.
*/
- stop: function(entry) { return Poll.remove(entry) },
+ resource: function() {
+ return this.path(env.resource, arguments);
+ },
/**
- * Deprecated wrapper around {@link LuCI.Poll.stop Poll.stop()}.
+ * Construct an URL path relative to the media resource path of the
+ * LuCI ui (usually `/luci-static/$theme_name`).
+ *
+ * The resulting URL is guaranteed to only contain the characters
+ * `a-z`, `A-Z`, `0-9`, `_`, `.`, `%`, `,`, `;`, and `-` as well
+ * as `/` for the path separator.
*
- * @deprecated
* @instance
* @memberof LuCI
*
- * @return {boolean}
- * Returns `true` when the polling loop has been stopped or `false`
- * when it didn't run to begin with.
+ * @param {string[]} [parts]
+ * An array of parts to join into an URL path. Parts may contain
+ * slashes and any of the other characters mentioned above.
+ *
+ * @return {string}
+ * Returns the resulting URL path.
*/
- halt: function() { return Poll.stop() },
+ media: function() {
+ return this.path(env.media, arguments);
+ },
/**
- * Deprecated wrapper around {@link LuCI.Poll.start Poll.start()}.
+ * Return the complete URL path to the current view.
*
- * @deprecated
* @instance
* @memberof LuCI
*
- * @return {boolean}
- * Returns `true` when the polling loop has been started or `false`
- * when it was already running.
+ * @return {string}
+ * Returns the URL path to the current view.
*/
- run: function() { return Poll.start() },
+ location: function() {
+ return this.path(env.scriptname, env.requestpath);
+ },
/**
- * @class
+ * Tests whether the passed argument is a JavaScript object.
+ * This function is meant to be an object counterpart to the
+ * standard `Array.isArray()` function.
+ *
+ * @instance
* @memberof LuCI
- * @hideconstructor
- * @classdesc
*
- * The `dom` class provides convenience method for creating and
- * manipulating DOM elements.
+ * @param {*} [val]
+ * The value to test
+ *
+ * @return {boolean}
+ * Returns `true` if the given value is of type object and
+ * not `null`, else returns `false`.
*/
- dom: Class.singleton(/* @lends LuCI.dom.prototype */ {
- __name__: 'LuCI.DOM',
+ isObject: function(val) {
+ return (val != null && typeof(val) == 'object');
+ },
- /**
- * Tests whether the given argument is a valid DOM `Node`.
- *
- * @instance
- * @memberof LuCI.dom
- * @param {*} e
- * The value to test.
- *
- * @returns {boolean}
- * Returns `true` if the value is a DOM `Node`, else `false`.
- */
- elem: function(e) {
- return (e != null && typeof(e) == 'object' && 'nodeType' in e);
- },
+ /**
+ * Return an array of sorted object keys, optionally sorted by
+ * a different key or a different sorting mode.
+ *
+ * @instance
+ * @memberof LuCI
+ *
+ * @param {object} obj
+ * The object to extract the keys from. If the given value is
+ * not an object, the function will return an empty array.
+ *
+ * @param {string} [key]
+ * Specifies the key to order by. This is mainly useful for
+ * nested objects of objects or objects of arrays when sorting
+ * shall not be performed by the primary object keys but by
+ * some other key pointing to a value within the nested values.
+ *
+ * @param {string} [sortmode]
+ * May be either `addr` or `num` to override the natural
+ * lexicographic sorting with a sorting suitable for IP/MAC style
+ * addresses or numeric values respectively.
+ *
+ * @return {string[]}
+ * Returns an array containing the sorted keys of the given object.
+ */
+ sortedKeys: function(obj, key, sortmode) {
+ if (obj == null || typeof(obj) != 'object')
+ return [];
- /**
- * Parses a given string as HTML and returns the first child node.
- *
- * @instance
- * @memberof LuCI.dom
- * @param {string} s
- * A string containing an HTML fragment to parse. Note that only
- * the first result of the resulting structure is returned, so an
- * input value of `<div>foo</div> <div>bar</div>` will only return
- * the first `div` element node.
- *
- * @returns {Node}
- * Returns the first DOM `Node` extracted from the HTML fragment or
- * `null` on parsing failures or if no element could be found.
- */
- parse: function(s) {
- var elem;
+ return Object.keys(obj).map(function(e) {
+ var v = (key != null) ? obj[e][key] : e;
- try {
- domParser = domParser || new DOMParser();
- elem = domParser.parseFromString(s, 'text/html').body.firstChild;
- }
- catch(e) {}
+ switch (sortmode) {
+ case 'addr':
+ v = (v != null) ? v.replace(/(?:^|[.:])([0-9a-fA-F]{1,4})/g,
+ function(m0, m1) { return ('000' + m1.toLowerCase()).substr(-4) }) : null;
+ break;
- if (!elem) {
- try {
- dummyElem = dummyElem || document.createElement('div');
- dummyElem.innerHTML = s;
- elem = dummyElem.firstChild;
- }
- catch (e) {}
+ case 'num':
+ v = (v != null) ? +v : null;
+ break;
}
- return elem || null;
- },
+ return [ e, v ];
+ }).filter(function(e) {
+ return (e[1] != null);
+ }).sort(function(a, b) {
+ return (a[1] > b[1]);
+ }).map(function(e) {
+ return e[0];
+ });
+ },
- /**
- * Tests whether a given `Node` matches the given query selector.
- *
- * This function is a convenience wrapper around the standard
- * `Node.matches("selector")` function with the added benefit that
- * the `node` argument may be a non-`Node` value, in which case
- * this function simply returns `false`.
- *
- * @instance
- * @memberof LuCI.dom
- * @param {*} node
- * The `Node` argument to test the selector against.
- *
- * @param {string} [selector]
- * The query selector expression to test against the given node.
- *
- * @returns {boolean}
- * Returns `true` if the given node matches the specified selector
- * or `false` when the node argument is no valid DOM `Node` or the
- * selector didn't match.
- */
- matches: function(node, selector) {
- var m = this.elem(node) ? node.matches || node.msMatchesSelector : null;
- return m ? m.call(node, selector) : false;
- },
+ /**
+ * Converts the given value to an array. If the given value is of
+ * type array, it is returned as-is, values of type object are
+ * returned as one-element array containing the object, empty
+ * strings and `null` values are returned as empty array, all other
+ * values are converted using `String()`, trimmed, split on white
+ * space and returned as array.
+ *
+ * @instance
+ * @memberof LuCI
+ *
+ * @param {*} val
+ * The value to convert into an array.
+ *
+ * @return {Array<*>}
+ * Returns the resulting array.
+ */
+ toArray: function(val) {
+ if (val == null)
+ return [];
+ else if (Array.isArray(val))
+ return val;
+ else if (typeof(val) == 'object')
+ return [ val ];
- /**
- * Returns the closest parent node that matches the given query
- * selector expression.
- *
- * This function is a convenience wrapper around the standard
- * `Node.closest("selector")` function with the added benefit that
- * the `node` argument may be a non-`Node` value, in which case
- * this function simply returns `null`.
- *
- * @instance
- * @memberof LuCI.dom
- * @param {*} node
- * The `Node` argument to find the closest parent for.
- *
- * @param {string} [selector]
- * The query selector expression to test against each parent.
- *
- * @returns {Node|null}
- * Returns the closest parent node matching the selector or
- * `null` when the node argument is no valid DOM `Node` or the
- * selector didn't match any parent.
- */
- parent: function(node, selector) {
- if (this.elem(node) && node.closest)
- return node.closest(selector);
+ var s = String(val).trim();
- while (this.elem(node))
- if (this.matches(node, selector))
- return node;
- else
- node = node.parentNode;
+ if (s == '')
+ return [];
- return null;
- },
+ return s.split(/\s+/);
+ },
- /**
- * Appends the given children data to the given node.
- *
- * @instance
- * @memberof LuCI.dom
- * @param {*} node
- * The `Node` argument to append the children to.
- *
- * @param {*} [children]
- * The childrens to append to the given node.
- *
- * When `children` is an array, then each item of the array
- * will be either appended as child element or text node,
- * depending on whether the item is a DOM `Node` instance or
- * some other non-`null` value. Non-`Node`, non-`null` values
- * will be converted to strings first before being passed as
- * argument to `createTextNode()`.
- *
- * When `children` is a function, it will be invoked with
- * the passed `node` argument as sole parameter and the `append`
- * function will be invoked again, with the given `node` argument
- * as first and the return value of the `children` function as
- * second parameter.
- *
- * When `children` is is a DOM `Node` instance, it will be
- * appended to the given `node`.
- *
- * When `children` is any other non-`null` value, it will be
- * converted to a string and appened to the `innerHTML` property
- * of the given `node`.
- *
- * @returns {Node|null}
- * Returns the last children `Node` appended to the node or `null`
- * if either the `node` argument was no valid DOM `node` or if the
- * `children` was `null` or didn't result in further DOM nodes.
- */
- append: function(node, children) {
- if (!this.elem(node))
- return null;
+ /**
+ * Returns a promise resolving with either the given value or or with
+ * the given default in case the input value is a rejecting promise.
+ *
+ * @instance
+ * @memberof LuCI
+ *
+ * @param {*} value
+ * The value to resolve the promise with.
+ *
+ * @param {*} defvalue
+ * The default value to resolve the promise with in case the given
+ * input value is a rejecting promise.
+ *
+ * @returns {Promise<*>}
+ * Returns a new promise resolving either to the given input value or
+ * to the given default value on error.
+ */
+ resolveDefault: function(value, defvalue) {
+ return Promise.resolve(value).catch(function() { return defvalue });
+ },
- if (Array.isArray(children)) {
- for (var i = 0; i < children.length; i++)
- if (this.elem(children[i]))
- node.appendChild(children[i]);
- else if (children !== null && children !== undefined)
- node.appendChild(document.createTextNode('' + children[i]));
+ /**
+ * The request callback function is invoked whenever an HTTP
+ * reply to a request made using the `L.get()`, `L.post()` or
+ * `L.poll()` function is timed out or received successfully.
+ *
+ * @instance
+ * @memberof LuCI
+ *
+ * @callback LuCI.requestCallbackFn
+ * @param {XMLHTTPRequest} xhr
+ * The XMLHTTPRequest instance used to make the request.
+ *
+ * @param {*} data
+ * The response JSON if the response could be parsed as such,
+ * else `null`.
+ *
+ * @param {number} duration
+ * The total duration of the request in milliseconds.
+ */
- return node.lastChild;
- }
- else if (typeof(children) === 'function') {
- return this.append(node, children(node));
- }
- else if (this.elem(children)) {
- return node.appendChild(children);
- }
- else if (children !== null && children !== undefined) {
- node.innerHTML = '' + children;
- return node.lastChild;
- }
+ /**
+ * Issues a GET request to the given url and invokes the specified
+ * callback function. The function is a wrapper around
+ * {@link LuCI.request#request Request.request()}.
+ *
+ * @deprecated
+ * @instance
+ * @memberof LuCI
+ *
+ * @param {string} url
+ * The URL to request.
+ *
+ * @param {Object<string, string>} [args]
+ * Additional query string arguments to append to the URL.
+ *
+ * @param {LuCI.requestCallbackFn} cb
+ * The callback function to invoke when the request finishes.
+ *
+ * @return {Promise<null>}
+ * Returns a promise resolving to `null` when concluded.
+ */
+ get: function(url, args, cb) {
+ return this.poll(null, url, args, cb, false);
+ },
- return null;
- },
-
- /**
- * Replaces the content of the given node with the given children.
- *
- * This function first removes any children of the given DOM
- * `Node` and then adds the given given children following the
- * rules outlined below.
- *
- * @instance
- * @memberof LuCI.dom
- * @param {*} node
- * The `Node` argument to replace the children of.
- *
- * @param {*} [children]
- * The childrens to replace into the given node.
- *
- * When `children` is an array, then each item of the array
- * will be either appended as child element or text node,
- * depending on whether the item is a DOM `Node` instance or
- * some other non-`null` value. Non-`Node`, non-`null` values
- * will be converted to strings first before being passed as
- * argument to `createTextNode()`.
- *
- * When `children` is a function, it will be invoked with
- * the passed `node` argument as sole parameter and the `append`
- * function will be invoked again, with the given `node` argument
- * as first and the return value of the `children` function as
- * second parameter.
- *
- * When `children` is is a DOM `Node` instance, it will be
- * appended to the given `node`.
- *
- * When `children` is any other non-`null` value, it will be
- * converted to a string and appened to the `innerHTML` property
- * of the given `node`.
- *
- * @returns {Node|null}
- * Returns the last children `Node` appended to the node or `null`
- * if either the `node` argument was no valid DOM `node` or if the
- * `children` was `null` or didn't result in further DOM nodes.
- */
- content: function(node, children) {
- if (!this.elem(node))
- return null;
-
- var dataNodes = node.querySelectorAll('[data-idref]');
-
- for (var i = 0; i < dataNodes.length; i++)
- delete this.registry[dataNodes[i].getAttribute('data-idref')];
-
- while (node.firstChild)
- node.removeChild(node.firstChild);
-
- return this.append(node, children);
- },
-
- /**
- * Sets attributes or registers event listeners on element nodes.
- *
- * @instance
- * @memberof LuCI.dom
- * @param {*} node
- * The `Node` argument to set the attributes or add the event
- * listeners for. When the given `node` value is not a valid
- * DOM `Node`, the function returns and does nothing.
- *
- * @param {string|Object<string, *>} key
- * Specifies either the attribute or event handler name to use,
- * or an object containing multiple key, value pairs which are
- * each added to the node as either attribute or event handler,
- * depending on the respective value.
- *
- * @param {*} [val]
- * Specifies the attribute value or event handler function to add.
- * If the `key` parameter is an `Object`, this parameter will be
- * ignored.
- *
- * When `val` is of type function, it will be registered as event
- * handler on the given `node` with the `key` parameter being the
- * event name.
- *
- * When `val` is of type object, it will be serialized as JSON and
- * added as attribute to the given `node`, using the given `key`
- * as attribute name.
- *
- * When `val` is of any other type, it will be added as attribute
- * to the given `node` as-is, with the underlying `setAttribute()`
- * call implicitely turning it into a string.
- */
- attr: function(node, key, val) {
- if (!this.elem(node))
- return null;
-
- var attr = null;
-
- if (typeof(key) === 'object' && key !== null)
- attr = key;
- else if (typeof(key) === 'string')
- attr = {}, attr[key] = val;
-
- for (key in attr) {
- if (!attr.hasOwnProperty(key) || attr[key] == null)
- continue;
-
- switch (typeof(attr[key])) {
- case 'function':
- node.addEventListener(key, attr[key]);
- break;
-
- case 'object':
- node.setAttribute(key, JSON.stringify(attr[key]));
- break;
-
- default:
- node.setAttribute(key, attr[key]);
- }
- }
- },
-
- /**
- * Creates a new DOM `Node` from the given `html`, `attr` and
- * `data` parameters.
- *
- * This function has multiple signatures, it can be either invoked
- * in the form `create(html[, attr[, data]])` or in the form
- * `create(html[, data])`. The used variant is determined from the
- * type of the second argument.
- *
- * @instance
- * @memberof LuCI.dom
- * @param {*} html
- * Describes the node to create.
- *
- * When the value of `html` is of type array, a `DocumentFragment`
- * node is created and each item of the array is first converted
- * to a DOM `Node` by passing it through `create()` and then added
- * as child to the fragment.
- *
- * When the value of `html` is a DOM `Node` instance, no new
- * element will be created but the node will be used as-is.
- *
- * When the value of `html` is a string starting with `<`, it will
- * be passed to `dom.parse()` and the resulting value is used.
- *
- * When the value of `html` is any other string, it will be passed
- * to `document.createElement()` for creating a new DOM `Node` of
- * the given name.
- *
- * @param {Object<string, *>} [attr]
- * Specifies an Object of key, value pairs to set as attributes
- * or event handlers on the created node. Refer to
- * {@link LuCI.dom#attr dom.attr()} for details.
- *
- * @param {*} [data]
- * Specifies children to append to the newly created element.
- * Refer to {@link LuCI.dom#append dom.append()} for details.
- *
- * @throws {InvalidCharacterError}
- * Throws an `InvalidCharacterError` when the given `html`
- * argument contained malformed markup (such as not escaped
- * `&` characters in XHTML mode) or when the given node name
- * in `html` contains characters which are not legal in DOM
- * element names, such as spaces.
- *
- * @returns {Node}
- * Returns the newly created `Node`.
- */
- create: function() {
- var html = arguments[0],
- attr = arguments[1],
- data = arguments[2],
- elem;
-
- if (!(attr instanceof Object) || Array.isArray(attr))
- data = attr, attr = null;
-
- if (Array.isArray(html)) {
- elem = document.createDocumentFragment();
- for (var i = 0; i < html.length; i++)
- elem.appendChild(this.create(html[i]));
- }
- else if (this.elem(html)) {
- elem = html;
- }
- else if (html.charCodeAt(0) === 60) {
- elem = this.parse(html);
- }
- else {
- elem = document.createElement(html);
- }
-
- if (!elem)
- return null;
-
- this.attr(elem, attr);
- this.append(elem, data);
-
- return elem;
- },
-
- registry: {},
-
- /**
- * Attaches or detaches arbitrary data to and from a DOM `Node`.
- *
- * This function is useful to attach non-string values or runtime
- * data that is not serializable to DOM nodes. To decouple data
- * from the DOM, values are not added directly to nodes, but
- * inserted into a registry instead which is then referenced by a
- * string key stored as `data-idref` attribute in the node.
- *
- * This function has multiple signatures and is sensitive to the
- * number of arguments passed to it.
- *
- * - `dom.data(node)` -
- * Fetches all data associated with the given node.
- * - `dom.data(node, key)` -
- * Fetches a specific key associated with the given node.
- * - `dom.data(node, key, val)` -
- * Sets a specific key to the given value associated with the
- * given node.
- * - `dom.data(node, null)` -
- * Clears any data associated with the node.
- * - `dom.data(node, key, null)` -
- * Clears the given key associated with the node.
- *
- * @instance
- * @memberof LuCI.dom
- * @param {Node} node
- * The DOM `Node` instance to set or retrieve the data for.
- *
- * @param {string|null} [key]
- * This is either a string specifying the key to retrieve, or
- * `null` to unset the entire node data.
- *
- * @param {*|null} [val]
- * This is either a non-`null` value to set for a given key or
- * `null` to remove the given `key` from the specified node.
- *
- * @returns {*}
- * Returns the get or set value, or `null` when no value could
- * be found.
- */
- data: function(node, key, val) {
- var id = node.getAttribute('data-idref');
-
- /* clear all data */
- if (arguments.length > 1 && key == null) {
- if (id != null) {
- node.removeAttribute('data-idref');
- val = this.registry[id]
- delete this.registry[id];
- return val;
- }
-
- return null;
- }
-
- /* clear a key */
- else if (arguments.length > 2 && key != null && val == null) {
- if (id != null) {
- val = this.registry[id][key];
- delete this.registry[id][key];
- return val;
- }
-
- return null;
- }
-
- /* set a key */
- else if (arguments.length > 2 && key != null && val != null) {
- if (id == null) {
- do { id = Math.floor(Math.random() * 0xffffffff).toString(16) }
- while (this.registry.hasOwnProperty(id));
-
- node.setAttribute('data-idref', id);
- this.registry[id] = {};
- }
-
- return (this.registry[id][key] = val);
- }
-
- /* get all data */
- else if (arguments.length == 1) {
- if (id != null)
- return this.registry[id];
-
- return null;
- }
-
- /* get a key */
- else if (arguments.length == 2) {
- if (id != null)
- return this.registry[id][key];
- }
-
- return null;
- },
-
- /**
- * Binds the given class instance ot the specified DOM `Node`.
- *
- * This function uses the `dom.data()` facility to attach the
- * passed instance of a Class to a node. This is needed for
- * complex widget elements or similar where the corresponding
- * class instance responsible for the element must be retrieved
- * from DOM nodes obtained by `querySelector()` or similar means.
- *
- * @instance
- * @memberof LuCI.dom
- * @param {Node} node
- * The DOM `Node` instance to bind the class to.
- *
- * @param {Class} inst
- * The Class instance to bind to the node.
- *
- * @throws {TypeError}
- * Throws a `TypeError` when the given instance argument isn't
- * a valid Class instance.
- *
- * @returns {Class}
- * Returns the bound class instance.
- */
- bindClassInstance: function(node, inst) {
- if (!(inst instanceof Class))
- L.error('TypeError', 'Argument must be a class instance');
-
- return this.data(node, '_class', inst);
- },
-
- /**
- * Finds a bound class instance on the given node itself or the
- * first bound instance on its closest parent node.
- *
- * @instance
- * @memberof LuCI.dom
- * @param {Node} node
- * The DOM `Node` instance to start from.
- *
- * @returns {Class|null}
- * Returns the founds class instance if any or `null` if no bound
- * class could be found on the node itself or any of its parents.
- */
- findClassInstance: function(node) {
- var inst = null;
-
- do {
- inst = this.data(node, '_class');
- node = node.parentNode;
- }
- while (!(inst instanceof Class) && node != null);
-
- return inst;
- },
-
- /**
- * Finds a bound class instance on the given node itself or the
- * first bound instance on its closest parent node and invokes
- * the specified method name on the found class instance.
- *
- * @instance
- * @memberof LuCI.dom
- * @param {Node} node
- * The DOM `Node` instance to start from.
- *
- * @param {string} method
- * The name of the method to invoke on the found class instance.
- *
- * @param {...*} params
- * Additional arguments to pass to the invoked method as-is.
- *
- * @returns {*|null}
- * Returns the return value of the invoked method if a class
- * instance and method has been found. Returns `null` if either
- * no bound class instance could be found, or if the found
- * instance didn't have the requested `method`.
- */
- callClassMethod: function(node, method /*, ... */) {
- var inst = this.findClassInstance(node);
-
- if (inst == null || typeof(inst[method]) != 'function')
- return null;
-
- return inst[method].apply(inst, inst.varargs(arguments, 2));
- },
-
- /**
- * The ignore callback function is invoked by `isEmpty()` for each
- * child node to decide whether to ignore a child node or not.
- *
- * When this function returns `false`, the node passed to it is
- * ignored, else not.
- *
- * @callback LuCI.dom~ignoreCallbackFn
- * @param {Node} node
- * The child node to test.
- *
- * @returns {boolean}
- * Boolean indicating whether to ignore the node or not.
- */
-
- /**
- * Tests whether a given DOM `Node` instance is empty or appears
- * empty.
- *
- * Any element child nodes which have the CSS class `hidden` set
- * or for which the optionally passed `ignoreFn` callback function
- * returns `false` are ignored.
- *
- * @instance
- * @memberof LuCI.dom
- * @param {Node} node
- * The DOM `Node` instance to test.
- *
- * @param {LuCI.dom~ignoreCallbackFn} [ignoreFn]
- * Specifies an optional function which is invoked for each child
- * node to decide whether the child node should be ignored or not.
- *
- * @returns {boolean}
- * Returns `true` if the node does not have any children or if
- * any children node either has a `hidden` CSS class or a `false`
- * result when testing it using the given `ignoreFn`.
- */
- isEmpty: function(node, ignoreFn) {
- for (var child = node.firstElementChild; child != null; child = child.nextElementSibling)
- if (!child.classList.contains('hidden') && (!ignoreFn || !ignoreFn(child)))
- return false;
-
- return true;
- }
- }),
-
- Poll: Poll,
- Class: Class,
- Request: Request,
+ /**
+ * Issues a POST request to the given url and invokes the specified
+ * callback function. The function is a wrapper around
+ * {@link LuCI.request#request Request.request()}. The request is
+ * sent using `application/x-www-form-urlencoded` encoding and will
+ * contain a field `token` with the current value of `LuCI.env.token`
+ * by default.
+ *
+ * @deprecated
+ * @instance
+ * @memberof LuCI
+ *
+ * @param {string} url
+ * The URL to request.
+ *
+ * @param {Object<string, string>} [args]
+ * Additional post arguments to append to the request body.
+ *
+ * @param {LuCI.requestCallbackFn} cb
+ * The callback function to invoke when the request finishes.
+ *
+ * @return {Promise<null>}
+ * Returns a promise resolving to `null` when concluded.
+ */
+ post: function(url, args, cb) {
+ return this.poll(null, url, args, cb, true);
+ },
/**
- * @class
+ * Register a polling HTTP request that invokes the specified
+ * callback function. The function is a wrapper around
+ * {@link LuCI.request.poll#add Request.poll.add()}.
+ *
+ * @deprecated
+ * @instance
* @memberof LuCI
- * @hideconstructor
- * @classdesc
*
- * The `view` class forms the basis of views and provides a standard
- * set of methods to inherit from.
+ * @param {number} interval
+ * The poll interval to use. If set to a value less than or equal
+ * to `0`, it will default to the global poll interval configured
+ * in `LuCI.env.pollinterval`.
+ *
+ * @param {string} url
+ * The URL to request.
+ *
+ * @param {Object<string, string>} [args]
+ * Specifies additional arguments for the request. For GET requests,
+ * the arguments are appended to the URL as query string, for POST
+ * requests, they'll be added to the request body.
+ *
+ * @param {LuCI.requestCallbackFn} cb
+ * The callback function to invoke whenever a request finishes.
+ *
+ * @param {boolean} [post=false]
+ * When set to `false` or not specified, poll requests will be made
+ * using the GET method. When set to `true`, POST requests will be
+ * issued. In case of POST requests, the request body will contain
+ * an argument `token` with the current value of `LuCI.env.token` by
+ * default, regardless of the parameters specified with `args`.
+ *
+ * @return {function}
+ * Returns the internally created function that has been passed to
+ * {@link LuCI.request.poll#add Request.poll.add()}. This value can
+ * be passed to {@link LuCI.poll.remove Poll.remove()} to remove the
+ * polling request.
*/
- view: Class.extend(/* @lends LuCI.view.prototype */ {
- __name__: 'LuCI.View',
-
- __init__: function() {
- var vp = document.getElementById('view');
+ poll: function(interval, url, args, cb, post) {
+ if (interval !== null && interval <= 0)
+ interval = env.pollinterval;
- L.dom.content(vp, E('div', { 'class': 'spinning' }, _('Loading view…')));
+ var data = post ? { token: env.token } : null,
+ method = post ? 'POST' : 'GET';
- return Promise.resolve(this.load())
- .then(L.bind(this.render, this))
- .then(L.bind(function(nodes) {
- var vp = document.getElementById('view');
+ if (!/^(?:\/|\S+:\/\/)/.test(url))
+ url = this.url(url);
- L.dom.content(vp, nodes);
- L.dom.append(vp, this.addFooter());
- }, this)).catch(L.error);
- },
+ if (args != null)
+ data = Object.assign(data || {}, args);
- /**
- * The load function is invoked before the view is rendered.
- *
- * The invocation of this function is wrapped by
- * `Promise.resolve()` so it may return Promises if needed.
- *
- * The return value of the function (or the resolved values
- * of the promise returned by it) will be passed as first
- * argument to `render()`.
- *
- * This function is supposed to be overwritten by subclasses,
- * the default implementation does nothing.
- *
- * @instance
- * @abstract
- * @memberof LuCI.view
- *
- * @returns {*|Promise<*>}
- * May return any value or a Promise resolving to any value.
- */
- load: function() {},
+ if (interval !== null)
+ return Request.poll.add(interval, url, { method: method, query: data }, cb);
+ else
+ return Request.request(url, { method: method, query: data })
+ .then(function(res) {
+ var json = null;
+ if (/^application\/json\b/.test(res.headers.get('Content-Type')))
+ try { json = res.json() } catch(e) {}
+ cb(res.xhr, json, res.duration);
+ });
+ },
- /**
- * The render function is invoked after the
- * {@link LuCI.view#load load()} function and responsible
- * for setting up the view contents. It must return a DOM
- * `Node` or `DocumentFragment` holding the contents to
- * insert into the view area.
- *
- * The invocation of this function is wrapped by
- * `Promise.resolve()` so it may return Promises if needed.
- *
- * The return value of the function (or the resolved values
- * of the promise returned by it) will be inserted into the
- * main content area using
- * {@link LuCI.dom#append dom.append()}.
- *
- * This function is supposed to be overwritten by subclasses,
- * the default implementation does nothing.
- *
- * @instance
- * @abstract
- * @memberof LuCI.view
- * @param {*|null} load_results
- * This function will receive the return value of the
- * {@link LuCI.view#load view.load()} function as first
- * argument.
- *
- * @returns {Node|Promise<Node>}
- * Should return a DOM `Node` value or a `Promise` resolving
- * to a `Node` value.
- */
- render: function() {},
+ /**
+ * Check whether a view has sufficient permissions.
+ *
+ * @return {boolean|null}
+ * Returns `null` if the current session has no permission at all to
+ * load resources required by the view. Returns `false` if readonly
+ * permissions are granted or `true` if at least one required ACL
+ * group is granted with write permissions.
+ */
+ hasViewPermission: function() {
+ if (!this.isObject(env.nodespec) || !env.nodespec.satisfied)
+ return null;
- /**
- * The handleSave function is invoked when the user clicks
- * the `Save` button in the page action footer.
- *
- * The default implementation should be sufficient for most
- * views using {@link form#Map form.Map()} based forms - it
- * will iterate all forms present in the view and invoke
- * the {@link form#Map#save Map.save()} method on each form.
- *
- * Views not using `Map` instances or requiring other special
- * logic should overwrite `handleSave()` with a custom
- * implementation.
- *
- * To disable the `Save` page footer button, views extending
- * this base class should overwrite the `handleSave` function
- * with `null`.
- *
- * The invocation of this function is wrapped by
- * `Promise.resolve()` so it may return Promises if needed.
- *
- * @instance
- * @memberof LuCI.view
- * @param {Event} ev
- * The DOM event that triggered the function.
- *
- * @returns {*|Promise<*>}
- * Any return values of this function are discarded, but
- * passed through `Promise.resolve()` to ensure that any
- * returned promise runs to completion before the button
- * is reenabled.
- */
- handleSave: function(ev) {
- var tasks = [];
+ return !env.nodespec.readonly;
+ },
- document.getElementById('maincontent')
- .querySelectorAll('.cbi-map').forEach(function(map) {
- tasks.push(L.dom.callClassMethod(map, 'save'));
- });
+ /**
+ * Deprecated wrapper around {@link LuCI.poll.remove Poll.remove()}.
+ *
+ * @deprecated
+ * @instance
+ * @memberof LuCI
+ *
+ * @param {function} entry
+ * The polling function to remove.
+ *
+ * @return {boolean}
+ * Returns `true` when the function has been removed or `false` if
+ * it could not be found.
+ */
+ stop: function(entry) { return Poll.remove(entry) },
- return Promise.all(tasks);
- },
+ /**
+ * Deprecated wrapper around {@link LuCI.poll.stop Poll.stop()}.
+ *
+ * @deprecated
+ * @instance
+ * @memberof LuCI
+ *
+ * @return {boolean}
+ * Returns `true` when the polling loop has been stopped or `false`
+ * when it didn't run to begin with.
+ */
+ halt: function() { return Poll.stop() },
- /**
- * The handleSaveApply function is invoked when the user clicks
- * the `Save & Apply` button in the page action footer.
- *
- * The default implementation should be sufficient for most
- * views using {@link form#Map form.Map()} based forms - it
- * will first invoke
- * {@link LuCI.view.handleSave view.handleSave()} and then
- * call {@link ui#changes#apply ui.changes.apply()} to start the
- * modal config apply and page reload flow.
- *
- * Views not using `Map` instances or requiring other special
- * logic should overwrite `handleSaveApply()` with a custom
- * implementation.
- *
- * To disable the `Save & Apply` page footer button, views
- * extending this base class should overwrite the
- * `handleSaveApply` function with `null`.
- *
- * The invocation of this function is wrapped by
- * `Promise.resolve()` so it may return Promises if needed.
- *
- * @instance
- * @memberof LuCI.view
- * @param {Event} ev
- * The DOM event that triggered the function.
- *
- * @returns {*|Promise<*>}
- * Any return values of this function are discarded, but
- * passed through `Promise.resolve()` to ensure that any
- * returned promise runs to completion before the button
- * is reenabled.
- */
- handleSaveApply: function(ev, mode) {
- return this.handleSave(ev).then(function() {
- L.ui.changes.apply(mode == '0');
- });
- },
+ /**
+ * Deprecated wrapper around {@link LuCI.poll.start Poll.start()}.
+ *
+ * @deprecated
+ * @instance
+ * @memberof LuCI
+ *
+ * @return {boolean}
+ * Returns `true` when the polling loop has been started or `false`
+ * when it was already running.
+ */
+ run: function() { return Poll.start() },
- /**
- * The handleReset function is invoked when the user clicks
- * the `Reset` button in the page action footer.
- *
- * The default implementation should be sufficient for most
- * views using {@link form#Map form.Map()} based forms - it
- * will iterate all forms present in the view and invoke
- * the {@link form#Map#save Map.reset()} method on each form.
- *
- * Views not using `Map` instances or requiring other special
- * logic should overwrite `handleReset()` with a custom
- * implementation.
- *
- * To disable the `Reset` page footer button, views extending
- * this base class should overwrite the `handleReset` function
- * with `null`.
- *
- * The invocation of this function is wrapped by
- * `Promise.resolve()` so it may return Promises if needed.
- *
- * @instance
- * @memberof LuCI.view
- * @param {Event} ev
- * The DOM event that triggered the function.
- *
- * @returns {*|Promise<*>}
- * Any return values of this function are discarded, but
- * passed through `Promise.resolve()` to ensure that any
- * returned promise runs to completion before the button
- * is reenabled.
- */
- handleReset: function(ev) {
- var tasks = [];
+ /**
+ * Legacy `L.dom` class alias. New view code should use `'require dom';`
+ * to request the `LuCI.dom` class.
+ *
+ * @instance
+ * @memberof LuCI
+ * @deprecated
+ */
+ dom: DOM,
- document.getElementById('maincontent')
- .querySelectorAll('.cbi-map').forEach(function(map) {
- tasks.push(L.dom.callClassMethod(map, 'reset'));
- });
+ /**
+ * Legacy `L.view` class alias. New view code should use `'require view';`
+ * to request the `LuCI.view` class.
+ *
+ * @instance
+ * @memberof LuCI
+ * @deprecated
+ */
+ view: View,
- return Promise.all(tasks);
- },
+ /**
+ * Legacy `L.Poll` class alias. New view code should use `'require poll';`
+ * to request the `LuCI.poll` class.
+ *
+ * @instance
+ * @memberof LuCI
+ * @deprecated
+ */
+ Poll: Poll,
- /**
- * Renders a standard page action footer if any of the
- * `handleSave()`, `handleSaveApply()` or `handleReset()`
- * functions are defined.
- *
- * The default implementation should be sufficient for most
- * views - it will render a standard page footer with action
- * buttons labeled `Save`, `Save & Apply` and `Reset`
- * triggering the `handleSave()`, `handleSaveApply()` and
- * `handleReset()` functions respectively.
- *
- * When any of these `handle*()` functions is overwritten
- * with `null` by a view extending this class, the
- * corresponding button will not be rendered.
- *
- * @instance
- * @memberof LuCI.view
- * @returns {DocumentFragment}
- * Returns a `DocumentFragment` containing the footer bar
- * with buttons for each corresponding `handle*()` action
- * or an empty `DocumentFragment` if all three `handle*()`
- * methods are overwritten with `null`.
- */
- addFooter: function() {
- var footer = E([]);
-
- var saveApplyBtn = this.handleSaveApply ? new L.ui.ComboButton('0', {
- 0: [ _('Save & Apply') ],
- 1: [ _('Apply unchecked') ]
- }, {
- classes: {
- 0: 'cbi-button cbi-button-apply important',
- 1: 'cbi-button cbi-button-negative important'
- },
- click: L.ui.createHandlerFn(this, 'handleSaveApply')
- }).render() : E([]);
-
- if (this.handleSaveApply || this.handleSave || this.handleReset) {
- footer.appendChild(E('div', { 'class': 'cbi-page-actions' }, [
- saveApplyBtn, ' ',
- this.handleSave ? E('button', {
- 'class': 'cbi-button cbi-button-save',
- 'click': L.ui.createHandlerFn(this, 'handleSave')
- }, [ _('Save') ]) : '', ' ',
- this.handleReset ? E('button', {
- 'class': 'cbi-button cbi-button-reset',
- 'click': L.ui.createHandlerFn(this, 'handleReset')
- }, [ _('Reset') ]) : ''
- ]));
- }
+ /**
+ * Legacy `L.Request` class alias. New view code should use `'require request';`
+ * to request the `LuCI.request` class.
+ *
+ * @instance
+ * @memberof LuCI
+ * @deprecated
+ */
+ Request: Request,
- return footer;
- }
- })
+ /**
+ * Legacy `L.Class` class alias. New view code should use `'require baseclass';`
+ * to request the `LuCI.baseclass` class.
+ *
+ * @instance
+ * @memberof LuCI
+ * @deprecated
+ */
+ Class: Class
});
/**
- * @class
+ * @class xhr
* @memberof LuCI
* @deprecated
* @classdesc
*
- * The `LuCI.XHR` class is a legacy compatibility shim for the
+ * The `LuCI.xhr` class is a legacy compatibility shim for the
* functionality formerly provided by `xhr.js`. It is registered as global
* `window.XHR` symbol for compatibility with legacy code.
*
- * New code should use {@link LuCI.Request} instead to implement HTTP
+ * New code should use {@link LuCI.request} instead to implement HTTP
* request handling.
*/
- var XHR = Class.extend(/** @lends LuCI.XHR.prototype */ {
- __name__: 'LuCI.XHR',
+ var XHR = Class.extend(/** @lends LuCI.xhr.prototype */ {
+ __name__: 'LuCI.xhr',
__init__: function() {
if (window.console && console.debug)
console.debug('Direct use XHR() is deprecated, please use L.Request instead');
*
* @instance
* @deprecated
- * @memberof LuCI.XHR
+ * @memberof LuCI.xhr
*
* @param {string} url
* The URL to request
*/
get: function(url, data, callback, timeout) {
this.active = true;
- L.get(url, data, this._response.bind(this, callback), timeout);
+ LuCI.prototype.get(url, data, this._response.bind(this, callback), timeout);
},
/**
*
* @instance
* @deprecated
- * @memberof LuCI.XHR
+ * @memberof LuCI.xhr
*
* @param {string} url
* The URL to request
*/
post: function(url, data, callback, timeout) {
this.active = true;
- L.post(url, data, this._response.bind(this, callback), timeout);
+ LuCI.prototype.post(url, data, this._response.bind(this, callback), timeout);
},
/**
*
* @instance
* @deprecated
- * @memberof LuCI.XHR
+ * @memberof LuCI.xhr
*/
cancel: function() { delete this.active },
*
* @instance
* @deprecated
- * @memberof LuCI.XHR
+ * @memberof LuCI.xhr
*
* @returns {boolean}
* Returns `true` if the request is still running or `false` if it
*
* @instance
* @deprecated
- * @memberof LuCI.XHR
+ * @memberof LuCI.xhr
*/
abort: function() {},
*
* @instance
* @deprecated
- * @memberof LuCI.XHR
+ * @memberof LuCI.xhr
*
* @throws {InternalError}
* Throws an `InternalError` with the message `Not implemented`
* when invoked.
*/
- send_form: function() { L.error('InternalError', 'Not implemented') },
+ send_form: function() { LuCI.prototype.error('InternalError', 'Not implemented') },
});
- XHR.get = function() { return window.L.get.apply(window.L, arguments) };
- XHR.post = function() { return window.L.post.apply(window.L, arguments) };
- XHR.poll = function() { return window.L.poll.apply(window.L, arguments) };
+ XHR.get = function() { return LuCI.prototype.get.apply(LuCI.prototype, arguments) };
+ XHR.post = function() { return LuCI.prototype.post.apply(LuCI.prototype, arguments) };
+ XHR.poll = function() { return LuCI.prototype.poll.apply(LuCI.prototype, arguments) };
XHR.stop = Request.poll.remove.bind(Request.poll);
XHR.halt = Request.poll.stop.bind(Request.poll);
XHR.run = Request.poll.start.bind(Request.poll);
projects / project / luci.git / blobdiff