Evo: make data downloadable while tracking

.gitignore

@@ -8,3 +8,4 @@ history.db
 static/trackerHistory.json
 yarn-error.log
 static/lastwebcamframe.jpg
+static/trackerHistoryExport.json

components/shared/BtnDownload.js

@@ -8,8 +8,13 @@ class BtnDownload extends Component {
         className="btn-download"
         onClick={() => this.props.onClick()}
       >
-        <img src="/static/icons/icon-download.svg" />
-        <h2>Export data</h2>
+        {this.props.iconNotepad &&
+          <img src="/static/icons/icon-notepad.svg" />
+        }
+        {!this.props.iconNotepad &&
+          <img src="/static/icons/icon-download.svg" />
+        }
+        <h2>{this.props.label}</h2>
         <style jsx>{`
           .btn-download {
             position: relative;

components/shared/EndCountingCTA.js

@@ -1,8 +1,6 @@
 import React, { Component } from 'react'
 import { connect } from 'react-redux'
-import axios from 'axios';
 
-import { exportCountingData, exportTrackerData } from '../../statemanagement/app/CounterStateManagement';
 import { stopCounting, hideCountingData } from '../../statemanagement/app/AppStateManagement';
 import BtnCounting from './BtnCounting';
 import BtnDownload from './BtnDownload';
@@ -16,6 +14,12 @@ class EndCountingCTA extends Component {
     link.click();
   }
 
+  getCounterData() {
+    let link = document.createElement("a");
+    link.href = '/counter/export';
+    link.click();
+  }
+
   exportPathVisualizationFrame() {
     let link = document.createElement("a");
     let frame = document.getElementById("path-visualization-canvas").toDataURL("image/png")
@@ -37,16 +41,25 @@ class EndCountingCTA extends Component {
           </div>
           <div 
             className="button export"
-            onClick={() => this.props.dispatch(exportCountingData())}
+            onClick={() => this.getCounterData()}
           >
             <h2>Get counting data</h2>
           </div> */}
+          <BtnDownload 
+            label="Tracker data"
+            onClick={() => this.getTrackerData()}
+          />
+          <div className="separator"></div>
+          <BtnDownload 
+            iconNotepad
+            label="Counting data"
+            onClick={() => this.getCounterData()}
+          />
+          <div className="separator"></div>
           {this.props.pathVisualizationSelected &&
             <BtnScreenshot onClick={() => this.exportPathVisualizationFrame()} />
           }
           <div className="separator"></div>
-          <BtnDownload />
-          <div className="separator"></div>
           {this.props.isCounting &&
             <BtnCounting 
               label="Stop tracking"

server.js

@@ -97,14 +97,14 @@ app.prepare()
   });
 
   express.get('/counter/export', function(req, res) {
-    res.csv(Counter.getCounterHistory(), false ,{'Content-disposition': 'attachment; filename=export.csv'});
+    res.csv(Counter.getCounterHistory(), false ,{'Content-disposition': 'attachment; filename=counterData.csv'});
   });
 
 
   express.get('/counter/trackerdata', function(req, res) {
     Counter.getTrackerData().then(() => {
       // res.send('OK, file ready to download');
-      res.download('static/trackerHistory.json', 'trackerHistory.json')
+      res.download('static/trackerHistoryExport.json', 'trackerHistoryExport.json')
     }, () => {
       res.status(500).send('Something broke while generating the tracking history!');
     })

server/counter/Counter.js

@@ -318,12 +318,18 @@ module.exports = {
   },
 
   getTrackerData: function() {
-    // Close the json history
+
     return new Promise((resolve, reject) => {
-      fs.appendFile('./static/trackerHistory.json', `\n]`, function (err) {
+      // Copy current trackerHistory but keep the current file has we keep adding line to it
+      fs.copyFile('./static/trackerHistory.json', './static/trackerHistoryExport.json', (err) => {
         if (err) throw err;
-        resolve();
+        // Make a valid json file by adding a closing bracket
+        fs.appendFile('./static/trackerHistoryExport.json', `\n]`, function (err) {
+          if (err) throw err;
+          resolve();
+        });
       });
+
     });
   }
 }

statemanagement/app/CounterStateManagement.js

@@ -38,14 +38,6 @@ export function fetchCountingData() {
   }
 }
 
-export function exportCountingData() {
-  return (dispatch, getState) => {
-    let link = document.createElement("a");
-    link.href = '/counter/export';
-    link.click();
-  }
-}
-
 export function selectCountingArea(color) {
   return {
     type: SELECT_COUNTING_AREA,