projects / project / luci2 / ui.git / blob
? search:


2d1c8bcf9d23a4241cf2ea7b065e247e0623377a
[project/luci2/ui.git] / luci2 / htdocs / luci2 / luci2.js
1 /*
2 LuCI2 - OpenWrt Web Interface
3
4 Copyright 2013 Jo-Philipp Wich <jow@openwrt.org>
5
6 Licensed under the Apache License, Version 2.0 (the "License");
7 you may not use this file except in compliance with the License.
8 You may obtain a copy of the License at
9
10 http://www.apache.org/licenses/LICENSE-2.0
11 */
12
13 String.prototype.format = function()
14 {
15 var html_esc = [/&/g, '&#38;', /"/g, '&#34;', /'/g, '&#39;', /</g, '&#60;', />/g, '&#62;'];
16 var quot_esc = [/"/g, '&#34;', /'/g, '&#39;'];
17
18 function esc(s, r) {
19 for( var i = 0; i < r.length; i += 2 )
20 s = s.replace(r[i], r[i+1]);
21 return s;
22 }
23
24 var str = this;
25 var out = '';
26 var re = /^(([^%]*)%('.|0|\x20)?(-)?(\d+)?(\.\d+)?(%|b|c|d|u|f|o|s|x|X|q|h|j|t|m))/;
27 var a = b = [], numSubstitutions = 0, numMatches = 0;
28
29 while ((a = re.exec(str)) != null)
30 {
31 var m = a[1];
32 var leftpart = a[2], pPad = a[3], pJustify = a[4], pMinLength = a[5];
33 var pPrecision = a[6], pType = a[7];
34
35 numMatches++;
36
37 if (pType == '%')
38 {
39 subst = '%';
40 }
41 else
42 {
43 if (numSubstitutions < arguments.length)
44 {
45 var param = arguments[numSubstitutions++];
46
47 var pad = '';
48 if (pPad && pPad.substr(0,1) == "'")
49 pad = leftpart.substr(1,1);
50 else if (pPad)
51 pad = pPad;
52
53 var justifyRight = true;
54 if (pJustify && pJustify === "-")
55 justifyRight = false;
56
57 var minLength = -1;
58 if (pMinLength)
59 minLength = parseInt(pMinLength);
60
61 var precision = -1;
62 if (pPrecision && pType == 'f')
63 precision = parseInt(pPrecision.substring(1));
64
65 var subst = param;
66
67 switch(pType)
68 {
69 case 'b':
70 subst = (parseInt(param) || 0).toString(2);
71 break;
72
73 case 'c':
74 subst = String.fromCharCode(parseInt(param) || 0);
75 break;
76
77 case 'd':
78 subst = (parseInt(param) || 0);
79 break;
80
81 case 'u':
82 subst = Math.abs(parseInt(param) || 0);
83 break;
84
85 case 'f':
86 subst = (precision > -1)
87 ? ((parseFloat(param) || 0.0)).toFixed(precision)
88 : (parseFloat(param) || 0.0);
89 break;
90
91 case 'o':
92 subst = (parseInt(param) || 0).toString(8);
93 break;
94
95 case 's':
96 subst = param;
97 break;
98
99 case 'x':
100 subst = ('' + (parseInt(param) || 0).toString(16)).toLowerCase();
101 break;
102
103 case 'X':
104 subst = ('' + (parseInt(param) || 0).toString(16)).toUpperCase();
105 break;
106
107 case 'h':
108 subst = esc(param, html_esc);
109 break;
110
111 case 'q':
112 subst = esc(param, quot_esc);
113 break;
114
115 case 'j':
116 subst = String.serialize(param);
117 break;
118
119 case 't':
120 var td = 0;
121 var th = 0;
122 var tm = 0;
123 var ts = (param || 0);
124
125 if (ts > 60) {
126 tm = Math.floor(ts / 60);
127 ts = (ts % 60);
128 }
129
130 if (tm > 60) {
131 th = Math.floor(tm / 60);
132 tm = (tm % 60);
133 }
134
135 if (th > 24) {
136 td = Math.floor(th / 24);
137 th = (th % 24);
138 }
139
140 subst = (td > 0)
141 ? '%dd %dh %dm %ds'.format(td, th, tm, ts)
142 : '%dh %dm %ds'.format(th, tm, ts);
143
144 break;
145
146 case 'm':
147 var mf = pMinLength ? parseInt(pMinLength) : 1000;
148 var pr = pPrecision ? Math.floor(10*parseFloat('0'+pPrecision)) : 2;
149
150 var i = 0;
151 var val = parseFloat(param || 0);
152 var units = [ '', 'K', 'M', 'G', 'T', 'P', 'E' ];
153
154 for (i = 0; (i < units.length) && (val > mf); i++)
155 val /= mf;
156
157 subst = val.toFixed(pr) + ' ' + units[i];
158 break;
159 }
160
161 subst = (typeof(subst) == 'undefined') ? '' : subst.toString();
162
163 if (minLength > 0 && pad.length > 0)
164 for (var i = 0; i < (minLength - subst.length); i++)
165 subst = justifyRight ? (pad + subst) : (subst + pad);
166 }
167 }
168
169 out += leftpart + subst;
170 str = str.substr(m.length);
171 }
172
173 return out + str;
174 }
175
176 function LuCI2()
177 {
178 var L = this;
179
180 var Class = function() { };
181
182 Class.extend = function(properties)
183 {
184 Class.initializing = true;
185
186 var prototype = new this();
187 var superprot = this.prototype;
188
189 Class.initializing = false;
190
191 $.extend(prototype, properties, {
192 callSuper: function() {
193 var args = [ ];
194 var meth = arguments[0];
195
196 if (typeof(superprot[meth]) != 'function')
197 return undefined;
198
199 for (var i = 1; i < arguments.length; i++)
200 args.push(arguments[i]);
201
202 return superprot[meth].apply(this, args);
203 }
204 });
205
206 function _class()
207 {
208 this.options = arguments[0] || { };
209
210 if (!Class.initializing && typeof(this.init) == 'function')
211 this.init.apply(this, arguments);
212 }
213
214 _class.prototype = prototype;
215 _class.prototype.constructor = _class;
216
217 _class.extend = Class.extend;
218
219 return _class;
220 };
221
222 this.defaults = function(obj, def)
223 {
224 for (var key in def)
225 if (typeof(obj[key]) == 'undefined')
226 obj[key] = def[key];
227
228 return obj;
229 };
230
231 this.isDeferred = function(x)
232 {
233 return (typeof(x) == 'object' &&
234 typeof(x.then) == 'function' &&
235 typeof(x.promise) == 'function');
236 };
237
238 this.deferrable = function()
239 {
240 if (this.isDeferred(arguments[0]))
241 return arguments[0];
242
243 var d = $.Deferred();
244 d.resolve.apply(d, arguments);
245
246 return d.promise();
247 };
248
249 this.i18n = {
250
251 loaded: false,
252 catalog: { },
253 plural: function(n) { return 0 + (n != 1) },
254
255 init: function() {
256 if (L.i18n.loaded)
257 return;
258
259 var lang = (navigator.userLanguage || navigator.language || 'en').toLowerCase();
260 var langs = (lang.indexOf('-') > -1) ? [ lang, lang.split(/-/)[0] ] : [ lang ];
261
262 for (var i = 0; i < langs.length; i++)
263 $.ajax('%s/i18n/base.%s.json'.format(L.globals.resource, langs[i]), {
264 async: false,
265 cache: true,
266 dataType: 'json',
267 success: function(data) {
268 $.extend(L.i18n.catalog, data);
269
270 var pe = L.i18n.catalog[''];
271 if (pe)
272 {
273 delete L.i18n.catalog[''];
274 try {
275 var pf = new Function('n', 'return 0 + (' + pe + ')');
276 L.i18n.plural = pf;
277 } catch (e) { };
278 }
279 }
280 });
281
282 L.i18n.loaded = true;
283 }
284
285 };
286
287 this.tr = function(msgid)
288 {
289 L.i18n.init();
290
291 var msgstr = L.i18n.catalog[msgid];
292
293 if (typeof(msgstr) == 'undefined')
294 return msgid;
295 else if (typeof(msgstr) == 'string')
296 return msgstr;
297 else
298 return msgstr[0];
299 };
300
301 this.trp = function(msgid, msgid_plural, count)
302 {
303 L.i18n.init();
304
305 var msgstr = L.i18n.catalog[msgid];
306
307 if (typeof(msgstr) == 'undefined')
308 return (count == 1) ? msgid : msgid_plural;
309 else if (typeof(msgstr) == 'string')
310 return msgstr;
311 else
312 return msgstr[L.i18n.plural(count)];
313 };
314
315 this.trc = function(msgctx, msgid)
316 {
317 L.i18n.init();
318
319 var msgstr = L.i18n.catalog[msgid + '\u0004' + msgctx];
320
321 if (typeof(msgstr) == 'undefined')
322 return msgid;
323 else if (typeof(msgstr) == 'string')
324 return msgstr;
325 else
326 return msgstr[0];
327 };
328
329 this.trcp = function(msgctx, msgid, msgid_plural, count)
330 {
331 L.i18n.init();
332
333 var msgstr = L.i18n.catalog[msgid + '\u0004' + msgctx];
334
335 if (typeof(msgstr) == 'undefined')
336 return (count == 1) ? msgid : msgid_plural;
337 else if (typeof(msgstr) == 'string')
338 return msgstr;
339 else
340 return msgstr[L.i18n.plural(count)];
341 };
342
343 this.setHash = function(key, value)
344 {
345 var h = '';
346 var data = this.getHash(undefined);
347
348 if (typeof(value) == 'undefined')
349 delete data[key];
350 else
351 data[key] = value;
352
353 var keys = [ ];
354 for (var k in data)
355 keys.push(k);
356
357 keys.sort();
358
359 for (var i = 0; i < keys.length; i++)
360 {
361 if (i > 0)
362 h += ',';
363
364 h += keys[i] + ':' + data[keys[i]];
365 }
366
367 if (h.length)
368 location.hash = '#' + h;
369 else
370 location.hash = '';
371 };
372
373 this.getHash = function(key)
374 {
375 var data = { };
376 var tuples = (location.hash || '#').substring(1).split(/,/);
377
378 for (var i = 0; i < tuples.length; i++)
379 {
380 var tuple = tuples[i].split(/:/);
381 if (tuple.length == 2)
382 data[tuple[0]] = tuple[1];
383 }
384
385 if (typeof(key) != 'undefined')
386 return data[key];
387
388 return data;
389 };
390
391 this.toArray = function(x)
392 {
393 switch (typeof(x))
394 {
395 case 'number':
396 case 'boolean':
397 return [ x ];
398
399 case 'string':
400 var r = [ ];
401 var l = x.split(/\s+/);
402 for (var i = 0; i < l.length; i++)
403 if (l[i].length > 0)
404 r.push(l[i]);
405 return r;
406
407 case 'object':
408 if ($.isArray(x))
409 {
410 var r = [ ];
411 for (var i = 0; i < x.length; i++)
412 r.push(x[i]);
413 return r;
414 }
415 else if ($.isPlainObject(x))
416 {
417 var r = [ ];
418 for (var k in x)
419 if (x.hasOwnProperty(k))
420 r.push(k);
421 return r.sort();
422 }
423 }
424
425 return [ ];
426 };
427
428 this.toObject = function(x)
429 {
430 switch (typeof(x))
431 {
432 case 'number':
433 case 'boolean':
434 return { x: true };
435
436 case 'string':
437 var r = { };
438 var l = x.split(/\x+/);
439 for (var i = 0; i < l.length; i++)
440 if (l[i].length > 0)
441 r[l[i]] = true;
442 return r;
443
444 case 'object':
445 if ($.isArray(x))
446 {
447 var r = { };
448 for (var i = 0; i < x.length; i++)
449 r[x[i]] = true;
450 return r;
451 }
452 else if ($.isPlainObject(x))
453 {
454 return x;
455 }
456 }
457
458 return { };
459 };
460
461 this.filterArray = function(array, item)
462 {
463 if (!$.isArray(array))
464 return [ ];
465
466 for (var i = 0; i < array.length; i++)
467 if (array[i] === item)
468 array.splice(i--, 1);
469
470 return array;
471 };
472
473 this.toClassName = function(str, suffix)
474 {
475 var n = '';
476 var l = str.split(/[\/.]/);
477
478 for (var i = 0; i < l.length; i++)
479 if (l[i].length > 0)
480 n += l[i].charAt(0).toUpperCase() + l[i].substr(1).toLowerCase();
481
482 if (typeof(suffix) == 'string')
483 n += suffix;
484
485 return n;
486 };
487
488 this.globals = {
489 timeout: 15000,
490 resource: '/luci2',
491 sid: '00000000000000000000000000000000'
492 };
493
494 this.rpc = {
495
496 _id: 1,
497 _batch: undefined,
498 _requests: { },
499
500 _call: function(req, cb)
501 {
502 return $.ajax('/ubus', {
503 cache: false,
504 contentType: 'application/json',
505 data: JSON.stringify(req),
506 dataType: 'json',
507 type: 'POST',
508 timeout: L.globals.timeout,
509 _rpc_req: req
510 }).then(cb, cb);
511 },
512
513 _list_cb: function(msg)
514 {
515 var list = msg.result;
516
517 /* verify message frame */
518 if (typeof(msg) != 'object' || msg.jsonrpc != '2.0' || !msg.id || !$.isArray(list))
519 list = [ ];
520
521 return $.Deferred().resolveWith(this, [ list ]);
522 },
523
524 _call_cb: function(msg)
525 {
526 var data = [ ];
527 var type = Object.prototype.toString;
528 var reqs = this._rpc_req;
529
530 if (!$.isArray(reqs))
531 {
532 msg = [ msg ];
533 reqs = [ reqs ];
534 }
535
536 for (var i = 0; i < msg.length; i++)
537 {
538 /* fetch related request info */
539 var req = L.rpc._requests[reqs[i].id];
540 if (typeof(req) != 'object')
541 throw 'No related request for JSON response';
542
543 /* fetch response attribute and verify returned type */
544 var ret = undefined;
545
546 /* verify message frame */
547 if (typeof(msg[i]) == 'object' && msg[i].jsonrpc == '2.0')
548 if ($.isArray(msg[i].result) && msg[i].result[0] == 0)
549 ret = (msg[i].result.length > 1) ? msg[i].result[1] : msg[i].result[0];
550
551 if (req.expect)
552 {
553 for (var key in req.expect)
554 {
555 if (typeof(ret) != 'undefined' && key != '')
556 ret = ret[key];
557
558 if (typeof(ret) == 'undefined' || type.call(ret) != type.call(req.expect[key]))
559 ret = req.expect[key];
560
561 break;
562 }
563 }
564
565 /* apply filter */
566 if (typeof(req.filter) == 'function')
567 {
568 req.priv[0] = ret;
569 req.priv[1] = req.params;
570 ret = req.filter.apply(L.rpc, req.priv);
571 }
572
573 /* store response data */
574 if (typeof(req.index) == 'number')
575 data[req.index] = ret;
576 else
577 data = ret;
578
579 /* delete request object */
580 delete L.rpc._requests[reqs[i].id];
581 }
582
583 return $.Deferred().resolveWith(this, [ data ]);
584 },
585
586 list: function()
587 {
588 var params = [ ];
589 for (var i = 0; i < arguments.length; i++)
590 params[i] = arguments[i];
591
592 var msg = {
593 jsonrpc: '2.0',
594 id: this._id++,
595 method: 'list',
596 params: (params.length > 0) ? params : undefined
597 };
598
599 return this._call(msg, this._list_cb);
600 },
601
602 batch: function()
603 {
604 if (!$.isArray(this._batch))
605 this._batch = [ ];
606 },
607
608 flush: function()
609 {
610 if (!$.isArray(this._batch))
611 return L.deferrable([ ]);
612
613 var req = this._batch;
614 delete this._batch;
615
616 /* call rpc */
617 return this._call(req, this._call_cb);
618 },
619
620 declare: function(options)
621 {
622 var _rpc = this;
623
624 return function() {
625 /* build parameter object */
626 var p_off = 0;
627 var params = { };
628 if ($.isArray(options.params))
629 for (p_off = 0; p_off < options.params.length; p_off++)
630 params[options.params[p_off]] = arguments[p_off];
631
632 /* all remaining arguments are private args */
633 var priv = [ undefined, undefined ];
634 for (; p_off < arguments.length; p_off++)
635 priv.push(arguments[p_off]);
636
637 /* store request info */
638 var req = _rpc._requests[_rpc._id] = {
639 expect: options.expect,
640 filter: options.filter,
641 params: params,
642 priv: priv
643 };
644
645 /* build message object */
646 var msg = {
647 jsonrpc: '2.0',
648 id: _rpc._id++,
649 method: 'call',
650 params: [
651 L.globals.sid,
652 options.object,
653 options.method,
654 params
655 ]
656 };
657
658 /* when a batch is in progress then store index in request data
659 * and push message object onto the stack */
660 if ($.isArray(_rpc._batch))
661 {
662 req.index = _rpc._batch.push(msg) - 1;
663 return L.deferrable(msg);
664 }
665
666 /* call rpc */
667 return _rpc._call(msg, _rpc._call_cb);
668 };
669 }
670 };
671
672 this.UCIContext = Class.extend({
673
674 init: function()
675 {
676 this.state = {
677 newidx: 0,
678 values: { },
679 creates: { },
680 changes: { },
681 deletes: { },
682 reorder: { }
683 };
684 },
685
686 _load: L.rpc.declare({
687 object: 'uci',
688 method: 'get',
689 params: [ 'config' ],
690 expect: { values: { } }
691 }),
692
693 _order: L.rpc.declare({
694 object: 'uci',
695 method: 'order',
696 params: [ 'config', 'sections' ]
697 }),
698
699 _add: L.rpc.declare({
700 object: 'uci',
701 method: 'add',
702 params: [ 'config', 'type', 'name', 'values' ],
703 expect: { section: '' }
704 }),
705
706 _set: L.rpc.declare({
707 object: 'uci',
708 method: 'set',
709 params: [ 'config', 'section', 'values' ]
710 }),
711
712 _delete: L.rpc.declare({
713 object: 'uci',
714 method: 'delete',
715 params: [ 'config', 'section', 'options' ]
716 }),
717
718 _newid: function(conf)
719 {
720 var v = this.state.values;
721 var n = this.state.creates;
722 var sid;
723
724 do {
725 sid = "new%06x".format(Math.random() * 0xFFFFFF);
726 } while ((n[conf] && n[conf][sid]) || (v[conf] && v[conf][sid]));
727
728 return sid;
729 },
730
731 load: function(packages)
732 {
733 var self = this;
734 var seen = { };
735 var pkgs = [ ];
736
737 if (!$.isArray(packages))
738 packages = [ packages ];
739
740 L.rpc.batch();
741
742 for (var i = 0; i < packages.length; i++)
743 if (!seen[packages[i]] && !self.state.values[packages[i]])
744 {
745 pkgs.push(packages[i]);
746 seen[packages[i]] = true;
747 self._load(packages[i]);
748 }
749
750 return L.rpc.flush().then(function(responses) {
751 for (var i = 0; i < responses.length; i++)
752 self.state.values[pkgs[i]] = responses[i];
753
754 return pkgs;
755 });
756 },
757
758 unload: function(packages)
759 {
760 if (!$.isArray(packages))
761 packages = [ packages ];
762
763 for (var i = 0; i < packages.length; i++)
764 {
765 delete this.state.values[packages[i]];
766 delete this.state.creates[packages[i]];
767 delete this.state.changes[packages[i]];
768 delete this.state.deletes[packages[i]];
769 }
770 },
771
772 add: function(conf, type, name)
773 {
774 var n = this.state.creates;
775 var sid = this._newid(conf);
776
777 if (!n[conf])
778 n[conf] = { };
779
780 n[conf][sid] = {
781 '.type': type,
782 '.name': sid,
783 '.create': name,
784 '.anonymous': !name,
785 '.index': 1000 + this.state.newidx++
786 };
787
788 return sid;
789 },
790
791 remove: function(conf, sid)
792 {
793 var n = this.state.creates;
794 var c = this.state.changes;
795 var d = this.state.deletes;
796
797 /* requested deletion of a just created section */
798 if (n[conf] && n[conf][sid])
799 {
800 delete n[conf][sid];
801 }
802 else
803 {
804 if (c[conf])
805 delete c[conf][sid];
806
807 if (!d[conf])
808 d[conf] = { };
809
810 d[conf][sid] = true;
811 }
812 },
813
814 sections: function(conf, type, cb)
815 {
816 var sa = [ ];
817 var v = this.state.values[conf];
818 var n = this.state.creates[conf];
819 var c = this.state.changes[conf];
820 var d = this.state.deletes[conf];
821
822 if (!v)
823 return sa;
824
825 for (var s in v)
826 if (!d || d[s] !== true)
827 if (!type || v[s]['.type'] == type)
828 sa.push($.extend({ }, v[s], c ? c[s] : undefined));
829
830 if (n)
831 for (var s in n)
832 if (!type || n[s]['.type'] == type)
833 sa.push(n[s]);
834
835 sa.sort(function(a, b) {
836 return a['.index'] - b['.index'];
837 });
838
839 for (var i = 0; i < sa.length; i++)
840 sa[i]['.index'] = i;
841
842 if (typeof(cb) == 'function')
843 for (var i = 0; i < sa.length; i++)
844 cb.call(this, sa[i], sa[i]['.name']);
845
846 return sa;
847 },
848
849 get: function(conf, sid, opt)
850 {
851 var v = this.state.values;
852 var n = this.state.creates;
853 var c = this.state.changes;
854 var d = this.state.deletes;
855
856 if (typeof(sid) == 'undefined')
857 return undefined;
858
859 /* requested option in a just created section */
860 if (n[conf] && n[conf][sid])
861 {
862 if (!n[conf])
863 return undefined;
864
865 if (typeof(opt) == 'undefined')
866 return n[conf][sid];
867
868 return n[conf][sid][opt];
869 }
870
871 /* requested an option value */
872 if (typeof(opt) != 'undefined')
873 {
874 /* check whether option was deleted */
875 if (d[conf] && d[conf][sid])
876 {
877 if (d[conf][sid] === true)
878 return undefined;
879
880 for (var i = 0; i < d[conf][sid].length; i++)
881 if (d[conf][sid][i] == opt)
882 return undefined;
883 }
884
885 /* check whether option was changed */
886 if (c[conf] && c[conf][sid] && typeof(c[conf][sid][opt]) != 'undefined')
887 return c[conf][sid][opt];
888
889 /* return base value */
890 if (v[conf] && v[conf][sid])
891 return v[conf][sid][opt];
892
893 return undefined;
894 }
895
896 /* requested an entire section */
897 if (v[conf])
898 return v[conf][sid];
899
900 return undefined;
901 },
902
903 set: function(conf, sid, opt, val)
904 {
905 var v = this.state.values;
906 var n = this.state.creates;
907 var c = this.state.changes;
908 var d = this.state.deletes;
909
910 if (typeof(sid) == 'undefined' ||
911 typeof(opt) == 'undefined' ||
912 opt.charAt(0) == '.')
913 return;
914
915 if (n[conf] && n[conf][sid])
916 {
917 if (typeof(val) != 'undefined')
918 n[conf][sid][opt] = val;
919 else
920 delete n[conf][sid][opt];
921 }
922 else if (typeof(val) != 'undefined')
923 {
924 /* do not set within deleted section */
925 if (d[conf] && d[conf][sid] === true)
926 return;
927
928 /* only set in existing sections */
929 if (!v[conf] || !v[conf][sid])
930 return;
931
932 if (!c[conf])
933 c[conf] = { };
934
935 if (!c[conf][sid])
936 c[conf][sid] = { };
937
938 /* undelete option */
939 if (d[conf] && d[conf][sid])
940 d[conf][sid] = L.filterArray(d[conf][sid], opt);
941
942 c[conf][sid][opt] = val;
943 }
944 else
945 {
946 /* only delete in existing sections */
947 if (!v[conf] || !v[conf][sid])
948 return;
949
950 if (!d[conf])
951 d[conf] = { };
952
953 if (!d[conf][sid])
954 d[conf][sid] = [ ];
955
956 if (d[conf][sid] !== true)
957 d[conf][sid].push(opt);
958 }
959 },
960
961 unset: function(conf, sid, opt)
962 {
963 return this.set(conf, sid, opt, undefined);
964 },
965
966 _reload: function()
967 {
968 var pkgs = [ ];
969
970 for (var pkg in this.state.values)
971 pkgs.push(pkg);
972
973 this.init();
974
975 return this.load(pkgs);
976 },
977
978 _reorder: function()
979 {
980 var v = this.state.values;
981 var n = this.state.creates;
982 var r = this.state.reorder;
983
984 if ($.isEmptyObject(r))
985 return L.deferrable();
986
987 L.rpc.batch();
988
989 /*
990 gather all created and existing sections, sort them according
991 to their index value and issue an uci order call
992 */
993 for (var c in r)
994 {
995 var o = [ ];
996
997 if (n[c])
998 for (var s in n[c])
999 o.push(n[c][s]);
1000
1001 for (var s in v[c])
1002 o.push(v[c][s]);
1003
1004 if (o.length > 0)
1005 {
1006 o.sort(function(a, b) {
1007 return (a['.index'] - b['.index']);
1008 });
1009
1010 var sids = [ ];
1011
1012 for (var i = 0; i < o.length; i++)
1013 sids.push(o[i]['.name']);
1014
1015 this._order(c, sids);
1016 }
1017 }
1018
1019 this.state.reorder = { };
1020 return L.rpc.flush();
1021 },
1022
1023 swap: function(conf, sid1, sid2)
1024 {
1025 var s1 = this.get(conf, sid1);
1026 var s2 = this.get(conf, sid2);
1027 var n1 = s1 ? s1['.index'] : NaN;
1028 var n2 = s2 ? s2['.index'] : NaN;
1029
1030 if (isNaN(n1) || isNaN(n2))
1031 return false;
1032
1033 s1['.index'] = n2;
1034 s2['.index'] = n1;
1035
1036 this.state.reorder[conf] = true;
1037
1038 return true;
1039 },
1040
1041 save: function()
1042 {
1043 L.rpc.batch();
1044
1045 var v = this.state.values;
1046 var n = this.state.creates;
1047 var c = this.state.changes;
1048 var d = this.state.deletes;
1049
1050 var self = this;
1051 var snew = [ ];
1052 var pkgs = { };
1053
1054 if (n)
1055 for (var conf in n)
1056 {
1057 for (var sid in n[conf])
1058 {
1059 var r = {
1060 config: conf,
1061 values: { }
1062 };
1063
1064 for (var k in n[conf][sid])
1065 {
1066 if (k == '.type')
1067 r.type = n[conf][sid][k];
1068 else if (k == '.create')
1069 r.name = n[conf][sid][k];
1070 else if (k.charAt(0) != '.')
1071 r.values[k] = n[conf][sid][k];
1072 }
1073
1074 snew.push(n[conf][sid]);
1075
1076 self._add(r.config, r.type, r.name, r.values);
1077 }
1078
1079 pkgs[conf] = true;
1080 }
1081
1082 if (c)
1083 for (var conf in c)
1084 {
1085 for (var sid in c[conf])
1086 self._set(conf, sid, c[conf][sid]);
1087
1088 pkgs[conf] = true;
1089 }
1090
1091 if (d)
1092 for (var conf in d)
1093 {
1094 for (var sid in d[conf])
1095 {
1096 var o = d[conf][sid];
1097 self._delete(conf, sid, (o === true) ? undefined : o);
1098 }
1099
1100 pkgs[conf] = true;
1101 }
1102
1103 return L.rpc.flush().then(function(responses) {
1104 /*
1105 array "snew" holds references to the created uci sections,
1106 use it to assign the returned names of the new sections
1107 */
1108 for (var i = 0; i < snew.length; i++)
1109 snew[i]['.name'] = responses[i];
1110
1111 return self._reorder();
1112 }).then(function() {
1113 pkgs = L.toArray(pkgs);
1114
1115 self.unload(pkgs);
1116
1117 return self.load(pkgs);
1118 });
1119 },
1120
1121 _apply: L.rpc.declare({
1122 object: 'uci',
1123 method: 'apply',
1124 params: [ 'timeout', 'rollback' ]
1125 }),
1126
1127 _confirm: L.rpc.declare({
1128 object: 'uci',
1129 method: 'confirm'
1130 }),
1131
1132 apply: function(timeout)
1133 {
1134 var self = this;
1135 var date = new Date();
1136 var deferred = $.Deferred();
1137
1138 if (typeof(timeout) != 'number' || timeout < 1)
1139 timeout = 10;
1140
1141 self._apply(timeout, true).then(function(rv) {
1142 if (rv != 0)
1143 {
1144 deferred.rejectWith(self, [ rv ]);
1145 return;
1146 }
1147
1148 var try_deadline = date.getTime() + 1000 * timeout;
1149 var try_confirm = function()
1150 {
1151 return self._confirm().then(function(rv) {
1152 if (rv != 0)
1153 {
1154 if (date.getTime() < try_deadline)
1155 window.setTimeout(try_confirm, 250);
1156 else
1157 deferred.rejectWith(self, [ rv ]);
1158
1159 return;
1160 }
1161
1162 deferred.resolveWith(self, [ rv ]);
1163 });
1164 };
1165
1166 window.setTimeout(try_confirm, 1000);
1167 });
1168
1169 return deferred;
1170 },
1171
1172 changes: L.rpc.declare({
1173 object: 'uci',
1174 method: 'changes',
1175 expect: { changes: { } }
1176 }),
1177
1178 readable: function(conf)
1179 {
1180 return L.session.hasACL('uci', conf, 'read');
1181 },
1182
1183 writable: function(conf)
1184 {
1185 return L.session.hasACL('uci', conf, 'write');
1186 }
1187 });
1188
1189 this.uci = new this.UCIContext();
1190
1191 this.wireless = {
1192 listDeviceNames: L.rpc.declare({
1193 object: 'iwinfo',
1194 method: 'devices',
1195 expect: { 'devices': [ ] },
1196 filter: function(data) {
1197 data.sort();
1198 return data;
1199 }
1200 }),
1201
1202 getDeviceStatus: L.rpc.declare({
1203 object: 'iwinfo',
1204 method: 'info',
1205 params: [ 'device' ],
1206 expect: { '': { } },
1207 filter: function(data, params) {
1208 if (!$.isEmptyObject(data))
1209 {
1210 data['device'] = params['device'];
1211 return data;
1212 }
1213 return undefined;
1214 }
1215 }),
1216
1217 getAssocList: L.rpc.declare({
1218 object: 'iwinfo',
1219 method: 'assoclist',
1220 params: [ 'device' ],
1221 expect: { results: [ ] },
1222 filter: function(data, params) {
1223 for (var i = 0; i < data.length; i++)
1224 data[i]['device'] = params['device'];
1225
1226 data.sort(function(a, b) {
1227 if (a.bssid < b.bssid)
1228 return -1;
1229 else if (a.bssid > b.bssid)
1230 return 1;
1231 else
1232 return 0;
1233 });
1234
1235 return data;
1236 }
1237 }),
1238
1239 getWirelessStatus: function() {
1240 return this.listDeviceNames().then(function(names) {
1241 L.rpc.batch();
1242
1243 for (var i = 0; i < names.length; i++)
1244 L.wireless.getDeviceStatus(names[i]);
1245
1246 return L.rpc.flush();
1247 }).then(function(networks) {
1248 var rv = { };
1249
1250 var phy_attrs = [
1251 'country', 'channel', 'frequency', 'frequency_offset',
1252 'txpower', 'txpower_offset', 'hwmodes', 'hardware', 'phy'
1253 ];
1254
1255 var net_attrs = [
1256 'ssid', 'bssid', 'mode', 'quality', 'quality_max',
1257 'signal', 'noise', 'bitrate', 'encryption'
1258 ];
1259
1260 for (var i = 0; i < networks.length; i++)
1261 {
1262 var phy = rv[networks[i].phy] || (
1263 rv[networks[i].phy] = { networks: [ ] }
1264 );
1265
1266 var net = {
1267 device: networks[i].device
1268 };
1269
1270 for (var j = 0; j < phy_attrs.length; j++)
1271 phy[phy_attrs[j]] = networks[i][phy_attrs[j]];
1272
1273 for (var j = 0; j < net_attrs.length; j++)
1274 net[net_attrs[j]] = networks[i][net_attrs[j]];
1275
1276 phy.networks.push(net);
1277 }
1278
1279 return rv;
1280 });
1281 },
1282
1283 getAssocLists: function()
1284 {
1285 return this.listDeviceNames().then(function(names) {
1286 L.rpc.batch();
1287
1288 for (var i = 0; i < names.length; i++)
1289 L.wireless.getAssocList(names[i]);
1290
1291 return L.rpc.flush();
1292 }).then(function(assoclists) {
1293 var rv = [ ];
1294
1295 for (var i = 0; i < assoclists.length; i++)
1296 for (var j = 0; j < assoclists[i].length; j++)
1297 rv.push(assoclists[i][j]);
1298
1299 return rv;
1300 });
1301 },
1302
1303 formatEncryption: function(enc)
1304 {
1305 var format_list = function(l, s)
1306 {
1307 var rv = [ ];
1308 for (var i = 0; i < l.length; i++)
1309 rv.push(l[i].toUpperCase());
1310 return rv.join(s ? s : ', ');
1311 }
1312
1313 if (!enc || !enc.enabled)
1314 return L.tr('None');
1315
1316 if (enc.wep)
1317 {
1318 if (enc.wep.length == 2)
1319 return L.tr('WEP Open/Shared') + ' (%s)'.format(format_list(enc.ciphers, ', '));
1320 else if (enc.wep[0] == 'shared')
1321 return L.tr('WEP Shared Auth') + ' (%s)'.format(format_list(enc.ciphers, ', '));
1322 else
1323 return L.tr('WEP Open System') + ' (%s)'.format(format_list(enc.ciphers, ', '));
1324 }
1325 else if (enc.wpa)
1326 {
1327 if (enc.wpa.length == 2)
1328 return L.tr('mixed WPA/WPA2') + ' %s (%s)'.format(
1329 format_list(enc.authentication, '/'),
1330 format_list(enc.ciphers, ', ')
1331 );
1332 else if (enc.wpa[0] == 2)
1333 return 'WPA2 %s (%s)'.format(
1334 format_list(enc.authentication, '/'),
1335 format_list(enc.ciphers, ', ')
1336 );
1337 else
1338 return 'WPA %s (%s)'.format(
1339 format_list(enc.authentication, '/'),
1340 format_list(enc.ciphers, ', ')
1341 );
1342 }
1343
1344 return L.tr('Unknown');
1345 }
1346 };
1347
1348 this.firewall = {
1349 getZoneColor: function(zone)
1350 {
1351 if ($.isPlainObject(zone))
1352 zone = zone.name;
1353
1354 if (zone == 'lan')
1355 return '#90f090';
1356 else if (zone == 'wan')
1357 return '#f09090';
1358
1359 for (var i = 0, hash = 0;
1360 i < zone.length;
1361 hash = zone.charCodeAt(i++) + ((hash << 5) - hash));
1362
1363 for (var i = 0, color = '#';
1364 i < 3;
1365 color += ('00' + ((hash >> i++ * 8) & 0xFF).tostring(16)).slice(-2));
1366
1367 return color;
1368 },
1369
1370 findZoneByNetwork: function(network)
1371 {
1372 var self = this;
1373 var zone = undefined;
1374
1375 return L.uci.sections('firewall', 'zone', function(z) {
1376 if (!z.name || !z.network)
1377 return;
1378
1379 if (!$.isArray(z.network))
1380 z.network = z.network.split(/\s+/);
1381
1382 for (var i = 0; i < z.network.length; i++)
1383 {
1384 if (z.network[i] == network)
1385 {
1386 zone = z;
1387 break;
1388 }
1389 }
1390 }).then(function() {
1391 if (zone)
1392 zone.color = self.getZoneColor(zone);
1393
1394 return zone;
1395 });
1396 }
1397 };
1398
1399 this.NetworkModel = {
1400 _device_blacklist: [
1401 /^gre[0-9]+$/,
1402 /^gretap[0-9]+$/,
1403 /^ifb[0-9]+$/,
1404 /^ip6tnl[0-9]+$/,
1405 /^sit[0-9]+$/,
1406 /^wlan[0-9]+\.sta[0-9]+$/
1407 ],
1408
1409 _cache_functions: [
1410 'protolist', 0, L.rpc.declare({
1411 object: 'network',
1412 method: 'get_proto_handlers',
1413 expect: { '': { } }
1414 }),
1415 'ifstate', 1, L.rpc.declare({
1416 object: 'network.interface',
1417 method: 'dump',
1418 expect: { 'interface': [ ] }
1419 }),
1420 'devstate', 2, L.rpc.declare({
1421 object: 'network.device',
1422 method: 'status',
1423 expect: { '': { } }
1424 }),
1425 'wifistate', 0, L.rpc.declare({
1426 object: 'network.wireless',
1427 method: 'status',
1428 expect: { '': { } }
1429 }),
1430 'bwstate', 2, L.rpc.declare({
1431 object: 'luci2.network.bwmon',
1432 method: 'statistics',
1433 expect: { 'statistics': { } }
1434 }),
1435 'devlist', 2, L.rpc.declare({
1436 object: 'luci2.network',
1437 method: 'device_list',
1438 expect: { 'devices': [ ] }
1439 }),
1440 'swlist', 0, L.rpc.declare({
1441 object: 'luci2.network',
1442 method: 'switch_list',
1443 expect: { 'switches': [ ] }
1444 })
1445 ],
1446
1447 _fetch_protocol: function(proto)
1448 {
1449 var url = L.globals.resource + '/proto/' + proto + '.js';
1450 var self = L.NetworkModel;
1451
1452 var def = $.Deferred();
1453
1454 $.ajax(url, {
1455 method: 'GET',
1456 cache: true,
1457 dataType: 'text'
1458 }).then(function(data) {
1459 try {
1460 var protoConstructorSource = (
1461 '(function(L, $) { ' +
1462 'return %s' +
1463 '})(L, $);\n\n' +
1464 '//@ sourceURL=%s'
1465 ).format(data, url);
1466
1467 var protoClass = eval(protoConstructorSource);
1468
1469 self._protos[proto] = new protoClass();
1470 }
1471 catch(e) {
1472 alert('Unable to instantiate proto "%s": %s'.format(url, e));
1473 };
1474
1475 def.resolve();
1476 }).fail(function() {
1477 def.resolve();
1478 });
1479
1480 return def;
1481 },
1482
1483 _fetch_protocols: function()
1484 {
1485 var self = L.NetworkModel;
1486 var deferreds = [ ];
1487
1488 for (var proto in self._cache.protolist)
1489 deferreds.push(self._fetch_protocol(proto));
1490
1491 return $.when.apply($, deferreds);
1492 },
1493
1494 _fetch_swstate: L.rpc.declare({
1495 object: 'luci2.network',
1496 method: 'switch_info',
1497 params: [ 'switch' ],
1498 expect: { 'info': { } }
1499 }),
1500
1501 _fetch_swstate_cb: function(responses) {
1502 var self = L.NetworkModel;
1503 var swlist = self._cache.swlist;
1504 var swstate = self._cache.swstate = { };
1505
1506 for (var i = 0; i < responses.length; i++)
1507 swstate[swlist[i]] = responses[i];
1508 },
1509
1510 _fetch_cache_cb: function(level)
1511 {
1512 var self = L.NetworkModel;
1513 var name = '_fetch_cache_cb_' + level;
1514
1515 return self[name] || (
1516 self[name] = function(responses)
1517 {
1518 for (var i = 0; i < self._cache_functions.length; i += 3)
1519 if (!level || self._cache_functions[i + 1] == level)
1520 self._cache[self._cache_functions[i]] = responses.shift();
1521
1522 if (!level)
1523 {
1524 L.rpc.batch();
1525
1526 for (var i = 0; i < self._cache.swlist.length; i++)
1527 self._fetch_swstate(self._cache.swlist[i]);
1528
1529 return L.rpc.flush().then(self._fetch_swstate_cb);
1530 }
1531
1532 return L.deferrable();
1533 }
1534 );
1535 },
1536
1537 _fetch_cache: function(level)
1538 {
1539 var self = L.NetworkModel;
1540
1541 return L.uci.load(['network', 'wireless']).then(function() {
1542 L.rpc.batch();
1543
1544 for (var i = 0; i < self._cache_functions.length; i += 3)
1545 if (!level || self._cache_functions[i + 1] == level)
1546 self._cache_functions[i + 2]();
1547
1548 return L.rpc.flush().then(self._fetch_cache_cb(level || 0));
1549 });
1550 },
1551
1552 _get: function(pkg, sid, key)
1553 {
1554 return L.uci.get(pkg, sid, key);
1555 },
1556
1557 _set: function(pkg, sid, key, val)
1558 {
1559 return L.uci.set(pkg, sid, key, val);
1560 },
1561
1562 _is_blacklisted: function(dev)
1563 {
1564 for (var i = 0; i < this._device_blacklist.length; i++)
1565 if (dev.match(this._device_blacklist[i]))
1566 return true;
1567
1568 return false;
1569 },
1570
1571 _sort_devices: function(a, b)
1572 {
1573 if (a.options.kind < b.options.kind)
1574 return -1;
1575 else if (a.options.kind > b.options.kind)
1576 return 1;
1577
1578 if (a.options.name < b.options.name)
1579 return -1;
1580 else if (a.options.name > b.options.name)
1581 return 1;
1582
1583 return 0;
1584 },
1585
1586 _get_dev: function(ifname)
1587 {
1588 var alias = (ifname.charAt(0) == '@');
1589 return this._devs[ifname] || (
1590 this._devs[ifname] = {
1591 ifname: ifname,
1592 kind: alias ? 'alias' : 'ethernet',
1593 type: alias ? 0 : 1,
1594 up: false,
1595 changed: { }
1596 }
1597 );
1598 },
1599
1600 _get_iface: function(name)
1601 {
1602 return this._ifaces[name] || (
1603 this._ifaces[name] = {
1604 name: name,
1605 proto: this._protos.none,
1606 changed: { }
1607 }
1608 );
1609 },
1610
1611 _parse_devices: function()
1612 {
1613 var self = L.NetworkModel;
1614 var wificount = { };
1615
1616 for (var ifname in self._cache.devstate)
1617 {
1618 if (self._is_blacklisted(ifname))
1619 continue;
1620
1621 var dev = self._cache.devstate[ifname];
1622 var entry = self._get_dev(ifname);
1623
1624 entry.up = dev.up;
1625
1626 switch (dev.type)
1627 {
1628 case 'IP tunnel':
1629 entry.kind = 'tunnel';
1630 break;
1631
1632 case 'Bridge':
1633 entry.kind = 'bridge';
1634 //entry.ports = dev['bridge-members'].sort();
1635 break;
1636 }
1637 }
1638
1639 for (var i = 0; i < self._cache.devlist.length; i++)
1640 {
1641 var dev = self._cache.devlist[i];
1642
1643 if (self._is_blacklisted(dev.device))
1644 continue;
1645
1646 var entry = self._get_dev(dev.device);
1647
1648 entry.up = dev.is_up;
1649 entry.type = dev.type;
1650
1651 switch (dev.type)
1652 {
1653 case 1: /* Ethernet */
1654 if (dev.is_bridge)
1655 entry.kind = 'bridge';
1656 else if (dev.is_tuntap)
1657 entry.kind = 'tunnel';
1658 else if (dev.is_wireless)
1659 entry.kind = 'wifi';
1660 break;
1661
1662 case 512: /* PPP */
1663 case 768: /* IP-IP Tunnel */
1664 case 769: /* IP6-IP6 Tunnel */
1665 case 776: /* IPv6-in-IPv4 */
1666 case 778: /* GRE over IP */
1667 entry.kind = 'tunnel';
1668 break;
1669 }
1670 }
1671
1672 var net = L.uci.sections('network');
1673 for (var i = 0; i < net.length; i++)
1674 {
1675 var s = net[i];
1676 var sid = s['.name'];
1677
1678 if (s['.type'] == 'device' && s.name)
1679 {
1680 var entry = self._get_dev(s.name);
1681
1682 switch (s.type)
1683 {
1684 case 'macvlan':
1685 case 'tunnel':
1686 entry.kind = 'tunnel';
1687 break;
1688 }
1689
1690 entry.sid = sid;
1691 }
1692 else if (s['.type'] == 'interface' && !s['.anonymous'] && s.ifname)
1693 {
1694 var ifnames = L.toArray(s.ifname);
1695
1696 for (var j = 0; j < ifnames.length; j++)
1697 self._get_dev(ifnames[j]);
1698
1699 if (s['.name'] != 'loopback')
1700 {
1701 var entry = self._get_dev('@%s'.format(s['.name']));
1702
1703 entry.type = 0;
1704 entry.kind = 'alias';
1705 entry.sid = sid;
1706 }
1707 }
1708 else if (s['.type'] == 'switch_vlan' && s.device)
1709 {
1710 var sw = self._cache.swstate[s.device];
1711 var vid = parseInt(s.vid || s.vlan);
1712 var ports = L.toArray(s.ports);
1713
1714 if (!sw || !ports.length || isNaN(vid))
1715 continue;
1716
1717 var ifname = undefined;
1718
1719 for (var j = 0; j < ports.length; j++)
1720 {
1721 var port = parseInt(ports[j]);
1722 var tag = (ports[j].replace(/[^tu]/g, '') == 't');
1723
1724 if (port == sw.cpu_port)
1725 {
1726 // XXX: need a way to map switch to netdev
1727 if (tag)
1728 ifname = 'eth0.%d'.format(vid);
1729 else
1730 ifname = 'eth0';
1731
1732 break;
1733 }
1734 }
1735
1736 if (!ifname)
1737 continue;
1738
1739 var entry = self._get_dev(ifname);
1740
1741 entry.kind = 'vlan';
1742 entry.sid = sid;
1743 entry.vsw = sw;
1744 entry.vid = vid;
1745 }
1746 }
1747
1748 var wifi = L.uci.sections('wireless');
1749 for (var i = 0; i < wifi.length; i++)
1750 {
1751 var s = wifi[i];
1752 var sid = s['.name'];
1753
1754 if (s['.type'] == 'wifi-iface' && s.device)
1755 {
1756 var r = parseInt(s.device.replace(/^[^0-9]+/, ''));
1757 var n = wificount[s.device] = (wificount[s.device] || 0) + 1;
1758 var id = 'radio%d.network%d'.format(r, n);
1759 var ifname = id;
1760
1761 if (self._cache.wifistate[s.device])
1762 {
1763 var ifcs = self._cache.wifistate[s.device].interfaces;
1764 for (var ifc in ifcs)
1765 {
1766 if (ifcs[ifc].section == sid)
1767 {
1768 ifname = ifcs[ifc].ifname;
1769 break;
1770 }
1771 }
1772 }
1773
1774 var entry = self._get_dev(ifname);
1775
1776 entry.kind = 'wifi';
1777 entry.sid = sid;
1778 entry.wid = id;
1779 entry.wdev = s.device;
1780 entry.wmode = s.mode;
1781 entry.wssid = s.ssid;
1782 entry.wbssid = s.bssid;
1783 }
1784 }
1785
1786 for (var i = 0; i < net.length; i++)
1787 {
1788 var s = net[i];
1789 var sid = s['.name'];
1790
1791 if (s['.type'] == 'interface' && !s['.anonymous'] && s.type == 'bridge')
1792 {
1793 var ifnames = L.toArray(s.ifname);
1794
1795 for (var ifname in self._devs)
1796 {
1797 var dev = self._devs[ifname];
1798
1799 if (dev.kind != 'wifi')
1800 continue;
1801
1802 var wnets = L.toArray(L.uci.get('wireless', dev.sid, 'network'));
1803 if ($.inArray(sid, wnets) > -1)
1804 ifnames.push(ifname);
1805 }
1806
1807 entry = self._get_dev('br-%s'.format(s['.name']));
1808 entry.type = 1;
1809 entry.kind = 'bridge';
1810 entry.sid = sid;
1811 entry.ports = ifnames.sort();
1812 }
1813 }
1814 },
1815
1816 _parse_interfaces: function()
1817 {
1818 var self = L.NetworkModel;
1819 var net = L.uci.sections('network');
1820
1821 for (var i = 0; i < net.length; i++)
1822 {
1823 var s = net[i];
1824 var sid = s['.name'];
1825
1826 if (s['.type'] == 'interface' && !s['.anonymous'] && s.proto)
1827 {
1828 var entry = self._get_iface(s['.name']);
1829 var proto = self._protos[s.proto] || self._protos.none;
1830
1831 var l3dev = undefined;
1832 var l2dev = undefined;
1833
1834 var ifnames = L.toArray(s.ifname);
1835
1836 for (var ifname in self._devs)
1837 {
1838 var dev = self._devs[ifname];
1839
1840 if (dev.kind != 'wifi')
1841 continue;
1842
1843 var wnets = L.toArray(L.uci.get('wireless', dev.sid, 'network'));
1844 if ($.inArray(entry.name, wnets) > -1)
1845 ifnames.push(ifname);
1846 }
1847
1848 if (proto.virtual)
1849 l3dev = '%s-%s'.format(s.proto, entry.name);
1850 else if (s.type == 'bridge')
1851 l3dev = 'br-%s'.format(entry.name);
1852 else
1853 l3dev = ifnames[0];
1854
1855 if (!proto.virtual && s.type == 'bridge')
1856 l2dev = 'br-%s'.format(entry.name);
1857 else if (!proto.virtual)
1858 l2dev = ifnames[0];
1859
1860 entry.proto = proto;
1861 entry.sid = sid;
1862 entry.l3dev = l3dev;
1863 entry.l2dev = l2dev;
1864 }
1865 }
1866
1867 for (var i = 0; i < self._cache.ifstate.length; i++)
1868 {
1869 var iface = self._cache.ifstate[i];
1870 var entry = self._get_iface(iface['interface']);
1871 var proto = self._protos[iface.proto] || self._protos.none;
1872
1873 /* this is a virtual interface, either deleted from config but
1874 not applied yet or set up from external tools (6rd) */
1875 if (!entry.sid)
1876 {
1877 entry.proto = proto;
1878 entry.l2dev = iface.device;
1879 entry.l3dev = iface.l3_device;
1880 }
1881 }
1882 },
1883
1884 init: function()
1885 {
1886 var self = this;
1887
1888 if (self._cache)
1889 return L.deferrable();
1890
1891 self._cache = { };
1892 self._devs = { };
1893 self._ifaces = { };
1894 self._protos = { };
1895
1896 return self._fetch_cache()
1897 .then(self._fetch_protocols)
1898 .then(self._parse_devices)
1899 .then(self._parse_interfaces);
1900 },
1901
1902 update: function()
1903 {
1904 delete this._cache;
1905 return this.init();
1906 },
1907
1908 refreshInterfaceStatus: function()
1909 {
1910 return this._fetch_cache(1).then(this._parse_interfaces);
1911 },
1912
1913 refreshDeviceStatus: function()
1914 {
1915 return this._fetch_cache(2).then(this._parse_devices);
1916 },
1917
1918 refreshStatus: function()
1919 {
1920 return this._fetch_cache(1)
1921 .then(this._fetch_cache(2))
1922 .then(this._parse_devices)
1923 .then(this._parse_interfaces);
1924 },
1925
1926 getDevices: function()
1927 {
1928 var devs = [ ];
1929
1930 for (var ifname in this._devs)
1931 if (ifname != 'lo')
1932 devs.push(new L.NetworkModel.Device(this._devs[ifname]));
1933
1934 return devs.sort(this._sort_devices);
1935 },
1936
1937 getDeviceByInterface: function(iface)
1938 {
1939 if (iface instanceof L.NetworkModel.Interface)
1940 iface = iface.name();
1941
1942 if (this._ifaces[iface])
1943 return this.getDevice(this._ifaces[iface].l3dev) ||
1944 this.getDevice(this._ifaces[iface].l2dev);
1945
1946 return undefined;
1947 },
1948
1949 getDevice: function(ifname)
1950 {
1951 if (this._devs[ifname])
1952 return new L.NetworkModel.Device(this._devs[ifname]);
1953
1954 return undefined;
1955 },
1956
1957 createDevice: function(name)
1958 {
1959 return new L.NetworkModel.Device(this._get_dev(name));
1960 },
1961
1962 getInterfaces: function()
1963 {
1964 var ifaces = [ ];
1965
1966 for (var name in this._ifaces)
1967 if (name != 'loopback')
1968 ifaces.push(this.getInterface(name));
1969
1970 ifaces.sort(function(a, b) {
1971 if (a.name() < b.name())
1972 return -1;
1973 else if (a.name() > b.name())
1974 return 1;
1975 else
1976 return 0;
1977 });
1978
1979 return ifaces;
1980 },
1981
1982 getInterfacesByDevice: function(dev)
1983 {
1984 var ifaces = [ ];
1985
1986 if (dev instanceof L.NetworkModel.Device)
1987 dev = dev.name();
1988
1989 for (var name in this._ifaces)
1990 {
1991 var iface = this._ifaces[name];
1992 if (iface.l2dev == dev || iface.l3dev == dev)
1993 ifaces.push(this.getInterface(name));
1994 }
1995
1996 ifaces.sort(function(a, b) {
1997 if (a.name() < b.name())
1998 return -1;
1999 else if (a.name() > b.name())
2000 return 1;
2001 else
2002 return 0;
2003 });
2004
2005 return ifaces;
2006 },
2007
2008 getInterface: function(iface)
2009 {
2010 if (this._ifaces[iface])
2011 return new L.NetworkModel.Interface(this._ifaces[iface]);
2012
2013 return undefined;
2014 },
2015
2016 getProtocols: function()
2017 {
2018 var rv = [ ];
2019
2020 for (var proto in this._protos)
2021 {
2022 var pr = this._protos[proto];
2023
2024 rv.push({
2025 name: proto,
2026 description: pr.description,
2027 virtual: pr.virtual,
2028 tunnel: pr.tunnel
2029 });
2030 }
2031
2032 return rv.sort(function(a, b) {
2033 if (a.name < b.name)
2034 return -1;
2035 else if (a.name > b.name)
2036 return 1;
2037 else
2038 return 0;
2039 });
2040 },
2041
2042 _find_wan: function(ipaddr)
2043 {
2044 for (var i = 0; i < this._cache.ifstate.length; i++)
2045 {
2046 var ifstate = this._cache.ifstate[i];
2047
2048 if (!ifstate.route)
2049 continue;
2050
2051 for (var j = 0; j < ifstate.route.length; j++)
2052 if (ifstate.route[j].mask == 0 &&
2053 ifstate.route[j].target == ipaddr &&
2054 typeof(ifstate.route[j].table) == 'undefined')
2055 {
2056 return this.getInterface(ifstate['interface']);
2057 }
2058 }
2059
2060 return undefined;
2061 },
2062
2063 findWAN: function()
2064 {
2065 return this._find_wan('0.0.0.0');
2066 },
2067
2068 findWAN6: function()
2069 {
2070 return this._find_wan('::');
2071 },
2072
2073 resolveAlias: function(ifname)
2074 {
2075 if (ifname instanceof L.NetworkModel.Device)
2076 ifname = ifname.name();
2077
2078 var dev = this._devs[ifname];
2079 var seen = { };
2080
2081 while (dev && dev.kind == 'alias')
2082 {
2083 // loop
2084 if (seen[dev.ifname])
2085 return undefined;
2086
2087 var ifc = this._ifaces[dev.sid];
2088
2089 seen[dev.ifname] = true;
2090 dev = ifc ? this._devs[ifc.l3dev] : undefined;
2091 }
2092
2093 return dev ? this.getDevice(dev.ifname) : undefined;
2094 }
2095 };
2096
2097 this.NetworkModel.Device = Class.extend({
2098 _wifi_modes: {
2099 ap: L.tr('Master'),
2100 sta: L.tr('Client'),
2101 adhoc: L.tr('Ad-Hoc'),
2102 monitor: L.tr('Monitor'),
2103 wds: L.tr('Static WDS')
2104 },
2105
2106 _status: function(key)
2107 {
2108 var s = L.NetworkModel._cache.devstate[this.options.ifname];
2109
2110 if (s)
2111 return key ? s[key] : s;
2112
2113 return undefined;
2114 },
2115
2116 get: function(key)
2117 {
2118 var sid = this.options.sid;
2119 var pkg = (this.options.kind == 'wifi') ? 'wireless' : 'network';
2120 return L.NetworkModel._get(pkg, sid, key);
2121 },
2122
2123 set: function(key, val)
2124 {
2125 var sid = this.options.sid;
2126 var pkg = (this.options.kind == 'wifi') ? 'wireless' : 'network';
2127 return L.NetworkModel._set(pkg, sid, key, val);
2128 },
2129
2130 init: function()
2131 {
2132 if (typeof(this.options.type) == 'undefined')
2133 this.options.type = 1;
2134
2135 if (typeof(this.options.kind) == 'undefined')
2136 this.options.kind = 'ethernet';
2137
2138 if (typeof(this.options.networks) == 'undefined')
2139 this.options.networks = [ ];
2140 },
2141
2142 name: function()
2143 {
2144 return this.options.ifname;
2145 },
2146
2147 description: function()
2148 {
2149 switch (this.options.kind)
2150 {
2151 case 'alias':
2152 return L.tr('Alias for network "%s"').format(this.options.ifname.substring(1));
2153
2154 case 'bridge':
2155 return L.tr('Network bridge');
2156
2157 case 'ethernet':
2158 return L.tr('Network device');
2159
2160 case 'tunnel':
2161 switch (this.options.type)
2162 {
2163 case 1: /* tuntap */
2164 return L.tr('TAP device');
2165
2166 case 512: /* PPP */
2167 return L.tr('PPP tunnel');
2168
2169 case 768: /* IP-IP Tunnel */
2170 return L.tr('IP-in-IP tunnel');
2171
2172 case 769: /* IP6-IP6 Tunnel */
2173 return L.tr('IPv6-in-IPv6 tunnel');
2174
2175 case 776: /* IPv6-in-IPv4 */
2176 return L.tr('IPv6-over-IPv4 tunnel');
2177 break;
2178
2179 case 778: /* GRE over IP */
2180 return L.tr('GRE-over-IP tunnel');
2181
2182 default:
2183 return L.tr('Tunnel device');
2184 }
2185
2186 case 'vlan':
2187 return L.tr('VLAN %d on %s').format(this.options.vid, this.options.vsw.model);
2188
2189 case 'wifi':
2190 var o = this.options;
2191 return L.trc('(Wifi-Mode) "(SSID)" on (radioX)', '%s "%h" on %s').format(
2192 o.wmode ? this._wifi_modes[o.wmode] : L.tr('Unknown mode'),
2193 o.wssid || '?', o.wdev
2194 );
2195 }
2196
2197 return L.tr('Unknown device');
2198 },
2199
2200 icon: function(up)
2201 {
2202 var kind = this.options.kind;
2203
2204 if (kind == 'alias')
2205 kind = 'ethernet';
2206
2207 if (typeof(up) == 'undefined')
2208 up = this.isUp();
2209
2210 return L.globals.resource + '/icons/%s%s.png'.format(kind, up ? '' : '_disabled');
2211 },
2212
2213 isUp: function()
2214 {
2215 var l = L.NetworkModel._cache.devlist;
2216
2217 for (var i = 0; i < l.length; i++)
2218 if (l[i].device == this.options.ifname)
2219 return (l[i].is_up === true);
2220
2221 return false;
2222 },
2223
2224 isAlias: function()
2225 {
2226 return (this.options.kind == 'alias');
2227 },
2228
2229 isBridge: function()
2230 {
2231 return (this.options.kind == 'bridge');
2232 },
2233
2234 isBridgeable: function()
2235 {
2236 return (this.options.type == 1 && this.options.kind != 'bridge');
2237 },
2238
2239 isWireless: function()
2240 {
2241 return (this.options.kind == 'wifi');
2242 },
2243
2244 isInNetwork: function(net)
2245 {
2246 if (!(net instanceof L.NetworkModel.Interface))
2247 net = L.NetworkModel.getInterface(net);
2248
2249 if (net)
2250 {
2251 if (net.options.l3dev == this.options.ifname ||
2252 net.options.l2dev == this.options.ifname)
2253 return true;
2254
2255 var dev = L.NetworkModel._devs[net.options.l2dev];
2256 if (dev && dev.kind == 'bridge' && dev.ports)
2257 return ($.inArray(this.options.ifname, dev.ports) > -1);
2258 }
2259
2260 return false;
2261 },
2262
2263 getMTU: function()
2264 {
2265 var dev = L.NetworkModel._cache.devstate[this.options.ifname];
2266 if (dev && !isNaN(dev.mtu))
2267 return dev.mtu;
2268
2269 return undefined;
2270 },
2271
2272 getMACAddress: function()
2273 {
2274 if (this.options.type != 1)
2275 return undefined;
2276
2277 var dev = L.NetworkModel._cache.devstate[this.options.ifname];
2278 if (dev && dev.macaddr)
2279 return dev.macaddr.toUpperCase();
2280
2281 return undefined;
2282 },
2283
2284 getInterfaces: function()
2285 {
2286 return L.NetworkModel.getInterfacesByDevice(this.options.name);
2287 },
2288
2289 getStatistics: function()
2290 {
2291 var s = this._status('statistics') || { };
2292 return {
2293 rx_bytes: (s.rx_bytes || 0),
2294 tx_bytes: (s.tx_bytes || 0),
2295 rx_packets: (s.rx_packets || 0),
2296 tx_packets: (s.tx_packets || 0)
2297 };
2298 },
2299
2300 getTrafficHistory: function()
2301 {
2302 var def = new Array(120);
2303
2304 for (var i = 0; i < 120; i++)
2305 def[i] = 0;
2306
2307 var h = L.NetworkModel._cache.bwstate[this.options.ifname] || { };
2308 return {
2309 rx_bytes: (h.rx_bytes || def),
2310 tx_bytes: (h.tx_bytes || def),
2311 rx_packets: (h.rx_packets || def),
2312 tx_packets: (h.tx_packets || def)
2313 };
2314 },
2315
2316 removeFromInterface: function(iface)
2317 {
2318 if (!(iface instanceof L.NetworkModel.Interface))
2319 iface = L.NetworkModel.getInterface(iface);
2320
2321 if (!iface)
2322 return;
2323
2324 var ifnames = L.toArray(iface.get('ifname'));
2325 if ($.inArray(this.options.ifname, ifnames) > -1)
2326 iface.set('ifname', L.filterArray(ifnames, this.options.ifname));
2327
2328 if (this.options.kind != 'wifi')
2329 return;
2330
2331 var networks = L.toArray(this.get('network'));
2332 if ($.inArray(iface.name(), networks) > -1)
2333 this.set('network', L.filterArray(networks, iface.name()));
2334 },
2335
2336 attachToInterface: function(iface)
2337 {
2338 if (!(iface instanceof L.NetworkModel.Interface))
2339 iface = L.NetworkModel.getInterface(iface);
2340
2341 if (!iface)
2342 return;
2343
2344 if (this.options.kind != 'wifi')
2345 {
2346 var ifnames = L.toArray(iface.get('ifname'));
2347 if ($.inArray(this.options.ifname, ifnames) < 0)
2348 {
2349 ifnames.push(this.options.ifname);
2350 iface.set('ifname', (ifnames.length > 1) ? ifnames : ifnames[0]);
2351 }
2352 }
2353 else
2354 {
2355 var networks = L.toArray(this.get('network'));
2356 if ($.inArray(iface.name(), networks) < 0)
2357 {
2358 networks.push(iface.name());
2359 this.set('network', (networks.length > 1) ? networks : networks[0]);
2360 }
2361 }
2362 }
2363 });
2364
2365 this.NetworkModel.Interface = Class.extend({
2366 _status: function(key)
2367 {
2368 var s = L.NetworkModel._cache.ifstate;
2369
2370 for (var i = 0; i < s.length; i++)
2371 if (s[i]['interface'] == this.options.name)
2372 return key ? s[i][key] : s[i];
2373
2374 return undefined;
2375 },
2376
2377 get: function(key)
2378 {
2379 return L.NetworkModel._get('network', this.options.name, key);
2380 },
2381
2382 set: function(key, val)
2383 {
2384 return L.NetworkModel._set('network', this.options.name, key, val);
2385 },
2386
2387 name: function()
2388 {
2389 return this.options.name;
2390 },
2391
2392 protocol: function()
2393 {
2394 return (this.get('proto') || 'none');
2395 },
2396
2397 isUp: function()
2398 {
2399 return (this._status('up') === true);
2400 },
2401
2402 isVirtual: function()
2403 {
2404 return (typeof(this.options.sid) != 'string');
2405 },
2406
2407 getProtocol: function()
2408 {
2409 var prname = this.get('proto') || 'none';
2410 return L.NetworkModel._protos[prname] || L.NetworkModel._protos.none;
2411 },
2412
2413 getUptime: function()
2414 {
2415 var uptime = this._status('uptime');
2416 return isNaN(uptime) ? 0 : uptime;
2417 },
2418
2419 getDevice: function(resolveAlias)
2420 {
2421 if (this.options.l3dev)
2422 return L.NetworkModel.getDevice(this.options.l3dev);
2423
2424 return undefined;
2425 },
2426
2427 getPhysdev: function()
2428 {
2429 if (this.options.l2dev)
2430 return L.NetworkModel.getDevice(this.options.l2dev);
2431
2432 return undefined;
2433 },
2434
2435 getSubdevices: function()
2436 {
2437 var rv = [ ];
2438 var dev = this.options.l2dev ?
2439 L.NetworkModel._devs[this.options.l2dev] : undefined;
2440
2441 if (dev && dev.kind == 'bridge' && dev.ports && dev.ports.length)
2442 for (var i = 0; i < dev.ports.length; i++)
2443 rv.push(L.NetworkModel.getDevice(dev.ports[i]));
2444
2445 return rv;
2446 },
2447
2448 getIPv4Addrs: function(mask)
2449 {
2450 var rv = [ ];
2451 var addrs = this._status('ipv4-address');
2452
2453 if (addrs)
2454 for (var i = 0; i < addrs.length; i++)
2455 if (!mask)
2456 rv.push(addrs[i].address);
2457 else
2458 rv.push('%s/%d'.format(addrs[i].address, addrs[i].mask));
2459
2460 return rv;
2461 },
2462
2463 getIPv6Addrs: function(mask)
2464 {
2465 var rv = [ ];
2466 var addrs;
2467
2468 addrs = this._status('ipv6-address');
2469
2470 if (addrs)
2471 for (var i = 0; i < addrs.length; i++)
2472 if (!mask)
2473 rv.push(addrs[i].address);
2474 else
2475 rv.push('%s/%d'.format(addrs[i].address, addrs[i].mask));
2476
2477 addrs = this._status('ipv6-prefix-assignment');
2478
2479 if (addrs)
2480 for (var i = 0; i < addrs.length; i++)
2481 if (!mask)
2482 rv.push('%s1'.format(addrs[i].address));
2483 else
2484 rv.push('%s1/%d'.format(addrs[i].address, addrs[i].mask));
2485
2486 return rv;
2487 },
2488
2489 getDNSAddrs: function()
2490 {
2491 var rv = [ ];
2492 var addrs = this._status('dns-server');
2493
2494 if (addrs)
2495 for (var i = 0; i < addrs.length; i++)
2496 rv.push(addrs[i]);
2497
2498 return rv;
2499 },
2500
2501 getIPv4DNS: function()
2502 {
2503 var rv = [ ];
2504 var dns = this._status('dns-server');
2505
2506 if (dns)
2507 for (var i = 0; i < dns.length; i++)
2508 if (dns[i].indexOf(':') == -1)
2509 rv.push(dns[i]);
2510
2511 return rv;
2512 },
2513
2514 getIPv6DNS: function()
2515 {
2516 var rv = [ ];
2517 var dns = this._status('dns-server');
2518
2519 if (dns)
2520 for (var i = 0; i < dns.length; i++)
2521 if (dns[i].indexOf(':') > -1)
2522 rv.push(dns[i]);
2523
2524 return rv;
2525 },
2526
2527 getIPv4Gateway: function()
2528 {
2529 var rt = this._status('route');
2530
2531 if (rt)
2532 for (var i = 0; i < rt.length; i++)
2533 if (rt[i].target == '0.0.0.0' && rt[i].mask == 0)
2534 return rt[i].nexthop;
2535
2536 return undefined;
2537 },
2538
2539 getIPv6Gateway: function()
2540 {
2541 var rt = this._status('route');
2542
2543 if (rt)
2544 for (var i = 0; i < rt.length; i++)
2545 if (rt[i].target == '::' && rt[i].mask == 0)
2546 return rt[i].nexthop;
2547
2548 return undefined;
2549 },
2550
2551 getStatistics: function()
2552 {
2553 var dev = this.getDevice() || new L.NetworkModel.Device({});
2554 return dev.getStatistics();
2555 },
2556
2557 getTrafficHistory: function()
2558 {
2559 var dev = this.getDevice() || new L.NetworkModel.Device({});
2560 return dev.getTrafficHistory();
2561 },
2562
2563 setDevices: function(devs)
2564 {
2565 var dev = this.getPhysdev();
2566 var old_devs = [ ];
2567 var changed = false;
2568
2569 if (dev && dev.isBridge())
2570 old_devs = this.getSubdevices();
2571 else if (dev)
2572 old_devs = [ dev ];
2573
2574 if (old_devs.length != devs.length)
2575 changed = true;
2576 else
2577 for (var i = 0; i < old_devs.length; i++)
2578 {
2579 var dev = devs[i];
2580
2581 if (dev instanceof L.NetworkModel.Device)
2582 dev = dev.name();
2583
2584 if (!dev || old_devs[i].name() != dev)
2585 {
2586 changed = true;
2587 break;
2588 }
2589 }
2590
2591 if (changed)
2592 {
2593 for (var i = 0; i < old_devs.length; i++)
2594 old_devs[i].removeFromInterface(this);
2595
2596 for (var i = 0; i < devs.length; i++)
2597 {
2598 var dev = devs[i];
2599
2600 if (!(dev instanceof L.NetworkModel.Device))
2601 dev = L.NetworkModel.getDevice(dev);
2602
2603 if (dev)
2604 dev.attachToInterface(this);
2605 }
2606 }
2607 },
2608
2609 changeProtocol: function(proto)
2610 {
2611 var pr = L.NetworkModel._protos[proto];
2612
2613 if (!pr)
2614 return;
2615
2616 for (var opt in (this.get() || { }))
2617 {
2618 switch (opt)
2619 {
2620 case 'type':
2621 case 'ifname':
2622 case 'macaddr':
2623 if (pr.virtual)
2624 this.set(opt, undefined);
2625 break;
2626
2627 case 'auto':
2628 case 'mtu':
2629 break;
2630
2631 case 'proto':
2632 this.set(opt, pr.protocol);
2633 break;
2634
2635 default:
2636 this.set(opt, undefined);
2637 break;
2638 }
2639 }
2640 },
2641
2642 createForm: function(mapwidget)
2643 {
2644 var self = this;
2645 var proto = self.getProtocol();
2646 var device = self.getDevice();
2647
2648 if (!mapwidget)
2649 mapwidget = L.cbi.Map;
2650
2651 var map = new mapwidget('network', {
2652 caption: L.tr('Configure "%s"').format(self.name())
2653 });
2654
2655 var section = map.section(L.cbi.SingleSection, self.name(), {
2656 anonymous: true
2657 });
2658
2659 section.tab({
2660 id: 'general',
2661 caption: L.tr('General Settings')
2662 });
2663
2664 section.tab({
2665 id: 'advanced',
2666 caption: L.tr('Advanced Settings')
2667 });
2668
2669 section.tab({
2670 id: 'ipv6',
2671 caption: L.tr('IPv6')
2672 });
2673
2674 section.tab({
2675 id: 'physical',
2676 caption: L.tr('Physical Settings')
2677 });
2678
2679
2680 section.taboption('general', L.cbi.CheckboxValue, 'auto', {
2681 caption: L.tr('Start on boot'),
2682 optional: true,
2683 initial: true
2684 });
2685
2686 var pr = section.taboption('general', L.cbi.ListValue, 'proto', {
2687 caption: L.tr('Protocol')
2688 });
2689
2690 pr.ucivalue = function(sid) {
2691 return self.get('proto') || 'none';
2692 };
2693
2694 var ok = section.taboption('general', L.cbi.ButtonValue, '_confirm', {
2695 caption: L.tr('Really switch?'),
2696 description: L.tr('Changing the protocol will clear all configuration for this interface!'),
2697 text: L.tr('Change protocol')
2698 });
2699
2700 ok.on('click', function(ev) {
2701 self.changeProtocol(pr.formvalue(ev.data.sid));
2702 self.createForm(mapwidget).show();
2703 });
2704
2705 var protos = L.NetworkModel.getProtocols();
2706
2707 for (var i = 0; i < protos.length; i++)
2708 pr.value(protos[i].name, protos[i].description);
2709
2710 proto.populateForm(section, self);
2711
2712 if (!proto.virtual)
2713 {
2714 var br = section.taboption('physical', L.cbi.CheckboxValue, 'type', {
2715 caption: L.tr('Network bridge'),
2716 description: L.tr('Merges multiple devices into one logical bridge'),
2717 optional: true,
2718 enabled: 'bridge',
2719 disabled: '',
2720 initial: ''
2721 });
2722
2723 section.taboption('physical', L.cbi.DeviceList, '__iface_multi', {
2724 caption: L.tr('Devices'),
2725 multiple: true,
2726 bridges: false
2727 }).depends('type', true);
2728
2729 section.taboption('physical', L.cbi.DeviceList, '__iface_single', {
2730 caption: L.tr('Device'),
2731 multiple: false,
2732 bridges: true
2733 }).depends('type', false);
2734
2735 var mac = section.taboption('physical', L.cbi.InputValue, 'macaddr', {
2736 caption: L.tr('Override MAC'),
2737 optional: true,
2738 placeholder: device ? device.getMACAddress() : undefined,
2739 datatype: 'macaddr'
2740 })
2741
2742 mac.ucivalue = function(sid)
2743 {
2744 if (device)
2745 return device.get('macaddr');
2746
2747 return this.callSuper('ucivalue', sid);
2748 };
2749
2750 mac.save = function(sid)
2751 {
2752 if (!this.changed(sid))
2753 return false;
2754
2755 if (device)
2756 device.set('macaddr', this.formvalue(sid));
2757 else
2758 this.callSuper('set', sid);
2759
2760 return true;
2761 };
2762 }
2763
2764 section.taboption('physical', L.cbi.InputValue, 'mtu', {
2765 caption: L.tr('Override MTU'),
2766 optional: true,
2767 placeholder: device ? device.getMTU() : undefined,
2768 datatype: 'range(1, 9000)'
2769 });
2770
2771 section.taboption('physical', L.cbi.InputValue, 'metric', {
2772 caption: L.tr('Override Metric'),
2773 optional: true,
2774 placeholder: 0,
2775 datatype: 'uinteger'
2776 });
2777
2778 for (var field in section.fields)
2779 {
2780 switch (field)
2781 {
2782 case 'proto':
2783 break;
2784
2785 case '_confirm':
2786 for (var i = 0; i < protos.length; i++)
2787 if (protos[i].name != (this.get('proto') || 'none'))
2788 section.fields[field].depends('proto', protos[i].name);
2789 break;
2790
2791 default:
2792 section.fields[field].depends('proto', this.get('proto') || 'none', true);
2793 break;
2794 }
2795 }
2796
2797 return map;
2798 }
2799 });
2800
2801 this.NetworkModel.Protocol = this.NetworkModel.Interface.extend({
2802 description: '__unknown__',
2803 tunnel: false,
2804 virtual: false,
2805
2806 populateForm: function(section, iface)
2807 {
2808
2809 }
2810 });
2811
2812 this.system = {
2813 getSystemInfo: L.rpc.declare({
2814 object: 'system',
2815 method: 'info',
2816 expect: { '': { } }
2817 }),
2818
2819 getBoardInfo: L.rpc.declare({
2820 object: 'system',
2821 method: 'board',
2822 expect: { '': { } }
2823 }),
2824
2825 getDiskInfo: L.rpc.declare({
2826 object: 'luci2.system',
2827 method: 'diskfree',
2828 expect: { '': { } }
2829 }),
2830
2831 getInfo: function(cb)
2832 {
2833 L.rpc.batch();
2834
2835 this.getSystemInfo();
2836 this.getBoardInfo();
2837 this.getDiskInfo();
2838
2839 return L.rpc.flush().then(function(info) {
2840 var rv = { };
2841
2842 $.extend(rv, info[0]);
2843 $.extend(rv, info[1]);
2844 $.extend(rv, info[2]);
2845
2846 return rv;
2847 });
2848 },
2849
2850
2851 initList: L.rpc.declare({
2852 object: 'luci2.system',
2853 method: 'init_list',
2854 expect: { initscripts: [ ] },
2855 filter: function(data) {
2856 data.sort(function(a, b) { return (a.start || 0) - (b.start || 0) });
2857 return data;
2858 }
2859 }),
2860
2861 initEnabled: function(init, cb)
2862 {
2863 return this.initList().then(function(list) {
2864 for (var i = 0; i < list.length; i++)
2865 if (list[i].name == init)
2866 return !!list[i].enabled;
2867
2868 return false;
2869 });
2870 },
2871
2872 initRun: L.rpc.declare({
2873 object: 'luci2.system',
2874 method: 'init_action',
2875 params: [ 'name', 'action' ],
2876 filter: function(data) {
2877 return (data == 0);
2878 }
2879 }),
2880
2881 initStart: function(init, cb) { return L.system.initRun(init, 'start', cb) },
2882 initStop: function(init, cb) { return L.system.initRun(init, 'stop', cb) },
2883 initRestart: function(init, cb) { return L.system.initRun(init, 'restart', cb) },
2884 initReload: function(init, cb) { return L.system.initRun(init, 'reload', cb) },
2885 initEnable: function(init, cb) { return L.system.initRun(init, 'enable', cb) },
2886 initDisable: function(init, cb) { return L.system.initRun(init, 'disable', cb) },
2887
2888
2889 performReboot: L.rpc.declare({
2890 object: 'luci2.system',
2891 method: 'reboot'
2892 })
2893 };
2894
2895 this.session = {
2896
2897 login: L.rpc.declare({
2898 object: 'session',
2899 method: 'login',
2900 params: [ 'username', 'password' ],
2901 expect: { '': { } }
2902 }),
2903
2904 access: L.rpc.declare({
2905 object: 'session',
2906 method: 'access',
2907 params: [ 'scope', 'object', 'function' ],
2908 expect: { access: false }
2909 }),
2910
2911 isAlive: function()
2912 {
2913 return L.session.access('ubus', 'session', 'access');
2914 },
2915
2916 startHeartbeat: function()
2917 {
2918 this._hearbeatInterval = window.setInterval(function() {
2919 L.session.isAlive().then(function(alive) {
2920 if (!alive)
2921 {
2922 L.session.stopHeartbeat();
2923 L.ui.login(true);
2924 }
2925
2926 });
2927 }, L.globals.timeout * 2);
2928 },
2929
2930 stopHeartbeat: function()
2931 {
2932 if (typeof(this._hearbeatInterval) != 'undefined')
2933 {
2934 window.clearInterval(this._hearbeatInterval);
2935 delete this._hearbeatInterval;
2936 }
2937 },
2938
2939
2940 _acls: { },
2941
2942 _fetch_acls: L.rpc.declare({
2943 object: 'session',
2944 method: 'access',
2945 expect: { '': { } }
2946 }),
2947
2948 _fetch_acls_cb: function(acls)
2949 {
2950 L.session._acls = acls;
2951 },
2952
2953 updateACLs: function()
2954 {
2955 return L.session._fetch_acls()
2956 .then(L.session._fetch_acls_cb);
2957 },
2958
2959 hasACL: function(scope, object, func)
2960 {
2961 var acls = L.session._acls;
2962
2963 if (typeof(func) == 'undefined')
2964 return (acls && acls[scope] && acls[scope][object]);
2965
2966 if (acls && acls[scope] && acls[scope][object])
2967 for (var i = 0; i < acls[scope][object].length; i++)
2968 if (acls[scope][object][i] == func)
2969 return true;
2970
2971 return false;
2972 }
2973 };
2974
2975 this.ui = {
2976
2977 saveScrollTop: function()
2978 {
2979 this._scroll_top = $(document).scrollTop();
2980 },
2981
2982 restoreScrollTop: function()
2983 {
2984 if (typeof(this._scroll_top) == 'undefined')
2985 return;
2986
2987 $(document).scrollTop(this._scroll_top);
2988
2989 delete this._scroll_top;
2990 },
2991
2992 loading: function(enable)
2993 {
2994 var win = $(window);
2995 var body = $('body');
2996
2997 var state = L.ui._loading || (L.ui._loading = {
2998 modal: $('<div />')
2999 .css('z-index', 2000)
3000 .addClass('modal fade')
3001 .append($('<div />')
3002 .addClass('modal-dialog')
3003 .append($('<div />')
3004 .addClass('modal-content luci2-modal-loader')
3005 .append($('<div />')
3006 .addClass('modal-body')
3007 .text(L.tr('Loading data…')))))
3008 .appendTo(body)
3009 .modal({
3010 backdrop: 'static',
3011 keyboard: false
3012 })
3013 });
3014
3015 state.modal.modal(enable ? 'show' : 'hide');
3016 },
3017
3018 dialog: function(title, content, options)
3019 {
3020 var win = $(window);
3021 var body = $('body');
3022
3023 var state = L.ui._dialog || (L.ui._dialog = {
3024 dialog: $('<div />')
3025 .addClass('modal fade')
3026 .append($('<div />')
3027 .addClass('modal-dialog')
3028 .append($('<div />')
3029 .addClass('modal-content')
3030 .append($('<div />')
3031 .addClass('modal-header')
3032 .append('<h4 />')
3033 .addClass('modal-title'))
3034 .append($('<div />')
3035 .addClass('modal-body'))
3036 .append($('<div />')
3037 .addClass('modal-footer')
3038 .append(L.ui.button(L.tr('Close'), 'primary')
3039 .click(function() {
3040 $(this).parents('div.modal').modal('hide');
3041 })))))
3042 .appendTo(body)
3043 });
3044
3045 if (typeof(options) != 'object')
3046 options = { };
3047
3048 if (title === false)
3049 {
3050 state.dialog.modal('hide');
3051
3052 return state.dialog;
3053 }
3054
3055 var cnt = state.dialog.children().children().children('div.modal-body');
3056 var ftr = state.dialog.children().children().children('div.modal-footer');
3057
3058 ftr.empty().show();
3059
3060 if (options.style == 'confirm')
3061 {
3062 ftr.append(L.ui.button(L.tr('Ok'), 'primary')
3063 .click(options.confirm || function() { L.ui.dialog(false) }));
3064
3065 ftr.append(L.ui.button(L.tr('Cancel'), 'default')
3066 .click(options.cancel || function() { L.ui.dialog(false) }));
3067 }
3068 else if (options.style == 'close')
3069 {
3070 ftr.append(L.ui.button(L.tr('Close'), 'primary')
3071 .click(options.close || function() { L.ui.dialog(false) }));
3072 }
3073 else if (options.style == 'wait')
3074 {
3075 ftr.append(L.ui.button(L.tr('Close'), 'primary')
3076 .attr('disabled', true));
3077 }
3078
3079 if (options.wide)
3080 {
3081 state.dialog.addClass('wide');
3082 }
3083 else
3084 {
3085 state.dialog.removeClass('wide');
3086 }
3087
3088 state.dialog.find('h4:first').text(title);
3089 state.dialog.modal('show');
3090
3091 cnt.empty().append(content);
3092
3093 return state.dialog;
3094 },
3095
3096 upload: function(title, content, options)
3097 {
3098 var state = L.ui._upload || (L.ui._upload = {
3099 form: $('<form />')
3100 .attr('method', 'post')
3101 .attr('action', '/cgi-bin/luci-upload')
3102 .attr('enctype', 'multipart/form-data')
3103 .attr('target', 'cbi-fileupload-frame')
3104 .append($('<p />'))
3105 .append($('<input />')
3106 .attr('type', 'hidden')
3107 .attr('name', 'sessionid'))
3108 .append($('<input />')
3109 .attr('type', 'hidden')
3110 .attr('name', 'filename'))
3111 .append($('<input />')
3112 .attr('type', 'file')
3113 .attr('name', 'filedata')
3114 .addClass('cbi-input-file'))
3115 .append($('<div />')
3116 .css('width', '100%')
3117 .addClass('progress progress-striped active')
3118 .append($('<div />')
3119 .addClass('progress-bar')
3120 .css('width', '100%')))
3121 .append($('<iframe />')
3122 .addClass('pull-right')
3123 .attr('name', 'cbi-fileupload-frame')
3124 .css('width', '1px')
3125 .css('height', '1px')
3126 .css('visibility', 'hidden')),
3127
3128 finish_cb: function(ev) {
3129 $(this).off('load');
3130
3131 var body = (this.contentDocument || this.contentWindow.document).body;
3132 if (body.firstChild.tagName.toLowerCase() == 'pre')
3133 body = body.firstChild;
3134
3135 var json;
3136 try {
3137 json = $.parseJSON(body.innerHTML);
3138 } catch(e) {
3139 json = {
3140 message: L.tr('Invalid server response received'),
3141 error: [ -1, L.tr('Invalid data') ]
3142 };
3143 };
3144
3145 if (json.error)
3146 {
3147 L.ui.dialog(L.tr('File upload'), [
3148 $('<p />').text(L.tr('The file upload failed with the server response below:')),
3149 $('<pre />').addClass('alert-message').text(json.message || json.error[1]),
3150 $('<p />').text(L.tr('In case of network problems try uploading the file again.'))
3151 ], { style: 'close' });
3152 }
3153 else if (typeof(state.success_cb) == 'function')
3154 {
3155 state.success_cb(json);
3156 }
3157 },
3158
3159 confirm_cb: function() {
3160 var f = state.form.find('.cbi-input-file');
3161 var b = state.form.find('.progress');
3162 var p = state.form.find('p');
3163
3164 if (!f.val())
3165 return;
3166
3167 state.form.find('iframe').on('load', state.finish_cb);
3168 state.form.submit();
3169
3170 f.hide();
3171 b.show();
3172 p.text(L.tr('File upload in progress …'));
3173
3174 state.form.parent().parent().find('button').prop('disabled', true);
3175 }
3176 });
3177
3178 state.form.find('.progress').hide();
3179 state.form.find('.cbi-input-file').val('').show();
3180 state.form.find('p').text(content || L.tr('Select the file to upload and press "%s" to proceed.').format(L.tr('Ok')));
3181
3182 state.form.find('[name=sessionid]').val(L.globals.sid);
3183 state.form.find('[name=filename]').val(options.filename);
3184
3185 state.success_cb = options.success;
3186
3187 L.ui.dialog(title || L.tr('File upload'), state.form, {
3188 style: 'confirm',
3189 confirm: state.confirm_cb
3190 });
3191 },
3192
3193 reconnect: function()
3194 {
3195 var protocols = (location.protocol == 'https:') ? [ 'http', 'https' ] : [ 'http' ];
3196 var ports = (location.protocol == 'https:') ? [ 80, location.port || 443 ] : [ location.port || 80 ];
3197 var address = location.hostname.match(/^[A-Fa-f0-9]*:[A-Fa-f0-9:]+$/) ? '[' + location.hostname + ']' : location.hostname;
3198 var images = $();
3199 var interval, timeout;
3200
3201 L.ui.dialog(
3202 L.tr('Waiting for device'), [
3203 $('<p />').text(L.tr('Please stand by while the device is reconfiguring …')),
3204 $('<div />')
3205 .css('width', '100%')
3206 .addClass('progressbar')
3207 .addClass('intermediate')
3208 .append($('<div />')
3209 .css('width', '100%'))
3210 ], { style: 'wait' }
3211 );
3212
3213 for (var i = 0; i < protocols.length; i++)
3214 images = images.add($('<img />').attr('url', protocols[i] + '://' + address + ':' + ports[i]));
3215
3216 //L.network.getNetworkStatus(function(s) {
3217 // for (var i = 0; i < protocols.length; i++)
3218 // {
3219 // for (var j = 0; j < s.length; j++)
3220 // {
3221 // for (var k = 0; k < s[j]['ipv4-address'].length; k++)
3222 // images = images.add($('<img />').attr('url', protocols[i] + '://' + s[j]['ipv4-address'][k].address + ':' + ports[i]));
3223 //
3224 // for (var l = 0; l < s[j]['ipv6-address'].length; l++)
3225 // images = images.add($('<img />').attr('url', protocols[i] + '://[' + s[j]['ipv6-address'][l].address + ']:' + ports[i]));
3226 // }
3227 // }
3228 //}).then(function() {
3229 images.on('load', function() {
3230 var url = this.getAttribute('url');
3231 L.session.isAlive().then(function(access) {
3232 if (access)
3233 {
3234 window.clearTimeout(timeout);
3235 window.clearInterval(interval);
3236 L.ui.dialog(false);
3237 images = null;
3238 }
3239 else
3240 {
3241 location.href = url;
3242 }
3243 });
3244 });
3245
3246 interval = window.setInterval(function() {
3247 images.each(function() {
3248 this.setAttribute('src', this.getAttribute('url') + L.globals.resource + '/icons/loading.gif?r=' + Math.random());
3249 });
3250 }, 5000);
3251
3252 timeout = window.setTimeout(function() {
3253 window.clearInterval(interval);
3254 images.off('load');
3255
3256 L.ui.dialog(
3257 L.tr('Device not responding'),
3258 L.tr('The device was not responding within 180 seconds, you might need to manually reconnect your computer or use SSH to regain access.'),
3259 { style: 'close' }
3260 );
3261 }, 180000);
3262 //});
3263 },
3264
3265 login: function(invalid)
3266 {
3267 var state = L.ui._login || (L.ui._login = {
3268 form: $('<form />')
3269 .attr('target', '')
3270 .attr('method', 'post')
3271 .append($('<p />')
3272 .addClass('alert-message')
3273 .text(L.tr('Wrong username or password given!')))
3274 .append($('<p />')
3275 .append($('<label />')
3276 .text(L.tr('Username'))
3277 .append($('<br />'))
3278 .append($('<input />')
3279 .attr('type', 'text')
3280 .attr('name', 'username')
3281 .attr('value', 'root')
3282 .addClass('form-control')
3283 .keypress(function(ev) {
3284 if (ev.which == 10 || ev.which == 13)
3285 state.confirm_cb();
3286 }))))
3287 .append($('<p />')
3288 .append($('<label />')
3289 .text(L.tr('Password'))
3290 .append($('<br />'))
3291 .append($('<input />')
3292 .attr('type', 'password')
3293 .attr('name', 'password')
3294 .addClass('form-control')
3295 .keypress(function(ev) {
3296 if (ev.which == 10 || ev.which == 13)
3297 state.confirm_cb();
3298 }))))
3299 .append($('<p />')
3300 .text(L.tr('Enter your username and password above, then click "%s" to proceed.').format(L.tr('Ok')))),
3301
3302 response_cb: function(response) {
3303 if (!response.ubus_rpc_session)
3304 {
3305 L.ui.login(true);
3306 }
3307 else
3308 {
3309 L.globals.sid = response.ubus_rpc_session;
3310 L.setHash('id', L.globals.sid);
3311 L.session.startHeartbeat();
3312 L.ui.dialog(false);
3313 state.deferred.resolve();
3314 }
3315 },
3316
3317 confirm_cb: function() {
3318 var u = state.form.find('[name=username]').val();
3319 var p = state.form.find('[name=password]').val();
3320
3321 if (!u)
3322 return;
3323
3324 L.ui.dialog(
3325 L.tr('Logging in'), [
3326 $('<p />').text(L.tr('Log in in progress …')),
3327 $('<div />')
3328 .css('width', '100%')
3329 .addClass('progressbar')
3330 .addClass('intermediate')
3331 .append($('<div />')
3332 .css('width', '100%'))
3333 ], { style: 'wait' }
3334 );
3335
3336 L.globals.sid = '00000000000000000000000000000000';
3337 L.session.login(u, p).then(state.response_cb);
3338 }
3339 });
3340
3341 if (!state.deferred || state.deferred.state() != 'pending')
3342 state.deferred = $.Deferred();
3343
3344 /* try to find sid from hash */
3345 var sid = L.getHash('id');
3346 if (sid && sid.match(/^[a-f0-9]{32}$/))
3347 {
3348 L.globals.sid = sid;
3349 L.session.isAlive().then(function(access) {
3350 if (access)
3351 {
3352 L.session.startHeartbeat();
3353 state.deferred.resolve();
3354 }
3355 else
3356 {
3357 L.setHash('id', undefined);
3358 L.ui.login();
3359 }
3360 });
3361
3362 return state.deferred;
3363 }
3364
3365 if (invalid)
3366 state.form.find('.alert-message').show();
3367 else
3368 state.form.find('.alert-message').hide();
3369
3370 L.ui.dialog(L.tr('Authorization Required'), state.form, {
3371 style: 'confirm',
3372 confirm: state.confirm_cb
3373 });
3374
3375 state.form.find('[name=password]').focus();
3376
3377 return state.deferred;
3378 },
3379
3380 cryptPassword: L.rpc.declare({
3381 object: 'luci2.ui',
3382 method: 'crypt',
3383 params: [ 'data' ],
3384 expect: { crypt: '' }
3385 }),
3386
3387
3388 _acl_merge_scope: function(acl_scope, scope)
3389 {
3390 if ($.isArray(scope))
3391 {
3392 for (var i = 0; i < scope.length; i++)
3393 acl_scope[scope[i]] = true;
3394 }
3395 else if ($.isPlainObject(scope))
3396 {
3397 for (var object_name in scope)
3398 {
3399 if (!$.isArray(scope[object_name]))
3400 continue;
3401
3402 var acl_object = acl_scope[object_name] || (acl_scope[object_name] = { });
3403
3404 for (var i = 0; i < scope[object_name].length; i++)
3405 acl_object[scope[object_name][i]] = true;
3406 }
3407 }
3408 },
3409
3410 _acl_merge_permission: function(acl_perm, perm)
3411 {
3412 if ($.isPlainObject(perm))
3413 {
3414 for (var scope_name in perm)
3415 {
3416 var acl_scope = acl_perm[scope_name] || (acl_perm[scope_name] = { });
3417 this._acl_merge_scope(acl_scope, perm[scope_name]);
3418 }
3419 }
3420 },
3421
3422 _acl_merge_group: function(acl_group, group)
3423 {
3424 if ($.isPlainObject(group))
3425 {
3426 if (!acl_group.description)
3427 acl_group.description = group.description;
3428
3429 if (group.read)
3430 {
3431 var acl_perm = acl_group.read || (acl_group.read = { });
3432 this._acl_merge_permission(acl_perm, group.read);
3433 }
3434
3435 if (group.write)
3436 {
3437 var acl_perm = acl_group.write || (acl_group.write = { });
3438 this._acl_merge_permission(acl_perm, group.write);
3439 }
3440 }
3441 },
3442
3443 _acl_merge_tree: function(acl_tree, tree)
3444 {
3445 if ($.isPlainObject(tree))
3446 {
3447 for (var group_name in tree)
3448 {
3449 var acl_group = acl_tree[group_name] || (acl_tree[group_name] = { });
3450 this._acl_merge_group(acl_group, tree[group_name]);
3451 }
3452 }
3453 },
3454
3455 listAvailableACLs: L.rpc.declare({
3456 object: 'luci2.ui',
3457 method: 'acls',
3458 expect: { acls: [ ] },
3459 filter: function(trees) {
3460 var acl_tree = { };
3461 for (var i = 0; i < trees.length; i++)
3462 L.ui._acl_merge_tree(acl_tree, trees[i]);
3463 return acl_tree;
3464 }
3465 }),
3466
3467 _render_change_indicator: function()
3468 {
3469 return $('<ul />')
3470 .addClass('nav navbar-nav navbar-right')
3471 .append($('<li />')
3472 .append($('<a />')
3473 .attr('id', 'changes')
3474 .attr('href', '#')
3475 .append($('<span />')
3476 .addClass('label label-info'))));
3477 },
3478
3479 renderMainMenu: L.rpc.declare({
3480 object: 'luci2.ui',
3481 method: 'menu',
3482 expect: { menu: { } },
3483 filter: function(entries) {
3484 L.globals.mainMenu = new L.ui.menu();
3485 L.globals.mainMenu.entries(entries);
3486
3487 $('#mainmenu')
3488 .empty()
3489 .append(L.globals.mainMenu.render(0, 1))
3490 .append(L.ui._render_change_indicator());
3491 }
3492 }),
3493
3494 renderViewMenu: function()
3495 {
3496 $('#viewmenu')
3497 .empty()
3498 .append(L.globals.mainMenu.render(2, 900));
3499 },
3500
3501 renderView: function()
3502 {
3503 var node = arguments[0];
3504 var name = node.view.split(/\//).join('.');
3505 var cname = L.toClassName(name);
3506 var views = L.views || (L.views = { });
3507 var args = [ ];
3508
3509 for (var i = 1; i < arguments.length; i++)
3510 args.push(arguments[i]);
3511
3512 if (L.globals.currentView)
3513 L.globals.currentView.finish();
3514
3515 L.ui.renderViewMenu();
3516 L.setHash('view', node.view);
3517
3518 if (views[cname] instanceof L.ui.view)
3519 {
3520 L.globals.currentView = views[cname];
3521 return views[cname].render.apply(views[cname], args);
3522 }
3523
3524 var url = L.globals.resource + '/view/' + name + '.js';
3525
3526 return $.ajax(url, {
3527 method: 'GET',
3528 cache: true,
3529 dataType: 'text'
3530 }).then(function(data) {
3531 try {
3532 var viewConstructorSource = (
3533 '(function(L, $) { ' +
3534 'return %s' +
3535 '})(L, $);\n\n' +
3536 '//@ sourceURL=%s'
3537 ).format(data, url);
3538
3539 var viewConstructor = eval(viewConstructorSource);
3540
3541 views[cname] = new viewConstructor({
3542 name: name,
3543 acls: node.write || { }
3544 });
3545
3546 L.globals.currentView = views[cname];
3547 return views[cname].render.apply(views[cname], args);
3548 }
3549 catch(e) {
3550 alert('Unable to instantiate view "%s": %s'.format(url, e));
3551 };
3552
3553 return $.Deferred().resolve();
3554 });
3555 },
3556
3557 changeView: function()
3558 {
3559 var name = L.getHash('view');
3560 var node = L.globals.defaultNode;
3561
3562 if (name && L.globals.mainMenu)
3563 node = L.globals.mainMenu.getNode(name);
3564
3565 if (node)
3566 {
3567 L.ui.loading(true);
3568 L.ui.renderView(node).then(function() {
3569 L.ui.loading(false);
3570 });
3571 }
3572 },
3573
3574 updateHostname: function()
3575 {
3576 return L.system.getBoardInfo().then(function(info) {
3577 if (info.hostname)
3578 $('#hostname').text(info.hostname);
3579 });
3580 },
3581
3582 updateChanges: function()
3583 {
3584 return L.uci.changes().then(function(changes) {
3585 var n = 0;
3586 var html = '';
3587
3588 for (var config in changes)
3589 {
3590 var log = [ ];
3591
3592 for (var i = 0; i < changes[config].length; i++)
3593 {
3594 var c = changes[config][i];
3595
3596 switch (c[0])
3597 {
3598 case 'order':
3599 log.push('uci reorder %s.<ins>%s=<strong>%s</strong></ins>'.format(config, c[1], c[2]));
3600 break;
3601
3602 case 'remove':
3603 if (c.length < 3)
3604 log.push('uci delete %s.<del>%s</del>'.format(config, c[1]));
3605 else
3606 log.push('uci delete %s.%s.<del>%s</del>'.format(config, c[1], c[2]));
3607 break;
3608
3609 case 'rename':
3610 if (c.length < 4)
3611 log.push('uci rename %s.<ins>%s=<strong>%s</strong></ins>'.format(config, c[1], c[2], c[3]));
3612 else
3613 log.push('uci rename %s.%s.<ins>%s=<strong>%s</strong></ins>'.format(config, c[1], c[2], c[3], c[4]));
3614 break;
3615
3616 case 'add':
3617 log.push('uci add %s <ins>%s</ins> (= <ins><strong>%s</strong></ins>)'.format(config, c[2], c[1]));
3618 break;
3619
3620 case 'list-add':
3621 log.push('uci add_list %s.%s.<ins>%s=<strong>%s</strong></ins>'.format(config, c[1], c[2], c[3], c[4]));
3622 break;
3623
3624 case 'list-del':
3625 log.push('uci del_list %s.%s.<del>%s=<strong>%s</strong></del>'.format(config, c[1], c[2], c[3], c[4]));
3626 break;
3627
3628 case 'set':
3629 if (c.length < 4)
3630 log.push('uci set %s.<ins>%s=<strong>%s</strong></ins>'.format(config, c[1], c[2]));
3631 else
3632 log.push('uci set %s.%s.<ins>%s=<strong>%s</strong></ins>'.format(config, c[1], c[2], c[3], c[4]));
3633 break;
3634 }
3635 }
3636
3637 html += '<code>/etc/config/%s</code><pre class="uci-changes">%s</pre>'.format(config, log.join('\n'));
3638 n += changes[config].length;
3639 }
3640
3641 if (n > 0)
3642 $('#changes')
3643 .click(function(ev) {
3644 L.ui.dialog(L.tr('Staged configuration changes'), html, {
3645 style: 'confirm',
3646 confirm: function() {
3647 L.uci.apply().then(
3648 function(code) { alert('Success with code ' + code); },
3649 function(code) { alert('Error with code ' + code); }
3650 );
3651 }
3652 });
3653 ev.preventDefault();
3654 })
3655 .children('span')
3656 .show()
3657 .text(L.trcp('Pending configuration changes', '1 change', '%d changes', n).format(n));
3658 else
3659 $('#changes').children('span').hide();
3660 });
3661 },
3662
3663 init: function()
3664 {
3665 L.ui.loading(true);
3666
3667 $.when(
3668 L.session.updateACLs(),
3669 L.ui.updateHostname(),
3670 L.ui.updateChanges(),
3671 L.ui.renderMainMenu(),
3672 L.NetworkModel.init()
3673 ).then(function() {
3674 L.ui.renderView(L.globals.defaultNode).then(function() {
3675 L.ui.loading(false);
3676 });
3677
3678 $(window).on('hashchange', function() {
3679 L.ui.changeView();
3680 });
3681 });
3682 },
3683
3684 button: function(label, style, title)
3685 {
3686 style = style || 'default';
3687
3688 return $('<button />')
3689 .attr('type', 'button')
3690 .attr('title', title ? title : '')
3691 .addClass('btn btn-' + style)
3692 .text(label);
3693 }
3694 };
3695
3696 this.ui.AbstractWidget = Class.extend({
3697 i18n: function(text) {
3698 return text;
3699 },
3700
3701 label: function() {
3702 var key = arguments[0];
3703 var args = [ ];
3704
3705 for (var i = 1; i < arguments.length; i++)
3706 args.push(arguments[i]);
3707
3708 switch (typeof(this.options[key]))
3709 {
3710 case 'undefined':
3711 return '';
3712
3713 case 'function':
3714 return this.options[key].apply(this, args);
3715
3716 default:
3717 return ''.format.apply('' + this.options[key], args);
3718 }
3719 },
3720
3721 toString: function() {
3722 return $('<div />').append(this.render()).html();
3723 },
3724
3725 insertInto: function(id) {
3726 return $(id).empty().append(this.render());
3727 },
3728
3729 appendTo: function(id) {
3730 return $(id).append(this.render());
3731 },
3732
3733 on: function(evname, evfunc)
3734 {
3735 var evnames = L.toArray(evname);
3736
3737 if (!this.events)
3738 this.events = { };
3739
3740 for (var i = 0; i < evnames.length; i++)
3741 this.events[evnames[i]] = evfunc;
3742
3743 return this;
3744 },
3745
3746 trigger: function(evname, evdata)
3747 {
3748 if (this.events)
3749 {
3750 var evnames = L.toArray(evname);
3751
3752 for (var i = 0; i < evnames.length; i++)
3753 if (this.events[evnames[i]])
3754 this.events[evnames[i]].call(this, evdata);
3755 }
3756
3757 return this;
3758 }
3759 });
3760
3761 this.ui.view = this.ui.AbstractWidget.extend({
3762 _fetch_template: function()
3763 {
3764 return $.ajax(L.globals.resource + '/template/' + this.options.name + '.htm', {
3765 method: 'GET',
3766 cache: true,
3767 dataType: 'text',
3768 success: function(data) {
3769 data = data.replace(/<%([#:=])?(.+?)%>/g, function(match, p1, p2) {
3770 p2 = p2.replace(/^\s+/, '').replace(/\s+$/, '');
3771 switch (p1)
3772 {
3773 case '#':
3774 return '';
3775
3776 case ':':
3777 return L.tr(p2);
3778
3779 case '=':
3780 return L.globals[p2] || '';
3781
3782 default:
3783 return '(?' + match + ')';
3784 }
3785 });
3786
3787 $('#maincontent').append(data);
3788 }
3789 });
3790 },
3791
3792 execute: function()
3793 {
3794 throw "Not implemented";
3795 },
3796
3797 render: function()
3798 {
3799 var container = $('#maincontent');
3800
3801 container.empty();
3802
3803 if (this.title)
3804 container.append($('<h2 />').append(this.title));
3805
3806 if (this.description)
3807 container.append($('<p />').append(this.description));
3808
3809 var self = this;
3810 var args = [ ];
3811
3812 for (var i = 0; i < arguments.length; i++)
3813 args.push(arguments[i]);
3814
3815 return this._fetch_template().then(function() {
3816 return L.deferrable(self.execute.apply(self, args));
3817 });
3818 },
3819
3820 repeat: function(func, interval)
3821 {
3822 var self = this;
3823
3824 if (!self._timeouts)
3825 self._timeouts = [ ];
3826
3827 var index = self._timeouts.length;
3828
3829 if (typeof(interval) != 'number')
3830 interval = 5000;
3831
3832 var setTimer, runTimer;
3833
3834 setTimer = function() {
3835 if (self._timeouts)
3836 self._timeouts[index] = window.setTimeout(runTimer, interval);
3837 };
3838
3839 runTimer = function() {
3840 L.deferrable(func.call(self)).then(setTimer, setTimer);
3841 };
3842
3843 runTimer();
3844 },
3845
3846 finish: function()
3847 {
3848 if ($.isArray(this._timeouts))
3849 {
3850 for (var i = 0; i < this._timeouts.length; i++)
3851 window.clearTimeout(this._timeouts[i]);
3852
3853 delete this._timeouts;
3854 }
3855 }
3856 });
3857
3858 this.ui.menu = this.ui.AbstractWidget.extend({
3859 init: function() {
3860 this._nodes = { };
3861 },
3862
3863 entries: function(entries)
3864 {
3865 for (var entry in entries)
3866 {
3867 var path = entry.split(/\//);
3868 var node = this._nodes;
3869
3870 for (i = 0; i < path.length; i++)
3871 {
3872 if (!node.childs)
3873 node.childs = { };
3874
3875 if (!node.childs[path[i]])
3876 node.childs[path[i]] = { };
3877
3878 node = node.childs[path[i]];
3879 }
3880
3881 $.extend(node, entries[entry]);
3882 }
3883 },
3884
3885 _indexcmp: function(a, b)
3886 {
3887 var x = a.index || 0;
3888 var y = b.index || 0;
3889 return (x - y);
3890 },
3891
3892 firstChildView: function(node)
3893 {
3894 if (node.view)
3895 return node;
3896
3897 var nodes = [ ];
3898 for (var child in (node.childs || { }))
3899 nodes.push(node.childs[child]);
3900
3901 nodes.sort(this._indexcmp);
3902
3903 for (var i = 0; i < nodes.length; i++)
3904 {
3905 var child = this.firstChildView(nodes[i]);
3906 if (child)
3907 {
3908 for (var key in child)
3909 if (!node.hasOwnProperty(key) && child.hasOwnProperty(key))
3910 node[key] = child[key];
3911
3912 return node;
3913 }
3914 }
3915
3916 return undefined;
3917 },
3918
3919 _onclick: function(ev)
3920 {
3921 L.setHash('view', ev.data);
3922
3923 ev.preventDefault();
3924 this.blur();
3925 },
3926
3927 _render: function(childs, level, min, max)
3928 {
3929 var nodes = [ ];
3930 for (var node in childs)
3931 {
3932 var child = this.firstChildView(childs[node]);
3933 if (child)
3934 nodes.push(childs[node]);
3935 }
3936
3937 nodes.sort(this._indexcmp);
3938
3939 var list = $('<ul />');
3940
3941 if (level == 0)
3942 list.addClass('nav').addClass('navbar-nav');
3943 else if (level == 1)
3944 list.addClass('dropdown-menu').addClass('navbar-inverse');
3945
3946 for (var i = 0; i < nodes.length; i++)
3947 {
3948 if (!L.globals.defaultNode)
3949 {
3950 var v = L.getHash('view');
3951 if (!v || v == nodes[i].view)
3952 L.globals.defaultNode = nodes[i];
3953 }
3954
3955 var item = $('<li />')
3956 .append($('<a />')
3957 .attr('href', '#')
3958 .text(L.tr(nodes[i].title)))
3959 .appendTo(list);
3960
3961 if (nodes[i].childs && level < max)
3962 {
3963 item.addClass('dropdown');
3964
3965 item.find('a')
3966 .addClass('dropdown-toggle')
3967 .attr('data-toggle', 'dropdown')
3968 .append('<b class="caret"></b>');
3969
3970 item.append(this._render(nodes[i].childs, level + 1));
3971 }
3972 else
3973 {
3974 item.find('a').click(nodes[i].view, this._onclick);
3975 }
3976 }
3977
3978 return list.get(0);
3979 },
3980
3981 render: function(min, max)
3982 {
3983 var top = min ? this.getNode(L.globals.defaultNode.view, min) : this._nodes;
3984 return this._render(top.childs, 0, min, max);
3985 },
3986
3987 getNode: function(path, max)
3988 {
3989 var p = path.split(/\//);
3990 var n = this._nodes;
3991
3992 if (typeof(max) == 'undefined')
3993 max = p.length;
3994
3995 for (var i = 0; i < max; i++)
3996 {
3997 if (!n.childs[p[i]])
3998 return undefined;
3999
4000 n = n.childs[p[i]];
4001 }
4002
4003 return n;
4004 }
4005 });
4006
4007 this.ui.table = this.ui.AbstractWidget.extend({
4008 init: function()
4009 {
4010 this._rows = [ ];
4011 },
4012
4013 row: function(values)
4014 {
4015 if ($.isArray(values))
4016 {
4017 this._rows.push(values);
4018 }
4019 else if ($.isPlainObject(values))
4020 {
4021 var v = [ ];
4022 for (var i = 0; i < this.options.columns.length; i++)
4023 {
4024 var col = this.options.columns[i];
4025
4026 if (typeof col.key == 'string')
4027 v.push(values[col.key]);
4028 else
4029 v.push(null);
4030 }
4031 this._rows.push(v);
4032 }
4033 },
4034
4035 rows: function(rows)
4036 {
4037 for (var i = 0; i < rows.length; i++)
4038 this.row(rows[i]);
4039 },
4040
4041 render: function(id)
4042 {
4043 var fieldset = document.createElement('fieldset');
4044 fieldset.className = 'cbi-section';
4045
4046 if (this.options.caption)
4047 {
4048 var legend = document.createElement('legend');
4049 $(legend).append(this.options.caption);
4050 fieldset.appendChild(legend);
4051 }
4052
4053 var table = document.createElement('table');
4054 table.className = 'table table-condensed table-hover';
4055
4056 var has_caption = false;
4057 var has_description = false;
4058
4059 for (var i = 0; i < this.options.columns.length; i++)
4060 if (this.options.columns[i].caption)
4061 {
4062 has_caption = true;
4063 break;
4064 }
4065 else if (this.options.columns[i].description)
4066 {
4067 has_description = true;
4068 break;
4069 }
4070
4071 if (has_caption)
4072 {
4073 var tr = table.insertRow(-1);
4074 tr.className = 'cbi-section-table-titles';
4075
4076 for (var i = 0; i < this.options.columns.length; i++)
4077 {
4078 var col = this.options.columns[i];
4079 var th = document.createElement('th');
4080 th.className = 'cbi-section-table-cell';
4081
4082 tr.appendChild(th);
4083
4084 if (col.width)
4085 th.style.width = col.width;
4086
4087 if (col.align)
4088 th.style.textAlign = col.align;
4089
4090 if (col.caption)
4091 $(th).append(col.caption);
4092 }
4093 }
4094
4095 if (has_description)
4096 {
4097 var tr = table.insertRow(-1);
4098 tr.className = 'cbi-section-table-descr';
4099
4100 for (var i = 0; i < this.options.columns.length; i++)
4101 {
4102 var col = this.options.columns[i];
4103 var th = document.createElement('th');
4104 th.className = 'cbi-section-table-cell';
4105
4106 tr.appendChild(th);
4107
4108 if (col.width)
4109 th.style.width = col.width;
4110
4111 if (col.align)
4112 th.style.textAlign = col.align;
4113
4114 if (col.description)
4115 $(th).append(col.description);
4116 }
4117 }
4118
4119 if (this._rows.length == 0)
4120 {
4121 if (this.options.placeholder)
4122 {
4123 var tr = table.insertRow(-1);
4124 var td = tr.insertCell(-1);
4125 td.className = 'cbi-section-table-cell';
4126
4127 td.colSpan = this.options.columns.length;
4128 $(td).append(this.options.placeholder);
4129 }
4130 }
4131 else
4132 {
4133 for (var i = 0; i < this._rows.length; i++)
4134 {
4135 var tr = table.insertRow(-1);
4136
4137 for (var j = 0; j < this.options.columns.length; j++)
4138 {
4139 var col = this.options.columns[j];
4140 var td = tr.insertCell(-1);
4141
4142 var val = this._rows[i][j];
4143
4144 if (typeof(val) == 'undefined')
4145 val = col.placeholder;
4146
4147 if (typeof(val) == 'undefined')
4148 val = '';
4149
4150 if (col.width)
4151 td.style.width = col.width;
4152
4153 if (col.align)
4154 td.style.textAlign = col.align;
4155
4156 if (typeof col.format == 'string')
4157 $(td).append(col.format.format(val));
4158 else if (typeof col.format == 'function')
4159 $(td).append(col.format(val, i));
4160 else
4161 $(td).append(val);
4162 }
4163 }
4164 }
4165
4166 this._rows = [ ];
4167 fieldset.appendChild(table);
4168
4169 return fieldset;
4170 }
4171 });
4172
4173 this.ui.progress = this.ui.AbstractWidget.extend({
4174 render: function()
4175 {
4176 var vn = parseInt(this.options.value) || 0;
4177 var mn = parseInt(this.options.max) || 100;
4178 var pc = Math.floor((100 / mn) * vn);
4179
4180 var text;
4181
4182 if (typeof(this.options.format) == 'string')
4183 text = this.options.format.format(this.options.value, this.options.max, pc);
4184 else if (typeof(this.options.format) == 'function')
4185 text = this.options.format(pc);
4186 else
4187 text = '%.2f%%'.format(pc);
4188
4189 return $('<div />')
4190 .addClass('progress')
4191 .append($('<div />')
4192 .addClass('progress-bar')
4193 .addClass('progress-bar-info')
4194 .css('width', pc + '%'))
4195 .append($('<small />')
4196 .text(text));
4197 }
4198 });
4199
4200 this.ui.devicebadge = this.ui.AbstractWidget.extend({
4201 render: function()
4202 {
4203 var l2dev = this.options.l2_device || this.options.device;
4204 var l3dev = this.options.l3_device;
4205 var dev = l3dev || l2dev || '?';
4206
4207 var span = document.createElement('span');
4208 span.className = 'badge';
4209
4210 if (typeof(this.options.signal) == 'number' ||
4211 typeof(this.options.noise) == 'number')
4212 {
4213 var r = 'none';
4214 if (typeof(this.options.signal) != 'undefined' &&
4215 typeof(this.options.noise) != 'undefined')
4216 {
4217 var q = (-1 * (this.options.noise - this.options.signal)) / 5;
4218 if (q < 1)
4219 r = '0';
4220 else if (q < 2)
4221 r = '0-25';
4222 else if (q < 3)
4223 r = '25-50';
4224 else if (q < 4)
4225 r = '50-75';
4226 else
4227 r = '75-100';
4228 }
4229
4230 span.appendChild(document.createElement('img'));
4231 span.lastChild.src = L.globals.resource + '/icons/signal-' + r + '.png';
4232
4233 if (r == 'none')
4234 span.title = L.tr('No signal');
4235 else
4236 span.title = '%s: %d %s / %s: %d %s'.format(
4237 L.tr('Signal'), this.options.signal, L.tr('dBm'),
4238 L.tr('Noise'), this.options.noise, L.tr('dBm')
4239 );
4240 }
4241 else
4242 {
4243 var type = 'ethernet';
4244 var desc = L.tr('Ethernet device');
4245
4246 if (l3dev != l2dev)
4247 {
4248 type = 'tunnel';
4249 desc = L.tr('Tunnel interface');
4250 }
4251 else if (dev.indexOf('br-') == 0)
4252 {
4253 type = 'bridge';
4254 desc = L.tr('Bridge');
4255 }
4256 else if (dev.indexOf('.') > 0)
4257 {
4258 type = 'vlan';
4259 desc = L.tr('VLAN interface');
4260 }
4261 else if (dev.indexOf('wlan') == 0 ||
4262 dev.indexOf('ath') == 0 ||
4263 dev.indexOf('wl') == 0)
4264 {
4265 type = 'wifi';
4266 desc = L.tr('Wireless Network');
4267 }
4268
4269 span.appendChild(document.createElement('img'));
4270 span.lastChild.src = L.globals.resource + '/icons/' + type + (this.options.up ? '' : '_disabled') + '.png';
4271 span.title = desc;
4272 }
4273
4274 $(span).append(' ');
4275 $(span).append(dev);
4276
4277 return span;
4278 }
4279 });
4280
4281 var type = function(f, l)
4282 {
4283 f.message = l;
4284 return f;
4285 };
4286
4287 this.cbi = {
4288 validation: {
4289 i18n: function(msg)
4290 {
4291 L.cbi.validation.message = L.tr(msg);
4292 },
4293
4294 compile: function(code)
4295 {
4296 var pos = 0;
4297 var esc = false;
4298 var depth = 0;
4299 var types = L.cbi.validation.types;
4300 var stack = [ ];
4301
4302 code += ',';
4303
4304 for (var i = 0; i < code.length; i++)
4305 {
4306 if (esc)
4307 {
4308 esc = false;
4309 continue;
4310 }
4311
4312 switch (code.charCodeAt(i))
4313 {
4314 case 92:
4315 esc = true;
4316 break;
4317
4318 case 40:
4319 case 44:
4320 if (depth <= 0)
4321 {
4322 if (pos < i)
4323 {
4324 var label = code.substring(pos, i);
4325 label = label.replace(/\\(.)/g, '$1');
4326 label = label.replace(/^[ \t]+/g, '');
4327 label = label.replace(/[ \t]+$/g, '');
4328
4329 if (label && !isNaN(label))
4330 {
4331 stack.push(parseFloat(label));
4332 }
4333 else if (label.match(/^(['"]).*\1$/))
4334 {
4335 stack.push(label.replace(/^(['"])(.*)\1$/, '$2'));
4336 }
4337 else if (typeof types[label] == 'function')
4338 {
4339 stack.push(types[label]);
4340 stack.push([ ]);
4341 }
4342 else
4343 {
4344 throw "Syntax error, unhandled token '"+label+"'";
4345 }
4346 }
4347 pos = i+1;
4348 }
4349 depth += (code.charCodeAt(i) == 40);
4350 break;
4351
4352 case 41:
4353 if (--depth <= 0)
4354 {
4355 if (typeof stack[stack.length-2] != 'function')
4356 throw "Syntax error, argument list follows non-function";
4357
4358 stack[stack.length-1] =
4359 L.cbi.validation.compile(code.substring(pos, i));
4360
4361 pos = i+1;
4362 }
4363 break;
4364 }
4365 }
4366
4367 return stack;
4368 }
4369 }
4370 };
4371
4372 var validation = this.cbi.validation;
4373
4374 validation.types = {
4375 'integer': function()
4376 {
4377 if (this.match(/^-?[0-9]+$/) != null)
4378 return true;
4379
4380 validation.i18n('Must be a valid integer');
4381 return false;
4382 },
4383
4384 'uinteger': function()
4385 {
4386 if (validation.types['integer'].apply(this) && (this >= 0))
4387 return true;
4388
4389 validation.i18n('Must be a positive integer');
4390 return false;
4391 },
4392
4393 'float': function()
4394 {
4395 if (!isNaN(parseFloat(this)))
4396 return true;
4397
4398 validation.i18n('Must be a valid number');
4399 return false;
4400 },
4401
4402 'ufloat': function()
4403 {
4404 if (validation.types['float'].apply(this) && (this >= 0))
4405 return true;
4406
4407 validation.i18n('Must be a positive number');
4408 return false;
4409 },
4410
4411 'ipaddr': function()
4412 {
4413 if (validation.types['ip4addr'].apply(this) ||
4414 validation.types['ip6addr'].apply(this))
4415 return true;
4416
4417 validation.i18n('Must be a valid IP address');
4418 return false;
4419 },
4420
4421 'ip4addr': function()
4422 {
4423 if (this.match(/^(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})(\/(\S+))?$/))
4424 {
4425 if ((RegExp.$1 >= 0) && (RegExp.$1 <= 255) &&
4426 (RegExp.$2 >= 0) && (RegExp.$2 <= 255) &&
4427 (RegExp.$3 >= 0) && (RegExp.$3 <= 255) &&
4428 (RegExp.$4 >= 0) && (RegExp.$4 <= 255) &&
4429 ((RegExp.$6.indexOf('.') < 0)
4430 ? ((RegExp.$6 >= 0) && (RegExp.$6 <= 32))
4431 : (validation.types['ip4addr'].apply(RegExp.$6))))
4432 return true;
4433 }
4434
4435 validation.i18n('Must be a valid IPv4 address');
4436 return false;
4437 },
4438
4439 'ip6addr': function()
4440 {
4441 if (this.match(/^([a-fA-F0-9:.]+)(\/(\d+))?$/))
4442 {
4443 if (!RegExp.$2 || ((RegExp.$3 >= 0) && (RegExp.$3 <= 128)))
4444 {
4445 var addr = RegExp.$1;
4446
4447 if (addr == '::')
4448 {
4449 return true;
4450 }
4451
4452 if (addr.indexOf('.') > 0)
4453 {
4454 var off = addr.lastIndexOf(':');
4455
4456 if (!(off && validation.types['ip4addr'].apply(addr.substr(off+1))))
4457 {
4458 validation.i18n('Must be a valid IPv6 address');
4459 return false;
4460 }
4461
4462 addr = addr.substr(0, off) + ':0:0';
4463 }
4464
4465 if (addr.indexOf('::') >= 0)
4466 {
4467 var colons = 0;
4468 var fill = '0';
4469
4470 for (var i = 1; i < (addr.length-1); i++)
4471 if (addr.charAt(i) == ':')
4472 colons++;
4473
4474 if (colons > 7)
4475 {
4476 validation.i18n('Must be a valid IPv6 address');
4477 return false;
4478 }
4479
4480 for (var i = 0; i < (7 - colons); i++)
4481 fill += ':0';
4482
4483 if (addr.match(/^(.*?)::(.*?)$/))
4484 addr = (RegExp.$1 ? RegExp.$1 + ':' : '') + fill +
4485 (RegExp.$2 ? ':' + RegExp.$2 : '');
4486 }
4487
4488 if (addr.match(/^(?:[a-fA-F0-9]{1,4}:){7}[a-fA-F0-9]{1,4}$/) != null)
4489 return true;
4490
4491 validation.i18n('Must be a valid IPv6 address');
4492 return false;
4493 }
4494 }
4495
4496 validation.i18n('Must be a valid IPv6 address');
4497 return false;
4498 },
4499
4500 'port': function()
4501 {
4502 if (validation.types['integer'].apply(this) &&
4503 (this >= 0) && (this <= 65535))
4504 return true;
4505
4506 validation.i18n('Must be a valid port number');
4507 return false;
4508 },
4509
4510 'portrange': function()
4511 {
4512 if (this.match(/^(\d+)-(\d+)$/))
4513 {
4514 var p1 = RegExp.$1;
4515 var p2 = RegExp.$2;
4516
4517 if (validation.types['port'].apply(p1) &&
4518 validation.types['port'].apply(p2) &&
4519 (parseInt(p1) <= parseInt(p2)))
4520 return true;
4521 }
4522 else if (validation.types['port'].apply(this))
4523 {
4524 return true;
4525 }
4526
4527 validation.i18n('Must be a valid port range');
4528 return false;
4529 },
4530
4531 'macaddr': function()
4532 {
4533 if (this.match(/^([a-fA-F0-9]{2}:){5}[a-fA-F0-9]{2}$/) != null)
4534 return true;
4535
4536 validation.i18n('Must be a valid MAC address');
4537 return false;
4538 },
4539
4540 'host': function()
4541 {
4542 if (validation.types['hostname'].apply(this) ||
4543 validation.types['ipaddr'].apply(this))
4544 return true;
4545
4546 validation.i18n('Must be a valid hostname or IP address');
4547 return false;
4548 },
4549
4550 'hostname': function()
4551 {
4552 if ((this.length <= 253) &&
4553 ((this.match(/^[a-zA-Z0-9]+$/) != null ||
4554 (this.match(/^[a-zA-Z0-9_][a-zA-Z0-9_\-.]*[a-zA-Z0-9]$/) &&
4555 this.match(/[^0-9.]/)))))
4556 return true;
4557
4558 validation.i18n('Must be a valid host name');
4559 return false;
4560 },
4561
4562 'network': function()
4563 {
4564 if (validation.types['uciname'].apply(this) ||
4565 validation.types['host'].apply(this))
4566 return true;
4567
4568 validation.i18n('Must be a valid network name');
4569 return false;
4570 },
4571
4572 'wpakey': function()
4573 {
4574 var v = this;
4575
4576 if ((v.length == 64)
4577 ? (v.match(/^[a-fA-F0-9]{64}$/) != null)
4578 : ((v.length >= 8) && (v.length <= 63)))
4579 return true;
4580
4581 validation.i18n('Must be a valid WPA key');
4582 return false;
4583 },
4584
4585 'wepkey': function()
4586 {
4587 var v = this;
4588
4589 if (v.substr(0,2) == 's:')
4590 v = v.substr(2);
4591
4592 if (((v.length == 10) || (v.length == 26))
4593 ? (v.match(/^[a-fA-F0-9]{10,26}$/) != null)
4594 : ((v.length == 5) || (v.length == 13)))
4595 return true;
4596
4597 validation.i18n('Must be a valid WEP key');
4598 return false;
4599 },
4600
4601 'uciname': function()
4602 {
4603 if (this.match(/^[a-zA-Z0-9_]+$/) != null)
4604 return true;
4605
4606 validation.i18n('Must be a valid UCI identifier');
4607 return false;
4608 },
4609
4610 'range': function(min, max)
4611 {
4612 var val = parseFloat(this);
4613
4614 if (validation.types['integer'].apply(this) &&
4615 !isNaN(min) && !isNaN(max) && ((val >= min) && (val <= max)))
4616 return true;
4617
4618 validation.i18n('Must be a number between %d and %d');
4619 return false;
4620 },
4621
4622 'min': function(min)
4623 {
4624 var val = parseFloat(this);
4625
4626 if (validation.types['integer'].apply(this) &&
4627 !isNaN(min) && !isNaN(val) && (val >= min))
4628 return true;
4629
4630 validation.i18n('Must be a number greater or equal to %d');
4631 return false;
4632 },
4633
4634 'max': function(max)
4635 {
4636 var val = parseFloat(this);
4637
4638 if (validation.types['integer'].apply(this) &&
4639 !isNaN(max) && !isNaN(val) && (val <= max))
4640 return true;
4641
4642 validation.i18n('Must be a number lower or equal to %d');
4643 return false;
4644 },
4645
4646 'rangelength': function(min, max)
4647 {
4648 var val = '' + this;
4649
4650 if (!isNaN(min) && !isNaN(max) &&
4651 (val.length >= min) && (val.length <= max))
4652 return true;
4653
4654 validation.i18n('Must be between %d and %d characters');
4655 return false;
4656 },
4657
4658 'minlength': function(min)
4659 {
4660 var val = '' + this;
4661
4662 if (!isNaN(min) && (val.length >= min))
4663 return true;
4664
4665 validation.i18n('Must be at least %d characters');
4666 return false;
4667 },
4668
4669 'maxlength': function(max)
4670 {
4671 var val = '' + this;
4672
4673 if (!isNaN(max) && (val.length <= max))
4674 return true;
4675
4676 validation.i18n('Must be at most %d characters');
4677 return false;
4678 },
4679
4680 'or': function()
4681 {
4682 var msgs = [ ];
4683
4684 for (var i = 0; i < arguments.length; i += 2)
4685 {
4686 delete validation.message;
4687
4688 if (typeof(arguments[i]) != 'function')
4689 {
4690 if (arguments[i] == this)
4691 return true;
4692 i--;
4693 }
4694 else if (arguments[i].apply(this, arguments[i+1]))
4695 {
4696 return true;
4697 }
4698
4699 if (validation.message)
4700 msgs.push(validation.message.format.apply(validation.message, arguments[i+1]));
4701 }
4702
4703 validation.message = msgs.join( L.tr(' - or - '));
4704 return false;
4705 },
4706
4707 'and': function()
4708 {
4709 var msgs = [ ];
4710
4711 for (var i = 0; i < arguments.length; i += 2)
4712 {
4713 delete validation.message;
4714
4715 if (typeof arguments[i] != 'function')
4716 {
4717 if (arguments[i] != this)
4718 return false;
4719 i--;
4720 }
4721 else if (!arguments[i].apply(this, arguments[i+1]))
4722 {
4723 return false;
4724 }
4725
4726 if (validation.message)
4727 msgs.push(validation.message.format.apply(validation.message, arguments[i+1]));
4728 }
4729
4730 validation.message = msgs.join(', ');
4731 return true;
4732 },
4733
4734 'neg': function()
4735 {
4736 return validation.types['or'].apply(
4737 this.replace(/^[ \t]*![ \t]*/, ''), arguments);
4738 },
4739
4740 'list': function(subvalidator, subargs)
4741 {
4742 if (typeof subvalidator != 'function')
4743 return false;
4744
4745 var tokens = this.match(/[^ \t]+/g);
4746 for (var i = 0; i < tokens.length; i++)
4747 if (!subvalidator.apply(tokens[i], subargs))
4748 return false;
4749
4750 return true;
4751 },
4752
4753 'phonedigit': function()
4754 {
4755 if (this.match(/^[0-9\*#!\.]+$/) != null)
4756 return true;
4757
4758 validation.i18n('Must be a valid phone number digit');
4759 return false;
4760 },
4761
4762 'string': function()
4763 {
4764 return true;
4765 }
4766 };
4767
4768
4769 this.cbi.AbstractValue = this.ui.AbstractWidget.extend({
4770 init: function(name, options)
4771 {
4772 this.name = name;
4773 this.instance = { };
4774 this.dependencies = [ ];
4775 this.rdependency = { };
4776
4777 this.options = L.defaults(options, {
4778 placeholder: '',
4779 datatype: 'string',
4780 optional: false,
4781 keep: true
4782 });
4783 },
4784
4785 id: function(sid)
4786 {
4787 return this.section.id('field', sid || '__unknown__', this.name);
4788 },
4789
4790 render: function(sid, condensed)
4791 {
4792 var i = this.instance[sid] = { };
4793
4794 i.top = $('<div />');
4795
4796 if (!condensed)
4797 {
4798 i.top.addClass('form-group');
4799
4800 if (typeof(this.options.caption) == 'string')
4801 $('<label />')
4802 .addClass('col-lg-2 control-label')
4803 .attr('for', this.id(sid))
4804 .text(this.options.caption)
4805 .appendTo(i.top);
4806 }
4807
4808 i.error = $('<div />')
4809 .hide()
4810 .addClass('label label-danger');
4811
4812 i.widget = $('<div />')
4813
4814 .append(this.widget(sid))
4815 .append(i.error)
4816 .appendTo(i.top);
4817
4818 if (!condensed)
4819 {
4820 i.widget.addClass('col-lg-5');
4821
4822 $('<div />')
4823 .addClass('col-lg-5')
4824 .text((typeof(this.options.description) == 'string') ? this.options.description : '')
4825 .appendTo(i.top);
4826 }
4827
4828 return i.top;
4829 },
4830
4831 active: function(sid)
4832 {
4833 return (this.instance[sid] && !this.instance[sid].disabled);
4834 },
4835
4836 ucipath: function(sid)
4837 {
4838 return {
4839 config: (this.options.uci_package || this.map.uci_package),
4840 section: (this.options.uci_section || sid),
4841 option: (this.options.uci_option || this.name)
4842 };
4843 },
4844
4845 ucivalue: function(sid)
4846 {
4847 var uci = this.ucipath(sid);
4848 var val = this.map.get(uci.config, uci.section, uci.option);
4849
4850 if (typeof(val) == 'undefined')
4851 return this.options.initial;
4852
4853 return val;
4854 },
4855
4856 formvalue: function(sid)
4857 {
4858 var v = $('#' + this.id(sid)).val();
4859 return (v === '') ? undefined : v;
4860 },
4861
4862 textvalue: function(sid)
4863 {
4864 var v = this.formvalue(sid);
4865
4866 if (typeof(v) == 'undefined' || ($.isArray(v) && !v.length))
4867 v = this.ucivalue(sid);
4868
4869 if (typeof(v) == 'undefined' || ($.isArray(v) && !v.length))
4870 v = this.options.placeholder;
4871
4872 if (typeof(v) == 'undefined' || v === '')
4873 return undefined;
4874
4875 if (typeof(v) == 'string' && $.isArray(this.choices))
4876 {
4877 for (var i = 0; i < this.choices.length; i++)
4878 if (v === this.choices[i][0])
4879 return this.choices[i][1];
4880 }
4881 else if (v === true)
4882 return L.tr('yes');
4883 else if (v === false)
4884 return L.tr('no');
4885 else if ($.isArray(v))
4886 return v.join(', ');
4887
4888 return v;
4889 },
4890
4891 changed: function(sid)
4892 {
4893 var a = this.ucivalue(sid);
4894 var b = this.formvalue(sid);
4895
4896 if (typeof(a) != typeof(b))
4897 return true;
4898
4899 if (typeof(a) == 'object')
4900 {
4901 if (a.length != b.length)
4902 return true;
4903
4904 for (var i = 0; i < a.length; i++)
4905 if (a[i] != b[i])
4906 return true;
4907
4908 return false;
4909 }
4910
4911 return (a != b);
4912 },
4913
4914 save: function(sid)
4915 {
4916 var uci = this.ucipath(sid);
4917
4918 if (this.instance[sid].disabled)
4919 {
4920 if (!this.options.keep)
4921 return this.map.set(uci.config, uci.section, uci.option, undefined);
4922
4923 return false;
4924 }
4925
4926 var chg = this.changed(sid);
4927 var val = this.formvalue(sid);
4928
4929 if (chg)
4930 this.map.set(uci.config, uci.section, uci.option, val);
4931
4932 return chg;
4933 },
4934
4935 _ev_validate: function(ev)
4936 {
4937 var d = ev.data;
4938 var rv = true;
4939 var val = d.elem.val();
4940 var vstack = d.vstack;
4941
4942 if (vstack && typeof(vstack[0]) == 'function')
4943 {
4944 delete validation.message;
4945
4946 if ((val.length == 0 && !d.opt))
4947 {
4948 d.elem.parents('div.form-group, td').first().addClass('luci2-form-error');
4949 d.elem.parents('div.input-group, div.form-group, td').first().addClass('has-error');
4950
4951 d.inst.error.text(L.tr('Field must not be empty')).show();
4952 rv = false;
4953 }
4954 else if (val.length > 0 && !vstack[0].apply(val, vstack[1]))
4955 {
4956 d.elem.parents('div.form-group, td').first().addClass('luci2-form-error');
4957 d.elem.parents('div.input-group, div.form-group, td').first().addClass('has-error');
4958
4959 d.inst.error.text(validation.message.format.apply(validation.message, vstack[1])).show();
4960 rv = false;
4961 }
4962 else
4963 {
4964 d.elem.parents('div.form-group, td').first().removeClass('luci2-form-error');
4965 d.elem.parents('div.input-group, div.form-group, td').first().removeClass('has-error');
4966
4967 if (d.multi && d.inst.widget && d.inst.widget.find('input.error, select.error').length > 0)
4968 rv = false;
4969 else
4970 d.inst.error.text('').hide();
4971 }
4972 }
4973
4974 if (rv)
4975 {
4976 for (var field in d.self.rdependency)
4977 d.self.rdependency[field].toggle(d.sid);
4978
4979 d.self.section.tabtoggle(d.sid);
4980 }
4981
4982 return rv;
4983 },
4984
4985 validator: function(sid, elem, multi)
4986 {
4987 var evdata = {
4988 self: this,
4989 sid: sid,
4990 elem: elem,
4991 multi: multi,
4992 inst: this.instance[sid],
4993 opt: this.options.optional
4994 };
4995
4996 if (this.events)
4997 for (var evname in this.events)
4998 elem.on(evname, evdata, this.events[evname]);
4999
5000 if (typeof(this.options.datatype) == 'undefined' && $.isEmptyObject(this.rdependency))
5001 return elem;
5002
5003 var vstack;
5004 if (typeof(this.options.datatype) == 'string')
5005 {
5006 try {
5007 evdata.vstack = L.cbi.validation.compile(this.options.datatype);
5008 } catch(e) { };
5009 }
5010 else if (typeof(this.options.datatype) == 'function')
5011 {
5012 var vfunc = this.options.datatype;
5013 evdata.vstack = [ function(elem) {
5014 var rv = vfunc(this, elem);
5015 if (rv !== true)
5016 validation.message = rv;
5017 return (rv === true);
5018 }, [ elem ] ];
5019 }
5020
5021 if (elem.prop('tagName') == 'SELECT')
5022 {
5023 elem.change(evdata, this._ev_validate);
5024 }
5025 else if (elem.prop('tagName') == 'INPUT' && elem.attr('type') == 'checkbox')
5026 {
5027 elem.click(evdata, this._ev_validate);
5028 elem.blur(evdata, this._ev_validate);
5029 }
5030 else
5031 {
5032 elem.keyup(evdata, this._ev_validate);
5033 elem.blur(evdata, this._ev_validate);
5034 }
5035
5036 elem.attr('cbi-validate', true).on('validate', evdata, this._ev_validate);
5037
5038 return elem;
5039 },
5040
5041 validate: function(sid)
5042 {
5043 var i = this.instance[sid];
5044
5045 i.widget.find('[cbi-validate]').trigger('validate');
5046
5047 return (i.disabled || i.error.text() == '');
5048 },
5049
5050 depends: function(d, v, add)
5051 {
5052 var dep;
5053
5054 if ($.isArray(d))
5055 {
5056 dep = { };
5057 for (var i = 0; i < d.length; i++)
5058 {
5059 if (typeof(d[i]) == 'string')
5060 dep[d[i]] = true;
5061 else if (d[i] instanceof L.cbi.AbstractValue)
5062 dep[d[i].name] = true;
5063 }
5064 }
5065 else if (d instanceof L.cbi.AbstractValue)
5066 {
5067 dep = { };
5068 dep[d.name] = (typeof(v) == 'undefined') ? true : v;
5069 }
5070 else if (typeof(d) == 'object')
5071 {
5072 dep = d;
5073 }
5074 else if (typeof(d) == 'string')
5075 {
5076 dep = { };
5077 dep[d] = (typeof(v) == 'undefined') ? true : v;
5078 }
5079
5080 if (!dep || $.isEmptyObject(dep))
5081 return this;
5082
5083 for (var field in dep)
5084 {
5085 var f = this.section.fields[field];
5086 if (f)
5087 f.rdependency[this.name] = this;
5088 else
5089 delete dep[field];
5090 }
5091
5092 if ($.isEmptyObject(dep))
5093 return this;
5094
5095 if (!add || !this.dependencies.length)
5096 this.dependencies.push(dep);
5097 else
5098 for (var i = 0; i < this.dependencies.length; i++)
5099 $.extend(this.dependencies[i], dep);
5100
5101 return this;
5102 },
5103
5104 toggle: function(sid)
5105 {
5106 var d = this.dependencies;
5107 var i = this.instance[sid];
5108
5109 if (!d.length)
5110 return true;
5111
5112 for (var n = 0; n < d.length; n++)
5113 {
5114 var rv = true;
5115
5116 for (var field in d[n])
5117 {
5118 var val = this.section.fields[field].formvalue(sid);
5119 var cmp = d[n][field];
5120
5121 if (typeof(cmp) == 'boolean')
5122 {
5123 if (cmp == (typeof(val) == 'undefined' || val === '' || val === false))
5124 {
5125 rv = false;
5126 break;
5127 }
5128 }
5129 else if (typeof(cmp) == 'string' || typeof(cmp) == 'number')
5130 {
5131 if (val != cmp)
5132 {
5133 rv = false;
5134 break;
5135 }
5136 }
5137 else if (typeof(cmp) == 'function')
5138 {
5139 if (!cmp(val))
5140 {
5141 rv = false;
5142 break;
5143 }
5144 }
5145 else if (cmp instanceof RegExp)
5146 {
5147 if (!cmp.test(val))
5148 {
5149 rv = false;
5150 break;
5151 }
5152 }
5153 }
5154
5155 if (rv)
5156 {
5157 if (i.disabled)
5158 {
5159 i.disabled = false;
5160 i.top.fadeIn();
5161 }
5162
5163 return true;
5164 }
5165 }
5166
5167 if (!i.disabled)
5168 {
5169 i.disabled = true;
5170 i.top.is(':visible') ? i.top.fadeOut() : i.top.hide();
5171 }
5172
5173 return false;
5174 }
5175 });
5176
5177 this.cbi.CheckboxValue = this.cbi.AbstractValue.extend({
5178 widget: function(sid)
5179 {
5180 var o = this.options;
5181
5182 if (typeof(o.enabled) == 'undefined') o.enabled = '1';
5183 if (typeof(o.disabled) == 'undefined') o.disabled = '0';
5184
5185 var i = $('<input />')
5186 .attr('id', this.id(sid))
5187 .attr('type', 'checkbox')
5188 .prop('checked', this.ucivalue(sid));
5189
5190 return $('<div />')
5191 .addClass('checkbox')
5192 .append(this.validator(sid, i));
5193 },
5194
5195 ucivalue: function(sid)
5196 {
5197 var v = this.callSuper('ucivalue', sid);
5198
5199 if (typeof(v) == 'boolean')
5200 return v;
5201
5202 return (v == this.options.enabled);
5203 },
5204
5205 formvalue: function(sid)
5206 {
5207 var v = $('#' + this.id(sid)).prop('checked');
5208
5209 if (typeof(v) == 'undefined')
5210 return !!this.options.initial;
5211
5212 return v;
5213 },
5214
5215 save: function(sid)
5216 {
5217 var uci = this.ucipath(sid);
5218
5219 if (this.instance[sid].disabled)
5220 {
5221 if (!this.options.keep)
5222 return this.map.set(uci.config, uci.section, uci.option, undefined);
5223
5224 return false;
5225 }
5226
5227 var chg = this.changed(sid);
5228 var val = this.formvalue(sid);
5229
5230 if (chg)
5231 {
5232 if (this.options.optional && val == this.options.initial)
5233 this.map.set(uci.config, uci.section, uci.option, undefined);
5234 else
5235 this.map.set(uci.config, uci.section, uci.option, val ? this.options.enabled : this.options.disabled);
5236 }
5237
5238 return chg;
5239 }
5240 });
5241
5242 this.cbi.InputValue = this.cbi.AbstractValue.extend({
5243 widget: function(sid)
5244 {
5245 var i = $('<input />')
5246 .addClass('form-control')
5247 .attr('id', this.id(sid))
5248 .attr('type', 'text')
5249 .attr('placeholder', this.options.placeholder)
5250 .val(this.ucivalue(sid));
5251
5252 return this.validator(sid, i);
5253 }
5254 });
5255
5256 this.cbi.PasswordValue = this.cbi.AbstractValue.extend({
5257 widget: function(sid)
5258 {
5259 var i = $('<input />')
5260 .addClass('form-control')
5261 .attr('id', this.id(sid))
5262 .attr('type', 'password')
5263 .attr('placeholder', this.options.placeholder)
5264 .val(this.ucivalue(sid));
5265
5266 var t = $('<span />')
5267 .addClass('input-group-btn')
5268 .append(L.ui.button(L.tr('Reveal'), 'default')
5269 .click(function(ev) {
5270 var b = $(this);
5271 var i = b.parent().prev();
5272 var t = i.attr('type');
5273 b.text(t == 'password' ? L.tr('Hide') : L.tr('Reveal'));
5274 i.attr('type', (t == 'password') ? 'text' : 'password');
5275 b = i = t = null;
5276 }));
5277
5278 this.validator(sid, i);
5279
5280 return $('<div />')
5281 .addClass('input-group')
5282 .append(i)
5283 .append(t);
5284 }
5285 });
5286
5287 this.cbi.ListValue = this.cbi.AbstractValue.extend({
5288 widget: function(sid)
5289 {
5290 var s = $('<select />')
5291 .addClass('form-control');
5292
5293 if (this.options.optional && !this.has_empty)
5294 $('<option />')
5295 .attr('value', '')
5296 .text(L.tr('-- Please choose --'))
5297 .appendTo(s);
5298
5299 if (this.choices)
5300 for (var i = 0; i < this.choices.length; i++)
5301 $('<option />')
5302 .attr('value', this.choices[i][0])
5303 .text(this.choices[i][1])
5304 .appendTo(s);
5305
5306 s.attr('id', this.id(sid)).val(this.ucivalue(sid));
5307
5308 return this.validator(sid, s);
5309 },
5310
5311 value: function(k, v)
5312 {
5313 if (!this.choices)
5314 this.choices = [ ];
5315
5316 if (k == '')
5317 this.has_empty = true;
5318
5319 this.choices.push([k, v || k]);
5320 return this;
5321 }
5322 });
5323
5324 this.cbi.MultiValue = this.cbi.ListValue.extend({
5325 widget: function(sid)
5326 {
5327 var v = this.ucivalue(sid);
5328 var t = $('<div />').attr('id', this.id(sid));
5329
5330 if (!$.isArray(v))
5331 v = (typeof(v) != 'undefined') ? v.toString().split(/\s+/) : [ ];
5332
5333 var s = { };
5334 for (var i = 0; i < v.length; i++)
5335 s[v[i]] = true;
5336
5337 if (this.choices)
5338 for (var i = 0; i < this.choices.length; i++)
5339 {
5340 $('<label />')
5341 .addClass('checkbox')
5342 .append($('<input />')
5343 .attr('type', 'checkbox')
5344 .attr('value', this.choices[i][0])
5345 .prop('checked', s[this.choices[i][0]]))
5346 .append(this.choices[i][1])
5347 .appendTo(t);
5348 }
5349
5350 return t;
5351 },
5352
5353 formvalue: function(sid)
5354 {
5355 var rv = [ ];
5356 var fields = $('#' + this.id(sid) + ' > label > input');
5357
5358 for (var i = 0; i < fields.length; i++)
5359 if (fields[i].checked)
5360 rv.push(fields[i].getAttribute('value'));
5361
5362 return rv;
5363 },
5364
5365 textvalue: function(sid)
5366 {
5367 var v = this.formvalue(sid);
5368 var c = { };
5369
5370 if (this.choices)
5371 for (var i = 0; i < this.choices.length; i++)
5372 c[this.choices[i][0]] = this.choices[i][1];
5373
5374 var t = [ ];
5375
5376 for (var i = 0; i < v.length; i++)
5377 t.push(c[v[i]] || v[i]);
5378
5379 return t.join(', ');
5380 }
5381 });
5382
5383 this.cbi.ComboBox = this.cbi.AbstractValue.extend({
5384 _change: function(ev)
5385 {
5386 var s = ev.target;
5387 var self = ev.data.self;
5388
5389 if (s.selectedIndex == (s.options.length - 1))
5390 {
5391 ev.data.select.hide();
5392 ev.data.input.show().focus();
5393 ev.data.input.val('');
5394 }
5395 else if (self.options.optional && s.selectedIndex == 0)
5396 {
5397 ev.data.input.val('');
5398 }
5399 else
5400 {
5401 ev.data.input.val(ev.data.select.val());
5402 }
5403
5404 ev.stopPropagation();
5405 },
5406
5407 _blur: function(ev)
5408 {
5409 var seen = false;
5410 var val = this.value;
5411 var self = ev.data.self;
5412
5413 ev.data.select.empty();
5414
5415 if (self.options.optional && !self.has_empty)
5416 $('<option />')
5417 .attr('value', '')
5418 .text(L.tr('-- please choose --'))
5419 .appendTo(ev.data.select);
5420
5421 if (self.choices)
5422 for (var i = 0; i < self.choices.length; i++)
5423 {
5424 if (self.choices[i][0] == val)
5425 seen = true;
5426
5427 $('<option />')
5428 .attr('value', self.choices[i][0])
5429 .text(self.choices[i][1])
5430 .appendTo(ev.data.select);
5431 }
5432
5433 if (!seen && val != '')
5434 $('<option />')
5435 .attr('value', val)
5436 .text(val)
5437 .appendTo(ev.data.select);
5438
5439 $('<option />')
5440 .attr('value', ' ')
5441 .text(L.tr('-- custom --'))
5442 .appendTo(ev.data.select);
5443
5444 ev.data.input.hide();
5445 ev.data.select.val(val).show().blur();
5446 },
5447
5448 _enter: function(ev)
5449 {
5450 if (ev.which != 13)
5451 return true;
5452
5453 ev.preventDefault();
5454 ev.data.self._blur(ev);
5455 return false;
5456 },
5457
5458 widget: function(sid)
5459 {
5460 var d = $('<div />')
5461 .attr('id', this.id(sid));
5462
5463 var t = $('<input />')
5464 .addClass('form-control')
5465 .attr('type', 'text')
5466 .hide()
5467 .appendTo(d);
5468
5469 var s = $('<select />')
5470 .addClass('form-control')
5471 .appendTo(d);
5472
5473 var evdata = {
5474 self: this,
5475 input: t,
5476 select: s
5477 };
5478
5479 s.change(evdata, this._change);
5480 t.blur(evdata, this._blur);
5481 t.keydown(evdata, this._enter);
5482
5483 t.val(this.ucivalue(sid));
5484 t.blur();
5485
5486 this.validator(sid, t);
5487 this.validator(sid, s);
5488
5489 return d;
5490 },
5491
5492 value: function(k, v)
5493 {
5494 if (!this.choices)
5495 this.choices = [ ];
5496
5497 if (k == '')
5498 this.has_empty = true;
5499
5500 this.choices.push([k, v || k]);
5501 return this;
5502 },
5503
5504 formvalue: function(sid)
5505 {
5506 var v = $('#' + this.id(sid)).children('input').val();
5507 return (v == '') ? undefined : v;
5508 }
5509 });
5510
5511 this.cbi.DynamicList = this.cbi.ComboBox.extend({
5512 _redraw: function(focus, add, del, s)
5513 {
5514 var v = s.values || [ ];
5515 delete s.values;
5516
5517 $(s.parent).children('div.input-group').children('input').each(function(i) {
5518 if (i != del)
5519 v.push(this.value || '');
5520 });
5521
5522 $(s.parent).empty();
5523
5524 if (add >= 0)
5525 {
5526 focus = add + 1;
5527 v.splice(focus, 0, '');
5528 }
5529 else if (v.length == 0)
5530 {
5531 focus = 0;
5532 v.push('');
5533 }
5534
5535 for (var i = 0; i < v.length; i++)
5536 {
5537 var evdata = {
5538 sid: s.sid,
5539 self: s.self,
5540 parent: s.parent,
5541 index: i,
5542 remove: ((i+1) < v.length)
5543 };
5544
5545 var btn;
5546 if (evdata.remove)
5547 btn = L.ui.button('–', 'danger').click(evdata, this._btnclick);
5548 else
5549 btn = L.ui.button('+', 'success').click(evdata, this._btnclick);
5550
5551 if (this.choices)
5552 {
5553 var txt = $('<input />')
5554 .addClass('form-control')
5555 .attr('type', 'text')
5556 .hide();
5557
5558 var sel = $('<select />')
5559 .addClass('form-control');
5560
5561 $('<div />')
5562 .addClass('input-group')
5563 .append(txt)
5564 .append(sel)
5565 .append($('<span />')
5566 .addClass('input-group-btn')
5567 .append(btn))
5568 .appendTo(s.parent);
5569
5570 evdata.input = this.validator(s.sid, txt, true);
5571 evdata.select = this.validator(s.sid, sel, true);
5572
5573 sel.change(evdata, this._change);
5574 txt.blur(evdata, this._blur);
5575 txt.keydown(evdata, this._keydown);
5576
5577 txt.val(v[i]);
5578 txt.blur();
5579
5580 if (i == focus || -(i+1) == focus)
5581 sel.focus();
5582
5583 sel = txt = null;
5584 }
5585 else
5586 {
5587 var f = $('<input />')
5588 .attr('type', 'text')
5589 .attr('index', i)
5590 .attr('placeholder', (i == 0) ? this.options.placeholder : '')
5591 .addClass('form-control')
5592 .keydown(evdata, this._keydown)
5593 .keypress(evdata, this._keypress)
5594 .val(v[i]);
5595
5596 $('<div />')
5597 .addClass('input-group')
5598 .append(f)
5599 .append($('<span />')
5600 .addClass('input-group-btn')
5601 .append(btn))
5602 .appendTo(s.parent);
5603
5604 if (i == focus)
5605 {
5606 f.focus();
5607 }
5608 else if (-(i+1) == focus)
5609 {
5610 f.focus();
5611
5612 /* force cursor to end */
5613 var val = f.val();
5614 f.val(' ');
5615 f.val(val);
5616 }
5617
5618 evdata.input = this.validator(s.sid, f, true);
5619
5620 f = null;
5621 }
5622
5623 evdata = null;
5624 }
5625
5626 s = null;
5627 },
5628
5629 _keypress: function(ev)
5630 {
5631 switch (ev.which)
5632 {
5633 /* backspace, delete */
5634 case 8:
5635 case 46:
5636 if (ev.data.input.val() == '')
5637 {
5638 ev.preventDefault();
5639 return false;
5640 }
5641
5642 return true;
5643
5644 /* enter, arrow up, arrow down */
5645 case 13:
5646 case 38:
5647 case 40:
5648 ev.preventDefault();
5649 return false;
5650 }
5651
5652 return true;
5653 },
5654
5655 _keydown: function(ev)
5656 {
5657 var input = ev.data.input;
5658
5659 switch (ev.which)
5660 {
5661 /* backspace, delete */
5662 case 8:
5663 case 46:
5664 if (input.val().length == 0)
5665 {
5666 ev.preventDefault();
5667
5668 var index = ev.data.index;
5669 var focus = index;
5670
5671 if (ev.which == 8)
5672 focus = -focus;
5673
5674 ev.data.self._redraw(focus, -1, index, ev.data);
5675 return false;
5676 }
5677
5678 break;
5679
5680 /* enter */
5681 case 13:
5682 ev.data.self._redraw(NaN, ev.data.index, -1, ev.data);
5683 break;
5684
5685 /* arrow up */
5686 case 38:
5687 var prev = input.parent().prevAll('div.input-group:first').children('input');
5688 if (prev.is(':visible'))
5689 prev.focus();
5690 else
5691 prev.next('select').focus();
5692 break;
5693
5694 /* arrow down */
5695 case 40:
5696 var next = input.parent().nextAll('div.input-group:first').children('input');
5697 if (next.is(':visible'))
5698 next.focus();
5699 else
5700 next.next('select').focus();
5701 break;
5702 }
5703
5704 return true;
5705 },
5706
5707 _btnclick: function(ev)
5708 {
5709 if (!this.getAttribute('disabled'))
5710 {
5711 if (ev.data.remove)
5712 {
5713 var index = ev.data.index;
5714 ev.data.self._redraw(-index, -1, index, ev.data);
5715 }
5716 else
5717 {
5718 ev.data.self._redraw(NaN, ev.data.index, -1, ev.data);
5719 }
5720 }
5721
5722 return false;
5723 },
5724
5725 widget: function(sid)
5726 {
5727 this.options.optional = true;
5728
5729 var v = this.ucivalue(sid);
5730
5731 if (!$.isArray(v))
5732 v = (typeof(v) != 'undefined') ? v.toString().split(/\s+/) : [ ];
5733
5734 var d = $('<div />')
5735 .attr('id', this.id(sid))
5736 .addClass('cbi-input-dynlist');
5737
5738 this._redraw(NaN, -1, -1, {
5739 self: this,
5740 parent: d[0],
5741 values: v,
5742 sid: sid
5743 });
5744
5745 return d;
5746 },
5747
5748 ucivalue: function(sid)
5749 {
5750 var v = this.callSuper('ucivalue', sid);
5751
5752 if (!$.isArray(v))
5753 v = (typeof(v) != 'undefined') ? v.toString().split(/\s+/) : [ ];
5754
5755 return v;
5756 },
5757
5758 formvalue: function(sid)
5759 {
5760 var rv = [ ];
5761 var fields = $('#' + this.id(sid) + ' input');
5762
5763 for (var i = 0; i < fields.length; i++)
5764 if (typeof(fields[i].value) == 'string' && fields[i].value.length)
5765 rv.push(fields[i].value);
5766
5767 return rv;
5768 }
5769 });
5770
5771 this.cbi.DummyValue = this.cbi.AbstractValue.extend({
5772 widget: function(sid)
5773 {
5774 return $('<div />')
5775 .addClass('form-control-static')
5776 .attr('id', this.id(sid))
5777 .html(this.ucivalue(sid));
5778 },
5779
5780 formvalue: function(sid)
5781 {
5782 return this.ucivalue(sid);
5783 }
5784 });
5785
5786 this.cbi.ButtonValue = this.cbi.AbstractValue.extend({
5787 widget: function(sid)
5788 {
5789 this.options.optional = true;
5790
5791 var btn = $('<button />')
5792 .addClass('btn btn-default')
5793 .attr('id', this.id(sid))
5794 .attr('type', 'button')
5795 .text(this.label('text'));
5796
5797 return this.validator(sid, btn);
5798 }
5799 });
5800
5801 this.cbi.NetworkList = this.cbi.AbstractValue.extend({
5802 load: function(sid)
5803 {
5804 return L.NetworkModel.init();
5805 },
5806
5807 _device_icon: function(dev)
5808 {
5809 return $('<img />')
5810 .attr('src', dev.icon())
5811 .attr('title', '%s (%s)'.format(dev.description(), dev.name() || '?'));
5812 },
5813
5814 widget: function(sid)
5815 {
5816 var id = this.id(sid);
5817 var ul = $('<ul />')
5818 .attr('id', id)
5819 .addClass('list-unstyled');
5820
5821 var itype = this.options.multiple ? 'checkbox' : 'radio';
5822 var value = this.ucivalue(sid);
5823 var check = { };
5824
5825 if (!this.options.multiple)
5826 check[value] = true;
5827 else
5828 for (var i = 0; i < value.length; i++)
5829 check[value[i]] = true;
5830
5831 var interfaces = L.NetworkModel.getInterfaces();
5832
5833 for (var i = 0; i < interfaces.length; i++)
5834 {
5835 var iface = interfaces[i];
5836 var badge = $('<span />')
5837 .addClass('badge')
5838 .text('%s: '.format(iface.name()));
5839
5840 var dev = iface.getDevice();
5841 var subdevs = iface.getSubdevices();
5842
5843 if (subdevs.length)
5844 for (var j = 0; j < subdevs.length; j++)
5845 badge.append(this._device_icon(subdevs[j]));
5846 else if (dev)
5847 badge.append(this._device_icon(dev));
5848 else
5849 badge.append($('<em />').text(L.tr('(No devices attached)')));
5850
5851 $('<li />')
5852 .append($('<label />')
5853 .addClass(itype + ' inline')
5854 .append($('<input />')
5855 .attr('name', itype + id)
5856 .attr('type', itype)
5857 .attr('value', iface.name())
5858 .prop('checked', !!check[iface.name()]))
5859 .append(badge))
5860 .appendTo(ul);
5861 }
5862
5863 if (!this.options.multiple)
5864 {
5865 $('<li />')
5866 .append($('<label />')
5867 .addClass(itype + ' inline text-muted')
5868 .append($('<input />')
5869 .attr('name', itype + id)
5870 .attr('type', itype)
5871 .attr('value', '')
5872 .prop('checked', $.isEmptyObject(check)))
5873 .append(L.tr('unspecified')))
5874 .appendTo(ul);
5875 }
5876
5877 return ul;
5878 },
5879
5880 ucivalue: function(sid)
5881 {
5882 var v = this.callSuper('ucivalue', sid);
5883
5884 if (!this.options.multiple)
5885 {
5886 if ($.isArray(v))
5887 {
5888 return v[0];
5889 }
5890 else if (typeof(v) == 'string')
5891 {
5892 v = v.match(/\S+/);
5893 return v ? v[0] : undefined;
5894 }
5895
5896 return v;
5897 }
5898 else
5899 {
5900 if (typeof(v) == 'string')
5901 v = v.match(/\S+/g);
5902
5903 return v || [ ];
5904 }
5905 },
5906
5907 formvalue: function(sid)
5908 {
5909 var inputs = $('#' + this.id(sid) + ' input');
5910
5911 if (!this.options.multiple)
5912 {
5913 for (var i = 0; i < inputs.length; i++)
5914 if (inputs[i].checked && inputs[i].value !== '')
5915 return inputs[i].value;
5916
5917 return undefined;
5918 }
5919
5920 var rv = [ ];
5921
5922 for (var i = 0; i < inputs.length; i++)
5923 if (inputs[i].checked)
5924 rv.push(inputs[i].value);
5925
5926 return rv.length ? rv : undefined;
5927 }
5928 });
5929
5930 this.cbi.DeviceList = this.cbi.NetworkList.extend({
5931 _ev_focus: function(ev)
5932 {
5933 var self = ev.data.self;
5934 var input = $(this);
5935
5936 input.parent().prev().prop('checked', true);
5937 },
5938
5939 _ev_blur: function(ev)
5940 {
5941 ev.which = 10;
5942 ev.data.self._ev_keydown.call(this, ev);
5943 },
5944
5945 _ev_keydown: function(ev)
5946 {
5947 if (ev.which != 10 && ev.which != 13)
5948 return;
5949
5950 var sid = ev.data.sid;
5951 var self = ev.data.self;
5952 var input = $(this);
5953 var ifnames = L.toArray(input.val());
5954
5955 if (!ifnames.length)
5956 return;
5957
5958 L.NetworkModel.createDevice(ifnames[0]);
5959
5960 self._redraw(sid, $('#' + self.id(sid)), ifnames[0]);
5961 },
5962
5963 load: function(sid)
5964 {
5965 return L.NetworkModel.init();
5966 },
5967
5968 _redraw: function(sid, ul, sel)
5969 {
5970 var id = ul.attr('id');
5971 var devs = L.NetworkModel.getDevices();
5972 var iface = L.NetworkModel.getInterface(sid);
5973 var itype = this.options.multiple ? 'checkbox' : 'radio';
5974 var check = { };
5975
5976 if (!sel)
5977 {
5978 for (var i = 0; i < devs.length; i++)
5979 if (devs[i].isInNetwork(iface))
5980 check[devs[i].name()] = true;
5981 }
5982 else
5983 {
5984 if (this.options.multiple)
5985 check = L.toObject(this.formvalue(sid));
5986
5987 check[sel] = true;
5988 }
5989
5990 ul.empty();
5991
5992 for (var i = 0; i < devs.length; i++)
5993 {
5994 var dev = devs[i];
5995
5996 if (dev.isBridge() && this.options.bridges === false)
5997 continue;
5998
5999 if (!dev.isBridgeable() && this.options.multiple)
6000 continue;
6001
6002 var badge = $('<span />')
6003 .addClass('badge')
6004 .append($('<img />').attr('src', dev.icon()))
6005 .append(' %s: %s'.format(dev.name(), dev.description()));
6006
6007 //var ifcs = dev.getInterfaces();
6008 //if (ifcs.length)
6009 //{
6010 // for (var j = 0; j < ifcs.length; j++)
6011 // badge.append((j ? ', ' : ' (') + ifcs[j].name());
6012 //
6013 // badge.append(')');
6014 //}
6015
6016 $('<li />')
6017 .append($('<label />')
6018 .addClass(itype + ' inline')
6019 .append($('<input />')
6020 .attr('name', itype + id)
6021 .attr('type', itype)
6022 .attr('value', dev.name())
6023 .prop('checked', !!check[dev.name()]))
6024 .append(badge))
6025 .appendTo(ul);
6026 }
6027
6028
6029 $('<li />')
6030 .append($('<label />')
6031 .attr('for', 'custom' + id)
6032 .addClass(itype + ' inline')
6033 .append($('<input />')
6034 .attr('name', itype + id)
6035 .attr('type', itype)
6036 .attr('value', ''))
6037 .append($('<span />')
6038 .addClass('badge')
6039 .append($('<input />')
6040 .attr('id', 'custom' + id)
6041 .attr('type', 'text')
6042 .attr('placeholder', L.tr('Custom device …'))
6043 .on('focus', { self: this, sid: sid }, this._ev_focus)
6044 .on('blur', { self: this, sid: sid }, this._ev_blur)
6045 .on('keydown', { self: this, sid: sid }, this._ev_keydown))))
6046 .appendTo(ul);
6047
6048 if (!this.options.multiple)
6049 {
6050 $('<li />')
6051 .append($('<label />')
6052 .addClass(itype + ' inline text-muted')
6053 .append($('<input />')
6054 .attr('name', itype + id)
6055 .attr('type', itype)
6056 .attr('value', '')
6057 .prop('checked', $.isEmptyObject(check)))
6058 .append(L.tr('unspecified')))
6059 .appendTo(ul);
6060 }
6061 },
6062
6063 widget: function(sid)
6064 {
6065 var id = this.id(sid);
6066 var ul = $('<ul />')
6067 .attr('id', id)
6068 .addClass('list-unstyled');
6069
6070 this._redraw(sid, ul);
6071
6072 return ul;
6073 },
6074
6075 save: function(sid)
6076 {
6077 if (this.instance[sid].disabled)
6078 return;
6079
6080 var ifnames = this.formvalue(sid);
6081 //if (!ifnames)
6082 // return;
6083
6084 var iface = L.NetworkModel.getInterface(sid);
6085 if (!iface)
6086 return;
6087
6088 iface.setDevices($.isArray(ifnames) ? ifnames : [ ifnames ]);
6089 }
6090 });
6091
6092
6093 this.cbi.AbstractSection = this.ui.AbstractWidget.extend({
6094 id: function()
6095 {
6096 var s = [ arguments[0], this.map.uci_package, this.uci_type ];
6097
6098 for (var i = 1; i < arguments.length; i++)
6099 s.push(arguments[i].replace(/\./g, '_'));
6100
6101 return s.join('_');
6102 },
6103
6104 option: function(widget, name, options)
6105 {
6106 if (this.tabs.length == 0)
6107 this.tab({ id: '__default__', selected: true });
6108
6109 return this.taboption('__default__', widget, name, options);
6110 },
6111
6112 tab: function(options)
6113 {
6114 if (options.selected)
6115 this.tabs.selected = this.tabs.length;
6116
6117 this.tabs.push({
6118 id: options.id,
6119 caption: options.caption,
6120 description: options.description,
6121 fields: [ ],
6122 li: { }
6123 });
6124 },
6125
6126 taboption: function(tabid, widget, name, options)
6127 {
6128 var tab;
6129 for (var i = 0; i < this.tabs.length; i++)
6130 {
6131 if (this.tabs[i].id == tabid)
6132 {
6133 tab = this.tabs[i];
6134 break;
6135 }
6136 }
6137
6138 if (!tab)
6139 throw 'Cannot append to unknown tab ' + tabid;
6140
6141 var w = widget ? new widget(name, options) : null;
6142
6143 if (!(w instanceof L.cbi.AbstractValue))
6144 throw 'Widget must be an instance of AbstractValue';
6145
6146 w.section = this;
6147 w.map = this.map;
6148
6149 this.fields[name] = w;
6150 tab.fields.push(w);
6151
6152 return w;
6153 },
6154
6155 tabtoggle: function(sid)
6156 {
6157 for (var i = 0; i < this.tabs.length; i++)
6158 {
6159 var tab = this.tabs[i];
6160 var elem = $('#' + this.id('nodetab', sid, tab.id));
6161 var empty = true;
6162
6163 for (var j = 0; j < tab.fields.length; j++)
6164 {
6165 if (tab.fields[j].active(sid))
6166 {
6167 empty = false;
6168 break;
6169 }
6170 }
6171
6172 if (empty && elem.is(':visible'))
6173 elem.fadeOut();
6174 else if (!empty)
6175 elem.fadeIn();
6176 }
6177 },
6178
6179 ucipackages: function(pkg)
6180 {
6181 for (var i = 0; i < this.tabs.length; i++)
6182 for (var j = 0; j < this.tabs[i].fields.length; j++)
6183 if (this.tabs[i].fields[j].options.uci_package)
6184 pkg[this.tabs[i].fields[j].options.uci_package] = true;
6185 },
6186
6187 formvalue: function()
6188 {
6189 var rv = { };
6190
6191 this.sections(function(s) {
6192 var sid = s['.name'];
6193 var sv = rv[sid] || (rv[sid] = { });
6194
6195 for (var i = 0; i < this.tabs.length; i++)
6196 for (var j = 0; j < this.tabs[i].fields.length; j++)
6197 {
6198 var val = this.tabs[i].fields[j].formvalue(sid);
6199 sv[this.tabs[i].fields[j].name] = val;
6200 }
6201 });
6202
6203 return rv;
6204 },
6205
6206 validate_section: function(sid)
6207 {
6208 var inst = this.instance[sid];
6209
6210 var invals = 0;
6211 var badge = $('#' + this.id('teaser', sid)).children('span:first');
6212
6213 for (var i = 0; i < this.tabs.length; i++)
6214 {
6215 var inval = 0;
6216 var stbadge = $('#' + this.id('nodetab', sid, this.tabs[i].id)).children('span:first');
6217
6218 for (var j = 0; j < this.tabs[i].fields.length; j++)
6219 if (!this.tabs[i].fields[j].validate(sid))
6220 inval++;
6221
6222 if (inval > 0)
6223 stbadge.show()
6224 .text(inval)
6225 .attr('title', L.trp('1 Error', '%d Errors', inval).format(inval));
6226 else
6227 stbadge.hide();
6228
6229 invals += inval;
6230 }
6231
6232 if (invals > 0)
6233 badge.show()
6234 .text(invals)
6235 .attr('title', L.trp('1 Error', '%d Errors', invals).format(invals));
6236 else
6237 badge.hide();
6238
6239 return invals;
6240 },
6241
6242 validate: function()
6243 {
6244 var errors = 0;
6245 var as = this.sections();
6246
6247 for (var i = 0; i < as.length; i++)
6248 {
6249 var invals = this.validate_section(as[i]['.name']);
6250
6251 if (invals > 0)
6252 errors += invals;
6253 }
6254
6255 var badge = $('#' + this.id('sectiontab')).children('span:first');
6256
6257 if (errors > 0)
6258 badge.show()
6259 .text(errors)
6260 .attr('title', L.trp('1 Error', '%d Errors', errors).format(errors));
6261 else
6262 badge.hide();
6263
6264 return (errors == 0);
6265 }
6266 });
6267
6268 this.cbi.TypedSection = this.cbi.AbstractSection.extend({
6269 init: function(uci_type, options)
6270 {
6271 this.uci_type = uci_type;
6272 this.options = options;
6273 this.tabs = [ ];
6274 this.fields = { };
6275 this.active_panel = 0;
6276 this.active_tab = { };
6277 },
6278
6279 filter: function(section)
6280 {
6281 return true;
6282 },
6283
6284 sections: function(cb)
6285 {
6286 var s1 = L.uci.sections(this.map.uci_package);
6287 var s2 = [ ];
6288
6289 for (var i = 0; i < s1.length; i++)
6290 if (s1[i]['.type'] == this.uci_type)
6291 if (this.filter(s1[i]))
6292 s2.push(s1[i]);
6293
6294 if (typeof(cb) == 'function')
6295 for (var i = 0; i < s2.length; i++)
6296 cb.call(this, s2[i]);
6297
6298 return s2;
6299 },
6300
6301 add: function(name)
6302 {
6303 return this.map.add(this.map.uci_package, this.uci_type, name);
6304 },
6305
6306 remove: function(sid)
6307 {
6308 return this.map.remove(this.map.uci_package, sid);
6309 },
6310
6311 _ev_add: function(ev)
6312 {
6313 var addb = $(this);
6314 var name = undefined;
6315 var self = ev.data.self;
6316
6317 if (addb.prev().prop('nodeName') == 'INPUT')
6318 name = addb.prev().val();
6319
6320 if (addb.prop('disabled') || name === '')
6321 return;
6322
6323 L.ui.saveScrollTop();
6324
6325 self.active_panel = -1;
6326 self.map.save();
6327
6328 ev.data.sid = self.add(name);
6329 ev.data.type = self.uci_type;
6330 ev.data.name = name;
6331
6332 self.trigger('add', ev);
6333
6334 self.map.redraw();
6335
6336 L.ui.restoreScrollTop();
6337 },
6338
6339 _ev_remove: function(ev)
6340 {
6341 var self = ev.data.self;
6342 var sid = ev.data.sid;
6343
6344 L.ui.saveScrollTop();
6345
6346 self.trigger('remove', ev);
6347
6348 self.map.save();
6349 self.remove(sid);
6350 self.map.redraw();
6351
6352 L.ui.restoreScrollTop();
6353
6354 ev.stopPropagation();
6355 },
6356
6357 _ev_sid: function(ev)
6358 {
6359 var self = ev.data.self;
6360 var text = $(this);
6361 var addb = text.next();
6362 var errt = addb.next();
6363 var name = text.val();
6364
6365 if (!/^[a-zA-Z0-9_]*$/.test(name))
6366 {
6367 errt.text(L.tr('Invalid section name')).show();
6368 text.addClass('error');
6369 addb.prop('disabled', true);
6370 return false;
6371 }
6372
6373 if (L.uci.get(self.map.uci_package, name))
6374 {
6375 errt.text(L.tr('Name already used')).show();
6376 text.addClass('error');
6377 addb.prop('disabled', true);
6378 return false;
6379 }
6380
6381 errt.text('').hide();
6382 text.removeClass('error');
6383 addb.prop('disabled', false);
6384 return true;
6385 },
6386
6387 _ev_tab: function(ev)
6388 {
6389 var self = ev.data.self;
6390 var sid = ev.data.sid;
6391
6392 self.validate();
6393 self.active_tab[sid] = parseInt(ev.target.getAttribute('data-luci2-tab-index'));
6394 },
6395
6396 _ev_panel_collapse: function(ev)
6397 {
6398 var self = ev.data.self;
6399
6400 var this_panel = $(ev.target);
6401 var this_toggle = this_panel.prevAll('[data-toggle="collapse"]:first');
6402
6403 var prev_toggle = $($(ev.delegateTarget).find('[data-toggle="collapse"]:eq(%d)'.format(self.active_panel)));
6404 var prev_panel = $(prev_toggle.attr('data-target'));
6405
6406 prev_panel
6407 .removeClass('in')
6408 .addClass('collapse');
6409
6410 prev_toggle.find('.luci2-section-teaser')
6411 .show()
6412 .children('span:last')
6413 .empty()
6414 .append(self.teaser(prev_panel.attr('data-luci2-sid')));
6415
6416 this_toggle.find('.luci2-section-teaser')
6417 .hide();
6418
6419 self.active_panel = parseInt(this_panel.attr('data-luci2-panel-index'));
6420 self.validate();
6421 },
6422
6423 _ev_panel_open: function(ev)
6424 {
6425 var self = ev.data.self;
6426 var panel = $($(this).attr('data-target'));
6427 var index = parseInt(panel.attr('data-luci2-panel-index'));
6428
6429 if (index == self.active_panel)
6430 ev.stopPropagation();
6431 },
6432
6433 _ev_sort: function(ev)
6434 {
6435 var self = ev.data.self;
6436 var cur_idx = ev.data.index;
6437 var new_idx = cur_idx + (ev.data.up ? -1 : 1);
6438 var s = self.sections();
6439
6440 if (new_idx >= 0 && new_idx < s.length)
6441 {
6442 L.uci.swap(self.map.uci_package, s[cur_idx]['.name'], s[new_idx]['.name']);
6443
6444 self.map.save();
6445 self.map.redraw();
6446 }
6447
6448 ev.stopPropagation();
6449 },
6450
6451 teaser: function(sid)
6452 {
6453 var tf = this.teaser_fields;
6454
6455 if (!tf)
6456 {
6457 tf = this.teaser_fields = [ ];
6458
6459 if ($.isArray(this.options.teasers))
6460 {
6461 for (var i = 0; i < this.options.teasers.length; i++)
6462 {
6463 var f = this.options.teasers[i];
6464 if (f instanceof L.cbi.AbstractValue)
6465 tf.push(f);
6466 else if (typeof(f) == 'string' && this.fields[f] instanceof L.cbi.AbstractValue)
6467 tf.push(this.fields[f]);
6468 }
6469 }
6470 else
6471 {
6472 for (var i = 0; tf.length <= 5 && i < this.tabs.length; i++)
6473 for (var j = 0; tf.length <= 5 && j < this.tabs[i].fields.length; j++)
6474 tf.push(this.tabs[i].fields[j]);
6475 }
6476 }
6477
6478 var t = '';
6479
6480 for (var i = 0; i < tf.length; i++)
6481 {
6482 if (tf[i].instance[sid] && tf[i].instance[sid].disabled)
6483 continue;
6484
6485 var n = tf[i].options.caption || tf[i].name;
6486 var v = tf[i].textvalue(sid);
6487
6488 if (typeof(v) == 'undefined')
6489 continue;
6490
6491 t = t + '%s%s: <strong>%s</strong>'.format(t ? ' | ' : '', n, v);
6492 }
6493
6494 return t;
6495 },
6496
6497 _render_add: function()
6498 {
6499 if (!this.options.addremove)
6500 return null;
6501
6502 var text = L.tr('Add section');
6503 var ttip = L.tr('Create new section...');
6504
6505 if ($.isArray(this.options.add_caption))
6506 text = this.options.add_caption[0], ttip = this.options.add_caption[1];
6507 else if (typeof(this.options.add_caption) == 'string')
6508 text = this.options.add_caption, ttip = '';
6509
6510 var add = $('<div />');
6511
6512 if (this.options.anonymous === false)
6513 {
6514 $('<input />')
6515 .addClass('cbi-input-text')
6516 .attr('type', 'text')
6517 .attr('placeholder', ttip)
6518 .blur({ self: this }, this._ev_sid)
6519 .keyup({ self: this }, this._ev_sid)
6520 .appendTo(add);
6521
6522 $('<img />')
6523 .attr('src', L.globals.resource + '/icons/cbi/add.gif')
6524 .attr('title', text)
6525 .addClass('cbi-button')
6526 .click({ self: this }, this._ev_add)
6527 .appendTo(add);
6528
6529 $('<div />')
6530 .addClass('cbi-value-error')
6531 .hide()
6532 .appendTo(add);
6533 }
6534 else
6535 {
6536 L.ui.button(text, 'success', ttip)
6537 .click({ self: this }, this._ev_add)
6538 .appendTo(add);
6539 }
6540
6541 return add;
6542 },
6543
6544 _render_remove: function(sid, index)
6545 {
6546 if (!this.options.addremove)
6547 return null;
6548
6549 var text = L.tr('Remove');
6550 var ttip = L.tr('Remove this section');
6551
6552 if ($.isArray(this.options.remove_caption))
6553 text = this.options.remove_caption[0], ttip = this.options.remove_caption[1];
6554 else if (typeof(this.options.remove_caption) == 'string')
6555 text = this.options.remove_caption, ttip = '';
6556
6557 return L.ui.button(text, 'danger', ttip)
6558 .click({ self: this, sid: sid, index: index }, this._ev_remove);
6559 },
6560
6561 _render_sort: function(sid, index)
6562 {
6563 if (!this.options.sortable)
6564 return null;
6565
6566 var b1 = L.ui.button('↑', 'info', L.tr('Move up'))
6567 .click({ self: this, index: index, up: true }, this._ev_sort);
6568
6569 var b2 = L.ui.button('↓', 'info', L.tr('Move down'))
6570 .click({ self: this, index: index, up: false }, this._ev_sort);
6571
6572 return b1.add(b2);
6573 },
6574
6575 _render_caption: function()
6576 {
6577 return $('<h3 />')
6578 .addClass('panel-title')
6579 .append(this.label('caption') || this.uci_type);
6580 },
6581
6582 _render_description: function()
6583 {
6584 var text = this.label('description');
6585
6586 if (text)
6587 return $('<div />')
6588 .addClass('luci2-section-description')
6589 .text(text);
6590
6591 return null;
6592 },
6593
6594 _render_teaser: function(sid, index)
6595 {
6596 if (this.options.collabsible || this.map.options.collabsible)
6597 {
6598 return $('<div />')
6599 .attr('id', this.id('teaser', sid))
6600 .addClass('luci2-section-teaser well well-sm')
6601 .append($('<span />')
6602 .addClass('badge'))
6603 .append($('<span />'));
6604 }
6605
6606 return null;
6607 },
6608
6609 _render_head: function(condensed)
6610 {
6611 if (condensed)
6612 return null;
6613
6614 return $('<div />')
6615 .addClass('panel-heading')
6616 .append(this._render_caption())
6617 .append(this._render_description());
6618 },
6619
6620 _render_tab_description: function(sid, index, tab_index)
6621 {
6622 var tab = this.tabs[tab_index];
6623
6624 if (typeof(tab.description) == 'string')
6625 {
6626 return $('<div />')
6627 .addClass('cbi-tab-descr')
6628 .text(tab.description);
6629 }
6630
6631 return null;
6632 },
6633
6634 _render_tab_head: function(sid, index, tab_index)
6635 {
6636 var tab = this.tabs[tab_index];
6637 var cur = this.active_tab[sid] || 0;
6638
6639 var tabh = $('<li />')
6640 .append($('<a />')
6641 .attr('id', this.id('nodetab', sid, tab.id))
6642 .attr('href', '#' + this.id('node', sid, tab.id))
6643 .attr('data-toggle', 'tab')
6644 .attr('data-luci2-tab-index', tab_index)
6645 .text((tab.caption ? tab.caption.format(tab.id) : tab.id) + ' ')
6646 .append($('<span />')
6647 .addClass('badge'))
6648 .on('shown.bs.tab', { self: this, sid: sid }, this._ev_tab));
6649
6650 if (cur == tab_index)
6651 tabh.addClass('active');
6652
6653 if (!tab.fields.length)
6654 tabh.hide();
6655
6656 return tabh;
6657 },
6658
6659 _render_tab_body: function(sid, index, tab_index)
6660 {
6661 var tab = this.tabs[tab_index];
6662 var cur = this.active_tab[sid] || 0;
6663
6664 var tabb = $('<div />')
6665 .addClass('tab-pane')
6666 .attr('id', this.id('node', sid, tab.id))
6667 .attr('data-luci2-tab-index', tab_index)
6668 .append(this._render_tab_description(sid, index, tab_index));
6669
6670 if (cur == tab_index)
6671 tabb.addClass('active');
6672
6673 for (var i = 0; i < tab.fields.length; i++)
6674 tabb.append(tab.fields[i].render(sid));
6675
6676 return tabb;
6677 },
6678
6679 _render_section_head: function(sid, index)
6680 {
6681 var head = $('<div />')
6682 .addClass('luci2-section-header')
6683 .append(this._render_teaser(sid, index))
6684 .append($('<div />')
6685 .addClass('btn-group')
6686 .append(this._render_sort(sid, index))
6687 .append(this._render_remove(sid, index)));
6688
6689 if (this.options.collabsible)
6690 {
6691 head.attr('data-toggle', 'collapse')
6692 .attr('data-parent', this.id('sectiongroup'))
6693 .attr('data-target', '#' + this.id('panel', sid))
6694 .on('click', { self: this }, this._ev_panel_open);
6695 }
6696
6697 return head;
6698 },
6699
6700 _render_section_body: function(sid, index)
6701 {
6702 var body = $('<div />')
6703 .attr('id', this.id('panel', sid))
6704 .attr('data-luci2-panel-index', index)
6705 .attr('data-luci2-sid', sid);
6706
6707 if (this.options.collabsible || this.map.options.collabsible)
6708 {
6709 body.addClass('panel-collapse collapse');
6710
6711 if (index == this.active_panel)
6712 body.addClass('in');
6713 }
6714
6715 var tab_heads = $('<ul />')
6716 .addClass('nav nav-tabs');
6717
6718 var tab_bodies = $('<div />')
6719 .addClass('form-horizontal tab-content')
6720 .append(tab_heads);
6721
6722 for (var j = 0; j < this.tabs.length; j++)
6723 {
6724 tab_heads.append(this._render_tab_head(sid, index, j));
6725 tab_bodies.append(this._render_tab_body(sid, index, j));
6726 }
6727
6728 body.append(tab_bodies);
6729
6730 if (this.tabs.length <= 1)
6731 tab_heads.hide();
6732
6733 return body;
6734 },
6735
6736 _render_body: function(condensed)
6737 {
6738 var s = this.sections();
6739
6740 if (this.active_panel < 0)
6741 this.active_panel += s.length;
6742 else if (this.active_panel >= s.length)
6743 this.active_panel = s.length - 1;
6744
6745 var body = $('<ul />')
6746 .addClass('list-group');
6747
6748 if (this.options.collabsible)
6749 {
6750 body.attr('id', this.id('sectiongroup'))
6751 .on('show.bs.collapse', { self: this }, this._ev_panel_collapse);
6752 }
6753
6754 if (s.length == 0)
6755 {
6756 body.append($('<li />')
6757 .addClass('list-group-item text-muted')
6758 .text(this.label('placeholder') || L.tr('There are no entries defined yet.')))
6759 }
6760
6761 for (var i = 0; i < s.length; i++)
6762 {
6763 var sid = s[i]['.name'];
6764 var inst = this.instance[sid] = { tabs: [ ] };
6765
6766 body.append($('<li />')
6767 .addClass('list-group-item')
6768 .append(this._render_section_head(sid, i))
6769 .append(this._render_section_body(sid, i)));
6770 }
6771
6772 return body;
6773 },
6774
6775 render: function(condensed)
6776 {
6777 this.instance = { };
6778
6779 var panel = $('<div />')
6780 .addClass('panel panel-default')
6781 .append(this._render_head(condensed))
6782 .append(this._render_body(condensed));
6783
6784 if (this.options.addremove)
6785 panel.append($('<div />')
6786 .addClass('panel-footer')
6787 .append(this._render_add()));
6788
6789 return panel;
6790 },
6791
6792 finish: function()
6793 {
6794 var s = this.sections();
6795
6796 for (var i = 0; i < s.length; i++)
6797 {
6798 var sid = s[i]['.name'];
6799
6800 this.validate_section(sid);
6801
6802 if (i != this.active_panel)
6803 $('#' + this.id('teaser', sid)).children('span:last')
6804 .append(this.teaser(sid));
6805 else
6806 $('#' + this.id('teaser', sid))
6807 .hide();
6808 }
6809 }
6810 });
6811
6812 this.cbi.TableSection = this.cbi.TypedSection.extend({
6813 _render_table_head: function()
6814 {
6815 var thead = $('<thead />')
6816 .append($('<tr />')
6817 .addClass('cbi-section-table-titles'));
6818
6819 for (var j = 0; j < this.tabs[0].fields.length; j++)
6820 thead.children().append($('<th />')
6821 .addClass('cbi-section-table-cell')
6822 .css('width', this.tabs[0].fields[j].options.width || '')
6823 .append(this.tabs[0].fields[j].label('caption')));
6824
6825 if (this.options.addremove !== false || this.options.sortable)
6826 thead.children().append($('<th />')
6827 .addClass('cbi-section-table-cell')
6828 .text(' '));
6829
6830 return thead;
6831 },
6832
6833 _render_table_row: function(sid, index)
6834 {
6835 var row = $('<tr />')
6836 .attr('data-luci2-sid', sid);
6837
6838 for (var j = 0; j < this.tabs[0].fields.length; j++)
6839 {
6840 row.append($('<td />')
6841 .css('width', this.tabs[0].fields[j].options.width || '')
6842 .append(this.tabs[0].fields[j].render(sid, true)));
6843 }
6844
6845 if (this.options.addremove !== false || this.options.sortable)
6846 {
6847 row.append($('<td />')
6848 .addClass('text-right')
6849 .append($('<div />')
6850 .addClass('btn-group')
6851 .append(this._render_sort(sid, index))
6852 .append(this._render_remove(sid, index))));
6853 }
6854
6855 return row;
6856 },
6857
6858 _render_table_body: function()
6859 {
6860 var s = this.sections();
6861
6862 var tbody = $('<tbody />');
6863
6864 if (s.length == 0)
6865 {
6866 var cols = this.tabs[0].fields.length;
6867
6868 if (this.options.addremove !== false || this.options.sortable)
6869 cols++;
6870
6871 tbody.append($('<tr />')
6872 .append($('<td />')
6873 .addClass('text-muted')
6874 .attr('colspan', cols)
6875 .text(this.label('placeholder') || L.tr('There are no entries defined yet.'))));
6876 }
6877
6878 for (var i = 0; i < s.length; i++)
6879 {
6880 var sid = s[i]['.name'];
6881 var inst = this.instance[sid] = { tabs: [ ] };
6882
6883 tbody.append(this._render_table_row(sid, i));
6884 }
6885
6886 return tbody;
6887 },
6888
6889 _render_body: function(condensed)
6890 {
6891 return $('<table />')
6892 .addClass('table table-condensed table-hover')
6893 .append(this._render_table_head())
6894 .append(this._render_table_body());
6895 }
6896 });
6897
6898 this.cbi.NamedSection = this.cbi.TypedSection.extend({
6899 sections: function(cb)
6900 {
6901 var sa = [ ];
6902 var sl = L.uci.sections(this.map.uci_package);
6903
6904 for (var i = 0; i < sl.length; i++)
6905 if (sl[i]['.name'] == this.uci_type)
6906 {
6907 sa.push(sl[i]);
6908 break;
6909 }
6910
6911 if (typeof(cb) == 'function' && sa.length > 0)
6912 cb.call(this, sa[0]);
6913
6914 return sa;
6915 }
6916 });
6917
6918 this.cbi.SingleSection = this.cbi.NamedSection.extend({
6919 render: function()
6920 {
6921 this.instance = { };
6922 this.instance[this.uci_type] = { tabs: [ ] };
6923
6924 return this._render_section_body(this.uci_type, 0);
6925 }
6926 });
6927
6928 this.cbi.DummySection = this.cbi.TypedSection.extend({
6929 sections: function(cb)
6930 {
6931 if (typeof(cb) == 'function')
6932 cb.apply(this, [ { '.name': this.uci_type } ]);
6933
6934 return [ { '.name': this.uci_type } ];
6935 }
6936 });
6937
6938 this.cbi.Map = this.ui.AbstractWidget.extend({
6939 init: function(uci_package, options)
6940 {
6941 var self = this;
6942
6943 this.uci_package = uci_package;
6944 this.sections = [ ];
6945 this.options = L.defaults(options, {
6946 save: function() { },
6947 prepare: function() { }
6948 });
6949 },
6950
6951 _load_cb: function()
6952 {
6953 var deferreds = [ L.deferrable(this.options.prepare()) ];
6954
6955 for (var i = 0; i < this.sections.length; i++)
6956 {
6957 for (var f in this.sections[i].fields)
6958 {
6959 if (typeof(this.sections[i].fields[f].load) != 'function')
6960 continue;
6961
6962 var s = this.sections[i].sections();
6963 for (var j = 0; j < s.length; j++)
6964 {
6965 var rv = this.sections[i].fields[f].load(s[j]['.name']);
6966 if (L.isDeferred(rv))
6967 deferreds.push(rv);
6968 }
6969 }
6970 }
6971
6972 return $.when.apply($, deferreds);
6973 },
6974
6975 load: function()
6976 {
6977 var self = this;
6978 var packages = { };
6979
6980 for (var i = 0; i < this.sections.length; i++)
6981 this.sections[i].ucipackages(packages);
6982
6983 packages[this.uci_package] = true;
6984
6985 for (var pkg in packages)
6986 if (!L.uci.writable(pkg))
6987 this.options.readonly = true;
6988
6989 return L.uci.load(L.toArray(packages)).then(function() {
6990 return self._load_cb();
6991 });
6992 },
6993
6994 _ev_tab: function(ev)
6995 {
6996 var self = ev.data.self;
6997
6998 self.validate();
6999 self.active_tab = parseInt(ev.target.getAttribute('data-luci2-tab-index'));
7000 },
7001
7002 _ev_apply: function(ev)
7003 {
7004 var self = ev.data.self;
7005
7006 self.trigger('apply', ev);
7007 },
7008
7009 _ev_save: function(ev)
7010 {
7011 var self = ev.data.self;
7012
7013 self.trigger('save', ev);
7014 },
7015
7016 _ev_reset: function(ev)
7017 {
7018 var self = ev.data.self;
7019
7020 self.trigger('reset', ev);
7021 self.reset();
7022 },
7023
7024 _render_tab_head: function(tab_index)
7025 {
7026 var section = this.sections[tab_index];
7027 var cur = this.active_tab || 0;
7028
7029 var tabh = $('<li />')
7030 .append($('<a />')
7031 .attr('id', section.id('sectiontab'))
7032 .attr('href', '#' + section.id('section'))
7033 .attr('data-toggle', 'tab')
7034 .attr('data-luci2-tab-index', tab_index)
7035 .text(section.label('caption') + ' ')
7036 .append($('<span />')
7037 .addClass('badge'))
7038 .on('shown.bs.tab', { self: this }, this._ev_tab));
7039
7040 if (cur == tab_index)
7041 tabh.addClass('active');
7042
7043 return tabh;
7044 },
7045
7046 _render_tab_body: function(tab_index)
7047 {
7048 var section = this.sections[tab_index];
7049 var desc = section.label('description');
7050 var cur = this.active_tab || 0;
7051
7052 var tabb = $('<div />')
7053 .addClass('tab-pane')
7054 .attr('id', section.id('section'))
7055 .attr('data-luci2-tab-index', tab_index);
7056
7057 if (cur == tab_index)
7058 tabb.addClass('active');
7059
7060 if (desc)
7061 tabb.append($('<p />')
7062 .text(desc));
7063
7064 var s = section.render(this.options.tabbed);
7065
7066 if (this.options.readonly || section.options.readonly)
7067 s.find('input, select, button, img.cbi-button').attr('disabled', true);
7068
7069 tabb.append(s);
7070
7071 return tabb;
7072 },
7073
7074 _render_body: function()
7075 {
7076 var tabs = $('<ul />')
7077 .addClass('nav nav-tabs');
7078
7079 var body = $('<div />')
7080 .append(tabs);
7081
7082 for (var i = 0; i < this.sections.length; i++)
7083 {
7084 tabs.append(this._render_tab_head(i));
7085 body.append(this._render_tab_body(i));
7086 }
7087
7088 if (this.options.tabbed)
7089 body.addClass('tab-content');
7090 else
7091 tabs.hide();
7092
7093 return body;
7094 },
7095
7096 _render_footer: function()
7097 {
7098 var evdata = {
7099 self: this
7100 };
7101
7102 return $('<div />')
7103 .addClass('panel panel-default panel-body text-right')
7104 .append($('<div />')
7105 .addClass('btn-group')
7106 .append(L.ui.button(L.tr('Save & Apply'), 'primary')
7107 .click(evdata, this._ev_apply))
7108 .append(L.ui.button(L.tr('Save'), 'default')
7109 .click(evdata, this._ev_save))
7110 .append(L.ui.button(L.tr('Reset'), 'default')
7111 .click(evdata, this._ev_reset)));
7112 },
7113
7114 render: function()
7115 {
7116 var map = $('<form />');
7117
7118 if (typeof(this.options.caption) == 'string')
7119 map.append($('<h2 />')
7120 .text(this.options.caption));
7121
7122 if (typeof(this.options.description) == 'string')
7123 map.append($('<p />')
7124 .text(this.options.description));
7125
7126 map.append(this._render_body());
7127
7128 if (this.options.pageaction !== false)
7129 map.append(this._render_footer());
7130
7131 return map;
7132 },
7133
7134 finish: function()
7135 {
7136 for (var i = 0; i < this.sections.length; i++)
7137 this.sections[i].finish();
7138
7139 this.validate();
7140 },
7141
7142 redraw: function()
7143 {
7144 this.target.hide().empty().append(this.render());
7145 this.finish();
7146 this.target.show();
7147 },
7148
7149 section: function(widget, uci_type, options)
7150 {
7151 var w = widget ? new widget(uci_type, options) : null;
7152
7153 if (!(w instanceof L.cbi.AbstractSection))
7154 throw 'Widget must be an instance of AbstractSection';
7155
7156 w.map = this;
7157 w.index = this.sections.length;
7158
7159 this.sections.push(w);
7160 return w;
7161 },
7162
7163 formvalue: function()
7164 {
7165 var rv = { };
7166
7167 for (var i = 0; i < this.sections.length; i++)
7168 {
7169 var sids = this.sections[i].formvalue();
7170 for (var sid in sids)
7171 {
7172 var s = rv[sid] || (rv[sid] = { });
7173 $.extend(s, sids[sid]);
7174 }
7175 }
7176
7177 return rv;
7178 },
7179
7180 add: function(conf, type, name)
7181 {
7182 return L.uci.add(conf, type, name);
7183 },
7184
7185 remove: function(conf, sid)
7186 {
7187 return L.uci.remove(conf, sid);
7188 },
7189
7190 get: function(conf, sid, opt)
7191 {
7192 return L.uci.get(conf, sid, opt);
7193 },
7194
7195 set: function(conf, sid, opt, val)
7196 {
7197 return L.uci.set(conf, sid, opt, val);
7198 },
7199
7200 validate: function()
7201 {
7202 var rv = true;
7203
7204 for (var i = 0; i < this.sections.length; i++)
7205 {
7206 if (!this.sections[i].validate())
7207 rv = false;
7208 }
7209
7210 return rv;
7211 },
7212
7213 save: function()
7214 {
7215 var self = this;
7216
7217 if (self.options.readonly)
7218 return L.deferrable();
7219
7220 var deferreds = [ ];
7221
7222 for (var i = 0; i < self.sections.length; i++)
7223 {
7224 if (self.sections[i].options.readonly)
7225 continue;
7226
7227 for (var f in self.sections[i].fields)
7228 {
7229 if (typeof(self.sections[i].fields[f].save) != 'function')
7230 continue;
7231
7232 var s = self.sections[i].sections();
7233 for (var j = 0; j < s.length; j++)
7234 {
7235 var rv = self.sections[i].fields[f].save(s[j]['.name']);
7236 if (L.isDeferred(rv))
7237 deferreds.push(rv);
7238 }
7239 }
7240 }
7241
7242 return $.when.apply($, deferreds).then(function() {
7243 return L.deferrable(self.options.save());
7244 });
7245 },
7246
7247 send: function()
7248 {
7249 if (!this.validate())
7250 return L.deferrable();
7251
7252 var self = this;
7253
7254 L.ui.saveScrollTop();
7255 L.ui.loading(true);
7256
7257 return this.save().then(function() {
7258 return L.uci.save();
7259 }).then(function() {
7260 return L.ui.updateChanges();
7261 }).then(function() {
7262 return self.load();
7263 }).then(function() {
7264 self.redraw();
7265 self = null;
7266
7267 L.ui.loading(false);
7268 L.ui.restoreScrollTop();
7269 });
7270 },
7271
7272 reset: function()
7273 {
7274 var self = this;
7275 var packages = { };
7276
7277 for (var i = 0; i < this.sections.length; i++)
7278 this.sections[i].ucipackages(packages);
7279
7280 packages[this.uci_package] = true;
7281
7282 L.uci.unload(L.toArray(packages));
7283
7284 return self.insertInto(self.target);
7285 },
7286
7287 insertInto: function(id)
7288 {
7289 var self = this;
7290 self.target = $(id);
7291
7292 L.ui.loading(true);
7293 self.target.hide();
7294
7295 return self.load().then(function() {
7296 self.target.empty().append(self.render());
7297 self.finish();
7298 self.target.show();
7299 self = null;
7300 L.ui.loading(false);
7301 });
7302 }
7303 });
7304
7305 this.cbi.Modal = this.cbi.Map.extend({
7306 _ev_apply: function(ev)
7307 {
7308 var self = ev.data.self;
7309
7310 self.trigger('apply', ev);
7311 },
7312
7313 _ev_save: function(ev)
7314 {
7315 var self = ev.data.self;
7316
7317 self.send().then(function() {
7318 self.trigger('save', ev);
7319 self.close();
7320 });
7321 },
7322
7323 _ev_reset: function(ev)
7324 {
7325 var self = ev.data.self;
7326
7327 self.trigger('close', ev);
7328 self.close();
7329 },
7330
7331 _render_footer: function()
7332 {
7333 var evdata = {
7334 self: this
7335 };
7336
7337 return $('<div />')
7338 .addClass('btn-group')
7339 .append(L.ui.button(L.tr('Save & Apply'), 'primary')
7340 .click(evdata, this._ev_apply))
7341 .append(L.ui.button(L.tr('Save'), 'default')
7342 .click(evdata, this._ev_save))
7343 .append(L.ui.button(L.tr('Cancel'), 'default')
7344 .click(evdata, this._ev_reset));
7345 },
7346
7347 render: function()
7348 {
7349 var modal = L.ui.dialog(this.label('caption'), null, { wide: true });
7350 var map = $('<form />');
7351
7352 var desc = this.label('description');
7353 if (desc)
7354 map.append($('<p />').text(desc));
7355
7356 map.append(this._render_body());
7357
7358 modal.find('.modal-body').append(map);
7359 modal.find('.modal-footer').append(this._render_footer());
7360
7361 return modal;
7362 },
7363
7364 redraw: function()
7365 {
7366 this.render();
7367 this.finish();
7368 },
7369
7370 show: function()
7371 {
7372 var self = this;
7373
7374 L.ui.loading(true);
7375
7376 return self.load().then(function() {
7377 self.render();
7378 self.finish();
7379
7380 L.ui.loading(false);
7381 });
7382 },
7383
7384 close: function()
7385 {
7386 L.ui.dialog(false);
7387 }
7388 });
7389 };
DEPRECATED - use https://github.com/jow-/luci-ng