add warning message to tokeninfo to indicate users must copy mytoken; close #156

Author: zachmann

internal/server/web/partials/tokeninfo.mustache

@@ -58,6 +58,13 @@
                 <i class="fas fa-trash"></i>
             </button>
         </div>
+
+        <div class="alert alert-dismissible alert-danger mt-3 d-none" id="token-gone-warning">
+            <button type="button" class="close" data-dismiss="alert">&times;</button>
+            <h4 class="alert-heading">Do not loose access to your mytoken!</h4>
+            <p>To keep access to your mytoken you <strong>must</strong> copy it to a safe location, as
+                you will not be able to retrieve it again from this website.</p>
+        </div>
     </div>
 
     <div class="card-header mt-3">

internal/server/web/static/js/tokeninfo-status.js

@@ -12,16 +12,23 @@ const $tokeninfoBadgeIat = $('#tokeninfo-token-iat');
 const $tokeninfoBadgeExp = $('#tokeninfo-token-exp');
 const $tokeninfoBadgeIatDate = $('#tokeninfo-token-iat-date');
 const $tokeninfoBadgeExpDate = $('#tokeninfo-token-exp-date');
-
 const $tokeninfoTypeBadges = $('.tokeninfo-token-type');
+const $tokeninfoTokenGoneWarningMsg = $('#token-gone-warning');
 
+$('#tokeninfo-token-copy').on('click', function () {
+    if (!$tokeninfoTokenGoneWarningMsg.hasClass('d-none')) {
+        $tokeninfoTokenGoneWarningMsg.alert('close');
+    }
+});
 
 async function update_tokeninfo() {
     let token = storagePop('tokeninfo_token', true);
     if (token === "") {
         token = $tokenInput.val();
+        $tokeninfoTokenGoneWarningMsg.hideB();
     } else {
         $tokenInput.val(token);
+        $tokeninfoTokenGoneWarningMsg.showB();
     }
     let payload = {};
     if (token === "") {