diff --git a/index.html b/index.html index 272eef3..2a8d986 100644 --- a/index.html +++ b/index.html @@ -147,18 +147,18 @@

- +
- +
- +
- +
diff --git a/lib/password_template.html b/lib/password_template.html index 8eaae32..415e045 100644 --- a/lib/password_template.html +++ b/lib/password_template.html @@ -70,6 +70,12 @@ } .staticrypt-body { + height: 100%; + margin: 0; + } + + .staticrypt-content { + height: 100%; margin-bottom: 1em; background: #76b852; /* fallback for old browsers */ background: -webkit-linear-gradient(right, #76b852, #8DC26F); @@ -125,41 +131,82 @@ .hidden { display: none !important; } + + .staticrypt-spinner-container { + height: 100%; + display: flex; + align-items: center; + justify-content: center; + } + + .staticrypt-spinner { + display: inline-block; + width: 2rem; + height: 2rem; + vertical-align: text-bottom; + border: 0.25em solid gray; + border-right-color: transparent; + border-radius: 50%; + -webkit-animation: spinner-border .75s linear infinite; + animation: spinner-border .75s linear infinite; + animation-duration: 0.75s; + animation-timing-function: linear; + animation-delay: 0s; + animation-iteration-count: infinite; + animation-direction: normal; + animation-fill-mode: none; + animation-play-state: running; + animation-name: spinner-border; + } + + @keyframes spinner-border { + 100% { + transform: rotate(360deg); + } + } -
-
-
-

{title}

-

{instructions}

-
-
- -
- +
+
+
- +
- {crypto_tag} @@ -205,41 +252,67 @@ localStorage.removeItem(rememberExpirationKey); } - // try to automatically decrypt on load if there is a saved password - window.onload = function () { - if (isRememberEnabled) { - // show the remember me checkbox - document.getElementById('staticrypt-remember-label').classList.remove('hidden'); + /** + * To be called on load: check if we want to try to decrypt and replace the HTML with the decrypted content, and + * try to do it if needed. + * + * @returns {boolean} true if we derypted and replaced the whole page, false otherwise + */ + function decryptOnLoadFromRememberMe() { + if (!isRememberEnabled) { + return false; + } - // if we are login out, clear the storage and terminate - var queryParams = new URLSearchParams(window.location.search); + // show the remember me checkbox + document.getElementById('staticrypt-remember-label').classList.remove('hidden'); - if (queryParams.has("staticrypt_logout")) { - return clearLocalStorage(); - } + // if we are login out, clear the storage and terminate + var queryParams = new URLSearchParams(window.location.search); - // if there is expiration configured, check if we're not beyond the expiration - if (rememberDurationInDays && rememberDurationInDays > 0) { - var expiration = localStorage.getItem(rememberExpirationKey), - isExpired = expiration && new Date().getTime() > parseInt(expiration); + if (queryParams.has("staticrypt_logout")) { + clearLocalStorage(); + return false; + } - if (isExpired) { - return clearLocalStorage(); - } + // if there is expiration configured, check if we're not beyond the expiration + if (rememberDurationInDays && rememberDurationInDays > 0) { + var expiration = localStorage.getItem(rememberExpirationKey), + isExpired = expiration && new Date().getTime() > parseInt(expiration); + + if (isExpired) { + clearLocalStorage(); + return false; } + } - var hashedPassphrase = localStorage.getItem(rememberPassphraseKey); + var hashedPassphrase = localStorage.getItem(rememberPassphraseKey); - if (hashedPassphrase) { - // try to decrypt - var isDecryptionSuccessful = decryptAndReplaceHtml(hashedPassphrase); + if (hashedPassphrase) { + // try to decrypt + var isDecryptionSuccessful = decryptAndReplaceHtml(hashedPassphrase); - // if the decryption is unsuccessful the password might be wrong - silently clear the saved data and let - // the user fill the password form again - if (!isDecryptionSuccessful) { - return clearLocalStorage(); - } + // if the decryption is unsuccessful the password might be wrong - silently clear the saved data and let + // the user fill the password form again + if (!isDecryptionSuccessful) { + clearLocalStorage(); + return false; } + + return true; + } + + return false; + } + + // try to automatically decrypt on load if there is a saved password + window.onload = function () { + var hasDecrypted = decryptOnLoadFromRememberMe(); + + // if we didn't decrypt anything, show the password prompt. Otherwise the content has already been replaced, no + // need to do anything + if (!hasDecrypted) { + document.getElementById("staticrypt_loading").classList.add("hidden"); + document.getElementById("staticrypt_content").classList.remove("hidden"); } }