Create client layout for managing users

public/scripts/manage/account.js

@@ -0,0 +1,33 @@
+import * as Data from "../data.js";
+import * as Form from "../form.js";
+
+const submissionForm = document.getElementById('submission-form');
+const emailTextbox = document.getElementById('email-textbox');
+const passwordTextbox = document.getElementById('password-textbox');
+const adminCheckbox = document.getElementById('admin-checkbox');
+const submitButton = document.getElementById('submit-button');
+const deleteButton = document.getElementById('delete-button');
+
+async function Initialize() {
+    let params = new URLSearchParams(location.search);
+    let accountID = params.get('account');
+    if(accountID) {
+        const account = await Data.getAccount(accountID);
+        console.log(account);
+
+        emailTextbox.value = account.email;
+
+        passwordTextbox.placeholder = "leave unchanged";
+
+        adminCheckbox.checked = account.isAdmin;
+
+        Form.addHiddenValue('account', accountID, submissionForm);
+
+        deleteButton.style.visibility = "visible";
+        deleteButton.disabled = false;
+    }
+    emailTextbox.disabled = false;
+    passwordTextbox.disabled = false;
+    adminCheckbox.disabled = false;
+}
+Initialize();

public/stylesheets/form.css

@@ -42,6 +42,6 @@ form {
       align-items: center;
   }
 
-  #admin {
+  #admin-checkbox {
       width: auto;
   }

routes/manage.js

@@ -138,7 +138,9 @@ router.post('/team', adminLoggedIn, function(req, res, next) {
 });
 
 router.get('/account', adminLoggedIn, (req, res, next) => {
-  res.render('accounts/createuser', { title: 'Create user' });
+  let title = req.query.account ? 'Manage User' : 'Create User'
+
+  res.render('accounts/createuser', { title });
 });
 
 module.exports = router;

views/accounts/createuser.pug

@@ -7,18 +7,23 @@ block stylesheets
 block content
   div#mobile-view
     h1 #{title}
-    form(action='/auth/register', method='POST')
+    form#submission-form(action='/auth/register', method='POST')
       span(class='form-section')
         label Email
         span(class='form-section-input')
-          input(type="email", name="email")
+          input#email-textbox(type="email", name="email" disabled)
       span(class='form-section')
         label Password 
-        span(class='form-section-input')
+        span(class='form-section-input' )
-          input(type="password", name="password")
+          input#password-textbox(type="password" name="password" disabled)
       span(class='form-section')
         span(class='form-section-checkbox')
-          input#admin(type="checkbox", name="admin")
+          input#admin-checkbox(type="checkbox" name="admin" disabled)
-          label(for="admin") Grant admin privileges
+          label(for="admin-checkbox") Grant admin privileges
       span(class='form-section')
-        button#submit-button(type="submit") Submit
+        button#submit-button(type="submit" disabled) Submit
+    span(class='form-section')
+      button#delete-button(type="delete" disabled) Delete
+
+block scripts 
+  script(src='/scripts/manage/account.js' type="module")