This commit is contained in:
Mark Payne 2015-02-22 11:19:17 -05:00
commit d939359bca
5 changed files with 96 additions and 76 deletions

View File

@ -185,12 +185,17 @@ nf.Actions = (function () {
if (selection.size() === 1 && nf.CanvasUtils.isConnection(selection)) { if (selection.size() === 1 && nf.CanvasUtils.isConnection(selection)) {
var selectionData = selection.datum(); var selectionData = selection.datum();
// if the source is actually in another group // the source is in the current group
if (selectionData.component.source.groupId !== nf.Canvas.getGroupId()) { if (selectionData.component.source.groupId === nf.Canvas.getGroupId()) {
nf.CanvasUtils.showComponent(selectionData.component.source.groupId, selectionData.component.source.id);
} else {
var source = d3.select('#id-' + selectionData.component.source.id); var source = d3.select('#id-' + selectionData.component.source.id);
nf.Actions.show(source); nf.Actions.show(source);
} else if (selectionData.component.source.type === 'REMOTE_OUTPUT_PORT') {
// if the source is remote
var remoteSource = d3.select('#id-' + selectionData.component.source.groupId);
nf.Actions.show(remoteSource);
} else {
// if the source is local but in a sub group
nf.CanvasUtils.showComponent(selectionData.component.source.groupId, selectionData.component.source.id);
} }
} }
}, },
@ -204,12 +209,17 @@ nf.Actions = (function () {
if (selection.size() === 1 && nf.CanvasUtils.isConnection(selection)) { if (selection.size() === 1 && nf.CanvasUtils.isConnection(selection)) {
var selectionData = selection.datum(); var selectionData = selection.datum();
// if the destination is actually in another group // the destination is in the current group or its remote
if (selectionData.component.destination.groupId !== nf.Canvas.getGroupId()) { if (selectionData.component.destination.groupId === nf.Canvas.getGroupId()) {
nf.CanvasUtils.showComponent(selectionData.component.destination.groupId, selectionData.component.destination.id);
} else {
var destination = d3.select('#id-' + selectionData.component.destination.id); var destination = d3.select('#id-' + selectionData.component.destination.id);
nf.Actions.show(destination); nf.Actions.show(destination);
} else if (selectionData.component.destination.type === 'REMOTE_INPUT_PORT') {
// if the destination is remote
var remoteDestination = d3.select('#id-' + selectionData.component.destination.groupId);
nf.Actions.show(remoteDestination);
} else {
// if the destination is local but in a sub group
nf.CanvasUtils.showComponent(selectionData.component.destination.groupId, selectionData.component.destination.id);
} }
} }
}, },
@ -349,7 +359,12 @@ nf.Actions = (function () {
enable: function () { enable: function () {
var components = d3.selectAll('g.component.selected').filter(function (d) { var components = d3.selectAll('g.component.selected').filter(function (d) {
var selected = d3.select(this); var selected = d3.select(this);
return (nf.CanvasUtils.isProcessor(selected) || nf.CanvasUtils.isInputPort(selected) || nf.CanvasUtils.isOutputPort(selected)) && nf.CanvasUtils.supportsModification(selected); var selectedData = selected.datum();
// processors and ports that support modification and are not currently stopped
return (nf.CanvasUtils.isProcessor(selected) || nf.CanvasUtils.isInputPort(selected) || nf.CanvasUtils.isOutputPort(selected)) &&
nf.CanvasUtils.supportsModification(selected) &&
selectedData.component.state !== 'STOPPED';
}); });
if (components.empty()) { if (components.empty()) {
nf.Dialog.showOkDialog({ nf.Dialog.showOkDialog({
@ -379,7 +394,12 @@ nf.Actions = (function () {
disable: function () { disable: function () {
var components = d3.selectAll('g.component.selected').filter(function (d) { var components = d3.selectAll('g.component.selected').filter(function (d) {
var selected = d3.select(this); var selected = d3.select(this);
return (nf.CanvasUtils.isProcessor(selected) || nf.CanvasUtils.isInputPort(selected) || nf.CanvasUtils.isOutputPort(selected)) && nf.CanvasUtils.supportsModification(selected); var selectedData = selected.datum();
// processors and ports that support modification and are not currently disabled
return (nf.CanvasUtils.isProcessor(selected) || nf.CanvasUtils.isInputPort(selected) || nf.CanvasUtils.isOutputPort(selected)) &&
nf.CanvasUtils.supportsModification(selected) &&
selectedData.component.state !== 'DISABLED';
}); });
if (components.empty()) { if (components.empty()) {
nf.Dialog.showOkDialog({ nf.Dialog.showOkDialog({
@ -435,7 +455,6 @@ nf.Actions = (function () {
data['running'] = true; data['running'] = true;
} }
// update the resource
updateResource(d.component.uri, data).done(function (response) { updateResource(d.component.uri, data).done(function (response) {
if (nf.CanvasUtils.isProcessor(selected)) { if (nf.CanvasUtils.isProcessor(selected)) {
nf.Processor.set(response.processor); nf.Processor.set(response.processor);
@ -843,17 +862,11 @@ nf.Actions = (function () {
* @param {type} selection The selection * @param {type} selection The selection
*/ */
fillColor: function (selection) { fillColor: function (selection) {
var selectedProcessors = selection.filter(function(d) { if (nf.CanvasUtils.isColorable(selection)) {
return nf.CanvasUtils.isProcessor(d3.select(this)); // we know that the entire selection is processors or labels... this
}); // checks if the first item is a processor... if true, all processors
var selectedLabels = selection.filter(function(d) { var allProcessors = nf.CanvasUtils.isProcessor(selection);
return nf.CanvasUtils.isLabel(d3.select(this));
});
var allProcessors = selectedProcessors.size() === selection.size();
var allLabels = selectedLabels.size() === selection.size();
if (allProcessors || allLabels) {
var color; var color;
if (allProcessors) { if (allProcessors) {
color = nf.Processor.defaultColor(); color = nf.Processor.defaultColor();

View File

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

View File

@ -141,32 +141,15 @@ nf.CanvasToolbar = (function () {
actions['group'].disable(); actions['group'].disable();
} }
// determine if the current selection is entirely processors or labels // if there are any colorable components enable the fill button
var selectedProcessors = selection.filter(function(d) { if (nf.CanvasUtils.isColorable(selection)) {
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) {
actions['fill'].enable(); actions['fill'].enable();
} else { } else {
actions['fill'].disable(); actions['fill'].disable();
} }
// determine if there are any selected components that support enable/disable
var supportsEnable = selection.filter(function(d) {
var selected = d3.select(this);
return nf.CanvasUtils.isProcessor(selected) || nf.CanvasUtils.isInputPort(selected) || nf.CanvasUtils.isOutputPort(selected);
});
// ensure the entire selection supports enable/disable // ensure the entire selection supports enable/disable
if (!supportsEnable.empty() && supportsEnable.size() === selection.size()) { if (!selection.empty()) {
actions['enable'].enable(); actions['enable'].enable();
actions['disable'].enable(); actions['disable'].enable();
} else { } else {

View File

@ -474,6 +474,31 @@ nf.CanvasUtils = (function () {
}); });
}, },
/**
* Determines if the specified selection is colorable (in a single action).
*
* @param {selection} selection The selection
* @returns {boolean}
*/
isColorable: function(selection) {
if (selection.empty()) {
return false;
}
// 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. * Determines if the specified selection is a connection.
* *

View File

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