Gay ass

frontend/src/pages/AdminFrame.tsx

@@ -1,13 +1,22 @@
 import { Box } from "@mui/material";
-import { Route, Routes } from "react-router-dom";
+import { Route, Routes, useLocation, useNavigate } from "react-router-dom";
 import Sidebar from "../components/Sidebar";
 import Dashboard from "./admin/Dashboard";
 import Benutzer from "./admin/Benutzer";
 import Logout from "./admin/Logout";
 import Kalender from "./admin/Kalender";
 import ManageData from "./admin/ManageData";
+import { useEffect } from "react";
+import { getBaseURL } from "../functions";
 
 function AdminFrame() {
+  const location = useLocation();
+  const navigate = useNavigate();
+
+  useEffect(() => {
+    if (!localStorage.getItem("token") && location.pathname !== "/login") navigate("/login");
+  }, []);
+
   return (
     <Box
       sx={{

frontend/src/pages/LandingPage.tsx

@@ -36,7 +36,7 @@ function LandingPage() {
         if (prev === data.length - 1) return 0;
         else return prev + 1;
       });
-    }, 5000);
+    }, 8000);
 
     return () => clearInterval(interval);
   }, [data]);
@@ -49,6 +49,8 @@ function LandingPage() {
     return () => clearInterval(interval);
   }, []);
 
+
+
   return (
     <>
       <Box
@@ -58,14 +60,19 @@ function LandingPage() {
           position: "absolute",
           top: 0,
           left: 0,
-          flexDirection: "column",
+
-          justifyContent: "center",
+          display: "flex",  
+          justifyContent: "flex-start",
           alignItems: "center",
+          flexDirection: "column",
+          padding: "10px",
+          zIndex: 1000,
         }}
       >
         {/* <PhilSwift /> */}
+        <img src="/logo.png" alt="" style={{ width: "auto", height: "100px" }} />
       </Box>
