Merge "Tenant selector"
authorMartin Sunal <msunal@cisco.com>
Tue, 21 Jun 2016 14:12:44 +0000 (14:12 +0000)
committerGerrit Code Review <gerrit@opendaylight.org>
Tue, 21 Jun 2016 14:12:44 +0000 (14:12 +0000)
12 files changed:
groupbasedpolicy-ui/module/src/main/resources/gbp/common/gbp.controller.js
groupbasedpolicy-ui/module/src/main/resources/gbp/common/gbp.css
groupbasedpolicy-ui/module/src/main/resources/gbp/common/topology/next_topology.directive.js
groupbasedpolicy-ui/module/src/main/resources/gbp/common/views/index.tpl.html
groupbasedpolicy-ui/module/src/main/resources/gbp/endpoints/add-endpoint.controller.js
groupbasedpolicy-ui/module/src/main/resources/gbp/endpoints/dialog-add-endpoint.tpl.html
groupbasedpolicy-ui/module/src/main/resources/gbp/endpoints/endpoints-list.service.js
groupbasedpolicy-ui/module/src/main/resources/gbp/endpoints/endpoints.controller.js
groupbasedpolicy-ui/module/src/main/resources/gbp/endpoints/side_panel_endpoints_detail.tpl.html
groupbasedpolicy-ui/module/src/main/resources/gbp/resolved-policy/resolved-policy.controller.js
groupbasedpolicy-ui/module/src/main/resources/gbp/resolved-policy/resolved-policy.tpl.html
groupbasedpolicy-ui/module/src/main/resources/gbp/resolved-policy/rule-sidepanel.tpl.html

