feat: Added first study site.

public/locales/de/translation.json

@@ -1,5 +1,6 @@
 {
     "hello_world": "Hallo Welt",
     "download": "Download",
-    "continue": "Fortfahren"
+    "continue": "Fortfahren",
+    "task_1_info": "Ihr Flug wurde storniert und Sie möchten nun den Kunden-Support kontaktieren für eine Rückerstattung."
 }

public/locales/en/translation.json

@@ -1,5 +1,6 @@
 {
     "hello_world": "Hello World",
     "download": "Download",
-    "continue": "Continue"
+    "continue": "Continue",
+    "task_1_info": "Your flight was cancelled and you want to contact customer support to get a refund."
 }

src/App.js

@@ -5,6 +5,7 @@ import RouteTracker from "./core/log/RouteTracker";
 import { createStore } from 'zustand/vanilla'
 import { persist, createJSONStorage } from 'zustand/middleware'
 import { PARTICIPANT_NUMBER } from "./core/Constants";
+import { StudySite } from "./components/webpage_container/StudySite";
 
 const NoPageFound = React.lazy(() => import("./pages/NoPageFound"));
 const TestPage = React.lazy(() => import("./pages/TestPage"));
@@ -12,6 +13,8 @@ const TestPage2 = React.lazy(() => import("./pages/TestPage2"));
 const TestInfoPage = React.lazy(() => import("./pages/TestInfoPage"));
 const TestInfoPage2 = React.lazy(() => import("./pages/TestInfoPage2"));
 const TestEndPage = React.lazy(() => import("./pages/TestEndPage"));
