Skip to content
This repository has been archived by the owner on Aug 29, 2023. It is now read-only.

Commit

Permalink
some styling
Browse files Browse the repository at this point in the history
  • Loading branch information
@AliceBalfanz
AliceBalfanz committed Aug 13, 2020
1 parent f268a39 commit 97b30b1
Show file tree
Hide file tree
Showing 4 changed files with 106 additions and 89 deletions.
2 changes: 0 additions & 2 deletions src/renderer/containers/LayersPanel.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -207,15 +207,13 @@ class LayersPanel extends React.Component<ILayersPanelProps & DispatchProp<State
onClick={this.handleMoveLayerUpButtonClicked}
icon="arrow-up"
tooltipPosition={'top'}

/>
<ToolButton
tooltipContent="Move layer down"
disabled={!canMoveLayerDown}
onClick={this.handleMoveLayerDownButtonClicked}
icon="arrow-down"
tooltipPosition={'top'}

/>
<LayerSourcesDialog/>
</ButtonGroup>
Expand Down
2 changes: 1 addition & 1 deletion src/renderer/containers/OperationsPanel.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -148,7 +148,7 @@ class OperationsPanel extends React.Component<IOperationsPanelProps & DispatchPr
const actionComponent = (
<ButtonGroup>
<ToolButton
tooltipContent={<span>Add a new operation step to<br />the workspace's workflow</span>}
tooltipContent={<span>Add a new operation step to<br/>the workspace's workflow</span>}
intent={Intent.PRIMARY}
onClick={this.handleAddOperationStepButtonClicked}
disabled={!canAddStepOperation}
Expand Down
63 changes: 33 additions & 30 deletions src/renderer/containers/StylesPanel.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { connect, DispatchProp } from 'react-redux';
import {connect, DispatchProp} from 'react-redux';
import {
ColorMapCategoryState,
ColorMapState,
Expand All @@ -15,8 +15,8 @@ import {
VectorLayerState
} from '../state';
import * as React from 'react';
import { NO_ENTITY_FOR_STYLE, NO_LAYER_FOR_STYLE } from '../messages';
import { SubPanelHeader } from '../components/SubPanelHeader';
import {NO_ENTITY_FOR_STYLE, NO_LAYER_FOR_STYLE} from '../messages';
import {SubPanelHeader} from '../components/SubPanelHeader';
import {
AnchorButton,
Button,
Expand All @@ -38,18 +38,18 @@ import {
} from '@blueprintjs/core';
import * as actions from '../actions';
import * as selectors from '../selectors';
import { NumericRangeField } from '../components/field/NumericRangeField';
import { FieldValue } from '../components/field/Field';
import { ListBox, ListBoxSelectionMode } from '../components/ListBox';
import { TextField } from '../components/field/TextField';
import {NumericRangeField} from '../components/field/NumericRangeField';
import {FieldValue} from '../components/field/Field';
import {ListBox, ListBoxSelectionMode} from '../components/ListBox';
import {TextField} from '../components/field/TextField';
import SketchPicker from 'react-color/lib/components/sketch/Sketch';
import { ColorState } from 'react-color';
import { SimpleStyle } from '../../common/geojson-simple-style';
import { NumericField } from '../components/field/NumericField';
import { ViewState } from '../components/ViewState';
import {ColorState} from 'react-color';
import {SimpleStyle} from '../../common/geojson-simple-style';
import {NumericField} from '../components/field/NumericField';
import {ViewState} from '../components/ViewState';
import * as Cesium from 'cesium';
import { getLayerDisplayName } from '../state-util';
import { ToolButton } from '../components/ToolButton';
import {getLayerDisplayName} from '../state-util';
import {ToolButton} from '../components/ToolButton';

function getDisplayFractionDigits(min: number, max: number) {
const n = Math.round(Math.log10(max - min));
Expand Down Expand Up @@ -230,12 +230,15 @@ class StylesPanel extends React.Component<IStylesPanelProps & DispatchProp<State
onChange={this.handleChangedDisplayMinMax}
uncontrolled={true}
/>
<ToolButton tooltipContent="Compute valid min/max"
intent={Intent.PRIMARY}
icon="arrows-horizontal"
style={{flex: 'none', marginTop: '5px'}}
disabled={this.props.isComputingVariableStatistics}
onClick={this.handleUpdateDisplayStatistics}/>
<ToolButton
tooltipContent="Compute valid min/max"
intent={Intent.PRIMARY}
icon="arrows-horizontal"
tooltipPosition={'top'}
style={{flex: 'none', marginTop: '5px'}}
disabled={this.props.isComputingVariableStatistics}
onClick={this.handleUpdateDisplayStatistics}
/>
</div>
</Label>
<div style={StylesPanel.SLIDER_DIV_STYLE_15}>
Expand Down Expand Up @@ -632,13 +635,13 @@ class StylesPanel extends React.Component<IStylesPanelProps & DispatchProp<State
return;
}
this.props.dispatch(actions.getWorkspaceVariableStatistics(resource.name, variable.name, imageLayer.varIndex,
(statistics) => {
return actions.updateLayer(this.props.activeView.id, imageLayer, {
displayMin: statistics.min,
displayMax: statistics.max,
statistics
});
}
(statistics) => {
return actions.updateLayer(this.props.activeView.id, imageLayer, {
displayMin: statistics.min,
displayMax: statistics.max,
statistics
});
}
) as any);
}

Expand Down Expand Up @@ -710,12 +713,12 @@ class StylesPanel extends React.Component<IStylesPanelProps & DispatchProp<State
//style = {...this.props.vectorStyle, ...style};
if (this.props.styleContext === STYLE_CONTEXT_ENTITY) {
this.props.dispatch(actions.updateEntityStyle(this.props.activeView,
this.props.selectedEntity,
style) as any);
this.props.selectedEntity,
style) as any);
} else {
this.props.dispatch(actions.updateLayerStyle(this.props.activeView.id,
this.props.selectedVectorLayer.id,
style));
this.props.selectedVectorLayer.id,
style));
}
}
}
Expand Down
128 changes: 72 additions & 56 deletions src/renderer/containers/WorkspacePanel.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import * as React from 'react';
import { CSSProperties } from 'react';
import { connect, DispatchProp } from 'react-redux';
import {CSSProperties} from 'react';
import {connect, DispatchProp} from 'react-redux';
import {
ButtonGroup,
Icon,
Expand All @@ -13,12 +13,12 @@ import {
Tabs,
Tooltip
} from '@blueprintjs/core';
import { Cell, Column, Table, TruncatedFormat, TruncatedPopoverMode } from '@blueprintjs/table';
import { ListBox } from '../components/ListBox';
import { LabelWithType } from '../components/LabelWithType';
import {Cell, Column, Table, TruncatedFormat, TruncatedPopoverMode} from '@blueprintjs/table';
import {ListBox} from '../components/ListBox';
import {LabelWithType} from '../components/LabelWithType';
import WorkflowStepPropertiesDialog from './WorkflowStepPropertiesDialog';
import OperationStepDialog from './OperationStepDialog';
import { ContentWithDetailsPanel } from '../components/ContentWithDetailsPanel';
import {ContentWithDetailsPanel} from '../components/ContentWithDetailsPanel';
import * as assert from '../../common/assert';
import * as actions from '../actions'
import * as selectors from '../selectors'
Expand All @@ -29,15 +29,16 @@ import {
ResourceState,
State,
WorkflowPortState,
WorkflowStepState, WorkspacePanelMode,
WorkflowStepState,
WorkspacePanelMode,
WorkspaceState
} from '../state';
import { ScrollablePanelContent } from '../components/ScrollableContent';
import { NO_WORKFLOW_STEPS, NO_WORKSPACE, NO_WORKSPACE_RESOURCES } from '../messages';
import { findOperation, isDataFrameResource, isFigureResource } from '../state-util';
import { isBoolean, isDefined, isString, isUndefined, isUndefinedOrNull } from '../../common/types';
import { ToolButton } from '../components/ToolButton';
import { EDIT_OPERATION_STEP_DIALOG_ID } from './operation-step-dialog-ids';
import {ScrollablePanelContent} from '../components/ScrollableContent';
import {NO_WORKFLOW_STEPS, NO_WORKSPACE, NO_WORKSPACE_RESOURCES} from '../messages';
import {findOperation, isDataFrameResource, isFigureResource} from '../state-util';
import {isBoolean, isDefined, isString, isUndefined, isUndefinedOrNull} from '../../common/types';
import {ToolButton} from '../components/ToolButton';
import {EDIT_OPERATION_STEP_DIALOG_ID} from './operation-step-dialog-ids';

interface IWorkspacePanelProps {
workspace: WorkspaceState;
Expand Down Expand Up @@ -205,12 +206,12 @@ class WorkspacePanel extends React.PureComponent<IWorkspacePanelProps & Dispatch

private getEffectiveWorkflowStep() {
return this.props.workspacePanelMode === 'steps'
? this.props.selectedWorkflowStep : this.props.selectedResourceWorkflowStep;
? this.props.selectedWorkflowStep : this.props.selectedResourceWorkflowStep;
}

private getEffectiveResource() {
return this.props.workspacePanelMode === 'resources'
? this.props.selectedResource : this.props.selectedWorkflowStepResource;
? this.props.selectedResource : this.props.selectedWorkflowStepResource;
}

private getEffectiveResourceName() {
Expand Down Expand Up @@ -249,8 +250,8 @@ class WorkspacePanel extends React.PureComponent<IWorkspacePanelProps & Dispatch
assert.ok(resources);

const workspaceName = (workspace.isScratch || !workspace.baseDir)
? '<unnamed>'
: workspace.baseDir.split(/[\\/]/).pop();
? '<unnamed>'
: workspace.baseDir.split(/[\\/]/).pop();
const workspaceLabel = (
<Tooltip content={workspace.baseDir} position={PopoverPosition.AUTO_START}>
<strong>{workspaceName}</strong>
Expand All @@ -269,16 +270,21 @@ class WorkspacePanel extends React.PureComponent<IWorkspacePanelProps & Dispatch
);
}
const openItemButton = (
<ToolButton tooltipContent="Show workspace directory in file system"
onClick={this.handleOpenWorkspaceDirectoryClicked}
icon="folder-open"
<ToolButton
tooltipContent="Show workspace directory in file system"
onClick={this.handleOpenWorkspaceDirectoryClicked}
icon="folder-open"
tooltipPosition={'top'}
/>
);
const copyItemButton = (
<Popover position={PopoverPosition.LEFT}>
<ToolButton tooltipContent="Copy workflow"
disabled={!steps.length}
icon="clipboard"/>
<ToolButton
tooltipContent="Copy workflow"
disabled={!steps.length}
icon="clipboard"
tooltipPosition={'top'}
/>
<Menu>
<MenuItem onClick={this.handleCopyWorkflowAsPythonScript} text="Copy workflow as Python Script"/>
<MenuItem onClick={this.handleCopyWorkflowAsShellScript} text="Copy workflow as Shell Script"/>
Expand Down Expand Up @@ -320,42 +326,52 @@ class WorkspacePanel extends React.PureComponent<IWorkspacePanelProps & Dispatch
const canShowTableView = isDataFrameResource(resource);
return (
<ButtonGroup>
<ToolButton tooltipContent="Show figure"
disabled={!canShowFigure}
icon="eye-open"
tooltipPosition={'top'}
onClick={this.handleShowFigureButtonClicked}/>
<ToolButton tooltipContent="Show data in table"
disabled={!canShowTableView}
icon="th"
tooltipPosition={'top'}
onClick={this.handleShowResourceTableView}
<ToolButton
tooltipContent="Show figure"
disabled={!canShowFigure}
icon="eye-open"
tooltipPosition={'top'}
onClick={this.handleShowFigureButtonClicked}/>
<ToolButton
tooltipContent="Show data in table"
disabled={!canShowTableView}
icon="th"
tooltipPosition={'top'}
onClick={this.handleShowResourceTableView}
/>
<ToolButton
tooltipContent="Resource/step properties"
disabled={!resource}
icon="label"
tooltipPosition={'top'}
onClick={this.handleWorkflowStepPropertiesButtonClicked}
/>
<ToolButton
tooltipContent="Edit workflow step"
intent={Intent.PRIMARY}
disabled={!workflowStep}
icon="edit"
tooltipPosition={'top'}
onClick={this.handleEditOperationStepButtonClicked}
/>
<ToolButton
tooltipContent="Remove workflow step and its resource"
disabled={!workflowStep}
icon="remove"
tooltipPosition={'top'}
onClick={this.handleRemoveOperationStepButtonClicked}
/>
<ToolButton
tooltipContent="Clean workspace, remove all steps and resources"
disabled={!hasSteps}
icon="delete"
tooltipPosition={'top'}
onClick={this.handleCleanWorkflowButtonClicked}
/>
<ToolButton tooltipContent="Resource/step properties"
disabled={!resource}
icon="label"
tooltipPosition={'top'}
onClick={this.handleWorkflowStepPropertiesButtonClicked}/>
<ToolButton tooltipContent="Edit workflow step"
intent={Intent.PRIMARY}
disabled={!workflowStep}
icon="edit"
tooltipPosition={'top'}
onClick={this.handleEditOperationStepButtonClicked}/>
<ToolButton tooltipContent="Remove workflow step and its resource"
disabled={!workflowStep}
icon="remove"
tooltipPosition={'top'}
onClick={this.handleRemoveOperationStepButtonClicked}/>
<ToolButton tooltipContent="Clean workspace, remove all steps and resources"
disabled={!hasSteps}
icon="delete"
tooltipPosition={'top'}
onClick={this.handleCleanWorkflowButtonClicked}/>
{workflowStep ? <WorkflowStepPropertiesDialog selectedWorkflowStep={workflowStep}/> : null}
{isOperationStepSelected
? <OperationStepDialog id={EDIT_OPERATION_STEP_DIALOG_ID} operationStep={workflowStep}/>
: null}
? <OperationStepDialog id={EDIT_OPERATION_STEP_DIALOG_ID} operationStep={workflowStep}/>
: null}
</ButtonGroup>
);
}
Expand Down

0 comments on commit 97b30b1

Please sign in to comment.