Feedback changes & info text update

web/js/components/charting/charting-date-selector.js

@@ -37,7 +37,7 @@ function ChartingDateSelector (props) {
   }
 
   return (
-    <div className="charting-date-container">
+    <div className="charting-date-container wv-date-range-selector">
       {/* single date mode */}
       {timeSpanSelection === 'date'
         ? (

web/js/components/charting/charting-info.js

@@ -4,19 +4,20 @@ function ChartingInfo(props) {
   return (
     <div className="charting-info-container">
       <div className="charting-info-text">
-        <p className="charting-info">
-          Click on the pencil icon to click and drag a bounding box on the map to define an Area of Interest (AOI).
-        </p>
+        <p className="charting-info">The Charting Tool provides the option to create a line chart for a date range showing change over time, and statistics for a single date (minimum, maximum, mean, and standard deviation) for an area of interest.</p>
 
-        <p className="charting-info">In Date Range mode (the default mode), select the calendar icon near the bottom of the Layers panel and increment the values in the resulting window to change their dates. To use a single date instead of a range, choose One Date at the bottom of the Layers panel.</p>
+        <p className="charting-info">Select the layer to be charted by clicking on the radio button to the left of the layer name.</p>
 
-        <p className="charting-info">Select the active layer via the toggle icon on its left. Click on Request Chart & you will see additional data as you hover over points on the enlarged chart.</p>
+        <p className="charting-info">The default area of interest is the entire screen, click on the “Entire Screen” button to change to a bounding box area of interest selection. Click on any box at the edge or corner of the selection box to change the size and shape.</p>
 
-        <p className="charting-info">Exit the charting mode by selecting Exit Charting near the botom of the Layers Panel.</p>
+        <p className="charting-info">The default date selection is a date range of the past 7 days. Click on the dates to change the date range in the Charting Mode Date Selection box. Click on the red “Generate Chart” button to generate a chart of change over time.</p>
+
+        <p className="charting-info">To select a single date, select “One Date”. Click on the date to change the date in date selection box.  Click on the red “Generate Statistics” button to generate a list of statistics including min, max, mean, and standard deviation.</p>
 
         <h3>NOTE:</h3>
 
         <p className="charting-disclaimer">Numerical analyses performed on imagery should only be used for initial basic exploratory purposes. Results from these analyses should not be used for formal scientific study since the imagery is generally of lower precision than the original data and has often had additional processing steps applied to it, e.g. projection into a different coordinate system.</p>
+
       </div>
     </div>
   );

web/scss/components/button.scss

@@ -27,6 +27,11 @@
     padding: 3px 13px 4px;
 }
 
+#chart-toggle-button.disabled {
+  color: #fff;
+  pointer-events: auto;
+}
+
 .wv-button.red {
   background: #f64137;
   border-color: #f64137;
@@ -36,7 +41,7 @@
   background: #212121;
 }
 
-.wv-button:hover,
+.wv-button:not(.disabled):hover,
 #compare-toggle-button:hover {
   border-color: #eee;
   background-color: #eee;

web/scss/features/sidebar.scss

@@ -625,7 +625,7 @@ div#group-overlays-checkbox-case {
 }
 
 .charting-indicator {
-  font-size: 1.5em;
+  font-size: 1.25em;
   margin: 0;
   position: absolute;
   top: 50%;