Fix for the Nodes Learnt dashlet error when there are no ports in the topology.
[controller.git] / opendaylight / web / devices / src / main / resources / js / page.js
index f48a46d204ac05a2c50ae5859bf6a59dc3b8d57b..a138eb909e58a185fffb133624225d12c2801d0d 100644 (file)
@@ -14,7 +14,7 @@ one.f = {};
 one.f.dashlet = {
     nodesLearnt : {
         id : 'nodesLearnt',
-        name : 'Nodes Learnt'
+        name : 'Nodes Learned'
     },
     staticRouteConfig : {
         id : 'staticRouteConfig',
@@ -74,8 +74,11 @@ one.f.switchmanager.nodesLearnt = {
         },
         modal: {
             modal: "one_f_switchmanager_nodesLearnt_id_modal_modal",
+            configure: "one_f_switchmanager_nodesLearnt_id_modal_configure",
+            ports: "one_f_switchmanager_nodesLearnt_id_modal_ports",
             save: "one_f_switchmanager_nodesLearnt_id_modal_save",
             datagrid: "one_f_switchmanager_nodesLearnt_id_modal_datagrid",
+            portsDatagrid: "one_f_switchmanager_nodesLearnt_id_modal_portsDatagrid",
             form: {
                 nodeId: "one_f_switchmanager_nodesLearnt_id_modal_form_nodeid",
                 nodeName : "one_f_switchmanager_nodesLearnt_id_modal_form_nodename",
@@ -102,6 +105,13 @@ one.f.switchmanager.nodesLearnt = {
             $("#" + one.f.switchmanager.nodesLearnt.id.dashlet.datagrid).datagrid({dataSource: dataSource}).on("loaded", function() {
                 $(this).find("tbody a").click(one.f.switchmanager.nodesLearnt.modal.initialize.updateNode);
             });
+            
+            $("#" + one.f.switchmanager.nodesLearnt.id.dashlet.datagrid).datagrid({dataSource: dataSource}).on("loaded", function() {
+                $(this).find("tbody span").click(function(){
+                    one.f.switchmanager.nodesLearnt.modal.initialize.displayPorts($(this));
+                });
+            });
+            
         });
     },
     ajax : {
@@ -128,7 +138,7 @@ one.f.switchmanager.nodesLearnt = {
                         h3 = 'Node Information';
                     }
                     
-                    var $modal = one.lib.modal.spawn(one.f.switchmanager.nodesLearnt.id.modal.modal, h3, "", footer);
+                    var $modal = one.lib.modal.spawn(one.f.switchmanager.nodesLearnt.id.modal.configure, h3, "", footer);
                     // bind save button
                     $('#' + one.f.switchmanager.nodesLearnt.id.modal.save, $modal).click(function() {
                         one.f.switchmanager.nodesLearnt.modal.save($modal);
@@ -140,11 +150,35 @@ one.f.switchmanager.nodesLearnt = {
                 });
             },
             popout: function() {
-                var h3 = "Nodes Learnt";
+                var h3 = "Nodes Learned";
                 var footer = one.f.switchmanager.nodesLearnt.modal.footer.popout();
                 var $modal = one.lib.modal.spawn(one.f.switchmanager.nodesLearnt.id.modal.modal, h3, "", footer);
                 var $body = one.f.switchmanager.nodesLearnt.modal.body.popout($modal);
                 return $modal;
+            },
+            displayPorts: function(ports) {
+                var content = JSON.parse(decodeURIComponent(ports.attr("ports")));
+                
+                var h3 = ((ports.attr("nodeName") == "None")? ports.attr("nodeId") : ports.attr("nodeName"))
+                var footer = [];
+                var $modal = one.lib.modal.spawn(one.f.switchmanager.nodesLearnt.id.modal.ports, h3, "", footer);
+                
+                var $gridHTML = one.lib.dashlet.datagrid.init(one.f.switchmanager.nodesLearnt.id.modal.portsDatagrid, {
+                    searchable: true,
+                    filterable: false,
+                    pagination: true,
+                    flexibleRowsPerPage: true,
+                    popout: true
+                    }, "table-striped table-condensed");
+                one.lib.modal.inject.body($modal, $gridHTML);
+                $modal.on("shown", function() {
+                    var dataSource = one.f.switchmanager.nodesLearnt.data.gridDataSource.displayPorts(content);
+                    $("#" + one.f.switchmanager.nodesLearnt.id.modal.portsDatagrid).datagrid({
+                        dataSource: dataSource,
+                        stretchHeight: false
+                    });
+                });
+                $modal.modal();
             }
         },
         body: {
@@ -190,7 +224,8 @@ one.f.switchmanager.nodesLearnt = {
                         searchable: true,
                         filterable: false,
                         pagination: true,
-                        flexibleRowsPerPage: true
+                        flexibleRowsPerPage: true,
+                        popout: true
                         }, "table-striped table-condensed");
                 one.lib.modal.inject.body($modal, $gridHTML);
                 // attach to shown event of modal 
@@ -200,7 +235,12 @@ one.f.switchmanager.nodesLearnt = {
                         var dataSource = one.f.switchmanager.nodesLearnt.data.gridDataSource.popout(content);
                         $("#" + one.f.switchmanager.nodesLearnt.id.modal.datagrid).datagrid({
                             dataSource: dataSource,
-                            stretchHeight: true
+                            stretchHeight: false
+                        })
+                        .on("loaded", function() {
+                            $("#" + one.f.switchmanager.nodesLearnt.id.modal.datagrid).find("tbody span").click(function(){
+                                one.f.switchmanager.nodesLearnt.modal.initialize.displayPorts($(this));
+                            });
                         });
                     });
                 });
@@ -275,9 +315,20 @@ one.f.switchmanager.nodesLearnt = {
                     data: data.nodeData,
                     formatter: function(items) {
                     $.each(items, function (index, item) {
+                        var nodeName = item.nodeName;
                         var nodeNameEntry = item.nodeName ? item.nodeName : "Click to update";
                         item.nodeName = '<a href="#" id="' + item.nodeId + '" switchDetails=' + encodeURIComponent(JSON.stringify(item)) + 
                         ' privilege=' + data.privilege + '>' + nodeNameEntry + '</a>';
+                        
+                        var ports = item.ports;
+                        var portsMatch = ports.match(/<\/span>/g);
+                        var portsLength = 0;
+                        if (portsMatch != null) {
+                            portsLength = portsMatch.length;
+                        }
+                        item.ports = '<span class="nodePorts" style="cursor:pointer;color: #08c" ports='+encodeURIComponent(JSON.stringify(item.ports)) + ' nodeId=' + item.nodeId 
+                            + ' nodeName=' + nodeName  
+                            + '>' + portsLength +'</span>';
                     }); 
                     },
                     delay: 0
@@ -305,7 +356,7 @@ one.f.switchmanager.nodesLearnt = {
                         },
                         {
                             property: 'mac',
-                            label: 'Mac',
+                            label: 'MAC',
                             sortable: true
                         },
                         {
@@ -315,8 +366,44 @@ one.f.switchmanager.nodesLearnt = {
                         }
                     ],
                     data: data.nodeData,
+                    formatter: function(items) {
+                        $.each(items, function (index, item) {
+                            var ports = item.ports;
+                            var portsMatch = ports.match(/<\/span>/g);
+                            var portsLength = 0;
+                            if (portsMatch != null) {
+                                portsLength = portsMatch.length;
+                            }
+                            item.ports = '<span class="nodePorts" style="cursor: pointer;color: #08c" ports='+encodeURIComponent(JSON.stringify(item.ports)) + ' nodeId=' + item.nodeId 
+                                + ' nodeName=' + item.nodeName  
+                                + '>' + portsLength +'</span>';
+                        }); 
+                    },
+                    delay: 0
+                });
+                return source;
+            },
+            displayPorts: function(content){
+                var data=[];
+                var start=0;;
+                var finish=content.indexOf("<br>",start);
+                while(finish != -1){
+                    data.push({"ports":content.substring(start,finish)});
+                    start=finish+4
+                    finish=content.indexOf("<br>",start);
+                }
+                var source = new StaticDataSource({
+                    columns: [
+                        {
+                            property: 'ports',
+                            label: 'Ports',
+                            sortable: true
+                        }
+                    ],
+                    data:data,
                     delay: 0
                 });
+                
                 return source;
             }
         },
@@ -372,7 +459,8 @@ one.f.switchmanager.subnetGatewayConfig = {
             addIPAddress: "one_f_switchmanager_subnetGatewayConfig_id_dashlet_addIP",
             addPorts: "one_f_switchmanager_subnetGatewayConfig_id_dashlet_addPorts",
             removeIPAddress: "one_f_switchmanager_subnetGatewayConfig_id_dashlet_removeIP",
-            datagrid: "one_f_switchmanager_subnetGatewayConfig_id_dashlet_datagrid"
+            datagrid: "one_f_switchmanager_subnetGatewayConfig_id_dashlet_datagrid",
+            selectAll: "one_f_switchmanager_subnetGatewayConfig_id_dashlet_selectAll"
         }, 
         modal: {
             modal: "one_f_switchmanager_subnetGatewayConfig_id_modal_modal",
@@ -419,11 +507,12 @@ one.f.switchmanager.subnetGatewayConfig = {
                         var url = one.f.switchmanager.rootUrl + "/subnetGateway/delete";
                         one.f.switchmanager.subnetGatewayConfig.ajax.main(url, requestData, function(response) {
                             if (response.status == true) {
-                                // refresh dashlet by passing dashlet div as param
-                                one.f.switchmanager.subnetGatewayConfig.dashlet($("#right-bottom .dashlet"));
+                                // refresh dashlet by passing dashlet div as param 
+                                one.lib.alert("Subnet Gateway(s) successfully removed");
                             } else {
-                                alert(response.message);
+                                one.lib.alert(response.message);
                             }
+                            one.f.switchmanager.subnetGatewayConfig.dashlet($("#right-bottom .dashlet"));
                         });
                     }
                 });
@@ -447,7 +536,25 @@ one.f.switchmanager.subnetGatewayConfig = {
                 }, "table-striped table-condensed");
             $dashlet.append($gridHTML);
             var dataSource = one.f.switchmanager.subnetGatewayConfig.data.devicesgrid(content);
