You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ignite.apache.org by ak...@apache.org on 2015/08/13 03:10:06 UTC

[1/2] incubator-ignite git commit: IGNITE-843 WIP on tables.

Repository: incubator-ignite
Updated Branches:
  refs/heads/ignite-843 fe0507955 -> a9fd2676a


IGNITE-843 WIP on tables.


Project: http://git-wip-us.apache.org/repos/asf/incubator-ignite/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-ignite/commit/d81ab79a
Tree: http://git-wip-us.apache.org/repos/asf/incubator-ignite/tree/d81ab79a
Diff: http://git-wip-us.apache.org/repos/asf/incubator-ignite/diff/d81ab79a

Branch: refs/heads/ignite-843
Commit: d81ab79ab4f5d0f84eeef92d2f87ca4a9d8cf416
Parents: fe05079
Author: AKuznetsov <ak...@gridgain.com>
Authored: Wed Aug 12 21:28:53 2015 +0700
Committer: AKuznetsov <ak...@gridgain.com>
Committed: Wed Aug 12 21:28:53 2015 +0700

----------------------------------------------------------------------
 .../main/js/controllers/caches-controller.js    |   3 +-
 .../src/main/js/controllers/common-module.js    | 322 ++++++++++++-------
 .../main/js/controllers/metadata-controller.js  |   9 +-
 modules/control-center-web/src/main/js/db.js    |   2 +-
 .../control-center-web/src/main/js/package.json |   2 +-
 .../src/main/js/views/includes/controls.jade    |  26 +-
 6 files changed, 233 insertions(+), 131 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/d81ab79a/modules/control-center-web/src/main/js/controllers/caches-controller.js
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/controllers/caches-controller.js b/modules/control-center-web/src/main/js/controllers/caches-controller.js
index 6b9f1bf..5c6ee17 100644
--- a/modules/control-center-web/src/main/js/controllers/caches-controller.js
+++ b/modules/control-center-web/src/main/js/controllers/caches-controller.js
@@ -38,7 +38,6 @@ controlCenterModule.controller('cachesController', [
             $scope.tablePairSave = $table.tablePairSave;
             $scope.tablePairSaveVisible = $table.tablePairSaveVisible;
 
-            $scope.availableWidth = $common.availableWidth;
             $scope.compactJavaName = $common.compactJavaName;
 
             $scope.atomicities = $common.mkOptions(['ATOMIC', 'TRANSACTIONAL']);
@@ -147,7 +146,7 @@ controlCenterModule.controller('cachesController', [
                 return true;
             };
 
-            $scope.tablePairValid = function (item, field, keyCls, valCls, index) {
+            $scope.tablePairValid = function (item, field, index) {
                 if (!$common.isValidJavaClass('Indexed type key', keyCls, true))
                     return focusInvalidField(index, 'KeyIndexedType');
 

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/d81ab79a/modules/control-center-web/src/main/js/controllers/common-module.js
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/controllers/common-module.js b/modules/control-center-web/src/main/js/controllers/common-module.js
index 3aa17b0..7a22992 100644
--- a/modules/control-center-web/src/main/js/controllers/common-module.js
+++ b/modules/control-center-web/src/main/js/controllers/common-module.js
@@ -173,115 +173,212 @@ controlCenterModule.service('$common', [
         /**
          * Compact java full class name by max number of characters.
          *
-         * @param s Class name to cut.
-         * @param maxLength Max available width in characters.
-         * @returns {*} Compacted class name.
+         * @param names Array of class names to compact.
+         * @param nameLength Max available width in characters for simple name.
+         * @returns {*} Array of compacted class names.
          */
-        function compactByMaxCharts(s, maxLength) {
-            if (s.length <= maxLength)
-                return s;
+        function compactByMaxCharts(names, nameLength) {
+            for (var nameIx = 0; nameIx < names.length; nameIx ++) {
+                var s = names[nameIx];
 
-            var totalLength = s.length;
+                if (s.length > nameLength) {
+                    var totalLength = s.length;
 
-            var packages = s.split('.');
+                    var packages = s.split('.');
 
-            var packageCnt = packages.length - 1;
+                    var packageCnt = packages.length - 1;
 
-            for (var i = 0; i < packageCnt && totalLength > maxLength; i++) {
-                if (packages[i].length > 0) {
-                    totalLength -= packages[i].length - 1;
+                    for (var i = 0; i < packageCnt && totalLength > nameLength; i++) {
+                        if (packages[i].length > 0) {
+                            totalLength -= packages[i].length - 1;
 
-                    packages[i] = packages[i][0];
-                }
-            }
+                            packages[i] = packages[i][0];
+                        }
+                    }
 
-            if (totalLength > maxLength) {
-                var className = packages[packageCnt];
+                    if (totalLength > nameLength) {
+                        var className = packages[packageCnt];
 
-                var classNameLen = className.length;
+                        var classNameLen = className.length;
 
-                var remains = Math.min(maxLength - totalLength + classNameLen, classNameLen);
+                        var remains = Math.min(nameLength - totalLength + classNameLen, classNameLen);
 
-                if (remains < 3)
-                    remains = Math.min(3, classNameLen);
+                        if (remains < 3)
+                            remains = Math.min(3, classNameLen);
 
-                packages[packageCnt] = className.substring(0, remains) + '...';
-            }
+                        packages[packageCnt] = className.substring(0, remains) + '...';
+                    }
 
-            var result = packages[0];
+                    var result = packages[0];
 
-            for (i = 1; i < packages.length; i++)
-                result += '.' + packages[i];
+                    for (i = 1; i < packages.length; i++)
+                        result += '.' + packages[i];
 
-            return result
+                    names[nameIx] = result;
+                }
+            }
+
+            return names
         }
 
         /**
          * Compact java full class name by max number of pixels.
          *
-         * @param s Class name to cut.
-         * @param maxWidth Maximum available width in pixels.
-         * @returns {*} Compacted class name.
+         * @param names Array of class names to compact.
+         * @param nameLength Max available width in characters for simple name. Used for calculation optimization.
+         * @param nameWidth Maximum available width in pixels for simple name.
+         * @returns {*} Array of compacted class names.
          */
-        function compactByMaxPixels(s, maxWidth) {
-            var totalLength = measureText(s);
+        function compactByMaxPixels(names, nameLength, nameWidth) {
+            if (nameWidth <= 0)
+                return names;
+
+            var fitted = [];
+
+            var widthByName = [];
 
-            if (totalLength <= maxWidth)
-                return s;
+            var len = names.length;
 
-            var packages = s.split('.');
+            var divideTo = len;
 
-            var packageCnt = packages.length - 1;
+            for (var nameIx = 0; nameIx < len; nameIx ++) {
+                fitted[nameIx] = false;
 
-            for (var i = 0; i < packageCnt && totalLength > maxWidth; i++) {
-                if (packages[i].length > 1) {
-                    totalLength -= measureText(packages[i].substring(2, packages[i].length));
+                widthByName[nameIx] = nameWidth;
+            }
+
+            // Try to distribute space from short class names to long class names.
+            do {
+                var remains = 0;
+
+                for (nameIx = 0; nameIx < len; nameIx++) {
+                    if (!fitted[nameIx]) {
+                        var curNameWidth = measureText(names[nameIx]);
+
+                        if (widthByName[nameIx] > curNameWidth) {
+                            fitted[nameIx] = true;
+
+                            remains += widthByName[nameIx] - curNameWidth;
 
-                    packages[i] = packages[i][0];
+                            divideTo -= 1;
+
+                            widthByName[nameIx] = curNameWidth;
+                        }
+                    }
+                }
+
+                var remainsByName = remains / divideTo;
+
+                for (nameIx = 0; nameIx < len; nameIx++) {
+                    if (!fitted[nameIx]) {
+                        widthByName[nameIx] += remainsByName;
+                    }
                 }
             }
+            while(remains > 0);
 
-            var shortPackage = '';
+            // Compact class names to available for each space.
+            for (nameIx = 0; nameIx < len; nameIx ++) {
+                var s = names[nameIx];
 
-            for (i = 0; i < packageCnt; i++)
-                shortPackage += packages[i] + '.';
+                if (s.length > (nameLength / 2) | 0) {
+                    var totalWidth = measureText(s);
 
-            var className = packages[packageCnt];
+                    if (totalWidth > widthByName[nameIx]) {
+                        var packages = s.split('.');
 
-            var classLen = className.length;
+                        var packageCnt = packages.length - 1;
 
-            var minLen = Math.min(classLen, 3);
+                        for (var i = 0; i < packageCnt && totalWidth > widthByName[nameIx]; i++) {
+                            if (packages[i].length > 1) {
+                                totalWidth -= measureText(packages[i].substring(1, packages[i].length));
 
-            totalLength = measureText(shortPackage + className);
+                                packages[i] = packages[i][0];
+                            }
+                        }
 
-            // Compact class name if shorten package path is very long.
-            if (totalLength > maxWidth) {
-                var maxLen = classLen;
+                        var shortPackage = '';
 
-                var middleLen = (minLen + (maxLen - minLen) / 2 ) | 0;
+                        for (i = 0; i < packageCnt; i++)
+                            shortPackage += packages[i] + '.';
 
-                var minLenPx = measureText(shortPackage + className.substr(0, minLen) + '...');
-                var maxLenPx = totalLength;
+                        var className = packages[packageCnt];
 
-                while (middleLen != minLen && middleLen != maxLen) {
-                    var middleLenPx = measureText(shortPackage + className.substr(0, middleLen) + '...');
+                        var classLen = className.length;
 
-                    if (middleLenPx > maxWidth) {
-                        maxLen = middleLen;
-                        maxLenPx = middleLenPx;
-                    }
-                    else {
-                        minLen = middleLen;
-                        minLenPx = middleLenPx;
-                    }
+                        var minLen = Math.min(classLen, 3);
+
+                        totalWidth = measureText(shortPackage + className);
+
+                        // Compact class name if shorten package path is very long.
+                        if (totalWidth > widthByName[nameIx]) {
+                            var maxLen = classLen;
+
+                            var middleLen = (minLen + (maxLen - minLen) / 2 ) | 0;
+
+                            var minLenPx = measureText(shortPackage + className.substr(0, minLen) + '...');
+                            var maxLenPx = totalWidth;
+
+                            while (middleLen != minLen && middleLen != maxLen) {
+                                var middleLenPx = measureText(shortPackage + className.substr(0, middleLen) + '...');
+
+                                if (middleLenPx > widthByName[nameIx]) {
+                                    maxLen = middleLen;
+                                    maxLenPx = middleLenPx;
+                                }
+                                else {
+                                    minLen = middleLen;
+                                    minLenPx = middleLenPx;
+                                }
 
-                    middleLen = (minLen + (maxLen - minLen) / 2 ) | 0;
+                                middleLen = (minLen + (maxLen - minLen) / 2 ) | 0;
+                            }
+
+                            names[nameIx] = shortPackage + className.substring(0, middleLen) + '...';
+                        }
+                        else
+                            names[nameIx] = shortPackage + className;
+                    }
                 }
+            }
+
+            return names;
+        }
+
+        /**
+         * Calculate available width for text in link to edit element.
+         *
+         * @param index Showed index of element for calcuraion maximal width in pixel.
+         * @param id Id of contains link table.
+         * @returns {*[]} First element is length of class for single value, second element is length for pair vlaue.
+         */
+        function availableWidth(index, id) {
+            var divs = $($('#' + id).find('tr')[index - 1]).find('div');
+
+            var div = null;
+
+            var width = 0;
+
+            for (var divIx = 0; divIx < divs.length; divIx ++)
+                if (divs[divIx].className.length == 0 && (div == null ||  divs[divIx].childNodes.length > div.childNodes.length))
+                    div = divs[divIx];
+
+            if (div != null) {
+                width = div.clientWidth;
+
+                if (width > 0) {
+                    var children = div.childNodes;
+
+                    for (var i = 1; i < children.length; i++) {
+                        var child = children[i];
 
-                return shortPackage + className.substring(0, middleLen) + '...';
+                        if ('offsetWidth' in child)
+                            width -= $(children[i]).outerWidth(true);
+                    }
+                }
             }
 
-            return shortPackage + className;
+            return width | 0;
         }
 
         return {
@@ -373,46 +470,38 @@ controlCenterModule.service('$common', [
                 return true;
             },
             /**
-             * Calculate available width for text in link to edit element.
+             * Cut class name by width in pixel or width in symbol count.
              *
              * @param id Id of contains link table.
-             * @returns {*[]} First element is length of class for single value, second element is length for pair vlaue.
+             * @param index Showed index of element.
+             * @param maxLength Maximum length in symbols for all names.
+             * @param names Array of class names to compact.
+             * @returns {*} Array of compacted class names.
              */
-            availableWidth: function (id) {
-                var div = $('#' + id).find('tr')[0];
-                var width = div.clientWidth;
+            compactJavaName: function (id, index, maxLength, names) {
+                var prefix = index + ') ';
 
-                if (width > 0) {
-                    var children = div.childNodes;
+                var nameCnt = names.length;
 
-                    for (var i = 1; i < children.length; i++) {
-                        var child = children[i];
+                var nameLength = ((maxLength - 3 * (nameCnt - 1)) / nameCnt) | 0;
 
-                        if ('offsetWidth' in child)
-                            width -= children[i].offsetWidth;
-                    }
-
-                    width -= measureText('99) ');
-                }
-
-                return [width | 0, (width > 0 ? (width - measureText(' / ')) / 2 | 0 : width) | 0];
-            },
-            /**
-             * Cut class name by width in pixel or width in symbol count.
-             *
-             * @param s Class name to cut.
-             * @param maxLength Maximum length in symbols.
-             * @param maxWidth Maximum length in pixels.
-             * @returns Cutted class name.
-             */
-            compactJavaName: function (s, maxLength, maxWidth) {
                 try {
+                    var nameWidth = (availableWidth(index, id) - measureText(prefix) - (nameCnt - 1) * measureText(' / ')) /
+                        nameCnt | 0;
+
                     // HTML5 calculation of showed message width.
-                    return compactByMaxPixels(s, maxWidth)
+                    names = compactByMaxPixels(names, nameLength, nameWidth);
                 }
                 catch (err) {
-                    return compactByMaxCharts(s, maxLength)
+                    names = compactByMaxCharts(names, nameLength);
                 }
+
+                var result = prefix + names[0];
+
+                for (var nameIx = 1; nameIx < names.length; nameIx ++)
+                    result += ' / ' + names[nameIx];
+
+                return result;
             },
             ensureActivePanel: function (panels, pnlIdx) {
                 if (panels) {
@@ -526,6 +615,14 @@ controlCenterModule.service('$table', [
             $focus((index < 0 ? 'new' : 'cur') + focusId);
         }
 
+        function _tableSimpleValue(filed, index) {
+            return index < 0 ? filed.newValue : filed.curValue;
+        }
+
+        function _tablePairValue(filed, index) {
+            return index < 0 ? {key: filed.newKey, value: filed.newValue} : {key: filed.curKey, value: filed.curValue};
+        }
+
         function _tableStartEdit(item, field, index) {
             _tableState(field.model, index);
 
@@ -596,7 +693,7 @@ controlCenterModule.service('$table', [
                 _model(item, field)[field.model].splice(index, 1);
             },
             tableSimpleSave: function (valueValid, item, field, index) {
-                var simpleValue = index < 0 ? field.newValue : field.curValue;
+                var simpleValue = _tableSimpleValue(field, index);
 
                 if (valueValid(item, field, simpleValue, index)) {
                     _tableReset();
@@ -621,8 +718,8 @@ controlCenterModule.service('$table', [
                     }
                 }
             },
-            tableSimpleSaveVisible: function (newValue) {
-                return !$common.isEmptyString(newValue);
+            tableSimpleSaveVisible: function (field, index) {
+                return !$common.isEmptyString(_tableSimpleValue(field, index));
             },
             tableSimpleUp: function (item, field, index) {
                 _tableReset();
@@ -637,26 +734,29 @@ controlCenterModule.service('$table', [
             tableSimpleDownVisible: function (item, field, index) {
                 return index < _model(item, field)[field.model].length - 1;
             },
-            tablePairSave: function (pairValid, item, field, newKey, newValue, index) {
-                if (pairValid(item, field, newKey, newValue, index)) {
-                    var pair = {};
+            tablePairValue: _tablePairValue,
+            tablePairSave: function (pairValid, item, field, index) {
+                if (pairValid(item, field, index)) {
+                    var pairValue = _tablePairValue(field, index);
+
+                    var pairModel = {};
 
                     if (index < 0) {
-                        pair[field.keyName] = newKey;
-                        pair[field.valueName] = newValue;
+                        pairModel[field.keyName] = pairValue.key;
+                        pairModel[field.valueName] = pairValue.value;
 
                         if (item[field.model])
-                            item[field.model].push(pair);
+                            item[field.model].push(pairModel);
                         else
-                            item[field.model] = [pair];
+                            item[field.model] = [pairModel];
 
                         _tableNewItem(field);
                     }
                     else {
-                        pair = item[field.model][index];
+                        pairModel = item[field.model][index];
 
-                        pair[field.keyName] = newKey;
-                        pair[field.valueName] = newValue;
+                        pairModel[field.keyName] = pairValue.key;
+                        pairModel[field.valueName] = pairValue.value;
 
                         if (index < item[field.model].length - 1)
                             _tableStartEdit(item, field, index + 1);
@@ -665,8 +765,10 @@ controlCenterModule.service('$table', [
                     }
                 }
             },
-            tablePairSaveVisible: function (newKey, newValue) {
-                return !$common.isEmptyString(newKey) && !$common.isEmptyString(newValue);
+            tablePairSaveVisible: function (field, index) {
+                var pairValue = _tablePairValue(field, index);
+
+                return !$common.isEmptyString(pairValue.key) && !$common.isEmptyString(pairValue.value);
             }
         }
     }]);

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/d81ab79a/modules/control-center-web/src/main/js/controllers/metadata-controller.js
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/controllers/metadata-controller.js b/modules/control-center-web/src/main/js/controllers/metadata-controller.js
index dcfd5e4..c5a3019 100644
--- a/modules/control-center-web/src/main/js/controllers/metadata-controller.js
+++ b/modules/control-center-web/src/main/js/controllers/metadata-controller.js
@@ -39,7 +39,6 @@ controlCenterModule.controller('metadataController', [
             $scope.tablePairSave = $table.tablePairSave;
             $scope.tablePairSaveVisible = $table.tablePairSaveVisible;
 
-            $scope.availableWidth = $common.availableWidth;
             $scope.compactJavaName = $common.compactJavaName;
 
             $scope.databases = [
@@ -455,18 +454,20 @@ controlCenterModule.controller('metadataController', [
                 descendingFields: {msg: 'Descending field class', id: 'DescField'}
             };
 
-            $scope.tablePairValid = function (item, field, name, clsName, index) {
+            $scope.tablePairValid = function (item, field, index) {
                 var pairField = pairFields[field.model];
 
+                var pairValue = $table.tablePairValue(field, index);
+
                 if (pairField) {
-                    if (!$common.isValidJavaClass(pairField.msg, clsName, true))
+                    if (!$common.isValidJavaClass(pairField.msg, pairValue.value, true))
                         return focusInvalidField(index, 'Value' + pairField.id);
 
                     var model = item[field.model];
 
                     if ($common.isDefined(model)) {
                         var idx = _.findIndex(model, function (pair) {
-                            return pair.name == name
+                            return pair.name == pairValue.name
                         });
 
                         // Found duplicate.

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/d81ab79a/modules/control-center-web/src/main/js/db.js
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/db.js b/modules/control-center-web/src/main/js/db.js
index 9aa61ac..0d53028 100644
--- a/modules/control-center-web/src/main/js/db.js
+++ b/modules/control-center-web/src/main/js/db.js
@@ -23,7 +23,7 @@ var mongoose = require('mongoose'),
     ObjectId = mongoose.Schema.Types.ObjectId,
     passportLocalMongoose = require('passport-local-mongoose');
 
-var deepPopulate = require('mongoose-deep-populate');
+var deepPopulate = require('mongoose-deep-populate')( mongoose);
 
 // Connect to mongoDB database.
 mongoose.connect(config.get('mongoDB:url'), {server: {poolSize: 4}});

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/d81ab79a/modules/control-center-web/src/main/js/package.json
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/package.json b/modules/control-center-web/src/main/js/package.json
index ce74ac9..b230a36 100644
--- a/modules/control-center-web/src/main/js/package.json
+++ b/modules/control-center-web/src/main/js/package.json
@@ -32,7 +32,7 @@
     "jade": "~1.11.0",
     "lodash": "3.10.1",
     "mongoose": "^4.1.2",
-    "mongoose-deep-populate": "1.1.0",
+    "mongoose-deep-populate": "2.0.0",
     "nconf": "^0.7.2",
     "node-sass-middleware": "^0.9.0",
     "passport": "^0.2.1",

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/d81ab79a/modules/control-center-web/src/main/js/views/includes/controls.jade
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/views/includes/controls.jade b/modules/control-center-web/src/main/js/views/includes/controls.jade
index 5c97418..72167ba 100644
--- a/modules/control-center-web/src/main/js/views/includes/controls.jade
+++ b/modules/control-center-web/src/main/js/views/includes/controls.jade
@@ -53,10 +53,10 @@ mixin btn-remove(click, tip)
     i.tipField.fa.fa-remove(ng-click=click bs-tooltip=tip data-trigger='hover')
 
 mixin btn-up(show, click)
-    i.tipField.fa.fa-arrow-up(ng-show=show ng-click=click bs-tooltip data-title='Move item up')
+    i.tipField.fa.fa-arrow-up(ng-if=show ng-click=click bs-tooltip data-title='Move item up')
 
 mixin btn-down(show, click)
-    i.tipField.fa.fa-arrow-down(ng-show=show ng-click=click bs-tooltip data-title='Move item down')
+    i.tipField.fa.fa-arrow-down(ng-if=show ng-click=click bs-tooltip data-title='Move item down')
 
 mixin table-pair-edit(prefix, keyPlaceholder, valPlaceholder, keyJavaBuildInTypes, valueJavaBuildInTypes, focusId, index)
     -var keyModel = 'field.' + prefix + 'Key'
@@ -74,7 +74,7 @@ mixin table-pair-edit(prefix, keyPlaceholder, valPlaceholder, keyJavaBuildInType
                 input.form-control(id=keyFocusId enter-focus-next=valFocusId type='text' ng-model=keyModel placeholder=keyPlaceholder on-escape='tableReset()')
     .col-xs-6.col-sm-6.col-md-6
         -var arg = keyModel + ', ' + valModel
-        -var btnVisible = 'tablePairSaveVisible(field)'
+        -var btnVisible = 'tablePairSaveVisible(field, ' + index + ')'
         -var btnSave = 'tablePairSave(tablePairValid, backupItem, field, ' + index + ')'
         -var btnVisibleAndSave = btnVisible + ' && ' + btnSave
 
@@ -98,7 +98,7 @@ mixin table-pair(header, tblMdl, keyFld, valFld, keyPlaceholder, valPlaceholder,
                     tr(ng-repeat='item in #{tblMdl}')
                         td.col-sm-12
                             div(ng-show='!tableEditing(field, $index)')
-                                a.labelFormField(ng-click='tableStartEdit(backupItem, field, $index)') {{$index + 1}}) {{compactJavaName(item.#{keyFld}, 25, availableWidth(field.model)[1])}} / {{compactJavaName(item.#{valFld}, 25, availableWidth(field.model)[1])}}
+                                a.labelFormField(ng-click='tableStartEdit(backupItem, field, $index)') {{compactJavaName(field.model, $index + 1, 55, [item.#{keyFld}, item.#{valFld}])}}
                                 +btn-remove('tableRemove(backupItem, field, $index)', 'field.removeTip')
                             div(ng-if='tableEditing(field, $index)')
                                 +table-pair-edit('cur', keyPlaceholder, valPlaceholder, keyJavaBuildInTypes, valueJavaBuildInTypes, '{{::field.focusId}}', '$index')
@@ -165,14 +165,14 @@ mixin details-row
                                 +btn-up('detail.reordering && $index > 0', 'tableSimpleUp(backupItem, detail, $index)')
                             div(ng-if='tableEditing(detail, $index)')
                                 label.labelField {{$index + 1}})
-                                +btn-save('tableSimpleSaveVisible(curValue)', 'tableSimpleSave(tableSimpleValid, backupItem, detail, $index)')
+                                +btn-save('tableSimpleSaveVisible(detail, index)', 'tableSimpleSave(tableSimpleValid, backupItem, detail, $index)')
                                 .input-tip.form-group.has-feedback
                                     input.form-control(id='cur{{::detail.focusId}}' type='text' ng-model='detail.curValue' placeholder='{{::detail.placeholder}}' on-enter='tableSimpleSave(tableSimpleValid, backupItem, detail, $index)' on-escape='tableReset()')&attributes(customValidators)
                                     +ico-exclamation('{{detail.model}}.edit', 'ipaddress', 'Invalid address, see help for format description.')
             button.btn.btn-primary.fieldButton(ng-disabled='!newValue' ng-click='tableSimpleSave(tableSimpleValid, backupItem, detail, -1)') Add
             +tipField('detail.tip')
             .input-tip.form-group.has-feedback
-                input.form-control(id='new{{::detail.focusId}}' type='text' ng-model='detail.newValue' ng-focus='tableNewItem(detail)' placeholder='{{::detail.placeholder}}' on-enter='tableSimpleSave(tableSimpleValid, backupItem, newValue, -1)' on-escape='tableReset()')&attributes(customValidators)
+                input.form-control(id='new{{::detail.focusId}}' type='text' ng-model='detail.newValue' ng-focus='tableNewItem(detail)' placeholder='{{::detail.placeholder}}' on-enter='tableSimpleSave(tableSimpleValid, backupItem, field, -1)' on-escape='tableReset()')&attributes(customValidators)
                 +ico-exclamation('{{detail.model}}', 'ipaddress', 'Invalid address, see help for format description.')
         div(ng-switch-when='table-simple-with-border')&attributes(detailCommon)
             .group
@@ -343,23 +343,23 @@ mixin form-row-custom(lblClasses, fieldClasses, dataSource)
                     table.col-sm-12.links-edit(id='{{::field.model}}' st-table='#{fieldMdl}')
                         tbody
                             tr(ng-repeat='item in #{fieldMdl} track by $index')
-                                td
+                                td.col-sm-12
                                     div(ng-show='!tableEditing(field, $index)')
-                                        a.labelFormField(ng-click='tableStartEdit(backupItem, field, $index)') {{$index + 1}}) {{compactJavaName(item, 55, availableWidth(field.model)[0])}}
+                                        a.labelFormField(ng-click='tableStartEdit(backupItem, field, $index)') {{compactJavaName(field.model, $index + 1, 55, [item])}}
                                         +btn-remove('tableRemove(backupItem, field, $index)', 'field.removeTip')
                                         +btn-down('field.reordering && tableSimpleDownVisible(backupItem, field, $index)', 'tableSimpleDown(backupItem, field, $index)')
                                         +btn-up('field.reordering && $index > 0', 'tableSimpleUp(backupItem, field, $index)')
                                     div(ng-if='tableEditing(field, $index)')
                                         label.labelField {{$index + 1}})
-                                        +btn-save('tableSimpleSaveVisible(field.curValue)', 'tableSimpleSave(tableSimpleValid, backupItem, field, $index)')
+                                        +btn-save('tableSimpleSaveVisible(field)', 'tableSimpleSave(tableSimpleValid, backupItem, field, $index)')
                                         .input-tip
-                                            input.form-control(id='cur{{::field.focusId}}' type='text' ng-model='field.curValue' placeholder='{{::field.placeholder}}' on-enter='tableSimpleSaveVisible(field.curValue) && tableSimpleSave(tableSimpleValid, backupItem, field, $index)' on-escape='tableReset()')
+                                            input.form-control(id='cur{{::field.focusId}}' type='text' ng-model='field.curValue' placeholder='{{::field.placeholder}}' on-enter='tableSimpleSaveVisible(field) && tableSimpleSave(tableSimpleValid, backupItem, field, $index)' on-escape='tableReset()')
                         tfoot(ng-show='tableNewItemActive(field)')
                             tr
-                                td
-                                    +btn-save('tableSimpleSaveVisible(field.newValue)', 'tableSimpleSave(tableSimpleValid, backupItem, field, -1)')
+                                td.col-sm-12
+                                    +btn-save('tableSimpleSaveVisible(field)', 'tableSimpleSave(tableSimpleValid, backupItem, field, -1)')
                                     .input-tip
-                                        input.form-control(id='new{{::field.focusId}}' type='text' ng-model='field.newValue' placeholder='{{::field.placeholder}}' on-enter='tableSimpleSaveVisible(field.newValue) && tableSimpleSave(tableSimpleValid, backupItem, field, -1)' on-escape='tableReset()')
+                                        input.form-control(id='new{{::field.focusId}}' type='text' ng-model='field.newValue' placeholder='{{::field.placeholder}}' on-enter='tableSimpleSaveVisible(field) && tableSimpleSave(tableSimpleValid, backupItem, field, -1)' on-escape='tableReset()')
         .section(ng-switch-when='indexedTypes')
             +table-pair('Index key-value type pairs', fieldMdl, 'keyClass', 'valueClass', 'Key class full name', 'Value class full name', true, true)
         div(ng-switch-when='queryFieldsFirst' ng-hide=fieldHide)


[2/2] incubator-ignite git commit: IGNITE-843 WIP on tables.

Posted by ak...@apache.org.
IGNITE-843 WIP on tables.


Project: http://git-wip-us.apache.org/repos/asf/incubator-ignite/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-ignite/commit/a9fd2676
Tree: http://git-wip-us.apache.org/repos/asf/incubator-ignite/tree/a9fd2676
Diff: http://git-wip-us.apache.org/repos/asf/incubator-ignite/diff/a9fd2676

Branch: refs/heads/ignite-843
Commit: a9fd2676aceea239dad22b6876b96386ff35adf6
Parents: d81ab79
Author: AKuznetsov <ak...@gridgain.com>
Authored: Thu Aug 13 08:10:00 2015 +0700
Committer: AKuznetsov <ak...@gridgain.com>
Committed: Thu Aug 13 08:10:00 2015 +0700

----------------------------------------------------------------------
 .../main/js/controllers/caches-controller.js    |   8 +-
 .../main/js/controllers/clusters-controller.js  |   4 +-
 .../src/main/js/controllers/common-module.js    |  25 ++-
 .../main/js/controllers/metadata-controller.js  | 162 +++++++------------
 .../main/js/controllers/models/clusters.json    |   8 +-
 .../src/main/js/views/includes/controls.jade    | 103 ++++++------
 6 files changed, 139 insertions(+), 171 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/a9fd2676/modules/control-center-web/src/main/js/controllers/caches-controller.js
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/controllers/caches-controller.js b/modules/control-center-web/src/main/js/controllers/caches-controller.js
index 5c6ee17..bf1149b 100644
--- a/modules/control-center-web/src/main/js/controllers/caches-controller.js
+++ b/modules/control-center-web/src/main/js/controllers/caches-controller.js
@@ -147,17 +147,19 @@ controlCenterModule.controller('cachesController', [
             };
 
             $scope.tablePairValid = function (item, field, index) {
-                if (!$common.isValidJavaClass('Indexed type key', keyCls, true))
+                var pairValue = $table.tablePairValue(field, index);
+
+                if (!$common.isValidJavaClass('Indexed type key', pairValue.key, true))
                     return focusInvalidField(index, 'KeyIndexedType');
 
-                if (!$common.isValidJavaClass('Indexed type value', valCls, true))
+                if (!$common.isValidJavaClass('Indexed type value', pairValue.value, true))
                     return focusInvalidField(index, 'ValueIndexedType');
 
                 var model = item[field.model];
 
                 if ($common.isDefined(model)) {
                     var idx = _.findIndex(model, function (pair) {
-                        return pair.keyClass == keyCls
+                        return pair.keyClass == pairValue.key
                     });
 
                     // Found duplicate.

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/a9fd2676/modules/control-center-web/src/main/js/controllers/clusters-controller.js
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/controllers/clusters-controller.js b/modules/control-center-web/src/main/js/controllers/clusters-controller.js
index 0ea68a1..bc97aa9 100644
--- a/modules/control-center-web/src/main/js/controllers/clusters-controller.js
+++ b/modules/control-center-web/src/main/js/controllers/clusters-controller.js
@@ -171,8 +171,8 @@ controlCenterModule.controller('clustersController', ['$scope', '$http', '$commo
                             // Remove deleted caches.
                             restoredItem.caches = _.filter(restoredItem.caches, function (cacheId) {
                                 return _.findIndex($scope.caches, function (scopeCache) {
-                                    return scopeCache.value == cacheId;
-                                }) >= 0;
+                                        return scopeCache.value == cacheId;
+                                    }) >= 0;
                             });
 
                             $scope.selectedItem = $scope.clusters[idx];

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/a9fd2676/modules/control-center-web/src/main/js/controllers/common-module.js
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/controllers/common-module.js b/modules/control-center-web/src/main/js/controllers/common-module.js
index 7a22992..f7abf0c 100644
--- a/modules/control-center-web/src/main/js/controllers/common-module.js
+++ b/modules/control-center-web/src/main/js/controllers/common-module.js
@@ -662,14 +662,31 @@ controlCenterModule.service('$table', [
 
             var ui = _tableUI(field);
 
-            if (ui == 'table-simple')
+            if (ui == 'table-simple') {
+                field.newValue = null;
+
                 _tableFocus(field.focusId, -1);
-            else if (ui == 'table-pair')
+            }
+            else if (ui == 'table-pair') {
+                field.newKey = null;
+                field.newValue = null;
+
                 _tableFocus('Key' + field.focusId, -1);
-            else if (ui == 'table-db-fields')
+            }
+            else if (ui == 'table-db-fields') {
+                field.newDatabaseName = null;
+                field.newDatabaseType = null;
+                field.newJavaName = null;
+                field.newJavaType = null;
+
                 _tableFocus('DatabaseName' + field.focusId, -1);
-            else if (ui == 'table-query-groups')
+            }
+            else if (ui == 'table-query-groups') {
+                field.newGroupName = null;
+                field.newFields = null;
+
                 _tableFocus('GroupName', -1);
+            }
         }
 
         return {

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/a9fd2676/modules/control-center-web/src/main/js/controllers/metadata-controller.js
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/controllers/metadata-controller.js b/modules/control-center-web/src/main/js/controllers/metadata-controller.js
index c5a3019..7becb73 100644
--- a/modules/control-center-web/src/main/js/controllers/metadata-controller.js
+++ b/modules/control-center-web/src/main/js/controllers/metadata-controller.js
@@ -148,7 +148,7 @@ controlCenterModule.controller('metadataController', [
             $scope.loadMeta = {action: 'connect'};
             $scope.loadMeta.tables = [];
 
-            $scope.loadMeta.selectAll = function() {
+            $scope.loadMeta.selectAll = function () {
                 var allSelected = $scope.loadMeta.allSelected;
 
                 _.forEach($scope.loadMeta.tables, function (table) {
@@ -467,7 +467,7 @@ controlCenterModule.controller('metadataController', [
 
                     if ($common.isDefined(model)) {
                         var idx = _.findIndex(model, function (pair) {
-                            return pair.name == pairValue.name
+                            return pair.name == pairValue.key
                         });
 
                         // Found duplicate.
@@ -490,8 +490,7 @@ controlCenterModule.controller('metadataController', [
                 var javaName = isNew ? field.newJavaName : field.curJavaName;
                 var javaType = isNew ? field.newJavaType : field.curJavaType;
 
-                return !$common.isEmptyString(databaseName) && $common.isDefined(databaseType) &&
-                    !$common.isEmptyString(javaName) && $common.isDefined(javaType);
+                return !$common.isEmptyString(databaseName) && $common.isDefined(databaseType) && !$common.isEmptyString(javaName) && $common.isDefined(javaType);
             };
 
             var dbFields = {
@@ -562,11 +561,17 @@ controlCenterModule.controller('metadataController', [
                 }
             };
 
-            $scope.tableGroupSaveVisible = function (group) {
-                return !$common.isEmptyString(group);
+            function tableGroupValue(field, index) {
+                return index < 0 ? field.newGroupName : field.curGroupName;
+            }
+
+            $scope.tableGroupSaveVisible = function (field, index) {
+                return !$common.isEmptyString(tableGroupValue(field, index));
             };
 
-            function tableGroupValid(groupName, index) {
+            $scope.tableGroupSave = function (field, index) {
+                var groupName = tableGroupValue(field, index);
+
                 var groups = $scope.backupItem.groups;
 
                 if ($common.isDefined(groups)) {
@@ -582,26 +587,20 @@ controlCenterModule.controller('metadataController', [
                     }
                 }
 
-                return true;
-            }
-
-            $scope.tableGroupSave = function (groupName, index) {
-                if (tableGroupValid(groupName, index)) {
-                    $table.tableReset();
+                $table.tableReset();
 
-                    var item = $scope.backupItem;
+                var item = $scope.backupItem;
 
-                    if (index < 0) {
-                        var newGroup = {name: groupName};
+                if (index < 0) {
+                    var newGroup = {name: groupName};
 
-                        if (item.groups)
-                            item.groups.push(newGroup);
-                        else
-                            item.groups = [newGroup];
-                    }
+                    if (item.groups)
+                        item.groups.push(newGroup);
                     else
-                        item.groups[index].name = groupName;
+                        item.groups = [newGroup];
                 }
+                else
+                    item.groups[index].name = groupName;
             };
 
             $scope.tableGroupNewItem = function (groupIndex) {
@@ -639,27 +638,45 @@ controlCenterModule.controller('metadataController', [
                 return false;
             };
 
-            $scope.tableGroupItemStartEdit = function (groupIndex, index) {
+            function tableGroupItemValue(field, index) {
+                return index < 0
+                    ? {name: field.newFieldName, className: field.newClassName, direction: field.newDirection}
+                    : {name: field.curFieldName, className: field.curClassName, direction: field.curDirection};
+            }
+
+            $scope.tableGroupItemStartEdit = function (field, groupIndex, index) {
                 var groups = $scope.backupItem.groups;
 
-                $table.tableState(groups[groupIndex].name, index);
+                var group = groups[groupIndex];
+
+                $table.tableState(group.name, index);
+
+                var groupItem = group.fields[index];
 
-                return groups[groupIndex].fields[index];
+                field.curFieldName = groupItem.name;
+                field.curClassName = groupItem.className;
+                field.curDirection = groupItem.direction;
+
+                $focus('curFieldName');
             };
 
-            $scope.tableGroupItemSaveVisible = function (fieldName, className) {
-                return !$common.isEmptyString(fieldName) && !$common.isEmptyString(className);
+            $scope.tableGroupItemSaveVisible = function (field, index) {
+                var groupItemValue = tableGroupItemValue(field, index);
+
+                return !$common.isEmptyString(groupItemValue.name) && !$common.isEmptyString(groupItemValue.className);
             };
 
-            function tableGroupItemValid(fieldName, className, groupIndex, index) {
-                if (!$common.isValidJavaClass('Group field', className, true))
-                    return focusInvalidField(index, 'FieldClassName');
+            $scope.tableGroupItemSave = function (field, groupIndex, index) {
+                var groupItemValue = tableGroupItemValue(field, index);
+
+                if (!$common.isValidJavaClass('Group field', groupItemValue.className, true))
+                    return focusInvalidField(index, 'ClassName');
 
                 var fields = $scope.backupItem.groups[groupIndex].fields;
 
                 if ($common.isDefined(fields)) {
                     var idx = _.findIndex(fields, function (field) {
-                        return field.name == fieldName;
+                        return field.name == groupItemValue.name;
                     });
 
                     // Found duplicate.
@@ -670,30 +687,22 @@ controlCenterModule.controller('metadataController', [
                     }
                 }
 
-                return true;
-            }
-
-            $scope.tableGroupItemSave = function (fieldName, className, direction, groupIndex, index) {
-                if (tableGroupItemValid(fieldName, className, groupIndex, index)) {
-                    $table.tableReset();
-
-                    var group = $scope.backupItem.groups[groupIndex];
+                $table.tableReset();
 
-                    if (index < 0) {
-                        var newGroupItem = {name: fieldName, className: className, direction: direction};
+                var group = $scope.backupItem.groups[groupIndex];
 
-                        if (group.fields)
-                            group.fields.push(newGroupItem);
-                        else
-                            group.fields = [newGroupItem];
-                    }
-                    else {
-                        var groupItem = group.fields[index];
+                if (index < 0) {
+                    if (group.fields)
+                        group.fields.push(groupItemValue);
+                    else
+                        group.fields = [groupItemValue];
+                }
+                else {
+                    var groupItem = group.fields[index];
 
-                        groupItem.name = fieldName;
-                        groupItem.className = className;
-                        groupItem.direction = direction;
-                    }
+                    groupItem.name = groupItemValue.name;
+                    groupItem.className = groupItemValue.className;
+                    groupItem.direction = groupItemValue.direction;
                 }
             };
 
@@ -702,52 +711,5 @@ controlCenterModule.controller('metadataController', [
 
                 group.fields.splice(index, 1);
             };
-
-            //$scope.selectSchema = function (idx) {
-            //    var data = $scope.data;
-            //    var tables = data.tables;
-            //    var schemaName = tables[idx].schemaName;
-            //    var use = tables[idx].use;
-            //
-            //    for (var i = idx + 1; i < tables.length; i++) {
-            //        var item = tables[i];
-            //
-            //        if (item.schemaName == schemaName && item.tableName)
-            //            item.use = use;
-            //        else
-            //            break;
-            //    }
-            //
-            //    data.curTableIdx = -1;
-            //    data.curFieldIdx = -1;
-            //};
-
-            //$scope.selectTable = function (idx) {
-            //    var data = $scope.data;
-            //
-            //    data.curTableIdx = idx;
-            //    data.curFieldIdx = -1;
-            //
-            //    if (idx >= 0) {
-            //        var tbl = data.tables[idx];
-            //
-            //        data.curKeyClass = tbl.keyClass;
-            //        data.curValueClass = tbl.valueClass;
-            //    }
-            //};
-            //
-            //$scope.selectField = function (idx) {
-            //    var data = $scope.data;
-            //
-            //    data.curFieldIdx = idx;
-            //
-            //    if (idx >= 0) {
-            //        var fld = data.tables[data.curTableIdx].fields[idx];
-            //
-            //        data.curJavaName = fld.javaName;
-            //        data.curJavaType = fld.javaType;
-            //    }
-            //};
         }]
-)
-;
+);

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/a9fd2676/modules/control-center-web/src/main/js/controllers/models/clusters.json
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/controllers/models/clusters.json b/modules/control-center-web/src/main/js/controllers/models/clusters.json
index 31e5553..399d3e9 100644
--- a/modules/control-center-web/src/main/js/controllers/models/clusters.json
+++ b/modules/control-center-web/src/main/js/controllers/models/clusters.json
@@ -62,6 +62,7 @@
           "expanded": true,
           "fields": [
             {
+              "label": "Addresses",
               "type": "table-simple",
               "path": "discovery.Vm",
               "model": "addresses",
@@ -71,7 +72,7 @@
               "focusId": "IpAddress",
               "addTip": "Add new address.",
               "removeTip": "Remove address.",
-              "tip": [
+              "tableTip": [
                 "Addresses may be represented as follows:",
                 "<ul>",
                 "  <li>IP address (e.g. 127.0.0.1, 9.9.9.9, etc);</li>",
@@ -214,8 +215,7 @@
             },
             {
               "label": "Regions",
-              "ui": "table-simple",
-              "type": "table-simple-with-border",
+              "type": "table-simple",
               "path": "discovery.Cloud",
               "model": "regions",
               "placeholder": "Region name",
@@ -234,7 +234,7 @@
             {
               "label": "Zones",
               "ui": "table-simple",
-              "type": "table-simple-with-border",
+              "type": "table-simple",
               "path": "discovery.Cloud",
               "model": "zones",
               "placeholder": "Zone name",

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/a9fd2676/modules/control-center-web/src/main/js/views/includes/controls.jade
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/views/includes/controls.jade b/modules/control-center-web/src/main/js/views/includes/controls.jade
index 72167ba..648edc9 100644
--- a/modules/control-center-web/src/main/js/views/includes/controls.jade
+++ b/modules/control-center-web/src/main/js/views/includes/controls.jade
@@ -46,8 +46,8 @@ mixin group-tip(lines)
 mixin group-btn-add(click, tip)
     i.group-legend-btn.fa.fa-plus(ng-click=click bs-tooltip=tip)
 
-mixin btn-add2(click, tip, focusId)
-    i.tipField.fa.fa-plus(ng-click=click bs-tooltip=tip event-focus=focusId)
+mixin btn-add(click, tip)
+    i.tipField.fa.fa-plus(ng-click=click bs-tooltip=tip)
 
 mixin btn-remove(click, tip)
     i.tipField.fa.fa-remove(ng-click=click bs-tooltip=tip data-trigger='hover')
@@ -129,12 +129,12 @@ mixin details-row
                 +tipField('detail.tip')
                 .input-tip
                     input.form-control(type='text' placeholder='{{::detail.placeholder}}')&attributes(detailCommon)
-        div(ng-switch-when='number' )
+        div(ng-switch-when='number')
             label(class=lblDetailClasses ng-class='{required: detail.required}') {{::detail.label}}:
             .col-sm-8
                 +tipField('detail.tip')
                 .input-tip
-                    input.form-control(type='number' placeholder='{{::detail.placeholder}}' min='{{detail.min ? detail.min : 0}}' max='{{detail.max ? detail.max : Number.MAX_VALUE}}')&attributes(detailCommon)
+                    input.form-control(name='{{detail.model}}' type='number' placeholder='{{::detail.placeholder}}' min='{{detail.min ? detail.min : 0}}' max='{{detail.max ? detail.max : Number.MAX_VALUE}}')&attributes(detailCommon)
                     +ico-exclamation('{{detail.model}}', 'min', 'Value is less than allowable minimum.')
                     +ico-exclamation('{{detail.model}}', 'max', 'Value is more than allowable maximum.')
                     +ico-exclamation('{{detail.model}}', 'number', 'Invalid value. Only numbers allowed.')
@@ -150,56 +150,36 @@ mixin details-row
                 +tipField('detail.tip')
                 .input-tip
                     button.form-control(bs-select data-multiple='1' data-placeholder='{{::detail.placeholder}}' bs-options='item.value as item.label for item in {{detail.items}}')&attributes(detailCommon)
-        div(ng-switch-when='table-simple')&attributes(detailCommon)
-            div(ng-if='detail.label')
-                label {{::detail.label}}:
-                +tipLabel('detail.tableTip')
-            table.col-sm-12.links-edit-details(st-table='#{detailMdl}')
-                tbody
-                    tr(ng-repeat='item in #{detailMdl} track by $index')
-                        td
-                            div(ng-show='!tableEditing(detail, $index)')
-                                a.labelFormField(ng-click='tableStartEdit(backupItem, detail, $index)') {{$index + 1}}) {{item}}
-                                +btn-remove('tableRemove(backupItem, detail, $index)', 'detail.removeTip')
-                                +btn-down('detail.reordering && tableSimpleDownVisible(backupItem, detail, $index)', 'tableSimpleDown(backupItem, detail, $index)')
-                                +btn-up('detail.reordering && $index > 0', 'tableSimpleUp(backupItem, detail, $index)')
-                            div(ng-if='tableEditing(detail, $index)')
-                                label.labelField {{$index + 1}})
-                                +btn-save('tableSimpleSaveVisible(detail, index)', 'tableSimpleSave(tableSimpleValid, backupItem, detail, $index)')
-                                .input-tip.form-group.has-feedback
-                                    input.form-control(id='cur{{::detail.focusId}}' type='text' ng-model='detail.curValue' placeholder='{{::detail.placeholder}}' on-enter='tableSimpleSave(tableSimpleValid, backupItem, detail, $index)' on-escape='tableReset()')&attributes(customValidators)
-                                    +ico-exclamation('{{detail.model}}.edit', 'ipaddress', 'Invalid address, see help for format description.')
-            button.btn.btn-primary.fieldButton(ng-disabled='!newValue' ng-click='tableSimpleSave(tableSimpleValid, backupItem, detail, -1)') Add
-            +tipField('detail.tip')
-            .input-tip.form-group.has-feedback
-                input.form-control(id='new{{::detail.focusId}}' type='text' ng-model='detail.newValue' ng-focus='tableNewItem(detail)' placeholder='{{::detail.placeholder}}' on-enter='tableSimpleSave(tableSimpleValid, backupItem, field, -1)' on-escape='tableReset()')&attributes(customValidators)
-                +ico-exclamation('{{detail.model}}', 'ipaddress', 'Invalid address, see help for format description.')
-        div(ng-switch-when='table-simple-with-border')&attributes(detailCommon)
-            .group
+        .section(ng-switch-when='table-simple')&attributes(detailCommon)
+            .col-sm-12.group
                 .group-legend
                     label {{::detail.label}}:
                     +group-tip('detail.tableTip')
-                .group-content
+                    +group-btn-add('tableNewItem(detail)', 'detail.addTip')
+                .group-content-empty(ng-show='!((#{detailMdl} && #{detailMdl}.length > 0) || tableNewItemActive(detail))')
+                .group-content(ng-show='(#{detailMdl} && #{detailMdl}.length > 0) || tableNewItemActive(detail)')
                     table.col-sm-12.links-edit-details(st-table='#{detailMdl}')
                         tbody
                             tr(ng-repeat='item in #{detailMdl} track by $index')
                                 td
                                     div(ng-show='!tableEditing(detail, $index)')
-                                        a.labelFormField(ng-click='curValue = tableStartEdit(backupItem, detail, $index)') {{$index + 1}}) {{item}}
+                                        a.labelFormField(ng-click='tableStartEdit(backupItem, detail, $index)') {{$index + 1}}) {{item}}
                                         +btn-remove('tableRemove(backupItem, detail, $index)', 'detail.removeTip')
                                         +btn-down('detail.reordering && tableSimpleDownVisible(backupItem, detail, $index)', 'tableSimpleDown(backupItem, detail, $index)')
                                         +btn-up('detail.reordering && $index > 0', 'tableSimpleUp(backupItem, detail, $index)')
                                     div(ng-if='tableEditing(detail, $index)')
                                         label.labelField {{$index + 1}})
-                                        +btn-save('tableSimpleSaveVisible(curValue)', 'tableSimpleSave(tableSimpleValid, backupItem, detail, $index)')
+                                        +btn-save('tableSimpleSaveVisible(detail, index)', 'tableSimpleSave(tableSimpleValid, backupItem, detail, $index)')
                                         .input-tip.form-group.has-feedback
-                                            input.form-control(id='cur{{::detail.focusId}}' type='text' ng-model='detail.curValue' placeholder='{{::detail.placeholder}}' on-enter='tableSimpleSave(tableSimpleValid, backupItem, detail, $index)' on-escape='tableReset()')&attributes(customValidators)
+                                            input.form-control(id='cur{{::detail.focusId}}' name='{{detail.model}}.edit' type='text' ng-model='detail.curValue' placeholder='{{::detail.placeholder}}' on-enter='tableSimpleSaveVisible(detail, index) && tableSimpleSave(tableSimpleValid, backupItem, detail, $index)' on-escape='tableReset()')&attributes(customValidators)
                                             +ico-exclamation('{{detail.model}}.edit', 'ipaddress', 'Invalid address, see help for format description.')
-                    button.btn.btn-primary.fieldButton(ng-disabled='!newValue' ng-click='tableSimpleSave(tableSimpleValid, backupItem, detail, -1)') Add
-                    +tipField('detail.tip')
-                    .input-tip.form-group.has-feedback
-                        input.form-control(id='new{{::detail.focusId}}' type='text' ng-model='detail.newValue' ng-focus='tableNewItem(detail)' placeholder='{{::detail.placeholder}}' on-enter='tableSimpleSave(tableSimpleValid, backupItem, detail, -1)' on-escape='tableReset()')&attributes(customValidators)
-                        +ico-exclamation('{{detail.model}}', 'ipaddress', 'Invalid address, see help for format description.')
+                        tfoot(ng-show='tableNewItemActive(detail)')
+                            tr
+                                td.col-sm-12
+                                    +btn-save('tableSimpleSaveVisible(detail, -1)', 'tableSimpleSave(tableSimpleValid, backupItem, detail, -1)')
+                                    .input-tip.form-group.has-feedback
+                                        input.form-control(id='new{{::detail.focusId}}' name='{{detail.model}}' type='text' ng-model='detail.newValue' ng-focus='tableNewItem(detail)' placeholder='{{::detail.placeholder}}' on-enter='tableSimpleSaveVisible(detail, -1) && tableSimpleSave(tableSimpleValid, backupItem, detail, -1)' on-escape='tableReset()')&attributes(customValidators)
+                                        +ico-exclamation('{{detail.model}}', 'ipaddress', 'Invalid address, see help for format description.')
 
 mixin table-db-field-edit(prefix, focusId, index)
     -var databaseName = prefix + 'DatabaseName'
@@ -238,24 +218,31 @@ mixin table-db-field-edit(prefix, focusId, index)
         .input-tip
             select.form-control(id=javaTypeId ng-model=javaTypeModel ng-options='item.value as item.label for item in {{javaTypes}}' on-enter=btnVisibleAndSave on-escape='tableReset()')
 
-mixin table-group-item-edit(fieldName, className, direction, index)
-    -var args = fieldName + ', ' + className
-    -var btnVisible = 'tableGroupItemSaveVisible(' + args + ')'
-    -var btnSave = 'tableGroupItemSave(' + args + ', ' + direction + ', groupIndex, ' + index +')'
+mixin table-group-item-edit(prefix, index)
+    -var fieldName = prefix + 'FieldName'
+    -var className = prefix + 'ClassName'
+    -var direction = prefix + 'Direction'
+
+    -var fieldNameModel = 'field.' + fieldName
+    -var classNameModel = 'field.' + className
+    -var directionModel = 'field.' + direction
+
+    -var btnVisible = 'tableGroupItemSaveVisible(field, ' + index + ')'
+    -var btnSave = 'tableGroupItemSave(field, groupIndex, ' + index + ')'
     -var btnVisibleAndSave = btnVisible + ' && ' + btnSave
 
     .col-xs-4.col-sm-4.col-md-4
         label.fieldSep /
         .input-tip
-            input.form-control(id=fieldName enter-focus-next=className type='text' ng-model=fieldName placeholder='Field name' on-escape='tableReset()')
+            input.form-control(id=fieldName enter-focus-next=className type='text' ng-model=fieldNameModel placeholder='Field name' on-escape='tableReset()')
     .col-xs-5.col-sm-5.col-md-5
         label.fieldSep /
         .input-tip
-            input.form-control(id=className enter-focus-next=direction type='text' ng-model=className placeholder='Class name' bs-typeahead retain-selection data-min-length='1' bs-options='javaClass for javaClass in javaBuildInClasses' on-escape='tableReset()')
+            input.form-control(id=className enter-focus-next=direction type='text' ng-model=classNameModel placeholder='Class name' bs-typeahead retain-selection data-min-length='1' bs-options='javaClass for javaClass in javaBuildInClasses' on-escape='tableReset()')
     .col-xs-3.col-sm-3.col-md-3
         +btn-save(btnVisible, btnSave)
         .input-tip
-            select.form-control(id=direction ng-model=direction ng-options='item.value as item.label for item in {{sortDirections}}' on-enter=btnVisibleAndSave on-escape='tableReset()')
+            select.form-control(id=direction ng-model=directionModel ng-options='item.value as item.label for item in {{sortDirections}}' on-enter=btnVisibleAndSave on-escape='tableReset()')
 
 mixin form-row(dataSource)
     +form-row-custom(['col-xs-3 col-sm-2 col-md-2'], ['col-xs-6 col-sm-5 col-md-5'], dataSource)
@@ -297,7 +284,7 @@ mixin form-row-custom(lblClasses, fieldClasses, dataSource)
             div(class=fieldClasses)
                 +tipField('field.tip')
                 .input-tip
-                    input.form-control(type='number' placeholder='{{::field.placeholder}}' ng-focus='tableReset()' min='{{field.min ? field.min : 0}}' max='{{field.max ? field.max : Number.MAX_VALUE}}')&attributes(fieldCommon)
+                    input.form-control(name='{{field.model}}' type='number' placeholder='{{::field.placeholder}}' ng-focus='tableReset()' min='{{field.min ? field.min : 0}}' max='{{field.max ? field.max : Number.MAX_VALUE}}')&attributes(fieldCommon)
                     +ico-exclamation('{{field.model}}', 'min', 'Value is less than allowable minimum.')
                     +ico-exclamation('{{field.model}}', 'max', 'Value is more than allowable maximum.')
                     +ico-exclamation('{{field.model}}', 'number', 'Invalid value. Only numbers allowed.')
@@ -351,15 +338,15 @@ mixin form-row-custom(lblClasses, fieldClasses, dataSource)
                                         +btn-up('field.reordering && $index > 0', 'tableSimpleUp(backupItem, field, $index)')
                                     div(ng-if='tableEditing(field, $index)')
                                         label.labelField {{$index + 1}})
-                                        +btn-save('tableSimpleSaveVisible(field)', 'tableSimpleSave(tableSimpleValid, backupItem, field, $index)')
+                                        +btn-save('tableSimpleSaveVisible(field, $index)', 'tableSimpleSave(tableSimpleValid, backupItem, field, $index)')
                                         .input-tip
                                             input.form-control(id='cur{{::field.focusId}}' type='text' ng-model='field.curValue' placeholder='{{::field.placeholder}}' on-enter='tableSimpleSaveVisible(field) && tableSimpleSave(tableSimpleValid, backupItem, field, $index)' on-escape='tableReset()')
                         tfoot(ng-show='tableNewItemActive(field)')
                             tr
                                 td.col-sm-12
-                                    +btn-save('tableSimpleSaveVisible(field)', 'tableSimpleSave(tableSimpleValid, backupItem, field, -1)')
+                                    +btn-save('tableSimpleSaveVisible(field, -1)', 'tableSimpleSave(tableSimpleValid, backupItem, field, -1)')
                                     .input-tip
-                                        input.form-control(id='new{{::field.focusId}}' type='text' ng-model='field.newValue' placeholder='{{::field.placeholder}}' on-enter='tableSimpleSaveVisible(field) && tableSimpleSave(tableSimpleValid, backupItem, field, -1)' on-escape='tableReset()')
+                                        input.form-control(id='new{{::field.focusId}}' type='text' ng-model='field.newValue' placeholder='{{::field.placeholder}}' on-enter='tableSimpleSaveVisible(field, -1) && tableSimpleSave(tableSimpleValid, backupItem, field, -1)' on-escape='tableReset()')
         .section(ng-switch-when='indexedTypes')
             +table-pair('Index key-value type pairs', fieldMdl, 'keyClass', 'valueClass', 'Key class full name', 'Value class full name', true, true)
         div(ng-switch-when='queryFieldsFirst' ng-hide=fieldHide)
@@ -401,29 +388,29 @@ mixin form-row-custom(lblClasses, fieldClasses, dataSource)
                                     .col-sm-12(ng-show='!tableEditing(field, $index)')
                                         a.labelFormField(ng-click='tableStartEdit(backupItem, field, $index)') {{$index + 1}}) {{group.name}}
                                         +btn-remove('tableRemove(backupItem, field, $index)', 'field.removeTip')
-                                        +btn-add2('tableGroupNewItem($index)', 'field.addItemTip', 'newFieldName')
+                                        +btn-add('tableGroupNewItem($index)', 'field.addItemTip')
                                     div(ng-if='tableEditing(field, $index)')
                                         label.labelField {{$index + 1}})
-                                        +btn-save('tableGroupSaveVisible(curGroupName)', 'tableGroupSave(curGroupName, $index)')
+                                        +btn-save('tableGroupSaveVisible(field, $index)', 'tableGroupSave(field, $index)')
                                         .input-tip
-                                            input#curGroupName.form-control(type='text' ng-model='curGroupName' placeholder='Index name' on-enter='tableGroupSaveVisible(curGroupName) && tableGroupSave(curGroupName, $index)' on-escape='tableReset()')
+                                            input#curGroupName.form-control(type='text' ng-model='field.curGroupName' placeholder='Index name' on-enter='tableGroupSaveVisible(field, $index) && tableGroupSave(field, $index)' on-escape='tableReset()')
                                     .margin-left-dflt
                                         table.links-edit-sub.col-sm-12(st-table='group.fields' ng-init='groupIndex = $index')
                                             tbody
                                                 tr(ng-repeat='groupItem in group.fields')
                                                     td
                                                         div(ng-show='!tableGroupItemEditing(groupIndex, $index)')
-                                                            a.labelFormField(on-click-focus='curFieldName' ng-click='curGroupItem = tableGroupItemStartEdit(groupIndex, $index); curFieldName = curGroupItem.name; curClassName = curGroupItem.className; curDirection = curGroupItem.direction') {{$index + 1}}) {{groupItem.name}} / {{groupItem.className}} / {{groupItem.direction ? "DESC" : "ASC"}}
+                                                            a.labelFormField(ng-click='tableGroupItemStartEdit(field, groupIndex, $index)') {{$index + 1}}) {{groupItem.name}} / {{groupItem.className}} / {{groupItem.direction ? "DESC" : "ASC"}}
                                                             +btn-remove('tableRemoveGroupItem(group, $index)', 'field.removeItemTip')
                                                         div(ng-if='tableGroupItemEditing(groupIndex, $index)')
-                                                            +table-group-item-edit('curFieldName', 'curClassName', 'curDirection', '$index')
+                                                            +table-group-item-edit('cur', '$index')
                                             tfoot(ng-if='tableGroupNewItemActive(groupIndex)')
                                                 tr.col-sm-12(style='padding-left: 18px')
                                                     td
-                                                        +table-group-item-edit('newFieldName', 'newClassName', 'newDirection', '-1')
+                                                        +table-group-item-edit('new', '-1')
                         tfoot(ng-show='tableNewItemActive(field)')
                             tr
                                 td.col-sm-12
-                                    +btn-save('tableGroupSaveVisible(newGroupName)', 'tableGroupSave(newGroupName, -1)')
+                                    +btn-save('tableGroupSaveVisible(field, -1)', 'tableGroupSave(field, -1)')
                                     .input-tip
-                                        input#newGroupName.form-control(type='text' ng-model='newGroupName' placeholder='Group name' on-enter='tableGroupSaveVisible(newGroupName) && tableGroupSave(newGroupName, -1)' on-escape='tableReset()')
+                                        input#newGroupName.form-control(type='text' ng-model='field.newGroupName' placeholder='Group name' on-enter='tableGroupSaveVisible(field, -1) && tableGroupSave(field, -1)' on-escape='tableReset()')