From: Nick Downing <nick@ndcode.org>
Date: Sun, 16 Jan 2022 01:34:57 +0000 (+1100)
Subject: Change input(type="button" value="...") to button(type="button") {...}, remove form... 
X-Git-Url: https://git.ndcode.org/public/gitweb.cgi?p=ndcode_site.git;a=commitdiff_plain;h=4742ac36cd144f476d8eb324f4d035d3794d93dc

Change input(type="button" value="...") to button(type="button") {...}, remove form markup around the sign in and feedback forms as we submit them ourselves
---

diff --git a/_lib/navbar.jst b/_lib/navbar.jst
index c4bef68..4e80d95 100644
--- a/_lib/navbar.jst
+++ b/_lib/navbar.jst
@@ -201,24 +201,21 @@ return async (env, head, body, scripts) => {
               span.h4.modal-title {'Sign in'}
             }
             div.modal-body {
-              form#sign-in-form {
-                div.row {
-                  div.col-md-12 {
-                    div.form-group {
-                      label.form-label(for="sign-in-form-email") {'Email'}
-                      input.form-control#sign-in-form-email(type="text" name="email" placeholder="Account email address" required="required" maxlength=256) {}
-                    }
+              div.row {
+                div.col-md-12 {
+                  div.form-group {
+                    label.form-label(for="sign-in-email") {'Email'}
+                    input.form-control#sign-in-email(type="text" placeholder="Account email address" required="required" maxlength=256) {}
                   }
                 }
-                div.row {
-                  div.col-md-12 {
-                    div.form-group {
-                      label.form-label(for="sign-in-form-password") {'Password'}
-                      input.form-control#sign-in-form-password(type="password" name="password" placeholder="Account password" required="required" minlength=8 maxlength=256) {}
-                    }
+              }
+              div.row {
+                div.col-md-12 {
+                  div.form-group {
+                    label.form-label(for="sign-in-password") {'Password'}
+                    input.form-control#sign-in-password(type="password" placeholder="Account password" required="required" minlength=8 maxlength=256) {}
                   }
                 }
-                input.btn.btn-success.btn-send(style="display: none;" type="submit" value="Sign in") {}
               }
 
               p.mt-2 {
@@ -235,7 +232,7 @@ return async (env, head, body, scripts) => {
               button.btn.btn-outline-secondary(type="button" data-dismiss="modal") {
                 'Cancel'
               }
-              button.btn.btn-primary(type="submit" form="sign-in-form") {
+              button.btn.btn-primary#sign-in-submit(type="button") {
                 'Sign in'
               }
             }
@@ -253,36 +250,33 @@ return async (env, head, body, scripts) => {
               p {
                 'Did you notice something not quite right, or just want to share your impression of this page?'
               }
-              form#feedback-form {
-                div.row {
-                  div.col-md-12 {
-                    div.form-group {
-                      label(for="feedback-form-message") {'Message *'}
-                      textarea.form-control#feedback-form-message(name="message" placeholder="Please tell us your thoughts" rows="4" required="required" data-error="Please, leave us a message.") {}
-                      div.help-block.with-errors {}
-                    }
+              div.row {
+                div.col-md-12 {
+                  div.form-group {
+                    label(for="feedback-message") {'Message *'}
+                    textarea.form-control#feedback-message(placeholder="Please tell us your thoughts" rows="4" required="required" data-error="Please, leave us a message.") {}
+                    div.help-block.with-errors {}
                   }
                 }
-                p {} // fix this later
-                div.row {
-                  div.col-md-12 {
-                    p.text-muted {
-                      strong {'*'}
-                      'These fields are required.'
-                      //'Contact form template by '
-                      //a(href="https://bootstrapious.com/p/how-to-build-a-working-bootstrap-feedback-form" target="_blank") {'Bootstrapious'}
-                      //'.'
-                    }
+              }
+              p {} // fix this later
+              div.row {
+                div.col-md-12 {
+                  p.text-muted {
+                    strong {'*'}
+                    'These fields are required.'
+                    //'Contact form template by '
+                    //a(href="https://bootstrapious.com/p/how-to-build-a-working-bootstrap-feedback-form" target="_blank") {'Bootstrapious'}
+                    //'.'
                   }
                 }
-                input.btn.btn-success.btn-send(style="display: none;" type="submit" value="Send message") {}
               }
             }
             div.modal-footer {
               button.btn.btn-outline-secondary(type="button" data-dismiss="modal") {
                 'Cancel'
               }
-              button.btn.btn-primary(type="submit" form="feedback-form") {
+              button.btn.btn-primary#feedback-submit(type="button") {
                 'Submit'
               }
             }
@@ -332,8 +326,8 @@ return async (env, head, body, scripts) => {
             document.getElementById('sign-in').addEventListener(
               'click',
               () => {
-                document.getElementById('sign-in-form-email').value = ''
-                document.getElementById('sign-in-form-password').value = ''
+                document.getElementById('sign-in-email').value = ''
+                document.getElementById('sign-in-password').value = ''
                 $('#sign-in-modal').modal('show')
               }
             )
@@ -342,21 +336,19 @@ return async (env, head, body, scripts) => {
               'shown.bs.modal',
               () => {
                 console.log('bloo')
-                $('#sign-in-form-email').focus()
+                $('#sign-in-email').focus()
               }
             )
 
-            $(document).on(
-              'submit',
-              '#sign-in-form',
-              async e => {
-                e.preventDefault()
+            document.getElementById('sign-in-submit').addEventListener(
+              'click',
+              async () => {
                 let email
                 try {
-                  email = document.getElementById('sign-in-form-email').value.slice(0, 256).toLowerCase()
+                  email = document.getElementById('sign-in-email').value.slice(0, 256).toLowerCase()
                   await sign_in(
                     email,
-                    document.getElementById('sign-in-form-password').value.slice(0, 256)
+                    document.getElementById('sign-in-password').value.slice(0, 256)
                   )
                 }
                 catch (error) {
@@ -435,7 +427,7 @@ return async (env, head, body, scripts) => {
             document.getElementById('give-feedback').addEventListener(
               'click',
               () => {
-                $('#feedback-form-message').text('')
+                $('#feedback-message').text('')
                 $('#feedback-modal').modal('show')
                 return false
               }
@@ -444,22 +436,20 @@ return async (env, head, body, scripts) => {
             $('#feedback-modal').on(
               'shown.bs.modal',
               () => {
-                $('#feedback-form-message').focus()
+                $('#feedback-message').focus()
               }
             )
 
-            $(document).on(
-              'submit',
-              '#feedback-form',
-              e => {
-                e.preventDefault()
+            document.getElementById('feedback-submit').addEventListener(
+              'click',
+              () => {
                 $.ajax(
                   {
                     url: '/api/feedback.html',
                     type: 'POST',
                     data: {
                       page: window.location.href,
-                      message: $('#feedback-form-message').val()
+                      message: $('#feedback-message').val()
                     },
                     success: (data, textStatus, jqXHR) => {
                       $('#feedback-modal').modal('hide')
diff --git a/contact/index.html.jst b/contact/index.html.jst
index 2216fc6..d74ae78 100644
--- a/contact/index.html.jst
+++ b/contact/index.html.jst
@@ -117,7 +117,7 @@ return async env => {
           p {} // fix this later
           div.row {
             div.col-md-12 {
-              input.btn.btn-success.btn-send(type="submit" value="Send message") {}
+              button.btn.btn-success.btn-send(type="submit") {'Send message'}
             }
           }
           p {} // fix this later
diff --git a/my_account/index.html.jst b/my_account/index.html.jst
index 0e44a6c..a1db88e 100644
--- a/my_account/index.html.jst
+++ b/my_account/index.html.jst
@@ -40,7 +40,7 @@ return async env => {
       //        p {'Note: If your name is one word or does not fit given names/family name pattern, then please enter given names only; we will address you by your given names. Your given names will be visible to other users if you comment on our blog. Your email and family name will remain private.'}
       //        div.row {
       //          div.col-md-12 {
-      //            input.btn.btn-success.btn-send(type="submit" value="Change") {}
+      //            button.btn.btn-success.btn-send(type="submit") {'Change'}
       //          }
       //        }
       //      }
@@ -130,7 +130,7 @@ return async env => {
       //        }
       //        div.row {
       //          div.col-md-12 {
-      //            input.btn.btn-success.btn-send(type="submit" value="Change") {}
+      //            button.btn.btn-success.btn-send(type="submit") {'Change'}
       //          }
       //        }
       //      }
@@ -231,7 +231,7 @@ return async env => {
       //        }
       //        div.row {
       //          div.col-md-12 {
-      //            input.btn.btn-success.btn-send(type="submit" value="Change") {}
+      //            button.btn.btn-success.btn-send(type="submit") {'Change'}
       //          }
       //        }
       //      }
@@ -260,7 +260,7 @@ return async env => {
       //        }
       //        div.row {
       //          div.col-md-12 {
-      //            input.btn.btn-success.btn-send(type="submit" value="Change") {}
+      //            button.btn.btn-success.btn-send(type="submit") {'Change'}
       //          }
       //        }
       //      }
@@ -287,7 +287,7 @@ return async env => {
       //        }
       //        div.row {
       //          div.col-md-12 {
-      //            input.btn.btn-success.btn-send(type="submit" value="Change") {}
+      //            button.btn.btn-success.btn-send(type="submit") {'Change'}
       //          }
       //        }
       //      }
diff --git a/my_account/password_reset/index.html.jst b/my_account/password_reset/index.html.jst
index 0295275..0e74ab5 100644
--- a/my_account/password_reset/index.html.jst
+++ b/my_account/password_reset/index.html.jst
@@ -60,7 +60,7 @@ return async env => {
                 }
               }
 
-              input.btn.btn-success#step-1-continue(type="button" value="Continue") {}
+              button.btn.btn-success#step-1-continue(type="button") {'Continue'}
               p.'mt-3'.mb-0 {'* This field is required.'}
             }
           }
@@ -88,8 +88,8 @@ return async env => {
             div.card-body {
               p#step-2-message {'Please enter account details first.'}
 
-              input.btn.btn-outline-secondary#step-2-back(type="button" value="Back") {}
-              input.btn.btn-outline-secondary.ml-3#step-2-resend-email(type="button" value="Re-send email") {}
+              button.btn.btn-outline-secondary#step-2-back(type="button") {'Back'}
+              button.btn.btn-outline-secondary.ml-3#step-2-resend-email(type="button") {'Re-send email'}
             }
           }
         }
diff --git a/my_account/send_verification_email/index.html.jst b/my_account/send_verification_email/index.html.jst
index 9b5d588..cc03ade 100644
--- a/my_account/send_verification_email/index.html.jst
+++ b/my_account/send_verification_email/index.html.jst
@@ -54,7 +54,7 @@ return async env => {
                 }
               }
 
-              input.btn.btn-success#step-1-continue(type="button" value="Continue") {}
+              button.btn.btn-success#step-1-continue(type="button") {'Continue'}
               p.'mt-3'.mb-0 {'* This field is required.'}
             }
           }
@@ -82,8 +82,8 @@ return async env => {
             div.card-body {
               p#step-2-message {'Please enter account details first.'}
 
-              input.btn.btn-outline-secondary#step-2-back(type="button" value="Back") {}
-              input.btn.btn-outline-secondary.ml-3#step-2-resend-email(type="button" value="Re-send email") {}
+              button.btn.btn-outline-secondary#step-2-back(type="button") {'Back'}
+              button.btn.btn-outline-secondary.ml-3#step-2-resend-email(type="button") {'Re-send email'}
             }
           }
         }
diff --git a/my_account/sign_up/index.html.jst b/my_account/sign_up/index.html.jst
index 179a407..9f10481 100644
--- a/my_account/sign_up/index.html.jst
+++ b/my_account/sign_up/index.html.jst
@@ -107,13 +107,13 @@ return async env => {
                   img#verification-image(src="/api/verification_image.png?seq=0" width=300 height=150) {}
                 }
                 div.'col-md-2'.my-auto.text-center {
-                  input.btn.btn-outline-secondary#'step-1-new-code'(type="button" value="New code") {}
+                  button.btn.btn-outline-secondary#'step-1-new-code'(type="button") {'New code'}
                 }
               }
 
               p.mt-3 {'Note: If your name is one word or does not fit given names/family name pattern, then please enter given names only. Your given names are visible to other users if you comment on our blog. Your email and family name remain private.'}
 
-              input.btn.btn-success#step-1-continue(type="button" value="Continue") {}
+              button.btn.btn-success#step-1-continue(type="button") {'Continue'}
               p.'mt-3'.mb-0 {'* These fields are required.'}
             }
           }
@@ -141,8 +141,8 @@ return async env => {
             div.card-body {
               p#step-2-message {'Please enter your details first.'}
 
-              input.btn.btn-outline-secondary#step-2-back(type="button" value="Back") {}
-              input.btn.btn-outline-secondary.ml-3#step-2-continue(type="button" value="Continue") {}
+              button.btn.btn-outline-secondary#step-2-back(type="button") {'Back'}
+              button.btn.btn-outline-secondary.ml-3#step-2-continue(type="button") {'Continue'}
             }
           }
         }
@@ -169,8 +169,8 @@ return async env => {
             div.card-body {
               p#step-3-message {'Please create your account first.'}
 
-              input.btn.btn-outline-secondary#step-3-back(type="button" value="Back") {}
-              input.btn.btn-outline-secondary.ml-3#step-3-resend-email(type="button" value="Re-send email") {}
+              button.btn.btn-outline-secondary#step-3-back(type="button") {'Back'}
+              button.btn.btn-outline-secondary.ml-3#step-3-resend-email(type="button") {'Re-send email'}
             }
           }
         }
diff --git a/my_account/verify_email/index.html.jst b/my_account/verify_email/index.html.jst
index ffb3cca..e61683d 100644
--- a/my_account/verify_email/index.html.jst
+++ b/my_account/verify_email/index.html.jst
@@ -68,7 +68,7 @@ return async env => {
                 }
               }
 
-              input.btn.btn-success#step-1-continue(type="button" value="Continue") {}
+              button.btn.btn-success#step-1-continue(type="button") {'Continue'}
               p.'mt-3'.mb-0 {'* These fields are required.'}
             }
           }
@@ -96,8 +96,8 @@ return async env => {
             div.card-body {
               p#step-2-message {'Please enter link details first.'}
 
-              input.btn.btn-outline-secondary#step-2-back(type="button" value="Back") {}
-              input.btn.btn-outline-secondary.ml-2#step-2-sign-in(type="button" value="Sign in") {}
+              button.btn.btn-outline-secondary#step-2-back(type="button") {'Back'}
+              button.btn.btn-outline-secondary.ml-2#step-2-sign-in(type="button") {'Sign in'}
             }
           }
         }
diff --git a/my_account/verify_password/index.html.jst b/my_account/verify_password/index.html.jst
index 67d441c..a61916d 100644
--- a/my_account/verify_password/index.html.jst
+++ b/my_account/verify_password/index.html.jst
@@ -68,7 +68,7 @@ return async env => {
                 }
               }
 
-              input.btn.btn-success#step-1-continue(type="button" value="Continue") {}
+              button.btn.btn-success#step-1-continue(type="button") {'Continue'}
               p.'mt-3'.mb-0 {'* These fields are required.'}
             }
           }
@@ -96,8 +96,8 @@ return async env => {
             div.card-body {
               p#step-2-message {'Please enter link details first.'}
 
-              input.btn.btn-outline-secondary#step-2-back(type="button" value="Back") {}
-              input.btn.btn-outline-secondary.ml-2#step-2-sign-in(type="button" value="Sign in") {}
+              button.btn.btn-outline-secondary#step-2-back(type="button") {'Back'}
+              button.btn.btn-outline-secondary.ml-2#step-2-sign-in(type="button") {'Sign in'}
             }
           }
         }