[NIFI-2949] update remote process group port styles. This closes #1226

This commit is contained in:
Scott Aslan 2016-11-16 09:37:51 -05:00 committed by Matt Gilman
parent f1eca0a09a
commit 878db82375
2 changed files with 25 additions and 18 deletions

View File

@ -76,17 +76,17 @@ div.remote-port-header {
background: #728E9B;
color: #fff;
font-weight: bold;
font-size: 12px;
}
div.remote-ports-container {
padding: 5px;
overflow-y: auto;
overflow-x: auto;
border: 1px solid #666;
}
div.remote-port-container {
margin-bottom: 20px;
display: flex;
}
div.remote-port-removed {
@ -105,7 +105,6 @@ div.remote-port-removed:before {
div.remote-port-edit-container {
float: left;
width: 53px;
}
button.edit-remote-port {
@ -115,27 +114,25 @@ button.edit-remote-port {
div.remote-port-details-container {
float: left;
width: 295px;
flex-grow: 1;
}
div.remote-port-name {
color: #000000;
color: #262626;
font-weight: bold;
float: left;
width: 290px;
width: 250px;
line-height: normal;
margin-bottom: 3px;
}
div.remote-port-description {
color: #888888;
float: left;
margin-bottom: 8px;
width: 290px;
width: 250px;
}
div.concurrent-task-container {
width: 190px;
float: left;
}
@ -145,8 +142,7 @@ img.concurrent-tasks-info {
}
div.compression-container {
width: 105px;
float: left;
float: right;
}
div.remote-port-transmission-container {

View File

@ -223,14 +223,14 @@ nf.RemoteProcessGroupPorts = (function () {
if (port.exists === true) {
transmissionSwitch = (nf.ng.Bridge.injector.get('$compile')($('<md-switch style="margin:0px" class="md-primary enabled-inactive-transmission" aria-label="Toggle port transmission"></md-switch>'))(nf.ng.Bridge.rootScope)).appendTo(portContainerEditContainer);
} else {
(nf.ng.Bridge.injector.get('$compile')($('<md-switch style="margin:0px" class="md-primary disabled-inactive-transmission" aria-label="Toggle port transmission"></md-switch>'))(nf.ng.Bridge.rootScope)).appendTo(portContainerEditContainer);
(nf.ng.Bridge.injector.get('$compile')($('<md-switch ng-disabled="true" style="margin:0px" class="md-primary disabled-inactive-transmission" aria-label="Toggle port transmission"></md-switch>'))(nf.ng.Bridge.rootScope)).appendTo(portContainerEditContainer);
}
}
} else {
if (port.transmitting === true) {
(nf.ng.Bridge.injector.get('$compile')($('<md-switch style="margin:0px" class="md-primary disabled-active-transmission" aria-label="Toggle port transmission"></md-switch>'))(nf.ng.Bridge.rootScope)).appendTo(portContainerEditContainer);
} else {
(nf.ng.Bridge.injector.get('$compile')($('<md-switch style="margin:0px" class="md-primary disabled-inactive-transmission" aria-label="Toggle port transmission"></md-switch>'))(nf.ng.Bridge.rootScope)).appendTo(portContainerEditContainer);
(nf.ng.Bridge.injector.get('$compile')($('<md-switch ng-disabled="true" style="margin:0px" class="md-primary disabled-inactive-transmission" aria-label="Toggle port transmission"></md-switch>'))(nf.ng.Bridge.rootScope)).appendTo(portContainerEditContainer);
}
}
@ -359,7 +359,7 @@ nf.RemoteProcessGroupPorts = (function () {
if (port.transmitting === true) {
(nf.ng.Bridge.injector.get('$compile')($('<md-switch style="margin:0px" class="md-primary disabled-active-transmission" aria-label="Toggle port transmission"></md-switch>'))(nf.ng.Bridge.rootScope)).appendTo(portContainerEditContainer);
} else {
(nf.ng.Bridge.injector.get('$compile')($('<md-switch style="margin:0px" class="md-primary disabled-inactive-transmission" aria-label="Toggle port transmission"></md-switch>'))(nf.ng.Bridge.rootScope)).appendTo(portContainerEditContainer);
(nf.ng.Bridge.injector.get('$compile')($('<md-switch ng-disabled="true" style="margin:0px" class="md-primary disabled-inactive-transmission" aria-label="Toggle port transmission"></md-switch>'))(nf.ng.Bridge.rootScope)).appendTo(portContainerEditContainer);
}
}
@ -383,7 +383,7 @@ nf.RemoteProcessGroupPorts = (function () {
var concurrentTasksContainer = $('<div class="concurrent-task-container"></div>').appendTo(portContainerDetailsContainer);
// concurrent tasks
var concurrentTasks = $('<div class="setting-value"></div>').append($('<div id="' + portId + '-concurrent-tasks"></div>').text(port.concurrentlySchedulableTaskCount));
var concurrentTasks = $('<div class="setting-field"></div>').append($('<div id="' + portId + '-concurrent-tasks"></div>').text(port.concurrentlySchedulableTaskCount));
// add this ports concurrent tasks
$('<div>' +
@ -410,7 +410,7 @@ nf.RemoteProcessGroupPorts = (function () {
'<div class="setting-name">' +
'Compressed' +
'</div>' +
'<div class="setting-value">' +
'<div class="setting-field">' +
'<div id="' + portId + '-compression">' + compressionLabel + '</div>' +
'</div>' +
'</div>').appendTo(compressionContainer);
@ -420,6 +420,9 @@ nf.RemoteProcessGroupPorts = (function () {
// apply ellipsis where appropriate
portContainer.find('.ellipsis').ellipsis();
// inform Angular app values have changed
nf.ng.Bridge.digest();
};
/**
@ -509,6 +512,10 @@ nf.RemoteProcessGroupPorts = (function () {
createPortOption(inputPortContainer, inputPort, 'input');
});
if (nf.Common.isEmpty(connectedInputPorts) && nf.Common.isEmpty(disconnectedInputPorts)) {
$('<div class="unset"></div>').text("No ports to display").appendTo(inputPortContainer);
}
var connectedOutputPorts = [];
var disconnectedOutputPorts = [];
@ -522,15 +529,19 @@ nf.RemoteProcessGroupPorts = (function () {
}
});
// add all connected input ports
// add all connected output ports
$.each(connectedOutputPorts, function (_, outputPort) {
createPortOption(outputPortContainer, outputPort, 'output');
});
// add all disconnected input ports
// add all disconnected output ports
$.each(disconnectedOutputPorts, function (_, outputPort) {
createPortOption(outputPortContainer, outputPort, 'output');
});
if (nf.Common.isEmpty(connectedOutputPorts) && nf.Common.isEmpty(disconnectedOutputPorts)) {
$('<div class="unset"></div>').text("No ports to display").appendTo(outputPortContainer);
}
}
// show the details