zydronium/manage.get.gov
1
0
Fork 0
mirror of https://github.com/cisagov/manage.get.gov.git synced 2025-07-23 11:16:07 +02:00
Code Issues Projects Releases Packages Wiki Activity

some js refactors

Browse source
This commit is contained in:
David Kennedy 2025-02-24 15:13:47 -05:00
parent 0aef61a875
commit 8b4b4872c3
No known key found for this signature in database
GPG key ID: 6528A5386E66B96B
1 changed files with 84 additions and 53 deletions
Download patch file Download diff file Expand all files Collapse all files

137
src/registrar/assets/src/js/getgov/form-nameservers.js
View file

@ -1,67 +1,98 @@
import { showElement, hideElement } from './helpers';
function handleAddFormClick(e) {
let nameserversForm = document.querySelector('.nameservers-form');
if (!nameserversForm) {
console.warn('Expected DOM element but did not find it');
return;
export class NameserverForm {
constructor() {
this.addNameserverButton = document.getElementById('nameserver-add-form');
this.nameserversForm = document.querySelector('.nameservers-form');
// Bind event handlers to maintain 'this' context
this.handleAddFormClick = this.handleAddFormClick.bind(this);
this.handleEditClick = this.handleEditClick.bind(this);
this.handleCancelClick = this.handleCancelClick.bind(this);
}
init() {
this.initializeNameserverFormDisplay();
this.initializeEventListeners();
}
initializeNameserverFormDisplay() {
// Check if exactly two nameserver forms exist: id_form-1-server is present but id_form-2-server is not
const secondNameserver = document.getElementById('id_form-1-server');
const thirdNameserver = document.getElementById('id_form-2-server'); // This should not exist
// Check if there are error messages in the form (indicated by elements with class 'usa-alert--error')
const errorMessages = document.querySelectorAll('.usa-alert--error');
if (secondNameserver && !thirdNameserver && errorMessages.length > 0) {
showElement(this.nameserversForm);
hideElement(this.addNameserverButton);
}
}
initializeEventListeners() {
this.addNameserverButton.addEventListener('click', this.handleAddFormClick);
showElement(nameserversForm);
const editButtons = document.querySelectorAll('.nameserver-edit');
editButtons.forEach(editButton => {
editButton.addEventListener('click', this.handleEditClick);
});
if (e?.target) {
hideElement(e.target);
}
}
function handleEditClick(e) {
let editButton = e.target;
let readOnlyRow = editButton.closest('tr'); // Find the closest row
let editRow = readOnlyRow.nextElementSibling; // Get the next row
if (!editRow || !readOnlyRow) {
console.warn("Expected DOM element but did not find it");
return;
const cancelButtons = document.querySelectorAll('.nameserver-cancel');
cancelButtons.forEach(cancelButton => {
cancelButton.addEventListener('click', this.handleCancelClick);
});
}
// Check if any other edit row is currently visible and hide it
document.querySelectorAll('tr.edit-row:not(.display-none)').forEach(openEditRow => {
let correspondingReadOnlyRow = openEditRow.previousElementSibling;
hideElement(openEditRow);
showElement(correspondingReadOnlyRow);
});
hideElement(readOnlyRow);
showElement(editRow);
}
function handleCancelClick(e) {
let cancelButton = e.target;
let editRow = cancelButton.closest('tr'); // Find the closest row
let readOnlyRow = editRow.previousElementSibling; // Get the next row
if (!editRow || !readOnlyRow) {
console.warn("Expected DOM element but did not find it");
return;
handleAddFormClick(event) {
showElement(this.nameserversForm);
hideElement(this.addNameserverButton);
}
handleEditClick(e) {
let editButton = e.target;
let readOnlyRow = editButton.closest('tr'); // Find the closest row
let editRow = readOnlyRow.nextElementSibling; // Get the next row
if (!editRow || !readOnlyRow) {
console.warn("Expected DOM element but did not find it");
return;
}
// Check if any other edit row is currently visible and hide it
document.querySelectorAll('tr.edit-row:not(.display-none)').forEach(openEditRow => {
let correspondingReadOnlyRow = openEditRow.previousElementSibling;
hideElement(openEditRow);
showElement(correspondingReadOnlyRow);
});
hideElement(readOnlyRow);
showElement(editRow);
}
handleCancelClick(e) {
let cancelButton = e.target;
let editRow = cancelButton.closest('tr'); // Find the closest row
let readOnlyRow = editRow.previousElementSibling; // Get the next row
if (!editRow || !readOnlyRow) {
console.warn("Expected DOM element but did not find it");
return;
}
hideElement(editRow);
showElement(readOnlyRow);
}
hideElement(editRow);
showElement(readOnlyRow);
}
export function initFormNameservers() {
const addButton = document.getElementById('nameserver-add-form');
if (!addButton) return;
document.addEventListener('DOMContentLoaded', () => {
addButton.addEventListener('click', handleAddFormClick);
const editButtons = document.querySelectorAll('.nameserver-edit');
editButtons.forEach(editButton => {
editButton.addEventListener('click', handleEditClick);
// Initialize NameserverForm if nameserver-add-form button is present in DOM
if (document.getElementById('nameserver-add-form')) {
const nameserverForm = new NameserverForm();
nameserverForm.init();
}
});
const cancelButtons = document.querySelectorAll('.nameserver-cancel');
cancelButtons.forEach(cancelButton => {
cancelButton.addEventListener('click', handleCancelClick);
})
}
}