Skip to content

DM-5163 support for expanded view. #30

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
loitly merged 2 commits into from
Mar 4, 2016
Merged

DM-5163 support for expanded view. #30

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
a6fbf20
DM-5163 support for expanded view.
loitly Mar 3, 2016
02b7629
DM-5163 support for expanded view... response to comments
loitly Mar 3, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 11 additions & 6 deletions src/fftools/js/fftools.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,14 @@

import React from 'react';
import ReactDOM from 'react-dom';
import {get} from 'lodash';

import {flux, firefly} from 'firefly/Firefly.js';
import AppDataCntlr, {dispatchUpdateLayout} from 'firefly/core/AppDataCntlr.js';
import AppDataCntlr, {dispatchUpdateLayout, LO_XPD_MODE} from 'firefly/core/AppDataCntlr.js';
import Menu from 'firefly/ui/Menu.jsx';
import Banner from 'firefly/ui/Banner.jsx';
import SearchPanel from 'firefly/ui/SearchPanel.jsx';
import ResultsPanel from 'firefly/ui/ResultsPanel.jsx';
import {ResultsPanel} from 'firefly/ui/ResultsPanel.jsx';
import FormPanel from 'firefly/ui/FormPanel.jsx';
import TestImagePanel from 'firefly/visualize/ui/TestImagePanel.jsx';
import {ExpandedModeDisplay} from 'firefly/visualize/iv/ExpandedModeDisplay.jsx';
Expand Down Expand Up @@ -61,6 +63,7 @@ const App = React.createClass({
appData : React.PropTypes.object.isRequired,
title : React.PropTypes.string,
table : React.PropTypes.object,
expandedMode : React.PropTypes.string,
activeTbl : React.PropTypes.object,
tblStatsData : React.PropTypes.object,
xyPlotData : React.PropTypes.object,
Expand Down Expand Up @@ -90,7 +93,7 @@ const App = React.createClass({


render() {
var {appData, title, table} = this.props;
var {appData, title, table, expandedMode} = this.props;

const tblId = table ? table.tbl_id : undefined;

Expand Down Expand Up @@ -146,12 +149,13 @@ const App = React.createClass({
</header>
<main>
<ResultsPanel title={title}
imagePlot = {appData.layoutInfo.mode==='expand' ?
imagePlot = {expandedMode===LO_XPD_MODE.images.mode.expanded ?
<ExpandedModeDisplay key='results-plots-expanded' forceExpandedMode={true}/> :
<TestImagePanel key='results-plots'/> }
visToolbar = {<VisToolbar/>}
xyPlot = {<ChartsTableViewPanel key='results-xyplots' tblId={tblId}/>
}
tables = {tblId && <TablePanel key='results-tables' tbl_id={tblId} selectable={true}/> }
tables = {tblId && <TablePanel key='results-tables' tbl_id={tblId}
expandedMode={expandedMode===LO_XPD_MODE.tables.mode.expanded} selectable={true}/> }
layoutInfo = { appData.layoutInfo }
/>
</main>
Expand All @@ -166,7 +170,8 @@ function connector(state) {
return {
appData: state[AppDataCntlr.APP_DATA_PATH],
title: 'FFTools entry point',
table : TblUtil.findTblById(activeTblId)
table : TblUtil.findTblById(activeTblId),
expandedMode : get(state, [AppDataCntlr.APP_DATA_PATH,'layoutInfo','mode','expanded'])
};
}
const container = flux.createSmartComponent(connector, App);
Expand Down
26 changes: 19 additions & 7 deletions src/firefly/js/core/AppDataCntlr.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,19 @@ const REMOVE_PREF = `${APP_DATA_PATH}.removePreference`;
//const HELP_LOAD = `${APP_DATA_PATH}.helpLoad`;
const HELP_LOAD = `overviewHelp`; //note: consistent with AppMenu.prop

export const LO_STD_MODE = {
triview: {mode: {standard: 'tri-view'}},
image_xyplot: {mode: {standard: 'image-xyplot'}},
image_table: {mode: {standard: 'image-table'}},
xyplot_table: {mode: {standard: 'xyplot-table'}}
};
export const LO_XPD_MODE = {
tables: {mode: {expanded: 'tables'}},
images: {mode: {expanded: 'images'}},
xy_plots: {mode: {expanded: 'xyPlots'}},
none: {mode: {expanded: undefined}}
};

/*---------------------------- CREATORS ----------------------------*/

const showDialog= function(dialogId,ownerId=undefined) {
Expand Down Expand Up @@ -249,10 +262,10 @@ function reducer(state=getInitState(), action={}) {

history.add(state, action);

var newState = addDataReducer(state, action);
var newState = appDataReducer(state, action);

var menu = menuRenderer.reducer(newState.menu, action);
var layoutInfo = layoutReducer.reducer(newState.layoutInfo, action, menu);
var layoutInfo = layoutReducer.reducer(newState.layoutInfo, action);

return mergeAll(state, newState, {menu, layoutInfo});
}
Expand All @@ -265,7 +278,7 @@ function mergeAll(orig, newval, updates) {
return hasChanged ? Object.assign({}, newval, updates) : orig;
}

function addDataReducer(state, action={}) {
function appDataReducer(state, action={}) {
switch (action.type) {
case APP_LOAD :
return getInitState();
Expand Down Expand Up @@ -341,14 +354,13 @@ function dispatchRemovePreference(name) {
* i.e. search panel, results panel...
* @param search boolean. show the search panel. defaults to false.
* @param results boolean. show the results panel. defaults to true.
* @param mode enum, one of ["auto", "tri", "sbs", "tb"]. defaults to "auto".
* @param views array of enum ["tables", "images", "xyPlots"]. Used in conjunction with mode to define what to show.
* @param mode see constant LO_STD_MODE and LO_XPD_MODE declaration from above
* @param hasTables boolean. Table data available.
* @param hasImages boolean. Image data available.
* @param hasXyPlots boolean. XY Plot data available.
*/
export function dispatchUpdateLayout({search, results, mode, views, hasTables, hasImages, hasXyPlots}) {
flux.process({type: UPDATE_LAYOUT, payload: pickBy({search, results, mode, views, hasTables, hasImages, hasXyPlots}, (v)=>(!isUndefined(v)))});
export function dispatchUpdateLayout({search, results, mode, hasTables, hasImages, hasXyPlots}) {
flux.process({type: UPDATE_LAYOUT, payload: pickBy({search, results, mode, hasTables, hasImages, hasXyPlots}, (v)=>(!isUndefined(v)))});
}


Expand Down
20 changes: 7 additions & 13 deletions src/firefly/js/core/reducers/LayoutReducer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,30 +2,24 @@
* License information at https://github.com/Caltech-IPAC/firefly/blob/master/License.txt
*/

import {pick, isEqual} from 'lodash';
import {get} from 'lodash';

import cntlr from '../AppDataCntlr.js';
import {smartMerge} from '../../tables/TableUtil.js';


function reducer(state={}, action={}, menu) {
var nState = state;
function reducer(state={}, action={}) {

switch (action.type) {
case cntlr.SHOW_SEARCH :
const nSearch = action.payload && action.payload.search;
if (nSearch !== state.search) {
nState = Object.assign({}, state, {search: nSearch});
}
return nState;
const nState = {search: get(action, 'payload.search')};
return smartMerge(state, nState);

case cntlr.UPDATE_LAYOUT :
if (! isEqual(pick(state, Object.keys(action.payload)), action.payload) ) {
nState = Object.assign(state, action.payload);
}
return nState;
return smartMerge(state, action.payload);

default:
return nState;
return state;
}

}
Expand Down
10 changes: 5 additions & 5 deletions src/firefly/js/tables/ui/BasicTable.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ import {debounce, get, isEmpty, pick} from 'lodash';
import {SelectInfo} from '../SelectInfo.js';
import {FilterInfo, FILTER_TTIPS} from '../FilterInfo.js';
import {InputField} from '../../ui/InputField.jsx';
import {SORT_ASC, SORT_DESC, UNSORTED, SortInfo} from '../SortInfo';
import {SORT_ASC, UNSORTED, SortInfo} from '../SortInfo';
import {tableToText} from '../TableUtil.js';

import './TablePanel.css';
Expand Down Expand Up @@ -46,7 +46,7 @@ export class BasicTable extends React.Component {
}

onColumnResizeEndCallback(newColumnWidth, columnKey) {
var columnWidths = Object.assign(this.state.columnWidths, {[columnKey]: newColumnWidth});
var columnWidths = Object.assign({}, this.state.columnWidths, {[columnKey]: newColumnWidth});
this.setState({columnWidths});
}

Expand Down Expand Up @@ -187,7 +187,7 @@ const HeaderCell = ({col, showUnits, showFilters, filterInfoCls, sortInfoCls, on
onChange = {(v) => onFilter(v)}
actOn={['blur','enter']}
showWarning={false}
width={'100%'}
width='100%'
/>
}
</div>
Expand Down Expand Up @@ -245,7 +245,7 @@ function makeColumns ({columns, columnWidths, data, selectable, showUnits, showF
};

var cbox = <Column
key="selectable-checkbox"
key='selectable-checkbox'
columnKey='selectable-checkbox'
header={headerCB}
cell={cellCB}
Expand All @@ -256,5 +256,5 @@ function makeColumns ({columns, columnWidths, data, selectable, showUnits, showF
colsEl.splice(0, 0, cbox);
}
return colsEl;
};
}

2 changes: 1 addition & 1 deletion src/firefly/js/tables/ui/TablePanel.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,8 @@
}

.TablePanel__wrapper {
flex: auto;
position: relative;
width: 100%;
background-color: #a5a5a5;
border: 1px solid #8c8c8c;
padding: 0 3px 3px 3px;
Expand Down
Loading