From 0f22bb416d1885d8e7344f21107bc24cb9aa013e Mon Sep 17 00:00:00 2001
From: Yuval Adam <_@yuv.al>
Date: Sat, 2 Nov 2019 13:21:11 +0200
Subject: Initial info component

---
 src/Geshem.js |  2 ++
 src/Info.js   | 24 ++++++++++++++++++++++++
 2 files changed, 26 insertions(+)
 create mode 100644 src/Info.js

(limited to 'src')

diff --git a/src/Geshem.js b/src/Geshem.js
index 3c816e6..559f73d 100644
--- a/src/Geshem.js
+++ b/src/Geshem.js
@@ -4,6 +4,7 @@ import { BrowserRouter as Router, Route } from "react-router-dom";
 import Map from "./Map";
 import Slider from "./Slider";
 import DateTime from "./Datetime";
+import Info from "./Info";
 
 import { IMAGES_BASE_URL } from "./config";
 
@@ -68,6 +69,7 @@ function Geshem(props) {
       <Map images={images} slider={slider} />
       <DateTime images={images} slider={slider} />
       <Slider slider={slider} playback={playback} setSlider={setSlider} />
+      <Info />
     </>
   );
 }
diff --git a/src/Info.js b/src/Info.js
new file mode 100644
index 0000000..dd04a08
--- /dev/null
+++ b/src/Info.js
@@ -0,0 +1,24 @@
+import React from "react";
+
+function Info(props) {
+  const [open, setOpen] = useState(false);
+
+  if (images.length > 0) {
+    const ds = images[slider].substr(5, 13);
+    datetime = LuxonDateTime.fromFormat(ds, "yyyyMMdd/HHmm", {
+      zone: "utc"
+    }).setZone("Asia/Jerusalem");
+  }
+
+  const date = datetime ? datetime.toFormat("dd-MM-y") : "";
+  const time = datetime ? datetime.toFormat("HH:mm") : "";
+
+  return (
+    <div id="info">
+      <div id="info-button">?</div>
+      <div id="info-modal">This is the info page</div>
+    </div>
+  );
+}
+
+export default Info;
-- 
cgit v1.3.1