support for downsampling, date fix

SeniorDesignGroup5 · Apr 9, 2019 · 214efed · 214efed
1 parent b97a27a
commit 214efed
Show file tree

Hide file tree

Showing 7 changed files with 262 additions and 180 deletions.
diff --git a/src/app/services/visualize.service.ts b/src/app/services/visualize.service.ts
@@ -50,12 +50,12 @@ export class VisualizeService {
     return chart;
   }
 
-  getDataForVis(token, timeStart, timeEnd, func, gens, data): Observable<Object> {
+  getDataForVis(token, timeStart, timeEnd, func, gens, data, range): Observable<Object> {
     const body = {
       'time': {
         'start': timeStart,
         'end': timeEnd,
-        'aggregator': func
+        'aggregator': 'last'
       },
       'filters': [
         {
@@ -83,6 +83,12 @@ export class VisualizeService {
         }
       ]
     };
+    if (range !== 'none' && func !== 'none') {
+      body['time']['downsampler'] = {
+        'interval': range,
+        'aggregator': func
+      };
+    }
     return this.http.post('http://sd5-backend.engr.uconn.edu/data/query/exp', body, {
       headers: {
         Authorization: 'Bearer ' + token

diff --git a/src/app/visualize-all/visualize-all.component.css b/src/app/visualize-all/visualize-all.component.css
@@ -1,16 +1,13 @@
 select#gen_select {
     width: 200px;
-    margin: 20px;
 }
 
 select#func_select {
     width: 200px;
-    margin: 20px;
 }
 
 select#data_select {
     width: 200px;
-    margin: 20px;
 }
 
 p#visMessage {

diff --git a/src/app/visualize-all/visualize-all.component.html b/src/app/visualize-all/visualize-all.component.html
@@ -9,42 +9,56 @@
         Dates: {{startTime$}} - {{endTime$}}<br>
         Units: {{unit$}}<br>
         Function: {{function$}}<br>
+        Range: {{range$}}<br>
       </p>
       <form id="visToolbar">
-        <div class="text-center mb3" style="background-color: black;">
+        <div class="text-center mb3" style="background-color: black; color: white">
           <br>
           <p id="visMessage">Ctrl/Comm+Click to select multiple generators <br> Please select a maximum of 5 generators
           </p>
-          <!-- <br><br> -->
+          <select id="gen_select" name="generatorSelect" multiple>
+            <option *ngFor="let generator of generators$" value="{{generator.gen_id}},{{generator.gen_name}}" selected>
+              {{generator.gen_name}}</option>
+          </select>
+          <br><br>
+          <select id="data_select" name="dataSelect">
+            <option *ngFor="let names of dataNames$" value="{{names}}" selected>{{names}}</option>
+          </select>
+          <br><br>
+          <form style="color:white" action="/action_page.php">
+            Start Time:
+            <input #start_time type="date" value={{today$}} max={{today$}}>
+            <br><br>
+            End Time:
+            <input #end_time type="date" value={{today$}} max={{today$}}>
+          </form>
+          <br>
+          Downsampling (Optional)
+          <br><br>
+          Function:
           <select id="func_select" name="functionSelect">
-            <option value="" disabled selected>Select Function</option>
+            <option value="none" selected>None</option>
             <option value="sum">Summation</option>
             <option value="min">Minimum</option>
             <option value="avg">Average</option>
             <option value="max">Maximum</option>
             <option value="count">Count</option>
             <option value="dev">Deviation</option>
           </select>
-          <br>
-          <select id="data_select" name="dataSelect">
-            <option value="" disabled selected>Select Data</option>
-            <option *ngFor="let names of dataNames$" value="{{names}}">{{names}}</option>
-          </select>
           <br><br>
-            <form style="color:white" action="/action_page.php">
-              Start Time: 
-              <input #start_time type="date" name="exampleStartTime">
-              <br><br>
-              End Time: 
-              <input #end_time type="date" name="exampleEndTime">
-            </form>
-            <br>
-          <select id="gen_select" name="generatorSelect" multiple>
-            <option *ngFor="let generator of generators$" value="{{generator.gen_id}},{{generator.gen_name}}">
-              {{generator.gen_name}}</option>
+          Range:
+          <select id="func_time_select" name="functionTimeSelect">
+            <option value="none" selected>None</option>
+            <option value="1h">1 hour</option>
+            <option value="1d">1 day</option>
+            <option value="1w">1 week</option>
+            <option value="1n">1 month</option>
+            <option value="6n">6 months</option>
+            <option value="1y">1 year</option>
+            <option value="5y">5 years</option>
           </select>
-          <br>
-          <h4 class="text-center mb3" style="color:red" *ngIf="signal">Invalid Entry<br></h4>
+          <br><br>
+          <p class="text-center mb3" style="color:red" *ngIf="signal">{{errorMessage$}}<br></p>
           <a class="btn btn-primary" style="color:white" (click)="resetAndRemakeChart()">Visualize</a>
           <br>
           <br>