Commit bee467b1 authored by Nina Willems's avatar Nina Willems

[client/timeserie] deselect norm on plot

parent 82e285b4
......@@ -14,6 +14,7 @@ import { getApiUrl, getLang } from 'sdi/app';
import { nameToString } from 'sdi/components/button/names';
export const renderDeselectButton = makeIcon('cancel', 3, 'times');
export const renderSelectButton = makeIcon('reset', 2, 'refresh');
// Home - Index button
const renderButtonIndex = makeIcon('navigate', 2, 'home');
......
......@@ -9,6 +9,7 @@ import {
getSelectedStationIndex,
// getSelectedStationList,
getTimeserieBetweenDates,
getSelectedNorms,
// getFeatureFromSelection,
// getSelectedStationList
} from '../../queries/timeserie';
......@@ -17,6 +18,8 @@ import {
clearHighligthParameter,
highligthParameter,
setSelectedStationIndex,
deselectNorm,
selectNorm,
// setSelectedStationIndex,
// setTableMode
} from '../../events/timeserie';
......@@ -26,6 +29,7 @@ import debug = require('debug');
import { PlotNorm } from '../plot';
import { StationSelection } from 'timeserie/src/types';
import { stationString } from 'timeserie/src/queries/table';
import { renderDeselectButton, renderSelectButton } from '../button';
// import { StationSelection } from 'timeserie/src/types';
// import { getFeaturePropOption } from 'sdi/util';
// import { renderButtonTableModeParameters } from '../button';
......@@ -51,14 +55,23 @@ const renderStats = (param: Parameter) =>
}
});
const renderNormItem = ({ name, value }: PlotNorm) =>
const normClassName = (norm: PlotNorm, param: Parameter) =>
getSelectedNorms()
.getOrElse([])
.find(sn => sn.paramId === param.id && sn.norm.name === norm.name && sn.norm.value === norm.value)
? 'legend-item__norms selected'
: 'legend-item__norms';
const renderNormItem = (norm: PlotNorm, param: Parameter) =>
DIV(
{ className: 'legend-item__norms' },
{ className: normClassName(norm, param) },
DIV(
{ className: 'norm__item' },
DIV({ className: 'norm__label' }, name),
DIV({ className: 'norm__value' }, value)
)
DIV({ className: 'norm__label' }, norm.name),
DIV({ className: 'norm__value' }, norm.value)
),
renderDeselectButton(() => deselectNorm(param.id, norm)), // TODO: remove this 2 buttons to use an "onclick"
renderSelectButton(() => selectNorm(param.id, norm))
);
const renderNameLegendItem = (param: Parameter) =>
......@@ -87,7 +100,7 @@ const renderLegendItemInner = (param: Parameter, i: number) =>
renderNameLegendItem(param)
),
renderStats(param),
...getPlotNorms(param.id).map(renderNormItem)
...getPlotNorms(param.id).map(n => renderNormItem(n, param))
);
const renderEmptyLegendItemInner = () =>
......
......@@ -12,6 +12,7 @@ import {
getHighligthParameter,
getPlotData,
getLevel,
getSelectedNorms,
} from '../queries/timeserie';
import {
selectPoint,
......@@ -622,7 +623,14 @@ const chartNorms = (
norms: PlotNorm[],
xWidth: number
) => {
const normsDrawing = norms.map((n) =>
const filteredNorms = norms.filter(n =>
getSelectedNorms()
.map(selectedNorms =>
(selectedNorms.find(sn => sn.norm.name == n.name && sn.norm.value === n.value) !== undefined))
.getOrElse(false)
)
const normsDrawing = filteredNorms.map((n) =>
group([
line(
0,
......@@ -670,9 +678,10 @@ const getChartInfo = (
// xWidth: number
) => {
let timeserie = dataElem.ts;
const selectedNorms = getSelectedNorms().getOrElse([]).filter(sn => sn.paramId === dataElem.identifier);
const yValues = timeserie.map((point) => point.value * point.factor);
const minY = getMin(yValues);
const maxY = getMax(yValues.concat(dataElem.norms.map((n) => n.value)));
const maxY = getMax(yValues.concat(selectedNorms.map((n) => n.norm.value)));
const divider = subdivision(maxY - minY);
const minYFloor = Math.floor(minY / divider) * divider;
const maxYCeil = Math.ceil(maxY / divider) * divider;
......
......@@ -2,11 +2,11 @@ import * as debug from 'debug';
import { index } from 'fp-ts/lib/Array';
import { Router, Path } from 'sdi/router';
import { setLayout } from './app';
import { selectParameter, selectWindowStart, selectWindowEnd, lidToParameterType, setLevel, selectStations } from './timeserie';
import { selectParameter, selectWindowStart, selectWindowEnd, lidToParameterType, setLevel, selectStations, selectNorm } from './timeserie';
import * as io from 'io-ts';
import { scopeOption } from 'sdi/lib';
import { Option, fromEither, none, fromNullable, some } from 'fp-ts/lib/Option';
import { getSelectedKind, getSelectedParameterList, getWindowStart, getWindowEnd, getSelectedStationListId } from '../queries/timeserie';
import { getSelectedKind, getSelectedParameterList, getWindowStart, getWindowEnd, getSelectedStationListId, getPlotNorms } from '../queries/timeserie';
import { ParameterType } from '../types';
import { getLayout } from '../queries/app';
import { FeaturePath } from 'sdi/map';
......@@ -216,8 +216,23 @@ route('plot', (route) => {
route.map(({ level, config }) => {
const selectedStations: FeaturePath[] = [];
setLevel(level);
config.p.map(param => fromNullable(config.k).chain(kind => lidToParameterType(kind).map(k => selectParameter(k, param))));
config.s.map(station => fromNullable(config.k).chain(kind => lidToParameterType(kind).map(k => selectedStations.push({ layerId: k, featureId: station }))));
config.p.map(param =>
fromNullable(config.k)
.chain(kind => lidToParameterType(kind)
.map(k => {
selectParameter(k, param)
getPlotNorms(param).map(n => selectNorm(param, n))
})
)
);
config.s.map(station =>
fromNullable(config.k)
.chain(kind => lidToParameterType(kind)
.map(k =>
selectedStations.push({ layerId: k, featureId: station })
)
)
);
fromNullable(config.w)
.map((w) => {
selectWindowStart(new Date(w[0]), w[1]);
......
......@@ -169,6 +169,7 @@ export const selectStations = (
.map(kind => getSelectedParameter().map((p) => {
if (kind !== p.kind) {
clearParameterSelection();
clearNormSelection();
clearSelectedGroup();
}
}));
......@@ -199,11 +200,13 @@ export const clearPointSelection = () => assign('timeserie/point/select', null);
export const selectNorm = (paramId: number, norm: PlotNorm) =>
dispatch('timeserie/norm/select',
ss => ss.filter(s => s.paramId !== paramId || s.norm !== norm).concat({ paramId, norm }));
ss => ss.filter(s => s.paramId !== paramId || s.norm.name !== norm.name || s.norm.value !== norm.value).concat({ paramId, norm }));
export const deselectNorm = (paramId: number, norm: PlotNorm) =>
dispatch('timeserie/norm/select',
ss => ss.filter(s => s.paramId !== paramId || s.norm !== norm));
ss => ss.filter(s => s.paramId !== paramId || s.norm.name !== norm.name || s.norm.value !== norm.value));
export const clearNormSelection = () => {
assign('timeserie/norm/select', []);
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment