diff --git a/src/components/Timeline.jsx b/src/components/Timeline.jsx index dd21199..77bd3dd 100644 --- a/src/components/Timeline.jsx +++ b/src/components/Timeline.jsx @@ -46,10 +46,14 @@ class Timeline extends React.Component { componentWillReceiveProps(nextProps) { if (hash(nextProps) !== hash(this.props)) { - console.log(nextProps.domain.categories) this.setState({ timerange: nextProps.app.timerange, - scaleX: this.makeScaleX(), + scaleX: this.makeScaleX() + }); + } + + if (hash(nextProps.domain.categories) !== hash(this.props.domain.categories)) { + this.setState({ scaleY: this.makeScaleY(nextProps.domain.categories) }); } @@ -91,7 +95,6 @@ class Timeline extends React.Component { * @param {object} eventPoint: regular eventPoint data */ getEventY(eventPoint) { - console.log(eventPoint.category, this.state.scaleY(eventPoint.category)) return this.state.scaleY(eventPoint.category); } @@ -145,9 +148,9 @@ class Timeline extends React.Component { } /** - * Shift time range by moving forward or backwards - * WITHOUT updating the store - * @param {String} direction: 'forward' / 'backwards' + * Change display of time range + * WITHOUT updating the store, or data shown. + * Used for updates in the middle of a transition, for performance purposes */ onSoftTimeRangeUpdate(timerange) { this.setState({ timerange }); diff --git a/src/components/TimelineCategories.jsx b/src/components/TimelineCategories.jsx index c84fcb4..d1cd15f 100644 --- a/src/components/TimelineCategories.jsx +++ b/src/components/TimelineCategories.jsx @@ -33,7 +33,7 @@ class TimelineCategories extends React.Component { return ( - {category.category} + {category.category} ) } diff --git a/src/components/TimelineMarkers.jsx b/src/components/TimelineMarkers.jsx index 18a32a2..d79ac88 100644 --- a/src/components/TimelineMarkers.jsx +++ b/src/components/TimelineMarkers.jsx @@ -10,7 +10,7 @@ class TimelineMarkers extends React.Component { cy={0} style={{ 'transform': `translate(${this.props.getEventX(event)}px, ${this.props.getEventY(event)}px)`, - 'transition': `transform ${this.props.transitionDuration}s ease`, + 'transition': `transform ${this.props.transitionDuration / 1000}s ease`, 'opacity': 0.9 }} r="10" diff --git a/src/store/initial.js b/src/store/initial.js index c18baa0..8db1642 100644 --- a/src/store/initial.js +++ b/src/store/initial.js @@ -55,27 +55,27 @@ const initial = { language: 'en-US', mapAnchor: process.env.MAP_ANCHOR, zoomLevels: [{ - label: '3 años', + label: '3 years', duration: 1576800, active: false }, { - label: '3 meses', + label: '3 months', duration: 129600, active: false }, { - label: '3 días', + label: '3 days', duration: 4320, active: false }, { - label: '12 horas', + label: '12 hours', duration: 720, active: false }, { - label: '2 horas', + label: '2 hours', duration: 120, active: false },