diff --git a/app/templates/downloadPassword.js b/app/templates/downloadPassword.js
index 74da26dc..324e8d24 100644
--- a/app/templates/downloadPassword.js
+++ b/app/templates/downloadPassword.js
@@ -16,17 +16,31 @@ module.exports = function(state, emit) {
${label}
`;
+ function inputChanged() {
+ const input = document.getElementById('unlock-input');
+ const btn = document.getElementById('unlock-btn');
+ if (input.value.length > 0) {
+ btn.classList.remove('btn-hidden');
+ input.classList.remove('input-no-btn');
+ } else {
+ btn.classList.add('btn-hidden');
+ input.classList.add('input-no-btn');
+ }
+ }
+
function checkPassword(event) {
event.preventDefault();
const password = document.getElementById('unlock-input').value;
diff --git a/app/templates/share.js b/app/templates/share.js
index 9162c88f..3efeb6bd 100644
--- a/app/templates/share.js
+++ b/app/templates/share.js
@@ -4,6 +4,16 @@ const notFound = require('./notFound');
const uploadPassword = require('./uploadPassword');
const { allowedCopy, delay, fadeOut } = require('../utils');
+function passwordComplete(state, password) {
+ const el = html([
+ `${state.translate('passwordResult', {
+ password: '
'
+ })}
`
+ ]);
+ el.lastElementChild.textContent = password;
+ return el;
+}
+
module.exports = function(state, emit) {
const file = state.storage.getFileById(state.params.id);
if (!file) {
@@ -11,11 +21,9 @@ module.exports = function(state, emit) {
}
file.password = file.password || '';
- const passwordComplete = html``;
- passwordComplete.innerHTML = file.password.replace(/ /g, ' ');
const passwordSection = file.password
- ? passwordComplete
+ ? passwordComplete(state, file.password)
: uploadPassword(state, emit);
const div = html`
diff --git a/app/templates/uploadPassword.js b/app/templates/uploadPassword.js
index 27ec85a1..509bf36e 100644
--- a/app/templates/uploadPassword.js
+++ b/app/templates/uploadPassword.js
@@ -11,16 +11,30 @@ module.exports = function(state, emit) {
`;
+ function inputChanged() {
+ const input = document.getElementById('unlock-input');
+ const btn = document.getElementById('unlock-btn');
+ if (input.value.length > 0) {
+ btn.classList.remove('btn-hidden');
+ input.classList.remove('input-no-btn');
+ } else {
+ btn.classList.add('btn-hidden');
+ input.classList.add('input-no-btn');
+ }
+ }
+
function togglePasswordInput(e) {
const unlockInput = document.getElementById('unlock-input');
const boxChecked = e.target.checked;
@@ -36,6 +50,7 @@ module.exports = function(state, emit) {
} else {
unlockInput.value = '';
}
+ inputChanged();
}
function setPassword(event) {
diff --git a/assets/main.css b/assets/main.css
index 490a6eef..12d4af57 100644
--- a/assets/main.css
+++ b/assets/main.css
@@ -137,6 +137,7 @@ body {
width: 96%;
}
+pre,
input,
select,
textarea,
@@ -145,6 +146,11 @@ button {
margin: 0;
}
+pre {
+ font-weight: 600;
+ display: inline-block;
+}
+
a {
text-decoration: none;
}
@@ -809,7 +815,7 @@ tbody {
padding: 10px 0;
}
-#unlock-input {
+.unlock-input {
flex: 1;
height: 46px;
border: 1px solid #0297f8;
@@ -841,6 +847,14 @@ tbody {
background-color: #0287e8;
}
+.btn-hidden {
+ visibility: hidden;
+}
+
+.input-no-btn {
+ border-radius: 6px;
+}
+
/* footer */
.footer {
right: 0;
diff --git a/package-lock.json b/package-lock.json
index 63cc9cad..046a395d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -32,6 +32,16 @@
"integrity": "sha1-9vGlzl05caSt6RoR0i1MRZrNN18=",
"dev": true
},
+ "JSONStream": {
+ "version": "0.8.4",
+ "resolved": "https://registry.npmjs.org/JSONStream/-/JSONStream-0.8.4.tgz",
+ "integrity": "sha1-kWV9/m/4V0gwZhMrRhi2Lo9Ih70=",
+ "dev": true,
+ "requires": {
+ "jsonparse": "0.0.5",
+ "through": "2.3.8"
+ }
+ },
"accept-language": {
"version": "3.0.17",
"resolved": "https://registry.npmjs.org/accept-language/-/accept-language-3.0.17.tgz",
@@ -4621,14 +4631,6 @@
}
}
},
- "string_decoder": {
- "version": "1.0.1",
- "bundled": true,
- "dev": true,
- "requires": {
- "safe-buffer": "5.0.1"
- }
- },
"string-width": {
"version": "1.0.2",
"bundled": true,
@@ -4639,6 +4641,14 @@
"strip-ansi": "3.0.1"
}
},
+ "string_decoder": {
+ "version": "1.0.1",
+ "bundled": true,
+ "dev": true,
+ "requires": {
+ "safe-buffer": "5.0.1"
+ }
+ },
"stringstream": {
"version": "0.0.5",
"bundled": true,
@@ -6069,16 +6079,6 @@
"integrity": "sha1-MwVCrT8KZUZlt3jz6y2an6UHrGQ=",
"dev": true
},
- "JSONStream": {
- "version": "0.8.4",
- "resolved": "https://registry.npmjs.org/JSONStream/-/JSONStream-0.8.4.tgz",
- "integrity": "sha1-kWV9/m/4V0gwZhMrRhi2Lo9Ih70=",
- "dev": true,
- "requires": {
- "jsonparse": "0.0.5",
- "through": "2.3.8"
- }
- },
"jszip": {
"version": "3.1.4",
"resolved": "https://registry.npmjs.org/jszip/-/jszip-3.1.4.tgz",
@@ -10865,11 +10865,6 @@
"integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM=",
"dev": true
},
- "string_decoder": {
- "version": "0.10.31",
- "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
- "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
- },
"string-hash": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/string-hash/-/string-hash-1.1.3.tgz",
@@ -10914,6 +10909,11 @@
"function-bind": "1.1.1"
}
},
+ "string_decoder": {
+ "version": "0.10.31",
+ "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+ "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
+ },
"stringify-object": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/stringify-object/-/stringify-object-3.2.1.tgz",
diff --git a/public/locales/en-US/send.ftl b/public/locales/en-US/send.ftl
index f85ae79e..094908e5 100644
--- a/public/locales/en-US/send.ftl
+++ b/public/locales/en-US/send.ftl
@@ -87,3 +87,5 @@ footerLinkCookies = Cookies
requirePasswordCheckbox = Require a password to download this file
addPasswordButton = Add password
passwordTryAgain = Incorrect password. Try again.
+// This label is followed by the password needed to download a file
+passwordResult = Password: { $password }
\ No newline at end of file