From 103167a6f1945b44782873a559157a18ed032515 Mon Sep 17 00:00:00 2001
From: Peter Ludikovsky <peter@ludikovsky.name>
Date: Thu, 27 Dec 2018 17:26:05 +0100
Subject: [PATCH] =?UTF-8?q?Offen/Geschlossen-Info=20sch=C3=B6n=20im=20Pop-?=
 =?UTF-8?q?Up?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 icons/font-awesome/lock-open-solid.svg |  1 +
 icons/font-awesome/lock-solid.svg      |  1 +
 popup/index.css                        | 10 +++++++++-
 popup/index.html                       |  2 ++
 popup/index.js                         | 12 ++++++++++++
 5 files changed, 25 insertions(+), 1 deletion(-)
 create mode 100644 icons/font-awesome/lock-open-solid.svg
 create mode 100644 icons/font-awesome/lock-solid.svg

diff --git a/icons/font-awesome/lock-open-solid.svg b/icons/font-awesome/lock-open-solid.svg
new file mode 100644
index 0000000..90756e8
--- /dev/null
+++ b/icons/font-awesome/lock-open-solid.svg
@@ -0,0 +1 @@
+<svg aria-hidden="true" data-prefix="fas" data-icon="lock-open" class="svg-inline--fa fa-lock-open fa-w-18" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentColor" d="M423.5 0C339.5.3 272 69.5 272 153.5V224H48c-26.5 0-48 21.5-48 48v192c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V272c0-26.5-21.5-48-48-48h-48v-71.1c0-39.6 31.7-72.5 71.3-72.9 40-.4 72.7 32.1 72.7 72v80c0 13.3 10.7 24 24 24h32c13.3 0 24-10.7 24-24v-80C576 68 507.5-.3 423.5 0z"></path></svg>
\ No newline at end of file
diff --git a/icons/font-awesome/lock-solid.svg b/icons/font-awesome/lock-solid.svg
new file mode 100644
index 0000000..a30c315
--- /dev/null
+++ b/icons/font-awesome/lock-solid.svg
@@ -0,0 +1 @@
+<svg aria-hidden="true" data-prefix="fas" data-icon="lock" class="svg-inline--fa fa-lock fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M400 224h-24v-72C376 68.2 307.8 0 224 0S72 68.2 72 152v72H48c-26.5 0-48 21.5-48 48v192c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V272c0-26.5-21.5-48-48-48zm-104 0H152v-72c0-39.7 32.3-72 72-72s72 32.3 72 72v72z"></path></svg>
\ No newline at end of file
diff --git a/popup/index.css b/popup/index.css
index 72e175c..adaa9d1 100644
--- a/popup/index.css
+++ b/popup/index.css
@@ -15,6 +15,14 @@ h2 {
     vertical-align: text-bottom;
 }
 
+#state {
+    margin: 0 8px;
+}
+#state > img {
+    vertical-align: text-bottom;
+    margin-right: 4px;
+}
+
 #calendar {
     margin: 0 8px;
 }
@@ -34,4 +42,4 @@ h2 {
 #space-api code {
     font-family: monospace;
     font-size: 10px;
-}
\ No newline at end of file
+}
diff --git a/popup/index.html b/popup/index.html
index d845e7c..5c3ab75 100644
--- a/popup/index.html
+++ b/popup/index.html
@@ -10,6 +10,8 @@
     <div class="icon-section-header"><img src="../icons/logo.svg" width="32" height="32" alt="/usr/space" /></div>
     <div class="text-section-header">/usr/space</div>
   </header>
+  <h2>Aktueller Status</h2>
+  <div id="state">loading...</div>
   <h2>Links</h2>
   <div class="panel-section panel-section-list">
     <div class="panel-list-item link" data-url="https://usrspace.at/">
diff --git a/popup/index.js b/popup/index.js
index 47492b2..21690f2 100644
--- a/popup/index.js
+++ b/popup/index.js
@@ -14,6 +14,7 @@ Array.from(document.getElementsByClassName('link')).forEach((element) => {
 browser.runtime.getBackgroundPage().then((page) => {
   updateNextEvent(page.calendar[0]);
   updateSpaceApiJson(page.spaceApi);
+  updateState(page.spaceApi);
 }).catch((error) => {
   console.error(error);
 });
@@ -41,3 +42,14 @@ const updateSpaceApiJson = (spaceApi) => {
   // spaceApiElement.innerText = '';
   // spaceApiElement.append(jsonNode);
 };
+
+const updateState = (spaceApi) => {
+  const stateElement = document.getElementById('state');
+  const isOpen = spaceApi.state.open;
+  const since = new Date(spaceApi.state.lastchange * 1000);
+  const sinceStr = ' seit <time datetime="' + since.toISOString() + '">' + since.toLocaleString() + '</time>';
+  if (isOpen)
+    stateElement.innerHTML = '<div class="icon"><img src="../icons/font-awesome/lock-open-solid.svg" width="19" height="19" alt="Offen" />Offen' + sinceStr;
+  else
+    stateElement.innerHTML = '<div class="icon"><img src="../icons/font-awesome/lock-solid.svg" width="19" height="19" alt="Geschlossen" />Geschlossen' + sinceStr;
+};