-            $("#" + one.f.switchmanager.subnetGatewayConfig.id.dashlet.datagrid).datagrid({dataSource: dataSource});
+            $("#" + one.f.switchmanager.subnetGatewayConfig.id.dashlet.datagrid).datagrid({dataSource: dataSource})
+            .on("loaded", function() {
+                $("#"+one.f.switchmanager.subnetGatewayConfig.id.dashlet.selectAll).click(function() {
+                    $("#" + one.f.switchmanager.subnetGatewayConfig.id.dashlet.datagrid).find(':checkbox').prop('checked',
+                        $("#"+one.f.switchmanager.subnetGatewayConfig.id.dashlet.selectAll).is(':checked'));
+                });
+                $(".subnetGatewayConfig").click(function(){
+                    if (!$('.subnetGatewayConfig[type=checkbox]:not(:checked)').length) {
+                        $("#"+one.f.switchmanager.subnetGatewayConfig.id.dashlet.selectAll)
+                            .prop("checked",
+                          true);
+                    } else {
+                        $("#"+one.f.switchmanager.subnetGatewayConfig.id.dashlet.selectAll)
+                            .prop("checked",
+                         false);
+                    }
+                    event.stopPropagation();
+                });
+             });
         });
     },
     ajax : {
@@ -623,7 +730,8 @@ one.f.switchmanager.subnetGatewayConfig = {
                     columns: [
                         {
                             property: 'selector',
-                            label: ' ',
+                            label: "<input type='checkbox'  id='"
+                                +one.f.switchmanager.subnetGatewayConfig.id.dashlet.selectAll+"'/>",
                             sortable: false
                         },
                         {
@@ -637,7 +745,7 @@ one.f.switchmanager.subnetGatewayConfig = {
                             sortable: true
                         },
                         {
-                            property: 'json',
+                            property: 'nodePorts',
                             label: 'Node/Ports',
                             sortable: false
                         }
@@ -645,20 +753,22 @@ one.f.switchmanager.subnetGatewayConfig = {
                     data: data.nodeData,
                     formatter: function(items) {
                         $.each(items, function(index, tableRow) {
-                            tableRow["selector"] = '<input type="checkbox" id=' + tableRow["name"] + '></input>';
-                            var json = tableRow["json"];
-                            var subnetConfigObject = JSON.parse(json);
+                            tableRow["selector"] = '<input type="checkbox" class="subnetGatewayConfig" id=' 
+                                + tableRow["name"] + '></input>';
+                            var json = tableRow["nodePorts"];
+                            var nodePorts = JSON.parse(json);
                             var nodePortHtml = "<div>";
-                            $.each(subnetConfigObject.nodePorts, function(index, nodePort) {
-                                nodePortHtml += nodePort;
+                            $.each(nodePorts, function(index, nodePort) {
+                                var nodePortID = nodePort["nodeId"] + "/" + nodePort["nodePortId"]; 
+                                nodePortHtml += nodePort["nodeName"] + " / " + nodePort["nodePortName"];
                                 nodePortHtml += "&nbsp;";
-                                nodePortHtml += '<a href="#" id=' + encodeURIComponent(nodePort) + 
+                                nodePortHtml += '<a href="#" id=' + encodeURIComponent(nodePortID) + 
                                     ' gatewayName=' + tableRow["name"] + 
                                     ' onclick="javascript:one.f.switchmanager.subnetGatewayConfig.actions.deleteNodePort(this);">Delete</a>';
                                 nodePortHtml += "<br/>";
                             });
                             nodePortHtml += "</div>";
-                            tableRow["json"] = nodePortHtml;
+                            tableRow["nodePorts"] = nodePortHtml;
                         });
 
                     },
@@ -753,7 +863,8 @@ one.f.switchmanager.staticRouteConfig = {
         dashlet: {
             add: "one_f_switchmanager_staticRouteConfig_id_dashlet_add",
             remove: "one_f_switchmanager_staticRouteConfig_id_dashlet_remove",
-            datagrid: "one_f_switchmanager_staticRouteConfig_id_dashlet_datagrid"
+            datagrid: "one_f_switchmanager_staticRouteConfig_id_dashlet_datagrid",
+            selectAll: "one_f_switchmanager_staticRouteConfig_id_dashlet_selectAll"
         }, 
         modal: {
             modal: "one_f_switchmanager_staticRouteConfig_id_modal_modal",
@@ -797,11 +908,12 @@ one.f.switchmanager.staticRouteConfig = {
                         var url = one.f.switchmanager.rootUrl + "/staticRoute/delete";
                         one.f.switchmanager.staticRouteConfig.ajax.main(url, requestData, function(response) {
                             if (response.status == true) {
-                                // refresh dashlet by passing dashlet div as param
-                                one.f.switchmanager.staticRouteConfig.dashlet($("#left-bottom .dashlet"));
+                                // refresh dashlet by passing dashlet div as param 
+                                one.lib.alert("Static Routes(s) successfully removed");
                             } else {
-                                alert(response.message);
+                                one.lib.alert(response.message);
                             }
+                            one.f.switchmanager.staticRouteConfig.dashlet($("#left-bottom .dashlet"));
                         });
                     }
                 });
@@ -815,7 +927,25 @@ one.f.switchmanager.staticRouteConfig = {
                 }, "table-striped table-condensed");
             $dashlet.append($gridHTML);
             var dataSource = one.f.switchmanager.staticRouteConfig.data.staticRouteConfigGrid(content);
-            $("#" + one.f.switchmanager.staticRouteConfig.id.dashlet.datagrid).datagrid({dataSource: dataSource});
+            $("#" + one.f.switchmanager.staticRouteConfig.id.dashlet.datagrid).datagrid({dataSource: dataSource})
+            .on("loaded", function() {
+                $("#"+one.f.switchmanager.staticRouteConfig.id.dashlet.selectAll).click(function() {
+                    $("#" + one.f.switchmanager.staticRouteConfig.id.dashlet.datagrid).find(':checkbox').prop('checked',
+                        $("#"+one.f.switchmanager.staticRouteConfig.id.dashlet.selectAll).is(':checked'));
+                });
+                $(".staticRoute").click(function(){
+                    if (!$('.staticRoute[type=checkbox]:not(:checked)').length) {
+                        $("#"+one.f.switchmanager.staticRouteConfig.id.dashlet.selectAll)
+                            .prop("checked",
+                          true);
+                    } else {
+                        $("#"+one.f.switchmanager.staticRouteConfig.id.dashlet.selectAll)
+                            .prop("checked",
+                         false);
+                    }
+                    event.stopPropagation();
+                });
+             });
         });
     },
     // device ajax calls
@@ -903,7 +1033,8 @@ one.f.switchmanager.staticRouteConfig = {
                     columns: [
                         {
                             property: 'selector',
-                            label: ' ',
+                            label: "<input type='checkbox'  id='"
+                                +one.f.switchmanager.staticRouteConfig.id.dashlet.selectAll+"'/>",
                             sortable: false
                         },
                         {
@@ -925,7 +1056,7 @@ one.f.switchmanager.staticRouteConfig = {
                     data: data.nodeData,
                     formatter: function(items) {
                         $.each(items, function(index, item) {
-                            item["selector"] = '<input type="checkbox" id=' + item["name"] + '></input>';
+                            item["selector"] = '<input type="checkbox" class="staticRoute" id=' + item["name"] + '></input>';
                         });
 
                     },
@@ -959,7 +1090,8 @@ one.f.switchmanager.spanPortConfig = {
         dashlet: {
             add: "one_f_switchmanager_spanPortConfig_id_dashlet_add",
             remove: "one_f_switchmanager_spanPortConfig_id_dashlet_remove",
-            datagrid: "one_f_switchmanager_spanPortConfig_id_dashlet_datagrid"
+            datagrid: "one_f_switchmanager_spanPortConfig_id_dashlet_datagrid",
+            selectAllFlows: "one_f_switchmanager_spanPortConfig_id_dashlet_selectAllFlows"
         }, 
         modal: {
             modal: "one_f_switchmanager_spanPortConfig_id_modal_modal",
@@ -981,7 +1113,7 @@ one.f.switchmanager.spanPortConfig = {
             if (content.privilege === 'WRITE') {
 
                 // Add span port button
-                var button = one.lib.dashlet.button.single("Add Span Port", one.f.switchmanager.spanPortConfig.id.dashlet.add, "btn-primary", "btn-mini");
+                var button = one.lib.dashlet.button.single("Add SPAN Port", one.f.switchmanager.spanPortConfig.id.dashlet.add, "btn-primary", "btn-mini");
                 var $button = one.lib.dashlet.button.button(button);
 
                 $button.click(function() {
@@ -1009,10 +1141,11 @@ one.f.switchmanager.spanPortConfig = {
                         one.f.switchmanager.spanPortConfig.ajax.main(url, requestData, function(response) {
                             if (response.status == true) {
                                 // refresh dashlet by passing dashlet div as param
-                                one.f.switchmanager.spanPortConfig.dashlet($("#right-bottom .dashlet"));
+                                one.lib.alert("Span Port(s) successfully removed");
                             } else {
-                                alert(response.message);
+                                one.lib.alert(response.message);
                             }
+                            one.f.switchmanager.spanPortConfig.dashlet($("#right-bottom .dashlet"));
                         });
                     }
                 });
@@ -1026,10 +1159,25 @@ one.f.switchmanager.spanPortConfig = {
                 }, "table-striped table-condensed");
             $dashlet.append($gridHTML);
             var dataSource = one.f.switchmanager.spanPortConfig.data.spanPortConfigGrid(content);
-            $("#" + one.f.switchmanager.spanPortConfig.id.dashlet.datagrid).datagrid({dataSource: dataSource});
-
-
-
+            $("#" + one.f.switchmanager.spanPortConfig.id.dashlet.datagrid).datagrid({dataSource: dataSource})
+            .on("loaded", function() {
+                $("#"+one.f.switchmanager.spanPortConfig.id.dashlet.selectAll).click(function() {
+                    $("#" + one.f.switchmanager.spanPortConfig.id.dashlet.datagrid).find(':checkbox').prop('checked',
+                        $("#"+one.f.switchmanager.spanPortConfig.id.dashlet.selectAll).is(':checked'));
+                });
+                $(".spanPortConfig").click(function(){
+                    if (!$('.spanPortConfig[type=checkbox]:not(:checked)').length) {
+                        $("#"+one.f.switchmanager.spanPortConfig.id.dashlet.selectAll)
+                            .prop("checked",
+                          true);
+                    } else {
+                        $("#"+one.f.switchmanager.spanPortConfig.id.dashlet.selectAll)
+                            .prop("checked",
+                         false);
+                    }
+                    event.stopPropagation();
+                });
+             });
         });
     },
     // device ajax calls
@@ -1084,11 +1232,11 @@ one.f.switchmanager.spanPortConfig = {
             // bind onchange
             $select.change(function() {
                 // retrieve port value
-                var node = $(this).find('option:selected').attr('value');
-                one.f.switchmanager.spanPortConfig.registry['currentNode'] = node;
+                var nodeId = $(this).find('option:selected').attr('value');
+                one.f.switchmanager.spanPortConfig.registry['currentNode'] = nodeId;
                 var $ports = $('#' + one.f.switchmanager.spanPortConfig.id.modal.form.port);
-                var ports = nodeports[node];
-                one.lib.form.select.inject($ports, ports);
+                var ports = one.f.switchmanager.spanPortConfig.registry['nodePorts'][nodeId]
+                one.lib.form.select.inject($ports, ports); 
             });
 
             $fieldset.append($label).append($select);
@@ -1105,10 +1253,14 @@ one.f.switchmanager.spanPortConfig = {
         ajax: {
             nodes: function(callback) {
                 $.getJSON(one.f.switchmanager.rootUrl + "/nodeports", function(data) {
-                    var nodes = one.f.switchmanager.spanPortConfig.modal.data.nodes(data);
-                    var nodeports = data;
-                    one.f.switchmanager.spanPortConfig.registry['nodeports'] = nodeports;
-                    callback(nodes, nodeports);
+                    var nodes = {};
+                    var nodePorts = {};
+                    $(data).each(function(index, node) {
+                        nodes[node.nodeId] = node.nodeName;
+                        nodePorts[node.nodeId] = node.nodePorts;
+                    });
+                    one.f.switchmanager.spanPortConfig.registry['nodePorts'] = nodePorts;
+                    callback(nodes, nodePorts);
                 });
             },
             saveSpanPortConfig: function(requestData, callback) {
@@ -1119,15 +1271,6 @@ one.f.switchmanager.spanPortConfig = {
                 });
             }
         },
-        data : {
-            nodes : function(data) {
-                result = {};
-                $.each(data, function(key, value) {
-                    result[key] = key;
-                });
-                return result;
-            }
-        },
         footer : function() {
             var footer = [];
             var saveButton = one.lib.dashlet.button.single("Save", one.f.switchmanager.spanPortConfig.id.modal.save, "btn-success", "");
@@ -1143,7 +1286,8 @@ one.f.switchmanager.spanPortConfig = {
                     columns: [
                         {
                             property: 'selector',
-                            label: ' ',
+                            label: "<input type='checkbox'  id='"
+                                +one.f.switchmanager.spanPortConfig.id.dashlet.selectAll+"'/>",
                             sortable: false
                         },
                         {
@@ -1153,14 +1297,14 @@ one.f.switchmanager.spanPortConfig = {
                         },
                         {
                             property: 'spanPort',
-                            label: 'span Port',
+                            label: 'SPAN Port',
                             sortable: true
                         },
                     ],
                     data: data.nodeData,
                     formatter: function(items) {
                         $.each(items, function(index, item) {
-                            item["selector"] = '<input type="checkbox" spanPort=' + encodeURIComponent(item["json"]) + '></input>';
+                            item["selector"] = '<input type="checkbox" class="spanPortConfig" spanPort=' + encodeURIComponent(item["json"]) + '></input>';
                         });
                     },
                     delay: 0