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/10 12:32:29 UTC

incubator-ignite git commit: IGNITE-843 Reworked borders for tables.

Repository: incubator-ignite
Updated Branches:
  refs/heads/ignite-843 cb92fea18 -> 1bf469633


IGNITE-843 Reworked borders for 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/1bf46963
Tree: http://git-wip-us.apache.org/repos/asf/incubator-ignite/tree/1bf46963
Diff: http://git-wip-us.apache.org/repos/asf/incubator-ignite/diff/1bf46963

Branch: refs/heads/ignite-843
Commit: 1bf4696336fa28edcb49a29a88a25ce928c249df
Parents: cb92fea
Author: AKuznetsov <ak...@gridgain.com>
Authored: Mon Aug 10 17:32:37 2015 +0700
Committer: AKuznetsov <ak...@gridgain.com>
Committed: Mon Aug 10 17:32:37 2015 +0700

----------------------------------------------------------------------
 .../main/js/controllers/models/metadata.json    |   2 +-
 .../src/main/js/public/stylesheets/style.scss   |  61 ++++--
 .../src/main/js/views/includes/controls.jade    | 187 ++++++++++---------
 .../src/main/js/views/settings/profile.jade     |   2 +-
 4 files changed, 146 insertions(+), 106 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/1bf46963/modules/control-center-web/src/main/js/controllers/models/metadata.json
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/controllers/models/metadata.json b/modules/control-center-web/src/main/js/controllers/models/metadata.json
index 2d6a593..0ce50d8 100644
--- a/modules/control-center-web/src/main/js/controllers/models/metadata.json
+++ b/modules/control-center-web/src/main/js/controllers/models/metadata.json
@@ -25,7 +25,7 @@
   ],
   "metadata": [
     {
-      "label": "Metadata Common",
+      "label": "Metadata common",
       "tip": [
         "Metadata properties common to Query and Store."
       ],

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/1bf46963/modules/control-center-web/src/main/js/public/stylesheets/style.scss
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/public/stylesheets/style.scss b/modules/control-center-web/src/main/js/public/stylesheets/style.scss
index 993d0ab..791ee81 100644
--- a/modules/control-center-web/src/main/js/public/stylesheets/style.scss
+++ b/modules/control-center-web/src/main/js/public/stylesheets/style.scss
@@ -614,10 +614,6 @@ h1.ignite-logo {
     display: block;
     margin: 10px 0;
 
-    label.table-header {
-        line-height: $input-height;
-    }
-
     [class*="col-"] {
         display: inline-block;
         vertical-align: middle;
@@ -735,20 +731,31 @@ button .caret, .btn .caret {
     }
 
     a {
-        color: #666;
+        color: black;
     }
 }
 
 .theme-line table.links-edit {
     @extend table.links;
 
-    margin-top: 5px;
+    margin-top: 0;
     margin-bottom: 5px;
 
     label {
         line-height: $input-height;
         color: #666;
     }
+
+    td {
+        padding-left: 0;
+    }
+}
+
+.theme-line table.links-edit-sub {
+    @extend table.links-edit;
+
+    margin-top: 0;
+    margin-bottom: 0;
 }
 
 .theme-line table.links-edit-details {
@@ -770,11 +777,6 @@ button .caret, .btn .caret {
     }
 }
 
-.zzz {
-    color: $ignite-red;
-    font-weight: bold;
-}
-
 .theme-line table.admin {
     tr:hover {
         cursor: default;
@@ -863,6 +865,31 @@ button .caret, .btn .caret {
     padding-right: 5px;
 }
 
+.fieldset {
+    border-radius: 5px;
+    border: thin dotted lightgrey;
+
+    text-align: left;
+}
+
+.legend {
+    top: -10px;
+    margin-left: 10px;
+    margin-right: 10px;
+    background: white;
+    overflow: visible;
+    position: relative;
+}
+
+.legend-btn {
+    float: right;
+    line-height: 20px;
+}
+
+.fieldset-content {
+    margin: 0 10px 5px 10px;
+}
+
 .tooltip.right .tooltip-arrow {
     border-right-color: $ignite-red;
 }
@@ -1066,6 +1093,14 @@ input.ng-dirty.ng-invalid, button.ng-dirty.ng-invalid {
     }
 }
 
+input.ng-untouched.ng-invalid, button.ng-untouched.ng-invalid {
+    border-color: $ignite-red;
+
+    :focus {
+        border-color: $ignite-red;
+    }
+}
+
 .form-control-feedback {
     display: inline-block;
     color: $ignite-red;
@@ -1128,6 +1163,10 @@ a {
     margin-bottom: 20px;
 }
 
+.margin-left-dflt {
+    margin-left: 10px;
+}
+
 .margin-top-dflt {
     margin-top: 10px;
 }

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/1bf46963/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 4c6f0bb..3b0f10a 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
@@ -41,6 +41,9 @@ mixin btn-save(show, click)
     i.tipField.fa.fa-floppy-o(ng-show=show ng-click=click bs-tooltip data-title='Save item' data-trigger='hover')
 
 mixin btn-add(click, tip, focusId)
+    i.legend-btn.fa.fa-plus(ng-click=click bs-tooltip=tip event-focus=focusId)
+
+mixin btn-add2(click, tip, focusId)
     i.tipField.fa.fa-plus(ng-click=click bs-tooltip=tip event-focus=focusId)
 
 mixin btn-remove(click, tip)
@@ -77,12 +80,13 @@ mixin table-pair-edit(keyModel, valModel, keyPlaceholder, valPlaceholder, keyJav
                 input.form-control(id=focusIdVal type='text' ng-model=valModel placeholder=valPlaceholder on-enter=btnVisibleAndSave on-escape='tableReset()')
 
 mixin table-pair(header, tblMdl, keyFld, valFld, keyPlaceholder, valPlaceholder, keyJavaBuildInTypes, valueJavaBuildInTypes)
-    .col-sm-7.table-details
-        label.table-header #{header}:
-        +tipLabel('field.tip')
-        +btn-add('tableNewItem(field)', 'field.addTip', 'newKey{{::field.focusId}}')
-        div(ng-show='(#{tblMdl} && #{tblMdl}.length > 0) || tableNewItemActive(field)')
-            table.links-edit.col-sm-12(st-table=tblMdl)
+    .col-sm-7.fieldset
+        .legend
+            label #{header}:
+            +tipLabel('field.tip')
+            +btn-add('tableNewItem(field)', 'field.addTip', 'newKey{{::field.focusId}}')
+        .fieldset-content(ng-show='(#{tblMdl} && #{tblMdl}.length > 0) || tableNewItemActive(field)')
+            table.col-sm-12.links-edit(st-table=tblMdl)
                 tbody
                     tr(ng-repeat='item in #{tblMdl}')
                         td.col-sm-12
@@ -141,7 +145,7 @@ mixin details-row
                     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.table-header {{::detail.label}}:
+                label {{::detail.label}}:
                 +tipLabel('detail.tableTip')
             table.col-sm-12.links-edit-details(st-table='#{detailMdl}')
                 tbody
@@ -287,97 +291,94 @@ mixin form-row-custom(lblClasses, fieldClasses, dataSource)
                 .details-row(ng-repeat='detail in field.details[#{fieldMdl}].fields')
                     +details-row
         div(ng-switch-when='table-simple' ng-hide=fieldHide)&attributes(fieldCommon)
-            .col-sm-7.table-details
-                label.table-header {{::field.label}}:
-                +tipLabel('field.tableTip')
-                +btn-add('tableNewItem(field)', 'field.addTip', 'new{{::field.focusId}}')
-            .col-sm-12(ng-show='(#{fieldMdl} && #{fieldMdl}.length > 0) || tableNewItemActive(field)')
-                .col-sm-7
-                    div
-                        table.links-edit.col-sm-12(st-table='#{fieldMdl}')
-                            tbody
-                                tr(ng-repeat='item in #{fieldMdl} track by $index')
-                                    td.col-sm-12
-                                        div(ng-show='!tableEditing(field, $index)')
-                                            a.labelFormField(event-focus='cur{{::field.focusId}}' ng-click='curValue = tableStartEdit(backupItem, field, $index)') {{$index + 1}}) {{item | compact}}
-                                            +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(curValue)', 'tableSimpleSave(tableSimpleValid, backupItem, field, curValue, $index)')
-                                            .input-tip
-                                                input.form-control(id='cur{{::field.focusId}}' type='text' ng-model='curValue' placeholder='{{::field.placeholder}}' on-enter='tableSimpleSaveVisible(curValue) && tableSimpleSave(tableSimpleValid, backupItem, field, curValue, $index)' on-escape='tableReset()')
-                            tfoot(ng-show='tableNewItemActive(field)')
-                                tr
-                                    td.col-sm-12
-                                        +btn-save('tableSimpleSaveVisible(newValue)', 'tableSimpleSave(tableSimpleValid, backupItem, field, newValue, -1)')
+            .col-sm-7.fieldset
+                .legend
+                    label {{::field.label}}:
+                    +tipLabel('field.tableTip')
+                    +btn-add('tableNewItem(field)', 'field.addTip', 'new{{::field.focusId}}')
+                .fieldset-content(ng-show='(#{fieldMdl} && #{fieldMdl}.length > 0) || tableNewItemActive(field)')
+                    table.col-sm-12.links-edit(st-table='#{fieldMdl}')
+                        tbody
+                            tr(ng-repeat='item in #{fieldMdl} track by $index')
+                                td
+                                    div(ng-show='!tableEditing(field, $index)')
+                                        a.labelFormField(event-focus='cur{{::field.focusId}}' ng-click='curValue = tableStartEdit(backupItem, field, $index)') {{$index + 1}}) {{item | compact}}
+                                        +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(curValue)', 'tableSimpleSave(tableSimpleValid, backupItem, field, curValue, $index)')
                                         .input-tip
-                                            input.form-control(id='new{{::field.focusId}}' type='text' ng-model='newValue' placeholder='{{::field.placeholder}}' on-enter='tableSimpleSaveVisible(newValue) && tableSimpleSave(tableSimpleValid, backupItem, field, newValue, -1)' on-escape='tableReset()')
+                                            input.form-control(id='cur{{::field.focusId}}' type='text' ng-model='curValue' placeholder='{{::field.placeholder}}' on-enter='tableSimpleSaveVisible(curValue) && tableSimpleSave(tableSimpleValid, backupItem, field, curValue, $index)' on-escape='tableReset()')
+                        tfoot(ng-show='tableNewItemActive(field)')
+                            tr
+                                td
+                                    +btn-save('tableSimpleSaveVisible(newValue)', 'tableSimpleSave(tableSimpleValid, backupItem, field, newValue, -1)')
+                                    .input-tip
+                                        input.form-control(id='new{{::field.focusId}}' type='text' ng-model='newValue' placeholder='{{::field.placeholder}}' on-enter='tableSimpleSaveVisible(newValue) && tableSimpleSave(tableSimpleValid, backupItem, field, newValue, -1)' on-escape='tableReset()')
         div(ng-switch-when='indexedTypes')
             +table-pair('Index key-value type pairs', fieldMdl, 'keyClass', 'valueClass', 'Key class full name', 'Value class full name', true, false)
         div(ng-switch-when='queryFields' ng-hide=fieldHide)
             +table-pair('{{::field.label}}', fieldMdl, 'name', 'className', 'Field name', 'Field class full name', false, true)
         div(ng-switch-when='dbFields' ng-hide=fieldHide)
-            .col-sm-7.table-details
-                label.table-header {{::field.label}}:
-                +tipLabel('field.tip')
-                +btn-add('tableNewItem(field)', 'field.addTip', 'newDatabaseName{{::field.focusId}}')
-            .col-sm-12(ng-show='(#{fieldMdl} && #{fieldMdl}.length > 0) || tableNewItemActive(field)')
-                .col-sm-7
-                    div
-                        table.links-edit.col-sm-12(st-table=fieldMdl)
-                            tbody
-                                tr(ng-repeat='item in #{fieldMdl}')
-                                    td.col-sm-12
-                                        div(ng-show='!tableEditing(field, $index)')
-                                            a.labelFormField(event-focus='curDatabaseName{{::field.focusId}}' ng-click='curField = tableStartEdit(backupItem, field, $index); curDatabaseName = curField.databaseName; curDatabaseType = curField.databaseType; curJavaName = curField.javaName; curJavaType = curField.javaType') {{$index + 1}}) {{item.databaseName}} / {{item.databaseType}} / {{item.javaName}} / {{item.javaType}}
+            .col-sm-7.fieldset
+                .legend
+                    label {{::field.label}}:
+                    +tipLabel('field.tip')
+                    +btn-add('tableNewItem(field)', 'field.addTip', 'newDatabaseName{{::field.focusId}}')
+                .fieldset-content(ng-show='(#{fieldMdl} && #{fieldMdl}.length > 0) || tableNewItemActive(field)')
+                    table.col-sm-12.links-edit(st-table=fieldMdl)
+                        tbody
+                            tr(ng-repeat='item in #{fieldMdl}')
+                                td.col-sm-12
+                                    div(ng-show='!tableEditing(field, $index)')
+                                        a.labelFormField(event-focus='curDatabaseName{{::field.focusId}}' ng-click='curField = tableStartEdit(backupItem, field, $index); curDatabaseName = curField.databaseName; curDatabaseType = curField.databaseType; curJavaName = curField.javaName; curJavaType = curField.javaType') {{$index + 1}}) {{item.databaseName}} / {{item.databaseType}} / {{item.javaName}} / {{item.javaType}}
+                                        +btn-remove('tableRemove(backupItem, field, $index)', 'field.removeTip')
+                                    div(ng-if='tableEditing(field, $index)')
+                                        +table-db-field-edit('curDatabaseName', 'curDatabaseType', 'curJavaName', 'curJavaType', '{{::field.focusId}}', '$index')
+                        tfoot(ng-show='tableNewItemActive(field)')
+                            tr
+                                td.col-sm-12(ng-init='newDatabaseType="INTEGER"; newJavaType="Integer"')
+                                    +table-db-field-edit('newDatabaseName', 'newDatabaseType', 'newJavaName', 'newJavaType', '{{::field.focusId}}', '-1')
+        div(ng-switch-when='queryGroups' ng-hide=fieldHide)
+            .col-sm-7.fieldset
+                .legend
+                    label {{::field.label}}:
+                    +tipLabel('field.tip')
+                    +btn-add('tableNewItem(field)', 'field.addTip', 'newGroupName')
+                .fieldset-content(ng-show='(#{fieldMdl} && #{fieldMdl}.length > 0) || tableNewItemActive(field)')
+                    table.links-edit.col-sm-12(st-table=fieldMdl ng-init='newDirection = false')
+                        tbody
+                            tr(ng-repeat='group in #{fieldMdl}')
+                                td.col-sm-12
+                                    div
+                                        .col-sm-12(ng-show='!tableEditing(field, $index)')
+                                            a.labelFormField(event-focus='curGroupName' ng-click='curGroup = tableStartEdit(backupItem, field, $index); curGroupName = curGroup.name; curFields = curGroup.fields') {{$index + 1}}) {{group.name}}
                                             +btn-remove('tableRemove(backupItem, field, $index)', 'field.removeTip')
+                                            +btn-add2('tableGroupNewItem($index)', 'field.addItemTip', 'newFieldName')
                                         div(ng-if='tableEditing(field, $index)')
-                                            +table-db-field-edit('curDatabaseName', 'curDatabaseType', 'curJavaName', 'curJavaType', '{{::field.focusId}}', '$index')
-                            tfoot(ng-show='tableNewItemActive(field)')
-                                tr
-                                    td.col-sm-12(ng-init='newDatabaseType="INTEGER"; newJavaType="Integer"')
-                                        +table-db-field-edit('newDatabaseName', 'newDatabaseType', 'newJavaName', 'newJavaType', '{{::field.focusId}}', '-1')
-        div(ng-switch-when='queryGroups' ng-hide=fieldHide)
-            .col-sm-7.table-details
-                label.table-header {{::field.label}}:
-                +tipLabel('field.tip')
-                +btn-add('tableNewItem(field)', 'field.addTip', 'newGroupName')
-            .col-sm-12(ng-show='(#{fieldMdl} && #{fieldMdl}.length > 0) || tableNewItemActive(field)')
-                .col-sm-7
-                    div
-                        table.links-edit.col-sm-12(st-table=fieldMdl ng-init='newDirection = false')
-                            tbody
-                                tr(ng-repeat='group in #{fieldMdl}')
-                                    td.col-sm-12
-                                        div
-                                            .col-sm-12(ng-show='!tableEditing(field, $index)')
-                                                a.labelFormField(event-focus='curGroupName' ng-click='curGroup = tableStartEdit(backupItem, field, $index); curGroupName = curGroup.name; curFields = curGroup.fields') {{$index + 1}}) {{group.name}}
-                                                +btn-remove('tableRemove(backupItem, field, $index)', 'field.removeTip')
-                                                +btn-add('tableGroupNewItem($index)', 'field.addItemTip', 'newFieldName')
-                                            div(ng-if='tableEditing(field, $index)')
-                                                label.labelField {{$index + 1}})
-                                                +btn-save('tableGroupSaveVisible(curGroupName)', 'tableGroupSave(curGroupName, $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()')
-                                            div
-                                                table.links-edit.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(event-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"}}
-                                                                    +btn-remove('tableRemoveGroupItem(group, $index)', 'field.removeItemTip')
-                                                                div(ng-if='tableGroupItemEditing(groupIndex, $index)')
-                                                                    +table-group-item-edit('curFieldName', 'curClassName', 'curDirection', '$index')
-                                                    tfoot(ng-if='tableGroupNewItemActive(groupIndex)')
-                                                        tr.col-sm-12(style='padding-left: 18px')
-                                                            td
-                                                                +table-group-item-edit('newFieldName', 'newClassName', 'newDirection', '-1')
-                            tfoot(ng-show='tableNewItemActive(field)')
-                                tr
-                                    td.col-sm-12
-                                        +btn-save('tableGroupSaveVisible(newGroupName)', 'tableGroupSave(newGroupName, -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()')
+                                            label.labelField {{$index + 1}})
+                                            +btn-save('tableGroupSaveVisible(curGroupName)', 'tableGroupSave(curGroupName, $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()')
+                                        .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(event-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"}}
+                                                                +btn-remove('tableRemoveGroupItem(group, $index)', 'field.removeItemTip')
+                                                            div(ng-if='tableGroupItemEditing(groupIndex, $index)')
+                                                                +table-group-item-edit('curFieldName', 'curClassName', 'curDirection', '$index')
+                                                tfoot(ng-if='tableGroupNewItemActive(groupIndex)')
+                                                    tr.col-sm-12(style='padding-left: 18px')
+                                                        td
+                                                            +table-group-item-edit('newFieldName', 'newClassName', 'newDirection', '-1')
+                        tfoot(ng-show='tableNewItemActive(field)')
+                            tr
+                                td.col-sm-12
+                                    +btn-save('tableGroupSaveVisible(newGroupName)', 'tableGroupSave(newGroupName, -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()')

http://git-wip-us.apache.org/repos/asf/incubator-ignite/blob/1bf46963/modules/control-center-web/src/main/js/views/settings/profile.jade
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/views/settings/profile.jade b/modules/control-center-web/src/main/js/views/settings/profile.jade
index 6ddcafa..b2ca05b 100644
--- a/modules/control-center-web/src/main/js/views/settings/profile.jade
+++ b/modules/control-center-web/src/main/js/views/settings/profile.jade
@@ -44,7 +44,7 @@ block container
                                 label
                                     input(type='checkbox' ng-model='profileUser.changePassword')
                                     | Change password
-                        div(ng-show='profileUser.changePassword')
+                        div(ng-if='profileUser.changePassword')
                             .details-row
                                 +lbl('New password:')
                                 .col-sm-4