Additional cleanup

This commit is contained in:
zandercymatics 2024-07-15 14:51:22 -06:00
parent cd8cc5cfbe
commit c4449c8f6c
No known key found for this signature in database
GPG key ID: FF4636ABEC9682B7
2 changed files with 51 additions and 80 deletions

View file

@ -526,109 +526,82 @@ function initializeWidgetOnList(list, parentId) {
* This shows the auto generated email on action needed reason. * This shows the auto generated email on action needed reason.
*/ */
(function () { (function () {
let actionNeededReasonDropdown = document.querySelector("#id_action_needed_reason"); // Since this is an iife, these vars will be removed from memory afterwards
let actionNeededEmail = document.querySelector("#id_action_needed_reason_email"); var actionNeededReasonDropdown = document.querySelector("#id_action_needed_reason");
var actionNeededEmail = document.querySelector("#id_action_needed_reason_email");
var readonlyView = document.querySelector("#action-needed-reason-email-readonly");
let actionNeededEmailData = document.getElementById('action-needed-emails-data').textContent; let actionNeededEmailData = document.getElementById('action-needed-emails-data').textContent;
let noEmailMessage = document.querySelector("#no-email-message");
const oldDropdownValue = actionNeededReasonDropdown ? actionNeededReasonDropdown.value : null; const oldDropdownValue = actionNeededReasonDropdown ? actionNeededReasonDropdown.value : null;
const oldEmailValue = actionNeededEmailData ? actionNeededEmailData.value : null; const oldEmailValue = actionNeededEmailData ? actionNeededEmailData.value : null;
const emptyReasonText = "-";
const noEmailText = "No email will be sent.";
const domainRequestId = actionNeededReasonDropdown ? document.querySelector("#domain_request_id").value : null const domainRequestId = actionNeededReasonDropdown ? document.querySelector("#domain_request_id").value : null
const emailSentSessionVariableName = `actionNeededEmailSent-${domainRequestId}`; const emailSentSessionVariableName = `actionNeededEmailSent-${domainRequestId}`;
const emptyReasonText = "-";
const noEmailText = "No email will be sent.";
if(actionNeededReasonDropdown && actionNeededEmail && domainRequestId) {
// Add a change listener to dom load
handleDomLoadActionNeededEmail();
if(actionNeededReasonDropdown && actionNeededEmail && actionNeededEmailData && domainRequestId) {
// Add a change listener to the action needed reason dropdown // Add a change listener to the action needed reason dropdown
handleChangeActionNeededEmail(actionNeededReasonDropdown, actionNeededEmail, actionNeededEmailData); let actionNeededEmailsJson = JSON.parse(actionNeededEmailData)
handleChangeActionNeededEmail(actionNeededEmailsJson);
}
function handleDomLoadActionNeededEmail() {
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
let reason = actionNeededReasonDropdown.value; let reason = actionNeededReasonDropdown.value;
noEmailMessage.innerHTML = reason ? noEmailText : emptyReasonText;
if (reason && reason != "other") {
// Show the email
showElement(actionNeededEmail);
hideElement(noEmailMessage);
} else {
// Show the no email message
hideElement(actionNeededEmail);
showElement(noEmailMessage);
}
// Handle the session boolean (to enable/disable editing)
let emailWasSent = document.getElementById("action-needed-email-sent") let emailWasSent = document.getElementById("action-needed-email-sent");
if (emailWasSent && emailWasSent.value === "True") { if (emailWasSent && emailWasSent.value === "True") {
// An email was sent out - store that information in a session variable // An email was sent out - store that information in a session variable
addOrRemoveSessionBoolean(emailSentSessionVariableName, add=true) addOrRemoveSessionBoolean(emailSentSessionVariableName, add=true);
} }
if (sessionStorage.getItem(emailSentSessionVariableName) !== null) { // Show an editable email field or a readonly one
// Show the readonly field, hide the editable field updateActionNeededEmailDisplay(reason)
showReadonly(actionNeededEmail.parentElement)
}else {
// No email was sent out -- show the editable field
hideReadonly(actionNeededEmail.parentElement)
}
}); });
} }
function handleChangeActionNeededEmail(actionNeededReasonDropdown, actionNeededEmail, actionNeededEmailData) { function handleChangeActionNeededEmail(actionNeededEmailsJson) {
actionNeededReasonDropdown.addEventListener("change", function() { actionNeededReasonDropdown.addEventListener("change", function() {
let reason = actionNeededReasonDropdown.value; let reason = actionNeededReasonDropdown.value;
let actionNeededEmailsJson = JSON.parse(actionNeededEmailData) let emailBody = reason in actionNeededEmailsJson ? actionNeededEmailsJson[reason] : null;
if (reason && emailBody) {
// Show the "no email will be sent" text only if a reason is actually selected. // Replace the email content
noEmailMessage.innerHTML = reason ? noEmailText : emptyReasonText; actionNeededEmail.value = emailBody;
if (reason && reason in actionNeededEmailsJson) {
let emailBody = actionNeededEmailsJson[reason];
if (emailBody) {
// Show the email
actionNeededEmail.value = emailBody
showElement(actionNeededEmail);
hideElement(noEmailMessage);
// Reset the session object on change since change refreshes the email content. // Reset the session object on change since change refreshes the email content.
// Only do this if we change the action needed reason, or if we:
// change the reason => modify email content => change back to old reason.
if (oldDropdownValue !== actionNeededReasonDropdown.value || oldEmailValue !== actionNeededEmail.value) { if (oldDropdownValue !== actionNeededReasonDropdown.value || oldEmailValue !== actionNeededEmail.value) {
let emailSent = sessionStorage.getItem(emailSentSessionVariableName) let emailSent = sessionStorage.getItem(emailSentSessionVariableName)
if (emailSent !== null){ if (emailSent !== null){
addOrRemoveSessionBoolean(emailSentSessionVariableName, add=false) addOrRemoveSessionBoolean(emailSentSessionVariableName, add=false)
} }
} }
if (sessionStorage.getItem(emailSentSessionVariableName) !== null) {
// Show the readonly field, hide the editable field
showReadonly(actionNeededEmail.parentElement)
}else {
// No email was sent out -- show the editable field
hideReadonly(actionNeededEmail.parentElement)
} }
}else { // Show an editable email field or a readonly one
// Show the no email message updateActionNeededEmailDisplay(reason)
hideElement(actionNeededEmail);
showElement(noEmailMessage);
}
}else {
// Show the no email message
hideElement(actionNeededEmail);
showElement(noEmailMessage);
}
}); });
} }
function showReadonly(actionNeededEmailParent) { // Shows an editable email field or a readonly one.
let readonlyView = document.querySelector("#action-needed-reason-email-readonly") // If the email doesn't exist or if we're of reason "other", display that no email was sent.
if (readonlyView) { // Likewise, if we've sent this email before, we should just display the content.
showElement(readonlyView) function updateActionNeededEmailDisplay(reason) {
hideElement(actionNeededEmailParent) let emailHasBeenSentBefore = sessionStorage.getItem(emailSentSessionVariableName) !== null;
} let collapseableDiv = readonlyView.querySelector('.collapse--dgsimple');
} if ((reason && reason != "other") && !emailHasBeenSentBefore) {
showElement(actionNeededEmail.parentElement)
function hideReadonly(actionNeededEmailParent) {
let readonlyView = document.querySelector("#action-needed-reason-email-readonly")
if (readonlyView) {
hideElement(readonlyView) hideElement(readonlyView)
showElement(actionNeededEmailParent) } else {
if (!reason || reason === "other") {
collapseableDiv.innerHTML = reason ? noEmailText : emptyReasonText;
}
hideElement(actionNeededEmail.parentElement)
showElement(readonlyView)
} }
} }
})(); })();

