Skip to content

Commit 2b311ca

Browse files
wmiipacwmiipac
authored
Merge pull request #114 from Caltech-IPAC/DM-5761
Add XYPlot column select popup
2 parents 3d9555a + 893a25c commit 2b311ca

File tree

8 files changed

+339
-56
lines changed

8 files changed

+339
-56
lines changed

‎src/firefly/js/tables/TableConnector.js

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -87,7 +87,12 @@ export class TableConnector {
8787
const {hlRowIdx, startIdx} = TblUtil.getTblInfoById(this.tbl_id);
8888
if (rowIdx !== hlRowIdx) {
8989
const highlightedRow = startIdx + rowIdx;
90-
TblCntlr.dispatchTableHighlight(this.tbl_id, highlightedRow);
90+
if (this.origTableModel) {
91+
const tableModel = {tbl_id: this.tbl_id, highlightedRow};
92+
flux.process({type: TblCntlr.TABLE_UPDATE, payload: tableModel});
93+
} else {
94+
TblCntlr.dispatchTableHighlight(this.tbl_id, highlightedRow);
95+
}
9196
}
9297
}
9398

‎src/firefly/js/tables/TableUtil.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -441,7 +441,7 @@ export function getTblInfo(tableModel, aPageSize) {
441441
const currentPage = highlightedRow >= 0 ? Math.floor(highlightedRow / pageSize)+1 : 1;
442442
const hlRowIdx = highlightedRow >= 0 ? highlightedRow % pageSize : 0;
443443
const startIdx = (currentPage-1) * pageSize;
444-
const endIdx = Math.min(startIdx+pageSize, totalRows) || startIdx ;
444+
const endIdx = Math.min(startIdx+pageSize, totalRows) || get(tableModel,'tableData.data.length', startIdx) ;
445445
var totalPages = Math.ceil((totalRows || 0)/pageSize);
446446
return { tableModel, tbl_id, title, totalRows, request, startIdx, endIdx, hlRowIdx, currentPage, pageSize,totalPages, highlightedRow, selectInfo, error};
447447
}

‎src/firefly/js/tables/ui/TableRenderer.js

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -177,12 +177,11 @@ export class TextCell extends React.Component {
177177
// }
178178
//
179179
render() {
180-
const lineHeight = this.props.height - 6 + 'px'; // 6 is the top/bottom padding.
181-
const style = Object.assign({lineHeight}, this.props.style || {});
182180
var val = getValue(this.props);
183-
val = (isString(val) && val.search(html_regex) >= 0) ? <div dangerouslySetInnerHTML={{__html: val}}/> : val;
181+
const lineHeight = this.props.height - 6 + 'px'; // 6 is the top/bottom padding.
182+
val = (val.search && val.search(html_regex) >= 0) ? <div dangerouslySetInnerHTML={{__html: val}}/> : val;
184183
return (
185-
<div style={style} className='public_fixedDataTableCell_cellContent'>{val}</div>
184+
<div style={{lineHeight}} className='public_fixedDataTableCell_cellContent'>{val}</div>
186185
);
187186
}
188187
}

‎src/firefly/js/ui/TextButton.jsx

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
/*
2+
* License information at https://github.com/Caltech-IPAC/firefly/blob/master/License.txt
3+
*/
4+
5+
6+
import React, {PropTypes} from 'react';
7+
8+
const labelStyle= {
9+
display: 'inline-block',
10+
lineHeight: '30px',
11+
fontSize: '10pt',
12+
fontStyle: 'italic',
13+
color: 'blue',
14+
verticalAlign:'baseline'
15+
};
16+
17+
/**
18+
*
19+
* @param text
20+
* @param tip
21+
* @param onClick
22+
* @param style
23+
* @return react object
24+
*/
25+
export function TextButton({text, tip='$text',style={}, onClick}) {
26+
var s= Object.assign({cursor:'pointer', verticalAlign:'bottom'},style);
27+
return (
28+
<div style={s} title={tip} onClick={onClick}>
29+
30+
<div style={labelStyle} title={tip}>
31+
<u>{text}</u>
32+
</div>
33+
34+
</div>
35+
);
36+
}
37+
38+
39+
//CloseButton.contextTypes= {
40+
//};
41+
42+
43+
TextButton.propTypes= {
44+
text : PropTypes.string,
45+
style : PropTypes.object,
46+
tip : PropTypes.string,
47+
onClick : PropTypes.func
48+
};
49+
50+
51+

