Merge "Yangman - improvements - more info belove"
authorMaxime Millette-Coulombe <mmcoulombe@inocybe.com>
Thu, 11 Aug 2016 22:14:14 +0000 (22:14 +0000)
committerGerrit Code Review <gerrit@opendaylight.org>
Thu, 11 Aug 2016 22:14:14 +0000 (22:14 +0000)
40 files changed:
modules/yangman-resources/src/main/resources/yangman/assets/data/locale-en_US.json
modules/yangman-resources/src/main/resources/yangman/controllers/form/choice.controller.js
modules/yangman-resources/src/main/resources/yangman/controllers/form/container.controller.js
modules/yangman-resources/src/main/resources/yangman/controllers/form/input.controller.js
modules/yangman-resources/src/main/resources/yangman/controllers/form/leaf-list.controller.js
modules/yangman-resources/src/main/resources/yangman/controllers/form/leaf.controller.js
modules/yangman-resources/src/main/resources/yangman/controllers/form/list.controller.js
modules/yangman-resources/src/main/resources/yangman/controllers/form/output.controller.js
modules/yangman-resources/src/main/resources/yangman/controllers/form/rpc.controller.js
modules/yangman-resources/src/main/resources/yangman/controllers/yang-form.controller.js
modules/yangman-resources/src/main/resources/yangman/controllers/yangman.controller.js
modules/yangman-resources/src/main/resources/yangman/directives/yang-form-menu.directive.js
modules/yangman-resources/src/main/resources/yangman/directives/ym-info-box.directive.js [new file with mode: 0644]
modules/yangman-resources/src/main/resources/yangman/services/yangman-design.services.js
modules/yangman-resources/src/main/resources/yangman/services/yangman.services.js
modules/yangman-resources/src/main/resources/yangman/views/directives/yang-form-menu.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/directives/ym-info-box.tpl.html [new file with mode: 0644]
modules/yangman-resources/src/main/resources/yangman/views/index.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/detail.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/config/choice.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/config/container.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/config/input.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/config/leaf-list.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/config/leaf.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/config/list.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/config/output.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/config/rpc.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/config/types/bits.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/config/types/empty.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/config/types/union.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/operational/choice.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/operational/container.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/operational/input.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/operational/leaf-list.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/operational/leaf.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/operational/list.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/operational/output.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/operational/rpc.tpl.html
modules/yangman-resources/src/main/resources/yangman/views/rightpanel/form/operations/rpc.tpl.html
modules/yangman-resources/src/main/resources/yangman/yangman.less

index 7ed161ee7c284f1b01fe1f63a71882e1fca19f90..dc03707f22eb9684c60f5782fcf8dc072fb28dd4 100644 (file)
@@ -82,5 +82,6 @@
   "YANGMAN_DELETE_OPTIONS": "Delete options",
   "YANGMAN_SELECT_OPTIONS": "Select options",
   "YANGMAN_SELECT_ALL": "Select All",
-  "YANGMAN_DESELECT_ALL": "Deselect All"
+  "YANGMAN_DESELECT_ALL": "Deselect All",
+  "YANGMAN_IS_AUGMENT": "Augment's Group"
 }
index 4f012fbfb741596e6b9fd21432f26ceb5e6eea24..75141233f24dad2d13e4c8695a35492275274584 100644 (file)
@@ -12,7 +12,6 @@ define([], function () {
 
         // methods
         yangChoice.isActionMenu = isActionMenu;
-        yangChoice.isNodeInfo = isNodeInfo;
         $scope.caseShowing = caseShowing;
         yangChoice.toggleExpanded = toggleExpanded;
 
@@ -34,16 +33,7 @@ define([], function () {
          * @returns {boolean|*}
          */
         function isActionMenu() {
-            return $scope.node.getChildren('description', null, null, 'label').length > 0 ||
-                ($scope.node.augmentionGroups && $scope.node.augmentionGroups.length);
-        }
-
-        /**
-         * Show hide node info
-         * @returns {*}
-         */
-        function isNodeInfo(){
-            return $scope.node.augmentationId;
+            return $scope.node.augmentionGroups && $scope.node.augmentionGroups.length;
         }
     }
 });
index 9fa499f1cce850e15d8819eb298dbf1675d709f3..ff3fb255605676a06194813b3c6db357c23f45c3 100644 (file)
@@ -10,7 +10,6 @@ define([], function () {
 
         // methods
         yangContainer.isActionMenu = isActionMenu;
-        yangContainer.isNodeInfo = isNodeInfo;
         yangContainer.toggleExpanded = toggleExpanded;
 
         /**
@@ -25,16 +24,7 @@ define([], function () {
          * @returns {boolean|*}
          */
         function isActionMenu() {
-            return $scope.node.getChildren('description', null, null, 'label').length > 0 ||
-                ($scope.node.augmentionGroups && $scope.node.augmentionGroups.length);
-        }
-
-        /**
-         * Show hide node info
-         * @returns {*}
-         */
-        function isNodeInfo(){
-            return $scope.node.augmentationId;
+            return $scope.node.augmentionGroups && $scope.node.augmentionGroups.length;
         }
     }
 });
