Skip to content

Commit

Permalink
Fix #2856 Legend action plugin (#2857)
Browse files Browse the repository at this point in the history
  • Loading branch information
allyoucanmap authored and offtherailz committed May 7, 2018
1 parent e5d304e commit af77da7
Show file tree
Hide file tree
Showing 31 changed files with 1,238 additions and 97 deletions.
6 changes: 6 additions & 0 deletions docma-config.json
Original file line number Diff line number Diff line change
Expand Up @@ -132,6 +132,8 @@
"web/client/components/misc/toolbar/Toolbar.jsx",
"web/client/components/misc/EmptyView.jsx",
"web/client/components/misc/ResizableModal.jsx",
"web/client/components/misc/Slider.jsx",
"web/client/components/TOC/FloatingLegend.jsx",
"web/client/components/TOC/TOCItemsSettings.jsx",
"web/client/components/TOC/fragments/settings/FeatureInfo.jsx",
"web/client/components/TOC/fragments/settings/FeatureInfoEditor.jsx",
Expand All @@ -140,6 +142,7 @@
"web/client/actions/controls.js",
"web/client/actions/fullscreen.js",
"web/client/actions/globeswitcher.js",
"web/client/actions/floatinglegend.js",
"web/client/actions/maplayout.js",
"web/client/actions/maps.js",
"web/client/actions/maptype.js",
Expand All @@ -148,6 +151,7 @@

"web/client/selectors/index.jsdoc",
"web/client/selectors/featuregrid.js",
"web/client/selectors/floatinglegend.js",
"web/client/selectors/map.js",
"web/client/selectors/mapinfo.js",
"web/client/selectors/maplayout.js",
Expand All @@ -158,6 +162,7 @@
"web/client/reducers/controls.js",
"web/client/reducers/featuregrid.js",
"web/client/reducers/globeswitcher.js",
"web/client/reducers/floatinglegend.js",
"web/client/reducers/maps.js",
"web/client/reducers/maptype.js",
"web/client/reducers/notifications.js",
Expand Down Expand Up @@ -205,6 +210,7 @@
"web/client/plugins/MeasureResults.jsx",
"web/client/plugins/FullScreen.jsx",
"web/client/plugins/Identify.jsx",
"web/client/plugins/FloatingLegend.jsx",
"web/client/plugins/Locate.jsx",
"web/client/plugins/Login.jsx",
"web/client/plugins/MousePosition.jsx",
Expand Down
32 changes: 32 additions & 0 deletions web/client/actions/__tests__/floatinglegend-test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
/*
* Copyright 2018, GeoSolutions Sas.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree.
*/

const expect = require('expect');
const {
RESIZE_LEGEND,
EXPAND_LEGEND,
resizeLegend,
expandLegend
} = require('../floatinglegend');

describe('Test floatinglegend actions', () => {
it('resizeLegend', () => {
const size = {height: 100};
const retval = resizeLegend(size);
expect(retval).toExist();
expect(retval.type).toBe(RESIZE_LEGEND);
expect(retval.size).toBe(size);
});
it('expandLegend', () => {
const expanded = true;
const retval = expandLegend(expanded);
expect(retval).toExist();
expect(retval.type).toEqual(EXPAND_LEGEND);
expect(retval.expanded).toEqual(expanded);
});
});
44 changes: 44 additions & 0 deletions web/client/actions/floatinglegend.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
/*
* Copyright 2018, GeoSolutions Sas.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree.
*/

