You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@nifi.apache.org by mc...@apache.org on 2016/06/21 18:48:59 UTC
[06/17] nifi git commit: [NIFI-1879] Responsive dialogs and dialog UX
refresh. This closes #523
http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-go-to.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-go-to.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-go-to.js
index 5bf3e9e..4875e40 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-go-to.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-go-to.js
@@ -31,7 +31,7 @@ nf.GoTo = (function () {
/**
* Returns a deferred for the process group.
- *
+ *
* @param {string} processGroupId
*/
var getProcessGroup = function (processGroupId) {
@@ -44,7 +44,7 @@ nf.GoTo = (function () {
/**
* Returns a deferred for the remote process group.
- *
+ *
* @param {string} parentGroupId
* @param {string} remoteProcessGroupId
*/
@@ -58,7 +58,7 @@ nf.GoTo = (function () {
/**
* Adds a connection to the connections dialog.
- *
+ *
* @param {object} connection
*/
var addConnection = function (connection) {
@@ -115,7 +115,7 @@ nf.GoTo = (function () {
/**
* Adds a destination component to the dialog.
- *
+ *
* @param {jQuery} container The container to add to
* @param {object} connection The connection to the downstream component
*/
@@ -149,7 +149,7 @@ nf.GoTo = (function () {
/**
* Adds a destination input port to the dialog.
- *
+ *
* @param {jQuery} container The container to add to
* @param {object} connection The connection to the downstream input port
*/
@@ -190,7 +190,7 @@ nf.GoTo = (function () {
/**
* Adds a destination remote input port to the dialog.
- *
+ *
* @param {jQuery} container The container to add to
* @param {object} connection The connection to the downstream remote input port
*/
@@ -225,7 +225,7 @@ nf.GoTo = (function () {
/**
* Adds a source component to the dialog.
- *
+ *
* @param {jQuery} container The container to add to
* @param {object} connection The connection to the upstream component
*/
@@ -256,9 +256,9 @@ nf.GoTo = (function () {
/**
* Adds a source output port to the dialog.
- *
+ *
* @param {jQuery} container The container to add to
- * @param {object} connection The connection
+ * @param {object} connection The connection
*/
var addSourceOutputPort = function (container, connection) {
// get the remote process group
@@ -290,7 +290,7 @@ nf.GoTo = (function () {
/**
* Adds a source remote output port to the dialog.
- *
+ *
* @param {jQuery} container The container to add to
* @param {object} connection The connection to the downstream remote output port
*/
@@ -322,15 +322,19 @@ nf.GoTo = (function () {
*/
init: function () {
$('#connections-dialog').modal({
- overlayBackground: false,
buttons: [{
- buttonText: 'Close',
- handler: {
- click: function () {
- $('#connections-dialog').modal('hide');
- }
+ buttonText: 'Close',
+ color: {
+ base: '#728E9B',
+ hover: '#004849',
+ text: '#ffffff'
+ },
+ handler: {
+ click: function () {
+ $('#connections-dialog').modal('hide');
}
- }],
+ }
+ }],
handler: {
close: function () {
$('#connections-context').empty();
@@ -339,10 +343,10 @@ nf.GoTo = (function () {
}
});
},
-
+
/**
* Shows components downstream from a processor.
- *
+ *
* @param {selection} selection The processor selection
*/
showDownstreamFromProcessor: function (selection) {
@@ -357,9 +361,9 @@ nf.GoTo = (function () {
// populate the downstream dialog
$('#connections-context')
- .append('<div class="search-result-icon processor-small-icon"></div>')
- .append($('<div class="connections-component-name"></div>').text(selectionData.component.name))
- .append('<div class="clear"></div>');
+ .append('<div class="search-result-icon processor-small-icon"></div>')
+ .append($('<div class="connections-component-name"></div>').text(selectionData.component.name))
+ .append('<div class="clear"></div>');
// add the destination for each connection
$.each(connections, function (_, connection) {
@@ -378,10 +382,10 @@ nf.GoTo = (function () {
$('#connections-dialog').modal('setHeaderText', 'Downstream Connections').modal('show');
}).fail(nf.Common.handleAjaxError);
},
-
+
/**
* Shows components upstream from a processor.
- *
+ *
* @param {selection} selection The processor selection
*/
showUpstreamFromProcessor: function (selection) {
@@ -396,9 +400,9 @@ nf.GoTo = (function () {
// populate the upstream dialog
$('#connections-context')
- .append('<div class="search-result-icon processor-small-icon"></div>')
- .append($('<div class="connections-component-name"></div>').text(selectionData.component.name))
- .append('<div class="clear"></div>');
+ .append('<div class="search-result-icon processor-small-icon"></div>')
+ .append($('<div class="connections-component-name"></div>').text(selectionData.component.name))
+ .append('<div class="clear"></div>');
// add the source for each connection
$.each(connections, function (_, connection) {
@@ -417,10 +421,10 @@ nf.GoTo = (function () {
$('#connections-dialog').modal('setHeaderText', 'Upstream Connections').modal('show');
}).fail(nf.Common.handleAjaxError);
},
-
+
/**
* Shows components downstream from a process group or a remote process group.
- *
+ *
* @param {selection} selection The process group or remote process group selection
*/
showDownstreamFromGroup: function (selection) {
@@ -435,9 +439,9 @@ nf.GoTo = (function () {
// populate the downstream dialog
$('#connections-context')
- .append('<div class="search-result-icon process-group-small-icon"></div>')
- .append($('<div class="connections-component-name"></div>').text(selectionData.component.name))
- .append('<div class="clear"></div>');
+ .append('<div class="search-result-icon process-group-small-icon"></div>')
+ .append($('<div class="connections-component-name"></div>').text(selectionData.component.name))
+ .append('<div class="clear"></div>');
// add the destination for each connection
$.each(connections, function (_, connection) {
@@ -456,10 +460,10 @@ nf.GoTo = (function () {
$('#connections-dialog').modal('setHeaderText', 'Downstream Connections').modal('show');
}).fail(nf.Common.handleAjaxError);
},
-
+
/**
* Shows components upstream from a process group or a remote process group.
- *
+ *
* @param {selection} selection The process group or remote process group selection
*/
showUpstreamFromGroup: function (selection) {
@@ -474,9 +478,9 @@ nf.GoTo = (function () {
// populate the upstream dialog
$('#connections-context')
- .append('<div class="search-result-icon process-group-small-icon"></div>')
- .append($('<div class="connections-component-name"></div>').text(selectionData.component.name))
- .append('<div class="clear"></div>');
+ .append('<div class="search-result-icon process-group-small-icon"></div>')
+ .append($('<div class="connections-component-name"></div>').text(selectionData.component.name))
+ .append('<div class="clear"></div>');
// add the source for each connection
$.each(connections, function (_, connection) {
@@ -495,10 +499,10 @@ nf.GoTo = (function () {
$('#connections-dialog').modal('setHeaderText', 'Upstream Connections').modal('show');
}).fail(nf.Common.handleAjaxError);
},
-
+
/**
* Shows components downstream from an input port.
- *
+ *
* @param {selection} selection The input port selection
*/
showDownstreamFromInputPort: function (selection) {
@@ -513,9 +517,9 @@ nf.GoTo = (function () {
// populate the downstream dialog
$('#connections-context')
- .append('<div class="search-result-icon input-port-small-icon"></div>')
- .append($('<div class="connections-component-name"></div>').text(selectionData.component.name))
- .append('<div class="clear"></div>');
+ .append('<div class="search-result-icon input-port-small-icon"></div>')
+ .append($('<div class="connections-component-name"></div>').text(selectionData.component.name))
+ .append('<div class="clear"></div>');
// add the destination for each connection
$.each(connections, function (_, connection) {
@@ -534,10 +538,10 @@ nf.GoTo = (function () {
$('#connections-dialog').modal('setHeaderText', 'Downstream Connections').modal('show');
}).fail(nf.Common.handleAjaxError);
},
-
+
/**
* Shows components upstream from an input port.
- *
+ *
* @param {selection} selection The input port selection
*/
showUpstreamFromInputPort: function (selection) {
@@ -552,12 +556,12 @@ nf.GoTo = (function () {
// populate the upstream dialog
$('#connections-context')
- .append('<div class="search-result-icon process-group-small-icon"></div>')
- .append($('<div class="connections-component-name"></div>').text(nf.Canvas.getGroupName()))
- .append('<div class="clear"></div>')
- .append('<div class="search-result-icon input-port-small-icon" style="margin-left: 20px;"></div>')
- .append($('<div class="connections-component-name"></div>').text(selectionData.component.name))
- .append('<div class="clear"></div>');
+ .append('<div class="search-result-icon process-group-small-icon"></div>')
+ .append($('<div class="connections-component-name"></div>').text(nf.Canvas.getGroupName()))
+ .append('<div class="clear"></div>')
+ .append('<div class="search-result-icon input-port-small-icon" style="margin-left: 20px;"></div>')
+ .append($('<div class="connections-component-name"></div>').text(selectionData.component.name))
+ .append('<div class="clear"></div>');
// add the source for each connection
$.each(connections, function (_, connection) {
@@ -576,10 +580,10 @@ nf.GoTo = (function () {
$('#connections-dialog').modal('setHeaderText', 'Upstream Connections').modal('show');
}).fail(nf.Common.handleAjaxError);
},
-
+
/**
* Shows components downstream from an output port.
- *
+ *
* @param {selection} selection The output port selection
*/
showDownstreamFromOutputPort: function (selection) {
@@ -594,12 +598,12 @@ nf.GoTo = (function () {
// populate the downstream dialog
$('#connections-context')
- .append('<div class="search-result-icon process-group-small-icon"></div>')
- .append($('<div class="connections-component-name"></div>').text(nf.Canvas.getGroupName()))
- .append('<div class="clear"></div>')
- .append('<div class="search-result-icon output-port-small-icon" style="margin-left: 20px;"></div>')
- .append($('<div class="connections-component-name"></div>').text(selectionData.component.name))
- .append('<div class="clear"></div>');
+ .append('<div class="search-result-icon process-group-small-icon"></div>')
+ .append($('<div class="connections-component-name"></div>').text(nf.Canvas.getGroupName()))
+ .append('<div class="clear"></div>')
+ .append('<div class="search-result-icon output-port-small-icon" style="margin-left: 20px;"></div>')
+ .append($('<div class="connections-component-name"></div>').text(selectionData.component.name))
+ .append('<div class="clear"></div>');
// add the destination for each connection
$.each(connections, function (_, connection) {
@@ -618,10 +622,10 @@ nf.GoTo = (function () {
$('#connections-dialog').modal('setHeaderText', 'Downstream Connections').modal('show');
}).fail(nf.Common.handleAjaxError);
},
-
+
/**
* Shows components upstream from an output port.
- *
+ *
* @param {selection} selection The output port selection
*/
showUpstreamFromOutputPort: function (selection) {
@@ -636,9 +640,9 @@ nf.GoTo = (function () {
// populate the upstream dialog
$('#connections-context')
- .append('<div class="search-result-icon input-port-small-icon"></div>')
- .append($('<div class="connections-component-name"></div>').text(selectionData.component.name))
- .append('<div class="clear"></div>');
+ .append('<div class="search-result-icon input-port-small-icon"></div>')
+ .append($('<div class="connections-component-name"></div>').text(selectionData.component.name))
+ .append('<div class="clear"></div>');
// add the source for each connection
$.each(connections, function (_, connection) {
@@ -657,10 +661,10 @@ nf.GoTo = (function () {
$('#connections-dialog').modal('setHeaderText', 'Upstream Connections').modal('show');
}).fail(nf.Common.handleAjaxError);
},
-
+
/**
* Shows components downstream from a funnel.
- *
+ *
* @param {selection} selection The funnel selection
*/
showDownstreamFromFunnel: function (selection) {
@@ -693,10 +697,10 @@ nf.GoTo = (function () {
$('#connections-dialog').modal('setHeaderText', 'Downstream Connections').modal('show');
}).fail(nf.Common.handleAjaxError);
},
-
+
/**
* Shows components upstream from a funnel.
- *
+ *
* @param {selection} selection The funnel selection
*/
showUpstreamFromFunnel: function (selection) {
http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-label-configuration.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-label-configuration.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-label-configuration.js
index ceba489..2c5a3a0 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-label-configuration.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-label-configuration.js
@@ -28,9 +28,14 @@ nf.LabelConfiguration = (function () {
init: function () {
// make the new property dialog draggable
$('#label-configuration').modal({
- overlayBackground: true,
+ headerText: 'Configure Label',
buttons: [{
buttonText: 'Apply',
+ color: {
+ base: '#728E9B',
+ hover: '#004849',
+ text: '#ffffff'
+ },
handler: {
click: function () {
// get the label data
@@ -68,22 +73,25 @@ nf.LabelConfiguration = (function () {
this.modal('hide');
}
}
- }, {
- buttonText: 'Cancel',
- handler: {
- click: function () {
- this.modal('hide');
+ },
+ {
+ buttonText: 'Cancel',
+ color: {
+ base: '#E3E8EB',
+ hover: '#C7D2D7',
+ text: '#004849'
+ },
+ handler: {
+ click: function () {
+ this.modal('hide');
+ }
}
- }
- }],
+ }],
handler: {
close: function () {
labelId = '';
}
}
- }).draggable({
- containment: 'parent',
- cancel: 'textarea, .button, .combo'
});
// create the available sizes
@@ -113,10 +121,10 @@ nf.LabelConfiguration = (function () {
}
});
},
-
+
/**
* Shows the configuration for the specified label.
- *
+ *
* @argument {selection} selection The selection
*/
showConfiguration: function (selection) {
http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-ng-canvas-app-config.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-ng-canvas-app-config.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-ng-canvas-app-config.js
deleted file mode 100644
index 5ab58ed..0000000
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-ng-canvas-app-config.js
+++ /dev/null
@@ -1,95 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-/* global nf, d3 */
-
-nf.ng.Canvas.AppConfig = function ($mdThemingProvider, $compileProvider) {
- //Enable production mode, to re-enable debug mode open up a
- //console and call 'angular.reloadWithDebugInfo();'
- $compileProvider.debugInfoEnabled(false);
- //Define app palettes
- $mdThemingProvider.definePalette('basePalette', {
- '50': '728E9B',
- '100': '728E9B',
- '200': '004849', /* link-color */
- '300': '775351', /* value-color */
- '400': '728E9B',
- '500': '728E9B', /* base-color */
- '600': '728E9B',
- '700': '728E9B',
- '800': '728E9B',
- '900': 'rgba(249,250,251,0.97)', /* tint base-color 96% */
- 'A100': '728E9B',
- 'A200': '728E9B',
- 'A400': '728E9B',
- 'A700': '728E9B',
- 'contrastDefaultColor': 'light',
- 'contrastDarkColors': ['A100'],
- 'contrastLightColors': undefined
- });
- $mdThemingProvider.definePalette('tintPalette', {
- '50': '728E9B',
- '100': '728E9B',
- '200': 'CCDADB', /* tint link-color 20% */
- '300': '728E9B',
- '400': 'AABBC3', /* tint base-color 40% */
- '500': '728E9B',
- '600': 'C7D2D7', /* tint base-color 60% */
- '700': '728E9B',
- '800': 'E3E8EB', /* tint base-color 80% */
- '900': '728E9B',
- 'A100': '728E9B',
- 'A200': '728E9B',
- 'A400': '728E9B',
- 'A700': '728E9B',
- 'contrastDefaultColor': 'light',
- 'contrastDarkColors': ['A100'],
- 'contrastLightColors': undefined
- });
- $mdThemingProvider.definePalette('warnPalette', {
- '50': 'BA554A',
- '100': 'BA554A',
- '200': 'BA554A',
- '300': 'BA554A',
- '400': 'BA554A',
- '500': 'BA554A', /* warn-color */
- '600': 'BA554A',
- '700': 'BA554A',
- '800': 'BA554A',
- '900': 'BA554A',
- 'A100': 'BA554A',
- 'A200': 'BA554A',
- 'A400': 'BA554A',
- 'A700': 'BA554A',
- 'contrastDefaultColor': 'light',
- 'contrastDarkColors': ['A100'],
- 'contrastLightColors': undefined
- });
- $mdThemingProvider.theme("default").primaryPalette("basePalette", {
- "default": "500",
- "hue-1": "200",
- "hue-2": "300",
- "hue-3": "900"
- }).accentPalette("tintPalette", {
- "default": "200",
- "hue-1": "400",
- "hue-2": "600",
- "hue-3": "800"
- }).warnPalette("warnPalette", {
- "default": "500"
- });
-};
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port-configuration.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port-configuration.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port-configuration.js
index 5fdee94..da71567 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port-configuration.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port-configuration.js
@@ -25,84 +25,93 @@ nf.PortConfiguration = (function () {
var initPortConfigurationDialog = function () {
$('#port-configuration').modal({
headerText: 'Configure Port',
- overlayBackground: true,
buttons: [{
- buttonText: 'Apply',
- handler: {
- click: function () {
- // get the port data to reference the uri
- var portId = $('#port-id').text();
- var portData = d3.select('#id-' + portId).datum();
-
- // build the updated port
- var port = {
- 'id': portId,
- 'name': $('#port-name').val(),
- 'comments': $('#port-comments').val()
- };
-
- // include the concurrent tasks if appropriate
- if ($('#port-concurrent-task-container').is(':visible')) {
- port['concurrentlySchedulableTaskCount'] = $('#port-concurrent-tasks').val();
- }
+ buttonText: 'Apply',
+ color: {
+ base: '#728E9B',
+ hover: '#004849',
+ text: '#ffffff'
+ },
+ handler: {
+ click: function () {
+ // get the port data to reference the uri
+ var portId = $('#port-id').text();
+ var portData = d3.select('#id-' + portId).datum();
+
+ // build the updated port
+ var port = {
+ 'id': portId,
+ 'name': $('#port-name').val(),
+ 'comments': $('#port-comments').val()
+ };
+
+ // include the concurrent tasks if appropriate
+ if ($('#port-concurrent-task-container').is(':visible')) {
+ port['concurrentlySchedulableTaskCount'] = $('#port-concurrent-tasks').val();
+ }
- // mark the processor disabled if appropriate
- if ($('#port-enabled').hasClass('checkbox-unchecked')) {
- port['state'] = 'DISABLED';
- } else if ($('#port-enabled').hasClass('checkbox-checked')) {
- port['state'] = 'STOPPED';
- }
-
- // build the port entity
- var portEntity = {
- 'revision': nf.Client.getRevision(portData),
- 'component': port
- };
-
- // update the selected component
- $.ajax({
- type: 'PUT',
- data: JSON.stringify(portEntity),
- url: portData.component.uri,
- dataType: 'json',
- contentType: 'application/json'
- }).done(function (response) {
- // refresh the port component
- nf.Port.set(response);
+ // mark the processor disabled if appropriate
+ if ($('#port-enabled').hasClass('checkbox-unchecked')) {
+ port['state'] = 'DISABLED';
+ } else if ($('#port-enabled').hasClass('checkbox-checked')) {
+ port['state'] = 'STOPPED';
+ }
+
+ // build the port entity
+ var portEntity = {
+ 'revision': nf.Client.getRevision(portData),
+ 'component': port
+ };
+
+ // update the selected component
+ $.ajax({
+ type: 'PUT',
+ data: JSON.stringify(portEntity),
+ url: portData.component.uri,
+ dataType: 'json',
+ contentType: 'application/json'
+ }).done(function (response) {
+ // refresh the port component
+ nf.Port.set(response);
+
+ // close the details panel
+ $('#port-configuration').modal('hide');
+ }).fail(function (xhr, status, error) {
+ // handle bad request locally to keep the dialog open, allowing the user
+ // to make changes. if the request fails for another reason, the dialog
+ // should be closed so the issue can be addressed (stale flow for instance)
+ if (xhr.status === 400) {
+ var errors = xhr.responseText.split('\n');
+
+ var content;
+ if (errors.length === 1) {
+ content = $('<span></span>').text(errors[0]);
+ } else {
+ content = nf.Common.formatUnorderedList(errors);
+ }
+ nf.Dialog.showOkDialog({
+ dialogContent: content,
+ headerText: 'Configuration Error'
+ });
+ } else {
// close the details panel
$('#port-configuration').modal('hide');
- }).fail(function (xhr, status, error) {
- // handle bad request locally to keep the dialog open, allowing the user
- // to make changes. if the request fails for another reason, the dialog
- // should be closed so the issue can be addressed (stale flow for instance)
- if (xhr.status === 400) {
- var errors = xhr.responseText.split('\n');
-
- var content;
- if (errors.length === 1) {
- content = $('<span></span>').text(errors[0]);
- } else {
- content = nf.Common.formatUnorderedList(errors);
- }
-
- nf.Dialog.showOkDialog({
- dialogContent: content,
- overlayBackground: false,
- headerText: 'Configuration Error'
- });
- } else {
- // close the details panel
- $('#port-configuration').modal('hide');
- // handle the error
- nf.Common.handleAjaxError(xhr, status, error);
- }
- });
- }
+ // handle the error
+ nf.Common.handleAjaxError(xhr, status, error);
+ }
+ });
}
- }, {
+ }
+ },
+ {
buttonText: 'Cancel',
+ color: {
+ base: '#E3E8EB',
+ hover: '#C7D2D7',
+ text: '#004849'
+ },
handler: {
click: function () {
$('#port-configuration').modal('hide');
@@ -126,10 +135,10 @@ nf.PortConfiguration = (function () {
init: function () {
initPortConfigurationDialog();
},
-
+
/**
* Shows the details for the specified selection.
- *
+ *
* @argument {selection} selection The selection
*/
showConfiguration: function (selection) {
http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port-details.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port-details.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port-details.js
index e3f3f6f..5ca78c3 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port-details.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port-details.js
@@ -24,16 +24,20 @@ nf.PortDetails = (function () {
// configure the processor details dialog
$('#port-details').modal({
headerText: 'Port Details',
- overlayBackground: true,
buttons: [{
- buttonText: 'Ok',
- handler: {
- click: function () {
- // hide the dialog
- $('#port-details').modal('hide');
- }
+ buttonText: 'Ok',
+ color: {
+ base: '#728E9B',
+ hover: '#004849',
+ text: '#ffffff'
+ },
+ handler: {
+ click: function () {
+ // hide the dialog
+ $('#port-details').modal('hide');
}
- }],
+ }
+ }],
handler: {
close: function () {
// clear the processor details
@@ -44,7 +48,7 @@ nf.PortDetails = (function () {
}
});
},
-
+
showDetails: function (selection) {
// if the specified component is a processor, load its properties
if (nf.CanvasUtils.isInputPort(selection) || nf.CanvasUtils.isOutputPort(selection)) {
http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group-configuration.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group-configuration.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group-configuration.js
index 62fd855..11c388c 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group-configuration.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group-configuration.js
@@ -80,8 +80,7 @@ nf.ProcessGroupConfiguration = (function () {
// show the result dialog
nf.Dialog.showOkDialog({
- dialogContent: 'Process group configuration successfully saved.',
- overlayBackground: false
+ dialogContent: 'Process group configuration successfully saved.'
});
// update the click listener for the updated revision
@@ -173,6 +172,12 @@ nf.ProcessGroupConfiguration = (function () {
nf.Shell.showContent('#process-group-configuration').done(function () {
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
nf.ProcessGroupConfiguration.resetTableSize();
@@ -197,8 +202,8 @@ nf.ProcessGroupConfiguration = (function () {
init: function () {
// initialize the process group configuration tabs
$('#process-group-configuration-tabs').tabbs({
- tabStyle: 'settings-tab',
- selectedTabStyle: 'settings-selected-tab',
+ tabStyle: 'tab',
+ selectedTabStyle: 'selected-tab',
tabs: [{
name: 'General',
tabContentId: 'general-process-group-configuration-tab-content'
@@ -210,8 +215,10 @@ nf.ProcessGroupConfiguration = (function () {
var tab = $(this).text();
if (tab === 'General') {
$('#add-process-group-configuration-controller-service').hide();
+ $('#process-group-configuration-save').show();
} else {
$('#add-process-group-configuration-controller-service').show();
+ $('#process-group-configuration-save').hide();
// update the tooltip on the button
$('#add-process-group-configuration-controller-service').attr('title', function () {
@@ -226,14 +233,11 @@ nf.ProcessGroupConfiguration = (function () {
}
});
- // settings refresh button...
- nf.Common.addHoverEffect('#process-group-configuration-refresh-button', 'button-refresh', 'button-refresh-hover');
-
// initialize each tab
initGeneral();
nf.ControllerServices.init(getControllerServicesTable());
},
-
+
/**
* Update the size of the grid based on its container's current size.
*/
@@ -252,7 +256,7 @@ nf.ProcessGroupConfiguration = (function () {
// update the new controller service click listener
$('#add-process-group-configuration-controller-service').off('click').on('click', function () {
- var selectedTab = $('#process-group-configuration-tabs li.settings-selected-tab').text();
+ var selectedTab = $('#process-group-configuration-tabs li.selected-tab').text();
if (selectedTab === 'Controller Services') {
var controllerServicesUri = config.urls.api + '/process-groups/' + encodeURIComponent(groupId) + '/controller-services';
nf.ControllerServices.promptNewControllerService(controllerServicesUri, getControllerServicesTable());
http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group-details.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group-details.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group-details.js
index 3ee5601..4db2f0e 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group-details.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group-details.js
@@ -24,16 +24,20 @@ nf.ProcessGroupDetails = (function () {
// configure the processor details dialog
$('#process-group-details').modal({
headerText: 'Process Group Details',
- overlayBackground: true,
buttons: [{
- buttonText: 'Ok',
- handler: {
- click: function () {
- // hide the dialog
- $('#process-group-details').modal('hide');
- }
+ buttonText: 'Ok',
+ color: {
+ base: '#728E9B',
+ hover: '#004849',
+ text: '#ffffff'
+ },
+ handler: {
+ click: function () {
+ // hide the dialog
+ $('#process-group-details').modal('hide');
}
- }],
+ }
+ }],
handler: {
close: function () {
// clear the processor details
@@ -44,7 +48,7 @@ nf.ProcessGroupDetails = (function () {
}
});
},
-
+
showDetails: function (selection) {
// if the specified selection is a process group
if (nf.CanvasUtils.isProcessGroup(selection)) {
http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-processor-configuration.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-processor-configuration.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-processor-configuration.js
index ba9191e..3238339 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-processor-configuration.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-processor-configuration.js
@@ -24,16 +24,16 @@ nf.ProcessorConfiguration = (function () {
/**
* Gets the available scheduling strategies based on the specified processor.
- *
+ *
* @param {type} processor
* @returns {Array}
*/
var getSchedulingStrategies = function (processor) {
var strategies = [{
- text: 'Timer driven',
- value: 'TIMER_DRIVEN',
- description: 'Processor will be scheduled to run on an interval defined by the run schedule.'
- }];
+ text: 'Timer driven',
+ value: 'TIMER_DRIVEN',
+ description: 'Processor will be scheduled to run on an interval defined by the run schedule.'
+ }];
// conditionally support event driven based on processor
if (processor.supportsEventDriven === true) {
@@ -80,7 +80,7 @@ nf.ProcessorConfiguration = (function () {
/**
* Handle any expected processor configuration errors.
- *
+ *
* @argument {object} xhr The XmlHttpRequest
* @argument {string} status The status of the request
* @argument {string} error The error
@@ -98,7 +98,6 @@ nf.ProcessorConfiguration = (function () {
nf.Dialog.showOkDialog({
dialogContent: content,
- overlayBackground: false,
headerText: 'Configuration Error'
});
} else {
@@ -108,7 +107,7 @@ nf.ProcessorConfiguration = (function () {
/**
* Creates an option for the specified relationship name.
- *
+ *
* @argument {object} relationship The relationship
*/
var createRelationshipOption = function (relationship) {
@@ -334,7 +333,7 @@ nf.ProcessorConfiguration = (function () {
/**
* Validates the specified details.
- *
+ *
* @argument {object} details The details to validate
*/
var validateDetails = function (details) {
@@ -359,7 +358,6 @@ nf.ProcessorConfiguration = (function () {
if (errors.length > 0) {
nf.Dialog.showOkDialog({
dialogContent: nf.Common.formatUnorderedList(errors),
- overlayBackground: false,
headerText: 'Configuration Error'
});
return false;
@@ -367,10 +365,10 @@ nf.ProcessorConfiguration = (function () {
return true;
}
};
-
+
/**
* Reloads the outgoing connections for the specified processor.
- *
+ *
* @param {object} processor
*/
var reloadProcessorConnections = function (processor) {
@@ -383,7 +381,7 @@ nf.ProcessorConfiguration = (function () {
}
});
};
-
+
/**
* Goes to a service configuration from the property table.
*/
@@ -396,8 +394,8 @@ nf.ProcessorConfiguration = (function () {
if (isSaveRequired()) {
// see if those changes should be saved
nf.Dialog.showYesNoDialog({
+ headerText: 'Processor Configuration',
dialogContent: 'Save changes before going to this Controller Service?',
- overlayBackground: false,
noHandler: function () {
deferred.resolve();
},
@@ -415,9 +413,9 @@ nf.ProcessorConfiguration = (function () {
}
}).promise();
};
-
+
/**
- *
+ *
* @param {type} processor
* @returns {undefined}
*/
@@ -430,7 +428,7 @@ nf.ProcessorConfiguration = (function () {
// set the revision
var d = nf.Processor.get(processor.id);
updatedProcessor['revision'] = nf.Client.getRevision(d);
-
+
// update the selected component
return $.ajax({
type: 'PUT',
@@ -459,22 +457,22 @@ nf.ProcessorConfiguration = (function () {
tabStyle: 'tab',
selectedTabStyle: 'selected-tab',
tabs: [{
- name: 'Settings',
- tabContentId: 'processor-standard-settings-tab-content'
- }, {
- name: 'Scheduling',
- tabContentId: 'processor-scheduling-tab-content'
- }, {
- name: 'Properties',
- tabContentId: 'processor-properties-tab-content'
- }, {
- name: 'Comments',
- tabContentId: 'processor-comments-tab-content'
- }],
+ name: 'Settings',
+ tabContentId: 'processor-standard-settings-tab-content'
+ }, {
+ name: 'Scheduling',
+ tabContentId: 'processor-scheduling-tab-content'
+ }, {
+ name: 'Properties',
+ tabContentId: 'processor-properties-tab-content'
+ }, {
+ name: 'Comments',
+ tabContentId: 'processor-comments-tab-content'
+ }],
select: function () {
// remove all property detail dialogs
nf.UniversalCapture.removeAllPropertyDetailDialogs();
-
+
// update the processor property table size in case this is the first time its rendered
if ($(this).text() === 'Properties') {
$('#processor-properties').propertytable('resetTableSize');
@@ -494,7 +492,6 @@ nf.ProcessorConfiguration = (function () {
// initialize the processor configuration dialog
$('#processor-configuration').modal({
headerText: 'Configure Processor',
- overlayBackground: true,
handler: {
close: function () {
// empty the relationship list
@@ -512,18 +509,18 @@ nf.ProcessorConfiguration = (function () {
// initialize the bulletin combo
$('#bulletin-level-combo').combo({
options: [{
- text: 'DEBUG',
- value: 'DEBUG'
- }, {
- text: 'INFO',
- value: 'INFO'
- }, {
- text: 'WARN',
- value: 'WARN'
- }, {
- text: 'ERROR',
- value: 'ERROR'
- }]
+ text: 'DEBUG',
+ value: 'DEBUG'
+ }, {
+ text: 'INFO',
+ value: 'INFO'
+ }, {
+ text: 'WARN',
+ value: 'WARN'
+ }, {
+ text: 'ERROR',
+ value: 'ERROR'
+ }]
});
// initialize the run duration slider
@@ -545,7 +542,7 @@ nf.ProcessorConfiguration = (function () {
readOnly: false,
groupId: nf.Canvas.getGroupId(),
dialogContainer: '#new-processor-property-container',
- descriptorDeferred: function(propertyName) {
+ descriptorDeferred: function (propertyName) {
var processor = $('#processor-configuration').data('processorDetails');
return $.ajax({
type: 'GET',
@@ -559,10 +556,10 @@ nf.ProcessorConfiguration = (function () {
goToServiceDeferred: goToServiceFromProperty
});
},
-
+
/**
* Shows the configuration dialog for the specified processor.
- *
+ *
* @argument {selection} selection The selection
*/
showConfiguration: function (selection) {
@@ -588,7 +585,7 @@ nf.ProcessorConfiguration = (function () {
if (nf.Common.isDFM()) {
requests.push();
}
-
+
// once everything is loaded, show the dialog
$.when.apply(window, requests).done(function (processorResult, historyResult) {
// get the updated processor'
@@ -709,27 +706,38 @@ nf.ProcessorConfiguration = (function () {
}
var buttons = [{
- buttonText: 'Apply',
- handler: {
- click: function () {
- // close all fields currently being edited
- $('#processor-properties').propertytable('saveRow');
+ buttonText: 'Apply',
+ color: {
+ base: '#728E9B',
+ hover: '#004849',
+ text: '#ffffff'
+ },
+ handler: {
+ click: function () {
+ // close all fields currently being edited
+ $('#processor-properties').propertytable('saveRow');
- // save the processor
- saveProcessor(processor).done(function (response) {
- // reload the processor's outgoing connections
- reloadProcessorConnections(processor);
+ // save the processor
+ saveProcessor(processor).done(function (response) {
+ // reload the processor's outgoing connections
+ reloadProcessorConnections(processor);
- // close the details panel
- $('#processor-configuration').modal('hide');
-
- // inform Angular app values have changed
- nf.ng.Bridge.digest();
- });
- }
+ // close the details panel
+ $('#processor-configuration').modal('hide');
+
+ // inform Angular app values have changed
+ nf.ng.Bridge.digest();
+ });
}
- }, {
+ }
+ },
+ {
buttonText: 'Cancel',
+ color: {
+ base: '#E3E8EB',
+ hover: '#C7D2D7',
+ text: '#004849'
+ },
handler: {
click: function () {
$('#processor-configuration').modal('hide');
@@ -741,6 +749,11 @@ nf.ProcessorConfiguration = (function () {
if (nf.Common.isDefinedAndNotNull(processor.config.customUiUrl) && processor.config.customUiUrl !== '') {
buttons.push({
buttonText: 'Advanced',
+ color: {
+ base: '#E3E8EB',
+ hover: '#C7D2D7',
+ text: '#004849'
+ },
handler: {
click: function () {
var openCustomUi = function () {
@@ -764,8 +777,8 @@ nf.ProcessorConfiguration = (function () {
if (isSaveRequired()) {
// see if those changes should be saved
nf.Dialog.showYesNoDialog({
+ headerText: 'Save',
dialogContent: 'Save changes before opening the advanced configuration?',
- overlayBackground: false,
noHandler: openCustomUi,
yesHandler: function () {
saveProcessor(processor).done(function (deferred) {
@@ -785,7 +798,7 @@ nf.ProcessorConfiguration = (function () {
// set the button model
$('#processor-configuration').modal('setButtonModel', buttons);
-
+
// load the property table
$('#processor-properties').propertytable('loadProperties', processor.config.properties, processor.config.descriptors, processorHistory.propertyHistory);
http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-queue-listing.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-queue-listing.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-queue-listing.js
index c6dcbb2..df12db0 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-queue-listing.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-queue-listing.js
@@ -41,7 +41,6 @@ nf.QueueListing = (function () {
// configure the drop request status dialog
$('#listing-request-status-dialog').modal({
- overlayBackground: false,
handler: {
close: function () {
// reset the progress bar
@@ -87,8 +86,8 @@ nf.QueueListing = (function () {
}
}).fail(function () {
nf.Dialog.showOkDialog({
- dialogContent: 'Unable to generate access token for downloading content.',
- overlayBackground: false
+ headerText: 'Queue Listing',
+ dialogContent: 'Unable to generate access token for downloading content.'
});
});
};
@@ -119,8 +118,8 @@ nf.QueueListing = (function () {
deferred.resolve(uiExtensionToken, downloadToken);
}).fail(function () {
nf.Dialog.showOkDialog({
- dialogContent: 'Unable to generate access token for viewing content.',
- overlayBackground: false
+ headerText: 'Queue Listing',
+ dialogContent: 'Unable to generate access token for viewing content.'
});
deferred.reject();
});
@@ -201,9 +200,13 @@ nf.QueueListing = (function () {
$('#flowfile-details-dialog').modal({
headerText: 'FlowFile',
- overlayBackground: false,
buttons: [{
buttonText: 'Ok',
+ color: {
+ base: '#728E9B',
+ hover: '#004849',
+ text: '#ffffff'
+ },
handler: {
click: function () {
$('#flowfile-details-dialog').modal('hide');
@@ -250,6 +253,11 @@ nf.QueueListing = (function () {
// update the button model of the drop request status dialog
$('#listing-request-status-dialog').modal('setButtonModel', [{
buttonText: 'Stop',
+ color: {
+ base: '#728E9B',
+ hover: '#004849',
+ text: '#ffffff'
+ },
handler: {
click: function () {
cancelled = true;
@@ -287,8 +295,8 @@ nf.QueueListing = (function () {
// show the dialog
nf.Dialog.showOkDialog({
- dialogContent: 'The queue has no FlowFiles.',
- overlayBackground: false
+ headerText: 'Queue Listing',
+ dialogContent: 'The queue has no FlowFiles.'
});
}
} else {
@@ -497,14 +505,14 @@ nf.QueueListing = (function () {
initFlowFileDetailsDialog();
// define mouse over event for the refresh button
- nf.Common.addHoverEffect('#queue-listing-refresh-button', 'button-refresh', 'button-refresh-hover').click(function () {
+ $('#queue-listing-refresh-button').click(function () {
var connection = $('#queue-listing-table').data('connection');
performListing(connection);
});
// define a custom formatter for showing more processor details
var moreDetailsFormatter = function (row, cell, value, columnDef, dataContext) {
- return '<img src="images/iconDetails.png" title="View Details" class="pointer show-flowfile-details" style="margin-top: 5px; float: left;"/>';
+ return '<div class="pointer show-flowfile-details fa fa-info" title="View Details" style="margin-top: 5px; float: left;"></div>';
};
// function for formatting data sizes
@@ -530,19 +538,73 @@ nf.QueueListing = (function () {
// initialize the queue listing table
var queueListingColumns = [
- {id: 'moreDetails', field: 'moreDetails', name: ' ', sortable: false, resizable: false, formatter: moreDetailsFormatter, width: 50, maxWidth: 50},
- {id: 'position', name: 'Position', field: 'position', sortable: false, resizable: false, width: 75, maxWidth: 75},
+ {
+ id: 'moreDetails',
+ field: 'moreDetails',
+ name: ' ',
+ sortable: false,
+ resizable: false,
+ formatter: moreDetailsFormatter,
+ width: 50,
+ maxWidth: 50
+ },
+ {
+ id: 'position',
+ name: 'Position',
+ field: 'position',
+ sortable: false,
+ resizable: false,
+ width: 75,
+ maxWidth: 75
+ },
{id: 'uuid', name: 'UUID', field: 'uuid', sortable: false, resizable: true},
{id: 'filename', name: 'Filename', field: 'filename', sortable: false, resizable: true},
- {id: 'size', name: 'File Size', field: 'size', sortable: false, resizable: true, defaultSortAsc: false, formatter: dataSizeFormatter},
- {id: 'queuedDuration', name: 'Queued Duration', field: 'queuedDuration', sortable: false, resizable: true, formatter: durationFormatter},
- {id: 'lineageDuration', name: 'Lineage Duration', field: 'lineageDuration', sortable: false, resizable: true, formatter: durationFormatter},
- {id: 'penalized', name: 'Penalized', field: 'penalized', sortable: false, resizable: false, width: 100, maxWidth: 100, formatter: penalizedFormatter}
+ {
+ id: 'size',
+ name: 'File Size',
+ field: 'size',
+ sortable: false,
+ resizable: true,
+ defaultSortAsc: false,
+ formatter: dataSizeFormatter
+ },
+ {
+ id: 'queuedDuration',
+ name: 'Queued Duration',
+ field: 'queuedDuration',
+ sortable: false,
+ resizable: true,
+ formatter: durationFormatter
+ },
+ {
+ id: 'lineageDuration',
+ name: 'Lineage Duration',
+ field: 'lineageDuration',
+ sortable: false,
+ resizable: true,
+ formatter: durationFormatter
+ },
+ {
+ id: 'penalized',
+ name: 'Penalized',
+ field: 'penalized',
+ sortable: false,
+ resizable: false,
+ width: 100,
+ maxWidth: 100,
+ formatter: penalizedFormatter
+ }
];
// conditionally show the cluster node identifier
if (nf.Canvas.isClustered()) {
- queueListingColumns.push({id: 'clusterNodeAddress', name: 'Node', field: 'clusterNodeAddress', sortable: false, resizable: true});
+ queueListingColumns.push({
+ id: 'clusterNodeAddress',
+ name: 'Node',
+ field: 'clusterNodeAddress',
+ sortable: false,
+ resizable: true
+ });
}
// add an actions column when the user can access provenance
@@ -552,7 +614,15 @@ nf.QueueListing = (function () {
return '<div title="Provenance" class="pointer provenance-icon view-provenance"></div>';
};
- queueListingColumns.push({id: 'actions', name: ' ', resizable: false, formatter: actionsFormatter, sortable: false, width: 50, maxWidth: 50});
+ queueListingColumns.push({
+ id: 'actions',
+ name: ' ',
+ resizable: false,
+ formatter: actionsFormatter,
+ sortable: false,
+ width: 50,
+ maxWidth: 50
+ });
}
var queueListingOptions = {
@@ -560,7 +630,8 @@ nf.QueueListing = (function () {
enableTextSelectionOnCells: true,
enableCellNavigation: false,
enableColumnReorder: false,
- autoEdit: false
+ autoEdit: false,
+ rowHeight: 24
};
// initialize the dataview
http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-configuration.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-configuration.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-configuration.js
index 1a0d9db..7159033 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-configuration.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-configuration.js
@@ -22,13 +22,17 @@ nf.RemoteProcessGroupConfiguration = (function () {
init: function () {
$('#remote-process-group-configuration').modal({
headerText: 'Configure Remote Process Group',
- overlayBackground: true,
buttons: [{
- buttonText: 'Apply',
- handler: {
- click: function () {
- var remoteProcessGroupId = $('#remote-process-group-id').text();
- var remoteProcessGroupData = d3.select('#id-' + remoteProcessGroupId).datum();
+ buttonText: 'Apply',
+ color: {
+ base: '#728E9B',
+ hover: '#004849',
+ text: '#ffffff'
+ },
+ handler: {
+ click: function () {
+ var remoteProcessGroupId = $('#remote-process-group-id').text();
+ var remoteProcessGroupData = d3.select('#id-' + remoteProcessGroupId).datum();
// create the remote process group details
var remoteProcessGroupEntity = {
@@ -45,43 +49,48 @@ nf.RemoteProcessGroupConfiguration = (function () {
}
};
- // update the selected component
- $.ajax({
- type: 'PUT',
- data: JSON.stringify(remoteProcessGroupEntity),
- url: remoteProcessGroupData.component.uri,
- dataType: 'json',
- contentType: 'application/json'
- }).done(function (response) {
- // refresh the remote process group component
- nf.RemoteProcessGroup.set(response);
-
- // close the details panel
- $('#remote-process-group-configuration').modal('hide');
- }).fail(function (xhr, status, error) {
- if (xhr.status === 400) {
- var errors = xhr.responseText.split('\n');
+ // update the selected component
+ $.ajax({
+ type: 'PUT',
+ data: JSON.stringify(remoteProcessGroupEntity),
+ url: remoteProcessGroupData.component.uri,
+ dataType: 'json',
+ contentType: 'application/json'
+ }).done(function (response) {
+ // refresh the remote process group component
+ nf.RemoteProcessGroup.set(response);
- var content;
- if (errors.length === 1) {
- content = $('<span></span>').text(errors[0]);
- } else {
- content = nf.Common.formatUnorderedList(errors);
- }
+ // close the details panel
+ $('#remote-process-group-configuration').modal('hide');
+ }).fail(function (xhr, status, error) {
+ if (xhr.status === 400) {
+ var errors = xhr.responseText.split('\n');
- nf.Dialog.showOkDialog({
- dialogContent: content,
- overlayBackground: false,
- headerText: 'Configuration Error'
- });
+ var content;
+ if (errors.length === 1) {
+ content = $('<span></span>').text(errors[0]);
} else {
- nf.Common.handleAjaxError(xhr, status, error);
+ content = nf.Common.formatUnorderedList(errors);
}
- });
- }
+
+ nf.Dialog.showOkDialog({
+ dialogContent: content,
+ headerText: 'Configuration'
+ });
+ } else {
+ nf.Common.handleAjaxError(xhr, status, error);
+ }
+ });
}
- }, {
+ }
+ },
+ {
buttonText: 'Cancel',
+ color: {
+ base: '#E3E8EB',
+ hover: '#C7D2D7',
+ text: '#004849'
+ },
handler: {
click: function () {
$('#remote-process-group-configuration').modal('hide');
@@ -117,10 +126,10 @@ nf.RemoteProcessGroupConfiguration = (function () {
}]
});
},
-
+
/**
* Shows the details for the remote process group in the specified selection.
- *
+ *
* @argument {selection} selection The selection
*/
showConfiguration: function (selection) {
http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-details.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-details.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-details.js
index 8b2c28e..f533d83 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-details.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-details.js
@@ -22,15 +22,19 @@ nf.RemoteProcessGroupDetails = (function () {
init: function () {
$('#remote-process-group-details').modal({
headerText: 'Remote Process Group Details',
- overlayBackground: true,
buttons: [{
- buttonText: 'Ok',
- handler: {
- click: function () {
- $('#remote-process-group-details').modal('hide');
- }
+ buttonText: 'Ok',
+ color: {
+ base: '#728E9B',
+ hover: '#004849',
+ text: '#ffffff'
+ },
+ handler: {
+ click: function () {
+ $('#remote-process-group-details').modal('hide');
}
- }],
+ }
+ }],
handler: {
close: function () {
// clear the remote process group details
@@ -48,10 +52,10 @@ nf.RemoteProcessGroupDetails = (function () {
}
});
},
-
+
/**
* Shows the details for the remote process group in the specified selection.
- *
+ *
* @argument {selection} selection The selection
*/
showDetails: function (selection) {
http://git-wip-us.apache.org/repos/asf/nifi/blob/8b27ed90/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-ports.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-ports.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-ports.js
index 4ab9b1f..7cd6720 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-ports.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-ports.js
@@ -25,9 +25,13 @@ nf.RemoteProcessGroupPorts = (function () {
var initRemotePortConfigurationDialog = function () {
$('#remote-port-configuration').modal({
headerText: 'Configure Remote Port',
- overlayBackground: false,
buttons: [{
buttonText: 'Apply',
+ color: {
+ base: '#728E9B',
+ hover: '#004849',
+ text: '#ffffff'
+ },
handler: {
click: function () {
var remotePortConcurrentTasks = $('#remote-port-concurrent-tasks').val();
@@ -91,8 +95,7 @@ nf.RemoteProcessGroupPorts = (function () {
nf.Dialog.showOkDialog({
dialogContent: content,
- overlayBackground: false,
- headerText: 'Configuration Error'
+ headerText: 'Remote Process Group Ports'
});
} else {
nf.Common.handleAjaxError(xhr, status, error);
@@ -103,8 +106,8 @@ nf.RemoteProcessGroupPorts = (function () {
});
} else {
nf.Dialog.showOkDialog({
- dialogContent: 'Concurrent tasks must be an integer value.',
- overlayBackground: false
+ headerText: 'Remote Process Group Ports',
+ dialogContent: 'Concurrent tasks must be an integer value.'
});
// close the dialog
@@ -112,14 +115,20 @@ nf.RemoteProcessGroupPorts = (function () {
}
}
}
- }, {
- buttonText: 'Cancel',
- handler: {
- click: function () {
- $('#remote-port-configuration').modal('hide');
+ },
+ {
+ buttonText: 'Cancel',
+ color: {
+ base: '#E3E8EB',
+ hover: '#C7D2D7',
+ text: '#004849'
+ },
+ handler: {
+ click: function () {
+ $('#remote-port-configuration').modal('hide');
+ }
}
- }
- }],
+ }],
handler: {
close: function () {
// clear the name/value textfields
@@ -138,9 +147,13 @@ nf.RemoteProcessGroupPorts = (function () {
var initRemoteProcessGroupConfigurationDialog = function () {
$('#remote-process-group-ports').modal({
headerText: 'Remote Process Group Ports',
- overlayBackground: true,
buttons: [{
buttonText: 'Close',
+ color: {
+ base: '#728E9B',
+ hover: '#004849',
+ text: '#ffffff'
+ },
handler: {
click: function () {
// if this is a DFM, the over status of this node may have changed
@@ -168,7 +181,7 @@ nf.RemoteProcessGroupPorts = (function () {
// clear any tooltips
var dialog = $('#remote-process-group-ports');
nf.Common.cleanUpTooltips(dialog, 'div.remote-port-removed');
- nf.Common.cleanUpTooltips(dialog, 'img.concurrent-tasks-info');
+ nf.Common.cleanUpTooltips(dialog, 'div.concurrent-tasks-info');
// clear the input and output ports
$('#remote-process-group-input-ports-container').empty();
@@ -197,30 +210,27 @@ nf.RemoteProcessGroupPorts = (function () {
var transmissionSwitch;
if (port.connected === true) {
if (port.transmitting === true) {
- transmissionSwitch = $('<div class="enabled-transmission-switch enabled-active-transmission"></div>').appendTo(portContainerEditContainer);
+ transmissionSwitch = (nf.ng.Bridge.injector.get('$compile')($('<md-switch style="margin:0px" class="md-primary enabled-active-transmission" aria-label="Toggle port transmission"></md-switch>'))(nf.ng.Bridge.rootScope)).appendTo(portContainerEditContainer);
+ transmissionSwitch.click();
} else {
if (port.exists === true) {
- transmissionSwitch = $('<div class="enabled-transmission-switch enabled-inactive-transmission"></div>').appendTo(portContainerEditContainer);
+ 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 {
- $('<div class="disabled-transmission-switch disabled-inactive-transmission"></div>').appendTo(portContainerEditContainer);
+ (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);
}
}
} else {
if (port.transmitting === true) {
- $('<div class="disabled-transmission-switch disabled-active-transmission"></div>').appendTo(portContainerEditContainer);
+ (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 {
- $('<div class="disabled-transmission-switch disabled-inactive-transmission"></div>').appendTo(portContainerEditContainer);
+ (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);
}
}
// only support configuration when the remote port exists
if (port.exists === true && port.connected === true) {
// create the button for editing the ports configuration
- var editRemotePort = $('<div class="edit-button edit-remote-port"></div>').on('mouseenter', function () {
- $(this).removeClass('edit-remote-port').addClass('edit-remote-port-hover');
- }).on('mouseleave', function () {
- $(this).removeClass('edit-remote-port-hover').addClass('edit-remote-port');
- }).click(function () {
+ var editRemotePort = $('<button class="button edit-remote-port fa fa-pencil"></button>').click(function () {
var portName = $('#' + portId + '-name').text();
var portConcurrentTasks = $('#' + portId + '-concurrent-tasks').text();
var portCompression = $('#' + portId + '-compression').text() === 'Yes';
@@ -288,7 +298,7 @@ nf.RemoteProcessGroupPorts = (function () {
// if the remote port no long exists, disable the switch
if (remotePort.exists === false) {
// make the transmission switch disabled
- transmissionSwitch.removeClass('enabled-active-transmission enabled-inactive-transmission enabled-transmission-switch').addClass('disabled-transmission-switch disabled-inactive-transmission').off('click');
+ transmissionSwitch.removeClass('enabled-active-transmission enabled-inactive-transmission').addClass('disabled-inactive-transmission').off('click');
// hide the edit button
if (nf.Common.isDefinedAndNotNull(editRemotePort)) {
@@ -326,9 +336,8 @@ nf.RemoteProcessGroupPorts = (function () {
}
nf.Dialog.showOkDialog({
- dialogContent: content,
- overlayBackground: false,
- headerText: 'Configuration Error'
+ headerText: 'Remote Process Group Ports',
+ dialogContent: content
});
} else {
nf.Common.handleAjaxError(xhr, status, error);
@@ -339,9 +348,9 @@ nf.RemoteProcessGroupPorts = (function () {
} else {
// show the disabled transmission switch
if (port.transmitting === true) {
- $('<div class="disabled-transmission-switch disabled-active-transmission"></div>').appendTo(portContainerEditContainer);
+ (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 {
- $('<div class="disabled-transmission-switch disabled-inactive-transmission"></div>').appendTo(portContainerEditContainer);
+ (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);
}
}
@@ -371,9 +380,9 @@ nf.RemoteProcessGroupPorts = (function () {
$('<div>' +
'<div class="setting-name">' +
'Concurrent tasks' +
- '<img class="processor-setting concurrent-tasks-info" src="images/iconInfo.png" alt="Info"/>' +
+ '<div class="processor-setting concurrent-tasks-info fa fa-question-circle"></div>' +
'</div>' +
- '</div>').append(concurrentTasks).appendTo(concurrentTasksContainer).find('img.concurrent-tasks-info').qtip($.extend({
+ '</div>').append(concurrentTasks).appendTo(concurrentTasksContainer).find('div.concurrent-tasks-info').qtip($.extend({
content: 'The number of tasks that should be concurrently scheduled for this port.'
}, nf.Common.config.tooltipConfig));