export default function EditDescriptorModelProperties(props) {
const container = props.container;
+ const readonly = props.readonly;
+ const isEditable = !readonly; //true
if (!(DescriptorModelFactory.isContainer(container))) {
return
}
CatalogItemsActions.catalogItemDescriptorChanged(this.getRoot());
}
+ if(readonly) {
+ return null;
+ }
return (
<Button className="inline-hint" onClick={onClickAddProperty.bind(container, property, path)} label="Add" src={imgAdd} />
);
}
CatalogItemsActions.catalogItemDescriptorChanged(this.getRoot());
}
+ if(readonly) {
+ return null;
+ }
return (
<Button className="remove-property-action inline-hint" title="Remove" onClick={onClickRemoveProperty.bind(container, property, path)} label="Remove" src={imgRemove}/>
);
let catalogs = cds.getTransientCatalogs();
const pathToProperty = path.join('.');
- const isEditable = true;
const isGuid = Property.isGuid(property);
const isBoolean = Property.isBoolean(property);
const isEnumeration = Property.isEnumeration(property);
processFieldValueChange.bind(container, pathToProperty), 2000, {maxWait: 5000})); // max wait for short-name
// create an onChange event handler for a select field for the specified field path
const onSelectChange = changeHandler.bind(null, processFieldValueChange.bind(container, pathToProperty));
-
+
if (isEnumeration) {
const enumeration = Property.getEnumeration(property, value);
const options = enumeration.map((d, i) => {
options.unshift(<option key={'(value-not-in-enum)'} value="" placeholder={placeholder}>{noValueDisplayText}</option>);
}
return (
- <select
- key={fieldKey}
+ <select
+ key={fieldKey}
id={fieldKey}
- className={ClassNames({'-value-not-set': !isValueSet})}
- defaultValue={value}
- title={pathToProperty}
- onChange={onSelectChange}
- onFocus={onFocus}
- onBlur={endEditing}
- onMouseDown={startEditing}
- onMouseOver={startEditing}
- readOnly={!isEditable}>
+ className={ClassNames({'-value-not-set': !isValueSet})}
+ defaultValue={value}
+ title={pathToProperty}
+ onChange={onSelectChange}
+ onFocus={onFocus}
+ onBlur={endEditing}
+ onMouseDown={startEditing}
+ onMouseOver={startEditing}
+ disabled={!isEditable}>
{options}
</select>
);
options.unshift(<option key={'(value-not-in-leafref)'} value="" placeholder={placeholder}>{noValueDisplayText}</option>);
}
return (
- <select
- key={fieldKey}
- id={fieldKey}
- className={ClassNames({'-value-not-set': !isValueSet})}
- defaultValue={value}
- title={pathToProperty}
- onChange={onSelectChange}
- onFocus={onFocus}
- onBlur={endEditing}
- onMouseDown={startEditing}
- onMouseOver={startEditing}
- readOnly={!isEditable}>
+ <select
+ key={fieldKey}
+ id={fieldKey}
+ className={ClassNames({'-value-not-set': !isValueSet})}
+ defaultValue={value}
+ title={pathToProperty}
+ onChange={onSelectChange}
+ onFocus={onFocus}
+ onBlur={endEditing}
+ onMouseDown={startEditing}
+ onMouseOver={startEditing}
+ disabled={!isEditable}>
{options}
</select>
);
}
const isValueSet = (val != '' && val)
return (
- <select
- key={fieldKey}
- id={fieldKey}
- className={ClassNames({'-value-not-set': !isValueSet})}
- defaultValue={val && val.toUpperCase()}
- title={pathToProperty}
- onChange={onSelectChange}
- onFocus={onFocus}
- onBlur={endEditing}
- onMouseDown={startEditing}
- onMouseOver={startEditing}
- readOnly={!isEditable}>
+ <select
+ key={fieldKey}
+ id={fieldKey}
+ className={ClassNames({'-value-not-set': !isValueSet})}
+ defaultValue={val && val.toUpperCase()}
+ title={pathToProperty}
+ onChange={onSelectChange}
+ onFocus={onFocus}
+ onBlur={endEditing}
+ onMouseDown={startEditing}
+ onMouseOver={startEditing}
+ disabled={!isEditable}>
{options}
</select>
);
}
-
+
if (Property.isLeafEmpty(property)) {
// A null value indicates the leaf exists (as opposed to undefined).
// We stick in a string when the user actually sets it to simplify things
// but the correct thing happens when we serialize to user data
- let isEmptyLeafPresent = (value === EMPTY_LEAF_PRESENT || value === null);
+ let isEmptyLeafPresent = (value === EMPTY_LEAF_PRESENT || value === null);
let present = isEmptyLeafPresent ? EMPTY_LEAF_PRESENT : "";
const options = [
<option key={'true'} value={EMPTY_LEAF_PRESENT}>Enabled</option>,
]
return (
- <select
- key={fieldKey}
- id={fieldKey}
- className={ClassNames({'-value-not-set': !isEmptyLeafPresent})}
- defaultValue={present}
- title={pathToProperty}
- onChange={onSelectChange}
- onFocus={onFocus}
- onBlur={endEditing}
- onMouseDown={startEditing}
- onMouseOver={startEditing}
- readOnly={!isEditable}>
+ <select
+ key={fieldKey}
+ id={fieldKey}
+ className={ClassNames({'-value-not-set': !isEmptyLeafPresent})}
+ defaultValue={present}
+ title={pathToProperty}
+ onChange={onSelectChange}
+ onFocus={onFocus}
+ onBlur={endEditing}
+ onMouseDown={startEditing}
+ onMouseOver={startEditing}
+ disabled={!isEditable}>
{options}
</select>
);
if (property['preserve-line-breaks']) {
return (
- <textarea
- key={fieldKey}
- cols="5"
- id={fieldKey}
- defaultValue={value}
- placeholder={placeholder}
- onChange={onTextChange}
- onFocus={onFocus}
- onBlur={endEditing}
- onMouseDown={startEditing}
- onMouseOver={startEditing}
- onMouseOut={endEditing}
- onMouseLeave={endEditing}
- readOnly={!isEditable} />
+ <textarea
+ key={fieldKey}
+ cols="5"
+ id={fieldKey}
+ defaultValue={value}
+ placeholder={placeholder}
+ onChange={onTextChange}
+ onFocus={onFocus}
+ onBlur={endEditing}
+ onMouseDown={startEditing}
+ onMouseOver={startEditing}
+ onMouseOut={endEditing}
+ onMouseLeave={endEditing}
+ disabled={!isEditable} />
);
}
return (
- <input
+ <input
key={fieldKey}
id={fieldKey}
type="text"
onMouseOver={startEditing}
onMouseOut={endEditing}
onMouseLeave={endEditing}
- readOnly={!isEditable}
+ disabled={!isEditable}
/>
);
// write the current choice value into the state
let choiceObject = utils.resolvePath(this.model, [name, selected].join('.'));
let isTopCase = false;
- if (!choiceObject) {
+ if (choiceObject) {
isTopCase = true;
choiceObject = utils.resolvePath(this.model, [selected].join('.'));
}
if(fieldProperties) {
//Check each case statement in model and see if it is present in container model.
cases.map(function(c){
- if(fieldProperties.hasOwnProperty(c.optionValue.split('.')[1])) {
+ if(c.optionValue && fieldProperties.hasOwnProperty(c.optionValue.split('.')[1])) {
utils.assignPathValue(container.model, ['uiState.choice', pathToChoice, 'selected'].join('.'), c.optionValue);
}
});
selectedOptionValue = utils.resolvePath(container.model, ['uiState.choice', pathToChoice, 'selected'].join('.'));
} else {
property.properties.map(function(p) {
- let pname = p.properties[0].name;
+ let pname = p.properties[0] && p.properties[0].name;
if(container.model.hasOwnProperty(pname)) {
utils.assignPathValue(container.model, ['uiState.choice', pathToChoice, 'selected'].join('.'), [p.name, pname].join('.'));
}
return (
<div key={key} className="choice">
- <select
- key={Date.now()}
- className={ClassNames({'-value-not-set': !selectedOptionValue})}
- defaultValue={selectedOptionValue}
- onChange={onChange}
- onFocus={onFocus}
- onBlur={endEditing}
- onMouseDown={startEditing}
- onMouseOver={startEditing}
- onMouseOut={endEditing}
+ <select
+ key={Date.now()}
+ className={ClassNames({'-value-not-set': !selectedOptionValue})}
+ defaultValue={selectedOptionValue}
+ onChange={onChange}
+ onFocus={onFocus}
+ onBlur={endEditing}
+ onMouseDown={startEditing}
+ onMouseOver={startEditing}
+ onMouseOut={endEditing}
onMouseLeave={endEditing}
+ disabled={!isEditable}
>
{options}
</select>
let field;
const valuePath = path.slice();
// create a unique field Id for use as react component keys and html element ids
- // notes:
+ // notes:
// keys only need to be unique on components in the same array
// html element ids should be unique with the document (or form)
let fieldId = uniqueId;
value = utils.resolvePath(container.model, ['uiState.choice'].concat(path, 'selected').join('.'));
if(!value) {
property.properties.map(function(p) {
- let pname = p.properties[0].name;
+ let pname = p.properties[0] && p.properties[0].name;
if(container.model.hasOwnProperty(pname)) {
value = container.model[pname];
}
</div>
);
};
-