-
+      <ParticleSimulation data={data} currEvent={currEvent} />
       <Box
         sx={{
           display: "center",
@@ -131,3 +138,137 @@ function LandingPage() {
 }
 
 export default LandingPage;
+
+interface Particle {
+  x: number;
+  y: number;
+  dx: number;
+  dy: number;
+  size: number;
+  color: string;
+}
+
+function ParticleSimulation({
+  data,
+  currEvent,
+} : {
+  data: EmployeeWithColor[],
+  currEvent: number,
+}): JSX.Element {
+  const currColor = data[currEvent]?.color || "hsl(0, 100%, 50%)";
+
+  const [particles, setParticles] = useState<Particle[]>([]);
+
+  useEffect(() => {
+    setParticles([])
+
+    // initialize particles
+    for (let i = 0; i < 100; i++) {
+      const size = Math.random() * 8 + 5;
+      const x = Math.random() * window.innerWidth;
+      const y = Math.random() * window.innerHeight;
+      const dx = (Math.random() - 0.5) * 5;
+      const dy = 2;
+      // random color
+      const color = `hsl(${Math.random() * 360}, 100%, 50%)`;
+      setParticles((prev) => [...prev, { x, y, dx, dy, size, color }]);
+    }
+
+    const cursor: {
+      x: number;
+      y: number;
+    } = {
+      x: 0,
+      y: 0,
+    };
+
+    const cursorMove = (e: MouseEvent) => {
+      cursor.x = e.clientX;
+      cursor.y = e.clientY;
+    };
+
+    document.addEventListener("mousemove", cursorMove);
+
+    const interval = setInterval(() => {
+      setParticles((prev) =>
+        prev.map((particle) => {
+          // make the particles just fall down and then reappear at the top
+          let x = particle.x + particle.dx;
+          let y = particle.y + particle.dy;
+          if (x > window.innerWidth || x < 0) {
+            x = Math.random() * window.innerWidth;
+            y = 0;
+          }
+          if (y > window.innerHeight || y < 0) {
+            x = Math.random() * window.innerWidth;
+            y = 0;
+          }
+
+          // make them collide with the text each other
+          // for (let i = 0; i < prev.length; i++) {
+          //   if (i === prev.indexOf(particle)) continue;
+          //   const other = prev[i];
+          //   const dx = x - other.x;
+          //   const dy = y - other.y;
+          //   const distance = Math.sqrt(dx * dx + dy * dy);
+          //   if (distance < particle.size + other.size) {
+          //     particle.dx = -particle.dx;
+          //     particle.dy = -particle.dy;
+          //   }
+          // }
+
+          // make them collide with the cursor
+          // const distance = dist(x, y, cursor.x, cursor.y);
+          // if(distance < 10) {
+          //   particle.dx = -particle.dx
+          //   particle.dy = -particle.dy
+          // }
+
+          return { ...particle, x, y };
+        })
+      );
+    }, 1000 / 60); // 60 fps
+
+    return () => {
+      clearInterval(interval);
+      document.removeEventListener("mousemove", cursorMove);
+    }
+  }, []);
+
+  return (
+    <Box
+      sx={{
+        width: "100%",
+        height: "100%",
+        position: "absolute",
+        top: 0,
+        left: 0,
+        zIndex: -1000,
+        overflow: "hidden",
+      }}
+    >
+      {particles.map((particle, index) => {
+        return (
+          <Box
+            key={index}
+            style={{
+              width: `${particle.size}px`,
+              height: `${particle.size}px`,
+              backgroundColor: particle.color,
+              position: "absolute",
+              top: `${particle.y}px`,
+              left: `${particle.x}px`,
+              borderRadius: "50%",
+              zIndex: 0,
+              transition: "background-color 5s ease-in-out",
+            }}
+          />
+        );
+      })}
+    </Box>
+  );
+}
+
+function dist(x1: number, y1: number, x2: number, y2: number) {
+  return Math.sqrt((x1 - x2) ** 2 + (y1 - y2) ** 2);
+}

frontend/src/pages/admin/ManageData.tsx

@@ -827,28 +827,29 @@ function UploadPopUp(
             reader.onload = (e) => {
               const result = e.target?.result as string;
 
-              const data: PapaParse.ParseResult<string[]> = PapaParse.parse(result)
+              const data: PapaParse.ParseResult<string[]> = PapaParse.parse(result.trim())
 
               if((data.data[0]).length !== 4) return setError("CSV Datei ist nicht im richtigen Format");
               if(data.data[0][0] !== "Vorname") return setError("CSV Datei ist nicht im richtigen Format");
               if(data.data[0][1] !== "Nachname") return setError("CSV Datei ist nicht im richtigen Format");
-              if(data.data[0][2] !== "Geburtstag") return setError("CSV Datei ist nicht im richtigen Format");
+              if(data.data[0][2] !== "Anstelldatum") return setError("CSV Datei ist nicht im richtigen Format");
-              if(data.data[0][3] !== "Anstelldatum") return setError("CSV Datei ist nicht im richtigen Format");
+              if(data.data[0][3] !== "Geburtstag") return setError("CSV Datei ist nicht im richtigen Format");
 
               const employees: EmployeePartial[] = [];
               for(let i = 1; i < data.data.length; i++) {
                 const employee = data.data[i];
-                if(employee.length !== 4) return setError("CSV Datei ist nicht im richtigen Format");
+                if(employee === null || employee.length === 0) continue;
+                if(employee.length !== 4) return setError("CSV Datei ist nicht im richtigen Format. (Zeile: " + (i + 1).toString() + ")");
                 if(employee[0].length > 24) return setError("Vorname ist zu lang");
                 if(employee[1].length > 24) return setError("Nachname ist zu lang");
-                if(employee[2] !== "" && !moment(employee[2], "DD.MM.YYYY", true).isValid()) return setError("Geburtstag ist nicht im richtigen Format");
+                if(employee[2] !== "" && !moment(employee[2], "DD.MM.YYYY", true).isValid()) return setError("Anstelldatum ist nicht im richtigen Format \n Zeile: " + (i + 1).toString());
-                if(employee[3] !== "" && !moment(employee[3], "DD.MM.YYYY", true).isValid()) return setError("Anstelldatum ist nicht im richtigen Format");
+                if(employee[3] !== "" && !moment(employee[3], "DD.MM.YYYY", true).isValid()) return setError("Geburtstag ist nicht im richtigen Format \n Zeile: " + (i + 1).toString());
 
                 employees.push({
                   Vorname: employee[0],
                   Nachname: employee[1],
-                  Geburtstag: employee[2] === "" ? null : moment(employee[2], "DD.MM.YYYY"),
+                  Anstelldatum: employee[2] === "" ? null : moment(employee[2], "DD.MM.YYYY"),
-                  Anstelldatum: employee[3] === "" ? null : moment(employee[3], "DD.MM.YYYY"),
+                  Geburtstag: employee[3] === "" ? null : moment(employee[3], "DD.MM.YYYY"),
                 });
               }
 
@@ -874,10 +875,22 @@ function UploadPopUp(
             disabled={loading || !data}
             onClick={() => {
               setLoading(true);
-              axios.put(`${getBaseURL()}/api/employees`, data, {
+              axios.put(`${getBaseURL()}/api/employees`, data?.map((e) => ({
+                Vorname: e.Vorname,
+                Nachname: e.Nachname,
+                Geburtstag: e.Geburtstag ? moment(e.Geburtstag).add(1, "day").toDate().getTime() : null,
+                Anstelldatum: e.Anstelldatum ? moment(e.Anstelldatum).add(1, "day").toDate().getTime() : null,
+              })), {
                 headers: {
                   Authorization: `Bearer ${localStorage.getItem("token")}`,
                 },
+              }).then(() => {
+                setUploadPopup(false);
+                setLoading(false);
+              }).catch((err) => {
+                console.log(err);
+                setLoading(false);
+                setError(`Fehler beim Hochladen: ${err.response.data.message}`);
               })
             }}
           >