2023-04-19 09:19:37 +00:00
<!DOCTYPE html>
2017-04-29 13:14:06 +00:00
< html >
2023-04-19 09:19:37 +00:00
< head >
< meta charset = "utf-8" / >
< title > StatiCrypt: Password protect static HTML< / title >
< meta name = "description" content = "" / >
< meta name = "viewport" content = "width=device-width, initial-scale=1" / >
< link
rel="stylesheet"
type="text/css"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
crossorigin="anonymous"
/>
< style >
a.no-style {
color: inherit;
text-decoration: inherit;
}
2017-06-14 14:19:24 +00:00
2023-04-19 09:19:37 +00:00
body {
font-size: 16px;
}
2017-06-15 15:48:20 +00:00
2023-04-19 09:19:37 +00:00
label.no-style {
font-weight: normal;
}
< / style >
< / head >
< body >
< div class = "container" >
< div class = "row" >
< div class = "col-xs-12" >
< h1 >
StatiCrypt
< div class = "pull-right" >
< iframe
src="https://ghbtns.com/github-btn.html?user=robinmoisson& repo=staticrypt& type=star& size=large"
frameborder="0"
scrolling="0"
width="80px"
height="30px"
>< / iframe >
< iframe
src="https://ghbtns.com/github-btn.html?user=robinmoisson& repo=staticrypt& type=fork& size=large"
frameborder="0"
scrolling="0"
width="80px"
height="30px"
>< / iframe >
< / div >
< br / >
< small > Password protect a static HTML page< / small >
< / h1 >
< p >
StatiCrypt uses AES-256 with WebCrypto to encrypt your html string with your long password, in
your browser (client side).
< / p >
< p >
Download your encrypted string in a HTML page with a password prompt you can upload anywhere
(see < a target = "_blank" href = "example/encrypted/example.html" > example< / a > ).
< / p >
< p >
The tool is also available as
< a href = "https://npmjs.com/package/staticrypt" > a CLI on NPM< / a > and is
< a href = "https://github.com/robinmoisson/staticrypt" > open source on GitHub< / a > .
< / p >
< br / >
< h4 >
< a class = "no-style" id = "toggle-concept" href = "#" >
< span id = "toggle-concept-sign" > ►< / span > HOW IT WORKS
< / a >
< / h4 >
< div id = "concept" class = "hidden" >
< p >
< b class = "text-danger" > Disclaimer< / b > if you are an at-risk activist, or have extra
sensitive banking data, you should probably use something else!
< / p >
< p >
StatiCrypt generates a static, password protected page that can be decrypted in-browser:
just send or upload the generated page to a place serving static content (github pages, for
example) and you're done: the javascript will prompt users for password, decrypt the page
and load your HTML.
< / p >
< p >
The page is encrypted with AES-256 in CBC mode (see why this mode is appropriate for
StatiCrypt in
< a href = "https://github.com/robinmoisson/staticrypt/issues/19" > #19< / a > ). The password is
hashed with PBKDF2 (599k iterations with SHA-256, plus 1k with SHA-1 for legacy reasons (see
< a href = "https://github.com/robinmoisson/staticrypt/issues/159" > #159< / a > ), for the added
< a
href="https://cheatsheetseries.owasp.org/cheatsheets/Password_Storage_Cheat_Sheet.html#pbkdf2"
>recommended total< /a
>
of 600k) and used to encrypt the page.
< / p >
< p >
It basically encrypts your page and puts everything with a user-friendly way to use a
password in the new file. AES-256 is state of the art but
< b
>brute-force/dictionary attacks would be easy to do at a really fast pace: use a long,
unusual password!< /b
>
< br / >
=> To be safe, we recommend 16+ alphanum characters, and using a password manager like the
open-source < a href = "http://bitwarden.com" > Bitwarden< / a > .
< / p >
< p >
Feel free to contribute or report any thought to the
< a href = "https://github.com/robinmoisson/staticrypt" > GitHub project< / a > .
< / p >
< / div >
< br / >
2017-06-14 14:19:24 +00:00
< / div >
< / div >
2023-04-19 09:19:37 +00:00
< div class = "row" >
< div class = "col-xs-12" >
< form id = "encrypt_form" >
< div class = "form-group" >
< label for = "password" > Password< / label >
< input
type="password"
class="form-control"
id="password"
placeholder="Password (choose a long one!)"
/>
< / div >
< div class = "form-group" >
< label for = "unencrypted_html" > HTML/string to encrypt< / label >
< textarea
class="form-control"
id="unencrypted_html"
placeholder="< html > < head > ..."
rows="5"
>< / textarea >
< / div >
< div class = "form-group" >
< label class = "no-style" >
< input type = "checkbox" id = "remember" checked / >
Add "Remember me" checkbox (append < code > #staticrypt_logout< / code > to your URL to
logout)
< small >
< abbr
class="text-muted"
title='The password will be stored in clear text in the browser' s localStorage upon entry by the user. See "More options" to set the expiration (default: none)'
>
(?)
< / abbr >
< / small >
< / label >
< / div >
< p >
< a href = "#" id = "toggle-extra-option" > + More options< / a >
< / p >
< div id = "extra-options" class = "hidden" >
< div class = "form-group" >
< label for = "template_title" > Page title< / label >
< input
type="text"
class="form-control"
id="template_title"
placeholder="Default: 'Protected Page'"
/>
< / div >
< div class = "form-group" >
< label for = "template_instructions" > Instructions to display the user< / label >
< textarea
class="form-control"
id="template_instructions"
placeholder="Default: nothing."
>< / textarea >
< / div >
< div class = "form-group" >
< label for = "template_placeholder" > Password input placeholder< / label >
< input
type="text"
class="form-control"
id="template_placeholder"
placeholder="Default: 'Password'"
/>
< / div >
< div class = "form-group" >
< label for = "template_remember" > "Remember me" checkbox label< / label >
< input
type="text"
class="form-control"
id="template_remember"
placeholder="Default: 'Remember me'"
/>
< / div >
< div class = "form-group" >
< label for = "remember_in_days" > "Remember me" expiration in days< / label >
< input
type="number"
class="form-control"
id="remember_in_days"
step="any"
placeholder="Default: 0 (no expiration)"
/>
< small class = "form-text text-muted" >
After this many days, the user will have to enter the password again. Leave empty or
set to 0 for no expiration.
< / small >
< / div >
< div class = "form-group" >
< label for = "template_button" > Decrypt button label< / label >
< input
type="text"
class="form-control"
id="template_button"
placeholder="Default: 'DECRYPT'"
/>
< / div >
2023-04-19 09:25:40 +00:00
< div class = "form-group" >
< label for = "template_color_primary" > Primary color (button, ...)< / label >
< input
type="text"
class="form-control"
id="template_color_primary"
placeholder="Default: '#4CAF50'"
/>
< / div >
< div class = "form-group" >
< label for = "template_color_secondary" > Secondary color (background, ...)< / label >
< input
type="text"
class="form-control"
id="template_color_secondary"
placeholder="Default: '#76B852'"
/>
< / div >
2023-04-19 09:19:37 +00:00
< / div >
< button class = "btn btn-primary pull-right" type = "submit" >
Generate password protected HTML
< / button >
< / form >
2022-02-10 08:22:32 +00:00
< / div >
2023-04-19 09:19:37 +00:00
< / div >
2022-02-10 08:22:32 +00:00
2023-04-19 09:19:37 +00:00
< div class = "row mb-5" >
< div class = "col-xs-12" >
< h2 > Encrypted HTML< / h2 >
< p >
< a
class="btn btn-success download"
download="encrypted.html"
id="download-link"
disabled="disabled"
>Download html file with password prompt< /a
>
< / p >
< pre id = "encrypted_html_display" > Your encrypted string< / pre >
2017-06-15 15:48:20 +00:00
< / div >
2023-04-19 09:19:37 +00:00
< / div >
2017-04-29 13:14:06 +00:00
< / div >
2023-04-19 09:19:37 +00:00
< script src = "https://cdn.ckeditor.com/4.7.0/standard/ckeditor.js" > < / script >
2017-06-19 08:46:47 +00:00
2023-04-19 09:19:37 +00:00
< script id = "cryptoEngine" >
window.cryptoEngine = ((function(){
2022-11-20 14:25:16 +00:00
const exports = {};
2023-03-29 08:50:31 +00:00
const { subtle } = crypto;
const IV_BITS = 16 * 8;
const HEX_BITS = 4;
const ENCRYPTION_ALGO = "AES-CBC";
/**
* Translates between utf8 encoded hexadecimal strings
* and Uint8Array bytes.
*/
const HexEncoder = {
/**
* hex string -> bytes
* @param {string} hexString
* @returns {Uint8Array}
*/
parse: function (hexString) {
if (hexString.length % 2 !== 0) throw "Invalid hexString";
const arrayBuffer = new Uint8Array(hexString.length / 2);
for (let i = 0; i < hexString.length ; i + = 2 ) {
const byteValue = parseInt(hexString.substring(i, i + 2), 16);
if (isNaN(byteValue)) {
throw "Invalid hexString";
}
arrayBuffer[i / 2] = byteValue;
}
return arrayBuffer;
},
/**
* bytes -> hex string
* @param {Uint8Array} bytes
* @returns {string}
*/
stringify: function (bytes) {
const hexBytes = [];
for (let i = 0; i < bytes.length ; + + i ) {
let byteString = bytes[i].toString(16);
if (byteString.length < 2 ) {
byteString = "0" + byteString;
}
hexBytes.push(byteString);
}
return hexBytes.join("");
},
};
/**
* Translates between utf8 strings and Uint8Array bytes.
*/
const UTF8Encoder = {
parse: function (str) {
return new TextEncoder().encode(str);
},
stringify: function (bytes) {
return new TextDecoder().decode(bytes);
},
};
2022-11-20 14:25:16 +00:00
/**
* Salt and encrypt a msg with a password.
*/
2023-04-19 07:57:12 +00:00
async function encrypt(msg, hashedPassword) {
2023-03-29 08:50:31 +00:00
// Must be 16 bytes, unpredictable, and preferably cryptographically random. However, it need not be secret.
// https://developer.mozilla.org/en-US/docs/Web/API/SubtleCrypto/encrypt#parameters
const iv = crypto.getRandomValues(new Uint8Array(IV_BITS / 8));
2023-04-19 09:19:37 +00:00
const key = await subtle.importKey("raw", HexEncoder.parse(hashedPassword), ENCRYPTION_ALGO, false, ["encrypt"]);
2023-03-29 08:50:31 +00:00
const encrypted = await subtle.encrypt(
{
name: ENCRYPTION_ALGO,
iv: iv,
},
key,
UTF8Encoder.parse(msg)
);
// iv will be 32 hex characters, we prepend it to the ciphertext for use in decryption
return HexEncoder.stringify(iv) + HexEncoder.stringify(new Uint8Array(encrypted));
2022-11-20 14:25:16 +00:00
}
exports.encrypt = encrypt;
/**
* Decrypt a salted msg using a password.
*
* @param {string} encryptedMsg
2023-04-19 07:57:12 +00:00
* @param {string} hashedPassword
2023-03-29 08:50:31 +00:00
* @returns {Promise< string > }
2022-11-20 14:25:16 +00:00
*/
2023-04-19 07:57:12 +00:00
async function decrypt(encryptedMsg, hashedPassword) {
2023-03-29 08:50:31 +00:00
const ivLength = IV_BITS / HEX_BITS;
const iv = HexEncoder.parse(encryptedMsg.substring(0, ivLength));
const encrypted = encryptedMsg.substring(ivLength);
2023-04-19 09:19:37 +00:00
const key = await subtle.importKey("raw", HexEncoder.parse(hashedPassword), ENCRYPTION_ALGO, false, ["decrypt"]);
2023-03-29 08:50:31 +00:00
const outBuffer = await subtle.decrypt(
{
name: ENCRYPTION_ALGO,
iv: iv,
},
key,
HexEncoder.parse(encrypted)
);
return UTF8Encoder.stringify(new Uint8Array(outBuffer));
2022-11-20 14:25:16 +00:00
}
exports.decrypt = decrypt;
/**
2023-04-19 07:57:12 +00:00
* Salt and hash the password so it can be stored in localStorage without opening a password reuse vulnerability.
2022-11-20 14:25:16 +00:00
*
2023-04-19 07:57:12 +00:00
* @param {string} password
2022-11-20 14:25:16 +00:00
* @param {string} salt
2023-03-29 08:50:31 +00:00
* @returns {Promise< string > }
2022-11-20 14:25:16 +00:00
*/
2023-04-19 07:57:12 +00:00
async function hashPassword(password, salt) {
// we hash the password in multiple steps, each adding more iterations. This is because we used to allow less
2023-03-29 08:50:31 +00:00
// iterations, so for backward compatibility reasons, we need to support going from that to more iterations.
2023-04-19 07:57:12 +00:00
let hashedPassword = await hashLegacyRound(password, salt);
2023-03-29 08:50:31 +00:00
2023-04-19 07:57:12 +00:00
hashedPassword = await hashSecondRound(hashedPassword, salt);
2023-03-01 17:46:48 +00:00
2023-04-19 07:57:12 +00:00
return hashThirdRound(hashedPassword, salt);
2023-03-01 17:46:48 +00:00
}
2023-04-19 07:57:12 +00:00
exports.hashPassword = hashPassword;
2023-03-01 17:46:48 +00:00
/**
2023-04-19 07:57:12 +00:00
* This hashes the password with 1k iterations. This is a low number, we need this function to support backwards
2023-03-01 17:46:48 +00:00
* compatibility.
*
2023-04-19 07:57:12 +00:00
* @param {string} password
2023-03-01 17:46:48 +00:00
* @param {string} salt
2023-03-29 08:50:31 +00:00
* @returns {Promise< string > }
2023-03-01 17:46:48 +00:00
*/
2023-04-19 07:57:12 +00:00
function hashLegacyRound(password, salt) {
return pbkdf2(password, salt, 1000, "SHA-1");
2023-03-01 17:46:48 +00:00
}
exports.hashLegacyRound = hashLegacyRound;
2022-11-20 14:25:16 +00:00
2023-03-01 17:46:48 +00:00
/**
* Add a second round of iterations. This is because we used to use 1k, so for backwards compatibility with
* remember-me/autodecrypt links, we need to support going from that to more iterations.
*
2023-04-19 07:57:12 +00:00
* @param hashedPassword
2023-03-01 17:46:48 +00:00
* @param salt
2023-03-29 08:50:31 +00:00
* @returns {Promise< string > }
2023-03-01 17:46:48 +00:00
*/
2023-04-19 07:57:12 +00:00
function hashSecondRound(hashedPassword, salt) {
return pbkdf2(hashedPassword, salt, 14000, "SHA-256");
2022-11-20 14:25:16 +00:00
}
2023-03-01 17:46:48 +00:00
exports.hashSecondRound = hashSecondRound;
2022-11-20 14:25:16 +00:00
2023-03-29 08:50:31 +00:00
/**
* Add a third round of iterations to bring total number to 600k. This is because we used to use 1k, then 15k, so for
* backwards compatibility with remember-me/autodecrypt links, we need to support going from that to more iterations.
*
2023-04-19 07:57:12 +00:00
* @param hashedPassword
2023-03-29 08:50:31 +00:00
* @param salt
* @returns {Promise< string > }
*/
2023-04-19 07:57:12 +00:00
function hashThirdRound(hashedPassword, salt) {
return pbkdf2(hashedPassword, salt, 585000, "SHA-256");
2023-03-29 08:50:31 +00:00
}
exports.hashThirdRound = hashThirdRound;
/**
2023-04-19 07:57:12 +00:00
* Salt and hash the password so it can be stored in localStorage without opening a password reuse vulnerability.
2023-03-29 08:50:31 +00:00
*
2023-04-19 07:57:12 +00:00
* @param {string} password
2023-03-29 08:50:31 +00:00
* @param {string} salt
* @param {int} iterations
* @param {string} hashAlgorithm
* @returns {Promise< string > }
*/
2023-04-19 07:57:12 +00:00
async function pbkdf2(password, salt, iterations, hashAlgorithm) {
2023-04-19 09:19:37 +00:00
const key = await subtle.importKey("raw", UTF8Encoder.parse(password), "PBKDF2", false, ["deriveBits"]);
2023-03-29 08:50:31 +00:00
const keyBytes = await subtle.deriveBits(
{
name: "PBKDF2",
hash: hashAlgorithm,
iterations,
salt: UTF8Encoder.parse(salt),
},
key,
256
);
return HexEncoder.stringify(new Uint8Array(keyBytes));
}
2022-11-20 14:25:16 +00:00
function generateRandomSalt() {
2023-03-29 08:50:31 +00:00
const bytes = crypto.getRandomValues(new Uint8Array(128 / 8));
return HexEncoder.stringify(new Uint8Array(bytes));
2022-11-20 14:25:16 +00:00
}
exports.generateRandomSalt = generateRandomSalt;
2023-04-19 07:57:12 +00:00
async function signMessage(hashedPassword, message) {
2023-03-29 08:50:31 +00:00
const key = await subtle.importKey(
"raw",
2023-04-19 07:57:12 +00:00
HexEncoder.parse(hashedPassword),
2023-03-29 08:50:31 +00:00
{
name: "HMAC",
hash: "SHA-256",
},
false,
["sign"]
);
const signature = await subtle.sign("HMAC", key, UTF8Encoder.parse(message));
return HexEncoder.stringify(new Uint8Array(signature));
}
exports.signMessage = signMessage;
2023-03-01 17:46:48 +00:00
function getRandomAlphanum() {
2023-03-29 08:50:31 +00:00
const possibleCharacters = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
2023-03-01 17:46:48 +00:00
2023-03-29 08:50:31 +00:00
let byteArray;
let parsedInt;
2023-03-01 17:46:48 +00:00
// Keep generating new random bytes until we get a value that falls
// within a range that can be evenly divided by possibleCharacters.length
do {
2023-03-29 08:50:31 +00:00
byteArray = crypto.getRandomValues(new Uint8Array(1));
2023-03-01 17:46:48 +00:00
// extract the lowest byte to get an int from 0 to 255 (probably unnecessary, since we're only generating 1 byte)
2023-03-29 08:50:31 +00:00
parsedInt = byteArray[0] & 0xff;
2023-03-01 17:46:48 +00:00
} while (parsedInt >= 256 - (256 % possibleCharacters.length));
// Take the modulo of the parsed integer to get a random number between 0 and totalLength - 1
2023-03-29 08:50:31 +00:00
const randomIndex = parsedInt % possibleCharacters.length;
2023-03-01 17:46:48 +00:00
return possibleCharacters[randomIndex];
}
/**
* Generate a random string of a given length.
*
* @param {int} length
* @returns {string}
*/
function generateRandomString(length) {
2023-04-19 09:19:37 +00:00
let randomString = "";
2023-03-01 17:46:48 +00:00
2023-03-29 08:50:31 +00:00
for (let i = 0; i < length ; i + + ) {
randomString += getRandomAlphanum();
2023-03-01 17:46:48 +00:00
}
return randomString;
}
exports.generateRandomString = generateRandomString;
2022-11-20 14:25:16 +00:00
return exports;
2023-04-19 09:19:37 +00:00
})());
< / script >
2022-11-20 14:25:16 +00:00
2023-04-19 09:19:37 +00:00
< script id = "codec" >
window.codec = ((function(){
2022-11-20 14:25:16 +00:00
const exports = {};
/**
* Initialize the codec with the provided cryptoEngine - this return functions to encode and decode messages.
*
* @param cryptoEngine - the engine to use for encryption / decryption
*/
function init(cryptoEngine) {
2023-04-19 09:19:37 +00:00
const exports = {};
2023-03-01 17:46:48 +00:00
2023-04-19 09:19:37 +00:00
/**
* Top-level function for encoding a message.
* Includes password hashing, encryption, and signing.
*
* @param {string} msg
* @param {string} password
* @param {string} salt
*
* @returns {string} The encoded text
*/
async function encode(msg, password, salt) {
const hashedPassword = await cryptoEngine.hashPassword(password, salt);
2022-11-20 14:25:16 +00:00
2023-04-19 09:19:37 +00:00
const encrypted = await cryptoEngine.encrypt(msg, hashedPassword);
2023-04-19 07:47:05 +00:00
2023-04-19 09:19:37 +00:00
// we use the hashed password in the HMAC because this is effectively what will be used a password (so we can store
// it in localStorage safely, we don't use the clear text password)
const hmac = await cryptoEngine.signMessage(hashedPassword, encrypted);
return hmac + encrypted;
2023-03-01 17:46:48 +00:00
}
2023-04-19 09:19:37 +00:00
exports.encode = encode;
2023-03-01 17:46:48 +00:00
2023-04-19 09:19:37 +00:00
/**
* Encode using a password that has already been hashed. This is useful to encode multiple messages in a row, that way
* we don't need to hash the password multiple times.
*
* @param {string} msg
* @param {string} hashedPassword
*
* @returns {string} The encoded text
*/
async function encodeWithHashedPassword(msg, hashedPassword) {
const encrypted = await cryptoEngine.encrypt(msg, hashedPassword);
2022-11-20 14:25:16 +00:00
2023-04-19 09:19:37 +00:00
// we use the hashed password in the HMAC because this is effectively what will be used a password (so we can store
// it in localStorage safely, we don't use the clear text password)
const hmac = await cryptoEngine.signMessage(hashedPassword, encrypted);
return hmac + encrypted;
}
exports.encodeWithHashedPassword = encodeWithHashedPassword;
/**
* Top-level function for decoding a message.
* Includes signature check and decryption.
*
* @param {string} signedMsg
* @param {string} hashedPassword
* @param {string} salt
* @param {int} backwardCompatibleAttempt
* @param {string} originalPassword
*
* @returns {Object} {success: true, decoded: string} | {success: false, message: string}
*/
async function decode(signedMsg, hashedPassword, salt, backwardCompatibleAttempt = 0, originalPassword = "") {
const encryptedHMAC = signedMsg.substring(0, 64);
const encryptedMsg = signedMsg.substring(64);
const decryptedHMAC = await cryptoEngine.signMessage(hashedPassword, encryptedMsg);
if (decryptedHMAC !== encryptedHMAC) {
// we have been raising the number of iterations in the hashing algorithm multiple times, so to support the old
// remember-me/autodecrypt links we need to try bringing the old hashes up to speed.
originalPassword = originalPassword || hashedPassword;
if (backwardCompatibleAttempt === 0) {
const updatedHashedPassword = await cryptoEngine.hashThirdRound(originalPassword, salt);
return decode(signedMsg, updatedHashedPassword, salt, backwardCompatibleAttempt + 1, originalPassword);
}
if (backwardCompatibleAttempt === 1) {
let updatedHashedPassword = await cryptoEngine.hashSecondRound(originalPassword, salt);
updatedHashedPassword = await cryptoEngine.hashThirdRound(updatedHashedPassword, salt);
return decode(signedMsg, updatedHashedPassword, salt, backwardCompatibleAttempt + 1, originalPassword);
}
return { success: false, message: "Signature mismatch" };
}
return {
success: true,
decoded: await cryptoEngine.decrypt(encryptedMsg, hashedPassword),
};
}
exports.decode = decode;
return exports;
2022-11-20 14:25:16 +00:00
}
exports.init = init;
return exports;
2023-04-19 09:19:37 +00:00
})());
< / script >
2022-11-20 14:25:16 +00:00
2023-04-19 09:19:37 +00:00
< script id = "formater" >
window.formater = ((function(){
2022-11-20 14:25:16 +00:00
const exports = {};
2022-11-23 22:20:46 +00:00
/**
2023-03-30 16:47:23 +00:00
* Replace the variable in template tags, between '/*[|variable|]* /0' (without the space in '* /0', ommiting it would
* break this comment), with the provided data.
*
* This weird format is so that we have something that doesn't break JS parser in the template files (it understands it
2023-04-19 09:19:37 +00:00
* as '0'), so we can still use auto-formatting. The auto-formatter might add a space before the '0', we accept both.
2022-11-20 14:25:16 +00:00
*
* @param {string} templateString
* @param {Object} data
*
* @returns string
*/
function renderTemplate(templateString, data) {
2023-04-19 09:19:37 +00:00
return templateString.replace(/\/\*\[\|\s*(\w+)\s*\|]\*\/\s*0/g, function (_, key) {
2023-03-30 10:03:18 +00:00
if (!data || data[key] === undefined) {
return key;
2022-11-20 14:25:16 +00:00
}
2023-04-19 09:19:37 +00:00
if (typeof data[key] === "object") {
2023-03-30 10:03:18 +00:00
return JSON.stringify(data[key]);
}
return data[key];
2022-11-20 14:25:16 +00:00
});
}
exports.renderTemplate = renderTemplate;
return exports;
2023-04-19 09:19:37 +00:00
})());
< / script >
2022-11-20 14:25:16 +00:00
2023-04-19 09:19:37 +00:00
< script id = "staticrypt" >
window.staticrypt = ((function(){
2023-03-30 10:03:18 +00:00
const exports = {};
const cryptoEngine = ((function(){
const exports = {};
const { subtle } = crypto;
const IV_BITS = 16 * 8;
const HEX_BITS = 4;
const ENCRYPTION_ALGO = "AES-CBC";
/**
* Translates between utf8 encoded hexadecimal strings
* and Uint8Array bytes.
*/
const HexEncoder = {
/**
* hex string -> bytes
* @param {string} hexString
* @returns {Uint8Array}
*/
parse: function (hexString) {
if (hexString.length % 2 !== 0) throw "Invalid hexString";
const arrayBuffer = new Uint8Array(hexString.length / 2);
for (let i = 0; i < hexString.length ; i + = 2 ) {
const byteValue = parseInt(hexString.substring(i, i + 2), 16);
if (isNaN(byteValue)) {
throw "Invalid hexString";
}
arrayBuffer[i / 2] = byteValue;
}
return arrayBuffer;
},
/**
* bytes -> hex string
* @param {Uint8Array} bytes
* @returns {string}
*/
stringify: function (bytes) {
const hexBytes = [];
for (let i = 0; i < bytes.length ; + + i ) {
let byteString = bytes[i].toString(16);
if (byteString.length < 2 ) {
byteString = "0" + byteString;
}
hexBytes.push(byteString);
}
return hexBytes.join("");
},
};
/**
* Translates between utf8 strings and Uint8Array bytes.
*/
const UTF8Encoder = {
parse: function (str) {
return new TextEncoder().encode(str);
},
stringify: function (bytes) {
return new TextDecoder().decode(bytes);
},
};
/**
* Salt and encrypt a msg with a password.
*/
2023-04-19 07:57:12 +00:00
async function encrypt(msg, hashedPassword) {
2023-03-30 10:03:18 +00:00
// Must be 16 bytes, unpredictable, and preferably cryptographically random. However, it need not be secret.
// https://developer.mozilla.org/en-US/docs/Web/API/SubtleCrypto/encrypt#parameters
const iv = crypto.getRandomValues(new Uint8Array(IV_BITS / 8));
2023-04-19 09:19:37 +00:00
const key = await subtle.importKey("raw", HexEncoder.parse(hashedPassword), ENCRYPTION_ALGO, false, ["encrypt"]);
2023-03-30 10:03:18 +00:00
const encrypted = await subtle.encrypt(
{
name: ENCRYPTION_ALGO,
iv: iv,
},
key,
UTF8Encoder.parse(msg)
);
// iv will be 32 hex characters, we prepend it to the ciphertext for use in decryption
return HexEncoder.stringify(iv) + HexEncoder.stringify(new Uint8Array(encrypted));
}
exports.encrypt = encrypt;
/**
* Decrypt a salted msg using a password.
*
* @param {string} encryptedMsg
2023-04-19 07:57:12 +00:00
* @param {string} hashedPassword
2023-03-30 10:03:18 +00:00
* @returns {Promise< string > }
*/
2023-04-19 07:57:12 +00:00
async function decrypt(encryptedMsg, hashedPassword) {
2023-03-30 10:03:18 +00:00
const ivLength = IV_BITS / HEX_BITS;
const iv = HexEncoder.parse(encryptedMsg.substring(0, ivLength));
const encrypted = encryptedMsg.substring(ivLength);
2023-04-19 09:19:37 +00:00
const key = await subtle.importKey("raw", HexEncoder.parse(hashedPassword), ENCRYPTION_ALGO, false, ["decrypt"]);
2023-03-30 10:03:18 +00:00
const outBuffer = await subtle.decrypt(
{
name: ENCRYPTION_ALGO,
iv: iv,
},
key,
HexEncoder.parse(encrypted)
);
return UTF8Encoder.stringify(new Uint8Array(outBuffer));
}
exports.decrypt = decrypt;
/**
2023-04-19 07:57:12 +00:00
* Salt and hash the password so it can be stored in localStorage without opening a password reuse vulnerability.
2023-03-30 10:03:18 +00:00
*
2023-04-19 07:57:12 +00:00
* @param {string} password
2023-03-30 10:03:18 +00:00
* @param {string} salt
* @returns {Promise< string > }
*/
2023-04-19 07:57:12 +00:00
async function hashPassword(password, salt) {
// we hash the password in multiple steps, each adding more iterations. This is because we used to allow less
2023-03-30 10:03:18 +00:00
// iterations, so for backward compatibility reasons, we need to support going from that to more iterations.
2023-04-19 07:57:12 +00:00
let hashedPassword = await hashLegacyRound(password, salt);
2023-03-30 10:03:18 +00:00
2023-04-19 07:57:12 +00:00
hashedPassword = await hashSecondRound(hashedPassword, salt);
2023-03-30 10:03:18 +00:00
2023-04-19 07:57:12 +00:00
return hashThirdRound(hashedPassword, salt);
2023-03-30 10:03:18 +00:00
}
2023-04-19 07:57:12 +00:00
exports.hashPassword = hashPassword;
2023-03-30 10:03:18 +00:00
/**
2023-04-19 07:57:12 +00:00
* This hashes the password with 1k iterations. This is a low number, we need this function to support backwards
2023-03-30 10:03:18 +00:00
* compatibility.
*
2023-04-19 07:57:12 +00:00
* @param {string} password
2023-03-30 10:03:18 +00:00
* @param {string} salt
* @returns {Promise< string > }
*/
2023-04-19 07:57:12 +00:00
function hashLegacyRound(password, salt) {
return pbkdf2(password, salt, 1000, "SHA-1");
2023-03-30 10:03:18 +00:00
}
exports.hashLegacyRound = hashLegacyRound;
/**
* Add a second round of iterations. This is because we used to use 1k, so for backwards compatibility with
* remember-me/autodecrypt links, we need to support going from that to more iterations.
*
2023-04-19 07:57:12 +00:00
* @param hashedPassword
2023-03-30 10:03:18 +00:00
* @param salt
* @returns {Promise< string > }
*/
2023-04-19 07:57:12 +00:00
function hashSecondRound(hashedPassword, salt) {
return pbkdf2(hashedPassword, salt, 14000, "SHA-256");
2023-03-30 10:03:18 +00:00
}
exports.hashSecondRound = hashSecondRound;
/**
* Add a third round of iterations to bring total number to 600k. This is because we used to use 1k, then 15k, so for
* backwards compatibility with remember-me/autodecrypt links, we need to support going from that to more iterations.
*
2023-04-19 07:57:12 +00:00
* @param hashedPassword
2023-03-30 10:03:18 +00:00
* @param salt
* @returns {Promise< string > }
*/
2023-04-19 07:57:12 +00:00
function hashThirdRound(hashedPassword, salt) {
return pbkdf2(hashedPassword, salt, 585000, "SHA-256");
2023-03-30 10:03:18 +00:00
}
exports.hashThirdRound = hashThirdRound;
/**
2023-04-19 07:57:12 +00:00
* Salt and hash the password so it can be stored in localStorage without opening a password reuse vulnerability.
2023-03-30 10:03:18 +00:00
*
2023-04-19 07:57:12 +00:00
* @param {string} password
2023-03-30 10:03:18 +00:00
* @param {string} salt
* @param {int} iterations
* @param {string} hashAlgorithm
* @returns {Promise< string > }
*/
2023-04-19 07:57:12 +00:00
async function pbkdf2(password, salt, iterations, hashAlgorithm) {
2023-04-19 09:19:37 +00:00
const key = await subtle.importKey("raw", UTF8Encoder.parse(password), "PBKDF2", false, ["deriveBits"]);
2023-03-30 10:03:18 +00:00
const keyBytes = await subtle.deriveBits(
{
name: "PBKDF2",
hash: hashAlgorithm,
iterations,
salt: UTF8Encoder.parse(salt),
},
key,
256
);
return HexEncoder.stringify(new Uint8Array(keyBytes));
}
function generateRandomSalt() {
const bytes = crypto.getRandomValues(new Uint8Array(128 / 8));
return HexEncoder.stringify(new Uint8Array(bytes));
}
exports.generateRandomSalt = generateRandomSalt;
2023-04-19 07:57:12 +00:00
async function signMessage(hashedPassword, message) {
2023-03-30 10:03:18 +00:00
const key = await subtle.importKey(
"raw",
2023-04-19 07:57:12 +00:00
HexEncoder.parse(hashedPassword),
2023-03-30 10:03:18 +00:00
{
name: "HMAC",
hash: "SHA-256",
},
false,
["sign"]
);
const signature = await subtle.sign("HMAC", key, UTF8Encoder.parse(message));
return HexEncoder.stringify(new Uint8Array(signature));
}
exports.signMessage = signMessage;
function getRandomAlphanum() {
const possibleCharacters = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
let byteArray;
let parsedInt;
// Keep generating new random bytes until we get a value that falls
// within a range that can be evenly divided by possibleCharacters.length
do {
byteArray = crypto.getRandomValues(new Uint8Array(1));
// extract the lowest byte to get an int from 0 to 255 (probably unnecessary, since we're only generating 1 byte)
parsedInt = byteArray[0] & 0xff;
} while (parsedInt >= 256 - (256 % possibleCharacters.length));
// Take the modulo of the parsed integer to get a random number between 0 and totalLength - 1
const randomIndex = parsedInt % possibleCharacters.length;
return possibleCharacters[randomIndex];
}
/**
* Generate a random string of a given length.
*
* @param {int} length
* @returns {string}
*/
function generateRandomString(length) {
2023-04-19 09:19:37 +00:00
let randomString = "";
2023-03-30 10:03:18 +00:00
for (let i = 0; i < length ; i + + ) {
randomString += getRandomAlphanum();
}
return randomString;
}
exports.generateRandomString = generateRandomString;
return exports;
2023-04-19 09:19:37 +00:00
})());
2023-03-30 10:03:18 +00:00
const codec = ((function(){
const exports = {};
/**
* Initialize the codec with the provided cryptoEngine - this return functions to encode and decode messages.
*
* @param cryptoEngine - the engine to use for encryption / decryption
*/
function init(cryptoEngine) {
2023-04-19 09:19:37 +00:00
const exports = {};
2023-03-30 10:03:18 +00:00
2023-04-19 09:19:37 +00:00
/**
* Top-level function for encoding a message.
* Includes password hashing, encryption, and signing.
*
* @param {string} msg
* @param {string} password
* @param {string} salt
*
* @returns {string} The encoded text
*/
async function encode(msg, password, salt) {
const hashedPassword = await cryptoEngine.hashPassword(password, salt);
2023-03-30 10:03:18 +00:00
2023-04-19 09:19:37 +00:00
const encrypted = await cryptoEngine.encrypt(msg, hashedPassword);
2023-04-19 07:47:05 +00:00
2023-04-19 09:19:37 +00:00
// we use the hashed password in the HMAC because this is effectively what will be used a password (so we can store
// it in localStorage safely, we don't use the clear text password)
const hmac = await cryptoEngine.signMessage(hashedPassword, encrypted);
return hmac + encrypted;
2023-03-30 10:03:18 +00:00
}
2023-04-19 09:19:37 +00:00
exports.encode = encode;
2023-03-30 10:03:18 +00:00
2023-04-19 09:19:37 +00:00
/**
* Encode using a password that has already been hashed. This is useful to encode multiple messages in a row, that way
* we don't need to hash the password multiple times.
*
* @param {string} msg
* @param {string} hashedPassword
*
* @returns {string} The encoded text
*/
async function encodeWithHashedPassword(msg, hashedPassword) {
const encrypted = await cryptoEngine.encrypt(msg, hashedPassword);
2023-03-30 10:03:18 +00:00
2023-04-19 09:19:37 +00:00
// we use the hashed password in the HMAC because this is effectively what will be used a password (so we can store
// it in localStorage safely, we don't use the clear text password)
const hmac = await cryptoEngine.signMessage(hashedPassword, encrypted);
return hmac + encrypted;
}
exports.encodeWithHashedPassword = encodeWithHashedPassword;
/**
* Top-level function for decoding a message.
* Includes signature check and decryption.
*
* @param {string} signedMsg
* @param {string} hashedPassword
* @param {string} salt
* @param {int} backwardCompatibleAttempt
* @param {string} originalPassword
*
* @returns {Object} {success: true, decoded: string} | {success: false, message: string}
*/
async function decode(signedMsg, hashedPassword, salt, backwardCompatibleAttempt = 0, originalPassword = "") {
const encryptedHMAC = signedMsg.substring(0, 64);
const encryptedMsg = signedMsg.substring(64);
const decryptedHMAC = await cryptoEngine.signMessage(hashedPassword, encryptedMsg);
if (decryptedHMAC !== encryptedHMAC) {
// we have been raising the number of iterations in the hashing algorithm multiple times, so to support the old
// remember-me/autodecrypt links we need to try bringing the old hashes up to speed.
originalPassword = originalPassword || hashedPassword;
if (backwardCompatibleAttempt === 0) {
const updatedHashedPassword = await cryptoEngine.hashThirdRound(originalPassword, salt);
return decode(signedMsg, updatedHashedPassword, salt, backwardCompatibleAttempt + 1, originalPassword);
}
if (backwardCompatibleAttempt === 1) {
let updatedHashedPassword = await cryptoEngine.hashSecondRound(originalPassword, salt);
updatedHashedPassword = await cryptoEngine.hashThirdRound(updatedHashedPassword, salt);
return decode(signedMsg, updatedHashedPassword, salt, backwardCompatibleAttempt + 1, originalPassword);
}
return { success: false, message: "Signature mismatch" };
}
return {
success: true,
decoded: await cryptoEngine.decrypt(encryptedMsg, hashedPassword),
};
}
exports.decode = decode;
return exports;
2023-03-30 10:03:18 +00:00
}
exports.init = init;
return exports;
2023-04-19 09:19:37 +00:00
})());
2023-03-30 10:03:18 +00:00
const decode = codec.init(cryptoEngine).decode;
/**
* Initialize the staticrypt module, that exposes functions callbable by the password_template.
*
* @param {{
2023-04-23 08:44:39 +00:00
* staticryptEncryptedMsgUniqueVariableName: string,
2023-03-30 10:03:18 +00:00
* isRememberEnabled: boolean,
* rememberDurationInDays: number,
2023-04-23 08:44:39 +00:00
* staticryptSaltUniqueVariableName: string,
2023-03-30 10:03:18 +00:00
* }} staticryptConfig - object of data that is stored on the password_template at encryption time.
*
* @param {{
* rememberExpirationKey: string,
* rememberPassphraseKey: string,
* replaceHtmlCallback: function,
* clearLocalStorageCallback: function,
* }} templateConfig - object of data that can be configured by a custom password_template.
*/
function init(staticryptConfig, templateConfig) {
const exports = {};
/**
* Decrypt our encrypted page, replace the whole HTML.
*
2023-04-19 07:57:12 +00:00
* @param {string} hashedPassword
2023-03-30 10:03:18 +00:00
* @returns {Promise< boolean > }
*/
2023-04-19 07:57:12 +00:00
async function decryptAndReplaceHtml(hashedPassword) {
2023-04-23 08:44:39 +00:00
const { staticryptEncryptedMsgUniqueVariableName, staticryptSaltUniqueVariableName } = staticryptConfig;
2023-03-30 10:03:18 +00:00
const { replaceHtmlCallback } = templateConfig;
2023-04-23 08:44:39 +00:00
const result = await decode(
staticryptEncryptedMsgUniqueVariableName,
hashedPassword,
staticryptSaltUniqueVariableName
);
2023-03-30 10:03:18 +00:00
if (!result.success) {
return false;
}
const plainHTML = result.decoded;
// if the user configured a callback call it, otherwise just replace the whole HTML
2023-04-19 09:19:37 +00:00
if (typeof replaceHtmlCallback === "function") {
2023-03-30 10:03:18 +00:00
replaceHtmlCallback(plainHTML);
} else {
document.write(plainHTML);
document.close();
}
return true;
}
/**
* Attempt to decrypt the page and replace the whole HTML.
*
* @param {string} password
* @param {boolean} isRememberChecked
*
* @returns {Promise< {isSuccessful: boolean, hashedPassword?: string}>} - we return an object, so that if we want to
* expose more information in the future we can do it without breaking the password_template
*/
async function handleDecryptionOfPage(password, isRememberChecked) {
2023-04-23 08:44:39 +00:00
const { isRememberEnabled, rememberDurationInDays, staticryptSaltUniqueVariableName } = staticryptConfig;
2023-03-30 10:03:18 +00:00
const { rememberExpirationKey, rememberPassphraseKey } = templateConfig;
// decrypt and replace the whole page
2023-04-23 08:44:39 +00:00
const hashedPassword = await cryptoEngine.hashPassword(password, staticryptSaltUniqueVariableName);
2023-03-30 10:03:18 +00:00
const isDecryptionSuccessful = await decryptAndReplaceHtml(hashedPassword);
if (!isDecryptionSuccessful) {
return {
isSuccessful: false,
hashedPassword,
};
}
// remember the hashedPassword and set its expiration if necessary
if (isRememberEnabled & & isRememberChecked) {
window.localStorage.setItem(rememberPassphraseKey, hashedPassword);
// set the expiration if the duration isn't 0 (meaning no expiration)
if (rememberDurationInDays > 0) {
window.localStorage.setItem(
rememberExpirationKey,
(new Date().getTime() + rememberDurationInDays * 24 * 60 * 60 * 1000).toString()
);
}
}
return {
isSuccessful: true,
hashedPassword,
};
}
exports.handleDecryptionOfPage = handleDecryptionOfPage;
/**
* Clear localstorage from staticrypt related values
*/
function clearLocalStorage() {
const { clearLocalStorageCallback, rememberExpirationKey, rememberPassphraseKey } = templateConfig;
2023-04-19 09:19:37 +00:00
if (typeof clearLocalStorageCallback === "function") {
2023-03-30 10:03:18 +00:00
clearLocalStorageCallback();
} else {
localStorage.removeItem(rememberPassphraseKey);
localStorage.removeItem(rememberExpirationKey);
}
}
async function handleDecryptOnLoad() {
let isSuccessful = await decryptOnLoadFromUrl();
if (!isSuccessful) {
isSuccessful = await decryptOnLoadFromRememberMe();
}
return { isSuccessful };
}
exports.handleDecryptOnLoad = handleDecryptOnLoad;
/**
* Clear storage if we are logging out
*
* @returns {boolean} - whether we logged out
*/
function logoutIfNeeded() {
const logoutKey = "staticrypt_logout";
// handle logout through query param
const queryParams = new URLSearchParams(window.location.search);
if (queryParams.has(logoutKey)) {
clearLocalStorage();
return true;
}
// handle logout through URL fragment
const hash = window.location.hash.substring(1);
if (hash.includes(logoutKey)) {
clearLocalStorage();
return true;
}
return false;
}
/**
* 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 {Promise< boolean > } true if we derypted and replaced the whole page, false otherwise
*/
async function decryptOnLoadFromRememberMe() {
const { rememberDurationInDays } = staticryptConfig;
const { rememberExpirationKey, rememberPassphraseKey } = templateConfig;
// if we are login out, terminate
if (logoutIfNeeded()) {
return false;
}
// if there is expiration configured, check if we're not beyond the expiration
if (rememberDurationInDays & & rememberDurationInDays > 0) {
const expiration = localStorage.getItem(rememberExpirationKey),
isExpired = expiration & & new Date().getTime() > parseInt(expiration);
if (isExpired) {
clearLocalStorage();
return false;
}
}
2023-04-19 07:57:12 +00:00
const hashedPassword = localStorage.getItem(rememberPassphraseKey);
2023-03-30 10:03:18 +00:00
2023-04-19 07:57:12 +00:00
if (hashedPassword) {
2023-03-30 10:03:18 +00:00
// try to decrypt
2023-04-19 07:57:12 +00:00
const isDecryptionSuccessful = await decryptAndReplaceHtml(hashedPassword);
2023-03-30 10:03:18 +00:00
// 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;
}
function decryptOnLoadFromUrl() {
const passwordKey = "staticrypt_pwd";
// get the password from the query param
const queryParams = new URLSearchParams(window.location.search);
2023-04-19 07:57:12 +00:00
const hashedPasswordQuery = queryParams.get(passwordKey);
2023-03-30 10:03:18 +00:00
// get the password from the url fragment
const hashRegexMatch = window.location.hash.substring(1).match(new RegExp(passwordKey + "=(.*)"));
2023-04-19 07:57:12 +00:00
const hashedPasswordFragment = hashRegexMatch ? hashRegexMatch[1] : null;
2023-03-30 10:03:18 +00:00
2023-04-19 07:57:12 +00:00
const hashedPassword = hashedPasswordFragment || hashedPasswordQuery;
2023-03-30 10:03:18 +00:00
2023-04-19 07:57:12 +00:00
if (hashedPassword) {
return decryptAndReplaceHtml(hashedPassword);
2023-03-30 10:03:18 +00:00
}
return false;
}
return exports;
}
exports.init = init;
2023-04-19 09:19:37 +00:00
return exports;
})());
< / script >
2022-11-20 14:25:16 +00:00
2023-04-19 09:19:37 +00:00
< script >
const encode = codec.init(cryptoEngine).encode;
2017-06-19 08:46:47 +00:00
2023-04-19 09:19:37 +00:00
// enable CKEDIRTOR
CKEDITOR.replace("template_instructions");
2017-06-15 10:20:19 +00:00
2023-04-19 09:19:37 +00:00
let htmlToDownload;
2017-04-29 13:14:06 +00:00
2023-04-19 09:19:37 +00:00
/**
* Extract js code from < script > t a g a n d r e t u r n i t a s a s t r i n g
*
* @param {string} id
* @returns {string}
*/
function getScriptAsString(id) {
return document.getElementById(id).innerText.replace(/window\.\w+ = /, "");
2022-11-22 14:44:18 +00:00
}
2017-06-15 15:48:20 +00:00
2023-04-19 09:19:37 +00:00
/**
* Register something happened - this uses a simple Supabase function to implement a counter, and allows to drop
* google analytics. We don't store any personal data or IP.
*
* @param {string} action
*/
function trackEvent(action) {
const xhr = new XMLHttpRequest();
xhr.open("POST", "https://zlgpaemmniviswibzuwt.supabase.co/rest/v1/rpc/increment_analytics", true);
xhr.setRequestHeader("Content-type", "application/json; charset=UTF-8");
xhr.setRequestHeader(
"apikey",
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6InpsZ3BhZW1tbml2aXN3aWJ6dXd0Iiwicm9sZSI6ImFub24iLCJpYXQiOjE2NjkxMjM0OTcsImV4cCI6MTk4NDY5OTQ5N30.wNoVDHG7F6INx-IPotMs3fL1nudfaF2qvQDgG-1PhNI"
);
xhr.setRequestHeader(
"Authorization",
"Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6InpsZ3BhZW1tbml2aXN3aWJ6dXd0Iiwicm9sZSI6ImFub24iLCJpYXQiOjE2NjkxMjM0OTcsImV4cCI6MTk4NDY5OTQ5N30.wNoVDHG7F6INx-IPotMs3fL1nudfaF2qvQDgG-1PhNI"
);
xhr.send(
JSON.stringify({
action_input: action,
})
);
}
2017-06-14 14:19:24 +00:00
2023-04-19 09:19:37 +00:00
/**
* Fill the password prompt template with data provided.
* @param data
*/
function setFileToDownload(data) {
const request = new XMLHttpRequest();
request.open("GET", "lib/password_template.html", true);
request.onload = function () {
const renderedTmpl = formater.renderTemplate(request.responseText, data);
const downloadLink = document.querySelector("a.download");
downloadLink.href = "data:text/html," + encodeURIComponent(renderedTmpl);
downloadLink.removeAttribute("disabled");
htmlToDownload = renderedTmpl;
};
request.send();
}
2017-06-14 14:19:24 +00:00
2023-04-19 09:19:37 +00:00
// register page load
window.onload = function () {
trackEvent("show_index");
};
2017-06-14 14:19:24 +00:00
2023-04-19 09:19:37 +00:00
/**
* Handle form submission.
*/
document.getElementById("encrypt_form").addEventListener("submit", async function (e) {
e.preventDefault();
2022-02-10 08:22:32 +00:00
2023-04-19 09:19:37 +00:00
trackEvent("generate_encrypted");
// update instruction textarea value with CKEDITOR content
// (see https://stackoverflow.com/questions/3147670/ckeditor-update-textarea)
CKEDITOR.instances["template_instructions"].updateElement();
const unencrypted = document.getElementById("unencrypted_html").value,
password = document.getElementById("password").value;
const salt = cryptoEngine.generateRandomSalt();
const encryptedMsg = await encode(unencrypted, password, salt);
const templateButton = document.getElementById("template_button").value,
2023-04-19 09:25:40 +00:00
templateColorPrimary = document.getElementById("template_color_primary").value,
templateColorSecondary = document.getElementById("template_color_secondary").value,
2023-04-19 09:19:37 +00:00
templateInstructions = document.getElementById("template_instructions").value,
isRememberEnabled = document.getElementById("remember").checked,
templateTitle = document.getElementById("template_title").value.trim(),
templatePlaceholder = document.getElementById("template_placeholder").value.trim(),
rememberDurationInDays = document.getElementById("remember_in_days").value || 0,
templateRemember = document.getElementById("template_remember").value;
const data = {
staticrypt_config: {
encryptedMsg,
isRememberEnabled,
rememberDurationInDays,
salt,
},
is_remember_enabled: JSON.stringify(isRememberEnabled),
js_staticrypt: getScriptAsString("staticrypt"),
template_button: templateButton ? templateButton : "DECRYPT",
2023-04-19 09:25:40 +00:00
template_color_primary: templateColorPrimary || "#4CAF50",
template_color_secondary: templateColorSecondary || "#76B852",
2023-04-19 09:19:37 +00:00
template_instructions: templateInstructions || "",
template_placeholder: templatePlaceholder || "Password",
template_remember: templateRemember || "Remember me",
template_title: templateTitle || "Protected Page",
};
document.getElementById("encrypted_html_display").textContent = encryptedMsg;
setFileToDownload(data);
});
document.getElementById("toggle-extra-option").addEventListener("click", function (e) {
e.preventDefault();
document.getElementById("extra-options").classList.toggle("hidden");
});
2022-02-10 08:22:32 +00:00
2023-04-19 09:19:37 +00:00
let isConceptShown = false;
document.getElementById("toggle-concept").addEventListener("click", function (e) {
e.preventDefault();
2022-02-10 08:22:32 +00:00
2023-04-19 09:19:37 +00:00
isConceptShown = !isConceptShown;
2017-06-15 10:20:19 +00:00
2023-04-19 09:19:37 +00:00
document.getElementById("toggle-concept-sign").innerText = isConceptShown ? "▼" : "►";
2017-06-15 10:20:19 +00:00
2023-04-19 09:19:37 +00:00
document.getElementById("concept").classList.toggle("hidden");
});
2017-06-15 10:20:19 +00:00
2023-04-19 09:19:37 +00:00
/**
* Browser specific download code.
*/
document.getElementById("download-link").addEventListener("click", function (e) {
// only register the click event if there is actually a generated file
if (htmlToDownload) {
trackEvent("download_encrypted");
}
2017-06-15 10:20:19 +00:00
2023-04-19 09:19:37 +00:00
const isIE = navigator.userAgent.indexOf("MSIE") !== -1 || !!document.documentMode === true; // >= 10
const isEdge = navigator.userAgent.indexOf("Edge") !== -1;
2017-06-15 10:20:19 +00:00
2023-04-19 09:19:37 +00:00
// download with MS specific feature
if (htmlToDownload & & (isIE || isEdge)) {
e.preventDefault();
const blobObject = new Blob([htmlToDownload]);
window.navigator.msSaveOrOpenBlob(blobObject, "encrypted.html");
}
2017-04-29 13:14:06 +00:00
2023-04-19 09:19:37 +00:00
return true;
});
< / script >
< / body >
2017-04-29 13:14:06 +00:00
< / html >
