You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ignite.apache.org by se...@apache.org on 2015/07/15 21:17:04 UTC

[16/45] incubator-ignite git commit: IGNITE-843 Added tips for screens and WIP on metadata page.

IGNITE-843 Added tips for screens and WIP on metadata page.


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

Branch: refs/heads/ignite-1121
Commit: e70a7154cb78b19f71158fb90a34e704b90d0b65
Parents: 37c975f
Author: AKuznetsov <ak...@gridgain.com>
Authored: Tue Jul 14 16:50:13 2015 +0700
Committer: AKuznetsov <ak...@gridgain.com>
Committed: Tue Jul 14 16:50:13 2015 +0700

----------------------------------------------------------------------
 .../nodejs/controllers/caches-controller.js     |  1 +
 .../nodejs/controllers/clusters-controller.js   |  1 +
 .../nodejs/controllers/common-module.js         | 10 +++---
 .../nodejs/controllers/metadata-controller.js   | 11 ++++---
 .../nodejs/controllers/models/caches.json       |  4 +++
 .../nodejs/controllers/models/clusters.json     |  3 ++
 .../nodejs/controllers/models/metadata.json     | 34 +++++++++++++++-----
 .../nodejs/controllers/models/summary.json      |  6 ++++
 .../nodejs/controllers/summary-controller.js    | 12 ++++++-
 .../nodejs/public/stylesheets/style.css         |  2 +-
 .../nodejs/public/stylesheets/style.less        | 19 +++++++++++
 .../nodejs/views/configuration/caches.jade      |  2 ++
 .../nodejs/views/configuration/clusters.jade    |  4 ++-
 .../nodejs/views/configuration/metadata.jade    |  6 ++--
 .../nodejs/views/configuration/sidebar.jade     | 14 ++------
 .../nodejs/views/configuration/summary.jade     |  2 ++
 .../nodejs/views/includes/controls.jade         | 21 ++++++------
 17 files changed, 110 insertions(+), 42 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/controllers/caches-controller.js
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/controllers/caches-controller.js b/modules/web-control-center/nodejs/controllers/caches-controller.js
index 52fdcf9..a17557e 100644
--- a/modules/web-control-center/nodejs/controllers/caches-controller.js
+++ b/modules/web-control-center/nodejs/controllers/caches-controller.js
@@ -77,6 +77,7 @@ controlCenterModule.controller('cachesController', ['$scope', '$http', 'commonFu
 
         $http.get('/models/caches.json')
             .success(function (data) {
+                $scope.screenTip = data.screenTip;
                 $scope.general = data.general;
                 $scope.advanced = data.advanced;
             })

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/controllers/clusters-controller.js
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/controllers/clusters-controller.js b/modules/web-control-center/nodejs/controllers/clusters-controller.js
index a983602..c8d3181 100644
--- a/modules/web-control-center/nodejs/controllers/clusters-controller.js
+++ b/modules/web-control-center/nodejs/controllers/clusters-controller.js
@@ -88,6 +88,7 @@ controlCenterModule.controller('clustersController', ['$scope', '$http', 'common
 
         $http.get('/models/clusters.json')
             .success(function (data) {
+                $scope.screenTip = data.screenTip;
                 $scope.templateTip = data.templateTip;
 
                 $scope.general = data.general;

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/controllers/common-module.js
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/controllers/common-module.js b/modules/web-control-center/nodejs/controllers/common-module.js
index 3edcf4e..39b89db 100644
--- a/modules/web-control-center/nodejs/controllers/common-module.js
+++ b/modules/web-control-center/nodejs/controllers/common-module.js
@@ -25,9 +25,13 @@ controlCenterModule.service('commonFunctions', ['$alert', function ($alert) {
         return errMsg ? errMsg : 'Internal server error.';
     }
 
+    function isDefined(v) {
+        return !(v === undefined || v === null);
+    }
+
     return {
         getModel: function (obj, path) {
-            if (!path)
+            if (!isDefined(path))
                 return obj;
 
             path = path.replace(/\[(\w+)\]/g, '.$1'); // convert indexes to properties
@@ -70,9 +74,7 @@ controlCenterModule.service('commonFunctions', ['$alert', function ($alert) {
 
             return lines.join("");
         },
-        isDefined: function (v) {
-            return !(v === undefined || v === null);
-        },
+        isDefined: isDefined,
         errorMessage: errorMessage,
         showError: function (msg) {
             if (msgModal)

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/controllers/metadata-controller.js
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/controllers/metadata-controller.js b/modules/web-control-center/nodejs/controllers/metadata-controller.js
index 93074cd..c8a923c 100644
--- a/modules/web-control-center/nodejs/controllers/metadata-controller.js
+++ b/modules/web-control-center/nodejs/controllers/metadata-controller.js
@@ -21,15 +21,18 @@ controlCenterModule.controller('metadataController', ['$scope', '$http', 'common
         $scope.getModel = commonFunctions.getModel;
 
         $scope.templates = [
-            {value: 'query', label: 'query'},
-            {value: 'store', label: 'store'},
-            {value: 'both', label: 'both'}
+            {value: {kind: 'query'}, label: 'query'},
+            {value: {kind: 'store'}, label: 'store'},
+            {value: {kind: 'both'}, label: 'both'}
         ];
 
+        $scope.template = $scope.templates[0].value;
+
         $scope.metadata = [];
 
         $http.get('/models/metadata.json')
             .success(function (data) {
+                $scope.screenTip = data.screenTip;
                 $scope.templateTip = data.templateTip;
                 $scope.general = data.general;
             })
@@ -80,7 +83,7 @@ controlCenterModule.controller('metadataController', ['$scope', '$http', 'common
 
         // Add new metadata.
         $scope.createItem = function () {
-            $scope.backupItem = {mode: 'PARTITIONED', atomicityMode: 'ATOMIC', readFromBackup: true};
+            $scope.backupItem = angular.copy($scope.template);
             $scope.backupItem.space = $scope.spaces[0]._id;
         };
 

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/controllers/models/caches.json
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/controllers/models/caches.json b/modules/web-control-center/nodejs/controllers/models/caches.json
index b51067b..251c431 100644
--- a/modules/web-control-center/nodejs/controllers/models/caches.json
+++ b/modules/web-control-center/nodejs/controllers/models/caches.json
@@ -1,4 +1,8 @@
 {
+  "screenTip": [
+    "Optional cache configuration.",
+    "Configure caches, link them to clusters and go to Summary page for configuration generation."
+  ],
   "general": [
     {
       "label": "Name",

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/controllers/models/clusters.json
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/controllers/models/clusters.json b/modules/web-control-center/nodejs/controllers/models/clusters.json
index 8c4f828..2a2253c 100644
--- a/modules/web-control-center/nodejs/controllers/models/clusters.json
+++ b/modules/web-control-center/nodejs/controllers/models/clusters.json
@@ -1,4 +1,7 @@
 {
+  "screenTip": [
+    "Configure cluster, link caches to them and go to Summary for configuration generation."
+  ],
   "templateTip": [
     "Use following template for add cluster:",
     "<ul>",

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/controllers/models/metadata.json
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/controllers/models/metadata.json b/modules/web-control-center/nodejs/controllers/models/metadata.json
index 1f540ae..a3e2cf1 100644
--- a/modules/web-control-center/nodejs/controllers/models/metadata.json
+++ b/modules/web-control-center/nodejs/controllers/models/metadata.json
@@ -1,4 +1,9 @@
 {
+  "screenTip": [
+    "Optional cache type metadata configuration.",
+    "Enter metadata manually or load from database.",
+    "Generate cache for metadata if needed."
+  ],
   "templateTip": [
     "Use following template for metadata:",
     "<ul>",
@@ -16,81 +21,94 @@
       "placeholder": "Input name"
     },
     {
-      "label": "kind",
+      "label": "Metadata for",
       "type": "dropdown",
       "model": "kind",
-      "required": true,
       "items": "templates",
-      "placeholder": "Select kind"
+      "placeholder": "Select kind",
+      "tip": ["TODO."]
     },
     {
       "label": "Database schema",
       "type": "text",
       "model": "databaseSchema",
       "required": true,
-      "placeholder": "Input DB schema name"
+      "hide": "backupItem.kind == 'query'",
+      "placeholder": "Input DB schema name",
+      "tip": ["TODO."]
     },
     {
       "label": "Database table",
       "type": "text",
       "model": "databaseTable",
       "required": true,
-      "placeholder": "Input DB table name"
+      "hide": "backupItem.kind == 'query'",
+      "placeholder": "Input DB table name",
+      "tip": ["TODO."]
     },
     {
       "label": "Key type",
       "type": "text",
       "model": "keyType",
       "required": true,
-      "placeholder": "Full class name for Key"
+      "placeholder": "Full class name for Key",
+      "tip": ["TODO."]
     },
     {
       "label": "Value type",
       "type": "text",
       "model": "value Type",
       "required": true,
-      "placeholder": "Full class name for Value"
+      "placeholder": "Full class name for Value",
+      "tip": ["TODO."]
     },
     {
       "label": "Key fields",
       "type": "fieldsMetadata",
       "model": "keyFields",
+      "hide": "backupItem.kind == 'query'",
       "tip": ["Collection of key fields descriptions."]
     },
     {
-      "label": "valFields",
+      "label": "Value fields",
       "type": "fieldsMetadata",
       "model": "valueFields",
+      "hide": "backupItem.kind == 'query'",
       "tip": ["Collection of value fields descriptions."]
     },
     {
       "label": "Query fields",
       "type": "text",
       "model": "queryFields",
+      "hide": "backupItem.kind != 'query'",
       "tip": ["TODO."]
     },
     {
       "label": "Ascending fields",
       "type": "text",
       "model": "ascendingFields",
+      "hide": "backupItem.kind != 'query'",
       "tip": ["TODO."]
     },
     {
       "label": "Descending fields",
       "type": "text",
       "model": "descendingFields",
+      "hide": "backupItem.kind != 'query'",
       "tip": ["TODO."]
     },
     {
       "label": "Text fields",
       "type": "table-simple",
       "model": "textFields",
+      "hide": "backupItem.kind != 'query'",
       "tip": ["TODO."]
     },
     {
       "label": "Groups",
       "type": "groupsMetadata",
       "model": "groups",
+      "hide": "backupItem.kind != 'query'",
       "tip": ["TODO."]
     }
   ]

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/controllers/models/summary.json
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/controllers/models/summary.json b/modules/web-control-center/nodejs/controllers/models/summary.json
new file mode 100644
index 0000000..4abad2e
--- /dev/null
+++ b/modules/web-control-center/nodejs/controllers/models/summary.json
@@ -0,0 +1,6 @@
+{
+  "screenTip": [
+    "Optional cache configuration.",
+    "Configure caches, link them to clusters and go to Summary page for configuration generation."
+  ]
+}

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/controllers/summary-controller.js
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/controllers/summary-controller.js b/modules/web-control-center/nodejs/controllers/summary-controller.js
index 1935739..6a5443e 100644
--- a/modules/web-control-center/nodejs/controllers/summary-controller.js
+++ b/modules/web-control-center/nodejs/controllers/summary-controller.js
@@ -15,12 +15,22 @@
  * limitations under the License.
  */
 
-controlCenterModule.controller('summaryController', ['$scope', '$http', function ($scope, $http) {
+controlCenterModule.controller('summaryController', ['$scope', '$http', 'commonFunctions', function ($scope, $http, commonFunctions) {
+    $scope.joinTip = commonFunctions.joinTip;
+
     $scope.javaClassItems = [
         { label: 'snippet',value: false},
         { label: 'factory class',value: true}
     ];
 
+    $http.get('/models/summary.json')
+        .success(function (data) {
+            $scope.screenTip = data.screenTip;
+        })
+        .error(function (errMsg) {
+            commonFunctions.showError(errMsg);
+        });
+
     $scope.oss = ['debian:8', 'ubuntu:14.10'];
 
     $scope.cfgLang = 'xml';

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/public/stylesheets/style.css
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/public/stylesheets/style.css b/modules/web-control-center/nodejs/public/stylesheets/style.css
index 54263e8..a923c15 100644
--- a/modules/web-control-center/nodejs/public/stylesheets/style.css
+++ b/modules/web-control-center/nodejs/public/stylesheets/style.css
@@ -1 +1 @@
-.main-header .logo{height:auto}.main-sidebar{padding-top:60px}.navbar-default .navbar-brand,.navbar-default .navbar-brand:hover{position:absolute;width:100%;left:0;text-align:center}.modal-backdrop.am-fade{opacity:.5;transition:opacity .15s linear}.modal-backdrop.am-fade.ng-enter{opacity:0}.modal-backdrop.am-fade.ng-enter.ng-enter-active{opacity:.5}.modal-backdrop.am-fade.ng-leave{opacity:.5}.modal-backdrop.am-fade.ng-leave.ng-leave-active{opacity:0}.modal.center .modal-dialog{position:fixed;top:50%;left:50%;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%)}.border-left{box-shadow:1px 0 0 0 #eee inset}.border-right{box-shadow:1px 0 0 0 #eee}.theme-line{background-color:#f9f9f9}.theme-line header{background-color:#fff}.theme-line header a.btn{border:0 none;padding:10px 25px;background-color:rgba(0,0,0,0.15)}.theme-line header a.btn:hover{background-color:rgba(0,0,0,0.25)}.theme-line header a.btn.btn-link{background:transparent;color:rgba(
 255,255,255,0.8)}.theme-line header a.btn.btn-link:hover{color:#fff;text-decoration:none}.theme-line .navbar-nav a{background-color:transparent}.theme-line .navbar-nav a:hover,.theme-line .navbar-nav a:active,.theme-line .navbar-nav a:focus{background-color:transparent}.theme-line .main-links{padding-top:50px}.theme-line .main-links h3{margin-top:0;font-size:17px}.theme-line .main-links .links a{color:#888}.theme-line .main-links .links a:hover{text-decoration:none}.theme-line #category-columns,.theme-solid #category-columns{margin:50px 30px 0}.theme-line #category-columns h4{text-transform:uppercase;font-weight:300;color:#999;font-size:14px}.theme-line #category-columns ul{list-style:none;padding:0;margin-bottom:15px}.theme-line #category-columns ul li a{padding:4px 0;display:block;font-size:16px}.theme-line #category-columns ul .view-all{font-size:0.85em}.theme-line .docs-header{color:#999;overflow:hidden}.theme-line .docs-header h1{color:#444;margin-top:0;font-size:22px}.theme-li
 ne .btn-primary{border:0 none;background-color:#ec1c24}.theme-line .btn-primary:hover{background-color:#950d12}.theme-line .main-content .nav-horizontal a{box-shadow:0 0;border:0 none;background-color:#fff;border-radius:0;color:#aaa;padding:6px;margin:0 14px}.theme-line .main-content .nav-horizontal a:hover{color:#999;border-bottom:4px solid #ddd}.theme-line .main-content .nav-horizontal a.active{border-bottom:4px solid #888}.theme-line ul li>a.active{cursor:default;pointer-events:none}.theme-line .sidebar-nav{color:#474a54;padding-bottom:30px}.theme-line .sidebar-nav ul{padding:0;list-style:none;font-size:14px;margin:3px 0 0}.theme-line .sidebar-nav ul li{color:#666;line-height:28px}.theme-line .sidebar-nav ul li span.fa-stack{margin-right:5px;font-size:12px;height:26px}.theme-line .sidebar-nav ul li a{font-size:18px;color:#666;position:relative;white-space:nowrap;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis}.theme-line .sidebar-nav ul li a:hover{text-decoration
 :none}.theme-line .select li a,.theme-line .typeahead li a{color:#666;background-color:transparent}.theme-line .select li a:hover,.theme-line .typeahead li a:hover{color:#ec1c24;background-color:transparent}.theme-line .select .active,.theme-line .typeahead .active{background-color:#eee}.theme-line .sidebar-nav ul li .subcategory{padding-left:15px}.theme-line .sidebar-nav h4{margin-top:2em;font-weight:normal;text-transform:uppercase;font-size:11px;margin-bottom:10px;color:#bbb}.theme-line .sidebar-nav h4:first-child{margin-top:0}.theme-line .sidebar-nav .ask{width:100%;text-align:center;padding:10px}.theme-line .border-left .sidebar-nav{padding-left:15px}.theme-line .suggest{padding:4px;display:inline-block;font-size:12px}.header{padding:15px}.header .has-github{padding-right:136px}.header h1.navbar-brand{height:40px;width:200px;padding:0;margin:5px 15px 0 0}.header h1.navbar-brand a{text-indent:-99999px;background:no-repeat center center;display:block;width:100%;height:100%;backgro
 und-size:contain}.header .nav.navbar-nav.pull-right{position:relative;right:-30px}.header .nav.navbar-nav .not-link{padding:15px;display:inline-block}.header .nav.navbar-nav .stable,.header .nav.navbar-nav .beta,.header .nav.navbar-nav .private{font-size:9px;padding:3px 5px;display:inline-block;line-height:8px;border-radius:3px;margin-left:6px;color:#fff;top:-2px;position:relative;opacity:0.6;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";filter:alpha(opacity=60)}.header .nav.navbar-nav a:hover>.stable,.header .nav.navbar-nav a:hover>.beta,.header .nav.navbar-nav a:hover>.private{opacity:1;-ms-filter:none;filter:none}.header .nav.navbar-nav .beta{background-color:#59c3d1}.header .nav.navbar-nav .stable{background-color:#41b841}.header .nav.navbar-nav .private{background-color:#333}.theme-line header{border-bottom:8px solid}.theme-line header h2{color:#aaa}.theme-line header p{color:#666}.theme-line header{border-bottom-color:#ec1c24}.theme-line .navbar-nav{color:#8
 88}.theme-line .navbar-nav a{color:#bbb}.theme-line header a.btn{background-color:#ec1c24}.theme-line header a.btn:hover{background-color:#950d12}.theme-line header .navbar-nav .tt-cursor{background-color:#ec1c24}.theme-line header .navbar-nav a:hover,.theme-line header .navbar-nav .open>a{color:#ec1c24}.theme-line .navbar-nav .active a{color:#ec1c24}.theme-line .navbar-nav .active a:hover{color:#950d12}.theme-line .main-links .links a:hover{color:#ec1c24}.theme-line .main-content a{color:#666}.theme-line .main-content a:hover{color:#950d12}.theme-line .sidebar-nav ul li a.active:before{background-color:#ec1c24}.theme-line .sidebar-nav ul li a.active{color:#ec1c24}.theme-line .sidebar-nav ul li a:hover,.theme-line .sidebar-nav ul li a.active:hover{color:#950d12}.theme-line .main-content .nav-horizontal a.active{border-color:#ec1c24;color:#ec1c24}.theme-line .main-content .nav-horizontal a:hover{color:#950d12}.theme-line .main-content .nav-horizontal a.active:hover{border-color:#950d
 12}.theme-line header .navbar-nav a.active,.theme-line #versions-list li a:hover strong,.theme-line #versions-list li a.active .current,.theme-line #versions-list li a:active .current{color:#ec1c24}.theme-line header .navbar-nav a{font-size:18px}.theme-line.body-threes .section-right .threes-nav .btn-default:hover,.theme-line.page-docs.body-threes .section-right .threes-nav .pull-right a:hover{color:#ec1c24;border-color:#ec1c24}.theme-line .section-right{padding-left:30px}.body-overlap .main-content{margin-top:30px}.body-box .main-content,.body-overlap .main-content{padding:30px;box-shadow:0 0 0 1px rgba(0,0,0,0.1);background-color:#fff}body{font-weight:400;font-family:Roboto Slab, serif}h1,h2,h3,h4,h5,h6{font-weight:700;font-family:Roboto Slab, serif}.submit-vote.submit-vote-parent.voted a.submit-vote-button,.submit-vote.submit-vote-parent a.submit-vote-button:hover{background-color:#ec1c24}div.submit-vote.submit-vote-parent.voted a.submit-vote-button:hover{background-color:#950d12
 }a,.link .title{color:#ec1c24}a:hover,.link:hover .title{color:#950d12}.header h1.navbar-brand a{background-image:url("https://www.filepicker.io/api/file/QagunjDGRFul2JgNCAli")}.header h1.navbar-brand{width:96px}.block-edit-parameters{text-align:right;padding-bottom:5px}.container-footer{margin-top:20px}.modal{display:block;overflow:hidden}.modal .close{position:absolute;top:0.65em;right:0.65em;float:none}.modal-header .close{margin-right:-2px}.modal .modal-dialog{width:610px}.modal .modal-content{border-radius:0;background-color:#f7f7f7}.modal .modal-content .modal-header{background-color:#fff;text-align:center;color:#555;padding:24px;font-family:"myriad-pro",sans-serif}.modal .modal-content .modal-header h4{font-family:"myriad-pro",sans-serif;font-size:22px}.modal .modal-content .modal-header h4 .fa{display:block;font-size:41px;color:#ddd;margin-bottom:5px}.modal .modal-content .modal-header p{color:#aaa;font-size:1em;margin:3px 0 0}.modal .modal-content .modal-spacer{padding:10px
  10px 0 10px}.modal .modal-content .modal-footer{margin-top:0}.modal-body{padding-top:15px}h1.ignite-logo{background-image:url("https://www.filepicker.io/api/file/QagunjDGRFul2JgNCAli")}.block-display-image img{max-width:100%;max-height:450px;margin:auto;display:block}.greedy{min-height:200px;height:calc(100vh - 290px)}@media (min-width:768px){.navbar-nav>li>a{padding-top:18px;padding-bottom:10px}}.details-row{padding:0 0.65em}.details-row,.settings-row{display:block;margin:0.65em 0}.details-row label.table-header,.settings-row label.table-header{line-height:28px}.details-row [class*="col-"],.settings-row [class*="col-"]{display:inline-block;vertical-align:middle;float:none;padding-left:0 !important;padding-right:0 !important}.details-row input[type="checkbox"],.settings-row input[type="checkbox"]{line-height:20px;margin-right:4px}.details-row .checkbox label,.settings-row .checkbox label{line-height:20px;vertical-align:middle}button{margin-right:4px}h1,h2,h3{user-select:none;font-w
 eight:normal;line-height:1}h3{color:black;font-size:1.2em;margin-top:0;margin-bottom:1.5em}table tr:hover{cursor:pointer}.form-control{display:inline-block;text-align:left;padding:3px 3px;height:28px}.form-control button{text-align:left}.table-form-control{width:auto}button .caret{float:right;margin-left:0;margin-top:7px}.theme-line .panel-heading{padding:10px 10px;margin:0}.theme-line .panel-heading h3{margin-bottom:0}.theme-line .panel-heading h3>a{color:black}.theme-line .panel-title a{color:#ec1c24}.theme-line .panel-title h3{margin-bottom:1.3em}.theme-line .panel-body{padding:0.65em 1.3em}.theme-line .main-content a.customize{margin-left:5px;color:#ec1c24}.theme-line .panel-collapse{margin:0}.theme-line .links table,.theme-line table.links-edit,.theme-line table.links-edit-details,.theme-line table.links-edit-small-padding{display:table;table-layout:fixed;margin-bottom:20px}.theme-line .links table td,.theme-line table.links-edit td,.theme-line table.links-edit-details td,.them
 e-line table.links-edit-small-padding td{padding-left:18px}.theme-line .links table .active a,.theme-line table.links-edit .active a,.theme-line table.links-edit-details .active a,.theme-line table.links-edit-small-padding .active a{color:#ec1c24;font-weight:bold}.theme-line .links table a:hover,.theme-line table.links-edit a:hover,.theme-line table.links-edit-details a:hover,.theme-line table.links-edit-small-padding a:hover{color:#950d12}.theme-line .links table a,.theme-line table.links-edit a,.theme-line table.links-edit-details a,.theme-line table.links-edit-small-padding a{color:#666}.theme-line table.links-edit{margin-bottom:10px}.theme-line table.links-edit label{line-height:28px;color:#666}.theme-line table.links-edit-details{margin-bottom:10px}.theme-line table.links-edit-details label{line-height:28px;color:#666}.theme-line table.links-edit-details td{padding:0}.theme-line table.links-edit-details td .input-tip{padding:0}.theme-line table.admin{margin-bottom:10px}.theme-l
 ine table.admin tr:hover{cursor:default}.theme-line table.admin thead>tr th.header{padding:0 0 0.65em}.theme-line table.admin thead>tr th.header div{padding:0}.theme-line table.admin label{line-height:28px;color:#666}.theme-line table.admin thead>tr th,.theme-line table.admin td{padding:0.65em 0.65em}.theme-line table.admin thead>tr th .input-tip,.theme-line table.admin td .input-tip{padding:0}.btn{padding:3px 6px}.panel-title a{font-size:14px}.panel-details{margin-top:0.65em;padding:0;border-radius:4px;border:thin dotted lightgrey}.tooltip.right .tooltip-arrow{border-right-color:#ec1c24}.tooltip>.tooltip-inner{max-width:400px;text-align:left;background-color:#ec1c24}label{font-weight:normal;margin-bottom:0}.form-horizontal .checkbox{padding-top:0}.input-tip{display:block;overflow:hidden}.labelField{float:left;margin-right:4px}.labelFormField{float:left;line-height:28px}.form-horizontal .form-group{margin:0}.form-horizontal .has-feedback .form-control-feedback{right:0}.tipField{floa
 t:right;line-height:28px;margin-left:5px}.tipLabel{font-size:14px;margin-left:5px}.fieldButton{float:right;margin-left:5px;margin-right:0}.fa-remove{color:#ec1c24;cursor:pointer}label.required:after{color:#ec1c24;content:' *';display:inline}.blank{visibility:hidden}.alert{outline:0}.alert.bottom,.alert.bottom-left,.alert.bottom-right,.alert.top,.alert.top-left,.alert.top-right{position:fixed;z-index:1050;margin:20px}.alert.top,.alert.top-left,.alert.top-right{top:50px}.alert.top{right:0;left:0}.alert.top-right{right:0}.alert.top-right .close{padding-left:10px}.alert.top-left{left:0}.alert.top-left .close{padding-right:10px}.alert.bottom,.alert.bottom-left,.alert.bottom-right{bottom:0}.alert.bottom{right:0;left:0}.alert.bottom-right{right:0}.alert.bottom-right .close{padding-left:10px}.alert.bottom-left{left:0}.alert.bottom-left .close{padding-right:10px}#cfgResult textarea{font-family:monospace;font-size:12px}input[type="number"]::-webkit-outer-spin-button,input[type="number"]::-web
 kit-inner-spin-button{-webkit-appearance:none;margin:0}input[type="number"]{-moz-appearance:textfield}input.ng-dirty.ng-invalid,button.ng-dirty.ng-invalid{border-color:#ec1c24}input.ng-dirty.ng-invalid :focus,button.ng-dirty.ng-invalid :focus{border-color:#ec1c24}.form-control-feedback{display:inline-block;color:#ec1c24;right:18px;line-height:28px;pointer-events:initial}.syntaxhighlighter{padding:10px 5px;border-radius:6px}.theme-line table.links-edit-small-padding{margin-top:10px}.theme-line table.links-edit-small-padding label{line-height:28px;color:#666}.theme-line table.links-edit-small-padding a{line-height:28px}.theme-line table.links-edit-small-padding input[type="checkbox"]{line-height:20px;margin-right:5px}.theme-line table.links-edit-small-padding .checkbox label{line-height:20px;vertical-align:middle}.theme-line table.links-edit-small-padding th{text-align:center}.theme-line table.links-edit-small-padding td{padding-left:10px}.configBox .nav>li>a{padding:5px 5px}.viewedUs
 er{position:absolute;width:100%;left:0;text-align:center;margin-top:-15px;background-color:#f8d5d8}a{cursor:pointer}.st-sort-ascent:after{content:'\25B2'}.st-sort-descent:after{content:'\25BC'}
\ No newline at end of file
+.main-header .logo{height:auto}.main-sidebar{padding-top:60px}.navbar-default .navbar-brand,.navbar-default .navbar-brand:hover{position:absolute;width:100%;left:0;text-align:center}.modal-backdrop.am-fade{opacity:.5;transition:opacity .15s linear}.modal-backdrop.am-fade.ng-enter{opacity:0}.modal-backdrop.am-fade.ng-enter.ng-enter-active{opacity:.5}.modal-backdrop.am-fade.ng-leave{opacity:.5}.modal-backdrop.am-fade.ng-leave.ng-leave-active{opacity:0}.modal.center .modal-dialog{position:fixed;top:50%;left:50%;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%)}.border-left{box-shadow:1px 0 0 0 #eee inset}.border-right{box-shadow:1px 0 0 0 #eee}.theme-line{background-color:#f9f9f9}.theme-line header{background-color:#fff}.theme-line header a.btn{border:0 none;padding:10px 25px;background-color:rgba(0,0,0,0.15)}.theme-line header a.btn:hover{background-color:rgba(0,0,0,0.25)}.theme-line header a.btn.btn-link{background:transparent;color:rgba(
 255,255,255,0.8)}.theme-line header a.btn.btn-link:hover{color:#fff;text-decoration:none}.theme-line .navbar-nav a{background-color:transparent}.theme-line .navbar-nav a:hover,.theme-line .navbar-nav a:active,.theme-line .navbar-nav a:focus{background-color:transparent}.theme-line .main-links{padding-top:50px}.theme-line .main-links h3{margin-top:0;font-size:17px}.theme-line .main-links .links a{color:#888}.theme-line .main-links .links a:hover{text-decoration:none}.theme-line #category-columns,.theme-solid #category-columns{margin:50px 30px 0}.theme-line #category-columns h4{text-transform:uppercase;font-weight:300;color:#999;font-size:14px}.theme-line #category-columns ul{list-style:none;padding:0;margin-bottom:15px}.theme-line #category-columns ul li a{padding:4px 0;display:block;font-size:16px}.theme-line #category-columns ul .view-all{font-size:0.85em}.theme-line .docs-header{color:#999;overflow:hidden}.theme-line .docs-header h1{color:#444;margin-top:0;font-size:22px}.theme-li
 ne .btn-primary{border:0 none;background-color:#ec1c24}.theme-line .btn-primary:hover{background-color:#950d12}.theme-line .main-content .nav-horizontal a{box-shadow:0 0;border:0 none;background-color:#fff;border-radius:0;color:#aaa;padding:6px;margin:0 14px}.theme-line .main-content .nav-horizontal a:hover{color:#999;border-bottom:4px solid #ddd}.theme-line .main-content .nav-horizontal a.active{border-bottom:4px solid #888}.theme-line ul li>a.active{cursor:default;pointer-events:none}.theme-line .sidebar-nav{color:#474a54;padding-bottom:30px}.theme-line .sidebar-nav ul{padding:0;list-style:none;font-size:14px;margin:3px 0 0}.theme-line .sidebar-nav ul li{color:#666;line-height:28px}.theme-line .sidebar-nav ul li span.fa-stack{margin-right:5px;font-size:12px;height:26px}.theme-line .sidebar-nav ul li a{font-size:18px;color:#666;position:relative;white-space:nowrap;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis}.theme-line .sidebar-nav ul li a:hover{text-decoration
 :none}.theme-line .select li a,.theme-line .typeahead li a{color:#666;background-color:transparent}.theme-line .select li a:hover,.theme-line .typeahead li a:hover{color:#ec1c24;background-color:transparent}.theme-line .select .active,.theme-line .typeahead .active{background-color:#eee}.theme-line .sidebar-nav ul li .subcategory{padding-left:15px}.theme-line .sidebar-nav h4{margin-top:2em;font-weight:normal;text-transform:uppercase;font-size:11px;margin-bottom:10px;color:#bbb}.theme-line .sidebar-nav h4:first-child{margin-top:0}.theme-line .sidebar-nav .ask{width:100%;text-align:center;padding:10px}.theme-line .border-left .sidebar-nav{padding-left:15px}.theme-line .suggest{padding:4px;display:inline-block;font-size:12px}.header{padding:15px}.header .has-github{padding-right:136px}.header h1.navbar-brand{height:40px;width:200px;padding:0;margin:5px 15px 0 0}.header h1.navbar-brand a{text-indent:-99999px;background:no-repeat center center;display:block;width:100%;height:100%;backgro
 und-size:contain}.header .nav.navbar-nav.pull-right{position:relative;right:-30px}.header .nav.navbar-nav .not-link{padding:15px;display:inline-block}.header .nav.navbar-nav .stable,.header .nav.navbar-nav .beta,.header .nav.navbar-nav .private{font-size:9px;padding:3px 5px;display:inline-block;line-height:8px;border-radius:3px;margin-left:6px;color:#fff;top:-2px;position:relative;opacity:0.6;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";filter:alpha(opacity=60)}.header .nav.navbar-nav a:hover>.stable,.header .nav.navbar-nav a:hover>.beta,.header .nav.navbar-nav a:hover>.private{opacity:1;-ms-filter:none;filter:none}.header .nav.navbar-nav .beta{background-color:#59c3d1}.header .nav.navbar-nav .stable{background-color:#41b841}.header .nav.navbar-nav .private{background-color:#333}.theme-line header{border-bottom:8px solid}.theme-line header h2{color:#aaa}.theme-line header p{color:#666}.theme-line header{border-bottom-color:#ec1c24}.theme-line .navbar-nav{color:#8
 88}.theme-line .navbar-nav a{color:#bbb}.theme-line header a.btn{background-color:#ec1c24}.theme-line header a.btn:hover{background-color:#950d12}.theme-line header .navbar-nav .tt-cursor{background-color:#ec1c24}.theme-line header .navbar-nav a:hover,.theme-line header .navbar-nav .open>a{color:#ec1c24}.theme-line .navbar-nav .active a{color:#ec1c24}.theme-line .navbar-nav .active a:hover{color:#950d12}.theme-line .main-links .links a:hover{color:#ec1c24}.theme-line .main-content a{color:#666}.theme-line .main-content a:hover{color:#950d12}.theme-line .sidebar-nav ul li a.active:before{background-color:#ec1c24}.theme-line .sidebar-nav ul li a.active{color:#ec1c24}.theme-line .sidebar-nav ul li a:hover,.theme-line .sidebar-nav ul li a.active:hover{color:#950d12}.theme-line .main-content .nav-horizontal a.active{border-color:#ec1c24;color:#ec1c24}.theme-line .main-content .nav-horizontal a:hover{color:#950d12}.theme-line .main-content .nav-horizontal a.active:hover{border-color:#950d
 12}.theme-line header .navbar-nav a.active,.theme-line #versions-list li a:hover strong,.theme-line #versions-list li a.active .current,.theme-line #versions-list li a:active .current{color:#ec1c24}.theme-line header .navbar-nav a{font-size:18px}.theme-line.body-threes .section-right .threes-nav .btn-default:hover,.theme-line.page-docs.body-threes .section-right .threes-nav .pull-right a:hover{color:#ec1c24;border-color:#ec1c24}.theme-line .section-right{padding-left:30px}.body-overlap .main-content{margin-top:30px}.body-box .main-content,.body-overlap .main-content{padding:30px;box-shadow:0 0 0 1px rgba(0,0,0,0.1);background-color:#fff}body{font-weight:400;font-family:Roboto Slab, serif}h1,h2,h3,h4,h5,h6{font-weight:700;font-family:Roboto Slab, serif}.submit-vote.submit-vote-parent.voted a.submit-vote-button,.submit-vote.submit-vote-parent a.submit-vote-button:hover{background-color:#ec1c24}div.submit-vote.submit-vote-parent.voted a.submit-vote-button:hover{background-color:#950d12
 }a,.link .title{color:#ec1c24}a:hover,.link:hover .title{color:#950d12}.header h1.navbar-brand a{background-image:url("https://www.filepicker.io/api/file/QagunjDGRFul2JgNCAli")}.header h1.navbar-brand{width:96px}.block-edit-parameters{text-align:right;padding-bottom:5px}.container-footer{margin-top:20px}.modal{display:block;overflow:hidden}.modal .close{position:absolute;top:0.65em;right:0.65em;float:none}.modal-header .close{margin-right:-2px}.modal .modal-dialog{width:610px}.modal .modal-content{border-radius:0;background-color:#f7f7f7}.modal .modal-content .modal-header{background-color:#fff;text-align:center;color:#555;padding:24px;font-family:"myriad-pro",sans-serif}.modal .modal-content .modal-header h4{font-family:"myriad-pro",sans-serif;font-size:22px}.modal .modal-content .modal-header h4 .fa{display:block;font-size:41px;color:#ddd;margin-bottom:5px}.modal .modal-content .modal-header p{color:#aaa;font-size:1em;margin:3px 0 0}.modal .modal-content .modal-spacer{padding:10px
  10px 0 10px}.modal .modal-content .modal-footer{margin-top:0}.modal-body{padding-top:15px}h1.ignite-logo{background-image:url("https://www.filepicker.io/api/file/QagunjDGRFul2JgNCAli")}.block-display-image img{max-width:100%;max-height:450px;margin:auto;display:block}.greedy{min-height:200px;height:calc(100vh - 290px)}@media (min-width:768px){.navbar-nav>li>a{padding-top:18px;padding-bottom:10px}}.details-row{padding:0 0.65em}.details-row,.settings-row{display:block;margin:0.65em 0}.details-row label.table-header,.settings-row label.table-header{line-height:28px}.details-row [class*="col-"],.settings-row [class*="col-"]{display:inline-block;vertical-align:middle;float:none;padding-left:0 !important;padding-right:0 !important}.details-row input[type="checkbox"],.settings-row input[type="checkbox"]{line-height:20px;margin-right:4px}.details-row .checkbox label,.settings-row .checkbox label{line-height:20px;vertical-align:middle}button{margin-right:4px}h1,h2,h3{user-select:none;font-w
 eight:normal;line-height:1}h3{color:black;font-size:1.2em;margin-top:0;margin-bottom:1.5em}table tr:hover{cursor:pointer}.form-control{display:inline-block;text-align:left;padding:3px 3px;height:28px}.form-control button{text-align:left}.table-form-control{width:auto}button .caret{float:right;margin-left:0;margin-top:7px}.theme-line .panel-heading{padding:10px 10px;margin:0}.theme-line .panel-heading h3{margin-bottom:0}.theme-line .panel-heading h3>a{color:black}.theme-line .panel-title a{color:#ec1c24}.theme-line .panel-title h3{margin-bottom:1.3em}.theme-line .panel-body{padding:0.65em 1.3em}.theme-line .main-content a.customize{margin-left:5px;color:#ec1c24}.theme-line .panel-collapse{margin:0}.theme-line .links table,.theme-line table.links-edit,.theme-line table.links-edit-details,.theme-line table.links-edit-small-padding{display:table;table-layout:fixed;margin-bottom:20px}.theme-line .links table td,.theme-line table.links-edit td,.theme-line table.links-edit-details td,.them
 e-line table.links-edit-small-padding td{padding-left:18px}.theme-line .links table .active a,.theme-line table.links-edit .active a,.theme-line table.links-edit-details .active a,.theme-line table.links-edit-small-padding .active a{color:#ec1c24;font-weight:bold}.theme-line .links table a:hover,.theme-line table.links-edit a:hover,.theme-line table.links-edit-details a:hover,.theme-line table.links-edit-small-padding a:hover{color:#950d12}.theme-line .links table a,.theme-line table.links-edit a,.theme-line table.links-edit-details a,.theme-line table.links-edit-small-padding a{color:#666}.theme-line table.links-edit{margin-bottom:10px}.theme-line table.links-edit label{line-height:28px;color:#666}.theme-line table.links-edit-details{margin-bottom:10px}.theme-line table.links-edit-details label{line-height:28px;color:#666}.theme-line table.links-edit-details td{padding:0}.theme-line table.links-edit-details td .input-tip{padding:0}.theme-line table.admin{margin-bottom:10px}.theme-l
 ine table.admin tr:hover{cursor:default}.theme-line table.admin thead>tr th.header{padding:0 0 0.65em}.theme-line table.admin thead>tr th.header div{padding:0}.theme-line table.admin label{line-height:28px;color:#666}.theme-line table.admin thead>tr th,.theme-line table.admin td{padding:0.65em 0.65em}.theme-line table.admin thead>tr th .input-tip,.theme-line table.admin td .input-tip{padding:0}.btn{padding:3px 6px}.panel-title a{font-size:14px}.panel-details{margin-top:0.65em;padding:0;border-radius:4px;border:thin dotted lightgrey}.tooltip.right .tooltip-arrow{border-right-color:#ec1c24}.tooltip>.tooltip-inner{max-width:400px;text-align:left;background-color:#ec1c24}label{font-weight:normal;margin-bottom:0}.form-horizontal .checkbox{padding-top:0}.input-tip{display:block;overflow:hidden}.labelField{float:left;margin-right:4px}.labelFormField{float:left;line-height:28px}.form-horizontal .form-group{margin:0}.form-horizontal .has-feedback .form-control-feedback{right:0}.tipField{floa
 t:right;line-height:28px;margin-left:5px}.tipLabel{font-size:14px;margin-left:5px}.fieldButton{float:right;margin-left:5px;margin-right:0}.fa-remove{color:#ec1c24;cursor:pointer}label.required:after{color:#ec1c24;content:' *';display:inline}.blank{visibility:hidden}.alert{outline:0}.alert.bottom,.alert.bottom-left,.alert.bottom-right,.alert.top,.alert.top-left,.alert.top-right{position:fixed;z-index:1050;margin:20px}.alert.top,.alert.top-left,.alert.top-right{top:50px}.alert.top{right:0;left:0}.alert.top-right{right:0}.alert.top-right .close{padding-left:10px}.alert.top-left{left:0}.alert.top-left .close{padding-right:10px}.alert.bottom,.alert.bottom-left,.alert.bottom-right{bottom:0}.alert.bottom{right:0;left:0}.alert.bottom-right{right:0}.alert.bottom-right .close{padding-left:10px}.alert.bottom-left{left:0}.alert.bottom-left .close{padding-right:10px}#cfgResult textarea{font-family:monospace;font-size:12px}input[type="number"]::-webkit-outer-spin-button,input[type="number"]::-web
 kit-inner-spin-button{-webkit-appearance:none;margin:0}input[type="number"]{-moz-appearance:textfield}input.ng-dirty.ng-invalid,button.ng-dirty.ng-invalid{border-color:#ec1c24}input.ng-dirty.ng-invalid :focus,button.ng-dirty.ng-invalid :focus{border-color:#ec1c24}.form-control-feedback{display:inline-block;color:#ec1c24;right:18px;line-height:28px;pointer-events:initial}.syntaxhighlighter{padding:10px 5px;border-radius:6px}.theme-line table.links-edit-small-padding{margin-top:10px}.theme-line table.links-edit-small-padding label{line-height:28px;color:#666}.theme-line table.links-edit-small-padding a{line-height:28px}.theme-line table.links-edit-small-padding input[type="checkbox"]{line-height:20px;margin-right:5px}.theme-line table.links-edit-small-padding .checkbox label{line-height:20px;vertical-align:middle}.theme-line table.links-edit-small-padding th{text-align:center}.theme-line table.links-edit-small-padding td{padding-left:10px}.configBox .nav>li>a{padding:5px 5px}.viewedUs
 er{position:absolute;width:100%;left:0;text-align:center;margin-top:-15px;background-color:#f8d5d8}a{cursor:pointer}.st-sort-ascent:after{content:'\25B2'}.st-sort-descent:after{content:'\25BC'}.block-callout{background-color:#f3f8f3;border-left-width:4px;border-left-style:solid;border-color:#50af51;margin-bottom:20px}.block-callout p{padding:10px 0 10px 10px}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/public/stylesheets/style.less
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/public/stylesheets/style.less b/modules/web-control-center/nodejs/public/stylesheets/style.less
index 7fc9990..14f95fa 100644
--- a/modules/web-control-center/nodejs/public/stylesheets/style.less
+++ b/modules/web-control-center/nodejs/public/stylesheets/style.less
@@ -18,6 +18,9 @@
 @logo-path: "https://www.filepicker.io/api/file/QagunjDGRFul2JgNCAli";
 @input-height: 28px;
 @ignite-red: #ec1c24;
+@ignite-block-callout-background: #f3f8f3;
+@ignite-block-callout-border: #50af51;
+
 
 .main-header .logo {
   height: auto;
@@ -1034,3 +1037,19 @@ a {
 .st-sort-descent:after{
   content: '\25BC';
 }
+
+.block-callout {
+  background-color: @ignite-block-callout-background;
+  border-left-width: 4px;
+  border-left-style: solid;
+  border-color: @ignite-block-callout-border;
+
+  margin-bottom: 20px;
+
+  p {
+    padding: 10px 0 10px 10px;
+  }
+}
+
+
+

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/views/configuration/caches.jade
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/views/configuration/caches.jade b/modules/web-control-center/nodejs/views/configuration/caches.jade
index 42d12e4..ae4b2d4 100644
--- a/modules/web-control-center/nodejs/views/configuration/caches.jade
+++ b/modules/web-control-center/nodejs/views/configuration/caches.jade
@@ -26,6 +26,8 @@ block content
         h1 Create and configure Ignite caches
         hr
     .docs-body(ng-controller='cachesController')
+        .block-callout
+            p(ng-bind-html='joinTip(screenTip)')
         .links(ng-hide='caches.length == 0')
             table.col-sm-12(st-table='caches')
                 tbody

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/views/configuration/clusters.jade
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/views/configuration/clusters.jade b/modules/web-control-center/nodejs/views/configuration/clusters.jade
index 0fcdb29..aa22784 100644
--- a/modules/web-control-center/nodejs/views/configuration/clusters.jade
+++ b/modules/web-control-center/nodejs/views/configuration/clusters.jade
@@ -26,13 +26,15 @@ block content
         h1 Create and configure Ignite clusters
         hr
     .docs-body(ng-controller='clustersController')
+        .block-callout
+            p(ng-bind-html='joinTip(screenTip)')
         .links(ng-hide='clusters.length == 0')
             table.col-sm-12(st-table='clusters')
                 tbody
                     tr(ng-repeat='row in clusters track by row._id')
                         td.col-sm-6(ng-class='{active: row._id == selectedItem._id}')
                             a(ng-click='selectItem(row)') {{$index + 1}}) {{row.name}}, {{row.discovery.kind | displayValue:discoveries:'Discovery not set'}}
-        button.btn.btn-primary(ng-click='createItem()' ng-disabled='!create.template') &nbspAdd cluster
+        button.btn.btn-primary(ng-click='createItem()') &nbspAdd cluster
         label(style='margin-left: 15px; margin-right: 10px') Use template:
         button.btn.btn-default(ng-init='create.template = templates[0].value' ng-model='create.template' data-template='/select' data-placeholder='Choose cluster template' bs-options='item.value as item.label for item in templates' bs-select)
         i.tiplabel.fa.fa-question-circle(bs-tooltip data-title='{{joinTip(templateTip)}}' type='button')

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/views/configuration/metadata.jade
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/views/configuration/metadata.jade b/modules/web-control-center/nodejs/views/configuration/metadata.jade
index b3469f2..ff64692 100644
--- a/modules/web-control-center/nodejs/views/configuration/metadata.jade
+++ b/modules/web-control-center/nodejs/views/configuration/metadata.jade
@@ -26,15 +26,17 @@ block content
         h1 Create and configure cache type metadata
         hr
     .docs-body(ng-controller='metadataController')
+        .block-callout
+            p(ng-bind-html='joinTip(screenTip)')
         .links(ng-hide='metadata.length == 0')
             table.col-sm-12(st-table='metadata')
                 tbody
                     tr(ng-repeat='row in metadata track by row._id')
                         td.col-sm-6(ng-class='{active: row._id == selectedItem._id}')
                             a(ng-click='selectItem(row)') {{$index + 1}}) {{row.name}}
-        button.btn.btn-primary(ng-click='createItem()' ng-disabled='!create.template') &nbspAdd metadata
+        button.btn.btn-primary(ng-click='createItem()') &nbspAdd metadata
         label(style='margin-left: 15px; margin-right: 10px') for:
-        button.btn.btn-default(ng-init='create.template = templates[0].value' ng-model='create.template' data-template='/select' data-placeholder='Choose metadata type' bs-options='item.value as item.label for item in templates' bs-select)
+        button.btn.btn-default(ng-model='template' data-template='/select' data-placeholder='Choose metadata type' bs-options='item.value as item.label for item in templates' bs-select)
         i.tiplabel.fa.fa-question-circle(bs-tooltip data-title='{{joinTip(templateTip)}}' type='button')
         hr
         form.form-horizontal(name='inputForm' ng-if='backupItem' novalidate)

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/views/configuration/sidebar.jade
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/views/configuration/sidebar.jade b/modules/web-control-center/nodejs/views/configuration/sidebar.jade
index a1aa1e0..83362ed 100644
--- a/modules/web-control-center/nodejs/views/configuration/sidebar.jade
+++ b/modules/web-control-center/nodejs/views/configuration/sidebar.jade
@@ -24,23 +24,15 @@ mixin sidebar-item(ref, num, txt)
                 i.fa.fa-stack-1x #{num}
             | #{txt}
 
-mixin sidebar-subitem(ref, txt)
-    li
-        a(style='font-size: 16px' ng-class='{active: isActive("#{ref}")}' href='#{ref}')
-            span.fa-stack
-                i.fa.fa-stack-2x
-            | #{txt}
-
 block container
     .row
         .col-sm-2.border-right.section-left.greedy
             .sidebar-nav
                 ul.menu(ng-controller='activeLink')
                     +sidebar-item('/configuration/clusters', 1, 'Clusters')
-                    +sidebar-item('/configuration/caches', 2, 'Caches')
-                    //+sidebar-subitem('/configuration/metadata', 'Metadata')
-                    //+sidebar-subitem('/configuration/persistence', 'Persistence')
-                    +sidebar-item('/configuration/summary', 3, 'Summary')
+                    +sidebar-item('/configuration/metadata', 2, 'Metadata')
+                    +sidebar-item('/configuration/caches', 3, 'Caches')
+                    +sidebar-item('/configuration/summary', 4, 'Summary')
 
         .col-sm-10.border-left.section-right
             .docs-content

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/views/configuration/summary.jade
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/views/configuration/summary.jade b/modules/web-control-center/nodejs/views/configuration/summary.jade
index bbb1331..a827511 100644
--- a/modules/web-control-center/nodejs/views/configuration/summary.jade
+++ b/modules/web-control-center/nodejs/views/configuration/summary.jade
@@ -35,6 +35,8 @@ block content
         h1 Configurations summary
         hr
     .docs-body(ng-controller='summaryController')
+        .block-callout
+            p(ng-bind-html='joinTip(screenTip)')
         div(ng-show='clusters.length == 0')
             | No cluster configured. You can&nbsp;
             a(href='clusters') configure

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/e70a7154/modules/web-control-center/nodejs/views/includes/controls.jade
----------------------------------------------------------------------
diff --git a/modules/web-control-center/nodejs/views/includes/controls.jade b/modules/web-control-center/nodejs/views/includes/controls.jade
index 3256f57..409f52f 100644
--- a/modules/web-control-center/nodejs/views/includes/controls.jade
+++ b/modules/web-control-center/nodejs/views/includes/controls.jade
@@ -97,26 +97,27 @@ mixin form-row
     - var fieldMdl = 'getModel(backupItem, field.path)[field.model]';
     - var fieldCommon = {'ng-model': fieldMdl, 'ng-required': 'field.required || required(field)'};
     - var fieldRequiredClass = '{true: "required"}[field.required || required(field)]'
+    - var fieldHide = '{{field.hide}}'
 
     div(ng-switch='field.type')
-        div.checkbox.col-sm-6(ng-switch-when='check')
+        div.checkbox.col-sm-6(ng-switch-when='check' ng-hide=fieldHide)
             label
                 input(type='checkbox')&attributes(fieldCommon)
                 | {{field.label}}
                 +tipLabel('field.tip')
-        div(ng-switch-when='text')
+        div(ng-switch-when='text' ng-hide=fieldHide)
             label(class=lblClasses ng-class=fieldRequiredClass) {{field.label}}:
             .col-sm-4
                 +tipField('field.tip')
                 .input-tip
                     input.form-control(type='text' placeholder='{{field.placeholder}}')&attributes(fieldCommon)
-        div(ng-switch-when='password')
+        div(ng-switch-when='password' ng-hide=fieldHide)
             label(class=lblClasses ng-class=fieldRequiredClass) {{field.label}}:
             .col-sm-4
                 +tipField('field.tip')
                 .input-tip
                     input.form-control(type='password' placeholder='{{field.placeholder}}')&attributes(fieldCommon)
-        div(ng-switch-when='number' ng-hide='{{field.hide}}')
+        div(ng-switch-when='number' ng-hide=fieldHide)
             label(class=lblClasses ng-class=fieldRequiredClass) {{field.label}}:
             .col-sm-4
                 +tipField('field.tip')
@@ -125,20 +126,20 @@ mixin form-row
                     +exclamation('{{field.model}}', 'min', 'Value is less than allowable minimum.')
                     +exclamation('{{field.model}}', 'max', 'Value is more than allowable maximum.')
                     +exclamation('{{field.model}}', 'number', 'Invalid value. Only numbers allowed.')
-        div(ng-switch-when='dropdown' ng-hide='{{field.hide}}')
+        div(ng-switch-when='dropdown' ng-hide=fieldHide)
             label(class=lblClasses ng-class=fieldRequiredClass) {{field.label}}:
             .col-sm-4
                 +tipField('field.tip')
                 .input-tip
                     button.form-control(bs-select data-placeholder='{{field.placeholder}}' bs-options='item.value as item.label for item in {{field.items}}')&attributes(fieldCommon)
-        div(ng-switch-when='dropdown-multiple' ng-hide='{{field.hide}}')
+        div(ng-switch-when='dropdown-multiple' ng-hide=fieldHide)
             label(class=lblClasses ng-class=fieldRequiredClass) {{field.label}}:
             .col-sm-4
                 +tipField('field.tip')
                 .input-tip
                     button.form-control(bs-select ng-disabled='{{field.items}}.length == 0' data-multiple='1' data-placeholder='{{field.placeholder}}' bs-options='item.value as item.label for item in {{field.items}}')&attributes(fieldCommon)
             a.customize(ng-show='field.addLink' ng-href='{{field.addLink.ref}}') {{field.addLink.label}}
-        div(ng-switch-when='dropdown-details' ng-hide='{{field.hide}}')
+        div(ng-switch-when='dropdown-details' ng-hide=fieldHide)
             - var expanded = 'field.details[' + fieldMdl + '].expanded'
 
             label(class=lblClasses ng-class=fieldRequiredClass) {{field.label}}:
@@ -150,7 +151,7 @@ mixin form-row
             .col-sm-6.panel-details(ng-show='#{expanded} && #{fieldMdl}')
                 .details-row(ng-repeat='detail in field.details[#{fieldMdl}].fields')
                     +details-row
-        div(ng-switch-when='table-simple')&attributes(fieldCommon)
+        div(ng-switch-when='table-simple' ng-hide=fieldHide)&attributes(fieldCommon)
             div
                 label.table-header {{field.label}}:
                 +tipLabel('field.tableTip')
@@ -174,7 +175,7 @@ mixin form-row
                 +tipField('field.tip')
                 .input-tip
                     input.form-control(type='text' ng-model='newValue' ng-focus='field.editIdx = -1'  placeholder='{{field.placeholder}}')
-        div(ng-switch-when='fieldsMetadata')&attributes(fieldCommon)
+        div(ng-switch-when='fieldsMetadata' ng-hide=fieldHide)&attributes(fieldCommon)
             div
                 label.table-header {{field.label}}:
                 +tipLabel('field.tableTip')
@@ -198,7 +199,7 @@ mixin form-row
                 +tipField('field.tip')
                 .input-tip
                     input.form-control(type='text' ng-model='newValue' ng-focus='field.editIdx = -1'  placeholder='{{field.placeholder}}')
-        div(ng-switch-when='groupsMetadata')&attributes(fieldCommon)
+        div(ng-switch-when='groupsMetadata' ng-hide=fieldHide)&attributes(fieldCommon)
             div
                 label.table-header {{field.label}}:
                 +tipLabel('field.tableTip')