Update form anonymity options

pull/1/head
yflory 3 years ago
parent 02d5cd2bee
commit 5c260c2ea8

@ -479,13 +479,19 @@
.cp-form-anon-answer { .cp-form-anon-answer {
text-align: center; text-align: center;
margin: 20px 0 30px 0; margin: 20px 0 30px 0;
.cp-form-required-radio.cp-radio-required {
background: fade(@cryptpad_text_col, 15%);
padding: 3px;
border: 2px solid @cryptpad_color_red;
color: @cp_form-invalid;
}
.cp-form-anon-answer-input { .cp-form-anon-answer-input {
margin-top: 20px;
display: flex; display: flex;
white-space: nowrap; white-space: nowrap;
align-items: center; align-items: center;
input { input {
margin-left: 10px; margin-left: 10px;
display: inline-block;
} }
} }
.cp-form-anon-answer-registered { .cp-form-anon-answer-registered {

@ -2723,7 +2723,7 @@ define([
var answer = obj.msg; var answer = obj.msg;
var date = new Date(obj.time).toLocaleString(); var date = new Date(obj.time).toLocaleString();
var text, warning, badge; var text, warning, badge;
if (!answer._userdata || !answer._userdata.name) { if (!answer._userdata || (!answer._userdata.name && !answer._userdata.curvePublic)) {
text = Messages._getKey('form_answerAnonymous', [date]); text = Messages._getKey('form_answerAnonymous', [date]);
} else { } else {
var ud = answer._userdata; var ud = answer._userdata;
@ -3022,69 +3022,81 @@ define([
if (!loggedIn && !content.answers.anonymous) { return; } if (!loggedIn && !content.answers.anonymous) { return; }
var cbox; var $anonName;
var anonName, $anonName; var anonRadioOn = UI.createRadio('cp-form-anon', 'cp-form-anon-on',
cbox = UI.createCheckbox('cp-form-anonymous', Messages.form_anonymousBox, false, {
Messages.form_anonymousBox, true, {}); input: { value: 1 },
var $cbox = $(cbox); });
var $anonBox = $cbox.find('input'); var anonOffContent = h('span');
var anonRadioOff = UI.createRadio('cp-form-anon', 'cp-form-anon-off',
anonOffContent, false, {
input: { value: 0 },
});
var radioContainer = h('div.cp-form-required-radio', [
anonRadioOn,
anonRadioOff,
]);
var $radio = $(radioContainer);
if (content.answers.makeAnonymous) { if (content.answers.makeAnonymous) {
// If we make all answers anonymous, hide the checkbox and display a message // If we make all answers anonymous, hide the checkbox and display a message
$cbox.hide(); $radio.hide();
$anonBox.attr('disabled', 'disabled').prop('checked', true); $(anonRadioOn).find('input').prop('checked', true);
setTimeout(function () { setTimeout(function () {
// We need to wait for cbox to be added into the DOM before using .after() // We need to wait for cbox to be added into the DOM before using .after()
$cbox.after(h('div.alert.alert-info', Messages.form_anonAnswer)); $radio.after(h('div.alert.alert-info', Messages.form_anonAnswer));
}); });
} else if (content.answers.anonymous) { } else if (content.answers.anonymous) {
// Answers aren't anonymous and guests are allowed // Answers aren't anonymous and guests are allowed
// Guests can set a username and logged in users can answer anonymously // Guests can set a username and logged in users can answer anonymously
var $anon;
if (!loggedIn) { if (!loggedIn) {
anonName = h('div.cp-form-anon-answer-input', [ $(anonOffContent).append(h('span.cp-form-anon-answer-input', [
Messages.form_answerAs, Messages.form_answerAs,
h('input', { h('input', {
value: user.name || '', value: user.name || '',
placeholder: Messages.form_anonName placeholder: Messages.form_anonName
}) })
]); ]));
$anonName = $(anonName).hide(); $anonName = $(anonOffContent).find('input');
var $off = $(anonRadioOff).find('input[type="radio"]');
$anonName.on('click input', function () {
if (!Util.isChecked($off)) { $off.prop('checked', true); }
});
} else if (APP.cantAnon) { } else if (APP.cantAnon) {
// You've already answered with your credentials // You've already answered with your credentials
$cbox.hide(); $(anonRadioOn).find('input').attr('disabled', 'disabled');
$anonBox.attr('disabled', 'disabled').prop('checked', false); $(anonRadioOff).find('input[type="radio"]').prop('checked', true);
} }
if (!anonName) { if (!$anonName) {
anonName = h('div.cp-form-anon-answer-input', [ $(anonOffContent).append(h('div.cp-form-anon-answer-input', [
Messages.form_answerAs, Messages.form_answerAs,
h('span.cp-form-anon-answer-registered', user.name || Messages.anonymous) h('span.cp-form-anon-answer-registered', user.name || Messages.anonymous)
]); ]));
} }
if (!APP.cantAnon) { if (!$radio.find('input[type="radio"]:checked').length) {
$anon = $(anonName).hide(); $radio.addClass('cp-radio-required');
$anonBox.on('change', function () { $radio.find('input[type="radio"]').on('change', function () {
if (Util.isChecked($anonBox)) { $anon.hide(); } $radio.removeClass('cp-radio-required');
else { $anon.show(); }
}); });
} }
} else { } else {
// Answers don't have to be anonymous and only logged in users can answer // Answers don't have to be anonymous and only logged in users can answer
// ==> they have to answer with their keys so we know their name too // ==> they have to answer with their keys so we know their name too
$cbox.hide(); $(anonRadioOn).find('input').attr('disabled', 'disabled');
$anonBox.attr('disabled', 'disabled').prop('checked', false); $(anonRadioOff).find('input[type="radio"]').prop('checked', true);
setTimeout(function () { setTimeout(function () {
// We need to wait for cbox to be added into the DOM before using .after() // We need to wait for cbox to be added into the DOM before using .after()
if (content.answers.cantEdit) { return; } if (content.answers.cantEdit) { return; }
$cbox.after(h('div.alert.alert-info', Messages.form_authAnswer)); $radio.after(h('div.alert.alert-info', Messages.form_authAnswer));
}); });
anonName = h('div.cp-form-anon-answer-input', [ $(anonOffContent).append(h('div.cp-form-anon-answer-input', [
Messages.form_answerAs, Messages.form_answerAs,
h('span.cp-form-anon-answer-registered', user.name || Messages.anonymous) h('span.cp-form-anon-answer-registered', user.name || Messages.anonymous)
]); ]));
} }
if (APP.hasAnswered && content.answers.cantEdit || APP.isClosed) { if (APP.hasAnswered && content.answers.cantEdit || APP.isClosed) {
$cbox.hide(); $radio.hide();
anonName = undefined;
} }
var send = h('button.cp-open.btn.btn-primary', APP.hasAnswered ? Messages.form_update : Messages.form_submit); var send = h('button.cp-open.btn.btn-primary', APP.hasAnswered ? Messages.form_update : Messages.form_submit);
@ -3098,12 +3110,18 @@ define([
evOnChange.fire(); evOnChange.fire();
}); });
var $send = $(send).click(function () { var $send = $(send).click(function () {
if (!$radio.find('input[type="radio"]:checked').length) {
return UI.warn(Messages.error);
}
$send.attr('disabled', 'disabled'); $send.attr('disabled', 'disabled');
var results = getFormResults(); var results = getFormResults();
if (!results) { return; } if (!results) { return; }
var wantName = Util.isChecked($(anonRadioOff).find('input[type="radio"]'));
var user = metadataMgr.getUserData(); var user = metadataMgr.getUserData();
if (!Util.isChecked($anonBox) && !content.answers.makeAnonymous) { if (wantName && !content.answers.makeAnonymous) {
results._userdata = loggedIn ? { results._userdata = loggedIn ? {
avatar: user.avatar, avatar: user.avatar,
name: user.name, name: user.name,
@ -3111,7 +3129,7 @@ define([
curvePublic: user.curvePublic, curvePublic: user.curvePublic,
profile: user.profile profile: user.profile
} : { } : {
name: $anonName ? $anonName.find('input').val() : user.name name: $anonName ? $anonName.val() : user.name
}; };
} }
@ -3120,7 +3138,7 @@ define([
mailbox: content.answers, mailbox: content.answers,
results: results, results: results,
anonymous: content.answers.makeAnonymous || !loggedIn anonymous: content.answers.makeAnonymous || !loggedIn
|| (Util.isChecked($anonBox) && !APP.cantAnon) // use ephemeral keys || (!wantName && !APP.cantAnon) // use ephemeral keys
}, function (err, data) { }, function (err, data) {
$send.attr('disabled', 'disabled'); $send.attr('disabled', 'disabled');
if (err || (data && data.error)) { if (err || (data && data.error)) {
@ -3130,6 +3148,11 @@ define([
console.error(err || data.error); console.error(err || data.error);
return void UI.warn(Messages.error); return void UI.warn(Messages.error);
} }
if (results._userdata && loggedIn) {
$(anonRadioOn).find('input').attr('disabled', 'disabled');
$(anonRadioOff).find('input[type="radio"]').prop('checked', true);
APP.cantAnon = true;
}
evOnChange.fire(false, true); evOnChange.fire(false, true);
window.onbeforeunload = undefined; window.onbeforeunload = undefined;
@ -3139,8 +3162,7 @@ define([
APP.answeredInForm = false; APP.answeredInForm = false;
showAnsweredPage(framework, content, { '_time': +new Date() }); showAnsweredPage(framework, content, { '_time': +new Date() });
if (content.answers.cantEdit) { if (content.answers.cantEdit) {
$cbox.hide(); $(radioContainer).hide();
if ($anonName) { $anonName.hide(); }
} }
}); });
}); });
@ -3248,10 +3270,9 @@ define([
return h('div.cp-form-send-container', [ return h('div.cp-form-send-container', [
invalid, invalid,
errors, errors,
cbox ? h('div.cp-form-anon-answer', [ h('div.cp-form-anon-answer', [
cbox, radioContainer
anonName ]),
]) : undefined,
reset, send reset, send
]); ]);
}; };

Loading…
Cancel
Save