index f1295b11cd5b69057be731abffd115690f2a45c1..fd8473e2d1225053dc404187233f0b8590e4afc7 100644 (file)
@@ -7,21 +7,25 @@ define(['app/gbp/common/gbp.service', 'app/gbp/resolved-policy/resolved-policy.s
 
     function RootGbpCtrl($state, $rootScope, $scope, $filter, RootGbpService, TenantListService, TenantService, EpgListService, ResolvedPolicyService, NextTopologyService, EndpointsListService) {
         /* properties */
-        $scope.stateUrl = null;
+        $scope.apiType = 'operational';
+        $scope.endpoints = EndpointsListService.createList();
+        $scope.policyDisabled = true;
+        $scope.rootTenant = null;
+        $scope.rootTenants = TenantListService.createList();
+        $scope.resolvedPolicy = {};
+        $scope.selectedNode = {};
+        $scope.sidePanelObject = {};
         $scope.sidePanelPage = false;
         $scope.sidePanelPageEndpoint = false;
-        $scope.sidePanelObject = {};
-        $scope.rootTenant = TenantService.createObject();
-        $scope.rootTenants = TenantListService.createList();
-        $scope.policyDisabled = true;
+        $scope.stateUrl = null;
+        $scope.topologyData = {nodes: [], links: []};
         $scope.viewPath = 'src/app/gbp/';
-        $scope.selectedNode = {};
-        $scope.apiType = 'operational';
-        $scope.parentTenant = 'tenant-red';
-        $scope.resolvedPolicy = {};
-        $scope.endpoints = EndpointsListService.createList();
+
+        var resolvedPolicies = ResolvedPolicyService.createObject();
+        resolvedPolicies.get(fillTopologyData);
 
         /* methods */
+        $scope.fillTopologyData = fillTopologyData;
         $scope.broadcastFromRoot = broadcastFromRoot;
         $scope.closeSidePanel = closeSidePanel;
         $scope.openSidePanel = openSidePanel;
@@ -40,145 +44,202 @@ define(['app/gbp/common/gbp.service', 'app/gbp/resolved-policy/resolved-policy.s
         $scope.fadeAll = fadeAll;
 
         RootGbpService.setMainClass();
-        console.log('RootGbpCtrl initialized');
-
         init();
 
-
-        $scope.topologyData = {
-            nodes: [],
-            links: [],
-        };
-
         /* implementations */
+
         /**
-         * Sets '$scope.sidePanelPage' to false. This variable is watched in index.tpl.html template
-         * and opens/closes side panel
+         *
+         * @param eventName
+         * @param val
          */
-        function init() {
-            $scope.rootTenants.clearData();
-            $scope.rootTenants.get('config');
-        }
-
         function broadcastFromRoot(eventName, val) {
             $scope.$broadcast(eventName, val);
         }
 
-        function setRootTenant() {
-            $scope.broadcastFromRoot('ROOT_TENANT_CHANGED');
-            enableButtons();
-        }
-
+        /**
+         *
+         */
         function closeSidePanel() {
             $scope.sidePanelPage = false;
             NextTopologyService.fadeInAllLayers($rootScope.nxTopology);
         }
 
         /**
-         * fills $scope.stateUrl with loaded url
-         * It's called on $viewContentLoaded event
+         *
+         * @param arr
          */
-        function setStateUrl() {
-            $scope.stateUrl = $state.current.url;
+        function collapseAll(arr) {
+            arr.forEach(function(element) {
+                element.expanded = false;
+            });
         }
 
         /**
-         * Sets '$scope.sidePanelPage' to true. This variable is watched in index.tpl.html template
-         * and opens/closes side panel
+         *
+         * @param source
+         * @param target
+         * @param contract
+         * @param tenant
+         * @returns {{id: string, source: *, target: *, tenant: *}}
          */
-        function openSidePanel(page, object, cbk) {
-            if(object.constructor.name == 'Epg') {
-                $scope.endpoints.clearData();
-                $scope.endpoints.getByEpg(object.data.id);
-            }
-            var samePage = page === $scope.sidePanelPage;
+        function createLink( source, target, contract, tenant) {
+            return {
+                'id': generateLinkId(contract, source, target),
+                'source': source,
+                'target': target,
+                'tenant': tenant,
+            };
+        }
 
-            $scope.selectedNode = object;
+        /**
+         *
+         * @param nodeName
+         * @param tenantId
+         * @returns {{id: *, tenantId: *, node-id: *, label: *}}
+         */
+        function createNode(nodeName, tenantId) {
+            return {
+                'id': nodeName,
+                'tenantId' : tenantId,
+                'node-id': nodeName,
+                'label': nodeName,
+            };
+        }
 
-            $scope.sidePanelCbk = cbk;
-            $scope.sidePanelPage = page;
-            $scope.sidePanelObject = object;
+        /**
+         *
+         */
+        function deselectContract() {
+            NextTopologyService.fadeInAllLayers($rootScope.nxTopology);
+            $scope.sidePanelPage = 'resolved-policy/contract-sidepanel';
 
-            if ( samePage &&  $scope.sidePanelCbk) {
-                $scope.sidePanelCbk();
-            }
+            var obj = Object.keys($scope.resolvedPolicy).map(function(k) {
+                var obj = $scope.resolvedPolicy[k];
+                obj.linkId = k;
+
+                return obj;
+            });
+
+            $scope.sidePanelObject = obj;
+            $scope.selectedNode = null;
         }
 
+        /**
+         *
+         */
         function deselectEpg() {
             NextTopologyService.fadeInAllLayers($rootScope.nxTopology);
             var elements;
 
             $scope.sidePanelPage = 'resolved-policy/epg-sidepanel';
             elements = EpgListService.createList();
-            elements.get($scope.apiType, $scope.parentTenant);
+            elements.get($scope.apiType, $scope.rootTenant);
             $scope.sidePanelObject = elements;
             $scope.selectedNode = null;
         }
 
-        function deselectContract() {
-            NextTopologyService.fadeInAllLayers($rootScope.nxTopology);
-            $scope.sidePanelPage = 'resolved-policy/contract-sidepanel';
-
-            var obj = Object.keys($scope.resolvedPolicy).map(function(k) {
-                var obj = $scope.resolvedPolicy[k];
-                obj.linkId = k;
+        /**
+         *
+         */
+        function enableButtons() {
+            $scope.policyDisabled = false;
+        }
 
-                return obj;
+        /**
+         *
+         * @param arr
+         */
+        function expandAll(arr) {
+            arr.forEach(function(element) {
+                element.expanded = true;
             });
+        }
 
-            $scope.sidePanelObject = obj;
-            $scope.selectedNode = null;
+        /**
+         *
+         */
+        function fadeAll() {
+            NextTopologyService.fadeInAllLayers($rootScope.nxTopology);
         }
 
-        function openSidePanelTpl(tpl) {
-            switch(tpl) {
-            case 'contract':
-                $scope.sidePanelPage = 'resolved-policy/contract-sidepanel';
-                break;
-            case 'subject':
-                $scope.sidePanelPage = 'resolved-policy/subject-sidepanel';
-                break;
-            case 'clause':
-                $scope.sidePanelPage = 'resolved-policy/clause-sidepanel';
-                break;
-            case 'rule':
-                $scope.sidePanelPage = 'resolved-policy/rule-sidepanel';
-                break;
+        /**
+         *
+         * @param data
+         */
+        function fillResolvedPolicy(data) {
+            if(data['policy-rule-group-with-endpoint-constraints']) {
+                processPolicyRuleGroupWithEpConstraints(
+                    data['policy-rule-group-with-endpoint-constraints'],
+                    data['provider-epg-id'],
+                    data['consumer-epg-id']);
             }
+
         }
 
-        function openSidePanelContract(idElement) {
-            var obj = $filter('filter')(Object.keys($scope.resolvedPolicy).map(function(k) {
-                var obj = $scope.resolvedPolicy[k];
-                obj.linkId = k;
+        /**
+         *
+         */
+        function fillTopologyData() {
+            var topoData = {nodes: [], links: [],},
+                filteredResolvedPolicies = $filter('filter')(resolvedPolicies.data, {'consumer-tenant-id': $scope.rootTenant, 'provider-tenant-id': $scope.rootTenant});
 
-                return obj;
-            }), {'contract-id': idElement});
 
-            $scope.sidePanelPage = 'resolved-policy/contract-sidepanel';
-            $scope.sidePanelObject = obj[0];
-            $scope.selectedNode = obj[0];
+            filteredResolvedPolicies && filteredResolvedPolicies.forEach(function(rp) {
+                if(rp['consumer-tenant-id'] === $scope.rootTenant) {
+                    topoData.nodes.push(createNode(rp['consumer-epg-id'], rp['consumer-tenant-id']));
+                }
+                topoData.nodes.push(createNode(rp['provider-epg-id'], rp['provider-tenant-id']));
 
-            NextTopologyService.highlightLink($rootScope.nxTopology, obj[0].linkId);
+                fillResolvedPolicy(rp);
+                topoData.links = getContracts(rp);
+            });
+
+            $scope.topologyData = topoData;
+            $scope.topologyLoaded = true;
         }
 
-        function openSidePanelChild(index, type) {
-            switch(type) {
-            case 'subject':
-                $scope.sidePanelPage = 'resolved-policy/subject-sidepanel';
-                $scope.subjectIndex = index;
-                break;
-            case 'clause':
-                $scope.sidePanelPage = 'resolved-policy/clause-sidepanel';
-                $scope.clauseIndex = index;
-                break;
-            case 'rule':
-                $scope.sidePanelPage = 'resolved-policy/rule-sidepanel';
-                $scope.ruleIndex = index;
-                break;
+        /**
+         *
+         * @param contractId
+         * @param providerEpgId
+         * @param consumerEpgId
+         * @returns {string}
+         */
+        function generateLinkId(contractId, providerEpgId, consumerEpgId) {
+            return contractId + '_' + providerEpgId + '_' + consumerEpgId;
+        }
+
+        /**
+         *
+         * @param data
+         * @returns {Array}
+         */
+        function getContracts(data) {
+            var retVal = [];
+
+            if( data['policy-rule-group-with-endpoint-constraints'] &&
+                data['policy-rule-group-with-endpoint-constraints'][0]['policy-rule-group']) {
+                data['policy-rule-group-with-endpoint-constraints'][0]['policy-rule-group'].forEach(function(prg) {
+                    retVal.push(
+                        createLink(
+                            data['provider-epg-id'],
+                            data['consumer-epg-id'],
+                            prg['contract-id'],
+                            prg['tenant-id']
+                        )
+                    )
+                });
             }
+
+            return retVal;
         }
 
+        /**
+         *
+         * @param obj
+         * @returns {*}
+         */
         function getObjectsCount(obj) {
             if(obj)
                 return Object.keys(obj).length;
@@ -186,61 +247,120 @@ define(['app/gbp/common/gbp.service', 'app/gbp/resolved-policy/resolved-policy.s
                 return 0;
         }
 
-        function enableButtons() {
-            $scope.policyDisabled = false;
+        /**
+         *
+         * @param node
+         */
+        function highlightNode(node) {
+            NextTopologyService.highlightNode($rootScope.nxTopology, node);
         }
 
-        function toggleExpanded(element) {
-            if(typeof element !== 'string') {
-                if(element.expanded)
-                    element.expanded = false;
-                else
-                    element.expanded = true;
-            }
+        /**
+         *
+         * @param link
+         */
+        function highlightLink(link) {
+            NextTopologyService.highlightLink($rootScope.nxTopology, link);
         }
 
-        function expandAll(arr) {
-            arr.forEach(function(element) {
-                element.expanded = true;
-            });
+        /**
+         *
+         */
+        function init() {
+            $scope.rootTenants.clearData();
+            $scope.rootTenants.get('config');
         }
 
-        function collapseAll(arr) {
-            arr.forEach(function(element) {
-                element.expanded = false;
-            });
-        }
+        /**
+         * Sets '$scope.sidePanelPage' to true. This variable is watched in index.tpl.html template
+         * and opens/closes side panel
+         */
+        function openSidePanel(page, object, cbk) {
+            if(object.constructor.name == 'Epg') {
+                $scope.endpoints.clearData();
+                $scope.endpoints.getByEpg(object.data.id);
+            }
+            var samePage = page === $scope.sidePanelPage;
 
-        var resolvedPolicies = ResolvedPolicyService.createObject();
-        resolvedPolicies.get(function () {
-            fillTopologyData();
-        });
+            $scope.selectedNode = object;
 
-        function fillTopologyData() {
-            var topoData = {nodes: [], links: [],};
+            $scope.sidePanelCbk = cbk;
+            $scope.sidePanelPage = page;
+            $scope.sidePanelObject = object;
 
-            resolvedPolicies.data.forEach(function(rp) {
-                topoData.nodes.push(createNode(rp['consumer-epg-id'], rp['consumer-tenant-id']));
-                topoData.nodes.push(createNode(rp['provider-epg-id'], rp['provider-tenant-id']));
+            if ( samePage &&  $scope.sidePanelCbk) {
+                $scope.sidePanelCbk();
+            }
+        }
 
-                fillResolvedPolicy(rp);
-                topoData.links = getContracts(rp);
-            });
+        /**
+         *
+         * @param idElement
+         */
+        function openSidePanelContract(idElement) {
+            var obj = $filter('filter')(Object.keys($scope.resolvedPolicy).map(function(k) {
+                var obj = $scope.resolvedPolicy[k];
+                obj.linkId = k;
 
-            $scope.topologyData = topoData;
-            $scope.topologyLoaded = true;
+                return obj;
+            }), {'contract-id': idElement});
+
+            $scope.sidePanelPage = 'resolved-policy/contract-sidepanel';
+            $scope.sidePanelObject = obj[0];
+            $scope.selectedNode = obj[0];
+
+            NextTopologyService.highlightLink($rootScope.nxTopology, obj[0].linkId);
         }
 
-        function fillResolvedPolicy(data) {
-            if(data['policy-rule-group-with-endpoint-constraints']) {
-                processPolicyRuleGroupWithEpConstraints(
-                    data['policy-rule-group-with-endpoint-constraints'],
-                    data['provider-epg-id'],
-                    data['consumer-epg-id']);
+        /**
+         * .
+         * @param index
+         * @param type
+         */
+        function openSidePanelChild(index, type) {
+            switch(type) {
+                case 'subject':
+                    $scope.sidePanelPage = 'resolved-policy/subject-sidepanel';
+                    $scope.subjectIndex = index;
+                    break;
+                case 'clause':
+                    $scope.sidePanelPage = 'resolved-policy/clause-sidepanel';
+                    $scope.clauseIndex = index;
+                    break;
+                case 'rule':
+                    $scope.sidePanelPage = 'resolved-policy/rule-sidepanel';
+                    $scope.ruleIndex = index;
+                    break;
             }
+        }
 
+        /**
+         *
+         * @param tpl
+         */
+        function openSidePanelTpl(tpl) {
+            switch(tpl) {
+                case 'contract':
+                    $scope.sidePanelPage = 'resolved-policy/contract-sidepanel';
+                    break;
+                case 'subject':
+                    $scope.sidePanelPage = 'resolved-policy/subject-sidepanel';
+                    break;
+                case 'clause':
+                    $scope.sidePanelPage = 'resolved-policy/clause-sidepanel';
+                    break;
+                case 'rule':
+                    $scope.sidePanelPage = 'resolved-policy/rule-sidepanel';
+                    break;
+            }
         }
 
+        /**
+         *
+         * @param data
+         * @param providerEpgId
+         * @param consumerEpgId
+         */
         function processPolicyRuleGroupWithEpConstraints(data, providerEpgId, consumerEpgId) {
             data.forEach(function(element) {
                 element['policy-rule-group'].forEach(function(el) {
@@ -262,58 +382,41 @@ define(['app/gbp/common/gbp.service', 'app/gbp/resolved-policy/resolved-policy.s
             })
         }
 
-        function generateLinkId(contractId, providerEpgId, consumerEpgId) {
-            return contractId + '_' + providerEpgId + '_' + consumerEpgId;
-        }
-
-        function createNode(nodeName, tenantId) {
-            return {
-                'id': nodeName,
-                'tenantId' : tenantId,
-                'node-id': nodeName,
-                'label': nodeName,
-            };
-        }
-
-        function createLink( source, target, contract, tenant) {
-            return {
-                'id': generateLinkId(contract, source, target),
-                'source': source,
-                'target': target,
-                'tenant': tenant,
-            };
-        }
-
-        function getContracts(data) {
-            var retVal = [];
+        /**
+         *
+         */
+        function setRootTenant() {
+            $scope.broadcastFromRoot('ROOT_TENANT_CHANGED');
 
-            if( data['policy-rule-group-with-endpoint-constraints'] &&
-                data['policy-rule-group-with-endpoint-constraints'][0]['policy-rule-group']) {
-                data['policy-rule-group-with-endpoint-constraints'][0]['policy-rule-group'].forEach(function(prg) {
-                        retVal.push(
-                            createLink(
-                                data['provider-epg-id'],
-                                data['consumer-epg-id'],
-                                prg['contract-id'],
-                                prg['tenant-id']
-                            )
-                        )
-                    });
+            if($scope.stateUrl.startsWith('/resolved-policy')) {
+                fillTopologyData();
             }
-
-            return retVal;
         }
 
-        function highlightNode(node) {
-            NextTopologyService.highlightNode($rootScope.nxTopology, node);
-        }
+        /**
+         * fills $scope.stateUrl with loaded url
+         * It's called on $viewContentLoaded event
+         */
+        function setStateUrl() {
+            $scope.stateUrl = $state.current.url;
+            closeSidePanel();
 
-        function highlightLink(link) {
-            NextTopologyService.highlightLink($rootScope.nxTopology, link);
+            if($scope.stateUrl.startsWith('/resolved-policy')) {
+                fillTopologyData();
+            }
         }
 
-        function fadeAll() {
-            NextTopologyService.fadeInAllLayers($rootScope.nxTopology);
+        /**
+         *
+         * @param element
+         */
+        function toggleExpanded(element) {
+            if(typeof element !== 'string') {
+                if(element.expanded)
+                    element.expanded = false;
+                else
+                    element.expanded = true;
+            }
         }
 
         /* event listeners */
@@ -321,9 +424,5 @@ define(['app/gbp/common/gbp.service', 'app/gbp/resolved-policy/resolved-policy.s
          * Event fired after content loaded, setStateUrl function is called to fill stateUrl method
          */
         $scope.$on('$viewContentLoaded', setStateUrl);
-
-        // $scope.$watch('nxTopology', function() {
-        //     $rootScope.nxTopology = $scope.nxTopology;
-        // });
     }
 });
index 748ebc11fd370eac0ce578340ed6aa12713cd350..e7dbd567e465c275619a553858bafea0599d84dd 100644 (file)
@@ -101,6 +101,10 @@ md-dialog button span {
     color: #000;
 }
 
+div.layout-padding h3 {
+    color: black;
+}
+
 md-sidenav span {
     color: inherit !important;
 }
@@ -223,10 +227,15 @@ div.md-primary.md-subheader > div > span > span {
     color: rgb(33,150,243);
 }
 
+div.md-secondary.md-subheader.ng-scope > div > span > span {
+    color: rgb(33,150,243) !important;
+}
+
 li > md-autocomplete-parent-scope > span {
     color: rgba(0,0,0,.54);
 }
 
-md-content > div.md-secondary.md-subheader > div > span > span {
-    color: rgb(33,150,243) !important;
+#tenantSelector div, #tenantSelector .md-select-placeholder span {
+    color: white;
+    font-weight: normal;
 }
index d758ebf19b7b1983eac48a5809249c24e7139c18..a3feac5f9d7647a4da20c8fa870ee6f4e4f494d3 100644 (file)
@@ -111,9 +111,9 @@ define(['next-ui'], function() {
                                scope.$watch('topologyData', function(){
                                        //console.log('scope.topologyData', scope.topologyData);
 
-                                       if( scope.topologyData.nodes.length ) { //&& initialized === false
+                                       //if( scope.topologyData.nodes.length ) { //&& initialized === false
                                                scope.init(scope.cbkFunctions.topologyGenerated);
-                                       }
+                                       //}
                                });
 
                                /**
index 5fe2381dc378d98167e48dd583dfad401e771271..487594b3584f6f6bc4c40d9332f28e8747fe6d0a 100644 (file)
                 <span flex></span>
                 <md-button ng-if="'main.gbp.index.resolvedPolicy' | isState" ng-click="deselectEpg()" ng-href="">Endpoint-groups</md-button>
                 <md-button ng-if="'main.gbp.index.resolvedPolicy' | isState" ng-click="deselectContract()" ng-href="">Contracts</md-button>
+                <md-input-container style="margin-right: 10px;">
+                    <md-select ng-model="rootTenant"
+                               placeholder="select tenant"
+                               md-on-close="setRootTenant();"
+                               id="tenantSelector">
+                        <md-option ng-repeat="tenant in rootTenants.data" ng-value="tenant.data.id">{{ tenant.data.id }}</md-option>
+                    </md-select>
+                </md-input-container>
             </div>
         </md-toolbar>
         <!-- <md-content md-scroll-y flex ui-view></md-content> -->
index d29d3c3e4965cd86d4b14a45f84352daca15f004..33262bfa3c5d57c59752f6331daa8f2e887a43a3 100644 (file)
@@ -16,10 +16,17 @@ define([
             selectedItem: null,
             searchText: null,
         };
-        $scope.epgsListOfChoosenTenant = null;
+        $scope.epgsListOfChoosenTenant = [];
         $scope.forwarding = ForwardingService.createObject();
         $scope.forwardingContexts = [];
         $scope.forwardingNetworkDomainIds = [];
+        $scope.regexps = {
+            'ipv4cidr': '(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])(\/([0-9]|[1-2][0-9]|3[0-2]))',
+            'ipv6cidr': 's*((([0-9A-Fa-f]{1,4}:){7}([0-9A-Fa-f]{1,4}|:))|(([0-9A-Fa-f]{1,4}:){6}(:[0-9A-Fa-f]{1,4}|((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3})|:))|(([0-9A-Fa-f]{1,4}:){5}(((:[0-9A-Fa-f]{1,4}){1,2})|:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3})|:))|(([0-9A-Fa-f]{1,4}:){4}(((:[0-9A-Fa-f]{1,4}){1,3})|((:[0-9A-Fa-f]{1,4})?:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){3}(((:[0-9A-Fa-f]{1,4}){1,4})|((:[0-9A-Fa-f]{1,4}){0,2}:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){2}(((:[0-9A-Fa-f]{1,4}){1,5})|((:[0-9A-Fa-f]{1,4}){0,3}:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){1}(((:[0-9A-Fa-f]{1,4}){1,6})|((:[0-9A-Fa-f]{1,4}){0,4}:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3}))|:))|(:(((:[0-9A-Fa-f]{1,4}){1,7})|((:[0-9A-Fa-f]{1,4}){0,5}:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3}))|:)))(%.+)?s*(\/([1-9]|[1-9][0-9]|1[0-1][0-9]|12[0-8]))',
+            'mac-address': '([0-9A-Fa-f]{2}[:-]){5}([0-9A-Fa-f]{2})',
+        };
+
+        $scope.regexps['ip-prefix'] = '(('+$scope.regexps.ipv4cidr + ')|(' + $scope.regexps.ipv6cidr + '))';
 
         /* methods */
         $scope.closeDialog = closeDialog;
@@ -27,26 +34,10 @@ define([
         $scope.filterContextIds = filterContextIds;
         $scope.filterNetworkDomainIds = filterNetworkDomainIds;
         $scope.searchEpgs = searchEpgs;
-
-
-        $scope.forwarding.get(function () {
-            var tenantForwarding = $filter('filter')($scope.forwarding.data, { 'tenant-id': $scope.parentTenant });
-
-            if (tenantForwarding && tenantForwarding.length) {
-                $scope.forwarding.data = tenantForwarding[0];
-                $scope.filterNetworkDomainIds('l2-l3-forwarding:subnet');
-            }
-
-            if ($scope.endpoint && $scope.endpoint.data['context-type']) {
-                $scope.filterContextIds($scope.endpoint.data['context-type']);
-            }
-        });
-
-
-
-        populateEpgsListOfChoosenTenant();
+        $scope.populateScopeAfterTenantSelected = populateScopeAfterTenantSelected;
 
         /* Implementations */
+        $scope.forwarding.get(postForwardingGet);
 
         function closeDialog(){
             $mdDialog.cancel();
@@ -72,14 +63,14 @@ define([
 
         function filterNetworkDomainIds(networkDomainType) {
             $scope.forwardingNetworkDomainIds =  $filter('filter')($scope.forwarding.data['network-domain'], {'network-domain-type': networkDomainType});
-            $scope.forwardingNetworkDomainIds.unshift('');
         }
 
         function populateEpgsListOfChoosenTenant() {
-            var tenantsIdsList = $scope.rootTenants.data.map(function (e) { return e.data.id; }),
-                indexOfChoosenTenant = tenantsIdsList.indexOf($scope.parentTenant),
-                epgsObjectsOfChoosenTenant = $scope.rootTenants.data[indexOfChoosenTenant].data.policy['endpoint-group'];
-            $scope.epgsListOfChoosenTenant = epgsObjectsOfChoosenTenant.map(function (a) { return a.id; });
+            $scope.rootTenants.data.some(function (tenant) {
+                if (tenant.data.id === $scope.endpoint.data.tenant) {
+                    $scope.epgsListOfChoosenTenant = tenant.data.policy['endpoint-group'].map(function (ele) { return ele.id; } );
+                }
+            });
         }
 
         function searchEpgs(query) {
@@ -94,6 +85,22 @@ define([
             };
         }
 
+        function postForwardingGet() {
+            var tenantForwarding = $filter('filter')($scope.forwarding.data, { 'tenant-id': $scope.endpoint.data.tenant });
+
+            if (tenantForwarding && tenantForwarding.length) {
+                $scope.forwarding.data = tenantForwarding[0];
+                $scope.filterNetworkDomainIds('l2-l3-forwarding:subnet');
+            }
+
+            if ($scope.endpoint && $scope.endpoint.data['context-type']) {
+                $scope.filterContextIds($scope.endpoint.data['context-type']);
+            }
+        }
+
+        function populateScopeAfterTenantSelected() {
+            populateEpgsListOfChoosenTenant();
+        }
 
     }
 });
index e1e6a280b750358c39d8e82a81693ff861835e81..84b167ec8ce54cfc1600a0920dbcfabb8b8282ac 100644 (file)
@@ -14,8 +14,8 @@
                         <div layout="row">
                             <md-input-container flex >
                                 <label>Tenant Id</label>
-                                <md-select ng-model="endpoint.data.tenant" aria-label="Tenant select">
-                                    <md-option ng-repeat="tenant in rootTenants.data" value="{{tenant.data.id}}">{{ tenant.data.id }}</md-option>
+                                <md-select ng-model="endpoint.data.tenant" md-on-close="populateScopeAfterTenantSelected();" aria-label="Tenant select">
+                                    <md-option ng-repeat="tenant in rootTenants.data" ng-value="tenant.data.id">{{ tenant.data.id }}</md-option>
                                 </md-select>
                             </md-input-container>
                         </div>
                             </md-input-container>
                             <md-input-container flex>
                                 <label>Address</label>
-                                <input name="address" ng-model="endpoint.data.address" ng-required="true">
+                                <input name="address" ng-model="endpoint.data.address" ng-required="true"
+                                       ng-pattern="(endpoint.data['address-type'] === 'l2-l3-forwarding:mac-address-type' ? regexps['mac-address'] : regexps['ip-prefix'])">
                                 <div ng-messages="endpointForm.address.$error" ng-show="endpointForm.address.$touched">
                                     <div ng-message="required">Required field</div>
+                                    <div ng-message="pattern">Expected correct address type format</div>
                                </div>
                             </md-input-container>
                         </div>
@@ -76,6 +78,7 @@
                                 <md-select name="networkDomainIdSelect"
                                            ng-model="endpoint.data['network-containment']['network-domain-id']"
                                            aria-label="Network Domain Id select">
+                                    <md-option value="{{undefined}}"></md-option>
                                     <md-option ng-repeat="NetworkDomainId in forwardingNetworkDomainIds"
                                                ng-value="NetworkDomainId['network-domain-id']"
                                                ng-required="true" >
                                                        md-search-text="epgsChips.searchText"
                                                        md-items="epg in searchEpgs(epgsChips.searchText)"
                                                        md-item-text="epg"
-                                        placeholder="Add an item"
+                                        placeholder="{{!endpoint.data.tenant ? 'Select Tenant first' : 'Add an item'}}"
                                                        md-autocomplete-wrap-override
                                                        md-input-name="epAutocomplete"
-                                                       flex>
+                                                       flex
+                                        ng-disabled="!endpoint.data.tenant">
                                                        <md-item-template>
                                                                <span md-highlight-text="epgsChips.searchText">{{epg}}</span>
                                                        </md-item-template>
index 49f9a7b9e5c9066e55889ba7ede862f659845198..fc0bfac4988611bd0cb5109f5616ba12baf6892a 100644 (file)
@@ -17,6 +17,7 @@ define([], function () {
             this.setData = setData;
             this.get = get;
             this.getByEpg = getByEpg;
+            this.getByTenantId = getByTenantId;
             this.clearData = clearData;
 
             /* Implementation */
@@ -64,6 +65,18 @@ define([], function () {
                     self.setData(endpoints);
                 });
             }
+
+            function getByTenantId(rootTenant) {
+                var self = this;
+                var restObj = Restangular.one('restconf').one('operational').one('base-endpoint:endpoints');
+                return restObj.get().then(function (data) {
+                    var endpoints = $filter('filter')(data.endpoints['address-endpoints']['address-endpoint'].map(function(endpoint) {
+                        return endpoint;
+                    }), { 'tenant': rootTenant });
+                    self.setData(endpoints);
+                });
+            }
+
         }
 
         function createList() {
index 902c3051ef8f851f68166fe3ce61dcaff7b2f63c..20634ad2b2c003addb11a8ea6259fa9c331a9ac1 100644 (file)
@@ -24,11 +24,11 @@ define([
         $scope.getEndpointsList = getEndpointsList;
         $scope.deleteEndpointDialog = deleteEndpointDialog;
 
-        getEndpointsList();
+        $scope.getEndpointsList();
 
         function getEndpointsList() {
             $scope.endpoints.clearData();
-            $scope.endpoints.get();
+            $scope.rootTenant ? $scope.endpoints.getByTenantId($scope.rootTenant) : $scope.endpoints.get($scope.rootTenant);
         }
 
         function openEndpointDialog(operation, endpointData) {
@@ -61,5 +61,9 @@ define([
 
             });
         }
+
+        $scope.$on('ROOT_TENANT_CHANGED', function () {
+            $scope.getEndpointsList();
+        });
     }
 });
index 8bd950bff5c6261842717c56ae5756e744b8d95f..c1876566cbe7a7cdb6736416a523208b24d959b2 100644 (file)
@@ -7,20 +7,21 @@
         <span flex="35"><strong>Endpoint group</strong></span><span ng-repeat="epg in sidePanelObject['endpoint-group']">{{epg}}<span ng-if="!$last">, </span>
         </span>
     </div>
-    <hr style="border: 1px dashed rgba(0,0,0,.54);" width="50%" />
+    <md-divider style="margin-bottom: 10px; margin-top: 10px;"></md-divider>
     <div layout="row" class="layout-padding-lr15 .layout-padding-b15 layout-row">
         <span flex="35"><strong>Context type</strong></span><span flex>{{ sidePanelObject['context-type'] }}</span>
     </div>
     <div layout="row" class="layout-padding-lr15 .layout-padding-b15 layout-row">
         <span flex="35"><strong>Context Id</strong></span><span flex>{{ sidePanelObject['context-id'] }}</span>
     </div>
-    <hr style="border: 1px dashed rgba(0,0,0,.54);" width="50%" />
+    <md-divider style="margin-bottom: 10px; margin-top: 10px;"></md-divider>
     <div layout="row" class="layout-padding-lr15 .layout-padding-b15 layout-row">
         <span flex="35"><strong>Address type</strong></span><span flex>{{ sidePanelObject['address-type'] }}</span>
     </div>
     <div layout="row" class="layout-padding-lr15 .layout-padding-b15 layout-row">
         <span flex="35"><strong>Address</strong></span><span flex>{{ sidePanelObject.address }}</span>
     </div>
+    <md-divider style="margin-bottom: 10px; margin-top: 10px;"></md-divider>
     <md-subheader class="md-secondary" ng-if="sidePanelObject['network-containment']['network-domain-type'].length">Network domain</md-subheader>
     <div layout="row" class="layout-padding-lr15 .layout-padding-b15 layout-row" ng-if="sidePanelObject['network-containment']['network-domain-id'].length">
         <span flex="35"><strong>Id</strong></span><span flex>{{ sidePanelObject['network-containment']['network-domain-id'] }}</span>
index 4326625a9796f464d8de89fabdf708d274ca9659..32aaf877eed29e489f69ff2d43b0c279ee8d73ae 100644 (file)
@@ -7,25 +7,20 @@ define(['app/gbp/resolved-policy/resolved-policy.service'], function () {
 
     /* @ngInject */
     function ResolvedPolicyController($rootScope, $scope, ResolvedPolicyService, EpgService, EpgListService, ContractService, NextTopologyService) {
+        $scope.reloadTopology = reloadTopology;
+
         $scope.cbkFunctions = {
             clickNode: function(node){
                 var epg = EpgService.createObject();
+
                 epg.get(node['_data-id'], node['_model']['_data']['tenantId'], 'operational', function() {
                     $scope.openSidePanel('resolved-policy/epg-sidepanel', epg, null);
                 });
+
                 $scope.$apply();
                 $scope.parentTenant = node['_model']['_data']['tenantId'];
 
                 NextTopologyService.highlightNode($rootScope.nxTopology, node['_data-id']);
-                // //Example of highlighting
-                // NextTopologyService.highlightNode($scope.nxTopology, 1);
-                // NextTopologyService.highlightNode($scope.nxTopology, 1, true); //without links around
-                // NextTopologyService.highlightLink($scope.nxTopology, '1-7');
-                // NextTopologyService.highlightPath($scope.nxTopology, [array of links obj]);
-
-                // //Fade out or in whole topology
-                // NextTopologyService.fadeOutAllLayers();
-                // NextTopologyService.fadeInAllLayers();
             },
             clickLink: function(link){
                 var resolvedContract = $scope.resolvedPolicy[link['_model']['_data'].id];
@@ -39,6 +34,11 @@ define(['app/gbp/resolved-policy/resolved-policy.service'], function () {
             }
         };
 
+
+        function reloadTopology() {
+            $scope.fillTopologyData();
+        }
+
         $scope.$watch('nxTopology', function() {
             $rootScope.nxTopology = $scope.nxTopology;
         });
index 80850da0cb7818fb57d99cd8e23a2cdfef2e44dd..57ae5834f48239dd3ca3d882706a912ac36dde05 100644 (file)
@@ -1,5 +1,5 @@
-<div ng-controller="ResolvedPolicyController" id="topology-container">
-    <md-button md-no-ink class="md-primary reload-button" ng-click="reloadTopo()"><i class="material-icons">sync</i> Reload topology</md-button>
+<div id="topology-container">
+    <md-button md-no-ink class="md-primary reload-button" ng-click="reloadTopology()"><i class="material-icons">sync</i> Reload topology</md-button>
     <next-topology topology-data="topologyData" cbk-functions="cbkFunctions" dictionaries="nxDict" topo="nxTopology"
                topo-colors="nxTopoColors"></next-topology>
-</div>
\ No newline at end of file
+</div>
index 0abd8d9bb347c517816c4d4476316644000c8dff..d598867b051f90d2641a63491b2292d43354b79c 100644 (file)
@@ -22,7 +22,7 @@
                <div layout="row" class="layout-row">
                        <span>Actions ({{selectedNode.subjects[subjectIndex]['resolved-rule'][0][ruleIndex].action.length}})</span>
                        <span class="flex" flex></span>
-                       <md-button class="md-button md-primary md-button md-ink-ripple expand-button" type="button" ng-click="expandAll(selectedNode.subjects[subjectIndex]['resolved-rule'][0][ruleIndex].action)" aria-label="Expand all">            
+                       <md-button class="md-button md-primary md-button md-ink-ripple expand-button" type="button" ng-click="expandAll(selectedNode.subjects[subjectIndex]['resolved-rule'][0][ruleIndex].action)" aria-label="Expand all">
                    <i class="fa fa-expand ng-scope"></i>
                        <div class="md-ripple-container"></div>
                        <md-tooltip md-direction="bottom">
        </div>
        </md-subheader>
     <md-list class="expander">
-       <ng-repeat ng-repeat="action in selectedNode.subjects[subjectIndex]['resolved-rule'][0][ruleIndex].action">
-               <md-list-item ng-click="toggleExpanded(action)">
-                       <span class="layout-padding-r10">
-                           <h4 class="order">{{action.order}}</h4>
-                       </span>
-                       <span>{{action.name}}</span>
-                       <md-content ng-show="action.expanded" class="md-whiteframe-2dp ng-scope layout-margin">
-                               <div flex>
-                                       <div layout="row" class="layout-row">
-                                       <span flex="50" class="flex-50"><strong>Action definition ID</strong></span>
-                                               <span flex class="ng-binding flex">{{action['action-definition-id']}}</span>
-                                       </div>
-                                       <div layout="row" class="layout-row">
-                                       <span flex="50" class="flex-50"><strong>Name</strong></span>
-                                               <span flex class="ng-binding flex">{{action.name}}</span>
-                                       </div>
-                                       </div>
-                       </md-content>
-               </md-list-item>
-       </ng-repeat>
+               <md-list-item ng-click="toggleExpanded(action)" class="md-3-line" layout="row"
+                                         ng-repeat="action in selectedNode.subjects[subjectIndex]['resolved-rule'][0][ruleIndex].action">
+                       <div layout-padding flex="10">
+                               <h3>{{action.order}}</h3>
+                               <md-tooltip md-direction="right">
+                                       Order
+                               </md-tooltip>
+                       </div>
+                       <div class="md-list-item-text" flex>
+                               <h3>{{action.name}}</h3>
+                               <p>Action definition ID: {{action['action-definition-id']}} </p>
+                               <p>Name: {{action.name}} </p>
+                       </div>
+                       <div ng-if="action['action-definition-id'] === 'Action-Chain'" flex="10">
+                               <md-button class="md-icon-button" ng-click="openSfcDialog({{action.name}})">
+                                       <md-icon>visibility</md-icon>
+                               </md-button>
+                       </div>
+               </md-list-item>
     </md-list>
        <md-divider></md-divider>
        <md-subheader class="md-primary">
                </md-list-item>
        </ng-repeat>
     </md-list>
-</md-content>
\ No newline at end of file
+</md-content>