+const StartPage1 = React.lazy(() => import("./pages/study_site_1/StartPage1"));
+
 
 export const sensorLogState = createStore(
   persist(
@@ -98,7 +101,7 @@ function App() {
         <Routes>
           <Route path="/" element={<React.Suspense fallback={<>...</>}><TestInfoPage redirectLoc={latinSquareOrder[0]}/></React.Suspense>} />
           <Route path="/in-between-1" element={<React.Suspense fallback={<>...</>}><TestInfoPage2 redirectLoc="study-page-1"/></React.Suspense>} />
-          <Route path="/study-page-1" element={<React.Suspense fallback={<>...</>}><TestPage redirectLoc={latinSquareOrder[1]}/></React.Suspense>} />
+          <Route path="/study-page-1" element={<React.Suspense fallback={<>...</>}><StartPage1 redirectLoc={latinSquareOrder[1]}/></React.Suspense>} />
           <Route path="/in-between-2" element={<React.Suspense fallback={<>...</>}><TestInfoPage2 redirectLoc="study-page-2"/></React.Suspense>} />
           <Route path="/study-page-2" element={<React.Suspense fallback={<>...</>}><TestPage redirectLoc={latinSquareOrder[2]}/></React.Suspense>} />
           <Route path="/in-between-3" element={<React.Suspense fallback={<>...</>}><TestInfoPage2 redirectLoc="study-page-3"/></React.Suspense>} />

src/pages/study_site_1/StartPage1.jsx

@@ -0,0 +1,81 @@
+import React from "react";
+import { getTranslation } from "../../core/i18n/I18NHandler";
+import WebpageBanner from "../../components/webpage_container/WebpageBanner";
+import { StudySite, getHeatmapData } from "../../components/webpage_container/StudySite";
+import { pushToMouseLog, getSensorLog } from "../../core/log/SensorLogger";
+import { Collapse, Text, Spacer, Grid } from "@geist-ui/core";
+//import {logo} from "/public/images/budget_bird_logo.png";
+
+function StartPage1({redirectLoc}) {
+        var saveMouseLog = function() {
+            pushToMouseLog(getHeatmapData());
+            //window.location.href = "./" + redirectLoc;
+        };
+
+        // TODO THINK IF I WANT TO JUST USE AN OVERLAY FOR OTHER DUMMY LINKS, WHICH ARENT CORRECT???
+        // IS THAT OKAY???
+
+        return (<StudySite>
+                <WebpageBanner translationKey="task_1_info" />
+                <Spacer h={2}/>
+                <img src="/images/budget_bird_logo.png" width="150px" alt="BudgetBird Airlines Logo" />
+                <Spacer h={1}/>
+                <h3>Frequently Asked Questions</h3>
+                <Spacer h={2}/>
+                <Collapse.Group>
+                    <Collapse title="Under what conditions can I rebook?">
+                        <Text>You can change your flight bookings providing the fare conditions of your ticket permit this. 
+                            You can find out whether your ticket can be rebooked and whether there is a fee for this on your booking confirmation, or contact your travel agency or the Service Centre. 
+                            Alternatively, you can also rebook your flight details under <a href="./">My Bookings.</a></Text>
+                    </Collapse>
+                    <Collapse title="Can I make a name change after I have booked?">
+                        <Text>It is not possible to make a retroactive name change for a booking. Lufthansa shall provide the transport service to the passenger named in the ticket only. 
+                            The BudgetBird Service Team will be happy to help you if you require further information.</Text>
+                    </Collapse>
+                    <Collapse title="What are the upper weight limits for free baggage?">
+                        <Text>The maximum weight limit for your flight can be checked </Text>
+                        <Text>
+                        The maximum size per piece of baggage is 158 cm (width X + height Y + depth Z).
+                        </Text>
+                        <Text>Larger, heavier or additional bags are carried as excess baggage. You can find the prices in our baggage calculator.</Text>
+                    </Collapse>
+                    <Collapse title="What are the passenger rights you have in case of rescheduling or cancellation?">
+                        <Text>Since BudgetBird Airlines offers no flights outside the European Union the <a href="https://europa.eu/youreurope/citizens/travel/passenger-rights/air/index_en.htm">European Air Passenger Rights</a> will apply.</Text>
+                    </Collapse>
+                    <Collapse title="What costs will incur for rebooking my ticket?">
+                        <Text>You can change your flight bookings provided that the fare conditions of your ticket permit this.
+You can find out whether your ticket can be rebooked and whether there is a fee for this on your booking confirmation, or contact your travel agency or the Service Centre.
+Alternatively, you can also make a change to your flight details in the <a href="./">My Bookings</a> section. Depending on the alternative flight you choose, there may be surcharges on a higher fare. The amount of the surcharge depends on the availability of the selected booking class and will be communicated to you during the rebooking process.</Text>
+                    </Collapse>
+                    <Collapse title="How do I get my money returned to me after a refund?">
+                        <Text>In principle, the refund is paid using the same method that you originally used to pay for the ticket, in other words, if you paid for your ticket by credit card, the refund will be credited to the same credit card account.</Text>
+                    </Collapse>
+                    <Collapse title="How do I make a reservation?">
+                        <Text>To make a reservation, please contact us in the following way: </Text>
+                        <Text>Contact Details: </Text>
+                        <Text><a href="tel:+31 99 999 9999">+31 99 999 9999</a>
+                        <Text>Monday - Sunday open for 24 hours.</Text>
+                        <Text>(Standard phone charges apply.)</Text></Text>
+                        <Text><a href="mailto:reservation.budgetbird@example.com">reservation.budgetbird@example.com</a></Text>
+                    </Collapse>
+                    <Collapse title="My flight was cancelled. How do I get my refund?">
+                        <Text>When your ticket has not been used, the ticket price including all taxes and fees will be refunded to the original method of payment.
+If you have already used one or more segments of the journey, the unused portion of the fare value, taxes and fees will be calculated and the ticket refunded accordingly on a pro rata basis.</Text>
+                    </Collapse>
+                    <Collapse title="How can I contact the Customer Support?">
+                        <Text>Depending on your concern, you can contact Customer Support in the following ways:</Text>
+                        <ul>
+                            <li><a href="./">Flight Problems</a></li>
+                            <li><a href="./">Rebooking</a></li>
+                            <li><a href={redirectLoc} onclick={saveMouseLog()}>Delay/Cancellation Refunds</a></li>
+                            <li><a href="./">General Concerns</a></li>
+                        </ul>
+                    </Collapse>
+                    <Collapse title="How does the BudgetBird Miles program work?">
+                        <Text>For every 100 kilometers travelled on any flight with BudgetBird Airlines, you will gain one BudgetBird Mile. These BudgetBird Miles can be used within the BudgetBird Miles Store, in exchange for goodies, discounts or free BudgetBird flight tickets.</Text>
+                    </Collapse>
+                </Collapse.Group>
+            </StudySite>);
+}
+
+export default StartPage1;