feat: Added Sensor Logging Capabilities.

src/App.js

@@ -2,6 +2,8 @@ import React, {useEffect} from "react";
 import { Route, Routes } from "react-router-dom";
 import { GeistProvider, CssBaseline } from '@geist-ui/core'
 
+import { SensorLogger } from "./core/log/SensorLogger";
+
 import h337 from "heatmap.js";
 
 const NoPageFound = React.lazy(() => import("./pages/NoPageFound"));
@@ -68,14 +70,18 @@ function App() {
 
   wait(200);
 
+  var logRoutePath = (path) => {
+    SensorLogger.pushToVisitLog(path);
+  };
+
   return (
     <GeistProvider>
       <React.Suspense fallback="loading">
         <Routes>
-          <Route path="/" element={<React.Suspense fallback={<>...</>}><TestPage /></React.Suspense>} />
-          <Route path="/info" element={<React.Suspense fallback={<>...</>}><TestPage /></React.Suspense>} />
-          <Route path="/questionnaire/:id" element={<React.Suspense fallback={<>...</>}><TestQuestionnaire /></React.Suspense>} />
-          <Route path="*" element={<React.Suspense fallback={<>...</>}><NoPageFound /></React.Suspense>} />
+          <Route path="/" action={logRoutePath("/")} element={<React.Suspense fallback={<>...</>}><TestPage /></React.Suspense>} />
+          <Route path="/info" action={logRoutePath("/info")} element={<React.Suspense fallback={<>...</>}><TestPage /></React.Suspense>} />
+          <Route path="/questionnaire/:id" action={logRoutePath("/questionnaire")} element={<React.Suspense fallback={<>...</>}><TestQuestionnaire /></React.Suspense>} />
+          <Route path="*" action={logRoutePath("*")} element={<React.Suspense fallback={<>...</>}><NoPageFound /></React.Suspense>} />
         </Routes>
       </React.Suspense>
       <CssBaseline />

src/core/Constants.jsx

@@ -0,0 +1,2 @@
+export const MOUSE_MODE = false;
+export const HEATMAP_MAX = 999;

src/core/log/SensorLogger.jsx

@@ -0,0 +1,33 @@
+import {Component} from 'react';
+
+export class SensorLogger extends Component {
+    static sensorLog = {mouseLog: [], orientationLog: [], clickedElements: [], visitedSites: [], playedSonifications: []};
+
+    static pushToMouseLog(logElement) {
+        this.sensorLog.mouseLog.push(logElement);
+    }
+
+    static pushToOrientationLog(logElement) {
+        this.sensorLog.orientationLog.push(logElement);
+    }
+
+    static pushToClickLog(logElement) {
+        this.sensorLog.clickedElements.push(logElement);
+    }
+
+    static pushToVisitLog(logElement) {
+        this.sensorLog.visitedSites.push(logElement);
+    }
+
+    static pushToSonificationLog(logElement) {
+        this.sensorLog.playedSonifications.push(logElement);
+    }
+
+    static getSensorLog() {
+        return this.sensorLog;
+    }
+
+    static resetSensorLog() {
+        this.sensorLog = {mouseLog: [], orientationLog: [], clickedElements: [], visitedSites: [], playedSonifications: []};
+    }
+}

src/index.js

@@ -5,6 +5,10 @@ import App from './App';
 import reportWebVitals from './reportWebVitals';
 import { BrowserRouter } from "react-router-dom";
 import "./core/i18n/i18n";
+import { SensorLogger } from './core/log/SensorLogger';
+
+document.onclick = function(event) {SensorLogger.pushToClickLog(event);};
+window.addEventListener("deviceorientation", function(event) {SensorLogger.pushToOrientationLog(event);});
 
 const root = ReactDOM.createRoot(document.getElementById('root'));
 root.render(

src/pages/TestPage.jsx

@@ -1,10 +1,12 @@
 import React from "react";
 import InfoPageComponent from "../components/InfoPageComponent";
 import { getTranslation } from "../core/i18n/I18NHandler";
+import WebpageBanner from "../components/webpage_container/WebpageBanner";
+import { SensorLogger } from "../core/log/SensorLogger";
 
 export default class TestPage extends InfoPageComponent {
 
     render() {
-        return (<InfoPageComponent><p>{getTranslation("hello_world")}</p></InfoPageComponent>);
+        return (<InfoPageComponent><WebpageBanner translationKey="hello_world" /><p>{getTranslation("hello_world")}</p><button onClick={function(){console.log(SensorLogger.getSensorLog())}}>Heeeyyy</button></InfoPageComponent>);
     }
 }