View file

@ -145,9 +145,8 @@ This is using a custom implementation fieldset.html (see admin/fieldset.html)
{% block field_other %} {% block field_other %}
{% if field.field.name == "action_needed_reason_email" %} {% if field.field.name == "action_needed_reason_email" %}
<p id="no-email-message" class="{% if original_object.action_needed_reason %}display-none{% endif %}">No email will be sent.</p> <div id="action-needed-reason-email-readonly" class="readonly margin-top-0 padding-top-0 display-none">
<div id="action-needed-reason-email-readonly" class="readonly display-none"> <div class="margin-top-05 collapse--dgsimple collapsed">
<div class="collapse--dgsimple collapsed">
{{ field.field.value|linebreaks }} {{ field.field.value|linebreaks }}
</div> </div>
<button type="button" class="collapse-toggle--dgsimple usa-button usa-button--unstyled margin-top-0 margin-bottom-1 margin-left-1"> <button type="button" class="collapse-toggle--dgsimple usa-button usa-button--unstyled margin-top-0 margin-bottom-1 margin-left-1">
@ -157,7 +156,6 @@ This is using a custom implementation fieldset.html (see admin/fieldset.html)
</svg> </svg>
</button> </button>
</div> </div>
<div> <div>
{{ field.field }} {{ field.field }}
<input id="action-needed-email-sent" class="display-none" value="{{action_needed_email_sent}}"> <input id="action-needed-email-sent" class="display-none" value="{{action_needed_email_sent}}">