luci2: change LuCI2.cbi.NetworkList to use LuCI2.NetworkModel class

[project/luci2/ui.git] / luci2 / htdocs / luci2 / luci2.js

diff --git a/luci2/htdocs/luci2/luci2.js b/luci2/htdocs/luci2/luci2.js
index bbfb6d3..f094b00 100644 (file)
--- a/luci2/htdocs/luci2/luci2.js
+++ b/luci2/htdocs/luci2/luci2.js
@@ -1320,7 +1320,7 @@ function LuCI2()
 
                        for (var i = 0, color = '#';
                                 i < 3;
-                                color += ('00' + ((hash >> i++ * 8) & 0xFF).tozoneing(16)).slice(-2));
+                                color += ('00' + ((hash >> i++ * 8) & 0xFF).tostring(16)).slice(-2));
 
                        return color;
                },
@@ -3216,6 +3216,7 @@ function LuCI2()
 
                        var state = _luci2.ui._loading || (_luci2.ui._loading = {
                                modal: $('<div />')
+                                       .css('z-index', 2000)
                                        .addClass('modal fade')
                                        .append($('<div />')
                                                .addClass('modal-dialog')
@@ -3268,13 +3269,13 @@ function LuCI2()
                        {
                                state.dialog.modal('hide');
 
-                               return;
+                               return state.dialog;
                        }
 
                        var cnt = state.dialog.children().children().children('div.modal-body');
                        var ftr = state.dialog.children().children().children('div.modal-footer');
 
-                       ftr.empty();
+                       ftr.empty().show();
 
                        if (options.style == 'confirm')
                        {
@@ -3295,10 +3296,21 @@ function LuCI2()
                                        .attr('disabled', true));
                        }
 
+                       if (options.wide)
+                       {
+                               state.dialog.addClass('wide');
+                       }
+                       else
+                       {
+                               state.dialog.removeClass('wide');
+                       }
+
                        state.dialog.find('h4:first').text(title);
                        state.dialog.modal('show');
 
                        cnt.empty().append(content);
+
+                       return state.dialog;
                },
 
                upload: function(title, content, options)
@@ -5903,52 +5915,32 @@ function LuCI2()
                }
        });
 
-       this.cbi.NetworkList = this.cbi.AbstractValue.extend({
-               load: function(sid)
+       this.cbi.ButtonValue = this.cbi.AbstractValue.extend({
+               widget: function(sid)
                {
-                       var self = this;
+                       this.options.optional = true;
 
-                       if (!self.interfaces)
-                       {
-                               self.interfaces = [ ];
-                               return _luci2.network.getNetworkStatus().then(function(ifaces) {
-                                       self.interfaces = ifaces;
-                                       self = null;
-                               });
-                       }
+                       var btn = $('<button />')
+                               .addClass('btn btn-default')
+                               .attr('id', this.id(sid))
+                               .attr('type', 'button')
+                               .text(this.label('text'));
 
-                       return undefined;
+                       return this.validator(sid, btn);
+               }
+       });
+
+       this.cbi.NetworkList = this.cbi.AbstractValue.extend({
+               load: function(sid)
+               {
+                       return _luci2.NetworkModel.init();
                },
 
                _device_icon: function(dev)
                {
-                       var type = 'ethernet';
-                       var desc = _luci2.tr('Ethernet device');
-
-                       if (dev.type == 'IP tunnel')
-                       {
-                               type = 'tunnel';
-                               desc = _luci2.tr('Tunnel interface');
-                       }
-                       else if (dev['bridge-members'])
-                       {
-                               type = 'bridge';
-                               desc = _luci2.tr('Bridge');
-                       }
-                       else if (dev.wireless)
-                       {
-                               type = 'wifi';
-                               desc = _luci2.tr('Wireless Network');
-                       }
-                       else if (dev.device.indexOf('.') > 0)
-                       {
-                               type = 'vlan';
-                               desc = _luci2.tr('VLAN interface');
-                       }
-
                        return $('<img />')
-                               .attr('src', _luci2.globals.resource + '/icons/' + type + (dev.up ? '' : '_disabled') + '.png')
-                               .attr('title', '%s (%s)'.format(desc, dev.device));
+                               .attr('src', dev.icon())
+                               .attr('title', '%s (%s)'.format(dev.description(), dev.name() || '?'));
                },
 
                widget: function(sid)
@@ -5968,34 +5960,36 @@ function LuCI2()
                                for (var i = 0; i < value.length; i++)
                                        check[value[i]] = true;
 
-                       if (this.interfaces)
+                       var interfaces = _luci2.NetworkModel.getInterfaces();
+
+                       for (var i = 0; i < interfaces.length; i++)
                        {
-                               for (var i = 0; i < this.interfaces.length; i++)
-                               {
-                                       var iface = this.interfaces[i];
-                                       var badge = $('<span />')
-                                               .addClass('badge')
-                                               .text('%s: '.format(iface['interface']));
-
-                                       if (iface.device && iface.device.subdevices)
-                                               for (var j = 0; j < iface.device.subdevices.length; j++)
-                                                       badge.append(this._device_icon(iface.device.subdevices[j]));
-                                       else if (iface.device)
-                                               badge.append(this._device_icon(iface.device));
-                                       else
-                                               badge.append($('<em />').text(_luci2.tr('(No devices attached)')));
+                               var iface = interfaces[i];
+                               var badge = $('<span />')
+                                       .addClass('badge')
+                                       .text('%s: '.format(iface.name()));
 
-                                       $('<li />')
-                                               .append($('<label />')
-                                                       .addClass(itype + ' inline')
-                                                       .append($('<input />')
-                                                               .attr('name', itype + id)
-                                                               .attr('type', itype)
-                                                               .attr('value', iface['interface'])
-                                                               .prop('checked', !!check[iface['interface']]))
-                                                       .append(badge))
-                                               .appendTo(ul);
-                               }
+                               var dev = iface.getDevice();
+                               var subdevs = iface.getSubdevices();
+
+                               if (subdevs.length)
+                                       for (var j = 0; j < subdevs.length; j++)
+                                               badge.append(this._device_icon(subdevs[j]));
+                               else if (dev)
+                                       badge.append(this._device_icon(dev));
+                               else
+                                       badge.append($('<em />').text(_luci2.tr('(No devices attached)')));
+
+                               $('<li />')
+                                       .append($('<label />')
+                                               .addClass(itype + ' inline')
+                                               .append($('<input />')
+                                                       .attr('name', itype + id)
+                                                       .attr('type', itype)
+                                                       .attr('value', iface.name())
+                                                       .prop('checked', !!check[iface.name()]))
+                                               .append(badge))
+                                       .appendTo(ul);
                        }
 
                        if (!this.options.multiple)
@@ -6007,7 +6001,7 @@ function LuCI2()
                                                        .attr('name', itype + id)
                                                        .attr('type', itype)
                                                        .attr('value', '')
-                                                       .prop('checked', !value))
+                                                       .prop('checked', $.isEmptyObject(check)))
                                                .append(_luci2.tr('unspecified')))
                                        .appendTo(ul);
                        }