index d226fbf0ec6fbb68facdda8f7d053fb07db71c95..f6dbfa40e345e98804104342e218daa8c9e12259 100644 (file)
@@ -10,7 +10,6 @@ define([], function () {
 
         // methods
         yangInput.isActionMenu = isActionMenu;
-        yangInput.isNodeInfo = isNodeInfo;
         yangInput.toggleExpanded = toggleExpanded;
 
         /**
@@ -25,16 +24,7 @@ define([], function () {
          * @returns {boolean|*}
          */
         function isActionMenu() {
-            return $scope.node.getChildren('description', null, null, 'label').length > 0 ||
-                ($scope.node.augmentionGroups && $scope.node.augmentionGroups.length);
-        }
-
-        /**
-         * Show hide node info
-         * @returns {*}
-         */
-        function isNodeInfo(){
-            return $scope.node.augmentationId;
+            return $scope.node.augmentionGroups && $scope.node.augmentionGroups.length;
         }
     }
 });
index 97c61968b87e62687e737fe25f8342cc869ef80e..54b3d257f716f7b2e6872ec5174330b164ffa2c5 100644 (file)
@@ -12,7 +12,6 @@ define([], function () {
         yangLeafList.addListElem = addListElem;
         yangLeafList.changed = changed;
         yangLeafList.isActionMenu = isActionMenu;
-        yangLeafList.isNodeInfo = isNodeInfo;
         yangLeafList.removeListElem = removeListElem;
         yangLeafList.toggleExpanded = toggleExpanded;
 
@@ -46,14 +45,6 @@ define([], function () {
         function isActionMenu() {
             return true;
         }
-
-        /**
-         * Show hide node info
-         * @returns {*}
-         */
-        function isNodeInfo(){
-            return $scope.node.augmentationId;
-        }
     }
 });
 
index 7a816b1bba99590176982dfbdad4da028df04cb0..9b703e9f1de23ecf53b9a498a23baef01bdf7635 100644 (file)
@@ -27,16 +27,21 @@ define([], function () {
                 'uint8',
                 'union',
             ],
-            yanfLeaf = this;
+            yangLeaf = this;
 
-        yanfLeaf.infoBox = false;
-        yanfLeaf.infoBoxSection = '';
+        yangLeaf.infoBox = false;
+        yangLeaf.infoBoxSection = '';
 
         // methods
-        yanfLeaf.isActionMenu = isActionMenu;
-        yanfLeaf.isNodeInfo = isNodeInfo;
-        yanfLeaf.getLeafType = getLeafType;
-        yanfLeaf.displayValue = displayValue;
+        yangLeaf.displayValue = displayValue;
+        yangLeaf.getLeafCentering = getLeafCentering;
+        yangLeaf.getLeafType = getLeafType;
+        yangLeaf.isActionMenu = isActionMenu;
+
+
+        function getLeafCentering(){
+            return ['union', 'bits', 'empty'].indexOf(getLeafType()) > -1 ? 'start' : 'center';
+        }
 
         /**
          * Get leaf type
@@ -56,15 +61,7 @@ define([], function () {
          * @returns {boolean|*}
          */
         function isActionMenu() {
-            return $scope.node.getChildren('description', null, null, 'label').length > 0;
-        }
-
-        /**
-         * Show hide node info
-         * @returns {*}
-         */
-        function isNodeInfo(){
-            return $scope.node.augmentationId || $scope.node.isKey();
+            return false;
         }
     }
 });
index b50026858482c6887ed403da7f95836beeb5fdf5..28fb80c1dbf1123e1f7aaec2baf7f0d7c8cf2869 100644 (file)
@@ -28,7 +28,6 @@ define([], function () {
         yangList.getListName = getListName;
         yangList.init = init;
         yangList.isActionMenu = isActionMenu;
-        yangList.isNodeInfo = isNodeInfo;
         yangList.removeListElem = removeListElem;
         yangList.shiftDisplayNext = shiftDisplayNext;
         yangList.shiftDisplayPrev = shiftDisplayPrev;
@@ -192,14 +191,6 @@ define([], function () {
         function isActionMenu() {
             return true;
         }
-
-        /**
-         * Show hide node info
-         * @returns {*}
-         */
-        function isNodeInfo(){
-            return $scope.node.augmentationId;
-        }
     }
 });
 
index 9c09acd01abcd35438687f6dd2b112386cce5fc5..df661f8a80a0f4020ec9dacb771cff7f4d2400a2 100644 (file)
@@ -11,7 +11,6 @@ define([], function () {
 
         // methods
         yangOutput.isActionMenu = isActionMenu;
-        yangOutput.isNodeInfo = isNodeInfo;
         yangOutput.toggleExpanded = toggleExpanded;
 
         /**
@@ -26,16 +25,7 @@ define([], function () {
          * @returns {boolean|*}
          */
         function isActionMenu() {
-            return $scope.node.getChildren('description', null, null, 'label').length > 0 ||
-                ($scope.node.augmentionGroups && $scope.node.augmentionGroups.length);
-        }
-
-        /**
-         * Show hide node info
-         * @returns {*}
-         */
-        function isNodeInfo(){
-            return $scope.node.augmentationId;
+            return $scope.node.augmentionGroups && $scope.node.augmentionGroups.length;
         }
     }
 });
