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/controllers/nf-ng-canvas-app-controller.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-app-controller.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-app-controller.js deleted file mode 100644 index eefc343..0000000 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-app-controller.js +++ /dev/null @@ -1,39 +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.AppCtrl = function ($scope, serviceProvider) { - 'use strict'; - - function AppCtrl(serviceProvider) { - //global nf namespace for reference throughout angular app - this.nf = nf; - //any registered angular service is available through the serviceProvider - this.serviceProvider = serviceProvider; - } - AppCtrl.prototype = { - constructor: AppCtrl - } - - var appCtrl = new AppCtrl(serviceProvider); - $scope.appCtrl = appCtrl; - - //For production angular applications .scope() is unavailable so we set - //the root scope of the bootstrapped app on the bridge - nf.ng.Bridge.setRootScope($scope); -}; \ 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/controllers/nf-ng-canvas-flow-status-controller.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-flow-status-controller.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-flow-status-controller.js index eda752f..19a90ee 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-flow-status-controller.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-flow-status-controller.js @@ -95,7 +95,7 @@ nf.ng.Canvas.FlowStatusCtrl = function (serviceProvider, $sanitize) { // show all processors if (!nf.Common.isEmpty(searchResults.processorResults)) { - ul.append('<li class="search-header"><div class="search-result-icon"><i class="icon icon-processor"></i></div>Processors</li>'); + ul.append('<li class="search-header"><div class="search-result-icon icon icon-processor"></div>Processors</li>'); $.each(searchResults.processorResults, function (i, processorMatch) { self._renderItem(ul, processorMatch); }); @@ -103,7 +103,7 @@ nf.ng.Canvas.FlowStatusCtrl = function (serviceProvider, $sanitize) { // show all process groups if (!nf.Common.isEmpty(searchResults.processGroupResults)) { - ul.append('<li class="search-header"><div class="search-result-icon"><i class="icon icon-group"></i></div>Process Groups</li>'); + ul.append('<li class="search-header"><div class="search-result-icon icon icon-group"></div>Process Groups</li>'); $.each(searchResults.processGroupResults, function (i, processGroupMatch) { self._renderItem(ul, processGroupMatch); }); @@ -111,7 +111,7 @@ nf.ng.Canvas.FlowStatusCtrl = function (serviceProvider, $sanitize) { // show all remote process groups if (!nf.Common.isEmpty(searchResults.remoteProcessGroupResults)) { - ul.append('<li class="search-header"><div class="search-result-icon"><i class="icon icon-group-remote"></i></div>Remote Process Groups</li>'); + ul.append('<li class="search-header"><div class="search-result-icon icon icon-group-remote"></div>Remote Process Groups</li>'); $.each(searchResults.remoteProcessGroupResults, function (i, remoteProcessGroupMatch) { self._renderItem(ul, remoteProcessGroupMatch); }); @@ -119,7 +119,7 @@ nf.ng.Canvas.FlowStatusCtrl = function (serviceProvider, $sanitize) { // show all connections if (!nf.Common.isEmpty(searchResults.connectionResults)) { - ul.append('<li class="search-header"><div class="search-result-icon"><i class="icon icon-connect"></i></div>Connections</li>'); + ul.append('<li class="search-header"><div class="search-result-icon icon icon-connect"></div>Connections</li>'); $.each(searchResults.connectionResults, function (i, connectionMatch) { self._renderItem(ul, connectionMatch); }); @@ -127,7 +127,7 @@ nf.ng.Canvas.FlowStatusCtrl = function (serviceProvider, $sanitize) { // show all input ports if (!nf.Common.isEmpty(searchResults.inputPortResults)) { - ul.append('<li class="search-header"><div class="search-result-icon"><i class="icon icon-port-in"></i></div>Input Ports</li>'); + ul.append('<li class="search-header"><div class="search-result-icon icon icon-port-in"></div>Input Ports</li>'); $.each(searchResults.inputPortResults, function (i, inputPortMatch) { self._renderItem(ul, inputPortMatch); }); @@ -135,7 +135,7 @@ nf.ng.Canvas.FlowStatusCtrl = function (serviceProvider, $sanitize) { // show all output ports if (!nf.Common.isEmpty(searchResults.outputPortResults)) { - ul.append('<li class="search-header"><div class="search-result-icon"><i class="icon icon-port-out"></i></div>Output Ports</li>'); + ul.append('<li class="search-header"><div class="search-result-icon icon icon-port-out"></div>Output Ports</li>'); $.each(searchResults.outputPortResults, function (i, outputPortMatch) { self._renderItem(ul, outputPortMatch); }); @@ -143,7 +143,7 @@ nf.ng.Canvas.FlowStatusCtrl = function (serviceProvider, $sanitize) { // show all funnels if (!nf.Common.isEmpty(searchResults.funnelResults)) { - ul.append('<li class="search-header"><div class="search-result-icon"><i class="icon icon-funnel"></i></div>Funnels</li>'); + ul.append('<li class="search-header"><div class="search-result-icon icon icon-funnel"></div>Funnels</li>'); $.each(searchResults.funnelResults, function (i, funnelMatch) { self._renderItem(ul, funnelMatch); }); 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/controllers/nf-ng-canvas-global-menu-controller.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-global-menu-controller.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-global-menu-controller.js index 3ccd823..0823f56 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-global-menu-controller.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-global-menu-controller.js @@ -128,7 +128,14 @@ nf.ng.Canvas.GlobalMenuCtrl = function (serviceProvider) { * Launch the settings shell. */ launch: function () { - nf.Settings.showSettings(); + nf.Settings.showSettings().done(function() { + $('#settings-refresh-container').width($('#shell').width()); + + // add a shell:resize listener + $('#shell').on('shell:resize', function () { + $('#settings-refresh-container').width($('#shell').width()); + }); + }); } } }; @@ -298,9 +305,14 @@ nf.ng.Canvas.GlobalMenuCtrl = function (serviceProvider) { var self = this; this.getElement().modal({ - overlayBackground: true, + headerText: 'About Apache NiFi', buttons: [{ buttonText: 'Ok', + color: { + base: '#728E9B', + hover: '#004849', + text: '#ffffff' + }, handler: { click: function () { self.hide(); 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/controllers/nf-ng-canvas-graph-controls-controller.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-graph-controls-controller.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-graph-controls-controller.js index 63cce54..3287768 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-graph-controls-controller.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-graph-controls-controller.js @@ -49,7 +49,7 @@ nf.ng.Canvas.GraphControlsCtrl = function (serviceProvider, navigateCtrl, operat // show the content of the specified graph control graphControl.children('div.graph-control-content').show(); - graphControl.find('i.graph-control-expansion').removeClass('fa-plus-square-o').addClass('fa-minus-square-o'); + graphControl.find('div.graph-control-expansion').removeClass('fa-plus-square-o').addClass('fa-minus-square-o'); // handle specific actions as necessary if (graphControl.attr('id') === 'navigation-control') { @@ -79,7 +79,7 @@ nf.ng.Canvas.GraphControlsCtrl = function (serviceProvider, navigateCtrl, operat var hideGraphControl = function (graphControl) { // hide the content of the specified graph control graphControl.children('div.graph-control-content').hide(); - graphControl.find('i.graph-control-expansion').removeClass('fa-minus-square-o').addClass('fa-plus-square-o'); + graphControl.find('div.graph-control-expansion').removeClass('fa-minus-square-o').addClass('fa-plus-square-o'); // dock if necessary if ($('div.graph-control-content').is(':visible') === false) { 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/controllers/nf-ng-canvas-operate-controller.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-operate-controller.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-operate-controller.js index 2eca3d1..d14b724 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-operate-controller.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-operate-controller.js @@ -58,8 +58,7 @@ nf.ng.Canvas.OperateCtrl = function () { init: function () { // configure the create template dialog this.getElement().modal({ - headerText: 'Create Template', - overlayBackground: false + headerText: 'Create Template' }); }, @@ -114,10 +113,14 @@ nf.ng.Canvas.OperateCtrl = function () { init: function () { // configure the create fillcolor dialog this.getElement().modal({ - headerText: 'Fill', - overlayBackground: false, + headerText: 'Change Color', buttons: [{ buttonText: 'Apply', + color: { + base: '#728E9B', + hover: '#004849', + text: '#ffffff' + }, handler: { click: function () { var selection = nf.CanvasUtils.getSelection(); @@ -156,8 +159,8 @@ nf.ng.Canvas.OperateCtrl = function () { }).fail(function (xhr, status, error) { if (xhr.status === 400 || xhr.status === 404 || xhr.status === 409) { nf.Dialog.showOkDialog({ - dialogContent: nf.Common.escapeHtml(xhr.responseText), - overlayBackground: true + headerText: 'Malformed Request', + dialogContent: nf.Common.escapeHtml(xhr.responseText) }); } }); @@ -168,15 +171,21 @@ nf.ng.Canvas.OperateCtrl = function () { $('#fill-color-dialog').modal('hide'); } } - }, { - buttonText: 'Cancel', - handler: { - click: function () { - // close the dialog - $('#fill-color-dialog').modal('hide'); + }, + { + buttonText: 'Cancel', + color: { + base: '#E3E8EB', + hover: '#C7D2D7', + text: '#004849' + }, + handler: { + click: function () { + // close the dialog + $('#fill-color-dialog').modal('hide'); + } } - } - }], + }], handler: { close: function () { // clear the current color @@ -257,13 +266,14 @@ nf.ng.Canvas.OperateCtrl = function () { } }; } + OperateCtrl.prototype = { constructor: OperateCtrl, /** * Initializes the canvas operate controller. */ - init: function() { + init: function () { this.template.modal.init(); this.fillcolor.modal.init(); this.fillcolor.modal.minicolors.init(); 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/controllers/nf-ng-canvas-toolbox-controller.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-toolbox-controller.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-toolbox-controller.js index 9e84794..35a3a14 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-toolbox-controller.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-toolbox-controller.js @@ -48,7 +48,6 @@ nf.ng.Canvas.ToolboxCtrl = function (processorComponent, * Config for the toolbox */ this.config = { - filterText: 'Filter', type: { processor: 'Processor', inputPort: 'Input Port', @@ -113,7 +112,6 @@ nf.ng.Canvas.ToolboxCtrl = function (processorComponent, revert: true, revertDuration: 0, cancel: false, - helper: "clone", containment: 'body', start: function (e, ui) { // hide the context menu if necessary @@ -138,7 +136,8 @@ nf.ng.Canvas.ToolboxCtrl = function (processorComponent, y: y }]); } - } + }, + helper: component.dragIcon } } } 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/header/components/nf-ng-funnel-component.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-funnel-component.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-funnel-component.js index 7fb91ff..0823756 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-funnel-component.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-funnel-component.js @@ -58,6 +58,16 @@ nf.ng.FunnelComponent = function (serviceProvider) { }, /** + * The drag icon for the toolbox component. + * + * @param event + * @returns {*|jQuery|HTMLElement} + */ + dragIcon: function (event) { + return $('<div class="icon icon-funnel-add"></div>'); + }, + + /** * Creates a new funnel at the specified point. * * @argument {object} pt The point that the funnel was dropped. 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/header/components/nf-ng-group-component.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-group-component.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-group-component.js index f4a887b..046748f 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-group-component.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-group-component.js @@ -85,7 +85,6 @@ nf.ng.GroupComponent = function (serviceProvider) { // configure the new process group dialog this.getElement().modal({ headerText: 'Add Process Group', - overlayBackground: false, handler: { close: function () { $('#new-process-group-name').val(''); @@ -119,6 +118,7 @@ nf.ng.GroupComponent = function (serviceProvider) { } }; } + GroupComponent.prototype = { constructor: GroupComponent, @@ -127,21 +127,21 @@ nf.ng.GroupComponent = function (serviceProvider) { * * @returns {*|jQuery|HTMLElement} */ - getElement: function() { + getElement: function () { return $('#group-component'); }, /** * Enable the component. */ - enabled: function() { + enabled: function () { this.getElement().attr('disabled', false); }, /** * Disable the component. */ - disabled: function() { + disabled: function () { this.getElement().attr('disabled', true); }, @@ -150,16 +150,26 @@ nf.ng.GroupComponent = function (serviceProvider) { * * @argument {object} pt The point that the component was dropped. */ - dropHandler: function(pt) { + dropHandler: function (pt) { this.promptForGroupName(pt); }, /** + * The drag icon for the toolbox component. + * + * @param event + * @returns {*|jQuery|HTMLElement} + */ + dragIcon: function (event) { + return $('<div class="icon icon-group-add"></div>'); + }, + + /** * Prompts the user to enter the name for the group. * * @argument {object} pt The point that the group was dropped. */ - promptForGroupName: function(pt) { + promptForGroupName: function (pt) { var self = this; return $.Deferred(function (deferred) { var addGroup = function () { @@ -179,21 +189,32 @@ nf.ng.GroupComponent = function (serviceProvider) { self.modal.update('setButtonModel', [{ buttonText: 'Add', + color: { + base: '#728E9B', + hover: '#004849', + text: '#ffffff' + }, handler: { click: addGroup } - }, { - buttonText: 'Cancel', - handler: { - click: function () { - // reject the deferred - deferred.reject(); - - // close the dialog - self.modal.hide(); + }, + { + buttonText: 'Cancel', + color: { + base: '#E3E8EB', + hover: '#C7D2D7', + text: '#004849' + }, + handler: { + click: function () { + // reject the deferred + deferred.reject(); + + // close the dialog + self.modal.hide(); + } } - } - }]); + }]); // show the dialog self.modal.show(); 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/header/components/nf-ng-input-port-component.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-input-port-component.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-input-port-component.js index d55db5c..7f6654e 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-input-port-component.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-input-port-component.js @@ -85,7 +85,6 @@ nf.ng.InputPortComponent = function (serviceProvider) { // configure the new port dialog this.getElement().modal({ headerText: 'Add Port', - overlayBackground: false, handler: { close: function () { $('#new-port-name').val(''); @@ -119,6 +118,7 @@ nf.ng.InputPortComponent = function (serviceProvider) { } }; } + InputPortComponent.prototype = { constructor: InputPortComponent, @@ -127,21 +127,21 @@ nf.ng.InputPortComponent = function (serviceProvider) { * * @returns {*|jQuery|HTMLElement} */ - getElement: function() { + getElement: function () { return $('#port-in-component'); }, /** * Enable the component. */ - enabled: function() { + enabled: function () { this.getElement().attr('disabled', false); }, /** * Disable the component. */ - disabled: function() { + disabled: function () { this.getElement().attr('disabled', true); }, @@ -150,16 +150,26 @@ nf.ng.InputPortComponent = function (serviceProvider) { * * @argument {object} pt The point that the component was dropped. */ - dropHandler: function(pt) { + dropHandler: function (pt) { this.promptForInputPortName(pt); }, /** + * The drag icon for the toolbox component. + * + * @param event + * @returns {*|jQuery|HTMLElement} + */ + dragIcon: function (event) { + return $('<div class="icon icon-port-in-add"></div>'); + }, + + /** * Prompts the user to enter the name for the input port. * * @argument {object} pt The point that the input port was dropped. */ - promptForInputPortName: function(pt) { + promptForInputPortName: function (pt) { var self = this; var addInputPort = function () { // get the name of the input port and clear the textfield @@ -174,17 +184,28 @@ nf.ng.InputPortComponent = function (serviceProvider) { this.modal.update('setButtonModel', [{ buttonText: 'Add', + color: { + base: '#728E9B', + hover: '#004849', + text: '#ffffff' + }, handler: { click: addInputPort } - }, { - buttonText: 'Cancel', - handler: { - click: function () { - self.modal.hide(); + }, + { + buttonText: 'Cancel', + color: { + base: '#E3E8EB', + hover: '#C7D2D7', + text: '#004849' + }, + handler: { + click: function () { + self.modal.hide(); + } } - } - }]); + }]); // update the port type $('#new-port-type').text('Input'); 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/header/components/nf-ng-label-component.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-label-component.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-label-component.js index d3e8743..307dd3c 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-label-component.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-label-component.js @@ -58,6 +58,16 @@ nf.ng.LabelComponent = function (serviceProvider) { }, /** + * The drag icon for the toolbox component. + * + * @param event + * @returns {*|jQuery|HTMLElement} + */ + dragIcon: function (event) { + return $('<div class="icon icon-label-add"></div>'); + }, + + /** * Create the label and add to the graph. * * @argument {object} pt The point that the label was dropped. 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/header/components/nf-ng-output-port-component.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-output-port-component.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-output-port-component.js index 11871e7..7dda894 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-output-port-component.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-output-port-component.js @@ -110,6 +110,7 @@ nf.ng.OutputPortComponent = function (serviceProvider) { } }; } + OutputPortComponent.prototype = { constructor: OutputPortComponent, @@ -118,21 +119,21 @@ nf.ng.OutputPortComponent = function (serviceProvider) { * * @returns {*|jQuery|HTMLElement} */ - getElement: function() { + getElement: function () { return $('#port-out-component'); }, /** * Enable the component. */ - enabled: function() { + enabled: function () { this.getElement().attr('disabled', false); }, /** * Disable the component. */ - disabled: function() { + disabled: function () { this.getElement().attr('disabled', true); }, @@ -141,16 +142,26 @@ nf.ng.OutputPortComponent = function (serviceProvider) { * * @argument {object} pt The point that the component was dropped. */ - dropHandler: function(pt) { + dropHandler: function (pt) { this.promptForOutputPortName(pt); }, /** + * The drag icon for the toolbox component. + * + * @param event + * @returns {*|jQuery|HTMLElement} + */ + dragIcon: function (event) { + return $('<div class="icon icon-port-out-add"></div>'); + }, + + /** * Prompts the user to enter the name for the output port. * * @argument {object} pt The point that the output port was dropped. */ - promptForOutputPortName: function(pt) { + promptForOutputPortName: function (pt) { var self = this; var addOutputPort = function () { // get the name of the output port and clear the textfield @@ -165,17 +176,28 @@ nf.ng.OutputPortComponent = function (serviceProvider) { this.modal.update('setButtonModel', [{ buttonText: 'Add', + color: { + base: '#728E9B', + hover: '#004849', + text: '#ffffff' + }, handler: { click: addOutputPort } - }, { - buttonText: 'Cancel', - handler: { - click: function () { - self.modal.hide(); + }, + { + buttonText: 'Cancel', + color: { + base: '#E3E8EB', + hover: '#C7D2D7', + text: '#004849' + }, + handler: { + click: function () { + self.modal.hide(); + } } - } - }]); + }]); // update the port type $('#new-port-type').text('Output'); 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/header/components/nf-ng-processor-component.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-processor-component.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-processor-component.js index cb5b066..8181d40 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-processor-component.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-processor-component.js @@ -176,7 +176,7 @@ nf.ng.ProcessorComponent = function (serviceProvider) { $('#processor-tag-cloud').tagcloud('clearSelectedTags'); // clear any filter strings - $('#processor-type-filter').addClass(serviceProvider.headerCtrl.toolboxCtrl.config.styles.filterList).val(serviceProvider.headerCtrl.toolboxCtrl.config.filterText); + $('#processor-type-filter').addClass(serviceProvider.headerCtrl.toolboxCtrl.config.styles.filterList); // reapply the filter applyFilter(); @@ -260,9 +260,9 @@ nf.ng.ProcessorComponent = function (serviceProvider) { } }).blur(function () { if ($(this).val() === '') { - $(this).addClass(serviceProvider.headerCtrl.toolboxCtrl.config.styles.filterList).val(serviceProvider.headerCtrl.toolboxCtrl.config.filterText); + $(this).addClass(serviceProvider.headerCtrl.toolboxCtrl.config.styles.filterList); } - }).addClass(serviceProvider.headerCtrl.toolboxCtrl.config.styles.filterList).val(serviceProvider.headerCtrl.toolboxCtrl.config.filterText); + }).addClass(serviceProvider.headerCtrl.toolboxCtrl.config.styles.filterList); // initialize the processor type table var processorTypesColumns = [ @@ -275,7 +275,8 @@ nf.ng.ProcessorComponent = function (serviceProvider) { enableCellNavigation: true, enableColumnReorder: false, autoEdit: false, - multiSelect: false + multiSelect: false, + rowHeight: 24 }; // initialize the dataview @@ -403,12 +404,13 @@ nf.ng.ProcessorComponent = function (serviceProvider) { * Initialize the modal. */ init: function () { + var self = this; + this.filter.init(); // configure the new processor dialog this.getElement().modal({ - headerText: 'Add Processor', - overlayBackground: false + headerText: 'Add Processor' }); }, @@ -437,6 +439,7 @@ nf.ng.ProcessorComponent = function (serviceProvider) { } }; } + ProcessorComponent.prototype = { constructor: ProcessorComponent, @@ -445,21 +448,21 @@ nf.ng.ProcessorComponent = function (serviceProvider) { * * @returns {*|jQuery|HTMLElement} */ - getElement: function() { + getElement: function () { return $('#processor-component'); }, /** * Enable the component. */ - enabled: function() { + enabled: function () { this.getElement().attr('disabled', false); }, /** * Disable the component. */ - disabled: function() { + disabled: function () { this.getElement().attr('disabled', true); }, @@ -468,16 +471,26 @@ nf.ng.ProcessorComponent = function (serviceProvider) { * * @argument {object} pt The point that the component was dropped */ - dropHandler: function(pt) { + dropHandler: function (pt) { this.promptForProcessorType(pt); }, /** + * The drag icon for the toolbox component. + * + * @param event + * @returns {*|jQuery|HTMLElement} + */ + dragIcon: function (event) { + return $('<div class="icon icon-processor-add"></div>'); + }, + + /** * Prompts the user to select the type of new processor to create. * * @argument {object} pt The point that the processor was dropped */ - promptForProcessorType: function(pt) { + promptForProcessorType: function (pt) { var self = this; // handles adding the selected processor at the specified point var addProcessor = function () { @@ -488,8 +501,8 @@ nf.ng.ProcessorComponent = function (serviceProvider) { // ensure something was selected if (name === '' || processorType === '') { nf.Dialog.showOkDialog({ - dialogContent: 'The type of processor to create must be selected.', - overlayBackground: false + headerText: 'Add Processor', + dialogContent: 'The type of processor to create must be selected.' }); } else { // create the new processor @@ -519,17 +532,28 @@ nf.ng.ProcessorComponent = function (serviceProvider) { // update the button model this.modal.update('setButtonModel', [{ buttonText: 'Add', + color: { + base: '#728E9B', + hover: '#004849', + text: '#ffffff' + }, handler: { click: addProcessor } - }, { - buttonText: 'Cancel', - handler: { - click: function () { - $('#new-processor-dialog').modal('hide'); + }, + { + buttonText: 'Cancel', + color: { + base: '#E3E8EB', + hover: '#C7D2D7', + text: '#004849' + }, + handler: { + click: function () { + $('#new-processor-dialog').modal('hide'); + } } - } - }]); + }]); // set a new handler for closing the the dialog this.modal.update('setHandler', { 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/header/components/nf-ng-remote-process-group-component.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-remote-process-group-component.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-remote-process-group-component.js index 7e07552..3f862ca 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-remote-process-group-component.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-remote-process-group-component.js @@ -82,7 +82,6 @@ nf.ng.RemoteProcessGroupComponent = function (serviceProvider) { nf.Dialog.showOkDialog({ dialogContent: content, - overlayBackground: false, headerText: 'Configuration Error' }); } else { @@ -116,7 +115,6 @@ nf.ng.RemoteProcessGroupComponent = function (serviceProvider) { // configure the new remote process group dialog this.getElement().modal({ headerText: 'Add Remote Process Group', - overlayBackground: false, handler: { close: function () { $('#new-remote-process-group-uri').val(''); @@ -172,6 +170,7 @@ nf.ng.RemoteProcessGroupComponent = function (serviceProvider) { } }; } + RemoteProcessGroupComponent.prototype = { constructor: RemoteProcessGroupComponent, @@ -180,21 +179,21 @@ nf.ng.RemoteProcessGroupComponent = function (serviceProvider) { * * @returns {*|jQuery|HTMLElement} */ - getElement: function() { + getElement: function () { return $('#group-remote-component'); }, /** * Enable the component. */ - enabled: function() { + enabled: function () { this.getElement().attr('disabled', false); }, /** * Disable the component. */ - disabled: function() { + disabled: function () { this.getElement().attr('disabled', true); }, @@ -203,16 +202,26 @@ nf.ng.RemoteProcessGroupComponent = function (serviceProvider) { * * @argument {object} pt The point that the component was dropped. */ - dropHandler: function(pt) { + dropHandler: function (pt) { this.promptForRemoteProcessGroupUri(pt); }, /** + * The drag icon for the toolbox component. + * + * @param event + * @returns {*|jQuery|HTMLElement} + */ + dragIcon: function (event) { + return $('<div class="icon icon-group-remote-add"></div>'); + }, + + /** * Prompts the user to enter the URI for the remote process group. * * @argument {object} pt The point that the remote group was dropped. */ - promptForRemoteProcessGroupUri: function(pt) { + promptForRemoteProcessGroupUri: function (pt) { var self = this; var addRemoteProcessGroup = function () { // create the remote process group @@ -221,18 +230,28 @@ nf.ng.RemoteProcessGroupComponent = function (serviceProvider) { this.modal.update('setButtonModel', [{ buttonText: 'Add', + color: { + base: '#728E9B', + hover: '#004849', + text: '#ffffff' + }, handler: { click: addRemoteProcessGroup } - }, { - buttonText: 'Cancel', - handler: { - click: function () { - self.modal.hide(); - ; + }, + { + buttonText: 'Cancel', + color: { + base: '#E3E8EB', + hover: '#C7D2D7', + text: '#004849' + }, + handler: { + click: function () { + self.modal.hide(); + } } - } - }]); + }]); // show the dialog this.modal.show(); 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/header/components/nf-ng-template-component.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-template-component.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-template-component.js index 6815b47..3c8a71a 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-template-component.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/header/components/nf-ng-template-component.js @@ -76,7 +76,7 @@ nf.ng.TemplateComponent = function (serviceProvider) { init: function () { // configure the instantiate template dialog this.getElement().modal({ - headerText: 'Instantiate Template', + headerText: 'Add Template', overlayBackgroud: false }); }, @@ -106,6 +106,7 @@ nf.ng.TemplateComponent = function (serviceProvider) { } }; } + TemplateComponent.prototype = { constructor: TemplateComponent, @@ -114,21 +115,21 @@ nf.ng.TemplateComponent = function (serviceProvider) { * * @returns {*|jQuery|HTMLElement} */ - getElement: function() { + getElement: function () { return $('#template-component'); }, /** * Enable the component. */ - enabled: function() { + enabled: function () { this.getElement().attr('disabled', false); }, /** * Disable the component. */ - disabled: function() { + disabled: function () { this.getElement().attr('disabled', true); }, @@ -137,16 +138,26 @@ nf.ng.TemplateComponent = function (serviceProvider) { * * @argument {object} pt The point that the component was dropped. */ - dropHandler: function(pt) { + dropHandler: function (pt) { this.promptForTemplate(pt); }, /** + * The drag icon for the toolbox component. + * + * @param event + * @returns {*|jQuery|HTMLElement} + */ + dragIcon: function (event) { + return $('<div class="icon icon-template-add"></div>'); + }, + + /** * Prompts the user to select a template. * * @argument {object} pt The point that the template was dropped. */ - promptForTemplate: function(pt) { + promptForTemplate: function (pt) { var self = this; $.ajax({ type: 'GET', @@ -173,6 +184,11 @@ nf.ng.TemplateComponent = function (serviceProvider) { // update the button model self.modal.update('setButtonModel', [{ buttonText: 'Add', + color: { + base: '#728E9B', + hover: '#004849', + text: '#ffffff' + }, handler: { click: function () { // get the type of processor currently selected @@ -186,22 +202,27 @@ nf.ng.TemplateComponent = function (serviceProvider) { createTemplate(templateId, pt); } } - }, { - buttonText: 'Cancel', - handler: { - click: function () { - self.modal.hide(); + }, + { + buttonText: 'Cancel', + color: { + base: '#E3E8EB', + hover: '#C7D2D7', + text: '#004849' + }, + handler: { + click: function () { + self.modal.hide(); + } } - } - }]); + }]); // show the dialog self.modal.show(); } else { nf.Dialog.showOkDialog({ headerText: 'Instantiate Template', - dialogContent: 'No templates have been loaded into this NiFi.', - overlayBackground: false + dialogContent: 'No templates have been loaded into this NiFi.' }); } 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-actions.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-actions.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-actions.js index cb3e7af..747be03 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-actions.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-actions.js @@ -25,7 +25,7 @@ nf.Actions = (function () { controller: '../nifi-api/controller' } }; - + /** * Initializes the drop request status dialog. */ @@ -35,7 +35,6 @@ nf.Actions = (function () { // configure the drop request status dialog $('#drop-request-status-dialog').modal({ - overlayBackground: false, handler: { close: function () { // reset the progress bar @@ -44,18 +43,18 @@ nf.Actions = (function () { // update the progress bar var label = $('<div class="progress-label"></div>').text('0%'); dropRequestProgressBar.progressbar('value', 0).append(label); - + // clear the current button model $('#drop-request-status-dialog').modal('setButtonModel', []); } } }); }; - + /** * Updates the resource with the specified entity. - * + * * @param {string} uri * @param {object} entity */ @@ -69,8 +68,8 @@ nf.Actions = (function () { }).fail(function (xhr, status, error) { if (xhr.status === 400 || xhr.status === 404 || xhr.status === 409) { nf.Dialog.showOkDialog({ - dialogContent: nf.Common.escapeHtml(xhr.responseText), - overlayBackground: true + headerText: 'Update Resource', + dialogContent: nf.Common.escapeHtml(xhr.responseText) }); } }); @@ -97,10 +96,10 @@ nf.Actions = (function () { init: function () { initializeDropRequestStatusDialog(); }, - + /** * Enters the specified process group. - * + * * @param {selection} selection The the currently selected component */ enterGroup: function (selection) { @@ -109,17 +108,17 @@ nf.Actions = (function () { nf.CanvasUtils.enterGroup(selectionData.id); } }, - + /** * Exits the current process group but entering the parent group. */ leaveGroup: function () { nf.CanvasUtils.enterGroup(nf.Canvas.getParentGroupId()); }, - + /** * Refresh the flow of the remote process group in the specified selection. - * + * * @param {selection} selection */ refreshRemoteFlow: function (selection) { @@ -134,9 +133,9 @@ nf.Actions = (function () { // update the UI to show last refreshed if appropriate if (selection.classed('visible')) { selection.select('text.remote-process-group-last-refresh') - .text(function () { - return lastRefreshed; - }); + .text(function () { + return lastRefreshed; + }); } }; @@ -180,10 +179,10 @@ nf.Actions = (function () { poll(1); } }, - + /** * Opens the remote process group in the specified selection. - * + * * @param {selection} selection The selection */ openUri: function (selection) { @@ -195,15 +194,16 @@ nf.Actions = (function () { window.open(encodeURI(uri)); } else { nf.Dialog.showOkDialog({ + headerText: 'Remote Process Group', dialogContent: 'No target URI defined.' }); } } }, - + /** * Shows and selects the source of the connection in the specified selection. - * + * * @param {selection} selection The selection */ showSource: function (selection) { @@ -224,10 +224,10 @@ nf.Actions = (function () { } } }, - + /** * Shows and selects the destination of the connection in the specified selection. - * + * * @param {selection} selection The selection */ showDestination: function (selection) { @@ -248,10 +248,10 @@ nf.Actions = (function () { } } }, - + /** * Shows the downstream components from the specified selection. - * + * * @param {selection} selection The selection */ showDownstream: function (selection) { @@ -271,10 +271,10 @@ nf.Actions = (function () { } } }, - + /** * Shows the upstream components from the specified selection. - * + * * @param {selection} selection The selection */ showUpstream: function (selection) { @@ -294,10 +294,10 @@ nf.Actions = (function () { } } }, - + /** * Shows and selects the component in the specified selection. - * + * * @param {selection} selection The selection */ show: function (selection) { @@ -311,26 +311,26 @@ nf.Actions = (function () { nf.Actions.center(selection); } }, - + /** * Selects all components in the specified selection. - * + * * @param {selection} selection Selection of components to select */ select: function (selection) { selection.classed('selected', true); }, - + /** * Selects all components. */ selectAll: function () { nf.Actions.select(d3.selectAll('g.component, g.connection')); }, - + /** * Centers the component in the specified selection. - * + * * @argument {selection} selection The selection */ center: function (selection) { @@ -377,7 +377,7 @@ nf.Actions = (function () { }); } }, - + /** * Enables all eligible selected components. * @@ -388,8 +388,8 @@ nf.Actions = (function () { if (componentsToEnable.empty()) { nf.Dialog.showOkDialog({ - dialogContent: 'No eligible components are selected. Please select the components to be enabled and ensure they are no longer running.', - overlayBackground: true + headerText: 'Enable Components', + dialogContent: 'No eligible components are selected. Please select the components to be enabled and ensure they are no longer running.' }); } else { var enableRequests = []; @@ -420,7 +420,7 @@ nf.Actions = (function () { } } }, - + /** * Disables all eligible selected components. * @@ -431,8 +431,8 @@ nf.Actions = (function () { if (componentsToDisable.empty()) { nf.Dialog.showOkDialog({ - dialogContent: 'No eligible components are selected. Please select the components to be disabled and ensure they are no longer running.', - overlayBackground: true + headerText: 'Disable Components', + dialogContent: 'No eligible components are selected. Please select the components to be disabled and ensure they are no longer running.' }); } else { var disableRequests = []; @@ -463,7 +463,7 @@ nf.Actions = (function () { } } }, - + /** * Opens provenance with the component in the specified selection. * @@ -475,14 +475,14 @@ nf.Actions = (function () { // open the provenance page with the specified component nf.Shell.showPage('provenance?' + $.param({ - componentId: selectionData.id - })); + componentId: selectionData.id + })); } }, /** * Starts the components in the specified selection. - * + * * @argument {selection} selection The selection */ start: function (selection) { @@ -502,8 +502,8 @@ nf.Actions = (function () { // ensure there are startable components selected if (componentsToStart.empty()) { nf.Dialog.showOkDialog({ - dialogContent: 'No eligible components are selected. Please select the components to be started and ensure they are no longer running.', - overlayBackground: true + headerText: 'Start Components', + dialogContent: 'No eligible components are selected. Please select the components to be started and ensure they are no longer running.' }); } else { var startRequests = []; @@ -549,10 +549,10 @@ nf.Actions = (function () { } } }, - + /** * Stops the components in the specified selection. - * + * * @argument {selection} selection The selection */ stop: function (selection) { @@ -572,8 +572,8 @@ nf.Actions = (function () { // ensure there are some component to stop if (componentsToStop.empty()) { nf.Dialog.showOkDialog({ - dialogContent: 'No eligible components are selected. Please select the components to be stopped.', - overlayBackground: true + headerText: 'Stop Components', + dialogContent: 'No eligible components are selected. Please select the components to be stopped.' }); } else { var stopRequests = []; @@ -619,10 +619,10 @@ nf.Actions = (function () { } } }, - + /** * Enables transmission for the components in the specified selection. - * + * * @argument {selection} selection The selection */ enableTransmission: function (selection) { @@ -647,10 +647,10 @@ nf.Actions = (function () { }); }); }, - + /** * Disables transmission for the components in the specified selection. - * + * * @argument {selection} selection The selection */ disableTransmission: function (selection) { @@ -674,10 +674,10 @@ nf.Actions = (function () { }); }); }, - + /** * Shows the configuration dialog for the specified selection. - * + * * @param {selection} selection Selection of the component to be configured */ showConfiguration: function (selection) { @@ -700,7 +700,7 @@ nf.Actions = (function () { } } }, - + // Defines an action for showing component details (like configuration but read only). showDetails: function (selection) { if (selection.empty()) { @@ -720,24 +720,24 @@ nf.Actions = (function () { } } }, - + /** * Shows the usage documentation for the component in the specified selection. - * + * * @param {selection} selection The selection */ showUsage: function (selection) { if (selection.size() === 1 && nf.CanvasUtils.isProcessor(selection)) { var selectionData = selection.datum(); nf.Shell.showPage('../nifi-docs/documentation?' + $.param({ - select: nf.Common.substringAfterLast(selectionData.component.type, '.') - })); + select: nf.Common.substringAfterLast(selectionData.component.type, '.') + })); } }, - + /** * Shows the stats for the specified selection. - * + * * @argument {selection} selection The selection */ showStats: function (selection) { @@ -754,10 +754,10 @@ nf.Actions = (function () { } } }, - + /** * Opens the remote ports dialog for the remote process group in the specified selection. - * + * * @param {selection} selection The selection */ remotePorts: function (selection) { @@ -765,7 +765,7 @@ nf.Actions = (function () { nf.RemoteProcessGroupPorts.showPorts(selection); } }, - + /** * Reloads the status for the entire canvas (components and flow.) */ @@ -774,17 +774,17 @@ nf.Actions = (function () { 'transition': true }); }, - + /** * Deletes the component in the specified selection. - * + * * @param {selection} selection The selection containing the component to be removed */ 'delete': function (selection) { if (nf.Common.isUndefined(selection) || selection.empty()) { nf.Dialog.showOkDialog({ - dialogContent: 'No eligible components are selected. Please select the components to be deleted.', - overlayBackground: true + headerText: 'Reload', + dialogContent: 'No eligible components are selected. Please select the components to be deleted.' }); } else { if (selection.size() === 1) { @@ -859,7 +859,7 @@ nf.Actions = (function () { nf[type].remove(ids); } }); - + // then remove all the connections if (components.has('Connection')) { nf.Connection.remove(components.get('Connection')); @@ -875,28 +875,27 @@ nf.Actions = (function () { } } }, - + /** * Deletes the flow files in the specified connection. - * + * * @param {type} selection */ emptyQueue: function (selection) { if (selection.size() !== 1 || !nf.CanvasUtils.isConnection(selection)) { return; } - + // prompt the user before emptying the queue nf.Dialog.showYesNoDialog({ headerText: 'Empty Queue', dialogContent: 'Are you sure you want to empty this queue? All FlowFiles waiting at the time of the request will be removed.', - overlayBackground: false, noText: 'Cancel', yesText: 'Empty', yesHandler: function () { // get the connection data var connection = selection.datum(); - + var MAX_DELAY = 4; var cancelled = false; var dropRequest = null; @@ -918,22 +917,27 @@ nf.Actions = (function () { // update the button model of the drop request status dialog $('#drop-request-status-dialog').modal('setButtonModel', [{ - buttonText: 'Stop', - handler: { - click: function () { - cancelled = true; - - // we are waiting for the next poll attempt - if (dropRequestTimer !== null) { - // cancel it - clearTimeout(dropRequestTimer); - - // cancel the drop request - completeDropRequest(); - } + buttonText: 'Stop', + color: { + base: '#728E9B', + hover: '#004849', + text: '#ffffff' + }, + handler: { + click: function () { + cancelled = true; + + // we are waiting for the next poll attempt + if (dropRequestTimer !== null) { + // cancel it + clearTimeout(dropRequestTimer); + + // cancel the drop request + completeDropRequest(); } } - }]); + } + }]); // completes the drop request by removing it and showing how many flowfiles were deleted var completeDropRequest = function () { @@ -942,16 +946,16 @@ nf.Actions = (function () { type: 'DELETE', url: dropRequest.uri, dataType: 'json' - }).done(function(response) { + }).done(function (response) { // report the results of this drop request dropRequest = response.dropRequest; - + // build the results var droppedTokens = dropRequest.dropped.split(/ \/ /); var results = $('<div></div>'); $('<span class="label"></span>').text(droppedTokens[0]).appendTo(results); $('<span></span>').text(' FlowFiles (' + droppedTokens[1] + ')').appendTo(results); - + // if the request did not complete, include the original if (dropRequest.percentCompleted < 100) { var originalTokens = dropRequest.original.split(/ \/ /); @@ -959,27 +963,27 @@ nf.Actions = (function () { $('<span></span>').text(' (' + originalTokens[1] + ')').appendTo(results); } $('<span></span>').text(' were removed from the queue.').appendTo(results); - + // if this request failed so the error if (nf.Common.isDefinedAndNotNull(dropRequest.failureReason)) { $('<br/><br/><span></span>').text(dropRequest.failureReason).appendTo(results); } - + // display the results nf.Dialog.showOkDialog({ - dialogContent: results, - overlayBackground: false + headerText: 'Empty Queue', + dialogContent: results }); - }).always(function() { + }).always(function () { $('#drop-request-status-dialog').modal('hide'); }); } else { // nothing was removed nf.Dialog.showOkDialog({ - dialogContent: 'No FlowFiles were removed.', - overlayBackground: false + headerText: 'Empty Queue', + dialogContent: 'No FlowFiles were removed.' }); - + // close the dialog $('#drop-request-status-dialog').modal('hide'); } @@ -992,13 +996,13 @@ nf.Actions = (function () { // update the status of the drop request $('#drop-request-status-message').text(dropRequest.state); - + // update the current number of enqueued flowfiles if (nf.Common.isDefinedAndNotNull(connection.status) && nf.Common.isDefinedAndNotNull(dropRequest.currentCount)) { connection.status.queued = dropRequest.current; nf.Connection.refresh(connection.id); } - + // close the dialog if the if (dropRequest.finished === true || cancelled === true) { completeDropRequest(); @@ -1020,7 +1024,7 @@ nf.Actions = (function () { type: 'GET', url: dropRequest.uri, dataType: 'json' - }).done(function(response) { + }).done(function (response) { dropRequest = response.dropRequest; processDropRequest(nextDelay); }).fail(completeDropRequest); @@ -1032,13 +1036,13 @@ nf.Actions = (function () { url: '../nifi-api/flowfile-queues/' + connection.id + '/drop-requests', dataType: 'json', contentType: 'application/json' - }).done(function(response) { + }).done(function (response) { // initialize the progress bar value updateProgress(0); - + // show the progress dialog $('#drop-request-status-dialog').modal('show'); - + // process the drop request dropRequest = response.dropRequest; processDropRequest(1); @@ -1083,7 +1087,7 @@ nf.Actions = (function () { /** * Opens the fill color dialog for the component in the specified selection. - * + * * @param {type} selection The selection */ fillColor: function (selection) { @@ -1091,18 +1095,18 @@ nf.Actions = (function () { // we know that the entire selection is processors or labels... this // checks if the first item is a processor... if true, all processors var allProcessors = nf.CanvasUtils.isProcessor(selection); - + var color; if (allProcessors) { color = nf.Processor.defaultColor(); } else { color = nf.Label.defaultColor(); } - + // if there is only one component selected, get its color otherwise use default if (selection.size() === 1) { var selectionData = selection.datum(); - + // use the specified color if appropriate if (nf.Common.isDefinedAndNotNull(selectionData.component.style['background-color'])) { color = selectionData.component.style['background-color']; @@ -1125,7 +1129,7 @@ nf.Actions = (function () { $('#fill-color-dialog').modal('show'); } }, - + /** * Groups the currently selected components into a new group. */ @@ -1143,13 +1147,13 @@ nf.Actions = (function () { var origin = nf.CanvasUtils.getOrigin(selection); var pt = {'x': origin.x, 'y': origin.y}; - $.when(nf.ng.Bridge.get('appCtrl.serviceProvider.headerCtrl.toolboxCtrl.groupComponent').promptForGroupName(pt)).done(function (processGroup) { + $.when(nf.ng.Bridge.injector.get('groupComponent').promptForGroupName(pt)).done(function (processGroup) { var group = d3.select('#id-' + processGroup.id); nf.CanvasUtils.moveComponents(selection, group); }); }); }, - + /** * Moves the currently selected component into the current parent group. */ @@ -1160,11 +1164,11 @@ nf.Actions = (function () { if (selection.empty()) { return; } - + // move the current selection into the parent group nf.CanvasUtils.moveComponentsToParent(selection); }, - + /** * Creates a new template based off the currently selected components. If no components * are selected, a template of the entire canvas is made. @@ -1180,8 +1184,8 @@ nf.Actions = (function () { // ensure that components have been specified if (selection.empty()) { nf.Dialog.showOkDialog({ - dialogContent: "The current selection is not valid to create a template.", - overlayBackground: false + headerText: 'Create Template', + dialogContent: "The current selection is not valid to create a template." }); return; } @@ -1192,23 +1196,28 @@ nf.Actions = (function () { // ensure that components specified are valid if (selection.empty()) { nf.Dialog.showOkDialog({ - dialogContent: "The current selection is not valid to create a template.", - overlayBackground: false + headerText: 'Create Template', + dialogContent: "The current selection is not valid to create a template." }); return; } // prompt for the template name $('#new-template-dialog').modal('setButtonModel', [{ - buttonText: 'Create', - handler: { - click: function () { - // hide the dialog - $('#new-template-dialog').modal('hide'); - - // get the template details - var templateName = $('#new-template-name').val(); - var templateDescription = $('#new-template-description').val(); + buttonText: 'Create', + color: { + base: '#728E9B', + hover: '#004849', + text: '#ffffff' + }, + handler: { + click: function () { + // hide the dialog + $('#new-template-dialog').modal('hide'); + + // get the template details + var templateName = $('#new-template-name').val(); + var templateDescription = $('#new-template-description').val(); // create a snippet var snippet = nf.Snippet.marshal(selection); @@ -1231,8 +1240,8 @@ nf.Actions = (function () { }).done(function () { // show the confirmation dialog nf.Dialog.showOkDialog({ - dialogContent: "Template '" + nf.Common.escapeHtml(templateName) + "' was successfully created.", - overlayBackground: false + headerText: 'Create Template', + dialogContent: "Template '" + nf.Common.escapeHtml(templateName) + "' was successfully created." }); }).always(function () { // clear the template dialog fields @@ -1244,6 +1253,11 @@ nf.Actions = (function () { } }, { buttonText: 'Cancel', + color: { + base: '#E3E8EB', + hover: '#C7D2D7', + text: '#004849' + }, handler: { click: function () { $('#new-template-dialog').modal('hide'); @@ -1254,10 +1268,10 @@ nf.Actions = (function () { // auto focus on the template name $('#new-template-name').focus(); }, - + /** * Copies the component in the specified selection. - * + * * @param {selection} selection The selection containing the component to be copied */ copy: function (selection) { @@ -1274,10 +1288,10 @@ nf.Actions = (function () { origin: origin }); }, - + /** * Pastes the currently copied selection. - * + * * @param {selection} selection The selection containing the component to be copied * @param {obj} evt The mouse event */ @@ -1358,16 +1372,16 @@ nf.Actions = (function () { } nf.Dialog.showOkDialog({ - dialogContent: nf.Common.escapeHtml(message), - overlayBackground: true + headerText: 'Paste Error', + dialogContent: nf.Common.escapeHtml(message) }); }); }); }, - + /** * Moves the connection in the specified selection to the front. - * + * * @param {selection} selection */ toFront: function (selection) {
