Chapril/drop.chapril.org-firefoxsend
Chapril/drop.chapril.org-firefoxsend
25
1
Fork 0
Code Issues Releases Activity

make 'change' button visible by default after pwd set

Browse Source
This commit is contained in:
Danny Coates 2018-02-20 11:27:56 -08:00
parent f2661989dc
commit 130ddca135
No known key found for this signature in database
GPG Key ID: 4C442633C62E00CB
1 changed files with 20 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
app/templates/passwordInput/index.js
View File

@ -1,15 +1,20 @@
const html = require('choo/html'); const html = require('choo/html');
module.exports = function(file, state, emit) { module.exports = function(file, state, emit) {
const setting = state.settingPassword; const loading = state.settingPassword;
const formClass = file.hasPassword const pwd = file.hasPassword;
const formClass = pwd
? 'passwordInput' ? 'passwordInput'
: 'passwordInput passwordInput--hidden'; : 'passwordInput passwordInput--hidden';
const inputClass = setting ? 'input' : 'input input--noBtn'; const inputClass = loading || pwd ? 'input' : 'input input--noBtn';
const btnClass = setting let btnClass = 'inputBtn inputBtn--hidden';
? 'inputBtn inputBtn--loading' if (loading) {
: 'inputBtn inputBtn--hidden'; btnClass = 'inputBtn inputBtn--loading';
const action = file.hasPassword } else if (pwd) {
btnClass = 'inputBtn';
}
const action = pwd
? state.translate('changePasswordButton') ? state.translate('changePasswordButton')
: state.translate('addPasswordButton'); : state.translate('addPasswordButton');
return html` return html`
@ -19,26 +24,26 @@ module.exports = function(file, state, emit) {
onsubmit=${setPassword} onsubmit=${setPassword}
data-no-csrf> data-no-csrf>
<input id="password-input" <input id="password-input"
${setting ? 'disabled' : ''} ${loading ? 'disabled' : ''}
class="${inputClass}" class="${inputClass}"
maxlength="32" maxlength="32"
autocomplete="off" autocomplete="off"
type="password" type="password"
oninput=${inputChanged} oninput=${inputChanged}
placeholder="${ placeholder="${
file.hasPassword pwd
? passwordPlaceholder(file.password) ? passwordPlaceholder(file.password)
: state.translate('unlockInputPlaceholder') : state.translate('unlockInputPlaceholder')
}"> }">
<input type="submit" <input type="submit"
id="password-btn" id="password-btn"
${setting ? 'disabled' : ''} ${loading ? 'disabled' : ''}
class="${btnClass}" class="${btnClass}"
value="${setting ? '' : action}"> value="${loading ? '' : action}">
</form> </form>
<div class="passwordInput__msg">${message( <div class="passwordInput__msg">${message(
setting, loading,
file.hasPassword, pwd,
state.translate('passwordIsSet') state.translate('passwordIsSet')
)}</div> )}</div>
</div> </div>
@ -74,8 +79,8 @@ function passwordPlaceholder(password) {
return password ? password.replace(/./g, '●') : '●●●●●●●●●●●●'; return password ? password.replace(/./g, '●') : '●●●●●●●●●●●●';
} }
function message(setting, pwd, deflt) { function message(loading, pwd, deflt) {
if (setting || !pwd) { if (loading || !pwd) {
return ''; return '';
} }
return deflt; return deflt;