Firefly-762,764,irsa-4046: Merge PR #1083 from firefly-762,764,irsa-4046

robyww · web-flow · commit 181aaad181fd · 2021-04-29T15:01:23.000-06:00
Firefly-762,764,irsa-4046: implement firefly-762, firefly-764, irsa-4046
diff --git a/src/firefly/js/charts/ui/options/BasicOptions.jsx b/src/firefly/js/charts/ui/options/BasicOptions.jsx
@@ -543,7 +543,7 @@ export function basicOptions ({activeTrace:pActiveTrace, chartId, tbl_id, groupK
                                         const rgbStr = `rgba(${r},${g},${b},${a})`;
                                         dispatchValueChange({fieldKey: `data.${activeTrace}.marker.color`, groupKey, value: rgbStr, valid: true});
                                     }
-                                }, groupKey)}>
+                                }, groupKey, 'plots.colorpicker', .5)}>
                             <ToolbarButton icon={MAGNIFYING_GLASS}/>
                         </div>
                     </div>),
diff --git a/src/firefly/js/ui/ColorPicker.jsx b/src/firefly/js/ui/ColorPicker.jsx
@@ -9,13 +9,28 @@ import {PopupPanel} from './PopupPanel.jsx';
 import CompleteButton from './CompleteButton.jsx';
 import DialogRootContainer from './DialogRootContainer.jsx';
 import {SketchPicker} from 'react-color';
+import HelpIcon from 'firefly/ui/HelpIcon.jsx';
+import {getRGBA} from 'firefly/util/Color.js';
 
 
+const DEF_PRESET_COLORS= ['#D0021B', '#F5A623', '#F8E71C', '#8B572A', '#7ED321', '#417505', '#BD10E0',
+    '#9013FE', '#4A90E2', '#50E3C2', '#B8E986', '#000000', '#4A4A4A', '#9B9B9B', '#FFFFFF'];
 