‎src/firefly/js/visualize/ColSelectView.jsx

Lines changed: 139 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,139 @@
1+
/*
2+
*/
3+
import React from 'react';
4+
import DialogRootContainer from '../ui/DialogRootContainer.jsx';
5+
import {PopupPanel} from '../ui/PopupPanel.jsx';
6+
import {dispatchTableRemove} from '../tables/TablesCntlr';
7+
8+
import {BasicTable} from '../tables/ui/BasicTable.jsx';
9+
import {getTblById} from '../tables/TableUtil.js';
10+
import {dispatchShowDialog} from '../core/ComponentCntlr.js';
11+
import CompleteButton from '../ui/CompleteButton.jsx';
12+
import HelpIcon from '../ui/HelpIcon.jsx';
13+
const popupId = 'XYColSelect';
14+
const TBL_ID ='selectCol';
15+
16+
const popupPanelResizableStyle = {
17+
width: 600,
18+
minWidth: 450,
19+
height: 450,
20+
minHeight: 300,
21+
resize: 'both',
22+
overflow: 'hidden',
23+
position: 'relative'
24+
};
25+
26+
27+
//define the table style only in the table div
28+
const tableStyle = {boxSizing: 'border-box', paddingLeft:5,paddingRight:5, width: '100%', height: 'calc(100% - 70px)', overflow: 'hidden', flexGrow: 1, display: 'flex', resize:'none'};
29+
30+
//define the complete button
31+
const closeButtonStyle = {'textAlign': 'center', display: 'inline-block', height:40, marginTop:10, width: '90%'};
32+
//define the helpButton
33+
const helpIdStyle = {'textAlign': 'center', display: 'inline-block', height:40, marginRight: 20};
34+
35+
36+
export function showColSelectPopup(colValStats,onColSelected,popupTitle,buttonText,currentVal) {
37+
38+
if (getTblById(TBL_ID)) {
39+
        dispatchTableRemove(TBL_ID);
40+
    }
41+
42+
const colNames = colValStats.map((colVal) => {return colVal.name;});
43+
var hlRowNum = getHlRow(currentVal,colNames) || 0;
44+
45+
// make a local table for plot column selection panel
46+
var columns = [
47+
{name: 'Name',visibility: 'show', prefWidth: 12},
48+
{name: 'Unit',visibility: 'show', prefWidth: 8},
49+
{name: 'Type',visibility: 'show', prefWidth: 8},
50+
{name: 'Description',visibility: 'show', prefWidth: 60}
51+
];
52+
var data = [];
53+
for (var i = 0; i < colValStats.length; i++) {
54+
data[i] = [
55+
colValStats[i].name,
56+
colValStats[i].unit,
57+
colValStats[i].type,
58+
colValStats[i].descr
59+
];
60+
}
61+
const request = {pageSize:10000};
62+
var tableModel = {totalRows: data.length, request, tbl_id:TBL_ID, tableData: {columns, data }, highlightedRow: hlRowNum};
63+
64+
65+
var popup = (<PopupPanel title={popupTitle}>
66+
{popupForm(tableModel,onColSelected,buttonText,popupId)}
67+
</PopupPanel>
68+
69+
);
70+
71+
DialogRootContainer.defineDialog(popupId, popup);
72+
dispatchShowDialog(popupId);
73+
}
74+
75+
function popupForm(tableModel, onColSelected,buttonText,popupId) {
76+
const tblId = tableModel.tbl_id;
77+
return (
78+
<div style={ popupPanelResizableStyle}>
79+
{ renderTable(tableModel,popupId)}
80+
{ renderCloseAndHelpButtons(tblId,onColSelected,buttonText,popupId)}
81+
</div>
82+
);
83+
84+
}
85+
86+
/**
87+
* display the data into a tabular format
88+
* @param tableModel
89+
* @param popupId
90+
* @return table section
91+
*/
92+
function renderTable(tableModel,popupId) {
93+
94+
return (
95+
<div style={tableStyle}>
96+
<BasicTable
97+
key={popupId}
98+
tableModel={tableModel}
99+
/>
100+
</div>
101+
);
102+
103+
}
104+
105+
function renderCloseAndHelpButtons(tblId,onColSelected,buttonText,popupId) {
106+
107+
return(
108+
<div>
109+
<div style={closeButtonStyle}>
110+
< CompleteButton
111+
text={buttonText}
112+
onSuccess={()=>setXYColumns(tblId,onColSelected)}
113+
dialogId={popupId}
114+
/>
115+
</div>
116+
{/* comment out the help button for now
117+
<div style={helpIdStyle}>
118+
<HelpIcon helpid={'visualization.setxyplot'}/>
119+
</div>
120+
*/}
121+
</div>
122+
);
123+
}
124+
125+
function setXYColumns(tblId,onColSelected) {
126+
const tableModel = getTblById(tblId);
127+
var hlRow = tableModel.highlightedRow || 0;
128+
const selectedColName = tableModel.tableData.data[hlRow][0];
129+
    onColSelected(selectedColName);
130+
131+
}
132+
133+
function getHlRow(currentVal,colNames) {
134+
for(var i = 0; i < colNames.length; i++) {
135+
if (colNames[i] === currentVal) {
136+
return i;
137+
}
138+
}
139+
}

