issue fixed! - convert number to string

assets/src/scripts/monitoring-location/components/hydrograph/date-controls.js

@@ -10,7 +10,6 @@ import components from '../../../../../node_modules/uswds/src/js/components';
 import {
     isLoadingTS,
     hasAnyTimeSeries,
-    getCurrentVariableID,
     getUserInputTimeRangeSelectionButton,
     getUserInputCustomTimeRangeSelectionButton,
     getUserInputNumberOfDays,
@@ -20,8 +19,6 @@ import {getIanaTimeZone} from '../../selectors/time-zone-selector';
 import {Actions as ivTimeSeriesDataActions} from '../../store/instantaneous-value-time-series-data';
 import {Actions as ivTimeSeriesStateActions} from '../../store/instantaneous-value-time-series-state';
 
-import {getVariables} from '../../selectors/time-series-selector';
-
 export const drawDateRangeControls = function(elem, store, siteno) {
     const MAX_DIGITS_FOR_DAYS_FROM_TODAY = 5;
     const DATE_RANGE = [{
@@ -196,10 +193,6 @@ export const drawDateRangeControls = function(elem, store, siteno) {
             } else {
                 customDaysBeforeTodayValidationContainer.attr('hidden', true);
                 const parameterCode = getCurrentParmCd(store.getState());
-                document.getElementById(`time-series-select-table-row-${parameterCode}`).selected=true;
-                document.getElementById(`time-series-select-radio-button-${parameterCode}`).checked=true;
-                console.log('row ', document.getElementById(`time-series-select-table-row-${parameterCode}`))
-                console.log('button  ', document.getElementById(`time-series-select-radio-button-${parameterCode}`))
 
                 store.dispatch(ivTimeSeriesStateActions.setUserInputNumberOfDays(userSpecifiedNumberOfDays));
                 store.dispatch(ivTimeSeriesDataActions.retrieveCustomTimePeriodIVTimeSeries(
@@ -356,10 +349,6 @@ export const drawDateRangeControls = function(elem, store, siteno) {
             store.dispatch(ivTimeSeriesStateActions.setCustomIVTimeRange(null));
 
             if (selectedVal === 'custom') {
-                // Remove any values stored in the form, because they may not match what is shown in the graph until the submit button is pushed
-                store.dispatch(ivTimeSeriesStateActions.setUserInputNumberOfDays(''));
-                store.dispatch(ivTimeSeriesStateActions.setCustomIVTimeRange(null));
-
                 selected.attr('aria-expanded', true);
                 containerRadioGroupCustomSelectButtons.attr('hidden', null);
                 containerCustomDaysBeforeToday.attr('hidden', null);
@@ -368,10 +357,6 @@ export const drawDateRangeControls = function(elem, store, siteno) {
             } else {
                 const userInputTimeframeButtonSelected = li.select('input:checked').attr('value');
 
-                // Remove any values stored in the form, because they may not match what is shown in the graph until the submit button is pushed
-                store.dispatch(ivTimeSeriesStateActions.setUserInputNumberOfDays(''));
-                store.dispatch(ivTimeSeriesStateActions.setCustomIVTimeRange(null));
-
                 li.select('input#custom-date-range').attr('aria-expanded', false);
                 containerRadioGroupCustomSelectButtons.attr('hidden', true);
                 containerCustomDaysBeforeToday.attr('hidden', true);

assets/src/scripts/monitoring-location/components/hydrograph/hydrograph-utils.js

@@ -20,11 +20,19 @@ export const isPeriodCustom = function(periodCode) {
 * @return {Object} parsed period code values
 * */
 export const parsePeriodCode = function(periodCode) {
-    const currentUserInputCustomTimeRangeSelectionButton = isPeriodCustom(periodCode) ? 'custom' : periodCode;
-    const userInputNumberOfDays = periodCode !== null ? periodCode.slice(1,-1) : '';
+    if (periodCode) {
+        const currentUserInputCustomTimeRangeSelectionButton = isPeriodCustom(periodCode) ? 'custom' : periodCode;
+        const userInputNumberOfDays = periodCode !== null ? periodCode.slice(1,-1) : '';
 
-    return {
-        'currentUserInputCustomTimeRangeSelectionButton' : currentUserInputCustomTimeRangeSelectionButton,
-        'userInputNumberOfDays': userInputNumberOfDays
-    };
+        return {
+            'currentUserInputCustomTimeRangeSelectionButton' : currentUserInputCustomTimeRangeSelectionButton,
+            'userInputNumberOfDays': userInputNumberOfDays
+        };
+    } else {
+
+        return {
+            'currentUserInputCustomTimeRangeSelectionButton' : 'P7D',
+            'userInputNumberOfDays': ''
+        };
+    }
 };
\ No newline at end of file

assets/src/scripts/monitoring-location/components/hydrograph/index.js

@@ -99,6 +99,9 @@ export const attachToNode = function (store,
                 const currentParamCode = parameterCode ? parameterCode : getCurrentParmCd(store.getState());
 
                 if (period && period.substr(0,1) === 'P' && period !== 'P7D') {
+                    console.log('ran in instantaineou value toem series data')
+                    // store.dispatch(ivTimeSeriesDataActions.retrieveCustomTimePeriodIVTimeSeries(siteno, period, currentParamCode));
+
                     store.dispatch(ivTimeSeriesDataActions.retrieveExtendedIVTimeSeries(siteno, period, currentParamCode));
                 } else if (startDT && endDT) {
                     fetchTimeZonePromise.then(() => {

assets/src/scripts/monitoring-location/store/instantaneous-value-time-series-data.js

@@ -167,39 +167,43 @@ const retrieveCompareIVTimeSeries = function(siteno, period, startTime, endTime)
 * @return {Function} which returns a promise
  */
 const retrieveCustomTimePeriodIVTimeSeries = function(siteno, parameterCd, period) {
-    console.log('in retrieveCustomTimePeriodIVTimeSeries siteno ',  siteno)
+
     console.log('in retrieveCustomTimePeriodIVTimeSeries parameterCd ',  parameterCd)
     console.log('in retrieveCustomTimePeriodIVTimeSeries period ',  period)
     return function(dispatch, getState) {
         const state = getState();
-        const tsRequestKey = getTsRequestKey('current', 'custom', parameterCd)(state);
+        const tsRequestKey = getTsRequestKey('current', period, parameterCd)(state);
+        // const tsRequestKey = getTsRequestKey('current', 'custom', parameterCd)(state);
         // We need to resetTimeSeries because the merge function in the addSeriesCollection does not clear out the
         // time series values. This is an issue if the length of the values that we are retrieving are fewer than
         // what is saved.
-        const currentTsIds = getTimeSeriesCollectionIds('current', 'custom', parameterCd)(state) || [];
+        const currentTsIds = getTimeSeriesCollectionIds('current', 'period', parameterCd)(state) || [];
+
+
         if (currentTsIds.length > 0) {
             dispatch(Actions.resetIVTimeSeries(tsRequestKey));
         }
 
         const parsedPeriodCodes = parsePeriodCode(period);
+        dispatch(ivTimeSeriesStateActions.setUserInputTimeRangeSelectionButton(parsedPeriodCodes.currentUserInputCustomTimeRangeSelectionButton));
         dispatch(ivTimeSeriesStateActions.setCurrentIVDateRangeKind(period));
         isPeriodCustom(period) ?
             dispatch(ivTimeSeriesStateActions.setUserInputNumberOfDays(parsedPeriodCodes.userInputNumberOfDays)) :
             null;
-        dispatch(ivTimeSeriesStateActions.setUserInputTimeRangeSelectionButton(parsedPeriodCodes.currentUserInputCustomTimeRangeSelectionButton));
-
-
 
 
 
         dispatch(ivTimeSeriesStateActions.addIVTimeSeriesToLoadingKeys([tsRequestKey]));
+
         return getTimeSeries({sites: [siteno], params: [parameterCd], period: period}).then(
             series => {
                 const collection = normalize(series, tsRequestKey);
                 const variables = Object.values(collection.variables);
                 const variableToDraw = find(variables, v =>  v.variableCode.value === parameterCd);
-                dispatch(ivTimeSeriesStateActions.setCurrentIVVariable(variableToDraw.variableCode.variableID));
                 dispatch(Actions.addIVTimeSeriesCollection(collection));
+                dispatch(ivTimeSeriesStateActions.setUserInputTimeRangeSelectionButton('custom'));
+                dispatch(ivTimeSeriesStateActions.setUserInputCustomTimeRangeSelectionButton('days-input'));
+                dispatch(ivTimeSeriesStateActions.setCurrentIVVariable(variableToDraw.variableCode.variableID.toString()));
                 dispatch(ivTimeSeriesStateActions.removeIVTimeSeriesFromLoadingKeys([tsRequestKey]));
             },
             () => {
@@ -275,14 +279,14 @@ const retrieveExtendedIVTimeSeries = function(siteno, period, paramCd=null) {
         const state = getState();
         const thisParamCd = paramCd ? paramCd : getCurrentParmCd(state);
         const tsRequestKey = getTsRequestKey ('current', period, thisParamCd)(state);
-        const parsedPeriodCodes = parsePeriodCode(period);
-
 
+        const parsedPeriodCodes = parsePeriodCode(period);
+        dispatch(ivTimeSeriesStateActions.setUserInputTimeRangeSelectionButton(parsedPeriodCodes.currentUserInputCustomTimeRangeSelectionButton));
         dispatch(ivTimeSeriesStateActions.setCurrentIVDateRangeKind(period));
         isPeriodCustom(period) ?
             dispatch(ivTimeSeriesStateActions.setUserInputNumberOfDays(parsedPeriodCodes.userInputNumberOfDays)) :
             null;
-        dispatch(ivTimeSeriesStateActions.setUserInputTimeRangeSelectionButton(parsedPeriodCodes.currentUserInputCustomTimeRangeSelectionButton));
+