const RESIZE_LEGEND = 'FLOATINGLEGEND:RESIZE_LEGEND';
const EXPAND_LEGEND = 'FLOATINGLEGEND:EXPAND_LEGEND';
/**
* resizeLegend action, type `RESIZE_LEGEND`
* @memberof actions.floatinglegend
* @param {object} size size of legend {width: 0, height: 0}
* @return {action} type `RESIZE_LEGEND` with size
*/
function resizeLegend(size) {
return {
type: RESIZE_LEGEND,
size
};
}
/**
* expandLegend action, type `EXPAND_LEGEND`
* @memberof actions.floatinglegend
* @param {boolean} expanded expanded state of legend action
* @return {action} type `EXPAND_LEGEND` with expanded
*/
function expandLegend(expanded) {
return {
type: EXPAND_LEGEND,
expanded
};
}
/**
* Actions for floatinglegend.
* @name actions.floatinglegend
*/
module.exports = {
RESIZE_LEGEND,
EXPAND_LEGEND,
resizeLegend,
expandLegend
};
41 changes: 19 additions & 22 deletions web/client/components/TOC/DefaultLayer.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ const VisibilityCheck = require('./fragments/VisibilityCheck');
const Title = require('./fragments/Title');
const WMSLegend = require('./fragments/WMSLegend');
const LayersTool = require('./fragments/LayersTool');
const Slider = require('react-nouislider');
const Slider = require('../misc/Slider');

class DefaultLayer extends React.Component {
static propTypes = {
Expand Down Expand Up @@ -67,38 +67,34 @@ class DefaultLayer extends React.Component {
return translation || layer.name;
};

renderCollapsible = () => {
renderOpacitySlider = () => {
const layerOpacity = this.props.node.opacity !== undefined ? Math.round(this.props.node.opacity * 100) : 100;
return this.props.activateOpacityTool ?
<Slider
disabled={!this.props.node.visibility}
start={[layerOpacity]}
range={{min: 0, max: 100}}
onChange={(opacity) => {
if (isArray(opacity) && opacity[0]) {
this.props.onUpdateNode(this.props.node.id, 'layers', { opacity: parseFloat(opacity[0].replace(' %', '')) / 100 });
}
}}/>
: null;
}

renderCollapsible = () => {
return (
<div key="legend" position="collapsible" className="collapsible-toc">
<Grid fluid>
{this.props.showFullTitleOnExpand ? <Row><Col xs={12} className="toc-full-title">{this.getTitle(this.props.node)}</Col></Row> : null}
{this.props.activateOpacityTool ?
<Row>

<Col xs={12} className="mapstore-slider with-tooltip">
<Slider start={[layerOpacity]}
disabled={!this.props.node.visibility}
range={{ min: 0, max: 100 }}
tooltips
format={{
from: value => Math.round(value),
to: value => Math.round(value) + ' %'
}}
onChange={(opacity) => {
if (isArray(opacity) && opacity[0]) {
this.props.onUpdateNode(this.props.node.id, 'layers', { opacity: parseFloat(opacity[0].replace(' %', '')) / 100 });
}
}} />
</Col>
</Row> : null}
{this.props.activateLegendTool ?
<Row>
<Col xs={12}>
<WMSLegend node={this.props.node} currentZoomLvl={this.props.currentZoomLvl} scales={this.props.scales} {...this.props.legendOptions} />
</Col>
</Row> : null}
</Grid>
{this.renderOpacitySlider()}
</div>);
};

Expand Down Expand Up @@ -131,7 +127,7 @@ class DefaultLayer extends React.Component {
}

renderNode = (grab, hide, selected, error, warning, other) => {
const isEmpty = !this.props.activateLegendTool && !this.props.activateOpacityTool;
const isEmpty = !this.props.activateLegendTool && !this.props.showFullTitleOnExpand;
return (
<Node className={'toc-default-layer' + hide + selected + error + warning} sortableStyle={this.props.sortableStyle} style={this.props.style} type="layer" {...other}>
<div className="toc-default-layer-head">
Expand All @@ -140,6 +136,7 @@ class DefaultLayer extends React.Component {
<Title tooltip={this.props.titleTooltip} filterText={this.props.filterText} node={this.props.node} currentLocale={this.props.currentLocale} onClick={this.props.onSelect} onContextMenu={this.props.onContextMenu} />
{this.props.node.loading ? <div className="toc-inline-loader"></div> : this.renderToolsLegend(isEmpty)}
</div>
{!this.props.activateOpacityTool || this.props.node.expanded || !this.props.node.visibility || this.props.node.loadingError === 'Error' ? null : this.renderOpacitySlider()}
{isEmpty ? null : this.renderCollapsible()}
</Node>
);
Expand Down
Loading

0 comments on commit af77da7

Please sign in to comment.