‎src/firefly/js/visualize/ColValuesStatistics.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
11
export default class ColValuesStatistics{
2-
constructor(name, descr, unit, min, max, numpoints) {
2+
constructor(name, descr, unit, min, max, numpoints,type) {
33
this.name = name;
44
this.descr = descr;
55
this.unit = unit;
66
this.min = Number(min);
77
this.max = Number(max);
88
this.numpoints = Number(numpoints);
9+
this.type = type;
910
}
1011
};

‎src/firefly/js/visualize/TableStatsCntlr.js

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import {flux} from '../Firefly.js';
22

3-
import {has, omit} from 'lodash';
3+
import {get, has, omit} from 'lodash';
44

55
import {updateSet, updateMerge} from '../util/WebUtil.js';
66
import ColValuesStatistics from './ColValuesStatistics.js';
@@ -113,15 +113,23 @@ function fetchTblStats(dispatch, activeTableServerRequest) {
113113
const sreq = Object.assign({}, omit(activeTableServerRequest, ['tbl_id', 'META_INFO']),
114114
{'startIdx': 0, 'pageSize': 1000000});
115115

116-
const req = TableUtil.makeTblRequest('StatisticsProcessor', null,
117-
{ searchRequest: JSON.stringify(sreq) },
118-
'tblstats-'+tbl_id);
116+
const req = TableUtil.makeTblRequest('StatisticsProcessor', `Statistics for ${tbl_id}`,
117+
{ searchRequest: JSON.stringify(sreq) },
118+
{'startIdx': 0, 'pageSize': 1000});
119119

120120
TableUtil.doFetchTable(req).then(
121121
(tableModel) => {
122122
if (tableModel.tableData && tableModel.tableData.data) {
123+
const columns = get(TableUtil.getTblById(tbl_id), 'tableData.columns', []);
123124
const colStats = tableModel.tableData.data.reduce((colstats, arow) => {
124-
colstats.push(new ColValuesStatistics(...arow));
125+
const r = new ColValuesStatistics(...arow);
126+
const col = columns.find((c)=>{return c.name=== r.name;});
127+
if (col) {
128+
r.unit = col.units && col.units !== 'null' ? col.units : '';
129+
r.descr = col.desc ? col.desc: '';
130+
r.type = col.type ? col.type : '';
131+
}
132+
colstats.push(r);
125133
return colstats;
126134
}, []);
127135
dispatch(updateTblStats(

0 commit comments

Comments
 (0)