NO TICKET: leaflist dropdown fix

[osm/UI.git] / skyquake / plugins / composer / src / src / components / EditDescriptorModelProperties.js

diff --git a/skyquake/plugins/composer/src/src/components/EditDescriptorModelProperties.js b/skyquake/plugins/composer/src/src/components/EditDescriptorModelProperties.js
index 20c84da..b510715 100644 (file)
--- a/skyquake/plugins/composer/src/src/components/EditDescriptorModelProperties.js
+++ b/skyquake/plugins/composer/src/src/components/EditDescriptorModelProperties.js
@@ -39,6 +39,7 @@ import SelectionManager from '../libraries/SelectionManager'
 import DeletionManager from '../libraries/DeletionManager'
 import DescriptorModelIconFactory from '../libraries/model/IconFactory'
 import getEventPath from '../libraries/getEventPath'
+import CatalogDataStore from '../stores/CatalogDataStore'
 
 import imgAdd from '../../../node_modules/open-iconic/svg/plus.svg'
 import imgRemove from '../../../node_modules/open-iconic/svg/trash.svg'
@@ -173,12 +174,15 @@ export default function EditDescriptorModelProperties(props) {
        }
 
        function buildField(container, property, path, value, fieldKey) {
+               let cds = CatalogDataStore;
+               let catalogs = cds.getTransientCatalogs();
 
                const name = path.join('.');
                const isEditable = true;
                const isGuid = Property.isGuid(property);
                const onChange = onFormFieldValueChanged.bind(container);
                const isEnumeration = Property.isEnumeration(property);
+               const isLeafRef = Property.isLeafRef(property);
                const onFocus = onFocusPropertyFormInputElement.bind(container, property, path, value);
                const placeholder = changeCase.title(property.name);
                const className = ClassNames(property.name + '-input', {'-is-guid': isGuid});
@@ -200,6 +204,26 @@ export default function EditDescriptorModelProperties(props) {
                        return <select key={fieldKey.toString()} id={fieldKey.toString()} className={ClassNames({'-value-not-set': !isValueSet})} name={name} value={value} title={name} onChange={onChange} onFocus={onFocus} onBlur={endEditing} onMouseDown={startEditing} onMouseOver={startEditing} readOnly={!isEditable}>{options}</select>;
                }
 
+               if (isLeafRef) {
+                       let fullFieldKey = _.isArray(fieldKey) ? fieldKey.join(':') : fieldKey;
+                       let containerRef = container;
+                       while (containerRef.parent) {
+                               fullFieldKey = containerRef.parent.key + ':' + fullFieldKey;
+                               containerRef = containerRef.parent;
+                       }
+                       const leafRefPathValues = Property.getLeafRef(property, path, value, fullFieldKey, catalogs, container);
+
+                       const options = leafRefPathValues && leafRefPathValues.map((d, i) => {
+                               return <option key={fieldKey.toString() + ':' + i} value={d.value}>{d.value}</option>;
+                       });
+                       const isValueSet = leafRefPathValues.filter(d => d.isSelected).length > 0;
+                       if (!isValueSet || property.cardinality === '0..1') {
+                               const noValueDisplayText = changeCase.title(property.name);
+                               options.unshift(<option key={'(value-not-in-leafref)' + fieldKey.toString()} value="" placeholder={placeholder}>{noValueDisplayText}</option>);
+                       }
+                       return <select key={fieldKey.toString()} id={fieldKey.toString()} className={ClassNames({'-value-not-set': !isValueSet})} name={name} value={value} title={name} onChange={onChange} onFocus={onFocus} onBlur={endEditing} onMouseDown={startEditing} onMouseOver={startEditing} readOnly={!isEditable}>{options}</select>;
+               }
+
                if (property['preserve-line-breaks']) {
                        return <textarea key={fieldKey.toString()} cols="5" id={fieldKey.toString()} name={name} value={value} placeholder={placeholder} onChange={onChange} onFocus={onFocus} onBlur={endEditing} onMouseDown={startEditing} onMouseOver={startEditing} onMouseOut={endEditing} onMouseLeave={endEditing} readOnly={!isEditable} />;
                }
@@ -287,16 +311,16 @@ export default function EditDescriptorModelProperties(props) {
                                }
                                utils.assignPathValue(stateObject, [selected].join('.'), _.cloneDeep(choiceObject));
 
-                               if(this.model.uiState.choice.hasOwnProperty(name)) {
-                                       delete this.model[selected];
-                                       utils.removePathValue(this.model, [name, selected].join('.'), isTopCase);
-                               } else {
-                                       // remove the current choice value from the model
-                               utils.removePathValue(this.model, [name, selected].join('.'), isTopCase);
+                               if(selected) {
+                                       if(this.model.uiState.choice.hasOwnProperty(name)) {
+                                               delete this.model[selected];
+                                               utils.removePathValue(this.model, [name, selected].join('.'), isTopCase);
+                                       } else {
+                                               // remove the current choice value from the model
+                                               utils.removePathValue(this.model, [name, selected].join('.'), isTopCase);
+                                       }
                                }
 
-
-
                                // get any state for the new selected choice
                                const newChoiceObject = utils.resolvePath(stateObject, [value].join('.')) || {};
 
@@ -333,7 +357,7 @@ export default function EditDescriptorModelProperties(props) {
                        return {optionName: d.name};
                });
 
-               const options = [{optionName: ''}].concat(cases).map((d, i) => {
+               const options = [{optionName: '', optionValue: false}].concat(cases).map((d, i) => {
                        return (
                                <option key={i} value={d.optionValue} title={d.optionTitle}>
                                        {d.optionName}
@@ -353,7 +377,7 @@ export default function EditDescriptorModelProperties(props) {
                        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.optionName)) {
+                                       if(fieldProperties.hasOwnProperty(c.optionValue.split('.')[1])) {
                                                utils.assignPathValue(container.model, ['uiState.choice', selectName, 'selected'].join('.'), c.optionValue);
                                        }
                                });