DM-7016: Image loading feedback

 - includes a fix to Target Panel, the automatic active target was not working correctly

Author: robyww

src/firefly/js/core/layout/FireflyLayoutManager.js

@@ -27,7 +27,8 @@ export function* layoutManager({title, views='tables | images | xyPlots'}) {
 
     while (true) {
         const action = yield take([
-            ImagePlotCntlr.PLOT_IMAGE, ImagePlotCntlr.DELETE_PLOT_VIEW, REPLACE_IMAGES,
+            ImagePlotCntlr.PLOT_IMAGE_START, ImagePlotCntlr.PLOT_IMAGE,
+            ImagePlotCntlr.DELETE_PLOT_VIEW, REPLACE_IMAGES,
             TBL_RESULTS_ADDED, TABLE_REMOVE, TABLE_NEW,
             SHOW_DROPDOWN, SET_LAYOUT_MODE
         ]);
@@ -60,6 +61,7 @@ export function* layoutManager({title, views='tables | images | xyPlots'}) {
 
             case REPLACE_IMAGES :
             case ImagePlotCntlr.PLOT_IMAGE :
+            case ImagePlotCntlr.PLOT_IMAGE_START :
                 [showImages, images, ignore] = handleNewImage(action, images);
                 break;
         }
@@ -73,6 +75,7 @@ export function* layoutManager({title, views='tables | images | xyPlots'}) {
             case TBL_RESULTS_ADDED:
             case REPLACE_IMAGES :
             case ImagePlotCntlr.PLOT_IMAGE :
+            case ImagePlotCntlr.PLOT_IMAGE_START :
             case TABLE_REMOVE:
             case ImagePlotCntlr.DELETE_PLOT_VIEW:
                 if (count === 1) {
@@ -92,6 +95,7 @@ export function* layoutManager({title, views='tables | images | xyPlots'}) {
             case TBL_RESULTS_ADDED:
             case REPLACE_IMAGES :
             case ImagePlotCntlr.PLOT_IMAGE :
+            case ImagePlotCntlr.PLOT_IMAGE_START :
                 dropDown = {visible: count === 0};
                 break;
             case SHOW_DROPDOWN:

src/firefly/js/ui/TargetPanel.jsx

@@ -8,27 +8,37 @@ import {parseTarget, getFeedback, formatPosForTextField} from './TargetPanelWork
 import TargetFeedback from './TargetFeedback.jsx';
 import {InputFieldView} from './InputFieldView.jsx';
 import {fieldGroupConnector} from './FieldGroupConnector.jsx';
+import FieldGroupUtils, {getFieldGroupState} from '../fieldGroup/FieldGroupUtils.js';
 import {dispatchActiveTarget, getActiveTarget} from '../core/AppDataCntlr.js';
 import {isValidPoint, parseWorldPt} from '../visualize/Point.js';
 
 
 
-function TargetPanelView({showHelp, feedback, valid, message, onChange, value, labelWidth}) {
-    return (
-        <div>
-            <InputFieldView
-                valid={valid}
-                visible= {true}
-                message={message}
-                onChange={onChange}
-                label='Name or Position:'
-                value={value}
-                tooltip='Enter a target'
-                labelWidth={labelWidth}
-            />
-            <TargetFeedback showHelp={showHelp} feedback={feedback}/>
-        </div>
-    );
+class TargetPanelView extends Component {
+
+    componentWillUnmount() {
+        const {onUnmountCB, fieldKey, groupKey}= this.props;
+        if (onUnmountCB) onUnmountCB(fieldKey,groupKey);
+    }
+
+    render() {
+        const {showHelp, feedback, valid, message, onChange, value, labelWidth}= this.props;
+        return (
+            <div>
+                <InputFieldView
+                    valid={valid}
+                    visible= {true}
+                    message={message}
+                    onChange={onChange}
+                    label='Name or Position:'
+                    value={value}
+                    tooltip='Enter a target'
+                    labelWidth={labelWidth}
+                />
+                <TargetFeedback showHelp={showHelp} feedback={feedback}/>
+            </div>
+        );
+    }
 }
 
 
@@ -39,10 +49,21 @@ TargetPanelView.propTypes = {
     message: PropTypes.string.isRequired,
     onChange: PropTypes.func.isRequired,
     value : PropTypes.string.isRequired,
-    labelWidth : PropTypes.number
+    labelWidth : PropTypes.number,
+    onUnmountCB : PropTypes.func,
 };
 
 
+function didUnmount(fieldKey,groupKey) {
+   // console.log(`did unmount: ${fieldKey}, ${groupKey}`);
+   //  console.log(`value: ${FieldGroupUtils.getFldValue(FieldGroupUtils.getGroupFields(groupKey),fieldKey)}`);
+
+    const wp= parseWorldPt(FieldGroupUtils.getFldValue(FieldGroupUtils.getGroupFields(groupKey),fieldKey));
+
+    if (isValidPoint(wp)) {
+        if (wp) dispatchActiveTarget(wp);
+    }
+}
 
 
 
@@ -54,7 +75,7 @@ function getProps(params, fireValueChange) {
     const wpStr= params.value;
     const wp= parseWorldPt(wpStr);
 
-    if (isValidPoint(wp)) {
+    if (isValidPoint(wp) && !value) {
         feedback= getFeedback(wp);
         value= wp.objName || formatPosForTextField(wp);
         showHelp= false;
@@ -68,7 +89,8 @@ function getProps(params, fireValueChange) {
             tooltip: 'Enter a target',
             value,
             feedback,
-            showHelp
+            showHelp,
+            onUnmountCB: didUnmount
         });
 }
 
@@ -103,7 +125,6 @@ function handleOnChange(ev, params, fireValueChange) {
 function makePayloadAndUpdateActive(displayValue, parseResults, resolvePromise) {
     const {wpt}= parseResults;
     const wpStr= parseResults && wpt ? wpt.toString() : null;
-    if (wpt) dispatchActiveTarget(wpt);
 
     return {
         message : 'Could not resolve object: Enter valid object',
@@ -128,7 +149,7 @@ function replaceValue(v,props) {
     const t= getActiveTarget();
     var retVal= v;
     if (t && t.worldPt) {
-       console.log(`value: ${v}, but I could use: ${t.worldPt}`);
+       // console.log(`value: ${v}, but I could use: ${t.worldPt}`);
        if (get(t,'worldPt')) retVal= t.worldPt.toString();
     }
     return retVal;

src/firefly/js/visualize/MultiViewCntlr.js

@@ -290,7 +290,8 @@ function reducer(state=initState(), action={}) {
         case ImagePlotCntlr.PLOT_IMAGE_START:
             if (payload.viewerId) {
                 if (payload.plotId) {
-                    retState= addImages(state,payload.viewerId,[payload.plotId]);
+                    state= addImages(state,payload.viewerId,[payload.plotId]);
+                    retState= addImages(state,EXPANDED_MODE_RESERVED,[payload.plotId]);
                 }
             }
             break;

src/firefly/js/visualize/ui/ImageSelectPanelResult.js

@@ -12,6 +12,7 @@ import {parseWorldPt} from '../Point.js';
 import {panelCatalogs} from './ImageSelectPanelProp.js';
 import {showInfoPopup} from '../../ui/PopupUtil.jsx';
 import {sizeFromDeg} from '../../ui/SizeInputField.jsx';
+import {ZoomType} from '../ZoomType.js';
 import {get} from 'lodash';
 import {dispatchHideDropDown} from '../../core/LayoutCntlr.js';
 import {getPlotViewById} from '../PlotViewUtil.js';
@@ -262,6 +263,7 @@ export function resultSuccess(plotInfo, hideDropdown = false) {
                 default:
                     wpr = imagePlotOnSurvey(cId, rq);
             }
+            wpr.setZoomType(ZoomType.TO_WIDTH);
             return wpr;
         };