-export function showColorPickerDialog(color, callbackOnOKOnly, callbackOnBoth, cb, Id = '' ) {
+const dialogTip=
+`Choose a color:
+- graphically
+- as an RGB hex color code (does not support alpha)
+- by entering RGB values (0-255) and an alpha in percent (0-100)
+- from the swatches at the bottom`;
+
+
+export function showColorPickerDialog(color, callbackOnOKOnly, callbackOnBoth, cb, Id = '',
+                                      helpId, presetAlpha,  presetColors) {
     const popup= (
         <PopupPanel title={'Color Picker'+ (Id ? ` - ${Id}`: '')} >
-            <ColorPickerWrapper callback={cb} color={color} callbackOnOKOnly={callbackOnOKOnly} callbackOnBoth={callbackOnBoth}/>
+            <ColorPickerWrapper callback={cb} color={color} helpId={helpId}
+                                callbackOnOKOnly={callbackOnOKOnly} callbackOnBoth={callbackOnBoth}
+                                presetColors={presetColors}  presetAlpha={presetAlpha} />
         </PopupPanel>
     );
     DialogRootContainer.defineDialog('ColorPickerDialog', popup);
@@ -24,22 +39,48 @@ export function showColorPickerDialog(color, callbackOnOKOnly, callbackOnBoth, c
 
 var lastEv;
 
-function ColorPickerWrapper ({callback,color,callbackOnOKOnly, callbackOnBoth}) {
+function ColorPickerWrapper ({callback,color,callbackOnOKOnly, callbackOnBoth,
+                                 helpId= 'visualization.colorpicker',
+                                 presetAlpha,  presetColors=DEF_PRESET_COLORS}) {
     const [currentColor, setCurrentColor] = useState(color);
 
-    const onChange = (ev) => {
-        lastEv=ev;
-        const {r,g,b,a}= ev.rgb;
+    const updateStateFromRGBA= (rgba) =>  {
+        const {r,g,b,a}= rgba;
         setCurrentColor(`rgba(${r},${g},${b},${a})`);
-        if (!callbackOnOKOnly && callback) callback(ev,false);
     };
 
+    const updateColor= (ev) => {
+        lastEv=ev;
+        updateStateFromRGBA(ev.rgb);
+        if (!callbackOnOKOnly) callback?.(ev,false);
+    };
+
+    const psColors= !presetAlpha ? presetColors :
+        presetColors.map( (c) => {
+            const [r,g,b]= getRGBA(c);
+            return `rgba(${r},${g},${b},${presetAlpha})`;
+        });
+
+
     return (
         <div>
-            <SketchPicker onChange={onChange}
-                         color={currentColor} />
-            <CompleteButton onSuccess={() => callbackOnOKOnly||callbackOnBoth ? callback(lastEv,true): null}
-                            dialogId='ColorPickerDialog'/>
+            <div title={dialogTip}>
+                <SketchPicker color={currentColor} presetColors={psColors}
+                              onChangeComplete={updateColor}
+                              onChange={(ev) => updateStateFromRGBA(ev.rgb)}/>
+            </div>
+            <div style={{
+                display:'flex',
+                justifyContent: 'space-between',
+                alignItems: 'center',
+                padding: '3px 5px 3px 6px'
+            }}>
+                <CompleteButton onSuccess={() => (callbackOnOKOnly||callbackOnBoth) && callback(lastEv,true)}
+                                dialogId='ColorPickerDialog'/>
+                <div style={{ textAlign:'center'}}>
+                    <HelpIcon helpId={helpId} />
+                </div>
+            </div>
         </div>
     );
 }
@@ -48,5 +89,7 @@ ColorPickerWrapper.propTypes= {
     callback: PropTypes.func.isRequired,
     color: PropTypes.string.isRequired,
     callbackOnOKOnly: PropTypes.bool.isRequired,
-    callbackOnBoth: PropTypes.bool.isRequired
+    callbackOnBoth: PropTypes.bool.isRequired,
+    presetAlpha: PropTypes.number,
+    presetColors: PropTypes.arrayOf(PropTypes.string)
 };
diff --git a/src/firefly/js/ui/FileUploadDropdown.jsx b/src/firefly/js/ui/FileUploadDropdown.jsx
@@ -6,14 +6,15 @@ import React, {useState} from 'react';
 import {FormPanel} from './FormPanel.jsx';
 import {dispatchHideDropDown} from '../core/LayoutCntlr.js';
 import {panelKey, FileUploadViewPanel, resultSuccess, resultFail} from '../visualize/ui/FileUploadViewPanel.jsx';
+import {getAppOptions} from 'firefly/api/ApiUtil.js';
 
 const dropdownName = 'FileUploadDropDownCmd';
-const helpId = 'basics.searching';
 
 const maskWrapper= { position:'absolute', left:0, top:0, width:'100%', height:'100%' };
 
 export const FileUploadDropdown= () =>{
     const [doMask, changeMasking]= useState(() => false);
+    const helpId = getAppOptions()?.uploadPanelHelpId ?? 'basics.searching';
     return (
         <div style={{width: '100%'}}>
             <FormPanel
diff --git a/src/firefly/js/visualize/ui/FileUploadViewPanel.jsx b/src/firefly/js/visualize/ui/FileUploadViewPanel.jsx
@@ -21,7 +21,7 @@ import {makeFileRequest} from '../../tables/TableRequestUtil.js';
 import {SelectInfo} from '../../tables/SelectInfo.js';
 import {getAViewFromMultiView, getMultiViewRoot, IMAGE} from '../MultiViewCntlr.js';
 import WebPlotRequest from '../WebPlotRequest.js';
-import {dispatchPlotHiPS, dispatchPlotImage, visRoot} from '../ImagePlotCntlr.js';
+import {dispatchPlotImage, visRoot} from '../ImagePlotCntlr.js';
 import {RadioGroupInputField} from '../../ui/RadioGroupInputField.jsx';
 import {showInfoPopup} from '../../ui/PopupUtil.jsx';
 import {WorkspaceUpload} from '../../ui/WorkspaceViewer.jsx';
@@ -44,7 +44,7 @@ import {FileAnalysisType, Format} from '../../data/FileAnalysis';
 import {dispatchValueChange} from 'firefly/fieldGroup/FieldGroupCntlr.js';
 import {CompleteButton,NONE} from 'firefly/ui/CompleteButton.jsx';
 import {createNewRegionLayerId} from 'firefly/drawingLayers/RegionPlot.js';
-import {PLOT_ID} from 'firefly/visualize/saga/CoverageWatcher.js';
+import {getAppOptions} from 'firefly/core/AppDataCntlr.js';
 
 
 export const panelKey = 'FileUploadAnalysis';
@@ -66,6 +66,14 @@ const SUPPORTED_TYPES=[
     FileAnalysisType.REGION,
 ];
 
+const TABLES_ONLY_SUPPORTED_TYPES=[
+    FileAnalysisType.Table,
+];
+
+
+const isTablesOnly= () => getAppOptions()?.uploadPanelLimit==='tablesOnly';
+
+
 const uploadOptions = 'uploadOptions';
 
 let currentAnalysisResult, currentReport, currentSummaryModel, currentDetailsModel;
@@ -88,6 +96,8 @@ export function FileUploadViewPanel() {
         }
     });
 
+    const tablesOnly= isTablesOnly();
+
     const workspace = getWorkspaceConfig();
     const uploadMethod = [{value: FILE_ID, label: 'Upload file'},
         {value: URL_ID, label: 'Upload from URL'}
@@ -117,7 +127,7 @@ export function FileUploadViewPanel() {
                                 {report && <CompleteButton text='Clear File' groupKey={NONE} onSuccess={() =>clearReport()}/> }
                             </div>
                     </div>
-                    <FileAnalysis {...{report, summaryModel, detailsModel}}/>
+                    <FileAnalysis {...{report, summaryModel, detailsModel,tablesOnly}}/>
                     <ImageDisplayOption/>
                 </div>
             </FieldGroup>
@@ -134,18 +144,49 @@ const getPartCnt= () => currentReport?.parts?.length ?? 1;
 const getFirstPartType= () => currentSummaryModel?.tableData.data[0]?.[1];
 const getFileFormat= () => currentReport?.fileFormat;
 const isRegion= () => getFirstPartType()===FileAnalysisType.REGION;
-const isSupported= () => getFirstPartType() && (SUPPORTED_TYPES.includes(getFirstPartType()) || getFileFormat()===Format.FITS);
+
+function isSinglePartFileSupported() {
+    const supportedTypes= isTablesOnly() ? TABLES_ONLY_SUPPORTED_TYPES : SUPPORTED_TYPES;
+    return getFirstPartType() && (supportedTypes.includes(getFirstPartType()));
+}
+
+function isFileSupported() {
+    return getFirstPartType() && (SUPPORTED_TYPES.includes(getFirstPartType()) || getFileFormat()===Format.FITS);
+}
+
+
+function getFirstExtWithData(parts) {
+    return isTablesOnly() ?
+        parts.findIndex((p) => p.type.includes(FileAnalysisType.Table)) :
+        parts.findIndex((p) => !p.type.includes(FileAnalysisType.HeaderOnly));
+}
 
 
 
+function tablesOnlyResultSuccess() {
+    const tableIndices = getSelectedRows(FileAnalysisType.Table);
+    const imageIndices = getSelectedRows(FileAnalysisType.Image);
+
+    if (tableIndices.length>0) {
+        imageIndices.length>0 && showInfoPopup('Only loading the tables, ignoring the images.');
+        sendTableRequest(tableIndices, getFileCacheKey());
+        return true;
+    }
+    else {
+        showInfoPopup('You may only upload tables.');
+        return false;
+    }
+}
+
 
 export function resultSuccess(request) {
+    if (isTablesOnly()) return tablesOnlyResultSuccess();
     const fileCacheKey = getFileCacheKey();
 
-    const tableIndices = getSelectedRows('Table');
-    const imageIndices = getSelectedRows('Image');
+    const tableIndices = getSelectedRows(FileAnalysisType.Table);
+    const imageIndices = getSelectedRows(FileAnalysisType.Image);
 
-    if (!isSupported()) {
+    if (!isFileSupported()) {
         showInfoPopup(`File type of ${getFirstPartType()} is not supported.`);
         return false;
     }
@@ -210,11 +251,12 @@ function getNextState() {
             };
             modelToUseForDetails= currentSummaryModel;
 
-            const firstExtWithData = parts.findIndex((p) => !p.type.includes('HeaderOnly'));
+            const firstExtWithData= getFirstExtWithData(parts);
             if (firstExtWithData >= 0) {
                 const selectInfo = SelectInfo.newInstance({rowCount: data.length});
                 selectInfo.setRowSelect(firstExtWithData, true);        // default select first extension/part with data
                 currentSummaryModel.selectInfo = selectInfo.data;
+                modelToUseForDetails.highlightedRow= firstExtWithData;
             }
 
         }
@@ -337,7 +379,7 @@ function AnalysisTable({summaryModel, detailsModel, report}) {
     );
 }
 
-function SingleDataSet({type, desc, detailsModel, report, supported=isSupported()}) {
+function SingleDataSet({type, desc, detailsModel, report, supported=isSinglePartFileSupported()}) {
     const showDetails= supported && detailsModel;
     return (
         <div style={{display:'flex', flex:'1 1 auto', justifyContent: showDetails?'start':'center'}}>
@@ -375,18 +417,24 @@ function Details({detailsModel}) {
 }
 
 
-const FileAnalysis = React.memo( ({report, summaryModel, detailsModel}) => {
-    const isUnknownFormat = get(report, 'fileFormat') === UNKNOWN_FORMAT;
-    const tableArea = isUnknownFormat ?
-        <div style={{flexGrow: 1, marginTop: 40, textAlign:'center', fontSize: 'larger', color: 'red'}}>
-            Error: Unrecognized Format
-        </div> :
-        <AnalysisTable {...{summaryModel, detailsModel, report}} />;
+function getTableArea(report, summaryModel, detailsModel) {
+    if (report?.fileFormat === UNKNOWN_FORMAT) {
+        return (
+            <div style={{flexGrow: 1, marginTop: 40, textAlign:'center', fontSize: 'larger', color: 'red'}}>
+                Error: Unrecognized Format
+            </div>
+        );
+    }
+    return <AnalysisTable {...{summaryModel, detailsModel, report}} />;
+}
+
+
+const FileAnalysis = React.memo( ({report, summaryModel, detailsModel, tablesOnly}) => {
     if (report) {
         return (
             <div className='FileUpload__report'>
                 {summaryModel.tableData.data.length>1 && <AnalysisInfo report={report} />}
-                {tableArea}
+                {getTableArea(report, summaryModel, detailsModel)}
             </div>
         );
     }
@@ -396,9 +444,9 @@ const FileAnalysis = React.memo( ({report, summaryModel, detailsModel}) => {
             You can load any of the following types of files:
             <ul>
                 <li style={liStyle}>Custom catalog in IPAC, CSV, TSV, VOTABLE, or FITS table format</li>
-                <li style={liStyle}>Any FITS file with tables or images (including multiple HDUs)</li>
-                <li style={liStyle}>A Region file</li>
-                <li style={liStyle}>A MOC FITS file</li>
+                {!tablesOnly && <li style={liStyle}>Any FITS file with tables or images (including multiple HDUs)</li>}
+                {!tablesOnly && <li style={liStyle}>A Region file</li> }
+                {!tablesOnly && <li style={liStyle}>A MOC FITS file</li> }
             </ul>
         </div>);
 
@@ -428,17 +476,7 @@ function getSelectedRows(type) {
 function sendRegionRequest(fileCacheKey) {
     const drawLayerId = createNewRegionLayerId();
     const title= currentReport.fileName ?? 'Region File';
-    // if (!getPlotViewAry(visRoot())?.length) {
-    //     const wpRequest= WebPlotRequest.makeHiPSRequest('ivo://CDS/P/2MASS/color');
-    //     const {viewerId=''} = getAViewFromMultiView(getMultiViewRoot(), IMAGE) || {};
-    //     dispatchPlotHiPS({plotId: PLOT_ID, viewerId, wpRequest, pvOptions: {displayFixedTarget:false} });
-    //     setTimeout(() => {
-    //         dispatchCreateRegionLayer(drawLayerId, title, fileCacheKey, null);
-    //     }, 2000);
-    // }
-    // else {
-        dispatchCreateRegionLayer(drawLayerId, title, fileCacheKey, null);
-    // }
+    dispatchCreateRegionLayer(drawLayerId, title, fileCacheKey, null);
     if (!getPlotViewAry(visRoot())?.length) {
         showInfoPopup('The region file is loaded but you will not be able to see it until you load an image (FITS or HiPS)', 'Warning');
     }

Original file line number	Diff line number	Diff line change
`@@ -543,7 +543,7 @@ export function basicOptions ({activeTrace:pActiveTrace, chartId, tbl_id, groupK`
`543`	`543`	const rgbStr = `rgba(${r},${g},${b},${a})`;
`544`	`544`	dispatchValueChange({fieldKey: `data.${activeTrace}.marker.color`, groupKey, value: rgbStr, valid: true});
`545`	`545`	`}`
`546`		`- }, groupKey)}>`
	`546`	`+ }, groupKey, 'plots.colorpicker', .5)}>`
`547`	`547`	`<ToolbarButton icon={MAGNIFYING_GLASS}/>`
`548`	`548`	`</div>`
`549`	`549`	`</div>),`