EditDescriptorModelProperties.js merge issue fix
[osm/UI.git] / skyquake / plugins / composer / src / src / components / EditDescriptorModelProperties.js
index 41e87b3..abb9447 100644 (file)
@@ -48,6 +48,8 @@ import imgRemove from '../../../node_modules/open-iconic/svg/trash.svg'
 
 import '../styles/EditDescriptorModelProperties.scss'
 
+const EMPTY_LEAF_PRESENT = '--empty-leaf-set--';
+
 function getDescriptorMetaBasicForType(type) {
        const basicPropertiesFilter = d => _includes(DESCRIPTOR_MODEL_FIELDS[type], d.name);
        return DescriptorModelMetaFactory.getModelMetaForType(type, basicPropertiesFilter) || {properties: []};
@@ -76,6 +78,8 @@ function getTitle(model = {}) {
 export default function EditDescriptorModelProperties(props) {
 
        const container = props.container;
+       const readonly = props.readonly;
+       const isEditable = !readonly; //true
 
        if (!(DescriptorModelFactory.isContainer(container))) {
                return
@@ -146,6 +150,9 @@ export default function EditDescriptorModelProperties(props) {
                        }
                        CatalogItemsActions.catalogItemDescriptorChanged(this.getRoot());
                }
+               if(readonly) {
+                       return null;
+               }
                return (
                                <Button className="inline-hint" onClick={onClickAddProperty.bind(container, property, path)} label="Add" src={imgAdd} />
                );
@@ -163,6 +170,9 @@ export default function EditDescriptorModelProperties(props) {
                        }
                        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}/>
                );
@@ -204,7 +214,7 @@ export default function EditDescriptorModelProperties(props) {
                        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) => {
@@ -220,18 +230,18 @@ export default function EditDescriptorModelProperties(props) {
                                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>
                        );
@@ -255,18 +265,18 @@ export default function EditDescriptorModelProperties(props) {
                                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>
                        );
@@ -288,17 +298,47 @@ export default function EditDescriptorModelProperties(props) {
                        }
                        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 present = isEmptyLeafPresent ? EMPTY_LEAF_PRESENT : "";
+                       const options = [
+                               <option key={'true'} value={EMPTY_LEAF_PRESENT}>Enabled</option>,
+                               <option key={'false'} value="">Not 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}
+                                       disabled={!isEditable}>
                                                {options}
                                </select>
                        );
@@ -306,25 +346,25 @@ export default function EditDescriptorModelProperties(props) {
 
                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"
@@ -338,7 +378,7 @@ export default function EditDescriptorModelProperties(props) {
                                onMouseOver={startEditing}
                                onMouseOut={endEditing}
                                onMouseLeave={endEditing}
-                               readOnly={!isEditable}
+                               disabled={!isEditable}
                        />
                );
 
@@ -396,7 +436,7 @@ export default function EditDescriptorModelProperties(props) {
                                // 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('.'));
                                }
@@ -510,17 +550,18 @@ export default function EditDescriptorModelProperties(props) {
 
                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>
@@ -617,7 +658,7 @@ export default function EditDescriptorModelProperties(props) {
                        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;
@@ -786,4 +827,3 @@ export default function EditDescriptorModelProperties(props) {
                </div>
        );
 };
-