http://git-wip-us.apache.org/repos/asf/ignite/blob/d24dab81/modules/web-console/frontend/app/modules/states/configuration/caches/general.pug
----------------------------------------------------------------------
diff --git 
a/modules/web-console/frontend/app/modules/states/configuration/caches/general.pug
 
b/modules/web-console/frontend/app/modules/states/configuration/caches/general.pug
index df4d3f8..29977be 100644
--- 
a/modules/web-console/frontend/app/modules/states/configuration/caches/general.pug
+++ 
b/modules/web-console/frontend/app/modules/states/configuration/caches/general.pug
@@ -19,99 +19,95 @@ include /app/helpers/jade/mixins
 -var form = 'general'
 -var model = '$ctrl.clonedCache'
 
-.pca-panel(ng-form=form novalidate)
-    .pca-panel-heading(bs-collapse-toggle)
-        ignite-form-panel-chevron
-        .pca-panel-heading-title General
-        .pca-panel-heading-description
-            | Common cache configuration. 
-            
a.link-success(href="https://apacheignite.readme.io/docs/data-grid"; 
target="_blank") More info
-    .pca-panel-collapse(role='tabpanel' bs-collapse-target id='general')
-        .pca-panel-body.pca-form-row
-            .pca-form-column-6.pc-form-grid-row
-                
-                .pc-form-grid-col-60
-                    +sane-ignite-form-field-text({
-                        label: 'Name:',
-                        model: `${model}.name`,
-                        name: '"cacheName"',
-                        placeholder: 'Input name',
-                        required: true
-                    })(
-                        ignite-unique='$ctrl.caches'
-                        ignite-unique-property='name'
-                        ignite-unique-skip=`["_id", ${model}]`
-                    )
-                        +unique-feedback(`${model}.name`, 'Cache name should 
be unique')
-                .pc-form-grid-col-60
-                    +sane-ignite-form-field-dropdown({
-                        label: 'Domain models:',
-                        model: `${model}.domains`,
-                        name: '"domains"',
-                        multiple: true,
-                        placeholder: 'Choose domain models',
-                        placeholderEmpty: 'No valid domain models configured',
-                        options: '$ctrl.modelsMenu',
-                        tip: 'Select domain models to describe types in cache'
-                    })
-                .pc-form-grid-col-60(ng-if='$ctrl.available("2.1.0")')
-                    +text('Group:', `${model}.groupName`, '"groupName"', 
'false', 'Input group name',
-                        'Cache group name.<br/>\
-                        Caches with the same group name share single 
underlying "physical" cache (partition set), but are logically isolated.')
-                .pc-form-grid-col-30
-                    +cacheMode('Mode:', `${model}.cacheMode`, '"cacheMode"', 
'PARTITIONED')
+panel-collapsible(opened=`::true` ng-form=form)
+    panel-title General
+    panel-description
+        | Common cache configuration. 
+        a.link-success(href="https://apacheignite.readme.io/docs/data-grid"; 
target="_blank") More info
+    panel-content.pca-form-row
+        .pca-form-column-6.pc-form-grid-row
+            .pc-form-grid-col-60
+                +sane-ignite-form-field-text({
+                    label: 'Name:',
+                    model: `${model}.name`,
+                    name: '"cacheName"',
+                    placeholder: 'Input name',
+                    required: true
+                })(
+                    ignite-unique='$ctrl.caches'
+                    ignite-unique-property='name'
+                    ignite-unique-skip=`["_id", ${model}]`
+                )
+                    +unique-feedback(`${model}.name`, 'Cache name should be 
unique')
+            .pc-form-grid-col-60
+                +sane-ignite-form-field-dropdown({
+                    label: 'Domain models:',
+                    model: `${model}.domains`,
+                    name: '"domains"',
+                    multiple: true,
+                    placeholder: 'Choose domain models',
+                    placeholderEmpty: 'No valid domain models configured',
+                    options: '$ctrl.modelsMenu',
+                    tip: 'Select domain models to describe types in cache'
+                })
+            .pc-form-grid-col-60(ng-if='$ctrl.available("2.1.0")')
+                +text('Group:', `${model}.groupName`, '"groupName"', 'false', 
'Input group name',
+                    'Cache group name.<br/>\
+                    Caches with the same group name share single underlying 
"physical" cache (partition set), but are logically isolated.')
+            .pc-form-grid-col-30
+                +cacheMode('Mode:', `${model}.cacheMode`, '"cacheMode"', 
'PARTITIONED')
 
-                .pc-form-grid-col-30
-                    +dropdown('Atomicity:', `${model}.atomicityMode`, 
'"atomicityMode"', 'true', 'ATOMIC',
-                        '[\
-                            {value: "ATOMIC", label: "ATOMIC"},\
-                            {value: "TRANSACTIONAL", label: "TRANSACTIONAL"}\
-                        ]',
-                        'Atomicity:\
-                        <ul>\
-                            <li>ATOMIC - in this mode distributed transactions 
and distributed locking are not supported</li>\
-                            <li>TRANSACTIONAL - in this mode specified fully 
ACID-compliant transactional cache behavior</li>\
-                        </ul>')
-                .pc-form-grid-col-30(ng-is=`${model}.cacheMode === 
'PARTITIONED'`)
-                    +number('Backups:', `${model}.backups`, '"backups"', 
'true', '0', '0', 'Number of nodes used to back up single partition for 
partitioned cache')
-                //- Since ignite 2.0
-                .pc-form-grid-col-30(ng-if='$ctrl.available("2.0.0")')
-                    +dropdown('Partition loss policy:', 
`${model}.partitionLossPolicy`, '"partitionLossPolicy"', 'true', 'IGNORE',
+            .pc-form-grid-col-30
+                +dropdown('Atomicity:', `${model}.atomicityMode`, 
'"atomicityMode"', 'true', 'ATOMIC',
                     '[\
-                        {value: "READ_ONLY_SAFE", label: "READ_ONLY_SAFE"},\
-                        {value: "READ_ONLY_ALL", label: "READ_ONLY_ALL"},\
-                        {value: "READ_WRITE_SAFE", label: "READ_WRITE_SAFE"},\
-                        {value: "READ_WRITE_ALL", label: "READ_WRITE_ALL"},\
-                        {value: "IGNORE", label: "IGNORE"}\
+                        {value: "ATOMIC", label: "ATOMIC"},\
+                        {value: "TRANSACTIONAL", label: "TRANSACTIONAL"}\
                     ]',
-                    'Partition loss policies:\
+                    'Atomicity:\
                     <ul>\
-                        <li>READ_ONLY_SAFE - in this mode all writes to the 
cache will be failed with an exception,\
-                            reads will only be allowed for keys in  non-lost 
partitions.\
-                            Reads from lost partitions will be failed with an 
exception.</li>\
-                        <li>READ_ONLY_ALL - in this mode all writes to the 
cache will be failed with an exception.\
-                            All reads will proceed as if all partitions were 
in a consistent state.\
-                            The result of reading from a lost partition is 
undefined and may be different on different nodes in the cluster.</li>\
-                        <li>READ_WRITE_SAFE - in this mode all reads and 
writes will be allowed for keys in valid partitions.\
-                            All reads and writes for keys in lost partitions 
will be failed with an exception.</li>\
-                        <li>READ_WRITE_ALL - in this mode all reads and writes 
will proceed as if all partitions were in a consistent state.\
-                            The result of reading from a lost partition is 
undefined and may be different on different nodes in the cluster.</li>\
-                        <li>IGNORE - in this mode if partition is lost, reset 
it state and do not clear intermediate data.\
-                            The result of reading from a previously lost and 
not cleared partition is undefined and may be different\
-                            on different nodes in the cluster.</li>\
+                        <li>ATOMIC - in this mode distributed transactions and 
distributed locking are not supported</li>\
+                        <li>TRANSACTIONAL - in this mode specified fully 
ACID-compliant transactional cache behavior</li>\
                     </ul>')
-                .pc-form-grid-col-60(ng-show=`${model}.cacheMode === 
'PARTITIONED' && ${model}.backups`)
-                    +checkbox('Read from backup', `${model}.readFromBackup`, 
'"readFromBackup"',
-                        'Flag indicating whether data can be read from 
backup<br/>\
-                        If not set then always get data from primary node 
(never from backup)')
-                .pc-form-grid-col-60
-                    +checkbox('Copy on read', `${model}.copyOnRead`, 
'"copyOnRead"',
-                        'Flag indicating whether copy of the value stored in 
cache should be created for cache operation implying return value<br/>\
-                        Also if this flag is set copies are created for values 
passed to CacheInterceptor and to CacheEntryProcessor')
-                .pc-form-grid-col-60(ng-show=`${model}.cacheMode === 
'PARTITIONED' && ${model}.atomicityMode === 'TRANSACTIONAL'`)
-                    +checkbox('Invalidate near cache', 
`${model}.isInvalidate`, '"isInvalidate"',
-                        'Invalidation flag for near cache entries in 
transaction<br/>\
-                        If set then values will be invalidated (nullified) 
upon commit in near cache')
+            .pc-form-grid-col-30(ng-is=`${model}.cacheMode === 'PARTITIONED'`)
+                +number('Backups:', `${model}.backups`, '"backups"', 'true', 
'0', '0', 'Number of nodes used to back up single partition for partitioned 
cache')
+            //- Since ignite 2.0
+            .pc-form-grid-col-30(ng-if='$ctrl.available("2.0.0")')
+                +dropdown('Partition loss policy:', 
`${model}.partitionLossPolicy`, '"partitionLossPolicy"', 'true', 'IGNORE',
+                '[\
+                    {value: "READ_ONLY_SAFE", label: "READ_ONLY_SAFE"},\
+                    {value: "READ_ONLY_ALL", label: "READ_ONLY_ALL"},\
+                    {value: "READ_WRITE_SAFE", label: "READ_WRITE_SAFE"},\
+                    {value: "READ_WRITE_ALL", label: "READ_WRITE_ALL"},\
+                    {value: "IGNORE", label: "IGNORE"}\
+                ]',
+                'Partition loss policies:\
+                <ul>\
+                    <li>READ_ONLY_SAFE - in this mode all writes to the cache 
will be failed with an exception,\
+                        reads will only be allowed for keys in  non-lost 
partitions.\
+                        Reads from lost partitions will be failed with an 
exception.</li>\
+                    <li>READ_ONLY_ALL - in this mode all writes to the cache 
will be failed with an exception.\
+                        All reads will proceed as if all partitions were in a 
consistent state.\
+                        The result of reading from a lost partition is 
undefined and may be different on different nodes in the cluster.</li>\
+                    <li>READ_WRITE_SAFE - in this mode all reads and writes 
will be allowed for keys in valid partitions.\
+                        All reads and writes for keys in lost partitions will 
be failed with an exception.</li>\
+                    <li>READ_WRITE_ALL - in this mode all reads and writes 
will proceed as if all partitions were in a consistent state.\
+                        The result of reading from a lost partition is 
undefined and may be different on different nodes in the cluster.</li>\
+                    <li>IGNORE - in this mode if partition is lost, reset it 
state and do not clear intermediate data.\
+                        The result of reading from a previously lost and not 
cleared partition is undefined and may be different\
+                        on different nodes in the cluster.</li>\
+                </ul>')
+            .pc-form-grid-col-60(ng-show=`${model}.cacheMode === 'PARTITIONED' 
&& ${model}.backups`)
+                +checkbox('Read from backup', `${model}.readFromBackup`, 
'"readFromBackup"',
+                    'Flag indicating whether data can be read from backup<br/>\
+                    If not set then always get data from primary node (never 
from backup)')
+            .pc-form-grid-col-60
+                +checkbox('Copy on read', `${model}.copyOnRead`, 
'"copyOnRead"',
+                    'Flag indicating whether copy of the value stored in cache 
should be created for cache operation implying return value<br/>\
+                    Also if this flag is set copies are created for values 
passed to CacheInterceptor and to CacheEntryProcessor')
+            .pc-form-grid-col-60(ng-show=`${model}.cacheMode === 'PARTITIONED' 
&& ${model}.atomicityMode === 'TRANSACTIONAL'`)
+                +checkbox('Invalidate near cache', `${model}.isInvalidate`, 
'"isInvalidate"',
+                    'Invalidation flag for near cache entries in 
transaction<br/>\
+                    If set then values will be invalidated (nullified) upon 
commit in near cache')
 
-            .pca-form-column-6
-                +preview-xml-java(model, 'cacheGeneral')
+        .pca-form-column-6
+            +preview-xml-java(model, 'cacheGeneral')

http://git-wip-us.apache.org/repos/asf/ignite/blob/d24dab81/modules/web-console/frontend/app/modules/states/configuration/caches/memory.pug
----------------------------------------------------------------------
diff --git 
a/modules/web-console/frontend/app/modules/states/configuration/caches/memory.pug
 
b/modules/web-console/frontend/app/modules/states/configuration/caches/memory.pug
index bcb8cda..10eb488 100644
--- 
a/modules/web-console/frontend/app/modules/states/configuration/caches/memory.pug
+++ 
b/modules/web-console/frontend/app/modules/states/configuration/caches/memory.pug
@@ -19,143 +19,140 @@ include /app/helpers/jade/mixins
 -var form = 'memory'
 -var model = '$ctrl.clonedCache'
 
-.pca-panel(ng-form=form novalidate)
-    .pca-panel-heading(bs-collapse-toggle='' 
ng-click=`ui.loadPanel('${form}')`)
-        ignite-form-panel-chevron
-        .pca-panel-heading-title Memory
-        .pca-panel-heading-description
-            | Cache memory settings. 
-            a.link-success(
-                href="https://apacheignite.readme.io/v1.9/docs/off-heap-memory";
-                target="_blank"
-                ng-show='$ctrl.available(["1.0.0", "2.0.0"])'
-            ) More info
-            a.link-success(
-                href="https://apacheignite.readme.io/docs/evictions";
-                target="_blank"
-                ng-show='$ctrl.available("2.0.0")'
-            ) More info
-    .pca-panel-collapse(role='tabpanel' bs-collapse-target id=`${form}`)
-        .pca-panel-body.pca-form-row(ng-if=`ui.isPanelLoaded('${form}')`)
-            .pca-form-column-6.pc-form-grid-row
-                //- Since ignite 2.0
-                .pc-form-grid-col-60(ng-if='$ctrl.available("2.0.0")')
-                    +checkbox('Onheap cache enabled', model + 
'.onheapCacheEnabled', '"OnheapCacheEnabled"', 'Checks if the on-heap cache is 
enabled for the off-heap based page memory')
+panel-collapsible(ng-form=form on-open=`ui.loadPanel('${form}')`)
+    panel-title Memory
+    panel-description
+        | Cache memory settings. 
+        a.link-success(
+            href="https://apacheignite.readme.io/v1.9/docs/off-heap-memory";
+            target="_blank"
+            ng-show='$ctrl.available(["1.0.0", "2.0.0"])'
+        ) More info
+        a.link-success(
+            href="https://apacheignite.readme.io/docs/evictions";
+            target="_blank"
+            ng-show='$ctrl.available("2.0.0")'
+        ) More info
+    panel-content.pca-form-row(ng-if=`ui.isPanelLoaded('${form}')`)
+        .pca-form-column-6.pc-form-grid-row
+            //- Since ignite 2.0
+            .pc-form-grid-col-60(ng-if='$ctrl.available("2.0.0")')
+                +checkbox('Onheap cache enabled', model + 
'.onheapCacheEnabled', '"OnheapCacheEnabled"', 'Checks if the on-heap cache is 
enabled for the off-heap based page memory')
 
-                //- Since ignite 2.0 deprecated in ignite 2.3
-                .pc-form-grid-col-60(ng-if='$ctrl.available(["2.0.0", 
"2.3.0"])')
-                    +text('Memory policy name:', model + '.memoryPolicyName', 
'"MemoryPolicyName"', 'false', 'default',
-                        'Name of memory policy configuration for this cache')
+            //- Since ignite 2.0 deprecated in ignite 2.3
+            .pc-form-grid-col-60(ng-if='$ctrl.available(["2.0.0", "2.3.0"])')
+                +text('Memory policy name:', model + '.memoryPolicyName', 
'"MemoryPolicyName"', 'false', 'default',
+                    'Name of memory policy configuration for this cache')
 
-                //- Since ignite 2.3
-                .pc-form-grid-col-60(ng-if='$ctrl.available("2.3.0")')
-                    +text('Data region name:', model + '.dataRegionName', 
'"DataRegionName"', 'false', 'default',
-                        'Name of data region configuration for this cache')
+            //- Since ignite 2.3
+            .pc-form-grid-col-60(ng-if='$ctrl.available("2.3.0")')
+                +text('Data region name:', model + '.dataRegionName', 
'"DataRegionName"', 'false', 'default',
+                    'Name of data region configuration for this cache')
 
-                //- Removed in ignite 2.0
-                .pc-form-grid-col-60(ng-if-start='$ctrl.available(["1.0.0", 
"2.0.0"])')
-                    +sane-ignite-form-field-dropdown({
-                        label: 'Mode:',
-                        model: `${model}.memoryMode`,
-                        name: '"memoryMode"',
-                        placeholder: '{{ ::$ctrl.Caches.memoryMode.default }}',
-                        options: '::$ctrl.Caches.memoryModes',
-                        tip: `Memory modes control whether value is stored in 
on-heap memory, off-heap memory, or swap space
-                        <ul>
-                            <li>
-                                ONHEAP_TIERED - entries are cached on heap 
memory first<br/>
-                                <ul>
-                                    <li>
-                                        If offheap memory is enabled and 
eviction policy evicts an entry from heap memory, entry will be moved to 
offheap memory<br/>
-                                        If offheap memory is disabled, then 
entry is simply discarded
-                                    </li>
-                                    <li>
-                                        If swap space is enabled and offheap 
memory fills up, then entry will be evicted into swap space<br/>
-                                        If swap space is disabled, then entry 
will be discarded. If swap is enabled and offheap memory is disabled, then 
entry will be evicted directly from heap memory into swap
-                                    </li>
-                                </ul>
-                            </li>
-                            <li>
-                                OFFHEAP_TIERED - works the same as 
ONHEAP_TIERED, except that entries never end up in heap memory and get stored 
in offheap memory right away<br/>
-                                Entries get cached in offheap memory first and 
then get evicted to swap, if one is configured
-                            </li>
-                            <li>
-                                OFFHEAP_VALUES - entry keys will be stored on 
heap memory, and values will be stored in offheap memory<br/>
-                                Note that in this mode entries can be evicted 
only to swap
-                            </li>
-                        </ul>`
-                    })(
-                        ui-validate=`{
-                            offheapAndDomains: 
'$ctrl.Caches.memoryMode.offheapAndDomains(${model})'
-                        }`
-                        ui-validate-watch=`"${model}.domains.length"`
-                        ng-model-options='{allowInvalid: true}'
-                    )
-                        +form-field-feedback(null, 'offheapAndDomains', 'Query 
indexing could not be enabled while values are stored off-heap')
-                .pc-form-grid-col-60(ng-if=`${model}.memoryMode !== 
'OFFHEAP_VALUES'`)
-                    +sane-ignite-form-field-dropdown({
-                        label: 'Off-heap memory:',
-                        model: `${model}.offHeapMode`,
-                        name: '"offHeapMode"',
-                        required: 
`$ctrl.Caches.offHeapMode.required(${model})`,
-                        placeholder: '{{::$ctrl.Caches.offHeapMode.default}}',
-                        options: '{{::$ctrl.Caches.offHeapModes}}',
-                        tip: `Off-heap storage mode
-                        <ul>
-                            <li>Disabled - Off-heap storage is disabled</li>
-                            <li>Limited - Off-heap storage has limited 
size</li>
-                            <li>Unlimited - Off-heap storage grow infinitely 
(it is up to user to properly add and remove entries from cache to ensure that 
off-heap storage does not grow infinitely)</li>
-                        </ul>`
-                    })(
-                        ng-change=`$ctrl.Caches.offHeapMode.onChange(${model})`
-                        ui-validate=`{
-                            offheapDisabled: 
'$ctrl.Caches.offHeapMode.offheapDisabled(${model})'
-                        }`
-                        ui-validate-watch=`'${model}.memoryMode'`
-                        ng-model-options='{allowInvalid: true}'
-                    )
-                        +form-field-feedback(null, 'offheapDisabled', 
'Off-heap storage can\'t be disabled when memory mode is OFFHEAP_TIERED')
-                .pc-form-grid-col-60(
-                    ng-if=`${model}.offHeapMode === 1 && ${model}.memoryMode 
!== 'OFFHEAP_VALUES'`
-                    ng-if-end
+            //- Removed in ignite 2.0
+            .pc-form-grid-col-60(ng-if-start='$ctrl.available(["1.0.0", 
"2.0.0"])')
+                +sane-ignite-form-field-dropdown({
+                    label: 'Mode:',
+                    model: `${model}.memoryMode`,
+                    name: '"memoryMode"',
+                    placeholder: '{{ ::$ctrl.Caches.memoryMode.default }}',
+                    options: '::$ctrl.Caches.memoryModes',
+                    tip: `Memory modes control whether value is stored in 
on-heap memory, off-heap memory, or swap space
+                    <ul>
+                        <li>
+                            ONHEAP_TIERED - entries are cached on heap memory 
first<br/>
+                            <ul>
+                                <li>
+                                    If offheap memory is enabled and eviction 
policy evicts an entry from heap memory, entry will be moved to offheap 
memory<br/>
+                                    If offheap memory is disabled, then entry 
is simply discarded
+                                </li>
+                                <li>
+                                    If swap space is enabled and offheap 
memory fills up, then entry will be evicted into swap space<br/>
+                                    If swap space is disabled, then entry will 
be discarded. If swap is enabled and offheap memory is disabled, then entry 
will be evicted directly from heap memory into swap
+                                </li>
+                            </ul>
+                        </li>
+                        <li>
+                            OFFHEAP_TIERED - works the same as ONHEAP_TIERED, 
except that entries never end up in heap memory and get stored in offheap 
memory right away<br/>
+                            Entries get cached in offheap memory first and 
then get evicted to swap, if one is configured
+                        </li>
+                        <li>
+                            OFFHEAP_VALUES - entry keys will be stored on heap 
memory, and values will be stored in offheap memory<br/>
+                            Note that in this mode entries can be evicted only 
to swap
+                        </li>
+                    </ul>`
+                })(
+                    ui-validate=`{
+                        offheapAndDomains: 
'$ctrl.Caches.memoryMode.offheapAndDomains(${model})'
+                    }`
+                    ui-validate-watch=`"${model}.domains.length"`
+                    ng-model-options='{allowInvalid: true}'
                 )
-                    pc-form-field-size(
-                        label='Off-heap memory max size:'
-                        ng-model=`${model}.offHeapMaxMemory`
-                        name='offHeapMaxMemory'
-                        placeholder='Enter off-heap memory size'
-                        min='{{ ::$ctrl.Caches.offHeapMaxMemory.min }}'
-                        tip='Maximum amount of memory available to off-heap 
storage'
-                        size-scale-label='mb'
-                        size-type='bytes'
-                        required='true'
-                    )
-                +evictionPolicy(`${model}.evictionPolicy`, '"evictionPolicy"', 
'true',
-                    `$ctrl.Caches.evictionPolicy.required(${model})`,
-                    'Optional cache eviction policy<br/>\
-                    Must be set for entries to be evicted from on-heap to 
off-heap or swap\
-                    <ul>\
-                        <li>Least Recently Used(LRU) - Eviction policy based 
on LRU algorithm and supports batch eviction</li>\
-                        <li>First In First Out (FIFO) - Eviction policy based 
on FIFO algorithm and supports batch eviction</li>\
-                        <li>SORTED - Eviction policy which will select the 
minimum cache entry for eviction</li>\
-                    </ul>')
+                    +form-field-feedback(null, 'offheapAndDomains', 'Query 
indexing could not be enabled while values are stored off-heap')
+            .pc-form-grid-col-60(ng-if=`${model}.memoryMode !== 
'OFFHEAP_VALUES'`)
+                +sane-ignite-form-field-dropdown({
+                    label: 'Off-heap memory:',
+                    model: `${model}.offHeapMode`,
+                    name: '"offHeapMode"',
+                    required: `$ctrl.Caches.offHeapMode.required(${model})`,
+                    placeholder: '{{::$ctrl.Caches.offHeapMode.default}}',
+                    options: '{{::$ctrl.Caches.offHeapModes}}',
+                    tip: `Off-heap storage mode
+                    <ul>
+                        <li>Disabled - Off-heap storage is disabled</li>
+                        <li>Limited - Off-heap storage has limited size</li>
+                        <li>Unlimited - Off-heap storage grow infinitely (it 
is up to user to properly add and remove entries from cache to ensure that 
off-heap storage does not grow infinitely)</li>
+                    </ul>`
+                })(
+                    ng-change=`$ctrl.Caches.offHeapMode.onChange(${model})`
+                    ui-validate=`{
+                        offheapDisabled: 
'$ctrl.Caches.offHeapMode.offheapDisabled(${model})'
+                    }`
+                    ui-validate-watch=`'${model}.memoryMode'`
+                    ng-model-options='{allowInvalid: true}'
+                )
+                    +form-field-feedback(null, 'offheapDisabled', 'Off-heap 
storage can\'t be disabled when memory mode is OFFHEAP_TIERED')
+            .pc-form-grid-col-60(
+                ng-if=`${model}.offHeapMode === 1 && ${model}.memoryMode !== 
'OFFHEAP_VALUES'`
+                ng-if-end
+            )
+                pc-form-field-size(
+                    label='Off-heap memory max size:'
+                    ng-model=`${model}.offHeapMaxMemory`
+                    name='offHeapMaxMemory'
+                    placeholder='Enter off-heap memory size'
+                    min='{{ ::$ctrl.Caches.offHeapMaxMemory.min }}'
+                    tip='Maximum amount of memory available to off-heap 
storage'
+                    size-scale-label='mb'
+                    size-type='bytes'
+                    required='true'
+                )
+            +evictionPolicy(`${model}.evictionPolicy`, '"evictionPolicy"', 
'true',
+                `$ctrl.Caches.evictionPolicy.required(${model})`,
+                'Optional cache eviction policy<br/>\
+                Must be set for entries to be evicted from on-heap to off-heap 
or swap\
+                <ul>\
+                    <li>Least Recently Used(LRU) - Eviction policy based on 
LRU algorithm and supports batch eviction</li>\
+                    <li>First In First Out (FIFO) - Eviction policy based on 
FIFO algorithm and supports batch eviction</li>\
+                    <li>SORTED - Eviction policy which will select the minimum 
cache entry for eviction</li>\
+                </ul>')
 
-                //- Since ignite 2.0
-                .pc-form-grid-col-60(ng-if='$ctrl.available("2.0.0")')
-                    +java-class('Eviction filter:', model + '.evictionFilter', 
'"EvictionFilter"', 'true', 'false', 'Eviction filter to specify which entries 
should not be evicted')
+            //- Since ignite 2.0
+            .pc-form-grid-col-60(ng-if='$ctrl.available("2.0.0")')
+                +java-class('Eviction filter:', model + '.evictionFilter', 
'"EvictionFilter"', 'true', 'false', 'Eviction filter to specify which entries 
should not be evicted')
 
-                //- Removed in ignite 2.0
-                .pc-form-grid-col-60(ng-if-start='$ctrl.available(["1.0.0", 
"2.0.0"])')
-                    +number('Start size:', `${model}.startSize`, 
'"startSize"', 'true', '1500000', '0',
-                        'In terms of size and capacity, Ignite internal cache 
map acts exactly like a normal Java HashMap: it has some initial capacity\
-                        (which is pretty small by default), which doubles as 
data arrives. The process of internal cache map resizing is CPU-intensive\
-                        and time-consuming, and if you load a huge dataset 
into cache (which is a normal use case), the map will have to resize a lot of 
times.\
-                        To avoid that, you can specify the initial cache map 
capacity, comparable to the expected size of your dataset.\
-                        This will save a lot of CPU resources during the load 
time, because the map would not have to resize.\
-                        For example, if you expect to load 10 million entries 
into cache, you can set this property to 10 000 000.\
-                        This will save you from cache internal map resizes.')
-                .pc-form-grid-col-60(ng-if-end)
-                    +checkbox('Swap enabled', `${model}.swapEnabled`, 
'"swapEnabled"', 'Flag indicating whether swap storage is enabled or not for 
this cache')
+            //- Removed in ignite 2.0
+            .pc-form-grid-col-60(ng-if-start='$ctrl.available(["1.0.0", 
"2.0.0"])')
+                +number('Start size:', `${model}.startSize`, '"startSize"', 
'true', '1500000', '0',
+                    'In terms of size and capacity, Ignite internal cache map 
acts exactly like a normal Java HashMap: it has some initial capacity\
+                    (which is pretty small by default), which doubles as data 
arrives. The process of internal cache map resizing is CPU-intensive\
+                    and time-consuming, and if you load a huge dataset into 
cache (which is a normal use case), the map will have to resize a lot of times.\
+                    To avoid that, you can specify the initial cache map 
capacity, comparable to the expected size of your dataset.\
+                    This will save a lot of CPU resources during the load 
time, because the map would not have to resize.\
+                    For example, if you expect to load 10 million entries into 
cache, you can set this property to 10 000 000.\
+                    This will save you from cache internal map resizes.')
+            .pc-form-grid-col-60(ng-if-end)
+                +checkbox('Swap enabled', `${model}.swapEnabled`, 
'"swapEnabled"', 'Flag indicating whether swap storage is enabled or not for 
this cache')
 
-            .pca-form-column-6
-                +preview-xml-java(model, 'cacheMemory')
+        .pca-form-column-6
+            +preview-xml-java(model, 'cacheMemory')

http://git-wip-us.apache.org/repos/asf/ignite/blob/d24dab81/modules/web-console/frontend/app/modules/states/configuration/caches/near-cache-client.pug
----------------------------------------------------------------------
diff --git 
a/modules/web-console/frontend/app/modules/states/configuration/caches/near-cache-client.pug
 
b/modules/web-console/frontend/app/modules/states/configuration/caches/near-cache-client.pug
index ff51361..2b6705d 100644
--- 
a/modules/web-console/frontend/app/modules/states/configuration/caches/near-cache-client.pug
+++ 
b/modules/web-console/frontend/app/modules/states/configuration/caches/near-cache-client.pug
@@ -19,31 +19,32 @@ include /app/helpers/jade/mixins
 -var form = 'clientNearCache'
 -var model = '$ctrl.clonedCache'
 
-.pca-panel(ng-form=form novalidate ng-show=`${model}.cacheMode === 
'PARTITIONED'`)
-    .pca-panel-heading(bs-collapse-toggle='' 
ng-click=`ui.loadPanel('${form}')`)
-        ignite-form-panel-chevron
-        .pca-panel-heading-title Near cache on client node
-        .pca-panel-heading-description
-            | Near cache settings for client nodes. 
-            | Near cache is a small local cache that stores most recently or 
most frequently accessed data. 
-            | Should be used in case when it is impossible to send 
computations to remote nodes.
-    .pca-panel-collapse(role='tabpanel' bs-collapse-target id=`${form}`)
-        .pca-panel-body.pca-form-row(ng-if=`ui.isPanelLoaded('${form}')`)
-            .pca-form-column-6.pc-form-grid-row
-                -var nearCfg = `${model}.clientNearConfiguration`
-                -var enabled = `${nearCfg}.enabled`
+panel-collapsible(
+    ng-form=form
+    on-open=`ui.loadPanel('${form}')`
+    ng-show=`${model}.cacheMode === 'PARTITIONED'`
+)
+    panel-title Near cache on client node
+    panel-description
+        | Near cache settings for client nodes. 
+        | Near cache is a small local cache that stores most recently or most 
frequently accessed data. 
+        | Should be used in case when it is impossible to send computations to 
remote nodes.
+    panel-content.pca-form-row(ng-if=`ui.isPanelLoaded('${form}')`)
+        .pca-form-column-6.pc-form-grid-row
+            -var nearCfg = `${model}.clientNearConfiguration`
+            -var enabled = `${nearCfg}.enabled`
 
-                .pc-form-grid-col-60
-                    +checkbox('Enabled', enabled, '"clientNearEnabled"', 'Flag 
indicating whether to configure near cache')
-                .pc-form-grid-col-60
-                    +number('Start size:', `${nearCfg}.nearStartSize`, 
'"clientNearStartSize"', enabled, '375000', '0',
-                        'Initial cache size for near cache which will be used 
to pre-create internal hash table after start')
-                +evictionPolicy(`${nearCfg}.nearEvictionPolicy`, 
'"clientNearCacheEvictionPolicy"', enabled, 'false',
-                    'Near cache eviction policy\
-                    <ul>\
-                        <li>Least Recently Used (LRU) - Eviction policy based 
on LRU algorithm and supports batch eviction</li>\
-                        <li>First In First Out (FIFO) - Eviction policy based 
on FIFO algorithm and supports batch eviction</li>\
-                        <li>SORTED - Eviction policy which will select the 
minimum cache entry for eviction</li>\
-                    </ul>')
-            .pca-form-column-6
-                +preview-xml-java(model, 'cacheNearClient')
+            .pc-form-grid-col-60
+                +checkbox('Enabled', enabled, '"clientNearEnabled"', 'Flag 
indicating whether to configure near cache')
+            .pc-form-grid-col-60
+                +number('Start size:', `${nearCfg}.nearStartSize`, 
'"clientNearStartSize"', enabled, '375000', '0',
+                    'Initial cache size for near cache which will be used to 
pre-create internal hash table after start')
+            +evictionPolicy(`${nearCfg}.nearEvictionPolicy`, 
'"clientNearCacheEvictionPolicy"', enabled, 'false',
+                'Near cache eviction policy\
+                <ul>\
+                    <li>Least Recently Used (LRU) - Eviction policy based on 
LRU algorithm and supports batch eviction</li>\
+                    <li>First In First Out (FIFO) - Eviction policy based on 
FIFO algorithm and supports batch eviction</li>\
+                    <li>SORTED - Eviction policy which will select the minimum 
cache entry for eviction</li>\
+                </ul>')
+        .pca-form-column-6
+            +preview-xml-java(model, 'cacheNearClient')

http://git-wip-us.apache.org/repos/asf/ignite/blob/d24dab81/modules/web-console/frontend/app/modules/states/configuration/caches/near-cache-server.pug
----------------------------------------------------------------------
diff --git 
a/modules/web-console/frontend/app/modules/states/configuration/caches/near-cache-server.pug
 
b/modules/web-console/frontend/app/modules/states/configuration/caches/near-cache-server.pug
index 40f7024..3a91fd2 100644
--- 
a/modules/web-console/frontend/app/modules/states/configuration/caches/near-cache-server.pug
+++ 
b/modules/web-console/frontend/app/modules/states/configuration/caches/near-cache-server.pug
@@ -19,32 +19,33 @@ include /app/helpers/jade/mixins
 -var form = 'serverNearCache'
 -var model = '$ctrl.clonedCache'
 
-.pca-panel(ng-form=form novalidate ng-show=`${model}.cacheMode === 
'PARTITIONED'`)
-    .pca-panel-heading(bs-collapse-toggle='' 
ng-click=`ui.loadPanel('${form}')`)
-        ignite-form-panel-chevron
-        .pca-panel-heading-title Near cache on server node
-        .pca-panel-heading-description
-            | Near cache settings. 
-            | Near cache is a small local cache that stores most recently or 
most frequently accessed data. 
-            | Should be used in case when it is impossible to send 
computations to remote nodes. 
-            
a.link-success(href="https://apacheignite.readme.io/docs/near-caches"; 
target="_blank") More info
-    .pca-panel-collapse(role='tabpanel' bs-collapse-target id=`${form}`)
-        .pca-panel-body.pca-form-row(ng-if=`ui.isPanelLoaded('${form}')`)
-            .pca-form-column-6.pc-form-grid-row
-                -var nearCfg = `${model}.nearConfiguration`
-                -var enabled = `${nearCfg}.enabled`
+panel-collapsible(
+    ng-form=form
+    on-open=`ui.loadPanel('${form}')`
+    ng-show=`${model}.cacheMode === 'PARTITIONED'`
+)
+    panel-title Near cache on server node
+    panel-description
+        | Near cache settings. 
+        | Near cache is a small local cache that stores most recently or most 
frequently accessed data. 
+        | Should be used in case when it is impossible to send computations to 
remote nodes. 
+        a.link-success(href="https://apacheignite.readme.io/docs/near-caches"; 
target="_blank") More info
+    panel-content.pca-form-row(ng-if=`ui.isPanelLoaded('${form}')`)
+        .pca-form-column-6.pc-form-grid-row
+            -var nearCfg = `${model}.nearConfiguration`
+            -var enabled = `${nearCfg}.enabled`
 
-                .pc-form-grid-col-60
-                    +checkbox('Enabled', enabled, '"nearCacheEnabled"', 'Flag 
indicating whether to configure near cache')
-                .pc-form-grid-col-60
-                    +number('Start size:', `${nearCfg}.nearStartSize`, 
'"nearStartSize"', enabled, '375000', '0',
-                        'Initial cache size for near cache which will be used 
to pre-create internal hash table after start')
-                
+evictionPolicy(`${model}.nearConfiguration.nearEvictionPolicy`, 
'"nearCacheEvictionPolicy"', enabled, 'false',
-                    'Near cache eviction policy\
-                    <ul>\
-                        <li>Least Recently Used (LRU) - Eviction policy based 
on LRU algorithm and supports batch eviction</li>\
-                        <li>First In First Out (FIFO) - Eviction policy based 
on FIFO algorithm and supports batch eviction</li>\
-                        <li>SORTED - Eviction policy which will select the 
minimum cache entry for eviction</li>\
-                    </ul>')
-            .pca-form-column-6
-                +preview-xml-java(model, 'cacheNearServer')
+            .pc-form-grid-col-60
+                +checkbox('Enabled', enabled, '"nearCacheEnabled"', 'Flag 
indicating whether to configure near cache')
+            .pc-form-grid-col-60
+                +number('Start size:', `${nearCfg}.nearStartSize`, 
'"nearStartSize"', enabled, '375000', '0',
+                    'Initial cache size for near cache which will be used to 
pre-create internal hash table after start')
+            +evictionPolicy(`${model}.nearConfiguration.nearEvictionPolicy`, 
'"nearCacheEvictionPolicy"', enabled, 'false',
+                'Near cache eviction policy\
+                <ul>\
+                    <li>Least Recently Used (LRU) - Eviction policy based on 
LRU algorithm and supports batch eviction</li>\
+                    <li>First In First Out (FIFO) - Eviction policy based on 
FIFO algorithm and supports batch eviction</li>\
+                    <li>SORTED - Eviction policy which will select the minimum 
cache entry for eviction</li>\
+                </ul>')
+        .pca-form-column-6
+            +preview-xml-java(model, 'cacheNearServer')

http://git-wip-us.apache.org/repos/asf/ignite/blob/d24dab81/modules/web-console/frontend/app/modules/states/configuration/caches/node-filter.pug
----------------------------------------------------------------------
diff --git 
a/modules/web-console/frontend/app/modules/states/configuration/caches/node-filter.pug
 
b/modules/web-console/frontend/app/modules/states/configuration/caches/node-filter.pug
index c40ea59..11938f9 100644
--- 
a/modules/web-console/frontend/app/modules/states/configuration/caches/node-filter.pug
+++ 
b/modules/web-console/frontend/app/modules/states/configuration/caches/node-filter.pug
@@ -23,35 +23,31 @@ include /app/helpers/jade/mixins
 -var igfsFilter = nodeFilterKind + ' === "IGFS"'
 -var customFilter = nodeFilterKind + ' === "Custom"'
 
-.pca-panel(ng-form=form novalidate)
-    .pca-panel-heading(bs-collapse-toggle='' 
ng-click=`ui.loadPanel('${form}')`)
-        ignite-form-panel-chevron
-        .pca-panel-heading-title(id='nodeFilter-title') Node filter
-        .pca-panel-heading-description
-            | Determines on what nodes the cache should be started.
-    .pca-panel-collapse(role='tabpanel' bs-collapse-target id=`${form}`)
-        .pca-panel-body.pca-form-row(ng-if=`ui.isPanelLoaded('${form}')`)
-            .pca-form-column-6.pc-form-grid-row
-                .pc-form-grid-col-60
-                    +dropdown('Node filter:', nodeFilterKind, '"nodeFilter"', 
'true', 'Not set', '::$ctrl.Caches.nodeFilterKinds', 'Node filter variant')
-                .pc-form-grid-col-60(
-                    ng-if=igfsFilter
+panel-collapsible(ng-form=form on-open=`ui.loadPanel('${form}')`)
+    panel-title Node filter
+    panel-description Determines on what nodes the cache should be started.
+    panel-content.pca-form-row(ng-if=`ui.isPanelLoaded('${form}')`)
+        .pca-form-column-6.pc-form-grid-row
+            .pc-form-grid-col-60
+                +dropdown('Node filter:', nodeFilterKind, '"nodeFilter"', 
'true', 'Not set', '::$ctrl.Caches.nodeFilterKinds', 'Node filter variant')
+            .pc-form-grid-col-60(
+                ng-if=igfsFilter
+            )
+                +sane-ignite-form-field-dropdown({
+                    label: 'IGFS:',
+                    model: `${nodeFilter}.IGFS.igfs`,
+                    name: '"igfsNodeFilter"',
+                    required: true,
+                    placeholder: 'Choose IGFS',
+                    placeholderEmpty: 'No IGFS configured',
+                    options: '$ctrl.igfssMenu',
+                    tip: 'Select IGFS to filter nodes'
+                })(
+                    pc-is-in-collection='$ctrl.igfsIDs'
                 )
-                    +sane-ignite-form-field-dropdown({
-                        label: 'IGFS:',
-                        model: `${nodeFilter}.IGFS.igfs`,
-                        name: '"igfsNodeFilter"',
-                        required: true,
-                        placeholder: 'Choose IGFS',
-                        placeholderEmpty: 'No IGFS configured',
-                        options: '$ctrl.igfssMenu',
-                        tip: 'Select IGFS to filter nodes'
-                    })(
-                        pc-is-in-collection='$ctrl.igfsIDs'
-                    )
-                        +form-field-feedback(_, 'isInCollection', `Cluster 
doesn't have such an IGFS`)
-                .pc-form-grid-col-60(ng-show=customFilter)
-                    +java-class('Class name:', 
`${nodeFilter}.Custom.className`, '"customNodeFilter"',
-                        'true', customFilter, 'Class name of custom node 
filter implementation', customFilter)
-            .pca-form-column-6
-                +preview-xml-java(model, 'cacheNodeFilter', 'igfss')
+                    +form-field-feedback(_, 'isInCollection', `Cluster doesn't 
have such an IGFS`)
+            .pc-form-grid-col-60(ng-show=customFilter)
+                +java-class('Class name:', `${nodeFilter}.Custom.className`, 
'"customNodeFilter"',
+                    'true', customFilter, 'Class name of custom node filter 
implementation', customFilter)
+        .pca-form-column-6
+            +preview-xml-java(model, 'cacheNodeFilter', 'igfss')

http://git-wip-us.apache.org/repos/asf/ignite/blob/d24dab81/modules/web-console/frontend/app/modules/states/configuration/caches/query.pug
----------------------------------------------------------------------
diff --git 
a/modules/web-console/frontend/app/modules/states/configuration/caches/query.pug
 
b/modules/web-console/frontend/app/modules/states/configuration/caches/query.pug
index 471b011..20869f5 100644
--- 
a/modules/web-console/frontend/app/modules/states/configuration/caches/query.pug
+++ 
b/modules/web-console/frontend/app/modules/states/configuration/caches/query.pug
@@ -19,99 +19,96 @@ include /app/helpers/jade/mixins
 -var form = 'query'
 -var model = '$ctrl.clonedCache'
 
-.pca-panel(ng-form=form novalidate)
-    .pca-panel-heading(bs-collapse-toggle='' 
ng-click=`ui.loadPanel('${form}')`)
-        ignite-form-panel-chevron
-        .pca-panel-heading-title Queries & Indexing
-        .pca-panel-heading-description
-            | Cache queries settings. 
-            
a.link-success(href="https://apacheignite-sql.readme.io/docs/select"; 
target="_blank") More info
-    .pca-panel-collapse(role='tabpanel' bs-collapse-target id=`${form}`)
-        .pca-panel-body.pca-form-row(ng-if=`ui.isPanelLoaded('${form}')`)
-            .pca-form-column-6.pc-form-grid-row
-                .pc-form-grid-col-60
-                    +text('SQL schema name:', `${model}.sqlSchema`, 
'"sqlSchema"', 'false', 'Input schema name',
-                        'Specify any custom name to be used as SQL schema for 
current cache. This name will correspond to SQL ANSI-99 standard.\
-                        Nonquoted identifiers are not case sensitive. Quoted 
identifiers are case sensitive.\
-                        When SQL schema is not specified, quoted cache name 
should used instead.<br/>\
-                        For example:\
-                        <ul>\
-                            <li>\
-                                Query without schema names (quoted cache names 
will be used):\
-                                SELECT * FROM "PersonsCache".Person p INNER 
JOIN "OrganizationsCache".Organization o on p.org = o.id\
-                            </li>\
-                            <li>\
-                                The same query using schema names "Persons" 
and "Organizations":\
-                                SELECT * FROM Persons.Person p INNER JOIN 
Organizations.Organization o on p.org = o.id\
-                            </li>\
-                        </ul>')
+panel-collapsible(ng-form=form on-open=`ui.loadPanel('${form}')`)
+    panel-title Queries & Indexing
+    panel-description 
+        | Cache queries settings. 
+        a.link-success(href="https://apacheignite-sql.readme.io/docs/select"; 
target="_blank") More info
+    panel-content.pca-form-row(ng-if=`ui.isPanelLoaded('${form}')`)
+        .pca-form-column-6.pc-form-grid-row
+            .pc-form-grid-col-60
+                +text('SQL schema name:', `${model}.sqlSchema`, '"sqlSchema"', 
'false', 'Input schema name',
+                    'Specify any custom name to be used as SQL schema for 
current cache. This name will correspond to SQL ANSI-99 standard.\
+                    Nonquoted identifiers are not case sensitive. Quoted 
identifiers are case sensitive.\
+                    When SQL schema is not specified, quoted cache name should 
used instead.<br/>\
+                    For example:\
+                    <ul>\
+                        <li>\
+                            Query without schema names (quoted cache names 
will be used):\
+                            SELECT * FROM "PersonsCache".Person p INNER JOIN 
"OrganizationsCache".Organization o on p.org = o.id\
+                        </li>\
+                        <li>\
+                            The same query using schema names "Persons" and 
"Organizations":\
+                            SELECT * FROM Persons.Person p INNER JOIN 
Organizations.Organization o on p.org = o.id\
+                        </li>\
+                    </ul>')
 
-                //- Removed in ignite 2.0
-                .pc-form-grid-col-60(ng-if='$ctrl.available(["1.0.0", 
"2.0.0"])')
-                    +number('On-heap cache for off-heap indexes:', 
`${model}.sqlOnheapRowCacheSize`, '"sqlOnheapRowCacheSize"', 'true', '10240', 
'1',
-                        'Number of SQL rows which will be cached onheap to 
avoid deserialization on each SQL index access')
+            //- Removed in ignite 2.0
+            .pc-form-grid-col-60(ng-if='$ctrl.available(["1.0.0", "2.0.0"])')
+                +number('On-heap cache for off-heap indexes:', 
`${model}.sqlOnheapRowCacheSize`, '"sqlOnheapRowCacheSize"', 'true', '10240', 
'1',
+                    'Number of SQL rows which will be cached onheap to avoid 
deserialization on each SQL index access')
 
-                //- Deprecated in ignite 2.1
-                .pc-form-grid-col-60(ng-if='$ctrl.available(["1.0.0", 
"2.1.0"])')
-                    +number('Long query timeout:', 
`${model}.longQueryWarningTimeout`, '"longQueryWarningTimeout"', 'true', 
'3000', '0',
-                        'Timeout in milliseconds after which long query 
warning will be printed')
-                .pc-form-grid-col-60
-                    +number('History size:', 
`${model}.queryDetailMetricsSize`, '"queryDetailMetricsSize"', 'true', '0', '0',
-                        'Size of queries detail metrics that will be stored in 
memory for monitoring purposes')
-                .pc-form-grid-col-60
-                    mixin caches-query-list-sql-functions()
-                        .ignite-form-field
-                            -let items = `${model}.sqlFunctionClasses`;
-                            -let uniqueTip = 'SQL function with such class 
name already exists!'
+            //- Deprecated in ignite 2.1
+            .pc-form-grid-col-60(ng-if='$ctrl.available(["1.0.0", "2.1.0"])')
+                +number('Long query timeout:', 
`${model}.longQueryWarningTimeout`, '"longQueryWarningTimeout"', 'true', 
'3000', '0',
+                    'Timeout in milliseconds after which long query warning 
will be printed')
+            .pc-form-grid-col-60
+                +number('History size:', `${model}.queryDetailMetricsSize`, 
'"queryDetailMetricsSize"', 'true', '0', '0',
+                    'Size of queries detail metrics that will be stored in 
memory for monitoring purposes')
+            .pc-form-grid-col-60
+                mixin caches-query-list-sql-functions()
+                    .ignite-form-field
+                        -let items = `${model}.sqlFunctionClasses`;
+                        -let uniqueTip = 'SQL function with such class name 
already exists!'
 
-                            list-editable(
-                                ng-model=items
-                                list-editable-cols=`::[{
-                                    name: 'SQL functions:',
-                                    tip: 'Collections of classes with 
user-defined functions for SQL queries'
-                                }]`
-                            )
-                                list-editable-item-view {{ $item }}
+                        list-editable(
+                            ng-model=items
+                            list-editable-cols=`::[{
+                                name: 'SQL functions:',
+                                tip: 'Collections of classes with user-defined 
functions for SQL queries'
+                            }]`
+                        )
+                            list-editable-item-view {{ $item }}
 
-                                list-editable-item-edit
-                                    +list-java-class-field('SQL function', 
'$item', '"sqlFunction"', items)
-                                        +unique-feedback('"sqlFunction"', 
uniqueTip)
+                            list-editable-item-edit
+                                +list-java-class-field('SQL function', 
'$item', '"sqlFunction"', items)
+                                    +unique-feedback('"sqlFunction"', 
uniqueTip)
 
-                                list-editable-no-items
-                                    list-editable-add-item-button(
-                                        add-item=`$editLast((${items} = 
${items} || []).push(""))`
-                                        label-single='SQL function'
-                                        label-multiple='SQL functions'
-                                    )
+                            list-editable-no-items
+                                list-editable-add-item-button(
+                                    add-item=`$editLast((${items} = ${items} 
|| []).push(""))`
+                                    label-single='SQL function'
+                                    label-multiple='SQL functions'
+                                )
 
-                    - var form = '$parent.form'
-                    +caches-query-list-sql-functions
-                    - var form = 'query'
+                - var form = '$parent.form'
+                +caches-query-list-sql-functions
+                - var form = 'query'
 
-                //- Removed in ignite 2.0
-                .pc-form-grid-col-60(ng-if='$ctrl.available(["1.0.0", 
"2.0.0"])')
-                    +checkbox('Snapshotable index', 
`${model}.snapshotableIndex`, '"snapshotableIndex"',
-                        'Flag indicating whether SQL indexes should support 
snapshots')
+            //- Removed in ignite 2.0
+            .pc-form-grid-col-60(ng-if='$ctrl.available(["1.0.0", "2.0.0"])')
+                +checkbox('Snapshotable index', `${model}.snapshotableIndex`, 
'"snapshotableIndex"',
+                    'Flag indicating whether SQL indexes should support 
snapshots')
 
-                .pc-form-grid-col-60
-                    +checkbox('Escape table and filed names', 
`${model}.sqlEscapeAll`, '"sqlEscapeAll"',
-                        'If enabled than all schema, table and field names 
will be escaped with double quotes (for example: "tableName"."fieldName").<br/>\
-                        This enforces case sensitivity for field names and 
also allows having special characters in table and field names.<br/>\
-                        Escaped names will be used for creation internal 
structures in Ignite SQL engine.')
+            .pc-form-grid-col-60
+                +checkbox('Escape table and filed names', 
`${model}.sqlEscapeAll`, '"sqlEscapeAll"',
+                    'If enabled than all schema, table and field names will be 
escaped with double quotes (for example: "tableName"."fieldName").<br/>\
+                    This enforces case sensitivity for field names and also 
allows having special characters in table and field names.<br/>\
+                    Escaped names will be used for creation internal 
structures in Ignite SQL engine.')
 
-                //- Since ignite 2.0
-                .pc-form-grid-col-30(ng-if-start='$ctrl.available("2.0.0")')
-                    +number('Query parallelism', model + '.queryParallelism', 
'"queryParallelism"', 'true', '1', '1',
-                        'A hint to query execution engine on desired degree of 
parallelism within a single node')
-                .pc-form-grid-col-30(ng-if-end)
-                    +sane-ignite-form-field-number({
-                        label: 'SQL index max inline size:',
-                        model: `${model}.sqlIndexMaxInlineSize`,
-                        name: '"sqlIndexMaxInlineSize"',
-                        placeholder: '-1',
-                        min: '-1',
-                        tip: 'Maximum inline size for sql indexes'
-                    })
+            //- Since ignite 2.0
+            .pc-form-grid-col-30(ng-if-start='$ctrl.available("2.0.0")')
+                +number('Query parallelism', model + '.queryParallelism', 
'"queryParallelism"', 'true', '1', '1',
+                    'A hint to query execution engine on desired degree of 
parallelism within a single node')
+            .pc-form-grid-col-30(ng-if-end)
+                +sane-ignite-form-field-number({
+                    label: 'SQL index max inline size:',
+                    model: `${model}.sqlIndexMaxInlineSize`,
+                    name: '"sqlIndexMaxInlineSize"',
+                    placeholder: '-1',
+                    min: '-1',
+                    tip: 'Maximum inline size for sql indexes'
+                })
 
-            .pca-form-column-6
-                +preview-xml-java(model, 'cacheQuery', 'domains')
+        .pca-form-column-6
+            +preview-xml-java(model, 'cacheQuery', 'domains')

http://git-wip-us.apache.org/repos/asf/ignite/blob/d24dab81/modules/web-console/frontend/app/modules/states/configuration/caches/rebalance.pug
----------------------------------------------------------------------
diff --git 
a/modules/web-console/frontend/app/modules/states/configuration/caches/rebalance.pug
 
b/modules/web-console/frontend/app/modules/states/configuration/caches/rebalance.pug
index 79ed803e..7563435 100644
--- 
a/modules/web-console/frontend/app/modules/states/configuration/caches/rebalance.pug
+++ 
b/modules/web-console/frontend/app/modules/states/configuration/caches/rebalance.pug
@@ -19,47 +19,48 @@ include /app/helpers/jade/mixins
 -var form = 'rebalance'
 -var model = '$ctrl.clonedCache'
 
-.pca-panel(ng-form=form novalidate ng-hide=`${model}.cacheMode === "LOCAL"`)
-    .pca-panel-heading(bs-collapse-toggle='' 
ng-click=`ui.loadPanel('${form}')`)
-        ignite-form-panel-chevron
-        .pca-panel-heading-title Rebalance
-        .pca-panel-heading-description
-            | Cache rebalance settings. 
-            
a.link-success(href="https://apacheignite.readme.io/docs/rebalancing"; 
target="_blank") More info
-    .pca-panel-collapse(role='tabpanel' bs-collapse-target id=`${form}`)
-        .pca-panel-body.pca-form-row(ng-if=`ui.isPanelLoaded('${form}')`)
-            .pca-form-column-6.pc-form-grid-row
-                .pc-form-grid-col-30
-                    +dropdown('Mode:', `${model}.rebalanceMode`, 
'"rebalanceMode"', 'true', 'ASYNC',
-                        '[\
-                            {value: "SYNC", label: "SYNC"},\
-                            {value: "ASYNC", label: "ASYNC"},\
-                            {value: "NONE", label: "NONE"}\
-                        ]',
-                        'Rebalance modes\
-                        <ul>\
-                            <li>Synchronous - in this mode distributed caches 
will not start until all necessary data is loaded from other available grid 
nodes</li>\
-                            <li>Asynchronous - in this mode distributed caches 
will start immediately and will load all necessary data from other available 
grid nodes in the background</li>\
-                            <li>None - in this mode no rebalancing will take 
place which means that caches will be either loaded on demand from persistent 
store whenever data is accessed, or will be populated explicitly</li>\
-                        </ul>')
-                .pc-form-grid-col-30
-                    +number('Batch size:', `${model}.rebalanceBatchSize`, 
'"rebalanceBatchSize"', 'true', '512 * 1024', '1',
-                        'Size (in bytes) to be loaded within a single 
rebalance message<br/>\
-                        Rebalancing algorithm will split total data set on 
every node into multiple batches prior to sending data')
-                .pc-form-grid-col-30
-                    +number('Batches prefetch count:', 
`${model}.rebalanceBatchesPrefetchCount`, '"rebalanceBatchesPrefetchCount"', 
'true', '2', '1',
-                        'Number of batches generated by supply node at 
rebalancing start')
-                .pc-form-grid-col-30
-                    +number('Order:', `${model}.rebalanceOrder`, 
'"rebalanceOrder"', 'true', '0', Number.MIN_SAFE_INTEGER,
-                        'If cache rebalance order is positive, rebalancing for 
this cache will be started only when rebalancing for all caches with smaller 
rebalance order (except caches with rebalance order 0) will be completed')
-                .pc-form-grid-col-20
-                    +number('Delay:', `${model}.rebalanceDelay`, 
'"rebalanceDelay"', 'true', '0', '0',
-                        'Delay in milliseconds upon a node joining or leaving 
topology (or crash) after which rebalancing should be started automatically')
-                .pc-form-grid-col-20
-                    +number('Timeout:', `${model}.rebalanceTimeout`, 
'"rebalanceTimeout"', 'true', '10000', '0',
-                        'Rebalance timeout in milliseconds')
-                .pc-form-grid-col-20
-                    +number('Throttle:', `${model}.rebalanceThrottle`, 
'"rebalanceThrottle"', 'true', '0', '0',
-                        'Time in milliseconds to wait between rebalance 
messages to avoid overloading of CPU or network')
-            .pca-form-column-6
-                +preview-xml-java(model, 'cacheRebalance')
+panel-collapsible(
+    ng-form=form
+    on-open=`ui.loadPanel('${form}')`
+    ng-hide=`${model}.cacheMode === "LOCAL"`
+)
+    panel-title Rebalance
+    panel-description
+        | Cache rebalance settings. 
+        a.link-success(href="https://apacheignite.readme.io/docs/rebalancing"; 
target="_blank") More info
+    panel-content.pca-form-row(ng-if=`ui.isPanelLoaded('${form}')`)
+        .pca-form-column-6.pc-form-grid-row
+            .pc-form-grid-col-30
+                +dropdown('Mode:', `${model}.rebalanceMode`, 
'"rebalanceMode"', 'true', 'ASYNC',
+                    '[\
+                        {value: "SYNC", label: "SYNC"},\
+                        {value: "ASYNC", label: "ASYNC"},\
+                        {value: "NONE", label: "NONE"}\
+                    ]',
+                    'Rebalance modes\
+                    <ul>\
+                        <li>Synchronous - in this mode distributed caches will 
not start until all necessary data is loaded from other available grid 
nodes</li>\
+                        <li>Asynchronous - in this mode distributed caches 
will start immediately and will load all necessary data from other available 
grid nodes in the background</li>\
+                        <li>None - in this mode no rebalancing will take place 
which means that caches will be either loaded on demand from persistent store 
whenever data is accessed, or will be populated explicitly</li>\
+                    </ul>')
+            .pc-form-grid-col-30
+                +number('Batch size:', `${model}.rebalanceBatchSize`, 
'"rebalanceBatchSize"', 'true', '512 * 1024', '1',
+                    'Size (in bytes) to be loaded within a single rebalance 
message<br/>\
+                    Rebalancing algorithm will split total data set on every 
node into multiple batches prior to sending data')
+            .pc-form-grid-col-30
+                +number('Batches prefetch count:', 
`${model}.rebalanceBatchesPrefetchCount`, '"rebalanceBatchesPrefetchCount"', 
'true', '2', '1',
+                    'Number of batches generated by supply node at rebalancing 
start')
+            .pc-form-grid-col-30
+                +number('Order:', `${model}.rebalanceOrder`, 
'"rebalanceOrder"', 'true', '0', Number.MIN_SAFE_INTEGER,
+                    'If cache rebalance order is positive, rebalancing for 
this cache will be started only when rebalancing for all caches with smaller 
rebalance order (except caches with rebalance order 0) will be completed')
+            .pc-form-grid-col-20
+                +number('Delay:', `${model}.rebalanceDelay`, 
'"rebalanceDelay"', 'true', '0', '0',
+                    'Delay in milliseconds upon a node joining or leaving 
topology (or crash) after which rebalancing should be started automatically')
+            .pc-form-grid-col-20
+                +number('Timeout:', `${model}.rebalanceTimeout`, 
'"rebalanceTimeout"', 'true', '10000', '0',
+                    'Rebalance timeout in milliseconds')
+            .pc-form-grid-col-20
+                +number('Throttle:', `${model}.rebalanceThrottle`, 
'"rebalanceThrottle"', 'true', '0', '0',
+                    'Time in milliseconds to wait between rebalance messages 
to avoid overloading of CPU or network')
+        .pca-form-column-6
+            +preview-xml-java(model, 'cacheRebalance')

http://git-wip-us.apache.org/repos/asf/ignite/blob/d24dab81/modules/web-console/frontend/app/modules/states/configuration/caches/statistics.pug
----------------------------------------------------------------------
diff --git 
a/modules/web-console/frontend/app/modules/states/configuration/caches/statistics.pug
 
b/modules/web-console/frontend/app/modules/states/configuration/caches/statistics.pug
index 676234f..bf58354 100644
--- 
a/modules/web-console/frontend/app/modules/states/configuration/caches/statistics.pug
+++ 
b/modules/web-console/frontend/app/modules/states/configuration/caches/statistics.pug
@@ -19,20 +19,16 @@ include /app/helpers/jade/mixins
 -var form = 'statistics'
 -var model = '$ctrl.clonedCache'
 
-.pca-panel(ng-form=form novalidate)
-    .pca-panel-heading(bs-collapse-toggle='' 
ng-click=`ui.loadPanel('${form}')`)
-        ignite-form-panel-chevron
-        .pca-panel-heading-title Statistics
-        .pca-panel-heading-description
-            | Cache statistics and management settings.
-    .pca-panel-collapse(role='tabpanel' bs-collapse-target id=`${form}`)
-        .pca-panel-body.pca-form-row(ng-if=`ui.isPanelLoaded('${form}')`)
-            .pca-form-column-6.pc-form-grid-row
-                .pc-form-grid-col-60
-                    +checkbox('Statistics enabled', 
`${model}.statisticsEnabled`, '"statisticsEnabled"', 'Flag indicating whether 
statistics gathering is enabled on this cache')
-                .pc-form-grid-col-60
-                    +checkbox('Management enabled', 
`${model}.managementEnabled`, '"managementEnabled"',
-                    'Flag indicating whether management is enabled on this 
cache<br/>\
-                    If enabled the CacheMXBean for each cache is registered in 
the platform MBean server')
-            .pca-form-column-6
-                +preview-xml-java(model, 'cacheStatistics')
+panel-collapsible(ng-form=form on-open=`ui.loadPanel('${form}')`)
+    panel-title Statistics
+    panel-description Cache statistics and management settings.
+    panel-content.pca-form-row(ng-if=`ui.isPanelLoaded('${form}')`)
+        .pca-form-column-6.pc-form-grid-row
+            .pc-form-grid-col-60
+                +checkbox('Statistics enabled', `${model}.statisticsEnabled`, 
'"statisticsEnabled"', 'Flag indicating whether statistics gathering is enabled 
on this cache')
+            .pc-form-grid-col-60
+                +checkbox('Management enabled', `${model}.managementEnabled`, 
'"managementEnabled"',
+                'Flag indicating whether management is enabled on this 
cache<br/>\
+                If enabled the CacheMXBean for each cache is registered in the 
platform MBean server')
+        .pca-form-column-6
+            +preview-xml-java(model, 'cacheStatistics')

Reply via email to