summaryrefslogtreecommitdiff
path: root/geshem/app/components/Geshem.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'geshem/app/components/Geshem.tsx')
-rw-r--r--geshem/app/components/Geshem.tsx80
1 files changed, 0 insertions, 80 deletions
diff --git a/geshem/app/components/Geshem.tsx b/geshem/app/components/Geshem.tsx
deleted file mode 100644
index 50659be..0000000
--- a/geshem/app/components/Geshem.tsx
+++ /dev/null
@@ -1,80 +0,0 @@
-"use client"
-
-import React, { useState, useEffect } from "react";
-// import { BrowserRouter, Route, Routes } from "react-router-dom";
-
-import { Map } from "./Map";
-import { Slider } from "./Slider";
-import { DateTime } from "./Datetime";
-import { IMAGES_BASE_URL, PLAYBACK_HOURS, PLAYBACK_SLOTS } from "./config";
-
-// import "./Geshem.css";
-import "rc-slider/assets/index.css";
-
-// export function App() {
-// return (
-// <BrowserRouter>
-// <Routes>
-// <Route path="/" element={<Geshem />} />
-// <Route path="/history/:date" element={<Geshem />} />
-// </Routes>
-// </BrowserRouter>
-// );
-// }
-
-interface GeshemProps {
- date?: string
-}
-
-export function Geshem({ date }: GeshemProps) {
- const [images, setImages] = useState<string[]>([]);
- const [playback] = useState(
- date ||
- new URL(window.location.toString()).searchParams.get("history") ||
- undefined
- );
- const [slider, setSlider] = useState(playback ? PLAYBACK_SLOTS : 9);
-
- useEffect(() => {
- const fetchImages = async () =>
- fetch(`${IMAGES_BASE_URL}/imgs.json`)
- .then(res => res.json())
- .then(imgs => imgs["280"])
- .then(setImages);
-
- const buildPlayback = async () => {
- const date = playback;
- const hours = Array.from(Array(PLAYBACK_HOURS).keys()).map(
- h => `${String(h).padStart(2, "0")}`
- );
- const minutes = Array.from(Array(6).keys()).map(
- m => `${String(m * 10).padStart(2, "0")}`
- );
- const paths = hours.reduce<string[]>(
- (acc, h) =>
- acc.concat(minutes.map(m => `imgs/${date}/${h}${m}/280.png`)),
- []
- );
- setImages(paths);
- };
-
- let timer: number;
- if (playback) buildPlayback();
- else {
- fetchImages();
- timer = window.setInterval(fetchImages, 60 * 1000);
- }
-
- return () => {
- if (timer !== undefined) clearInterval(timer);
- };
- }, [playback]);
-
- return (
- <>
- <Map images={images} slider={slider} />
- <DateTime images={images} slider={slider} />
- <Slider slider={slider} playback={playback} setSlider={setSlider} />
- </>
- );
-}