From be78b253d072e0ecf24d57d8c7c0f36b8546b84e Mon Sep 17 00:00:00 2001
From: mbucknell <mbucknell@usgs.gov>
Date: Wed, 6 May 2020 08:41:04 -0500
Subject: [PATCH] Comment cleanup
---
.../daily-value-hydrograph/graph-brush.js | 5 ++++
.../selectors/legend-data.js | 2 +-
.../selectors/time-series-data.js | 26 +++++++++++--------
.../time-series-graph.js | 4 +--
.../components/hydrograph/time-series-data.js | 1 -
.../hydrograph/time-series-graph.js | 8 ++++++
.../scripts/components/hydrograph/tooltip.js | 2 --
assets/src/scripts/d3-rendering/legend.js | 4 +--
assets/src/scripts/index.spec.js | 22 ++++++++--------
9 files changed, 44 insertions(+), 30 deletions(-)
diff --git a/assets/src/scripts/components/daily-value-hydrograph/graph-brush.js b/assets/src/scripts/components/daily-value-hydrograph/graph-brush.js
index be6ca189f..d0d11ebe5 100644
--- a/assets/src/scripts/components/daily-value-hydrograph/graph-brush.js
+++ b/assets/src/scripts/components/daily-value-hydrograph/graph-brush.js
@@ -14,6 +14,11 @@ import {getCurrentTimeSeriesSegments} from './selectors/time-series-data';
import {drawDataSegments} from './time-series-graph';
+/*
+ * Renders a brush element within container for the daily value graph
+ * @param {D3 selection} container
+ * @param {Redux store} store
+ */
export const drawGraphBrush = function(container, store) {
const brushed = function() {
diff --git a/assets/src/scripts/components/daily-value-hydrograph/selectors/legend-data.js b/assets/src/scripts/components/daily-value-hydrograph/selectors/legend-data.js
index e6089d9b9..1734c64e2 100644
--- a/assets/src/scripts/components/daily-value-hydrograph/selectors/legend-data.js
+++ b/assets/src/scripts/components/daily-value-hydrograph/selectors/legend-data.js
@@ -7,7 +7,7 @@ import {getCurrentUniqueDataKinds} from './time-series-data';
/*
* Factory function that returns array of markers to be used for the
* DV time series graph legend
- * @return {Array of Object} - where the objects are markers (see d3-rendering/markers.js).
+ * @return {Function} which returns {Array of Object}, where the objects are markers (see d3-rendering/markers.js).
*/
export const getLegendMarkers = createSelector(
getCurrentUniqueDataKinds,
diff --git a/assets/src/scripts/components/daily-value-hydrograph/selectors/time-series-data.js b/assets/src/scripts/components/daily-value-hydrograph/selectors/time-series-data.js
index e3960417b..a7f6bdd96 100644
--- a/assets/src/scripts/components/daily-value-hydrograph/selectors/time-series-data.js
+++ b/assets/src/scripts/components/daily-value-hydrograph/selectors/time-series-data.js
@@ -41,9 +41,10 @@ const LINE_CLASSES = {
};
-/* Returns the selector function which returns an Array of Objects, each object representing one value, dateTime (in epoch time),
-and other attributes representing metadata on the value. This will represent the time series for the current
-selected time series and is in increasing date order.
+/*
+ * Returns the selector function which returns an Array of Objects, each object representing
+ * one value, dateTime (in epoch time), approvals, nilReason, qualifiers, and grades
+ * This will represent the time series for the current selected time series and is in increasing date order.
*/
export const getCurrentTimeSeriesData = createSelector(
getCurrentDVTimeSeries,
@@ -85,7 +86,8 @@ export const getCurrentTimeSeriesData = createSelector(
/*
- * Returns a selector function function returns an Array of Object that can be used to visualize the data.
+ * Returns a selector function function returns an Array of Object that can be used to visualize the
+ * currently selected time series data.
* Each object has the following properties:
* @prop {String} value
* @prop {Number} dateTime - in epoch milliseconds
@@ -128,7 +130,8 @@ export const getCurrentTimeSeriesPoints = createSelector(
.filter(point => point.isMasked)
.map(point => point.label);
const uniqueMaskLabels = uniq(allMaskLabels);
- const finalPoints = points.map((point) => {
+
+ return points.map((point) => {
if (point.isMasked) {
const maskToUse = findIndex(uniqueMaskLabels, (label) => label === point.label);
return {
@@ -141,8 +144,6 @@ export const getCurrentTimeSeriesPoints = createSelector(
};
}
});
-
- return finalPoints;
}
);
@@ -156,6 +157,7 @@ export const getCurrentTimeSeriesPoints = createSelector(
*
* A new segment is started when there is a change from masked to non-masked (or vice versa),
* if a segment has a different label, or if two line segments are separated by more than two days.
+ * The returned segments represent the currently selected time series
*/
export const getCurrentTimeSeriesSegments = createSelector(
getCurrentTimeSeriesPoints,
@@ -180,12 +182,14 @@ export const getCurrentTimeSeriesSegments = createSelector(
points.forEach((point) => {
const resultValue = parseFloat(point.value);
const hasGap = point.dateTime - previousDate >= TWO_DAYS;
+ const pointLabelHasChanged = newSegment.label !== point.label;
+
if (!newSegment.isMasked && !point.isMasked && hasGap) {
// there is a gap between two line segments so start a new segment
segments.push(newSegment);
newSegment = getNewSegment(point);
- } else if (newSegment.isMasked && newSegment.label != point.label) {
+ } else if (newSegment.isMasked && pointLabelHasChanged) {
// end previous masked segment where the next segment starts
newSegment.points.push({
value: resultValue,
@@ -195,7 +199,7 @@ export const getCurrentTimeSeriesSegments = createSelector(
newSegment = getNewSegment(point);
- } else if (!newSegment.isMasked && newSegment.label != point.label) {
+ } else if (!newSegment.isMasked && pointLabelHasChanged) {
// end previous line segment and start the next segment where the previous line ends
const lastPoint = newSegment.points[newSegment.points.length - 1];
segments.push(newSegment);
@@ -239,7 +243,7 @@ export const getCurrentUniqueDataKinds = createSelector(
/*
* Return a selector function that returns the epoch time for the current daily value cursor offset.
- * Return null if no current daily value cursor offset is set.
+ * Return the latest time if no current daily value cursor offset is set.
*/
export const getCursorEpochTime = createSelector(
getDVGraphCursorOffset,
@@ -275,7 +279,7 @@ export const getCurrentDataPointAtCursor = createSelector(
/*
* Return a selector which returns an Array of Objects with x, y coordinates, that represent
- * the position of the point at the cursor offset. Currently this is a single element array.
+ * the position of the currently selected time series point at the cursor offset. This is a single element array.
*/
export const getCurrentCursorPoint = createSelector(
getCurrentDataPointAtCursor,
diff --git a/assets/src/scripts/components/daily-value-hydrograph/time-series-graph.js b/assets/src/scripts/components/daily-value-hydrograph/time-series-graph.js
index 349df7eb6..d16573523 100644
--- a/assets/src/scripts/components/daily-value-hydrograph/time-series-graph.js
+++ b/assets/src/scripts/components/daily-value-hydrograph/time-series-graph.js
@@ -94,10 +94,10 @@ const drawDataSegment = function(group, {segment, xScale, yScale}) {
};
/*
- * Renders the line segments in lines using the D3 scales on the svg or group, elem, adding
+ * Renders the segments using the D3 scales on the svg or group, elem, adding
* the clip rectangle if enableClip
* @param {D3 selection for svg or group} elem
- * @param {Array of Object} lines
+ * @param {Array of Object} segments
* @param {D3 scale} xScale
* @param {D3 scale} yScale
* @param {Boolean} enableClip
diff --git a/assets/src/scripts/components/hydrograph/time-series-data.js b/assets/src/scripts/components/hydrograph/time-series-data.js
index b3c5836db..5dda14633 100644
--- a/assets/src/scripts/components/hydrograph/time-series-data.js
+++ b/assets/src/scripts/components/hydrograph/time-series-data.js
@@ -79,7 +79,6 @@ export const drawDataLine = function(group, {visible, lines, tsKey, xScale, ySca
.attr('y', yTop)
.attr('width', rectWidth)
.attr('height', Math.abs(yRangeEnd - yRangeStart))
- //.attr('class', `mask ${maskDisplayName}-mask`)
.attr('fill', patternId);
}
}
diff --git a/assets/src/scripts/components/hydrograph/time-series-graph.js b/assets/src/scripts/components/hydrograph/time-series-graph.js
index 59ba740de..554f01fc5 100644
--- a/assets/src/scripts/components/hydrograph/time-series-graph.js
+++ b/assets/src/scripts/components/hydrograph/time-series-graph.js
@@ -129,6 +129,14 @@ const watermark = function (elem, store) {
}, getMainLayout));
};
+/*
+ * Renders the IV time series graph with the D3 elem using the state information in store.
+ * @param {D3 selection} elem
+ * @param {Redux store} store
+ * @param {String} siteNo
+ * @param {Boolean} showMLName - If true add the monitoring location name to the top of the graph
+ * @param {Boolean} showTooltip - If true render the tooltip text and add the tooltip focus element
+ */
export const drawTimeSeriesGraph = function(elem, store, siteNo, showMLName, showTooltip) {
let graphDiv;
diff --git a/assets/src/scripts/components/hydrograph/tooltip.js b/assets/src/scripts/components/hydrograph/tooltip.js
index 8209157b1..7ecaac9cc 100644
--- a/assets/src/scripts/components/hydrograph/tooltip.js
+++ b/assets/src/scripts/components/hydrograph/tooltip.js
@@ -196,8 +196,6 @@ export const drawTooltipText = function (elem, store) {
})));
};
-
-
/*
* Appends a group to elem containing a focus line and circles for the current and compare time series
* @param {Object} elem - D3 select
diff --git a/assets/src/scripts/d3-rendering/legend.js b/assets/src/scripts/d3-rendering/legend.js
index f5390d9f2..fe53dcedd 100644
--- a/assets/src/scripts/d3-rendering/legend.js
+++ b/assets/src/scripts/d3-rendering/legend.js
@@ -2,7 +2,7 @@ import {mediaQuery} from '../utils';
import config from '../config';
const RECTANGLE_MARKER_WIDTH = 20;
-const RECTANGLE_MARKER_HEIGTH = 10;
+const RECTANGLE_MARKER_HEIGHT = 10;
const LINE_MARKER_WIDTH = 20;
const MARKER_GROUP_X_OFFSET = 15;
const VERTICAL_ROW_OFFSET = 18;
@@ -77,7 +77,7 @@ export const drawSimpleLegend = function(div, {legendMarkerRows, layout}) {
domId: marker.domId,
domClass: marker.domClass,
width: RECTANGLE_MARKER_WIDTH,
- height: RECTANGLE_MARKER_HEIGTH,
+ height: RECTANGLE_MARKER_HEIGHT,
length: LINE_MARKER_WIDTH,
r: marker.r,
fill: marker.fill
diff --git a/assets/src/scripts/index.spec.js b/assets/src/scripts/index.spec.js
index 76aab8550..f633ae21b 100644
--- a/assets/src/scripts/index.spec.js
+++ b/assets/src/scripts/index.spec.js
@@ -12,17 +12,6 @@ import './polyfills';
import './ajax.spec';
-import './d3-rendering/accessibility.spec';
-import './d3-rendering/alerts.spec';
-import './d3-rendering/axes.spec';
-import './d3-rendering/cursor-slider.spec';
-import './d3-rendering/data-masks.spec';
-import './d3-rendering/graph-tooltip.spec';
-import './d3-rendering/legend.spec';
-import './d3-rendering/loading-indicator.spec';
-import './d3-rendering/markers.spec';
-import './d3-rendering/tick-marks.spec';
-
import './components/daily-value-hydrograph/selectors/labels.spec';
import './components/daily-value-hydrograph/selectors/legend-data.spec';
import './components/daily-value-hydrograph/selectors/scales.spec';
@@ -55,6 +44,17 @@ import './components/map/flood-slider.spec';
import './components/map/index.spec';
import './components/map/legend.spec';
+import './d3-rendering/accessibility.spec';
+import './d3-rendering/alerts.spec';
+import './d3-rendering/axes.spec';
+import './d3-rendering/cursor-slider.spec';
+import './d3-rendering/data-masks.spec';
+import './d3-rendering/graph-tooltip.spec';
+import './d3-rendering/legend.spec';
+import './d3-rendering/loading-indicator.spec';
+import './d3-rendering/markers.spec';
+import './d3-rendering/tick-marks.spec';
+
import './helpers.spec';
import './lib/d3-redux.spec';
--
GitLab