mirror of https://github.com/apache/nifi.git
[NIFI-2081] Responsive dialog content, tab content, and scrollable styles. This closes #594
This commit is contained in:
Scott Aslan
Matt Gilman
parent
470513fa2e
commit
293dc29936
|
|
@ -18,39 +18,41 @@
|
||||||
<div id="process-group-configuration">
|
<div id="process-group-configuration">
|
||||||
<div id="process-group-configuration-header-text" class="settings-header-text">Process Group Configuration</div>
|
<div id="process-group-configuration-header-text" class="settings-header-text">Process Group Configuration</div>
|
||||||
<div class="settings-container">
|
<div class="settings-container">
|
||||||
<div class="tab-container">
|
<div>
|
||||||
<div id="process-group-configuration-tabs" class="settings-tabs"></div>
|
<div id="process-group-configuration-tabs" class="settings-tabs tab-container"></div>
|
||||||
<button id="add-process-group-configuration-controller-service" class="add-button fa fa-plus"></button>
|
<button id="add-process-group-configuration-controller-service" class="add-button fa fa-plus"></button>
|
||||||
<div class="clear"></div>
|
<div class="clear"></div>
|
||||||
</div>
|
</div>
|
||||||
<div id="general-process-group-configuration-tab-content" class="configuration-tab">
|
<div id="process-group-configuration-tabs-content">
|
||||||
<div id="general-process-group-configuration">
|
<div id="general-process-group-configuration-tab-content" class="configuration-tab">
|
||||||
<div class="setting">
|
<div id="general-process-group-configuration">
|
||||||
<div class="setting-name">Process group name</div>
|
<div class="setting">
|
||||||
<div class="editable setting-field">
|
<div class="setting-name">Process group name</div>
|
||||||
<input type="text" id="process-group-name" class="setting-input"/>
|
<div class="editable setting-field">
|
||||||
|
<input type="text" id="process-group-name" class="setting-input"/>
|
||||||
|
</div>
|
||||||
|
<div class="read-only setting-field">
|
||||||
|
<span id="read-only-process-group-name"></span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="read-only setting-field">
|
<div class="setting">
|
||||||
<span id="read-only-process-group-name"></span>
|
<div class="setting-name">Process group comments</div>
|
||||||
|
<div class="editable setting-field">
|
||||||
|
<textarea id="process-group-comments" class="setting-input"></textarea>
|
||||||
|
</div>
|
||||||
|
<div class="read-only setting-field">
|
||||||
|
<span id="read-only-process-group-comments"></span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="editable settings-buttons">
|
||||||
<div class="setting">
|
<div id="process-group-configuration-save" class="button">Apply</div>
|
||||||
<div class="setting-name">Process group comments</div>
|
<div class="clear"></div>
|
||||||
<div class="editable setting-field">
|
|
||||||
<textarea id="process-group-comments" class="setting-input"></textarea>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="read-only setting-field">
|
|
||||||
<span id="read-only-process-group-comments"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="editable settings-buttons">
|
|
||||||
<div id="process-group-configuration-save" class="button">Apply</div>
|
|
||||||
<div class="clear"></div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div id="process-group-controller-services-tab-content" class="configuration-tab">
|
||||||
<div id="process-group-controller-services-tab-content" class="configuration-tab">
|
<div id="process-group-controller-services-table" class="settings-table"></div>
|
||||||
<div id="process-group-controller-services-table" class="settings-table"></div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div id="process-group-refresh-container">
|
<div id="process-group-refresh-container">
|
||||||
|
|
|
||||||
|
|
@ -18,8 +18,8 @@
|
||||||
<div id="settings">
|
<div id="settings">
|
||||||
<div id="settings-header-text" class="settings-header-text">NiFi Settings</div>
|
<div id="settings-header-text" class="settings-header-text">NiFi Settings</div>
|
||||||
<div class="settings-container">
|
<div class="settings-container">
|
||||||
<div class="tab-container">
|
<div>
|
||||||
<div id="settings-tabs" class="settings-tabs"></div>
|
<div id="settings-tabs" class="settings-tabs tab-container"></div>
|
||||||
<button id="new-service-or-task" class="add-button fa fa-plus"></button>
|
<button id="new-service-or-task" class="add-button fa fa-plus"></button>
|
||||||
<div class="clear"></div>
|
<div class="clear"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -18,7 +18,7 @@
|
||||||
<div id="provenance-search-dialog" class="hidden medium-dialog">
|
<div id="provenance-search-dialog" class="hidden medium-dialog">
|
||||||
<div class="dialog-content">
|
<div class="dialog-content">
|
||||||
<div class="setting">
|
<div class="setting">
|
||||||
<div class="setting-name">Fields</div>
|
<div class="setting-name" style="padding-top:10px;">Fields</div>
|
||||||
<div class="setting-field">
|
<div class="setting-field">
|
||||||
<div id="searchable-fields-container">
|
<div id="searchable-fields-container">
|
||||||
<div id="no-searchable-fields" class="unset">No searchable fields have been configured.</div>
|
<div id="no-searchable-fields" class="unset">No searchable fields have been configured.</div>
|
||||||
|
|
|
||||||
|
|
@ -20,20 +20,20 @@
|
||||||
<div id="summary-header-text">NiFi Summary</div>
|
<div id="summary-header-text">NiFi Summary</div>
|
||||||
</div>
|
</div>
|
||||||
<div id="summary-tabs" class="tab-container"></div>
|
<div id="summary-tabs" class="tab-container"></div>
|
||||||
<div id="summary-filter-controls" class="filter-controls">
|
|
||||||
<div id="summary-filter-status" class="filter-status">
|
|
||||||
Displaying <span id="displayed-items"></span> of <span id="total-items"></span>
|
|
||||||
</div>
|
|
||||||
<div id="summary-filter-container" class="filter-container">
|
|
||||||
<input type="text" placeholder="Filter" id="summary-filter" class="filter"/>
|
|
||||||
<div id="summary-filter-type" class="filter-type"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div id="view-options-container">
|
|
||||||
View:
|
|
||||||
<span id="view-single-node-link" class="link">Single node</span> <span id="view-cluster-link" class="link">Cluster</span>
|
|
||||||
</div>
|
|
||||||
<div id="summary-tabs-content">
|
<div id="summary-tabs-content">
|
||||||
|
<div id="summary-filter-controls" class="filter-controls">
|
||||||
|
<div id="summary-filter-status" class="filter-status">
|
||||||
|
Displaying <span id="displayed-items"></span> of <span id="total-items"></span>
|
||||||
|
</div>
|
||||||
|
<div id="summary-filter-container" class="filter-container">
|
||||||
|
<input type="text" placeholder="Filter" id="summary-filter" class="filter"/>
|
||||||
|
<div id="summary-filter-type" class="filter-type"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="view-options-container">
|
||||||
|
View:
|
||||||
|
<span id="view-single-node-link" class="link">Single node</span> <span id="view-cluster-link" class="link">Cluster</span>
|
||||||
|
</div>
|
||||||
<div id="processor-summary-tab-content" class="configuration-tab">
|
<div id="processor-summary-tab-content" class="configuration-tab">
|
||||||
<div id="processor-summary-table" class="summary-table"></div>
|
<div id="processor-summary-table" class="summary-table"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -18,116 +18,117 @@
|
||||||
<div id="system-diagnostics-dialog" class="hidden large-dialog">
|
<div id="system-diagnostics-dialog" class="hidden large-dialog">
|
||||||
<div class="dialog-content">
|
<div class="dialog-content">
|
||||||
<div id="system-diagnostics-tabs" class="tab-container"></div>
|
<div id="system-diagnostics-tabs" class="tab-container"></div>
|
||||||
<div id="jvm-tab-content" class="configuration-tab">
|
<div id="system-diagnostics-tabs-content">
|
||||||
<div class="settings-left">
|
<div id="jvm-tab-content" class="configuration-tab">
|
||||||
|
<div class="settings-left">
|
||||||
|
<div class="setting">
|
||||||
|
<input type="hidden" id=""/>
|
||||||
|
<div class="setting-header">Heap <span id="utilization-heap"></span></div>
|
||||||
|
<div class="setting-field">
|
||||||
|
<table id="heap-table">
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td class="memory-header setting-name">Max:</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><span id="max-heap"></span></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="setting-name">Total:</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><span id="total-heap"></span></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="setting-name">Used:</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><span id="used-heap"></span></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="setting-name">Free:</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><span id="free-heap"></span></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
<div class="clear"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="spacer"></div>
|
||||||
|
<div class="settings-right">
|
||||||
|
<div class="setting">
|
||||||
|
<div class="setting-header">Non-heap <span id="utilization-non-heap"></span></div>
|
||||||
|
<div class="setting-field">
|
||||||
|
<table id="heap-table">
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td class="memory-header setting-name">Max:</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><span id="max-non-heap"></span></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="setting-name">Total:</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><span id="total-non-heap"></span></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="setting-name">Used:</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><span id="used-non-heap"></span></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="setting-name">Free:</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><span id="free-non-heap"></span></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
<div class="clear"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="clear"></div>
|
||||||
<div class="setting">
|
<div class="setting">
|
||||||
<input type="hidden" id=""/>
|
<div class="setting-header">Garbage Collection</div>
|
||||||
<div class="setting-header">Heap <span id="utilization-heap"></span></div>
|
<div id="garbage-collection-container" class="setting-field">
|
||||||
<div class="setting-field">
|
<table id="garbage-collection-table">
|
||||||
<table id="heap-table">
|
<tbody></tbody>
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td class="memory-header setting-name">Max:</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td><span id="max-heap"></span></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td class="setting-name">Total:</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td><span id="total-heap"></span></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td class="setting-name">Used:</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td><span id="used-heap"></span></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td class="setting-name">Free:</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td><span id="free-heap"></span></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td></td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
<div class="clear"></div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="spacer"></div>
|
<div id="system-tab-content"class="configuration-tab">
|
||||||
<div class="settings-right">
|
|
||||||
<div class="setting">
|
|
||||||
<div class="setting-header">Non-heap <span id="utilization-non-heap"></span></div>
|
|
||||||
<div class="setting-field">
|
|
||||||
<table id="heap-table">
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td class="memory-header setting-name">Max:</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td><span id="max-non-heap"></span></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td class="setting-name">Total:</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td><span id="total-non-heap"></span></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td class="setting-name">Used:</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td><span id="used-non-heap"></span></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td class="setting-name">Free:</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td><span id="free-non-heap"></span></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td></td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
<div class="clear"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="clear"></div>
|
|
||||||
<div class="setting">
|
|
||||||
<div class="setting-header">Garbage Collection</div>
|
|
||||||
<div id="garbage-collection-container" class="setting-field">
|
|
||||||
<table id="garbage-collection-table">
|
|
||||||
<tbody></tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div id="system-tab-content"class="configuration-tab">
|
|
||||||
<div class="settings-left">
|
<div class="settings-left">
|
||||||
<div class="setting">
|
<div class="setting">
|
||||||
<div class="setting-name">Available Processors:</div>
|
<div class="setting-name">Available Processors:</div>
|
||||||
|
|
@ -162,6 +163,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
<div id="system-diagnostics-refresh-container">
|
<div id="system-diagnostics-refresh-container">
|
||||||
<button id="system-diagnostics-refresh-button" class="refresh-button pointer fa fa-refresh" title="Refresh"></button>
|
<button id="system-diagnostics-refresh-button" class="refresh-button pointer fa fa-refresh" title="Refresh"></button>
|
||||||
<div id="system-diagnostics-last-refreshed-container" class="last-refreshed-container">
|
<div id="system-diagnostics-last-refreshed-container" class="last-refreshed-container">
|
||||||
|
|
|
||||||
|
|
@ -18,6 +18,10 @@
|
||||||
Bulletin Board Styles
|
Bulletin Board Styles
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
#bulletin-board {
|
||||||
|
margin: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
#bulletin-board-header-text {
|
#bulletin-board-header-text {
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
|
@ -28,8 +32,10 @@
|
||||||
|
|
||||||
#bulletin-board-refresh-container {
|
#bulletin-board-refresh-container {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
width: 100%;
|
right: 0px;
|
||||||
bottom: 0px;
|
bottom: 20px;
|
||||||
|
margin: 20px;
|
||||||
|
left: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#bulletin-board-loading-container {
|
#bulletin-board-loading-container {
|
||||||
|
|
|
||||||
|
|
@ -97,6 +97,7 @@ input.cluster-filter-list {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
height: 80%;
|
height: 80%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
min-height: 150px;
|
||||||
}
|
}
|
||||||
|
|
||||||
span.sorted {
|
span.sorted {
|
||||||
|
|
|
||||||
|
|
@ -43,10 +43,11 @@
|
||||||
#component-state-table {
|
#component-state-table {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 208px;
|
top: 142px;
|
||||||
left: 20px;
|
left: 0px;
|
||||||
right: 20px;
|
right: 0px;
|
||||||
bottom: 52px;
|
bottom: 0px;
|
||||||
|
min-height: 150px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/*
|
/*
|
||||||
|
|
@ -55,7 +56,7 @@
|
||||||
|
|
||||||
#clear-link-container {
|
#clear-link-container {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 186px;
|
top: 120px;
|
||||||
right: 20px;
|
right: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -26,14 +26,12 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
#connection-details div.configuration-tab {
|
#connection-details div.configuration-tab {
|
||||||
overflow: auto;
|
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
#read-only-relationship-names {
|
#read-only-relationship-names {
|
||||||
border: 0 solid #CCCCCC;
|
border: 0 solid #CCCCCC;
|
||||||
height: 145px;
|
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
padding: 2px 2px 0;
|
padding: 2px 2px 0;
|
||||||
|
|
|
||||||
|
|
@ -54,10 +54,8 @@
|
||||||
|
|
||||||
#controller-service-referencing-components {
|
#controller-service-referencing-components {
|
||||||
border: 0 solid #CCCCCC;
|
border: 0 solid #CCCCCC;
|
||||||
height: 280px;
|
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
padding: 2px;
|
padding: 2px;
|
||||||
width: 376px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
div.referencing-component-block {
|
div.referencing-component-block {
|
||||||
|
|
@ -161,8 +159,6 @@ div.controller-service-canceling {
|
||||||
#disable-controller-service-referencing-components {
|
#disable-controller-service-referencing-components {
|
||||||
border: 0 solid #CCCCCC;
|
border: 0 solid #CCCCCC;
|
||||||
padding: 2px;
|
padding: 2px;
|
||||||
width: 429px;
|
|
||||||
height: 335px;
|
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
@ -198,8 +194,6 @@ div.controller-service-canceling {
|
||||||
#enable-controller-service-referencing-components {
|
#enable-controller-service-referencing-components {
|
||||||
border: 0 solid #ccc;
|
border: 0 solid #ccc;
|
||||||
padding: 2px;
|
padding: 2px;
|
||||||
width: 429px;
|
|
||||||
height: 335px;
|
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -72,4 +72,5 @@
|
||||||
left: 0px;
|
left: 0px;
|
||||||
bottom: 47px;
|
bottom: 47px;
|
||||||
right: 0px;
|
right: 0px;
|
||||||
|
min-height: 150px;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -199,7 +199,6 @@ div.go-to-link {
|
||||||
|
|
||||||
#listing-request-percent-complete {
|
#listing-request-percent-complete {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
width: 100%;
|
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -212,7 +211,6 @@ div.progress-label {
|
||||||
display: block;
|
display: block;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
/*width: 378px;*/
|
|
||||||
margin-top: 4px;
|
margin-top: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -264,7 +262,7 @@ ul.result li {
|
||||||
font-family: 'Roboto Slab';
|
font-family: 'Roboto Slab';
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
line-height: 56px;
|
padding-bottom: 20px;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -143,4 +143,5 @@ div.history-details-name {
|
||||||
left: 0px;
|
left: 0px;
|
||||||
bottom: 47px;
|
bottom: 47px;
|
||||||
right: 0px;
|
right: 0px;
|
||||||
|
min-height: 150px;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -311,6 +311,14 @@ textarea {
|
||||||
font-size: 13px !important;
|
font-size: 13px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#new-template-description {
|
||||||
|
position: absolute;
|
||||||
|
top: 81px;
|
||||||
|
bottom: 0px;
|
||||||
|
height: inherit;
|
||||||
|
min-height: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
ul.property-info {
|
ul.property-info {
|
||||||
list-style-type: disc;
|
list-style-type: disc;
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
|
|
@ -507,7 +515,8 @@ input:focus {
|
||||||
/* filter controls */
|
/* filter controls */
|
||||||
|
|
||||||
.filter-controls {
|
.filter-controls {
|
||||||
width: 100%;
|
position: absolute;
|
||||||
|
top: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.filter-container {
|
.filter-container {
|
||||||
|
|
@ -606,8 +615,7 @@ div.secondary-button:hover {
|
||||||
}
|
}
|
||||||
|
|
||||||
.scrollable {
|
.scrollable {
|
||||||
background: rgba(255, 255, 255, 1);
|
border-bottom: 1px solid #d0dbe0;
|
||||||
background: linear-gradient(to bottom,rgba(255,255,255,1) 0,rgba(255,255,255,0.50) 95%,rgba(234,238,240,1) 100%);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* progress bars */
|
/* progress bars */
|
||||||
|
|
@ -640,7 +648,7 @@ md-progress-linear > div {
|
||||||
|
|
||||||
#select-template-button {
|
#select-template-button {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 66px;
|
top: 0px;
|
||||||
left: 135px;
|
left: 135px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
|
||||||
|
|
@ -26,11 +26,10 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
#add-process-group-configuration-controller-service {
|
#add-process-group-configuration-controller-service {
|
||||||
float: right;
|
|
||||||
margin-top: 4px;
|
margin-top: 4px;
|
||||||
cursor: pointer;
|
position: absolute;
|
||||||
font-size: 16px;
|
top: 0px;
|
||||||
text-transform: uppercase;
|
right: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* settings tabs */
|
/* settings tabs */
|
||||||
|
|
@ -39,6 +38,11 @@
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#process-group-configuration-tabs-content {
|
||||||
|
top: 53px;
|
||||||
|
bottom: 52px;
|
||||||
|
}
|
||||||
|
|
||||||
#process-group-refresh-container {
|
#process-group-refresh-container {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 20px;
|
bottom: 20px;
|
||||||
|
|
|
||||||
|
|
@ -29,7 +29,6 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
#processor-details div.details-tab {
|
#processor-details div.details-tab {
|
||||||
height: 330px;
|
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -43,7 +42,6 @@
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
padding: 2px 2px 0;
|
padding: 2px 2px 0;
|
||||||
width: 376px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#processor-details div.relationship-name {
|
#processor-details div.relationship-name {
|
||||||
|
|
|
||||||
|
|
@ -110,7 +110,7 @@ input.provenance-filter-list {
|
||||||
#provenance-search-container {
|
#provenance-search-container {
|
||||||
float: right;
|
float: right;
|
||||||
position: relative;
|
position: relative;
|
||||||
top: -38px;
|
top: 42px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#provenance-search-button {
|
#provenance-search-button {
|
||||||
|
|
@ -131,7 +131,6 @@ input.provenance-filter-list {
|
||||||
/* provenance search dialog */
|
/* provenance search dialog */
|
||||||
|
|
||||||
#searchable-fields-container {
|
#searchable-fields-container {
|
||||||
width: 100%;
|
|
||||||
min-height: 185px;
|
min-height: 185px;
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
|
|
@ -334,12 +333,13 @@ div.content-detail-value {
|
||||||
|
|
||||||
#provenance-table {
|
#provenance-table {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 78px;
|
top: 88px;
|
||||||
left: 0px;
|
left: 0px;
|
||||||
bottom: 48px;
|
bottom: 48px;
|
||||||
right: 0px;
|
right: 0px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
|
min-height: 150px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* provenance lineage */
|
/* provenance lineage */
|
||||||
|
|
|
||||||
|
|
@ -67,6 +67,7 @@
|
||||||
left: 0px;
|
left: 0px;
|
||||||
bottom: 68px;
|
bottom: 68px;
|
||||||
right: 0px;
|
right: 0px;
|
||||||
|
min-height: 150px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* queue listing table */
|
/* queue listing table */
|
||||||
|
|
@ -93,7 +94,7 @@ div.flowfile-header {
|
||||||
font-family: 'Roboto Slab';
|
font-family: 'Roboto Slab';
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
line-height: 56px;
|
padding-bottom: 20px;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -81,8 +81,7 @@ div.remote-port-header {
|
||||||
div.remote-ports-container {
|
div.remote-ports-container {
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
overflow-x: hidden;
|
overflow-x: auto;
|
||||||
height: 335px;
|
|
||||||
border: 1px solid #666;
|
border: 1px solid #666;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -33,13 +33,17 @@ div.settings-header-text {
|
||||||
}
|
}
|
||||||
|
|
||||||
div.settings-container {
|
div.settings-container {
|
||||||
margin-top: 18px;
|
position: absolute;
|
||||||
height: 85%;
|
top: 58px;
|
||||||
|
bottom: 0px;
|
||||||
|
left: 0px;
|
||||||
|
right: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#new-service-or-task {
|
#new-service-or-task {
|
||||||
float: right;
|
position: absolute;
|
||||||
cursor: pointer;
|
top: 0px;
|
||||||
|
right: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#settings-refresh-container {
|
#settings-refresh-container {
|
||||||
|
|
@ -53,12 +57,18 @@ div.settings-tabs {
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#settings-tabs-content {
|
||||||
|
top: 53px;
|
||||||
|
bottom: 48px;
|
||||||
|
}
|
||||||
|
|
||||||
div.settings-table {
|
div.settings-table {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 111px;
|
top: 0px;
|
||||||
left: 0px;
|
left: 0px;
|
||||||
bottom: 72px;
|
bottom: 20px;
|
||||||
right: 0px;
|
right: 0px;
|
||||||
|
min-height: 150px;
|
||||||
}
|
}
|
||||||
|
|
||||||
span.sorted {
|
span.sorted {
|
||||||
|
|
|
||||||
|
|
@ -30,8 +30,13 @@
|
||||||
|
|
||||||
#shell-container {
|
#shell-container {
|
||||||
background: #fff;
|
background: #fff;
|
||||||
box-shadow: 0 5px 8px rgba(0,0,0,0.30);
|
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
bottom: 0px;
|
||||||
|
left: 0px;
|
||||||
|
right: 0px;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
#shell-close-container {
|
#shell-close-container {
|
||||||
|
|
@ -74,4 +79,5 @@ div.close-hover {
|
||||||
right: 0px;
|
right: 0px;
|
||||||
bottom: 0px;
|
bottom: 0px;
|
||||||
left: 0px;
|
left: 0px;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
@ -63,7 +63,6 @@
|
||||||
|
|
||||||
#status-history-container {
|
#status-history-container {
|
||||||
float: left;
|
float: left;
|
||||||
margin-bottom: 30px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#status-history-chart-container {
|
#status-history-chart-container {
|
||||||
|
|
|
||||||
|
|
@ -121,8 +121,8 @@ input.search-nodes {
|
||||||
|
|
||||||
#system-diagnostics-refresh-container{
|
#system-diagnostics-refresh-container{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 66px;
|
top: 0px;
|
||||||
right: 20px;
|
right: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#system-diagnostics-loading-container {
|
#system-diagnostics-loading-container {
|
||||||
|
|
@ -228,6 +228,14 @@ div.storage-usage-progressbar div.ui-progressbar-value {
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#summary-tabs-content {
|
||||||
|
top: 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#summary-filter-controls {
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
.summary-tab {
|
.summary-tab {
|
||||||
display: block;
|
display: block;
|
||||||
padding: 0 5px;
|
padding: 0 5px;
|
||||||
|
|
@ -267,12 +275,13 @@ div.storage-usage-progressbar div.ui-progressbar-value {
|
||||||
|
|
||||||
div.summary-table {
|
div.summary-table {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 151px;
|
top: 70px;
|
||||||
left: 0px;
|
left: 0px;
|
||||||
bottom: 48px;
|
bottom: 48px;
|
||||||
right: 0px;
|
right: 0px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
|
min-height: 150px;
|
||||||
}
|
}
|
||||||
|
|
||||||
span.sorted {
|
span.sorted {
|
||||||
|
|
@ -288,9 +297,14 @@ span.sorted {
|
||||||
/* cluster processor summary table */
|
/* cluster processor summary table */
|
||||||
|
|
||||||
#cluster-processor-summary-table {
|
#cluster-processor-summary-table {
|
||||||
|
position: absolute;
|
||||||
|
top: 70px;
|
||||||
|
left: 0px;
|
||||||
|
bottom: 48px;
|
||||||
|
right: 0px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
height: 80%;
|
background-color: #fff;
|
||||||
width: 100%;
|
min-height: 150px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#cluster-processor-summary-header {
|
#cluster-processor-summary-header {
|
||||||
|
|
@ -349,9 +363,14 @@ span.sorted {
|
||||||
/* cluster input port summary table */
|
/* cluster input port summary table */
|
||||||
|
|
||||||
#cluster-input-port-summary-table {
|
#cluster-input-port-summary-table {
|
||||||
|
position: absolute;
|
||||||
|
top: 70px;
|
||||||
|
left: 0px;
|
||||||
|
bottom: 48px;
|
||||||
|
right: 0px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
height: 80%;
|
background-color: #fff;
|
||||||
width: 100%;
|
min-height: 150px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#cluster-input-port-summary-header {
|
#cluster-input-port-summary-header {
|
||||||
|
|
@ -411,9 +430,14 @@ span.sorted {
|
||||||
/* cluster output port summary table */
|
/* cluster output port summary table */
|
||||||
|
|
||||||
#cluster-output-port-summary-table {
|
#cluster-output-port-summary-table {
|
||||||
|
position: absolute;
|
||||||
|
top: 70px;
|
||||||
|
left: 0px;
|
||||||
|
bottom: 48px;
|
||||||
|
right: 0px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
height: 80%;
|
background-color: #fff;
|
||||||
width: 100%;
|
min-height: 150px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#cluster-output-port-summary-header {
|
#cluster-output-port-summary-header {
|
||||||
|
|
@ -473,9 +497,14 @@ span.sorted {
|
||||||
/* cluster remote process group summary table */
|
/* cluster remote process group summary table */
|
||||||
|
|
||||||
#cluster-remote-process-group-summary-table {
|
#cluster-remote-process-group-summary-table {
|
||||||
|
position: absolute;
|
||||||
|
top: 70px;
|
||||||
|
left: 0px;
|
||||||
|
bottom: 48px;
|
||||||
|
right: 0px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
height: 80%;
|
background-color: #fff;
|
||||||
width: 100%;
|
min-height: 150px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#cluster-remote-process-group-summary-header {
|
#cluster-remote-process-group-summary-header {
|
||||||
|
|
@ -533,10 +562,14 @@ span.sorted {
|
||||||
/* cluster connection summary table */
|
/* cluster connection summary table */
|
||||||
|
|
||||||
#cluster-connection-summary-table {
|
#cluster-connection-summary-table {
|
||||||
width: 100%;
|
position: absolute;
|
||||||
|
top: 70px;
|
||||||
|
left: 0px;
|
||||||
|
bottom: 48px;
|
||||||
|
right: 0px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
height: 80%;
|
background-color: #fff;
|
||||||
width: 100%;
|
min-height: 150px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#cluster-connection-summary-header {
|
#cluster-connection-summary-header {
|
||||||
|
|
@ -595,9 +628,14 @@ span.sorted {
|
||||||
/* cluster process group summary table */
|
/* cluster process group summary table */
|
||||||
|
|
||||||
#cluster-process-group-summary-table {
|
#cluster-process-group-summary-table {
|
||||||
|
position: absolute;
|
||||||
|
top: 70px;
|
||||||
|
left: 0px;
|
||||||
|
bottom: 48px;
|
||||||
|
right: 0px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
height: 80%;
|
background-color: #fff;
|
||||||
width: 100%;
|
min-height: 150px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#cluster-process-group-summary-header {
|
#cluster-process-group-summary-header {
|
||||||
|
|
|
||||||
|
|
@ -98,4 +98,5 @@ input.templates-filter-list {
|
||||||
left: 0px;
|
left: 0px;
|
||||||
bottom: 47px;
|
bottom: 47px;
|
||||||
right: 0px;
|
right: 0px;
|
||||||
|
min-height: 150px;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -22,6 +22,9 @@
|
||||||
background-color: #ffffff;
|
background-color: #ffffff;
|
||||||
box-shadow: 0 5px 8px rgba(0,0,0,0.30);
|
box-shadow: 0 5px 8px rgba(0,0,0,0.30);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
left: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.small-dialog {
|
.small-dialog {
|
||||||
|
|
@ -73,8 +76,14 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.dialog-content {
|
.dialog-content {
|
||||||
padding: 10px 20px 20px 20px;
|
position: absolute;
|
||||||
overflow: auto;
|
top: 66px;
|
||||||
|
bottom: 52px;
|
||||||
|
left: 20px;
|
||||||
|
right: 20px;
|
||||||
|
overflow-y: auto;
|
||||||
|
/*padding: 10px 20px 20px 20px;*/
|
||||||
|
/*overflow: auto;*/
|
||||||
}
|
}
|
||||||
|
|
||||||
.dialog-buttons {
|
.dialog-buttons {
|
||||||
|
|
|
||||||
|
|
@ -23,6 +23,7 @@
|
||||||
* header: true,
|
* header: true,
|
||||||
* footer: true,
|
* footer: true,
|
||||||
* headerText: 'Dialog Header',
|
* headerText: 'Dialog Header',
|
||||||
|
* scrollableContentStyle: 'scrollable',
|
||||||
* buttons: [{
|
* buttons: [{
|
||||||
* buttonText: 'Cancel',
|
* buttonText: 'Cancel',
|
||||||
* color: {
|
* color: {
|
||||||
|
|
@ -45,7 +46,8 @@
|
||||||
* }
|
* }
|
||||||
* }],
|
* }],
|
||||||
* handler: {
|
* handler: {
|
||||||
* close: closeHandler
|
* close: closeHandler,
|
||||||
|
* open: openHandler
|
||||||
* }
|
* }
|
||||||
* }
|
* }
|
||||||
*
|
*
|
||||||
|
|
@ -156,9 +158,28 @@
|
||||||
dialog.prepend(dialogHeader);
|
dialog.prepend(dialogHeader);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
var nfDialog = {};
|
||||||
|
if (isDefinedAndNotNull(dialog.data('nf-dialog'))) {
|
||||||
|
nfDialog = dialog.data('nf-dialog');
|
||||||
|
}
|
||||||
|
|
||||||
// save the close handler
|
// save the close handler
|
||||||
if (isDefinedAndNotNull(options.handler)) {
|
if (isDefinedAndNotNull(options.handler)) {
|
||||||
dialog.data('handler', options.handler);
|
if (isDefinedAndNotNull(options.handler.close)) {
|
||||||
|
nfDialog.close = options.handler.close;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// save the open handler
|
||||||
|
if (isDefinedAndNotNull(options.handler)) {
|
||||||
|
if (isDefinedAndNotNull(options.handler.open)) {
|
||||||
|
nfDialog.open = options.handler.open;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// save the scrollable class name
|
||||||
|
if (isDefinedAndNotNull(options.scrollableContentStyle)) {
|
||||||
|
nfDialog.scrollableContentStyle = options.scrollableContentStyle;
|
||||||
}
|
}
|
||||||
|
|
||||||
// determine if dialog needs footer/buttons
|
// determine if dialog needs footer/buttons
|
||||||
|
|
@ -166,6 +187,9 @@
|
||||||
// add the buttons
|
// add the buttons
|
||||||
addButtons(dialog, options.buttons);
|
addButtons(dialog, options.buttons);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
//persist data attribute
|
||||||
|
dialog.data('nfDialog', nfDialog);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
@ -175,9 +199,36 @@
|
||||||
*
|
*
|
||||||
* @argument {function} handler The function to call when hiding the dialog
|
* @argument {function} handler The function to call when hiding the dialog
|
||||||
*/
|
*/
|
||||||
setHandler: function (handler) {
|
setCloseHandler: function (handler) {
|
||||||
return this.each(function () {
|
return this.each(function (index, dialog) {
|
||||||
$(this).data('handler', handler);
|
|
||||||
|
var nfDialog = {};
|
||||||
|
if (isDefinedAndNotNull($(this).data('nf-dialog'))) {
|
||||||
|
nfDialog = $(dialog).data('nf-dialog');
|
||||||
|
}
|
||||||
|
nfDialog.close = handler;
|
||||||
|
|
||||||
|
//persist data attribute
|
||||||
|
$(dialog).data('nfDialog', nfDialog);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Sets the handler that is used when the dialog is opened.
|
||||||
|
*
|
||||||
|
* @argument {function} handler The function to call when showing the dialog
|
||||||
|
*/
|
||||||
|
setOpenHandler: function (handler) {
|
||||||
|
return this.each(function (index, dialog) {
|
||||||
|
|
||||||
|
var nfDialog = {};
|
||||||
|
if (isDefinedAndNotNull($(this).data('nf-dialog'))) {
|
||||||
|
nfDialog = $(dialog).data('nf-dialog');
|
||||||
|
}
|
||||||
|
nfDialog.open = handler;
|
||||||
|
|
||||||
|
//persist data attribute
|
||||||
|
$(dialog).data('nfDialog', nfDialog);
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
@ -211,12 +262,168 @@
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
|
resize: function () {
|
||||||
|
var dialog = $(this);
|
||||||
|
var dialogContent = dialog.find('.dialog-content');
|
||||||
|
|
||||||
|
var nfDialog = {};
|
||||||
|
if (isDefinedAndNotNull(dialog.data('nf-dialog'))) {
|
||||||
|
nfDialog = dialog.data('nf-dialog');
|
||||||
|
}
|
||||||
|
|
||||||
|
//initialize responsive properties
|
||||||
|
if (!isDefinedAndNotNull(nfDialog.responsive)) {
|
||||||
|
nfDialog.responsive = {};
|
||||||
|
|
||||||
|
if (!isDefinedAndNotNull(nfDialog.responsive.x)) {
|
||||||
|
nfDialog.responsive.x = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!isDefinedAndNotNull(nfDialog.responsive.y)) {
|
||||||
|
nfDialog.responsive.y = true;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if (!isDefinedAndNotNull(nfDialog.responsive.x)) {
|
||||||
|
nfDialog.responsive.x = true;
|
||||||
|
} else {
|
||||||
|
nfDialog.responsive.x = (nfDialog.responsive.x == "true" || nfDialog.responsive.x == true) ? true : false;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!isDefinedAndNotNull(nfDialog.responsive.y)) {
|
||||||
|
nfDialog.responsive.y = true;
|
||||||
|
} else {
|
||||||
|
nfDialog.responsive.y = (nfDialog.responsive.y == "true" || nfDialog.responsive.y == true) ? true : false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!isDefinedAndNotNull(nfDialog.resizable)) {
|
||||||
|
nfDialog.resizable = false;
|
||||||
|
} else {
|
||||||
|
nfDialog.resizable = (nfDialog.resizable == "true" || nfDialog.resizable == true) ? true : false;
|
||||||
|
}
|
||||||
|
|
||||||
|
if(nfDialog.resizable){
|
||||||
|
dialogContent.css({
|
||||||
|
'position': 'static',
|
||||||
|
'padding': '10px 20px 52px 20px'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (nfDialog.responsive.y || nfDialog.responsive.x) {
|
||||||
|
|
||||||
|
var fullscreenHeight;
|
||||||
|
var fullscreenWidth;
|
||||||
|
|
||||||
|
if (isDefinedAndNotNull(nfDialog.responsive['fullscreen-height'])) {
|
||||||
|
fullscreenHeight = parseInt(nfDialog.responsive['fullscreen-height'], 10);
|
||||||
|
} else {
|
||||||
|
nfDialog.responsive['fullscreen-height'] = dialog.height() + 'px';
|
||||||
|
|
||||||
|
fullscreenHeight = parseInt(nfDialog.responsive['fullscreen-height'], 10);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (isDefinedAndNotNull(nfDialog.responsive['fullscreen-width'])) {
|
||||||
|
fullscreenWidth = parseInt(nfDialog.responsive['fullscreen-width'], 10);
|
||||||
|
} else {
|
||||||
|
nfDialog.responsive['fullscreen-width'] = dialog.width() + 'px';
|
||||||
|
|
||||||
|
fullscreenWidth = parseInt(nfDialog.responsive['fullscreen-width'], 10);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!isDefinedAndNotNull(nfDialog.width)) {
|
||||||
|
nfDialog.width = dialog.css('width');
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!isDefinedAndNotNull(nfDialog['min-width'])) {
|
||||||
|
if (parseInt(dialog.css('min-width'), 10) > 0) {
|
||||||
|
nfDialog['min-width'] = dialog.css('min-width');
|
||||||
|
} else {
|
||||||
|
nfDialog['min-width'] = nfDialog.width;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//min-width should always be set in terms of px
|
||||||
|
if (nfDialog['min-width'].indexOf("%") > 0) {
|
||||||
|
nfDialog['min-width'] = ($(window).width() * (parseInt(nfDialog['min-width'], 10) / 100)) + 'px';
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!isDefinedAndNotNull(nfDialog.height)) {
|
||||||
|
nfDialog.height = dialog.css('height');
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!isDefinedAndNotNull(nfDialog['min-height'])) {
|
||||||
|
if (parseInt(dialog.css('min-height'), 10) > 0) {
|
||||||
|
nfDialog['min-height'] = dialog.css('min-height');
|
||||||
|
} else {
|
||||||
|
nfDialog['min-height'] = nfDialog.height;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//min-height should always be set in terms of px
|
||||||
|
if (nfDialog['min-height'].indexOf("%") > 0) {
|
||||||
|
nfDialog['min-height'] = ($(window).height() * (parseInt(nfDialog['min-height'], 10) / 100)) + 'px';
|
||||||
|
}
|
||||||
|
|
||||||
|
//resize dialog
|
||||||
|
if ($(window).height() < fullscreenHeight) {
|
||||||
|
if (nfDialog.responsive.y) {
|
||||||
|
dialog.css('height', '100%');
|
||||||
|
dialog.css('min-height', '100%');
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
//set the dialog min-height
|
||||||
|
dialog.css('min-height', nfDialog['min-height']);
|
||||||
|
if (nfDialog.responsive.y) {
|
||||||
|
//make sure nfDialog.height is in terms of %
|
||||||
|
if (nfDialog.height.indexOf("px") > 0) {
|
||||||
|
nfDialog.height = (parseInt(nfDialog.height, 10) / $(window).height() * 100) + '%';
|
||||||
|
}
|
||||||
|
dialog.css('height', nfDialog.height);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if ($(window).width() < fullscreenWidth) {
|
||||||
|
if (nfDialog.responsive.x) {
|
||||||
|
dialog.css('width', '100%');
|
||||||
|
dialog.css('min-width', '100%');
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
//set the dialog width
|
||||||
|
dialog.css('min-width', nfDialog['min-width']);
|
||||||
|
if (nfDialog.responsive.x) {
|
||||||
|
//make sure nfDialog.width is in terms of %
|
||||||
|
if (nfDialog.width.indexOf("px") > 0) {
|
||||||
|
nfDialog.width = (parseInt(nfDialog.width, 10) / $(window).width() * 100) + '%';
|
||||||
|
}
|
||||||
|
dialog.css('width', nfDialog.width);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
dialog.center();
|
||||||
|
|
||||||
|
//persist data attribute
|
||||||
|
dialog.data('nfDialog', nfDialog);
|
||||||
|
}
|
||||||
|
|
||||||
|
//apply scrollable style if applicable
|
||||||
|
if (dialogContent[0].offsetHeight < dialogContent[0].scrollHeight) {
|
||||||
|
// your element has overflow
|
||||||
|
if (isDefinedAndNotNull(nfDialog.scrollableContentStyle)) {
|
||||||
|
dialogContent.addClass(nfDialog.scrollableContentStyle);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// your element doesn't have overflow
|
||||||
|
if (isDefinedAndNotNull(nfDialog.scrollableContentStyle)) {
|
||||||
|
dialogContent.removeClass(nfDialog.scrollableContentStyle);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Shows the dialog.
|
* Shows the dialog.
|
||||||
*/
|
*/
|
||||||
show: function () {
|
show: function () {
|
||||||
var dialog = $(this);
|
var dialog = $(this);
|
||||||
var dialogContent = dialog.find('.dialog-content');
|
|
||||||
|
|
||||||
var zIndex = dialog.css('z-index');
|
var zIndex = dialog.css('z-index');
|
||||||
if (zIndex === 'auto') {
|
if (zIndex === 'auto') {
|
||||||
|
|
@ -233,7 +440,7 @@
|
||||||
var index;
|
var index;
|
||||||
return isNaN(index = parseInt($(openDialog).css("z-index"), 10)) ? 0 : index;
|
return isNaN(index = parseInt($(openDialog).css("z-index"), 10)) ? 0 : index;
|
||||||
});
|
});
|
||||||
//Add 2 so that we have room for the modalGlass of the new dialog
|
//Add 2 so that we have room for the glass pane overlay of the new dialog
|
||||||
zIndex = Math.max.apply(null, zVals) + 2;
|
zIndex = Math.max.apply(null, zVals) + 2;
|
||||||
}
|
}
|
||||||
dialog.css('z-index', zIndex);
|
dialog.css('z-index', zIndex);
|
||||||
|
|
@ -243,15 +450,15 @@
|
||||||
nfDialog = dialog.data('nf-dialog');
|
nfDialog = dialog.data('nf-dialog');
|
||||||
}
|
}
|
||||||
|
|
||||||
// determine if dialog needs a glasspane
|
// determine if dialog needs a glass pane overlay
|
||||||
var hasGlasspane;
|
var hasGlasspane;
|
||||||
if (isDefinedAndNotNull(nfDialog.glasspane)) {
|
if (isDefinedAndNotNull(nfDialog.glasspane)) {
|
||||||
hasGlasspane = nfDialog.glasspane;
|
hasGlasspane = nfDialog.glasspane;
|
||||||
} else {
|
} else {
|
||||||
hasGlasspane = true;
|
nfDialog.glasspane = hasGlasspane = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
//create glasspane overlay
|
//create glass pane overlay
|
||||||
if(hasGlasspane && (top === window)) {
|
if(hasGlasspane && (top === window)) {
|
||||||
// build the dialog modal
|
// build the dialog modal
|
||||||
var modalGlassMarkup = '<div data-nf-dialog-parent="' + dialog.attr('id') + '" class="modal-glass"></div>';
|
var modalGlassMarkup = '<div data-nf-dialog-parent="' + dialog.attr('id') + '" class="modal-glass"></div>';
|
||||||
|
|
@ -261,169 +468,21 @@
|
||||||
modalGlass.css('z-index', zIndex - 1).appendTo($('body'));
|
modalGlass.css('z-index', zIndex - 1).appendTo($('body'));
|
||||||
}
|
}
|
||||||
|
|
||||||
var resize = function () {
|
//persist data attribute
|
||||||
//initialize responsive properties
|
dialog.data('nfDialog', nfDialog);
|
||||||
if (!isDefinedAndNotNull(nfDialog.responsive)) {
|
|
||||||
nfDialog.responsive = {};
|
|
||||||
|
|
||||||
if (!isDefinedAndNotNull(nfDialog.responsive.x)) {
|
|
||||||
nfDialog.responsive.x = true;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!isDefinedAndNotNull(nfDialog.responsive.y)) {
|
|
||||||
nfDialog.responsive.y = true;
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
if (!isDefinedAndNotNull(nfDialog.responsive.x)) {
|
|
||||||
nfDialog.responsive.x = true;
|
|
||||||
} else {
|
|
||||||
nfDialog.responsive.x = (nfDialog.responsive.x == "true" || nfDialog.responsive.x == true) ? true : false;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!isDefinedAndNotNull(nfDialog.responsive.y)) {
|
|
||||||
nfDialog.responsive.y = true;
|
|
||||||
} else {
|
|
||||||
nfDialog.responsive.y = (nfDialog.responsive.y == "true" || nfDialog.responsive.y == true) ? true : false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!isDefinedAndNotNull(nfDialog.resizable)) {
|
|
||||||
nfDialog.resizable = false;
|
|
||||||
} else {
|
|
||||||
nfDialog.resizable = (nfDialog.resizable == "true" || nfDialog.resizable == true) ? true : false;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (nfDialog.responsive.y || nfDialog.responsive.x) {
|
|
||||||
|
|
||||||
var fullscreenHeight;
|
|
||||||
var fullscreenWidth;
|
|
||||||
|
|
||||||
if (isDefinedAndNotNull(nfDialog.responsive['fullscreen-height'])) {
|
|
||||||
fullscreenHeight = parseInt(nfDialog.responsive['fullscreen-height'], 10);
|
|
||||||
} else {
|
|
||||||
nfDialog.responsive['fullscreen-height'] = dialog.height() + 'px';
|
|
||||||
|
|
||||||
fullscreenHeight = parseInt(nfDialog.responsive['fullscreen-height'], 10);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (isDefinedAndNotNull(nfDialog.responsive['fullscreen-width'])) {
|
|
||||||
fullscreenWidth = parseInt(nfDialog.responsive['fullscreen-width'], 10);
|
|
||||||
} else {
|
|
||||||
nfDialog.responsive['fullscreen-width'] = dialog.width() + 'px';
|
|
||||||
|
|
||||||
fullscreenWidth = parseInt(nfDialog.responsive['fullscreen-width'], 10);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!isDefinedAndNotNull(nfDialog.width)) {
|
|
||||||
nfDialog.width = dialog.css('width');
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!isDefinedAndNotNull(nfDialog['min-width'])) {
|
|
||||||
if (parseInt(dialog.css('min-width'), 10) > 0) {
|
|
||||||
nfDialog['min-width'] = dialog.css('min-width');
|
|
||||||
} else {
|
|
||||||
nfDialog['min-width'] = nfDialog.width;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
//min-width should always be set in terms of px
|
|
||||||
if (nfDialog['min-width'].indexOf("%") > 0) {
|
|
||||||
nfDialog['min-width'] = ($(window).width() * (parseInt(nfDialog['min-width'], 10) / 100)) + 'px';
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!isDefinedAndNotNull(nfDialog.height)) {
|
|
||||||
nfDialog.height = dialog.css('height');
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!isDefinedAndNotNull(nfDialog['min-height'])) {
|
|
||||||
if (parseInt(dialog.css('min-height'), 10) > 0) {
|
|
||||||
nfDialog['min-height'] = dialog.css('min-height');
|
|
||||||
} else {
|
|
||||||
nfDialog['min-height'] = nfDialog.height;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
//min-height should always be set in terms of px
|
|
||||||
if (nfDialog['min-height'].indexOf("%") > 0) {
|
|
||||||
nfDialog['min-height'] = ($(window).height() * (parseInt(nfDialog['min-height'], 10) / 100)) + 'px';
|
|
||||||
}
|
|
||||||
|
|
||||||
//resize dialog
|
|
||||||
if ($(window).height() < fullscreenHeight) {
|
|
||||||
if (nfDialog.responsive.y) {
|
|
||||||
dialog.css('height', '100%');
|
|
||||||
dialog.css('min-height', '100%');
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
//set the dialog min-height
|
|
||||||
dialog.css('min-height', nfDialog['min-height']);
|
|
||||||
if (nfDialog.responsive.y) {
|
|
||||||
//make sure nfDialog.height is in terms of %
|
|
||||||
if (nfDialog.height.indexOf("px") > 0) {
|
|
||||||
nfDialog.height = (parseInt(nfDialog.height, 10) / $(window).height() * 100) + '%';
|
|
||||||
}
|
|
||||||
dialog.css('height', nfDialog.height);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if ($(window).width() < fullscreenWidth) {
|
|
||||||
if (nfDialog.responsive.x) {
|
|
||||||
dialog.css('width', '100%');
|
|
||||||
dialog.css('min-width', '100%');
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
//set the dialog width
|
|
||||||
dialog.css('min-width', nfDialog['min-width']);
|
|
||||||
if (nfDialog.responsive.x) {
|
|
||||||
//make sure nfDialog.width is in terms of %
|
|
||||||
if (nfDialog.width.indexOf("px") > 0) {
|
|
||||||
nfDialog.width = (parseInt(nfDialog.width, 10) / $(window).width() * 100) + '%';
|
|
||||||
}
|
|
||||||
dialog.css('width', nfDialog.width);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
dialog.center();
|
|
||||||
|
|
||||||
//persist data attribute
|
|
||||||
dialog.data('nfDialog', nfDialog);
|
|
||||||
}
|
|
||||||
|
|
||||||
//resize dialog content
|
|
||||||
if (!nfDialog.resizable) {
|
|
||||||
dialogContent.attr('style', 'height:' +
|
|
||||||
(dialog.outerHeight() -
|
|
||||||
dialog.find('.dialog-header').height() -
|
|
||||||
dialog.find('.dialog-buttons').height() -
|
|
||||||
parseInt(dialogContent.css('padding-top'), 10) -
|
|
||||||
parseInt(dialogContent.css('padding-bottom'), 10) + 'px'));
|
|
||||||
|
|
||||||
if (dialogContent[0].offsetHeight < dialogContent[0].scrollHeight) {
|
|
||||||
// your element have overflow
|
|
||||||
dialogContent.addClass('scrollable');
|
|
||||||
dialog.find('.dialog-buttons').css('background', '#eaeef0');
|
|
||||||
} else {
|
|
||||||
// your element doesn't have overflow
|
|
||||||
dialogContent.removeClass('scrollable');
|
|
||||||
dialog.find('.dialog-buttons').css('background', '#fff');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
// listen for browser resize events to resize and center the dialog
|
|
||||||
$(window).resize(function () {
|
|
||||||
resize();
|
|
||||||
|
|
||||||
dialog.trigger("dialog:resize");
|
|
||||||
});
|
|
||||||
|
|
||||||
return this.each(function () {
|
return this.each(function () {
|
||||||
// show the dialog
|
// show the dialog
|
||||||
if (!dialog.is(':visible')) {
|
if (!dialog.is(':visible')) {
|
||||||
// center and show the dialog
|
dialog.show();
|
||||||
dialog.center().show();
|
dialog.modal('resize');
|
||||||
|
dialog.center();
|
||||||
|
|
||||||
resize();
|
// invoke the handler
|
||||||
|
var handler = dialog.data('nf-dialog').open;
|
||||||
|
if (isDefinedAndNotNull(handler) && typeof handler === 'function') {
|
||||||
|
handler.call(dialog);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
@ -435,16 +494,16 @@
|
||||||
return this.each(function () {
|
return this.each(function () {
|
||||||
var dialog = $(this);
|
var dialog = $(this);
|
||||||
if (dialog.is(':visible')) {
|
if (dialog.is(':visible')) {
|
||||||
// remove the modal backgroun
|
// remove the modal glass pane overlay
|
||||||
$('body').find("[data-nf-dialog-parent='" + dialog.attr('id') + "']").remove();
|
$('body').find("[data-nf-dialog-parent='" + dialog.attr('id') + "']").remove();
|
||||||
|
|
||||||
// hide the dialog
|
// hide the dialog
|
||||||
dialog.hide();
|
dialog.hide();
|
||||||
|
|
||||||
// invoke the handler
|
// invoke the handler
|
||||||
var handler = dialog.data('handler');
|
var handler = dialog.data('nf-dialog').close;
|
||||||
if (isDefinedAndNotNull(handler) && typeof handler.close === 'function') {
|
if (isDefinedAndNotNull(handler) && typeof handler === 'function') {
|
||||||
handler.close.call(dialog);
|
handler.call(dialog);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -44,10 +44,12 @@ div.add-property-text {
|
||||||
}
|
}
|
||||||
|
|
||||||
div.property-table {
|
div.property-table {
|
||||||
width: 100%;
|
position: absolute;
|
||||||
|
top: 43px;
|
||||||
|
bottom: 0px;
|
||||||
|
left: 0px;
|
||||||
|
right: 0px;
|
||||||
min-height: 150px;
|
min-height: 150px;
|
||||||
overflow: hidden;
|
|
||||||
height: 90%;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.property-table .fa {
|
.property-table .fa {
|
||||||
|
|
|
||||||
|
|
@ -923,6 +923,7 @@
|
||||||
|
|
||||||
newControllerServiceDialog.modal({
|
newControllerServiceDialog.modal({
|
||||||
headerText: 'Add Controller Service',
|
headerText: 'Add Controller Service',
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Create',
|
buttonText: 'Create',
|
||||||
color: {
|
color: {
|
||||||
|
|
@ -1492,6 +1493,7 @@
|
||||||
|
|
||||||
newPropertyDialog.modal({
|
newPropertyDialog.modal({
|
||||||
headerText: 'Add Property',
|
headerText: 'Add Property',
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Ok',
|
buttonText: 'Ok',
|
||||||
color: {
|
color: {
|
||||||
|
|
|
||||||
|
|
@ -64,13 +64,28 @@ div.configuration-tab {
|
||||||
}
|
}
|
||||||
|
|
||||||
div[id$=-tabs-content] {
|
div[id$=-tabs-content] {
|
||||||
height: 85%;
|
overflow: auto;
|
||||||
|
position: absolute;
|
||||||
|
top: 33px;
|
||||||
|
bottom: 0px;
|
||||||
|
left: 0px;
|
||||||
|
right: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
div[id$=-tab-content] {
|
div[id$=-tab-content] {
|
||||||
height: 100%;
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
right: 0px;
|
||||||
|
left: 0px;
|
||||||
|
bottom: 0px;
|
||||||
|
padding-top: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
div[id$=-properties] {
|
div[id$=-properties] {
|
||||||
height: 100%;
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
right: 0px;
|
||||||
|
left: 0px;
|
||||||
|
bottom: 0px;
|
||||||
|
padding-top: 10px;
|
||||||
}
|
}
|
||||||
|
|
@ -44,8 +44,8 @@
|
||||||
* }],
|
* }],
|
||||||
* select: selectHandler
|
* select: selectHandler
|
||||||
* }
|
* }
|
||||||
*
|
*
|
||||||
* @argument {object} options
|
* @argument {object} options
|
||||||
*/
|
*/
|
||||||
$.fn.tabbs = function (options) {
|
$.fn.tabbs = function (options) {
|
||||||
return this.each(function () {
|
return this.each(function () {
|
||||||
|
|
@ -62,7 +62,7 @@
|
||||||
var tabDefinition = this;
|
var tabDefinition = this;
|
||||||
|
|
||||||
// mark the tab content
|
// mark the tab content
|
||||||
$('#' + tabDefinition.tabContentId).addClass(tabContentStyle);
|
$('#' + tabDefinition.tabContentId).addClass(tabContentStyle).hide();
|
||||||
|
|
||||||
// prep the tab itself
|
// prep the tab itself
|
||||||
var tab = $('<li></li>').text(tabDefinition.name).addClass(options.tabStyle).click(function () {
|
var tab = $('<li></li>').text(tabDefinition.name).addClass(options.tabStyle).click(function () {
|
||||||
|
|
@ -70,7 +70,16 @@
|
||||||
$('.' + tabContentStyle).hide();
|
$('.' + tabContentStyle).hide();
|
||||||
|
|
||||||
// show the desired tab
|
// show the desired tab
|
||||||
$('#' + tabDefinition.tabContentId).show();
|
var tabContent = $('#' + tabDefinition.tabContentId).show();
|
||||||
|
|
||||||
|
// check if content has overflow
|
||||||
|
var tabContentContainer = tabContent.parent();
|
||||||
|
if (tabContentContainer.get(0).offsetHeight < tabContentContainer.get(0).scrollHeight ||
|
||||||
|
tabContentContainer.get(0).offsetWidth < tabContentContainer.get(0).scrollWidth) {
|
||||||
|
tabContentContainer.addClass(options.scrollableTabContentStyle);
|
||||||
|
} else {
|
||||||
|
tabContentContainer.removeClass(options.scrollableTabContentStyle);
|
||||||
|
}
|
||||||
|
|
||||||
// unselect the previously selected tab
|
// unselect the previously selected tab
|
||||||
tabList.children('.' + options.tabStyle).removeClass(options.selectedTabStyle);
|
tabList.children('.' + options.tabStyle).removeClass(options.selectedTabStyle);
|
||||||
|
|
|
||||||
|
|
@ -124,14 +124,7 @@ nf.ng.Canvas.GlobalMenuCtrl = function (serviceProvider) {
|
||||||
*/
|
*/
|
||||||
launch: function () {
|
launch: function () {
|
||||||
if (nf.Common.canAccessController()) {
|
if (nf.Common.canAccessController()) {
|
||||||
nf.Settings.showSettings().done(function() {
|
nf.Settings.showSettings();
|
||||||
$('#settings-refresh-container').width($('#shell').width());
|
|
||||||
|
|
||||||
// add a shell:resize listener
|
|
||||||
$('#shell').on('shell:resize', function () {
|
|
||||||
$('#settings-refresh-container').width($('#shell').width());
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -297,6 +290,7 @@ nf.ng.Canvas.GlobalMenuCtrl = function (serviceProvider) {
|
||||||
var self = this;
|
var self = this;
|
||||||
|
|
||||||
this.getElement().modal({
|
this.getElement().modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'About Apache NiFi',
|
headerText: 'About Apache NiFi',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Ok',
|
buttonText: 'Ok',
|
||||||
|
|
|
||||||
|
|
@ -58,6 +58,7 @@ nf.ng.Canvas.OperateCtrl = function () {
|
||||||
init: function () {
|
init: function () {
|
||||||
// configure the create template dialog
|
// configure the create template dialog
|
||||||
this.getElement().modal({
|
this.getElement().modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Create Template'
|
headerText: 'Create Template'
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
@ -250,6 +251,7 @@ nf.ng.Canvas.OperateCtrl = function () {
|
||||||
init: function () {
|
init: function () {
|
||||||
// configure the create fillcolor dialog
|
// configure the create fillcolor dialog
|
||||||
this.getElement().modal({
|
this.getElement().modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Change Color',
|
headerText: 'Change Color',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Apply',
|
buttonText: 'Apply',
|
||||||
|
|
|
||||||
|
|
@ -89,6 +89,7 @@ nf.ng.GroupComponent = function (serviceProvider) {
|
||||||
init: function () {
|
init: function () {
|
||||||
// configure the new process group dialog
|
// configure the new process group dialog
|
||||||
this.getElement().modal({
|
this.getElement().modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Add Process Group',
|
headerText: 'Add Process Group',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
|
|
|
||||||
|
|
@ -89,6 +89,7 @@ nf.ng.InputPortComponent = function (serviceProvider) {
|
||||||
init: function () {
|
init: function () {
|
||||||
// configure the new port dialog
|
// configure the new port dialog
|
||||||
this.getElement().modal({
|
this.getElement().modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Add Port',
|
headerText: 'Add Port',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
|
|
|
||||||
|
|
@ -415,6 +415,7 @@ nf.ng.ProcessorComponent = function (serviceProvider) {
|
||||||
|
|
||||||
// configure the new processor dialog
|
// configure the new processor dialog
|
||||||
this.getElement().modal({
|
this.getElement().modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Add Processor'
|
headerText: 'Add Processor'
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
@ -561,7 +562,7 @@ nf.ng.ProcessorComponent = function (serviceProvider) {
|
||||||
}]);
|
}]);
|
||||||
|
|
||||||
// set a new handler for closing the the dialog
|
// set a new handler for closing the the dialog
|
||||||
this.modal.update('setHandler', {
|
this.modal.update('setCloseHandler', {
|
||||||
close: function () {
|
close: function () {
|
||||||
// remove the handler
|
// remove the handler
|
||||||
grid.onDblClick.unsubscribe(gridDoubleClick);
|
grid.onDblClick.unsubscribe(gridDoubleClick);
|
||||||
|
|
|
||||||
|
|
@ -119,6 +119,7 @@ nf.ng.RemoteProcessGroupComponent = function (serviceProvider) {
|
||||||
var defaultYieldDuration = "10 sec";
|
var defaultYieldDuration = "10 sec";
|
||||||
// configure the new remote process group dialog
|
// configure the new remote process group dialog
|
||||||
this.getElement().modal({
|
this.getElement().modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Add Remote Process Group',
|
headerText: 'Add Remote Process Group',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
|
|
|
||||||
|
|
@ -76,6 +76,7 @@ nf.ng.TemplateComponent = function (serviceProvider) {
|
||||||
init: function () {
|
init: function () {
|
||||||
// configure the instantiate template dialog
|
// configure the instantiate template dialog
|
||||||
this.getElement().modal({
|
this.getElement().modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Add Template',
|
headerText: 'Add Template',
|
||||||
overlayBackgroud: false
|
overlayBackgroud: false
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -35,6 +35,7 @@ nf.Actions = (function () {
|
||||||
|
|
||||||
// configure the drop request status dialog
|
// configure the drop request status dialog
|
||||||
$('#drop-request-status-dialog').modal({
|
$('#drop-request-status-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
// reset the progress bar
|
// reset the progress bar
|
||||||
|
|
|
||||||
|
|
@ -134,7 +134,7 @@ nf.Canvas = (function () {
|
||||||
cluster: '../nifi-api/controller/cluster'
|
cluster: '../nifi-api/controller/cluster'
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Starts polling.
|
* Starts polling.
|
||||||
*
|
*
|
||||||
|
|
@ -299,42 +299,42 @@ nf.Canvas = (function () {
|
||||||
|
|
||||||
// handle canvas events
|
// handle canvas events
|
||||||
svg.on('mousedown.selection', function () {
|
svg.on('mousedown.selection', function () {
|
||||||
canvasClicked = true;
|
canvasClicked = true;
|
||||||
|
|
||||||
if (d3.event.button !== 0) {
|
if (d3.event.button !== 0) {
|
||||||
// prevent further propagation (to parents and others handlers
|
// prevent further propagation (to parents and others handlers
|
||||||
// on the same element to prevent zoom behavior)
|
// on the same element to prevent zoom behavior)
|
||||||
d3.event.stopImmediatePropagation();
|
d3.event.stopImmediatePropagation();
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
// show selection box if shift is held down
|
// show selection box if shift is held down
|
||||||
if (d3.event.shiftKey) {
|
if (d3.event.shiftKey) {
|
||||||
var position = d3.mouse(canvas.node());
|
var position = d3.mouse(canvas.node());
|
||||||
canvas.append('rect')
|
canvas.append('rect')
|
||||||
.attr('rx', 6)
|
.attr('rx', 6)
|
||||||
.attr('ry', 6)
|
.attr('ry', 6)
|
||||||
.attr('x', position[0])
|
.attr('x', position[0])
|
||||||
.attr('y', position[1])
|
.attr('y', position[1])
|
||||||
.attr('class', 'selection')
|
.attr('class', 'selection')
|
||||||
.attr('width', 0)
|
.attr('width', 0)
|
||||||
.attr('height', 0)
|
.attr('height', 0)
|
||||||
.attr('stroke-width', function () {
|
.attr('stroke-width', function () {
|
||||||
return 1 / nf.Canvas.View.scale();
|
return 1 / nf.Canvas.View.scale();
|
||||||
})
|
})
|
||||||
.attr('stroke-dasharray', function () {
|
.attr('stroke-dasharray', function () {
|
||||||
return 4 / nf.Canvas.View.scale();
|
return 4 / nf.Canvas.View.scale();
|
||||||
})
|
})
|
||||||
.datum(position);
|
.datum(position);
|
||||||
|
|
||||||
// prevent further propagation (to parents and others handlers
|
// prevent further propagation (to parents and others handlers
|
||||||
// on the same element to prevent zoom behavior)
|
// on the same element to prevent zoom behavior)
|
||||||
d3.event.stopImmediatePropagation();
|
d3.event.stopImmediatePropagation();
|
||||||
|
|
||||||
// prevents the browser from changing to a text selection cursor
|
// prevents the browser from changing to a text selection cursor
|
||||||
d3.event.preventDefault();
|
d3.event.preventDefault();
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
.on('mousemove.selection', function () {
|
.on('mousemove.selection', function () {
|
||||||
// update selection box if shift is held down
|
// update selection box if shift is held down
|
||||||
if (d3.event.shiftKey) {
|
if (d3.event.shiftKey) {
|
||||||
|
|
@ -451,7 +451,7 @@ nf.Canvas = (function () {
|
||||||
});
|
});
|
||||||
svg.attr({
|
svg.attr({
|
||||||
'height': canvasContainer.height(),
|
'height': canvasContainer.height(),
|
||||||
'width': canvasContainer.width()
|
'width': $(window).width()
|
||||||
});
|
});
|
||||||
|
|
||||||
//breadcrumbs
|
//breadcrumbs
|
||||||
|
|
@ -478,15 +478,48 @@ nf.Canvas = (function () {
|
||||||
updateGraphSize();
|
updateGraphSize();
|
||||||
updateFlowStatusContainerSize();
|
updateFlowStatusContainerSize();
|
||||||
|
|
||||||
// resize grids when appropriate
|
// resize shell when appropriate
|
||||||
var gridElements = $('*[class*="slickgrid_"]');
|
var shell = $('#shell-dialog');
|
||||||
for (var i = 0, len = gridElements.length; i < len; i++) {
|
if (shell.is(':visible')){
|
||||||
if ($(gridElements[i]).is(':visible')){
|
setTimeout(function(shell){
|
||||||
setTimeout(function(gridElement){
|
nf.Shell.resizeContent(shell);
|
||||||
gridElement.data('gridInstance').resizeCanvas();
|
if(shell.find('#shell-iframe').is(':visible')) {
|
||||||
}, 50, $(gridElements[i]));
|
nf.Shell.resizeIframe(shell);
|
||||||
|
}
|
||||||
|
}, 50, shell);
|
||||||
|
}
|
||||||
|
|
||||||
|
// resize dialogs when appropriate
|
||||||
|
var dialogs = $('.dialog');
|
||||||
|
for (var i = 0, len = dialogs.length; i < len; i++) {
|
||||||
|
if ($(dialogs[i]).is(':visible')){
|
||||||
|
setTimeout(function(dialog){
|
||||||
|
dialog.modal('resize');
|
||||||
|
}, 50, $(dialogs[i]));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// resize grids when appropriate
|
||||||
|
var gridElements = $('*[class*="slickgrid_"]');
|
||||||
|
for (var j = 0, len = gridElements.length; j < len; j++) {
|
||||||
|
if ($(gridElements[j]).is(':visible')){
|
||||||
|
setTimeout(function(gridElement){
|
||||||
|
gridElement.data('gridInstance').resizeCanvas();
|
||||||
|
}, 50, $(gridElements[j]));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// toggle tabs .scrollable when appropriate
|
||||||
|
var tabsContainers = $('.tab-container');
|
||||||
|
var tabsContents = [];
|
||||||
|
for (var k = 0, len = tabsContainers.length; k < len; k++) {
|
||||||
|
if ($(tabsContainers[k]).is(':visible')){
|
||||||
|
tabsContents.push($('#' + $(tabsContainers[k]).attr('id') + '-content'));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
$.each(tabsContents, function (index, tabsContent) {
|
||||||
|
nf.Common.toggleScrollable(tabsContent.get(0));
|
||||||
|
});
|
||||||
}
|
}
|
||||||
}).on('keydown', function (evt) {
|
}).on('keydown', function (evt) {
|
||||||
// if a dialog is open, disable canvas shortcuts
|
// if a dialog is open, disable canvas shortcuts
|
||||||
|
|
@ -606,7 +639,7 @@ nf.Canvas = (function () {
|
||||||
|
|
||||||
// update the access policies
|
// update the access policies
|
||||||
accessPolicy = flowResponse.accessPolicy;
|
accessPolicy = flowResponse.accessPolicy;
|
||||||
|
|
||||||
// update the breadcrumbs
|
// update the breadcrumbs
|
||||||
nf.ng.Bridge.injector.get('breadcrumbsCtrl').resetBreadcrumbs();
|
nf.ng.Bridge.injector.get('breadcrumbsCtrl').resetBreadcrumbs();
|
||||||
nf.ng.Bridge.injector.get('breadcrumbsCtrl').generateBreadcrumbs(breadcrumb);
|
nf.ng.Bridge.injector.get('breadcrumbsCtrl').generateBreadcrumbs(breadcrumb);
|
||||||
|
|
@ -746,7 +779,7 @@ nf.Canvas = (function () {
|
||||||
userXhr.done(function () {
|
userXhr.done(function () {
|
||||||
// load the client id
|
// load the client id
|
||||||
var clientXhr = nf.Client.init();
|
var clientXhr = nf.Client.init();
|
||||||
|
|
||||||
// get the controller config to register the status poller
|
// get the controller config to register the status poller
|
||||||
var configXhr = $.ajax({
|
var configXhr = $.ajax({
|
||||||
type: 'GET',
|
type: 'GET',
|
||||||
|
|
@ -898,10 +931,10 @@ nf.Canvas = (function () {
|
||||||
return accessPolicy.canRead === true;
|
return accessPolicy.canRead === true;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Whether the current user can write in this group.
|
* Whether the current user can write in this group.
|
||||||
*
|
*
|
||||||
* @returns {boolean} can write
|
* @returns {boolean} can write
|
||||||
*/
|
*/
|
||||||
canWrite: function () {
|
canWrite: function () {
|
||||||
|
|
|
||||||
|
|
@ -224,6 +224,7 @@ nf.ComponentState = (function () {
|
||||||
|
|
||||||
// initialize the processor configuration dialog
|
// initialize the processor configuration dialog
|
||||||
$('#component-state-dialog').modal({
|
$('#component-state-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Component State',
|
headerText: 'Component State',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Close',
|
buttonText: 'Close',
|
||||||
|
|
|
||||||
|
|
@ -1123,11 +1123,15 @@ nf.ConnectionConfiguration = (function () {
|
||||||
|
|
||||||
// initialize the configure connection dialog
|
// initialize the configure connection dialog
|
||||||
$('#connection-configuration').modal({
|
$('#connection-configuration').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Configure Connection',
|
headerText: 'Configure Connection',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
// reset the dialog on close
|
// reset the dialog on close
|
||||||
resetDialog();
|
resetDialog();
|
||||||
|
},
|
||||||
|
open: function () {
|
||||||
|
nf.Common.toggleScrollable($('#' + this.find('.tab-container').attr('id') + '-content').get(0));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
@ -1136,6 +1140,7 @@ nf.ConnectionConfiguration = (function () {
|
||||||
$('#connection-configuration-tabs').tabbs({
|
$('#connection-configuration-tabs').tabbs({
|
||||||
tabStyle: 'tab',
|
tabStyle: 'tab',
|
||||||
selectedTabStyle: 'selected-tab',
|
selectedTabStyle: 'selected-tab',
|
||||||
|
scrollableTabContentStyle: 'scrollable',
|
||||||
tabs: [{
|
tabs: [{
|
||||||
name: 'Details',
|
name: 'Details',
|
||||||
tabContentId: 'connection-details-tab-content'
|
tabContentId: 'connection-details-tab-content'
|
||||||
|
|
|
||||||
|
|
@ -1523,6 +1523,7 @@ nf.ControllerService = (function () {
|
||||||
$('#controller-service-configuration-tabs').tabbs({
|
$('#controller-service-configuration-tabs').tabbs({
|
||||||
tabStyle: 'tab',
|
tabStyle: 'tab',
|
||||||
selectedTabStyle: 'selected-tab',
|
selectedTabStyle: 'selected-tab',
|
||||||
|
scrollableTabContentStyle: 'scrollable',
|
||||||
tabs: [{
|
tabs: [{
|
||||||
name: 'Settings',
|
name: 'Settings',
|
||||||
tabContentId: 'controller-service-standard-settings-tab-content'
|
tabContentId: 'controller-service-standard-settings-tab-content'
|
||||||
|
|
@ -1554,6 +1555,7 @@ nf.ControllerService = (function () {
|
||||||
// initialize the conroller service configuration dialog
|
// initialize the conroller service configuration dialog
|
||||||
$('#controller-service-configuration').modal({
|
$('#controller-service-configuration').modal({
|
||||||
headerText: 'Configure Controller Service',
|
headerText: 'Configure Controller Service',
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
// empty the referencing components list
|
// empty the referencing components list
|
||||||
|
|
@ -1573,6 +1575,9 @@ nf.ControllerService = (function () {
|
||||||
|
|
||||||
// removed the cached controller service details
|
// removed the cached controller service details
|
||||||
$('#controller-service-configuration').removeData('controllerServiceDetails');
|
$('#controller-service-configuration').removeData('controllerServiceDetails');
|
||||||
|
},
|
||||||
|
open: function () {
|
||||||
|
nf.Common.toggleScrollable($('#' + this.find('.tab-container').attr('id') + '-content').get(0));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
@ -1580,6 +1585,7 @@ nf.ControllerService = (function () {
|
||||||
// initialize the disable service dialog
|
// initialize the disable service dialog
|
||||||
$('#disable-controller-service-dialog').modal({
|
$('#disable-controller-service-dialog').modal({
|
||||||
headerText: 'Disable Controller Service',
|
headerText: 'Disable Controller Service',
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
var disableDialog = $(this);
|
var disableDialog = $(this);
|
||||||
|
|
@ -1624,6 +1630,7 @@ nf.ControllerService = (function () {
|
||||||
// initialize the enable service dialog
|
// initialize the enable service dialog
|
||||||
$('#enable-controller-service-dialog').modal({
|
$('#enable-controller-service-dialog').modal({
|
||||||
headerText: 'Enable Controller Service',
|
headerText: 'Enable Controller Service',
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
var enableDialog = $(this);
|
var enableDialog = $(this);
|
||||||
|
|
|
||||||
|
|
@ -380,6 +380,7 @@ nf.ControllerServices = (function () {
|
||||||
// initialize the controller service dialog
|
// initialize the controller service dialog
|
||||||
$('#new-controller-service-dialog').modal({
|
$('#new-controller-service-dialog').modal({
|
||||||
headerText: 'Add Controller Service',
|
headerText: 'Add Controller Service',
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
// clear the selected row
|
// clear the selected row
|
||||||
|
|
|
||||||
|
|
@ -322,6 +322,7 @@ nf.GoTo = (function () {
|
||||||
*/
|
*/
|
||||||
init: function () {
|
init: function () {
|
||||||
$('#connections-dialog').modal({
|
$('#connections-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Close',
|
buttonText: 'Close',
|
||||||
color: {
|
color: {
|
||||||
|
|
|
||||||
|
|
@ -28,6 +28,7 @@ nf.LabelConfiguration = (function () {
|
||||||
init: function () {
|
init: function () {
|
||||||
// make the new property dialog draggable
|
// make the new property dialog draggable
|
||||||
$('#label-configuration').modal({
|
$('#label-configuration').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Configure Label',
|
headerText: 'Configure Label',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Apply',
|
buttonText: 'Apply',
|
||||||
|
|
|
||||||
|
|
@ -24,6 +24,7 @@ nf.PortConfiguration = (function () {
|
||||||
*/
|
*/
|
||||||
var initPortConfigurationDialog = function () {
|
var initPortConfigurationDialog = function () {
|
||||||
$('#port-configuration').modal({
|
$('#port-configuration').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Configure Port',
|
headerText: 'Configure Port',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Apply',
|
buttonText: 'Apply',
|
||||||
|
|
|
||||||
|
|
@ -23,6 +23,7 @@ nf.PortDetails = (function () {
|
||||||
init: function () {
|
init: function () {
|
||||||
// configure the processor details dialog
|
// configure the processor details dialog
|
||||||
$('#port-details').modal({
|
$('#port-details').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Port Details',
|
headerText: 'Port Details',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Ok',
|
buttonText: 'Ok',
|
||||||
|
|
|
||||||
|
|
@ -175,12 +175,6 @@ nf.ProcessGroupConfiguration = (function () {
|
||||||
nf.Shell.showContent('#process-group-configuration').done(function () {
|
nf.Shell.showContent('#process-group-configuration').done(function () {
|
||||||
reset();
|
reset();
|
||||||
});
|
});
|
||||||
$('#process-group-refresh-container').width($('#shell').width());
|
|
||||||
|
|
||||||
// add a shell:resize listener
|
|
||||||
$('#shell').on('shell:resize', function () {
|
|
||||||
$('#process-group-refresh-container').width($('#shell').width());
|
|
||||||
});
|
|
||||||
|
|
||||||
// adjust the table size
|
// adjust the table size
|
||||||
nf.ProcessGroupConfiguration.resetTableSize();
|
nf.ProcessGroupConfiguration.resetTableSize();
|
||||||
|
|
@ -207,6 +201,7 @@ nf.ProcessGroupConfiguration = (function () {
|
||||||
$('#process-group-configuration-tabs').tabbs({
|
$('#process-group-configuration-tabs').tabbs({
|
||||||
tabStyle: 'tab',
|
tabStyle: 'tab',
|
||||||
selectedTabStyle: 'selected-tab',
|
selectedTabStyle: 'selected-tab',
|
||||||
|
scrollableTabContentStyle: 'scrollable',
|
||||||
tabs: [{
|
tabs: [{
|
||||||
name: 'General',
|
name: 'General',
|
||||||
tabContentId: 'general-process-group-configuration-tab-content'
|
tabContentId: 'general-process-group-configuration-tab-content'
|
||||||
|
|
|
||||||
|
|
@ -23,6 +23,7 @@ nf.ProcessGroupDetails = (function () {
|
||||||
init: function () {
|
init: function () {
|
||||||
// configure the processor details dialog
|
// configure the processor details dialog
|
||||||
$('#process-group-details').modal({
|
$('#process-group-details').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Process Group Details',
|
headerText: 'Process Group Details',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Ok',
|
buttonText: 'Ok',
|
||||||
|
|
|
||||||
|
|
@ -456,6 +456,7 @@ nf.ProcessorConfiguration = (function () {
|
||||||
$('#processor-configuration-tabs').tabbs({
|
$('#processor-configuration-tabs').tabbs({
|
||||||
tabStyle: 'tab',
|
tabStyle: 'tab',
|
||||||
selectedTabStyle: 'selected-tab',
|
selectedTabStyle: 'selected-tab',
|
||||||
|
scrollableTabContentStyle: 'scrollable',
|
||||||
tabs: [{
|
tabs: [{
|
||||||
name: 'Settings',
|
name: 'Settings',
|
||||||
tabContentId: 'processor-standard-settings-tab-content'
|
tabContentId: 'processor-standard-settings-tab-content'
|
||||||
|
|
@ -491,6 +492,7 @@ nf.ProcessorConfiguration = (function () {
|
||||||
|
|
||||||
// initialize the processor configuration dialog
|
// initialize the processor configuration dialog
|
||||||
$('#processor-configuration').modal({
|
$('#processor-configuration').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Configure Processor',
|
headerText: 'Configure Processor',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
|
|
@ -502,6 +504,9 @@ nf.ProcessorConfiguration = (function () {
|
||||||
|
|
||||||
// removed the cached processor details
|
// removed the cached processor details
|
||||||
$('#processor-configuration').removeData('processorDetails');
|
$('#processor-configuration').removeData('processorDetails');
|
||||||
|
},
|
||||||
|
open: function () {
|
||||||
|
nf.Common.toggleScrollable($('#' + this.find('.tab-container').attr('id') + '-content').get(0));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -41,6 +41,8 @@ nf.QueueListing = (function () {
|
||||||
|
|
||||||
// configure the drop request status dialog
|
// configure the drop request status dialog
|
||||||
$('#listing-request-status-dialog').modal({
|
$('#listing-request-status-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
|
headerText: 'Queue Listing',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
// reset the progress bar
|
// reset the progress bar
|
||||||
|
|
@ -189,6 +191,7 @@ nf.QueueListing = (function () {
|
||||||
$('#flowfile-details-tabs').tabbs({
|
$('#flowfile-details-tabs').tabbs({
|
||||||
tabStyle: 'tab',
|
tabStyle: 'tab',
|
||||||
selectedTabStyle: 'selected-tab',
|
selectedTabStyle: 'selected-tab',
|
||||||
|
scrollableTabContentStyle: 'scrollable',
|
||||||
tabs: [{
|
tabs: [{
|
||||||
name: 'Details',
|
name: 'Details',
|
||||||
tabContentId: 'flowfile-details-tab-content'
|
tabContentId: 'flowfile-details-tab-content'
|
||||||
|
|
@ -199,6 +202,7 @@ nf.QueueListing = (function () {
|
||||||
});
|
});
|
||||||
|
|
||||||
$('#flowfile-details-dialog').modal({
|
$('#flowfile-details-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'FlowFile',
|
headerText: 'FlowFile',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Ok',
|
buttonText: 'Ok',
|
||||||
|
|
@ -219,6 +223,9 @@ nf.QueueListing = (function () {
|
||||||
$('#flowfile-attributes-container').empty();
|
$('#flowfile-attributes-container').empty();
|
||||||
$('#flowfile-cluster-node-id').text('');
|
$('#flowfile-cluster-node-id').text('');
|
||||||
$('#additional-flowfile-details').empty();
|
$('#additional-flowfile-details').empty();
|
||||||
|
},
|
||||||
|
open: function () {
|
||||||
|
nf.Common.toggleScrollable($('#' + this.find('.tab-container').attr('id') + '-content').get(0));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
@ -245,7 +252,7 @@ nf.QueueListing = (function () {
|
||||||
// update the progress bar
|
// update the progress bar
|
||||||
var label = $('<div class="progress-label"></div>').text(percentComplete + '%');
|
var label = $('<div class="progress-label"></div>').text(percentComplete + '%');
|
||||||
if (percentComplete > 0) {
|
if (percentComplete > 0) {
|
||||||
label.css('margin-top', '-19px');
|
label.css('margin-top', '-24px');
|
||||||
}
|
}
|
||||||
progressBar.progressbar('value', percentComplete).append(label);
|
progressBar.progressbar('value', percentComplete).append(label);
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -22,6 +22,7 @@ nf.RemoteProcessGroupConfiguration = (function () {
|
||||||
init: function () {
|
init: function () {
|
||||||
$('#remote-process-group-configuration').modal({
|
$('#remote-process-group-configuration').modal({
|
||||||
headerText: 'Configure Remote Process Group',
|
headerText: 'Configure Remote Process Group',
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Apply',
|
buttonText: 'Apply',
|
||||||
color: {
|
color: {
|
||||||
|
|
|
||||||
|
|
@ -22,6 +22,7 @@ nf.RemoteProcessGroupDetails = (function () {
|
||||||
init: function () {
|
init: function () {
|
||||||
$('#remote-process-group-details').modal({
|
$('#remote-process-group-details').modal({
|
||||||
headerText: 'Remote Process Group Details',
|
headerText: 'Remote Process Group Details',
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Ok',
|
buttonText: 'Ok',
|
||||||
color: {
|
color: {
|
||||||
|
|
|
||||||
|
|
@ -25,6 +25,7 @@ nf.RemoteProcessGroupPorts = (function () {
|
||||||
var initRemotePortConfigurationDialog = function () {
|
var initRemotePortConfigurationDialog = function () {
|
||||||
$('#remote-port-configuration').modal({
|
$('#remote-port-configuration').modal({
|
||||||
headerText: 'Configure Remote Port',
|
headerText: 'Configure Remote Port',
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Apply',
|
buttonText: 'Apply',
|
||||||
color: {
|
color: {
|
||||||
|
|
@ -146,6 +147,7 @@ nf.RemoteProcessGroupPorts = (function () {
|
||||||
*/
|
*/
|
||||||
var initRemoteProcessGroupConfigurationDialog = function () {
|
var initRemoteProcessGroupConfigurationDialog = function () {
|
||||||
$('#remote-process-group-ports').modal({
|
$('#remote-process-group-ports').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Remote Process Group Ports',
|
headerText: 'Remote Process Group Ports',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Close',
|
buttonText: 'Close',
|
||||||
|
|
|
||||||
|
|
@ -305,6 +305,7 @@ nf.ReportingTask = (function () {
|
||||||
$('#reporting-task-configuration-tabs').tabbs({
|
$('#reporting-task-configuration-tabs').tabbs({
|
||||||
tabStyle: 'tab',
|
tabStyle: 'tab',
|
||||||
selectedTabStyle: 'selected-tab',
|
selectedTabStyle: 'selected-tab',
|
||||||
|
scrollableTabContentStyle: 'scrollable',
|
||||||
tabs: [{
|
tabs: [{
|
||||||
name: 'Settings',
|
name: 'Settings',
|
||||||
tabContentId: 'reporting-task-standard-settings-tab-content'
|
tabContentId: 'reporting-task-standard-settings-tab-content'
|
||||||
|
|
@ -331,6 +332,7 @@ nf.ReportingTask = (function () {
|
||||||
|
|
||||||
// initialize the reporting task configuration dialog
|
// initialize the reporting task configuration dialog
|
||||||
$('#reporting-task-configuration').data('mode', config.edit).modal({
|
$('#reporting-task-configuration').data('mode', config.edit).modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Configure Reporting Task',
|
headerText: 'Configure Reporting Task',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
|
|
@ -345,6 +347,9 @@ nf.ReportingTask = (function () {
|
||||||
|
|
||||||
// removed the cached reporting task details
|
// removed the cached reporting task details
|
||||||
$('#reporting-task-configuration').removeData('reportingTaskDetails');
|
$('#reporting-task-configuration').removeData('reportingTaskDetails');
|
||||||
|
},
|
||||||
|
open: function () {
|
||||||
|
nf.Common.toggleScrollable($('#' + this.find('.tab-container').attr('id') + '-content').get(0));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -530,6 +530,7 @@ nf.Settings = (function () {
|
||||||
|
|
||||||
// initialize the reporting task dialog
|
// initialize the reporting task dialog
|
||||||
$('#new-reporting-task-dialog').modal({
|
$('#new-reporting-task-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Add Reporting Task',
|
headerText: 'Add Reporting Task',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Add',
|
buttonText: 'Add',
|
||||||
|
|
@ -954,6 +955,7 @@ nf.Settings = (function () {
|
||||||
$('#settings-tabs').tabbs({
|
$('#settings-tabs').tabbs({
|
||||||
tabStyle: 'tab',
|
tabStyle: 'tab',
|
||||||
selectedTabStyle: 'selected-tab',
|
selectedTabStyle: 'selected-tab',
|
||||||
|
scrollableTabContentStyle: 'scrollable',
|
||||||
tabs: [{
|
tabs: [{
|
||||||
name: 'General',
|
name: 'General',
|
||||||
tabContentId: 'general-settings-tab-content'
|
tabContentId: 'general-settings-tab-content'
|
||||||
|
|
|
||||||
|
|
@ -335,6 +335,7 @@ nf.ClusterTable = (function () {
|
||||||
init: function () {
|
init: function () {
|
||||||
// initialize the user details dialog
|
// initialize the user details dialog
|
||||||
$('#node-details-dialog').modal({
|
$('#node-details-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Node Details',
|
headerText: 'Node Details',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Ok',
|
buttonText: 'Ok',
|
||||||
|
|
|
||||||
|
|
@ -158,8 +158,40 @@ nf.Counters = (function () {
|
||||||
setBodySize();
|
setBodySize();
|
||||||
}).fail(nf.Common.handleAjaxError);
|
}).fail(nf.Common.handleAjaxError);
|
||||||
|
|
||||||
// listen for browser resize events to reset the body size
|
$(window).on('resize', function (e) {
|
||||||
$(window).resize(setBodySize);
|
setBodySize();
|
||||||
|
// resize dialogs when appropriate
|
||||||
|
var dialogs = $('.dialog');
|
||||||
|
for (var i = 0, len = dialogs.length; i < len; i++) {
|
||||||
|
if ($(dialogs[i]).is(':visible')){
|
||||||
|
setTimeout(function(dialog){
|
||||||
|
dialog.modal('resize');
|
||||||
|
}, 50, $(dialogs[i]));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// resize grids when appropriate
|
||||||
|
var gridElements = $('*[class*="slickgrid_"]');
|
||||||
|
for (var j = 0, len = gridElements.length; j < len; j++) {
|
||||||
|
if ($(gridElements[j]).is(':visible')){
|
||||||
|
setTimeout(function(gridElement){
|
||||||
|
gridElement.data('gridInstance').resizeCanvas();
|
||||||
|
}, 50, $(gridElements[j]));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// toggle tabs .scrollable when appropriate
|
||||||
|
var tabsContainers = $('.tab-container');
|
||||||
|
var tabsContents = [];
|
||||||
|
for (var k = 0, len = tabsContainers.length; k < len; k++) {
|
||||||
|
if ($(tabsContainers[k]).is(':visible')){
|
||||||
|
tabsContents.push($('#' + $(tabsContainers[k]).attr('id') + '-content'));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
$.each(tabsContents, function (index, tabsContent) {
|
||||||
|
nf.Common.toggleScrollable(tabsContent.get(0));
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -40,6 +40,7 @@ nf.HistoryTable = (function () {
|
||||||
*/
|
*/
|
||||||
var initDetailsDialog = function () {
|
var initDetailsDialog = function () {
|
||||||
$('#action-details-dialog').modal({
|
$('#action-details-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Action Details',
|
headerText: 'Action Details',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Ok',
|
buttonText: 'Ok',
|
||||||
|
|
@ -98,6 +99,7 @@ nf.HistoryTable = (function () {
|
||||||
|
|
||||||
// configure the filter dialog
|
// configure the filter dialog
|
||||||
$('#history-filter-dialog').modal({
|
$('#history-filter-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Filter History',
|
headerText: 'Filter History',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Filter',
|
buttonText: 'Filter',
|
||||||
|
|
@ -188,6 +190,7 @@ nf.HistoryTable = (function () {
|
||||||
|
|
||||||
// configure the filter dialog
|
// configure the filter dialog
|
||||||
$('#history-purge-dialog').modal({
|
$('#history-purge-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Purge History',
|
headerText: 'Purge History',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Purge',
|
buttonText: 'Purge',
|
||||||
|
|
|
||||||
|
|
@ -157,8 +157,40 @@ nf.History = (function () {
|
||||||
setBodySize();
|
setBodySize();
|
||||||
}).fail(nf.Common.handleAjaxError);
|
}).fail(nf.Common.handleAjaxError);
|
||||||
|
|
||||||
// listen for browser resize events to reset the body size
|
$(window).on('resize', function (e) {
|
||||||
$(window).resize(setBodySize);
|
setBodySize();
|
||||||
|
// resize dialogs when appropriate
|
||||||
|
var dialogs = $('.dialog');
|
||||||
|
for (var i = 0, len = dialogs.length; i < len; i++) {
|
||||||
|
if ($(dialogs[i]).is(':visible')){
|
||||||
|
setTimeout(function(dialog){
|
||||||
|
dialog.modal('resize');
|
||||||
|
}, 50, $(dialogs[i]));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// resize grids when appropriate
|
||||||
|
var gridElements = $('*[class*="slickgrid_"]');
|
||||||
|
for (var j = 0, len = gridElements.length; j < len; j++) {
|
||||||
|
if ($(gridElements[j]).is(':visible')){
|
||||||
|
setTimeout(function(gridElement){
|
||||||
|
gridElement.data('gridInstance').resizeCanvas();
|
||||||
|
}, 50, $(gridElements[j]));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// toggle tabs .scrollable when appropriate
|
||||||
|
var tabsContainers = $('.tab-container');
|
||||||
|
var tabsContents = [];
|
||||||
|
for (var k = 0, len = tabsContainers.length; k < len; k++) {
|
||||||
|
if ($(tabsContainers[k]).is(':visible')){
|
||||||
|
tabsContents.push($('#' + $(tabsContainers[k]).attr('id') + '-content'));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
$.each(tabsContents, function (index, tabsContent) {
|
||||||
|
nf.Common.toggleScrollable(tabsContent.get(0));
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -328,6 +328,23 @@ nf.Common = (function () {
|
||||||
return $(selector).addClass(normalStyle);
|
return $(selector).addClass(normalStyle);
|
||||||
},
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Determine if an `element` has content overflow and adds the `.scrollable` class if it does.
|
||||||
|
*
|
||||||
|
* @param {HTMLElement} element The DOM element to toggle .scrollable upon.
|
||||||
|
*/
|
||||||
|
toggleScrollable: function (element) {
|
||||||
|
if ($(element).is(':visible')){
|
||||||
|
if (element.offsetHeight < element.scrollHeight ||
|
||||||
|
element.offsetWidth < element.scrollWidth) {
|
||||||
|
// your element has overflow
|
||||||
|
$(element).addClass('scrollable');
|
||||||
|
} else {
|
||||||
|
$(element).removeClass('scrollable');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Method for handling ajax errors.
|
* Method for handling ajax errors.
|
||||||
*
|
*
|
||||||
|
|
|
||||||
|
|
@ -293,6 +293,7 @@ nf.ConnectionDetails = (function () {
|
||||||
$('#connection-details-tabs').tabbs({
|
$('#connection-details-tabs').tabbs({
|
||||||
tabStyle: 'tab',
|
tabStyle: 'tab',
|
||||||
selectedTabStyle: 'selected-tab',
|
selectedTabStyle: 'selected-tab',
|
||||||
|
scrollableTabContentStyle: 'scrollable',
|
||||||
tabs: [{
|
tabs: [{
|
||||||
name: 'Details',
|
name: 'Details',
|
||||||
tabContentId: 'read-only-connection-details-tab-content'
|
tabContentId: 'read-only-connection-details-tab-content'
|
||||||
|
|
@ -305,6 +306,7 @@ nf.ConnectionDetails = (function () {
|
||||||
// configure the connection details dialog
|
// configure the connection details dialog
|
||||||
$('#connection-details').modal({
|
$('#connection-details').modal({
|
||||||
headerText: 'Connection Details',
|
headerText: 'Connection Details',
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Ok',
|
buttonText: 'Ok',
|
||||||
color: {
|
color: {
|
||||||
|
|
@ -345,6 +347,9 @@ nf.ConnectionDetails = (function () {
|
||||||
$('#read-only-back-pressure-object-threshold').text('');
|
$('#read-only-back-pressure-object-threshold').text('');
|
||||||
$('#read-only-back-pressure-data-size-threshold').text('');
|
$('#read-only-back-pressure-data-size-threshold').text('');
|
||||||
$('#read-only-prioritizers').empty();
|
$('#read-only-prioritizers').empty();
|
||||||
|
},
|
||||||
|
open: function () {
|
||||||
|
nf.Common.toggleScrollable($('#' + this.find('.tab-container').attr('id') + '-content').get(0));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -20,6 +20,7 @@
|
||||||
$(document).ready(function () {
|
$(document).ready(function () {
|
||||||
// configure the ok dialog
|
// configure the ok dialog
|
||||||
$('#nf-ok-dialog').modal({
|
$('#nf-ok-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
// clear the content
|
// clear the content
|
||||||
|
|
@ -33,6 +34,7 @@ $(document).ready(function () {
|
||||||
|
|
||||||
// configure the yes/no dialog
|
// configure the yes/no dialog
|
||||||
$('#nf-yes-no-dialog').modal({
|
$('#nf-yes-no-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
// clear the content and reset the button model
|
// clear the content and reset the button model
|
||||||
|
|
|
||||||
|
|
@ -51,6 +51,7 @@ nf.ProcessorDetails = (function () {
|
||||||
$('#processor-details-tabs').tabbs({
|
$('#processor-details-tabs').tabbs({
|
||||||
tabStyle: 'tab',
|
tabStyle: 'tab',
|
||||||
selectedTabStyle: 'selected-tab',
|
selectedTabStyle: 'selected-tab',
|
||||||
|
scrollableTabContentStyle: 'scrollable',
|
||||||
tabs: [{
|
tabs: [{
|
||||||
name: 'Settings',
|
name: 'Settings',
|
||||||
tabContentId: 'details-standard-settings-tab-content'
|
tabContentId: 'details-standard-settings-tab-content'
|
||||||
|
|
@ -84,6 +85,7 @@ nf.ProcessorDetails = (function () {
|
||||||
// configure the processor details dialog
|
// configure the processor details dialog
|
||||||
$('#processor-details').modal({
|
$('#processor-details').modal({
|
||||||
headerText: 'Processor Details',
|
headerText: 'Processor Details',
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
// empty the relationship list
|
// empty the relationship list
|
||||||
|
|
@ -108,6 +110,9 @@ nf.ProcessorDetails = (function () {
|
||||||
// removed the cached processor details
|
// removed the cached processor details
|
||||||
$('#processor-details').removeData('processorDetails');
|
$('#processor-details').removeData('processorDetails');
|
||||||
$('#processor-details').removeData('processorHistory');
|
$('#processor-details').removeData('processorHistory');
|
||||||
|
},
|
||||||
|
open: function () {
|
||||||
|
nf.Common.toggleScrollable($('#' + this.find('.tab-container').attr('id') + '-content').get(0));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -20,6 +20,7 @@
|
||||||
$(document).ready(function () {
|
$(document).ready(function () {
|
||||||
// configure the dialog
|
// configure the dialog
|
||||||
$('#shell-dialog').modal({
|
$('#shell-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
header: false,
|
header: false,
|
||||||
footer: false
|
footer: false
|
||||||
});
|
});
|
||||||
|
|
@ -49,6 +50,26 @@ nf.Shell = (function () {
|
||||||
var showContentResize = null;
|
var showContentResize = null;
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
|
||||||
|
resizeContent: function (shell) {
|
||||||
|
var contentContainer = shell.find('.shell-content-container');
|
||||||
|
contentContainer.css({
|
||||||
|
width: shell.width(),
|
||||||
|
height: shell.height() - 28 - 40 //subtract shell-close-container and padding
|
||||||
|
});
|
||||||
|
shell.trigger("shell:content:resize");
|
||||||
|
},
|
||||||
|
|
||||||
|
// handle resize
|
||||||
|
resizeIframe: function (shell) {
|
||||||
|
var shellIframe = shell.find('#shell-iframe');
|
||||||
|
shellIframe.css({
|
||||||
|
width: shell.width(),
|
||||||
|
height: shell.height() - 28 - 40 //subtract shell-close-container and padding
|
||||||
|
});
|
||||||
|
shell.trigger("shell:iframe:resize");
|
||||||
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Shows a page in the shell.
|
* Shows a page in the shell.
|
||||||
*
|
*
|
||||||
|
|
@ -73,9 +94,12 @@ nf.Shell = (function () {
|
||||||
shell.empty();
|
shell.empty();
|
||||||
|
|
||||||
// register a new close handler
|
// register a new close handler
|
||||||
$('#shell-dialog').modal('setHandler', {
|
$('#shell-dialog').modal('setCloseHandler', {
|
||||||
close: function () {
|
close: function () {
|
||||||
deferred.resolve();
|
deferred.resolve();
|
||||||
|
},
|
||||||
|
open: function () {
|
||||||
|
nf.Common.toggleScrollable($('#' + this.find('.tab-container').attr('id') + '-content').get(0));
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
@ -98,23 +122,6 @@ nf.Shell = (function () {
|
||||||
width: shell.width(),
|
width: shell.width(),
|
||||||
height: shell.height() - 28 //subtract shell-close-container
|
height: shell.height() - 28 //subtract shell-close-container
|
||||||
}).appendTo(shell);
|
}).appendTo(shell);
|
||||||
|
|
||||||
// remove the window resize listener
|
|
||||||
if (typeof showPageResize === 'function') {
|
|
||||||
$(window).off('resize', showPageResize);
|
|
||||||
}
|
|
||||||
|
|
||||||
// handle resize
|
|
||||||
showPageResize = function () {
|
|
||||||
shellIframe.css({
|
|
||||||
width: shell.width(),
|
|
||||||
height: shell.height() - 28 //subtract shell-close-container
|
|
||||||
});
|
|
||||||
shell.trigger("shell:resize");
|
|
||||||
};
|
|
||||||
|
|
||||||
// add a window resize listener
|
|
||||||
$(window).resize(showPageResize);
|
|
||||||
}).promise();
|
}).promise();
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
@ -143,7 +150,7 @@ nf.Shell = (function () {
|
||||||
content.detach();
|
content.detach();
|
||||||
|
|
||||||
// register a new close handler
|
// register a new close handler
|
||||||
$('#shell-dialog').modal('setHandler', {
|
$('#shell-dialog').modal('setCloseHandler', {
|
||||||
close: function () {
|
close: function () {
|
||||||
deferred.resolve();
|
deferred.resolve();
|
||||||
|
|
||||||
|
|
@ -159,30 +166,13 @@ nf.Shell = (function () {
|
||||||
$('#shell-dialog').modal('show');
|
$('#shell-dialog').modal('show');
|
||||||
|
|
||||||
// create the content container
|
// create the content container
|
||||||
var contentContainer = $('<div>').css({
|
var contentContainer = $('<div>').addClass('shell-content-container').css({
|
||||||
width: shell.width(),
|
width: shell.width(),
|
||||||
height: shell.height()
|
height: shell.height()
|
||||||
}).append(content).appendTo(shell);
|
}).append(content).appendTo(shell);
|
||||||
|
|
||||||
// remove the window resize listener
|
|
||||||
if (typeof showContentResize === 'function') {
|
|
||||||
$(window).off('resize', showContentResize);
|
|
||||||
}
|
|
||||||
|
|
||||||
// show the content
|
// show the content
|
||||||
content.show();
|
content.show();
|
||||||
|
|
||||||
// handle resizes
|
|
||||||
showContentResize = function () {
|
|
||||||
contentContainer.css({
|
|
||||||
width: shell.width(),
|
|
||||||
height: shell.height()
|
|
||||||
});
|
|
||||||
shell.trigger("shell:resize");
|
|
||||||
};
|
|
||||||
|
|
||||||
// add a window resize listener
|
|
||||||
$(window).resize(showContentResize);
|
|
||||||
}
|
}
|
||||||
}).promise();
|
}).promise();
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -850,7 +850,7 @@ nf.StatusHistory = (function () {
|
||||||
},
|
},
|
||||||
start: function (e, ui) {
|
start: function (e, ui) {
|
||||||
var helperOffset = ui.helper.offset();
|
var helperOffset = ui.helper.offset();
|
||||||
var dialogOuter = ((statusHistoryDialog.outerWidth() - statusHistoryDialog.width()) / 2) + 8; //8 for the box shadow
|
var dialogOuter = ((statusHistoryDialog.outerWidth() - statusHistoryDialog.width()) / 2);
|
||||||
var dialogContent = statusHistoryDialog.find('.dialog-content');
|
var dialogContent = statusHistoryDialog.find('.dialog-content');
|
||||||
var dialogContentPaddingRight = ((dialogContent.outerWidth() - dialogContent.width()) / 2);
|
var dialogContentPaddingRight = ((dialogContent.outerWidth() - dialogContent.width()) / 2);
|
||||||
var chartOuter = chartContainer.outerWidth() - chartContainer.width();
|
var chartOuter = chartContainer.outerWidth() - chartContainer.width();
|
||||||
|
|
@ -859,9 +859,8 @@ nf.StatusHistory = (function () {
|
||||||
maxWidth = $('body').width() - helperOffset.left - dialogOuter - dialogContentPaddingRight - chartOuter;
|
maxWidth = $('body').width() - helperOffset.left - dialogOuter - dialogContentPaddingRight - chartOuter;
|
||||||
|
|
||||||
// calculate the max height of the component
|
// calculate the max height of the component
|
||||||
var dialogContentPaddingBottom = ((dialogContent.outerHeight() - dialogContent.height()) / 2);
|
var dialogContentPaddingBottom = dialogContent.outerHeight() - dialogContent.height() - parseInt(dialogContent.css('padding-top'), 10);
|
||||||
var dialogButtonsHeight = statusHistoryDialog.find('.dialog-buttons').height() + 5; //5 for the box shadow
|
maxHeight = $('body').height() - helperOffset.top - dialogOuter - chartOuter - dialogContentPaddingBottom - chartControlContainer.outerHeight(true);
|
||||||
maxHeight = $('body').height() - helperOffset.top - dialogOuter - chartOuter - dialogContentPaddingBottom - dialogButtonsHeight - chartControlContainer.outerHeight(true);
|
|
||||||
|
|
||||||
// record the current extent so it can be reset on stop
|
// record the current extent so it can be reset on stop
|
||||||
if (!brush.empty()) {
|
if (!brush.empty()) {
|
||||||
|
|
@ -1077,6 +1076,7 @@ nf.StatusHistory = (function () {
|
||||||
|
|
||||||
// configure the dialog and make it draggable
|
// configure the dialog and make it draggable
|
||||||
$('#status-history-dialog').modal({
|
$('#status-history-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: "Status History",
|
headerText: "Status History",
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Close',
|
buttonText: 'Close',
|
||||||
|
|
|
||||||
|
|
@ -39,6 +39,7 @@ nf.ProvenanceLineage = (function () {
|
||||||
|
|
||||||
// initialize the dialog
|
// initialize the dialog
|
||||||
$('#lineage-query-dialog').modal({
|
$('#lineage-query-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Computing FlowFile lineage...',
|
headerText: 'Computing FlowFile lineage...',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
|
|
|
||||||
|
|
@ -185,6 +185,7 @@ nf.ProvenanceTable = (function () {
|
||||||
$('#event-details-tabs').tabbs({
|
$('#event-details-tabs').tabbs({
|
||||||
tabStyle: 'tab',
|
tabStyle: 'tab',
|
||||||
selectedTabStyle: 'selected-tab',
|
selectedTabStyle: 'selected-tab',
|
||||||
|
scrollableTabContentStyle: 'scrollable',
|
||||||
tabs: [{
|
tabs: [{
|
||||||
name: 'Details',
|
name: 'Details',
|
||||||
tabContentId: 'event-details-tab-content'
|
tabContentId: 'event-details-tab-content'
|
||||||
|
|
@ -198,6 +199,7 @@ nf.ProvenanceTable = (function () {
|
||||||
});
|
});
|
||||||
|
|
||||||
$('#event-details-dialog').modal({
|
$('#event-details-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Provenance Event',
|
headerText: 'Provenance Event',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Ok',
|
buttonText: 'Ok',
|
||||||
|
|
@ -221,6 +223,9 @@ nf.ProvenanceTable = (function () {
|
||||||
$('#child-flowfiles-container').empty();
|
$('#child-flowfiles-container').empty();
|
||||||
$('#provenance-event-cluster-node-id').text('');
|
$('#provenance-event-cluster-node-id').text('');
|
||||||
$('#modified-attribute-toggle').removeClass('checkbox-checked').addClass('checkbox-unchecked');
|
$('#modified-attribute-toggle').removeClass('checkbox-checked').addClass('checkbox-unchecked');
|
||||||
|
},
|
||||||
|
open: function () {
|
||||||
|
nf.Common.toggleScrollable($('#' + this.find('.tab-container').attr('id') + '-content').get(0));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
@ -359,6 +364,7 @@ nf.ProvenanceTable = (function () {
|
||||||
|
|
||||||
// configure the search dialog
|
// configure the search dialog
|
||||||
$('#provenance-search-dialog').modal({
|
$('#provenance-search-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Search Events',
|
headerText: 'Search Events',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Search',
|
buttonText: 'Search',
|
||||||
|
|
@ -460,6 +466,7 @@ nf.ProvenanceTable = (function () {
|
||||||
|
|
||||||
// initialize the dialog
|
// initialize the dialog
|
||||||
$('#provenance-query-dialog').modal({
|
$('#provenance-query-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Searching provenance events...',
|
headerText: 'Searching provenance events...',
|
||||||
handler: {
|
handler: {
|
||||||
close: function () {
|
close: function () {
|
||||||
|
|
|
||||||
|
|
@ -222,8 +222,40 @@ nf.Provenance = (function () {
|
||||||
setBodySize();
|
setBodySize();
|
||||||
});
|
});
|
||||||
|
|
||||||
// listen for browser resize events to reset the body size
|
$(window).on('resize', function (e) {
|
||||||
$(window).resize(setBodySize);
|
setBodySize();
|
||||||
|
// resize dialogs when appropriate
|
||||||
|
var dialogs = $('.dialog');
|
||||||
|
for (var i = 0, len = dialogs.length; i < len; i++) {
|
||||||
|
if ($(dialogs[i]).is(':visible')){
|
||||||
|
setTimeout(function(dialog){
|
||||||
|
dialog.modal('resize');
|
||||||
|
}, 50, $(dialogs[i]));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// resize grids when appropriate
|
||||||
|
var gridElements = $('*[class*="slickgrid_"]');
|
||||||
|
for (var j = 0, len = gridElements.length; j < len; j++) {
|
||||||
|
if ($(gridElements[j]).is(':visible')){
|
||||||
|
setTimeout(function(gridElement){
|
||||||
|
gridElement.data('gridInstance').resizeCanvas();
|
||||||
|
}, 50, $(gridElements[j]));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// toggle tabs .scrollable when appropriate
|
||||||
|
var tabsContainers = $('.tab-container');
|
||||||
|
var tabsContents = [];
|
||||||
|
for (var k = 0, len = tabsContainers.length; k < len; k++) {
|
||||||
|
if ($(tabsContainers[k]).is(':visible')){
|
||||||
|
tabsContents.push($('#' + $(tabsContainers[k]).attr('id') + '-content'));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
$.each(tabsContents, function (index, tabsContent) {
|
||||||
|
nf.Common.toggleScrollable(tabsContent.get(0));
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -32,6 +32,7 @@ nf.ClusterSearch = (function () {
|
||||||
init: function () {
|
init: function () {
|
||||||
// configure the view single node dialog
|
// configure the view single node dialog
|
||||||
$('#view-single-node-dialog').modal({
|
$('#view-single-node-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Select node',
|
headerText: 'Select node',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Ok',
|
buttonText: 'Ok',
|
||||||
|
|
|
||||||
|
|
@ -73,6 +73,7 @@ nf.SummaryTable = (function () {
|
||||||
$('#summary-tabs').tabbs({
|
$('#summary-tabs').tabbs({
|
||||||
tabStyle: 'tab',
|
tabStyle: 'tab',
|
||||||
selectedTabStyle: 'selected-tab',
|
selectedTabStyle: 'selected-tab',
|
||||||
|
scrollableTabContentStyle: 'scrollable',
|
||||||
tabs: [{
|
tabs: [{
|
||||||
name: 'Processors',
|
name: 'Processors',
|
||||||
tabContentId: 'processor-summary-tab-content'
|
tabContentId: 'processor-summary-tab-content'
|
||||||
|
|
@ -528,6 +529,7 @@ nf.SummaryTable = (function () {
|
||||||
|
|
||||||
// initialize the cluster processor summary dialog
|
// initialize the cluster processor summary dialog
|
||||||
$('#cluster-processor-summary-dialog').modal({
|
$('#cluster-processor-summary-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Cluster Processor Summary',
|
headerText: 'Cluster Processor Summary',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Close',
|
buttonText: 'Close',
|
||||||
|
|
@ -784,6 +786,7 @@ nf.SummaryTable = (function () {
|
||||||
|
|
||||||
// initialize the cluster connection summary dialog
|
// initialize the cluster connection summary dialog
|
||||||
$('#cluster-connection-summary-dialog').modal({
|
$('#cluster-connection-summary-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Cluster Connection Summary',
|
headerText: 'Cluster Connection Summary',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Close',
|
buttonText: 'Close',
|
||||||
|
|
@ -1088,6 +1091,7 @@ nf.SummaryTable = (function () {
|
||||||
|
|
||||||
// initialize the cluster process group summary dialog
|
// initialize the cluster process group summary dialog
|
||||||
$('#cluster-process-group-summary-dialog').modal({
|
$('#cluster-process-group-summary-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Cluster Process Group Summary',
|
headerText: 'Cluster Process Group Summary',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Close',
|
buttonText: 'Close',
|
||||||
|
|
@ -1331,6 +1335,7 @@ nf.SummaryTable = (function () {
|
||||||
|
|
||||||
// initialize the cluster input port summary dialog
|
// initialize the cluster input port summary dialog
|
||||||
$('#cluster-input-port-summary-dialog').modal({
|
$('#cluster-input-port-summary-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Cluster Input Port Summary',
|
headerText: 'Cluster Input Port Summary',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Close',
|
buttonText: 'Close',
|
||||||
|
|
@ -1570,6 +1575,7 @@ nf.SummaryTable = (function () {
|
||||||
|
|
||||||
// initialize the cluster output port summary dialog
|
// initialize the cluster output port summary dialog
|
||||||
$('#cluster-output-port-summary-dialog').modal({
|
$('#cluster-output-port-summary-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Cluster Output Port Summary',
|
headerText: 'Cluster Output Port Summary',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Close',
|
buttonText: 'Close',
|
||||||
|
|
@ -1866,6 +1872,7 @@ nf.SummaryTable = (function () {
|
||||||
|
|
||||||
// initialize the cluster remote process group summary dialog
|
// initialize the cluster remote process group summary dialog
|
||||||
$('#cluster-remote-process-group-summary-dialog').modal({
|
$('#cluster-remote-process-group-summary-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'Cluster Remote Process Group Summary',
|
headerText: 'Cluster Remote Process Group Summary',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Close',
|
buttonText: 'Close',
|
||||||
|
|
@ -1969,6 +1976,7 @@ nf.SummaryTable = (function () {
|
||||||
$('#system-diagnostics-tabs').tabbs({
|
$('#system-diagnostics-tabs').tabbs({
|
||||||
tabStyle: 'tab',
|
tabStyle: 'tab',
|
||||||
selectedTabStyle: 'selected-tab',
|
selectedTabStyle: 'selected-tab',
|
||||||
|
scrollableTabContentStyle: 'scrollable',
|
||||||
tabs: [{
|
tabs: [{
|
||||||
name: 'JVM',
|
name: 'JVM',
|
||||||
tabContentId: 'jvm-tab-content'
|
tabContentId: 'jvm-tab-content'
|
||||||
|
|
@ -1980,6 +1988,7 @@ nf.SummaryTable = (function () {
|
||||||
|
|
||||||
// initialize the system diagnostics dialog
|
// initialize the system diagnostics dialog
|
||||||
$('#system-diagnostics-dialog').modal({
|
$('#system-diagnostics-dialog').modal({
|
||||||
|
scrollableContentStyle: 'scrollable',
|
||||||
headerText: 'System Diagnostics',
|
headerText: 'System Diagnostics',
|
||||||
buttons: [{
|
buttons: [{
|
||||||
buttonText: 'Close',
|
buttonText: 'Close',
|
||||||
|
|
@ -1998,6 +2007,9 @@ nf.SummaryTable = (function () {
|
||||||
close: function () {
|
close: function () {
|
||||||
// show the summary loading container
|
// show the summary loading container
|
||||||
$('#summary-loading-container').show();
|
$('#summary-loading-container').show();
|
||||||
|
},
|
||||||
|
open: function () {
|
||||||
|
nf.Common.toggleScrollable($('#' + this.find('.tab-container').attr('id') + '-content').get(0));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -183,8 +183,40 @@ nf.Summary = (function () {
|
||||||
setBodySize();
|
setBodySize();
|
||||||
}).fail(nf.Common.handleAjaxError);
|
}).fail(nf.Common.handleAjaxError);
|
||||||
|
|
||||||
// listen for browser resize events to reset the body size
|
$(window).on('resize', function (e) {
|
||||||
$(window).resize(setBodySize);
|
setBodySize();
|
||||||
|
// resize dialogs when appropriate
|
||||||
|
var dialogs = $('.dialog');
|
||||||
|
for (var i = 0, len = dialogs.length; i < len; i++) {
|
||||||
|
if ($(dialogs[i]).is(':visible')){
|
||||||
|
setTimeout(function(dialog){
|
||||||
|
dialog.modal('resize');
|
||||||
|
}, 50, $(dialogs[i]));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// resize grids when appropriate
|
||||||
|
var gridElements = $('*[class*="slickgrid_"]');
|
||||||
|
for (var j = 0, len = gridElements.length; j < len; j++) {
|
||||||
|
if ($(gridElements[j]).is(':visible')){
|
||||||
|
setTimeout(function(gridElement){
|
||||||
|
gridElement.data('gridInstance').resizeCanvas();
|
||||||
|
}, 50, $(gridElements[j]));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// toggle tabs .scrollable when appropriate
|
||||||
|
var tabsContainers = $('.tab-container');
|
||||||
|
var tabsContents = [];
|
||||||
|
for (var k = 0, len = tabsContainers.length; k < len; k++) {
|
||||||
|
if ($(tabsContainers[k]).is(':visible')){
|
||||||
|
tabsContents.push($('#' + $(tabsContainers[k]).attr('id') + '-content'));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
$.each(tabsContents, function (index, tabsContent) {
|
||||||
|
nf.Common.toggleScrollable(tabsContent.get(0));
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -157,8 +157,40 @@ nf.Templates = (function () {
|
||||||
setBodySize();
|
setBodySize();
|
||||||
}).fail(nf.Common.handleAjaxError);
|
}).fail(nf.Common.handleAjaxError);
|
||||||
|
|
||||||
// listen for browser resize events to reset the body size
|
$(window).on('resize', function (e) {
|
||||||
$(window).resize(setBodySize);
|
setBodySize();
|
||||||
|
// resize dialogs when appropriate
|
||||||
|
var dialogs = $('.dialog');
|
||||||
|
for (var i = 0, len = dialogs.length; i < len; i++) {
|
||||||
|
if ($(dialogs[i]).is(':visible')){
|
||||||
|
setTimeout(function(dialog){
|
||||||
|
dialog.modal('resize');
|
||||||
|
}, 50, $(dialogs[i]));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// resize grids when appropriate
|
||||||
|
var gridElements = $('*[class*="slickgrid_"]');
|
||||||
|
for (var j = 0, len = gridElements.length; j < len; j++) {
|
||||||
|
if ($(gridElements[j]).is(':visible')){
|
||||||
|
setTimeout(function(gridElement){
|
||||||
|
gridElement.data('gridInstance').resizeCanvas();
|
||||||
|
}, 50, $(gridElements[j]));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// toggle tabs .scrollable when appropriate
|
||||||
|
var tabsContainers = $('.tab-container');
|
||||||
|
var tabsContents = [];
|
||||||
|
for (var k = 0, len = tabsContainers.length; k < len; k++) {
|
||||||
|
if ($(tabsContainers[k]).is(':visible')){
|
||||||
|
tabsContents.push($('#' + $(tabsContainers[k]).attr('id') + '-content'));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
$.each(tabsContents, function (index, tabsContent) {
|
||||||
|
nf.Common.toggleScrollable(tabsContent.get(0));
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue