bellingcat/ukraine-timemap
1
0
Fork 0
mirror of https://github.com/bellingcat/ukraine-timemap.git synced 2026-06-12 13:28:36 +03:00
Code Issues Packages Projects Releases Wiki Activity

Zoom to timeframe on timeline click

Browse Source
This commit is contained in:
Lachlan Kermode
2022-03-06 21:00:00 -05:00
parent 88a5d2b5b4
commit cb69b40ae2
2 changed files with 15 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/Layout.js
View File

@@ -107,6 +107,7 @@ class Dashboard extends React.Component {
delete std.sources;
Object.values(std).forEach((ev) => matchedEvents.push(ev));
}
this.props.actions.updateSelected(matchedEvents);
}

15
src/components/time/Timeline.js
View File

@@ -24,6 +24,7 @@ class Timeline extends React.Component {
this.getDatetimeX = this.getDatetimeX.bind(this);
this.getY = this.getY.bind(this);
this.onApplyZoom = this.onApplyZoom.bind(this);
this.onSelect = this.onSelect.bind(this);
this.svgRef = React.createRef();
this.state = {
isFolded: false,
@@ -339,6 +340,18 @@ class Timeline extends React.Component {
return [null, null];
}
onSelect(event) {
if (this.props.features.ZOOM_TO_TIMEFRAME_ON_TIMELINE_CLICK) {
const timeframe = Math.floor(
this.props.features.ZOOM_TO_TIMEFRAME_ON_TIMELINE_CLICK / 2
);
const start = d3.timeMinute.offset(event.datetime, -timeframe);
const end = d3.timeMinute.offset(event.datetime, timeframe);
this.props.methods.onUpdateTimerange([start, end]);
}
this.props.methods.onSelect(event);
}
render() {
const { isNarrative, app } = this.props;
let classes = `timeline-wrapper ${this.state.isFolded ? " folded" : ""}`;
@@ -440,7 +453,7 @@ class Timeline extends React.Component {
}}
getCategoryColor={this.props.methods.getCategoryColor}
transitionDuration={this.state.transitionDuration}
onSelect={this.props.methods.onSelect}
onSelect={this.onSelect}
dims={dims}
features={this.props.features}
setLoading={this.props.actions.setLoading}