Apache
/
nifi
mirror of https://github.com/apache/nifi.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

NIFI-477: 

- Updating the property details shown in a read only dialog for properties with allowable values. Now rendering a read only combo to show the value's display name and the other available options.
This commit is contained in:
Matt Gilman 2015-04-01 11:15:07 -04:00
parent 30fc75e2b8
commit e2878170a1
8 changed files with 127 additions and 64 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

159
nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/propertytable/jquery.propertytable.js
View File

@ -598,7 +598,7 @@
*/
var showPropertyValue = function (propertyGrid, descriptors, row, cell) {
// remove any currently open detail dialogs
nf.CanvasUtils.removeAllPropertyDetailDialogs();
nf.Common.removeAllPropertyDetailDialogs();
// get the property in question
var propertyData = propertyGrid.getData();
@ -619,7 +619,7 @@
// create the wrapper
var wrapper = $('<div class="property-detail"></div>').css({
'z-index': 100000,
'z-index': 1999,
'position': 'absolute',
'background': 'white',
'padding': '5px',
@ -631,65 +631,116 @@
'left': offset.left - 5
}).appendTo('body');
var editor = null;
// so the nfel editor is appropriate
if (nf.Common.supportsEl(propertyDescriptor)) {
var languageId = 'nfel';
var editorClass = languageId + '-editor';
// prevent dragging over the nf editor
var allowableValues = nf.Common.getAllowableValues(propertyDescriptor);
if ($.isArray(allowableValues)) {
// prevent dragging over the combo
wrapper.draggable({
cancel: 'input, textarea, pre, .button, .' + editorClass,
cancel: '.button, .combo',
containment: 'parent'
});
// create the editor
editor = $('<div></div>').addClass(editorClass).appendTo(wrapper).nfeditor({
languageId: languageId,
width: cellNode.width(),
content: property.value,
minWidth: 175,
minHeight: 100,
readOnly: true,
resizable: true
});
} else {
// prevent dragging over standard components
wrapper.draggable({
containment: 'parent'
// create the read only options
var options = [];
$.each(allowableValues, function (i, allowableValue) {
options.push({
text: allowableValue.displayName,
value: allowableValue.value,
description: nf.Common.escapeHtml(allowableValue.description),
disabled: true
});
});
// create the input field
$('<textarea hidefocus rows="5" readonly="readonly"/>').css({
'background': 'white',
'width': cellNode.width() + 'px',
'height': '80px',
'border-width': '0',
'outline': '0',
'overflow-y': 'auto',
'resize': 'both',
'margin-bottom': '28px'
}).text(property.value).appendTo(wrapper);
}
// add an ok button that will remove the entire pop up
var ok = $('<div class="button button-normal">Ok</div>').on('click', function () {
// clean up the editor
if (editor !== null) {
editor.nfeditor('destroy');
// ensure the options there is at least one option
if (options.length === 0) {
options.push({
text: 'No value',
value: null,
optionClass: 'unset',
disabled: true
});
}
// clean up the rest
wrapper.hide().remove();
});
$('<div></div>').css({
'position': 'absolute',
'bottom': '0',
'left': '0',
'right': '0',
'padding': '0 3px 5px'
}).append(ok).append('<div class="clear"></div>').appendTo(wrapper);
// determine the max height
var windowHeight = $(window).height();
var maxHeight = windowHeight - (offset.top + cellNode.height()) - 16;
var width = cellNode.width() - 16;
// build the combo field
$('<div class="value-combo combo"></div>').width(width).combo({
options: options,
maxHeight: maxHeight,
selectedOption: {
value: property.value
}
}).appendTo(wrapper);
$('<div class="button button-normal">Ok</div>').css({
'margin': '0 0 0 5px',
'float': 'left'
}).on('click', function () {
wrapper.hide().remove();
}).appendTo(wrapper);
} else {
var editor = null;
// so the nfel editor is appropriate
if (nf.Common.supportsEl(propertyDescriptor)) {
var languageId = 'nfel';
var editorClass = languageId + '-editor';
// prevent dragging over the nf editor
wrapper.draggable({
cancel: 'input, textarea, pre, .button, .' + editorClass,
containment: 'parent'
});
// create the editor
editor = $('<div></div>').addClass(editorClass).appendTo(wrapper).nfeditor({
languageId: languageId,
width: cellNode.width(),
content: property.value,
minWidth: 175,
minHeight: 100,
readOnly: true,
resizable: true
});
} else {
// prevent dragging over standard components
wrapper.draggable({
containment: 'parent'
});
// create the input field
$('<textarea hidefocus rows="5" readonly="readonly"/>').css({
'background': 'white',
'width': cellNode.width() + 'px',
'height': '80px',
'border-width': '0',
'outline': '0',
'overflow-y': 'auto',
'resize': 'both',
'margin-bottom': '28px'
}).text(property.value).appendTo(wrapper);
}
// add an ok button that will remove the entire pop up
var ok = $('<div class="button button-normal">Ok</div>').on('click', function () {
// clean up the editor
if (editor !== null) {
editor.nfeditor('destroy');
}
// clean up the rest
wrapper.hide().remove();
});
$('<div></div>').css({
'position': 'absolute',
'bottom': '0',
'left': '0',
'right': '0',
'padding': '0 3px 5px'
}).append(ok).append('<div class="clear"></div>').appendTo(wrapper);
}
}
}
};
@ -1022,7 +1073,7 @@
var clear = function (propertyTableContainer) {
var options = propertyTableContainer.data('options');
if (options.readOnly === true) {
nf.CanvasUtils.removeAllPropertyDetailDialogs();
nf.Common.removeAllPropertyDetailDialogs();
} else {
// clear any existing new property dialogs
if (nf.Common.isDefinedAndNotNull(options.newPropertyDialogContainer)) {

9
nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-utils.js
View File

@ -870,15 +870,6 @@ nf.CanvasUtils = (function () {
return nf.Clipboard.isCopied();
},
/**
* Removes all read only property detail dialogs.
*/
removeAllPropertyDetailDialogs: function () {
var propertyDetails = $('body').children('div.property-detail');
propertyDetails.find('div.nfel-editor').nfeditor('destroy');
propertyDetails.hide().remove();
},
/**
* Persists the current user view.
*/

2
nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas.js
View File

@ -549,7 +549,7 @@ nf.Canvas = (function () {
// first consider read only property detail dialog
if ($('div.property-detail').is(':visible')) {
nf.CanvasUtils.removeAllPropertyDetailDialogs();
nf.Common.removeAllPropertyDetailDialogs();
// prevent further bubbling as we're already handled it
evt.stopPropagation();

3
nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-controller-service.js
View File

@ -1126,6 +1126,9 @@ nf.ControllerService = (function () {
tabContentId: 'controller-service-comments-tab-content'
}],
select: function () {
// remove all property detail dialogs
nf.Common.removeAllPropertyDetailDialogs();
// update the property table size in case this is the first time its rendered
if ($(this).text() === 'Properties') {
$('#controller-service-properties').propertytable('resetTableSize');

3
nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-processor-configuration.js
View File

@ -404,6 +404,9 @@ nf.ProcessorConfiguration = (function () {
tabContentId: 'processor-comments-tab-content'
}],
select: function () {
// remove all property detail dialogs
nf.Common.removeAllPropertyDetailDialogs();
// update the processor property table size in case this is the first time its rendered
if ($(this).text() === 'Properties') {
$('#processor-properties').propertytable('resetTableSize');

3
nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-reporting-task.js
View File

@ -243,6 +243,9 @@ nf.ReportingTask = (function () {
tabContentId: 'reporting-task-comments-tab-content'
}],
select: function () {
// remove all property detail dialogs
nf.Common.removeAllPropertyDetailDialogs();
// update the property table size in case this is the first time its rendered
if ($(this).text() === 'Properties') {
$('#reporting-task-properties').propertytable('resetTableSize');

9
nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/nf-common.js
View File

@ -315,6 +315,15 @@ nf.Common = {
});
},
/**
* Removes all read only property detail dialogs.
*/
removeAllPropertyDetailDialogs: function () {
var propertyDetails = $('body').children('div.property-detail');
propertyDetails.find('div.nfel-editor').nfeditor('destroy');
propertyDetails.hide().remove();
},
/**
* Formats the tooltip for the specified property.
*

3
nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/nf-processor-details.js
View File

@ -69,6 +69,9 @@ nf.ProcessorDetails = (function () {
tabContentId: 'details-processor-comments-tab-content'
}],
select: function () {
// remove all property detail dialogs
nf.Common.removeAllPropertyDetailDialogs();
// resize the property grid in case this is the first time its rendered
if ($(this).text() === 'Properties') {
$('#read-only-processor-properties').propertytable('resetTableSize');