From 36f920064da7ccf654ece3ad7815b97f30a27534 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Miko=C5=82aj=20Pich?= <m.pich@outlook.com>
Date: Thu, 14 Jun 2018 19:08:39 +0200
Subject: [PATCH] Add date to download buttons

---
 app.css    | 21 +++++++++++++++++----
 app.js     | 19 +++++++++++--------
 index.html | 32 +++++++++++++++++++++-----------
 3 files changed, 49 insertions(+), 23 deletions(-)

diff --git a/app.css b/app.css
index 5508068..fc01a7e 100644
--- a/app.css
+++ b/app.css
@@ -82,14 +82,18 @@ a {
     max-width: 300px;
 }
 
+.button-container {
+    display: inline-block;
+}
+
 .button {
-    width: 100%;
-    max-width: 300px;
+    max-width: 100%;
+    width: 300px;
     margin: 10px 0;
     background: rgb(112, 50, 50);
     border-radius: 3px;
     color: #eee;
-    display: inline-block;
+    display: block;
     font-size: 20px;
     padding: 15px 25px;
     text-align: left;
@@ -97,6 +101,13 @@ a {
     transition: background 0.3s;
 }
 
+.button__info {
+    padding: 0;
+    margin: 5px 0 0;
+    display: flex;
+    justify-content: space-between;
+}
+
 .button:hover, .button:focus, .button:active {
     background: rgb(90, 45, 45);
 }
@@ -119,8 +130,10 @@ a {
     opacity: 0.7;
 }
 
-[id$="version"] {
+.button span {
     font-size: small;
+    display: flex;
+    justify-content: space-between;
 }
 
 .footer {
diff --git a/app.js b/app.js
index a6461f1..c20f31f 100644
--- a/app.js
+++ b/app.js
@@ -1,16 +1,17 @@
 var disableClick = function(e) {e.preventDefault()};
 
-var addButtonInfo = function(url, button, version, cb) {
-    var buttonElement = document.querySelector(button);
+var addButtonInfo = function(url, prefix, cb) {
+    var buttonElement = document.querySelector("#" + prefix + "-button");
     buttonElement.addEventListener("click", disableClick);
-    var versionElement = document.querySelector(version);
+    var versionElement = document.querySelector("#" + prefix + "-version");
     versionElement.innerHTML = "Ładowanie…";
+    var dateElement = document.querySelector("#" + prefix + "-date");
 
     var res = new XMLHttpRequest();
     res.open("GET", url, true);
     res.onloadend = function () {
         if(res.status === 200) {
-            cb(buttonElement, versionElement, res);
+            cb(res, buttonElement, versionElement, dateElement);
         } else {
             versionElement.innerHTML = "wersja nieznana";
         }
@@ -19,19 +20,21 @@ var addButtonInfo = function(url, button, version, cb) {
     res.send(null);
 };
 
-addButtonInfo("https://api.github.com/repos/wulkanowy/wulkanowy/releases/latest", "#beta-button", "#beta-version",
-    function(button, version, res) {
+addButtonInfo("https://api.github.com/repos/wulkanowy/wulkanowy/releases/latest", "beta",
+    function(res, button, version, date) {
         var json = JSON.parse(res.responseText);
         button.href = json.assets[0].browser_download_url;
         version.innerHTML = "v" + json.name;
+        date.innerHTML = new Date(json.published_at).toLocaleString("pl-PL");
     }
 );
 
-addButtonInfo("https://bitrise-redirector.herokuapp.com/v0.1/apps/daeff1893f3c8128/builds/master/artifacts/app-debug-bitrise-signed.apk/info", "#dev-button", "#dev-version",
-    function(button, version, res) {
+addButtonInfo("https://bitrise-redirector.herokuapp.com/v0.1/apps/daeff1893f3c8128/builds/master/artifacts/app-debug-bitrise-signed.apk/info", "dev",
+    function(res, button, version, date) {
         var json = JSON.parse(res.responseText);
         button.href = json.expiring_download_url;
         version.innerHTML = "Build " + json.build_number;
+        date.innerHTML = new Date(json.finished_at).toLocaleString("pl-PL");
 
         setTimeout(function() {
             button.href = json.public_install_page_url;
diff --git a/index.html b/index.html
index e428ef0..ceedd24 100644
--- a/index.html
+++ b/index.html
@@ -32,17 +32,27 @@
             </a>
             <section class="section">
                 <h3 class="section__header">Więcej opcji</h3>
-                <a class="button button--beta" id="beta-button" title="Pobierz wersję beta" href="https://github.com/wulkanowy/wulkanowy/releases">
-                    Pobierz wersję beta<br>
-                    <span id="beta-version">v0.0.0</span>
-                </a>
-                <a class="button button--dev"
-                   id="dev-button"
-                   title="Pobierz wersję DEV"
-                   href="https://bitrise-redirector.herokuapp.com/v0.1/apps/daeff1893f3c8128/builds/master/artifacts/app-debug-bitrise-signed.apk">
-                    Pobierz wersję DEV<br>
-                    <span id="dev-version">Build 0000</span>
-                </a>
+                <div class="button-container">
+                    <a class="button button--beta" id="beta-button" title="Pobierz wersję beta" href="https://github.com/wulkanowy/wulkanowy/releases">
+                        Pobierz wersję beta
+                        <p class="button__info">
+                            <span id="beta-version">v0.0.0</span>
+                            <span id="beta-date"></span>
+                        </p>
+                    </a>
+                </div>
+                <div class="button-container">
+                    <a class="button button--dev"
+                       id="dev-button"
+                       title="Pobierz wersję DEV"
+                       href="https://bitrise-redirector.herokuapp.com/v0.1/apps/daeff1893f3c8128/builds/master/artifacts/app-debug-bitrise-signed.apk">
+                        Pobierz wersję DEV
+                        <p class="button__info">
+                            <span id="dev-version">Build 0000</span>
+                            <span id="dev-date"></span>
+                        </p>
+                    </a>
+                </div>
             </section>
         </main>
         <footer id="footer" class="footer">