NIFI-325:

- Code clean up.
- Ensuring the fill color action is available in toolbar and context menu under the same conditions.
- Only applying the new color if different.
This commit is contained in:
Matt Gilman 2015-02-17 11:44:15 -05:00
parent dde5fd51a4
commit 4239797b9f
5 changed files with 61 additions and 58 deletions

View File

@ -843,17 +843,11 @@ nf.Actions = (function () {
* @param {type} selection The selection
*/
fillColor: function (selection) {
var selectedProcessors = selection.filter(function(d) {
return nf.CanvasUtils.isProcessor(d3.select(this));
});
var selectedLabels = selection.filter(function(d) {
return nf.CanvasUtils.isLabel(d3.select(this));
});
var allProcessors = selectedProcessors.size() === selection.size();
var allLabels = selectedLabels.size() === selection.size();
if (allProcessors || allLabels) {
if (nf.CanvasUtils.isColorable(selection)) {
// 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();

View File

@ -182,34 +182,37 @@ nf.CanvasHeader = (function () {
// get the color and update the styles
var color = $('#fill-color').minicolors('value');
// update the style for the specified component
$.ajax({
type: 'PUT',
url: selectedData.component.uri,
data: {
'version': revision.version,
'clientId': revision.clientId,
'style[background-color]': color
},
dataType: 'json'
}).done(function (response) {
// update the revision
nf.Client.setRevision(response.revision);
// ensure the color actually changed
if (color !== selectedData.component.style['background-color']) {
// update the style for the specified component
$.ajax({
type: 'PUT',
url: selectedData.component.uri,
data: {
'version': revision.version,
'clientId': revision.clientId,
'style[background-color]': color
},
dataType: 'json'
}).done(function (response) {
// update the revision
nf.Client.setRevision(response.revision);
// update the processor
if (nf.CanvasUtils.isProcessor(selected)) {
nf.Processor.set(response.processor);
} else {
nf.Label.set(response.label);
}
}).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
});
}
});
// update the processor
if (nf.CanvasUtils.isProcessor(selected)) {
nf.Processor.set(response.processor);
} else {
nf.Label.set(response.label);
}
}).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
});
}
});
}
});
// close the dialog
@ -255,12 +258,13 @@ nf.CanvasHeader = (function () {
var hex = $('#fill-color-value').val();
// only update the fill color when its a valid hex color string
// #[six hex characters|three hex characters] case insensitive
if (/(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(hex)) {
$('#fill-color').minicolors('value', hex);
}
};
// initialize the fill color value
// apply fill color from field on blur and enter press
$('#fill-color-value').on('blur', updateColor).on('keyup', function(e) {
var code = e.keyCode ? e.keyCode : e.which;
if (code === $.ui.keyCode.ENTER) {

View File

@ -141,19 +141,8 @@ nf.CanvasToolbar = (function () {
actions['group'].disable();
}
// determine if the current selection is entirely processors or labels
var selectedProcessors = selection.filter(function(d) {
return nf.CanvasUtils.isProcessor(d3.select(this));
});
var selectedLabels = selection.filter(function(d) {
return nf.CanvasUtils.isLabel(d3.select(this));
});
var allProcessors = selectedProcessors.size() === selection.size();
var allLabels = selectedLabels.size() === selection.size();
// if there are any colorable components enable the button
if (allProcessors || allLabels) {
// if there are any colorable components enable the fill button
if (nf.CanvasUtils.isColorable(selection)) {
actions['fill'].enable();
} else {
actions['fill'].disable();

View File

@ -474,6 +474,27 @@ nf.CanvasUtils = (function () {
});
},
/**
* Determines if the specified selection is colorable (in a single action).
*
* @param {selection} selection The selection
* @returns {boolean}
*/
isColorable: function(selection) {
// determine if the current selection is entirely processors or labels
var selectedProcessors = selection.filter(function(d) {
return nf.CanvasUtils.isProcessor(d3.select(this));
});
var selectedLabels = selection.filter(function(d) {
return nf.CanvasUtils.isLabel(d3.select(this));
});
var allProcessors = selectedProcessors.size() === selection.size();
var allLabels = selectedLabels.size() === selection.size();
return allProcessors || allLabels;
},
/**
* Determines if the specified selection is a connection.
*

View File

@ -179,12 +179,7 @@ nf.ContextMenu = (function () {
* @param {selection} selection The selection
*/
var isColorable = function (selection) {
// ensure the correct number of components are selected
if (selection.size() !== 1) {
return false;
}
return nf.Common.isDFM() && (nf.CanvasUtils.isProcessor(selection) || nf.CanvasUtils.isLabel(selection));
return nf.Common.isDFM() && nf.CanvasUtils.isColorable(selection);
};
/**