index 6bc4a966833fbaf71b37f534c463fd9ce45216c6..0da375e742381b8aef508eccb2ab2eb9ca7f443f 100644 (file)
@@ -11,7 +11,6 @@ define([], function () {
         // methods
         yangRpc.toggleExpanded = toggleExpanded;
         yangRpc.isActionMenu = isActionMenu;
-        yangRpc.isNodeInfo = isNodeInfo;
 
         /**
          * Show hide node
@@ -25,16 +24,9 @@ define([], function () {
          * @returns {boolean|*}
          */
         function isActionMenu() {
-            return $scope.node.getChildren('description', null, null, 'label').length > 0;
+            return false;
         }
 
-        /**
-         * Show hide node info
-         * @returns {*}
-         */
-        function isNodeInfo(){
-            return $scope.node.augmentationId;
-        }
     }
 });
 
index 274311d4e299db66ef1bdf209beda784289e1c01..bc7c352b5c8188e212407e4585131e53581af56c 100644 (file)
@@ -14,6 +14,7 @@ define([
     'app/yangman/controllers/form/type-empty.controller',
     'app/yangman/controllers/form/type-enum.controller',
     'app/yangman/directives/yang-form-menu.directive',
+    'app/yangman/directives/ym-info-box.directive',
 ], function () {
     'use strict';
 
index 8c7efc4e6908f68a3e6b3c9ee67fadf4b35a56a7..0b012988f5cebe788cc470663d2c9576c753e8b9 100644 (file)
@@ -59,7 +59,6 @@ define([
         main.leftPanelShowModule = leftPanelShowModule;
         main.modulesTreeDisplayed = modulesTreeDisplayed;
 
-
         // scope global methods
         $scope.buildRootRequest = buildRootRequest;
         $scope.broadcastFromRoot = broadcastFromRoot;
@@ -113,6 +112,7 @@ define([
         function init(){
             YangmanDesignService.hideMainMenu();
             YangmanDesignService.setDraggableLeftPanel();
+            YangmanDesignService.setJsonSplitter(forceCMsRefresh);
 
             EventDispatcherService.registerHandler(constants.EV_FILL_PATH, fillPathIdentifiersByKey);
             EventDispatcherService.registerHandler(constants.EV_LIST_CHANGED, fillPathIdentifiersByListData);
@@ -314,6 +314,7 @@ define([
             main.jsonView.received = received;
             main.jsonView.sent = sent;
             forceCMsRefresh();
+            YangmanDesignService.setJsonSplitter(forceCMsRefresh);
         }
 
         /**
index 09acc88da91e7050b6fc1045563f67922a8861dd..0cc28d1e779f8f956e33d6c26cdf8d7f0a674bdb 100644 (file)
@@ -14,7 +14,6 @@ define(['angular'], function (angular) {
                 augmentations: '=',
                 allowItems: '=',
                 isActionMenu: '&',
-                isNodeInfo: '&',
                 addListItemFunc: '&',
                 addListItem: '=',
                 yangForm: '=',
diff --git a/modules/yangman-resources/src/main/resources/yangman/directives/ym-info-box.directive.js b/modules/yangman-resources/src/main/resources/yangman/directives/ym-info-box.directive.js
new file mode 100644 (file)
index 0000000..8acf862
--- /dev/null
@@ -0,0 +1,57 @@
+define(['angular'], function (angular) {
+    'use strict';
+
+    angular.module('app.yangman').directive('ymInfoBox', infoBoxDirective);
+
+    infoBoxDirective.$inject = [];
+
+    function infoBoxDirective() {
+        return {
+            restrict: 'A',
+            templateUrl: 'src/app/yangman/views/directives/ym-info-box.tpl.html',
+            transclude: true,
+            scope: {
+                node: '=',
+            },
+            link: function (scope, element) {
+                element.addClass('info-box-container');
+            },
+            controller: function ($scope) {
+                var description = $scope.node.getChildren('description', null, null, 'label')[0];
+
+                $scope.description = description ? description : '';
+                $scope.infoBox = false;
+
+                // methods
+                $scope.dividerCheck = dividerCheck;
+                $scope.executeInfoBox = executeInfoBox;
+                $scope.showBoxCheck = showBoxCheck;
+
+                /**
+                 * Set info box value - true, false
+                 * @param value
+                 */
+                function executeInfoBox(value){
+                    $scope.infoBox = value;
+                }
+
+                /**
+                 * Check if box info could be shown
+                 * @returns {boolean|*}
+                 */
+                function showBoxCheck(){
+                    return $scope.infoBox && ($scope.description.length || $scope.node.augmentationId);
+                }
+
+                /**
+                 * Check for showing divider between different shown info
+                 * @param key
+                 * @returns {*}
+                 */
+                function dividerCheck(key){
+                    return key ? $scope.description.length || $scope.node.augmentationId : $scope.description.length;
+                }
+            },
+        };
+    }
+});
index 83e917c7d6b8c026694db3114deb27a0c45354f2..6b86af468b0bb453663459a01ea9fb292084b454 100644 (file)
@@ -3,14 +3,17 @@ define([], function () {
 
     angular.module('app.yangman').service('YangmanDesignService', YangmanDesignService);
 
-    function YangmanDesignService(){
+    YangmanDesignService.$inject = ['$timeout'];
+
+    function YangmanDesignService($timeout){
 
         var service = {
+            disableMdMenuItem: disableMdMenuItem,
+            enableMdMenuItem: enableMdMenuItem,
             hideMainMenu: hideMainMenu,
             setDraggableLeftPanel: setDraggableLeftPanel,
+            setJsonSplitter: setJsonSplitter,
             setModuleDetailHeight: setModuleDetailHeight,
-            disableMdMenuItem: disableMdMenuItem,
-            enableMdMenuItem: enableMdMenuItem,
         };
 
         return service;
@@ -83,7 +86,7 @@ define([], function () {
                 $('#left-panel').width(localStorage.getItem('yangman__left-panel-width'));
             }
 
-            $('.resizable-e').resizable({
+            $('.ym-resizable-e').resizable({
                 handles: 'e',
                 minWidth: 300,
                 stop: function(event, ui) {
@@ -97,6 +100,18 @@ define([], function () {
             });
         }
 
+        function setJsonSplitter(cbk){
+            $timeout(function () {
+                $('.ym-resizable-s').resizable({
+                    handles: 's',
+                    minHeight: 200,
+                    stop: function(event, ui) {
+                        cbk();
+                    }
+                });
+            });
+        }
+
         /**
          * Set module detail height
          * .yangmanModule__module-detail .tabs
index 203ef5519d4ff1e798276fd5b53296b3587954b7..ebd593b95adbfa6beb10469080bfbec6012779a1 100644 (file)
@@ -261,11 +261,12 @@ define([], function () {
             function finishExecuting(response){
                 // finish track time response
                 time.finished = new Date().getMilliseconds();
+                var spentRequestTime = time.finished - time.started;
 
                 return {
                     status: response.status,
                     statusText: response.statusText,
-                    time: (time.finished - time.started),
+                    time: spentRequestTime < 0 ? -(spentRequestTime) : spentRequestTime,
                     requestData: allPreparedData.reqData,
                     requestSrcData: allPreparedData.srcData,
                 };
index 723c1dd3e44e4778bd3ef379e96fe5fdeddb9b16..5a3a7c8caafe3eaabd61a2a48e27edf9bec0740e 100644 (file)
@@ -1,4 +1,4 @@
-<md-menu ng-if="isActionMenu() || isNodeInfo()" class="menu-container">
+<md-menu ng-if="isActionMenu()" class="menu-container">
     <!-- open menu button -->
     <md-button class="md-icon-button" ng-click="$mdOpenMenu($event); hideInfoBox();">
         <md-icon md-font-set="material-icons">reorder</md-icon>
             <md-icon md-font-set="material-icons">reorder</md-icon>
         </h5>
         <md-menu-divider></md-menu-divider>
-        <!-- node info -->
-        <section class="text-left icon-wrapper" ng-show="isNodeInfo()">
-            <md-icon md-font-set="material-icons" class="pointer" ng-show="node.isKey()">
-                vpn_key
-                <md-tooltip md-direction="top">
-                    {{'key of '+node.parent.label+' list'}}
-                </md-tooltip>
-            </md-icon>
-
-            <md-icon class="svg-icon pointer"
-                     md-svg-src="src/app/yangman/assets/images/icon-augment.svg"
-                     ng-show="node.augmentationId">
-                <md-tooltip md-direction="top">
-                    {{ 'YANGUI_IS_AUGMENT' | translate }} {{ node.augmentationId }}
-                </md-tooltip>
-            </md-icon>
-        </section>
-        <md-menu-divider ng-if="isActionMenu() && isNodeInfo()"></md-menu-divider>
-
-        <!-- description menu item -->
-        <md-menu-item ng-if="node.getChildren('description', null, null, 'label').length > 0">
-            <md-button ng-click="switchSection('description')" md-prevent-menu-close>
-                <md-icon md-font-set="material-icons">info</md-icon>
-                <span md-menu-align-target>{{'YANGMAN_EXPLAIN' | translate}}</span>
-            </md-button>
-        </md-menu-item>
 
         <!-- add list item -->
         <md-menu-item ng-if="addListItem">
                 </md-list>
             </div>
 
-            <!-- Description box -->
-            <div ng-switch-when="description" class="info-box__padding">
-                {{node.getChildren('description', null, null, 'label')[0]}}
-            </div>
-
             <!-- yang list items -->
             <div ng-switch-when="items">
                 <md-list>
diff --git a/modules/yangman-resources/src/main/resources/yangman/views/directives/ym-info-box.tpl.html b/modules/yangman-resources/src/main/resources/yangman/views/directives/ym-info-box.tpl.html
new file mode 100644 (file)
index 0000000..3b554cb
--- /dev/null
@@ -0,0 +1,20 @@
+<span ng-mouseenter="executeInfoBox(true)" ng-mouseleave="executeInfoBox(false)" class="info-box-container__hover-wrapper">
+    <span ng-transclude></span>
+
+    <div class="md-whiteframe-z2 info-box" ng-show="showBoxCheck()">
+        <div class="info-box__padding">
+            <!-- key -->
+            <span ng-show="node.isKey()">
+                {{'Key of ' + node.parent.label + ' list'}}
+                <md-menu-divider ng-show="dividerCheck(true)"></md-menu-divider>
+            </span>
+            <!-- augment -->
+            <span ng-show="node.augmentationId">
+                {{ 'YANGMAN_IS_AUGMENT' | translate }} "{{ node.augmentationId }}"
+                <md-menu-divider ng-show="dividerCheck()"></md-menu-divider>
+            </span>
+            <!-- description -->
+            <span ng-show="description.length">{{description}}</span>
+        </div>
+    </div>
+</span>
index 82cddc605d8ff92793c0761c5f6c1b943941edda..04d3ee9354308a5e562420de1eac4c2ef9ddd7c4 100644 (file)
@@ -1,7 +1,7 @@
 <section class="yangmanModule" id="yangmanModule" layout="row">
 
     <!-- LEFT SIDE -->
-    <md-content layout="column" style="width: 400px; height: 100%;" class="yangmanModule__left-panel resizable-e" id="left-panel">
+    <md-content layout="column" style="width: 400px; height: 100%;" class="yangmanModule__left-panel ym-resizable-e" id="left-panel">
         <!-- module arrow button -->
         <md-icon md-font-set="material-icons "
                  class="arrow-switcher"
index 0247cc3dde7a352b9b485b6e9e5324b924b5708c..0933e7e4abe87b3f37eed364f78456bdbd79e581 100644 (file)
@@ -21,7 +21,8 @@
     <div ng-controller="RequestDataCtrl as requestData"
          ng-show="main.jsonView.sent"
          ng-init="requestData.init('SENT')"
-         ng-class="{'half-size': main.jsonView.received && main.jsonView.sent}">
+         ng-class="{'half-size': main.jsonView.received && main.jsonView.sent}"
+         class="ym-resizable-s">
 
         <h5>{{'YANGMAN_SENT_DATA' | translate}}</h5>
         <div md-whiteframe="2" ng-include src="globalViewPath + 'rightpanel/request-data.tpl.html'"></div>
@@ -31,7 +32,8 @@
     <div ng-controller="RequestDataCtrl as requestData"
          ng-show="main.jsonView.received"
          ng-init="requestData.init('RECEIVED')"
-         ng-class="{'half-size': main.jsonView.received && main.jsonView.sent}">
+         ng-class="{'half-size': main.jsonView.received && main.jsonView.sent}"
+         class="ym-resizable-s">
 
         <h5>{{'YANGMAN_RECEIVED_DATA' | translate}}</h5>
         <div md-whiteframe="2" ng-include src="globalViewPath + 'rightpanel/request-data.tpl.html'"></div>
index f573d0bb1ef22643c6f2fad503474dcdbb3bb93d..0fbefd3e2a9c992ee6086bc8dfaa635a99740b1b 100644 (file)
         </md-icon>
 
         <!-- Choice label -->
-        <p class="top-element" ng-click="yangChoice.toggleExpanded()"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
+        <p class="top-element" ym-info-box node="node" ng-click="yangChoice.toggleExpanded()"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
 
         <!-- Action menu -->
         <yang-form-menu is-action-menu="yangChoice.isActionMenu()"
                         augmentations="augmentations"
-                        is-node-info="yangChoice.isNodeInfo()"
                         node="node"></yang-form-menu>
 
         <!-- Choice select -->
index 5be5e64010c05035922bb1c37f6e7dfffcecdad6..efa1135d3416acb6d302455611ccf0e5b93f16f0 100644 (file)
         </md-icon>
 
         <!-- Container label -->
-        <p class="top-element pointer" ng-click="yangContainer.toggleExpanded()">
+        <p class="top-element pointer"
+           ng-click="yangContainer.toggleExpanded()" ym-info-box node="node">
+
             {{yangForm.getNodeName(node.localeLabel, node.label)}}
         </p>
 
         <!-- Action menu -->
         <yang-form-menu is-action-menu="yangContainer.isActionMenu()"
                         augmentations="augmentations"
-                        is-node-info="yangContainer.isNodeInfo()"
                         node="node"></yang-form-menu>
 
     </div>
index 26f15f11a5c98c1ae0779c99de46e2f9ac6ca6a4..c51dd93880088edc64aa584ca2256b10454563e8 100644 (file)
         </md-icon>
 
         <!-- Container label -->
-        <p class="top-element"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
+        <p class="top-element" ym-info-box node="node"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
 
         <!-- Action menu -->
         <yang-form-menu is-action-menu="yangInput.isActionMenu()"
                         augmentations="augmentations"
-                        is-node-info="yangInput.isNodeInfo()"
                         node="node"></yang-form-menu>
 
     </div>
index 19a875ddf37a8f02a8f50bf1db5f873a4854068b..f5bc82ca468d7ec48eac479f70464c5cedabfa41 100644 (file)
         </md-icon>
 
         <!-- Container label -->
-        <p class="top-element" ng-click="yangLeafList.toggleExpanded()"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
+        <p class="top-element" ng-click="yangLeafList.toggleExpanded()" ym-info-box node="node">
+            {{yangForm.getNodeName(node.localeLabel, node.label)}}
+        </p>
 
         <!-- Action menu -->
         <yang-form-menu is-action-menu="yangLeafList.isActionMenu()"
                         augmentations="augmentations"
-                        is-node-info="yangLeafList.isNodeInfo()"
                         add-list-item-func="yangLeafList.addListElem()"
                         add-list-item="true"
                         node="node"></yang-form-menu>
index de2a684e8280ff8649026ac12f6292b637148b56..f96b884f319be49b162a5d1cf9a6e2d3fd29a34f 100644 (file)
@@ -1,24 +1,23 @@
-<div ng-controller="LeafCtrl as yanfLeaf"
+<div ng-controller="LeafCtrl as yangLeaf"
      layout="row"
-     layout-align="start {{yanfLeaf.getLeafType() === 'union' ? 'start' : 'center'}}"
-     class="yangmanModule__right-panel__form__leaf-container">
+     layout-align="start {{yangLeaf.getLeafCentering()}}"
+     class="yangmanModule__right-panel__form__leaf-container {{yangLeaf.getLeafType()}}">
 
     <!-- Container label -->
-    <p class="top-element"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
+    <p class="top-element" ym-info-box node="node"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
 
     <!-- Action menu -->
-    <yang-form-menu is-action-menu="yanfLeaf.isActionMenu()"
+    <yang-form-menu is-action-menu="yangLeaf.isActionMenu()"
                     augmentations="augmentations"
-                    is-node-info="yanfLeaf.isNodeInfo()"
                     node="node"></yang-form-menu>
 
     <!-- Empty placeholder for better look -->
-    <div class="menu-placeholder" ng-if="!yanfLeaf.isActionMenu() && !yanfLeaf.isNodeInfo()"></div>
+    <div class="menu-placeholder" ng-if="!yangLeaf.isActionMenu() && !yangLeaf.isNodeInfo()"></div>
 
     <div ng-controller="TypeCtrl as yangType"
          ng-repeat="type in node.getChildren('type')"
-         ng-include="yangForm.viewPath + '/config/types/' + yanfLeaf.getLeafType() + '.tpl.html'"
-         {{yanfLeaf.getLeafType() === 'union' ? 'flex="grow"' : ''}}
+         ng-include="yangForm.viewPath + '/config/types/' + yangLeaf.getLeafType() + '.tpl.html'"
+         {{yangLeaf.getLeafType() === 'union' ? 'flex="grow"' : ''}}
          layout="row">
     </div>
 </div>
\ No newline at end of file
index 6e0f8ce7d95d40b82c066f01f415524c7cf4682a..3882c0d2ccf10353aefa9715eabf5ce65af1d5b0 100644 (file)
         </md-icon>
 
         <!-- list label -->
-        <p class="top-element pointer list-label" ng-click="yangList.toggleExpanded()">
+        <p class="top-element pointer list-label" ng-click="yangList.toggleExpanded()" ym-info-box node="node">
             {{yangForm.getNodeName(node.localeLabel, node.label)}}
         </p>
 
         <!-- Action menu -->
         <yang-form-menu is-action-menu="yangList.isActionMenu()"
                         augmentations="augmentations"
-                        is-node-info="yangList.isNodeInfo()"
                         add-list-item-func="yangList.addListElem()"
                         add-list-item="!yangList.disableAddingListElement"
                         yang-form="yangForm"
index 0e16be904e5043793075e63606e7fdb8ac18b87b..4f4b02e01d5f1b5565a197249345a86588364bf9 100644 (file)
         </md-icon>
 
         <!-- Container label -->
-        <p class="top-element"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
+        <p class="top-element" ym-info-box node="node"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
 
         <!-- Action menu -->
         <yang-form-menu is-action-menu="yangOutput.isActionMenu()"
                         augmentations="augmentations"
-                        is-node-info="yangOutput.isNodeInfo()"
                         node="node"></yang-form-menu>
 
     </div>
index f5433a3972be92d04f0f78fe75f89be6bf6315ea..bbc42a5fbecc80d976680d7b9a2034eb093d032c 100644 (file)
         </md-icon>
 
         <!-- Container label -->
-        <p class="top-element"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
+        <p class="top-element" ym-info-box node="node"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
 
         <!-- Action menu -->
         <yang-form-menu is-action-menu="yangRpc.isActionMenu()"
                         augmentations="augmentations"
-                        is-node-info="yangRpc.isNodeInfo()"
                         node="node"></yang-form-menu>
 
     </div>
index 465414535e27b7352d74aba45524e5c1abba69f1..0c95a5b3141c9f023ac0e6805f4c83f40ae84b92 100644 (file)
@@ -1,4 +1,10 @@
-<section ng-controller="TypeBitCtrl as yangTypeBit" layout="column">
+<section ng-controller="TypeBitCtrl as yangTypeBit"
+         layout="row"
+         flex="50"
+         class="md-whiteframe-z2 box-container"
+         layout-wrap
+         layout-padding>
+
     <md-checkbox ng-model="type.bitsValues[$index]"
                  ng-repeat="bit in type.getChildren('bit')"
                  ng-true-value="1"
index c2ebc99c41f17c143bc017334c2ec278f56dae4a..21c370541d99328eb702811d73b053ebd47fc2b8 100644 (file)
@@ -1,4 +1,10 @@
-<section ng-controller="TypeEmptyCtrl as yangTypeEmpty">
+<section ng-controller="TypeEmptyCtrl as yangTypeEmpty"
+         layout="row"
+         flex="50"
+         class="md-whiteframe-z2 box-container"
+         layout-wrap
+         layout-padding>
+
     <md-checkbox ng-model="type.emptyValue"
                  ng-true-value="1"
                  ng-false-value="0"
index d612e8116d9315cc487230f1931f381a66ed2a73..7a8ae664329190251d9f5b1dc881546497ea2080 100644 (file)
@@ -1,4 +1,4 @@
-<md-content flex="nogrow" md-whiteframe="2">
+<md-content flex="nogrow" md-whiteframe="2" class="box-container union">
     <md-tabs md-dynamic-height
              md-border-bottom
              md-no-pagination
index efb7e1de2973fe46284e95a0664782280da53b05..9f61b9d948e47580473dcdf286bbe6870942ab0d 100644 (file)
         </md-icon>
 
         <!-- Choice label -->
-        <p class="top-element" ng-click="yangChoice.toggleExpanded()"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
+        <p class="top-element" ym-info-box node="node" ng-click="yangChoice.toggleExpanded()">
+            {{yangForm.getNodeName(node.localeLabel, node.label)}}
+        </p>
 
         <!-- Action menu -->
         <yang-form-menu is-action-menu="yangChoice.isActionMenu()"
                         augmentations="augmentations"
-                        is-node-info="yangChoice.isNodeInfo()"
                         node="node"></yang-form-menu>
 
         <!-- Choice select -->
index c7dd8419ac664971ce7c0bb23d23c5e3df2797aa..814b5f83ff260a826a6c1e3bf6c5f0e0e34fac48 100644 (file)
         </md-icon>
 
         <!-- Container label -->
-        <p class="top-element pointer" ng-click="yangContainer.toggleExpanded()">
+        <p class="top-element pointer" ng-click="yangContainer.toggleExpanded()" ym-info-box node="node">
             {{yangForm.getNodeName(node.localeLabel, node.label)}}
         </p>
 
         <!-- Action menu -->
         <yang-form-menu is-action-menu="yangContainer.isActionMenu()"
                         augmentations="augmentations"
-                        is-node-info="yangContainer.isNodeInfo()"
                         node="node"></yang-form-menu>
 
     </div>
index 09f071c5c19912db857f46454ed62aa2ba3beaf2..7f178fea362d5cf477f56785623c6b94ef66f772 100644 (file)
         </md-icon>
 
         <!-- Container label -->
-        <p class="top-element"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
+        <p class="top-element" ym-info-box node="node"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
 
         <!-- Action menu -->
         <yang-form-menu is-action-menu="yangInput.isActionMenu()"
                         augmentations="augmentations"
-                        is-node-info="yangInput.isNodeInfo()"
                         node="node"></yang-form-menu>
 
     </div>
index deafae6dd5c7fd41ef6bb513074051cf815b54ef..c20e988d97fae5a5c00751fa1c2793ae3e385fbf 100644 (file)
         </md-icon>
 
         <!-- Container label -->
-        <p class="top-element" ng-click="yangLeafList.toggleExpanded()"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
+        <p class="top-element" ym-info-box node="node" ng-click="yangLeafList.toggleExpanded()">
+            {{yangForm.getNodeName(node.localeLabel, node.label)}}
+        </p>
 
         <!-- Action menu -->
         <yang-form-menu is-action-menu="yangLeafList.isActionMenu()"
                         augmentations="augmentations"
-                        is-node-info="yangLeafList.isNodeInfo()"
                         node="node"></yang-form-menu>
     </div>
 
index c8fa029a08b48c2760a0c7bfb0c42b61eaed9f05..9e0f79c9cd028d5b2448cc3f4ecc0ce0c2f4978a 100644 (file)
@@ -5,12 +5,11 @@
      ng-show="node.isFilled()">
 
     <!-- Container label -->
-    <p class="top-element"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
+    <p class="top-element" ym-info-box node="node"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
 
     <!-- Action menu -->
     <yang-form-menu is-action-menu="yanfLeaf.isActionMenu()"
                     augmentations="augmentations"
-                    is-node-info="yanfLeaf.isNodeInfo()"
                     node="node"></yang-form-menu>
 
     <!-- Empty placeholder for better look -->
index bf4af2e95789817acf31c594ff9c2bd5ba2959a9..c8cdd8bc977d4a946f37c340b79e1d3f5a2e9b49 100644 (file)
         </md-icon>
 
         <!-- list label -->
-        <p class="top-element pointer list-label" ng-click="yangList.toggleExpanded()">
+        <p class="top-element pointer list-label" ng-click="yangList.toggleExpanded()" ym-info-box node="node">
             {{yangForm.getNodeName(node.localeLabel, node.label)}}
         </p>
 
         <!-- Action menu -->
         <yang-form-menu is-action-menu="yangList.isActionMenu()"
                         augmentations="augmentations"
-                        is-node-info="yangList.isNodeInfo()"
                         yang-form="yangForm"
                         yang-list="yangList"
                         node="node"></yang-form-menu>
index 13e3ac48e2b6efcd5ef17c9c5fb2d57e3572856d..6b6a30426bf38dfcc2984472929fe371b54c9913 100644 (file)
         </md-icon>
 
         <!-- Container label -->
-        <p class="top-element"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
+        <p class="top-element" ym-info-box node="node"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
 
         <!-- Action menu -->
         <yang-form-menu is-action-menu="yangOutput.isActionMenu()"
                         augmentations="augmentations"
-                        is-node-info="yangOutput.isNodeInfo()"
                         node="node"></yang-form-menu>
 
     </div>
index 3ba957df7db7c7d1a1371f9db49cc5ba4b197e64..66424cf586bfd2869c9c34d2c308bf1ab4dd573d 100644 (file)
         </md-icon>
 
         <!-- Container label -->
-        <p class="top-element"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
+        <p class="top-element" ym-info-box node="node"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
 
         <!-- Action menu -->
         <yang-form-menu is-action-menu="yangRpc.isActionMenu()"
                         augmentations="augmentations"
-                        is-node-info="yangRpc.isNodeInfo()"
                         node="node"></yang-form-menu>
 
     </div>
index f5433a3972be92d04f0f78fe75f89be6bf6315ea..bbc42a5fbecc80d976680d7b9a2034eb093d032c 100644 (file)
         </md-icon>
 
         <!-- Container label -->
-        <p class="top-element"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
+        <p class="top-element" ym-info-box node="node"> {{yangForm.getNodeName(node.localeLabel, node.label)}} </p>
 
         <!-- Action menu -->
         <yang-form-menu is-action-menu="yangRpc.isActionMenu()"
                         augmentations="augmentations"
-                        is-node-info="yangRpc.isNodeInfo()"
                         node="node"></yang-form-menu>
 
     </div>
index d3d6bbbd15f17070b85b89d9b9158d7a528975fa..be00beea9b9072f16d1322d796c2cbc1b78cb171 100644 (file)
@@ -145,12 +145,72 @@ button{
     right: 0;
 }
 
+.info-box-container{
+    position: relative;
+
+    &__hover-wrapper{
+        display: inline-block;
+        width: 100%;
+    }
+
+    .info-box{
+        position: absolute;
+        left: 90%;
+        top: 0;
+        margin-left: 10px;
+        min-width: 300px;
+        padding: 0;
+        z-index: 10;
+        background: #fff;
+        -webkit-transition: all 150ms linear;
+        -moz-transition: all 150ms linear;
+        -ms-transition: all 150ms linear;
+        -o-transition: all 150ms linear;
+        transition: all 150ms linear;
+        opacity: 1;
+        max-height: 300px;
+        overflow-y: auto;
+        overflow-x: hidden;
+
+        &__padding{
+            padding: 16px;
+        }
+
+        &.ng-hide{
+            opacity: 0;
+        }
+
+        span{
+            color: @fontColor;
+        }
+    }
+
+    md-menu-divider{
+        margin-top: 4px;
+        margin-bottom: 4px;
+        height: 1px;
+        min-height: 1px;
+        max-height: 1px;
+        width: 100%;
+        background-color: @dataStoreListBorderColor;
+        display: block;
+    }
+}
+
 // yangman
 .yangmanModule{
     background-color: @appBackColor;
     color: @fontColor;
     height: 100%;
 
+    .ui-resizable-s{
+        height: 13px;
+    }
+
+    .box-container{
+        padding: 16px;
+        margin: 8px 0;
+    }
 
     /*.md-input{
         color: @inputColor;
@@ -432,7 +492,7 @@ button{
                 position: relative;
 
 
-                > div {
+                > div:not(.ui-resizable-handle) {
                     height: calc(~'100% - 25px');
                     overflow-y: auto;
                 }
@@ -458,7 +518,14 @@ button{
         }
 
         &__form{
+
+            .box-container.union{
+                padding: 0;
+            }
+
             .union-tabs{
+                margin: 8px 0;
+
                 md-content{
                     min-width: 250px;
                 }