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


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