gistfile1.txt

(page "index.html"
  (:require
    [tailrecursion.hoplon.reload :refer [reload-all]]))

(reload-all 1000)

(defn register! [fname lname email pass pass2]
  (println "register! called with:" fname lname email "***" "***"))

(with-init!
  (.bootstrapValidator (js/jQuery "#signupForm")
    (clj->js {"feedbackIcons" {"valid" "glyphicon glyphicon-ok"
                               "invalid" "glyphicon glyphicon-remove"
                               "validating" "glyphicon glyphicon-refresh"}
              "fields" {"fname" {"message" "The first name is not valid"
                                 "validators" {"notEmpty" {}
                                               "different" {"field" "pass"
                                                            "message" "The first name and password cannot be the same as each other"}}}
                        "email" {"validators" {"notEmpty" {}
                                               "emailAddress" {}}}
                        "pass" {"validators" {"notEmpty" {}
                                              "different" {"field" "fname"
                                                           "message" "The password cannot be the same as the first name"}
                                              "stringLength" {"min" 6
                                                              "message" "The password must have at least 6 characters."}}}
                        "pass2" {"validators" {"notEmpty" {"message" "The password is required and cannot be empty"}
                                               "different" {"field" "fname"
                                                            "message" "The password cannot be the same as the first name"}
                                               "stringLength" {"min" 6
                                                               "message" "The password must have at least 6 characters"}
                                               "identical" {"field" "pass"
                                                            "message" "The confirm password must be the same as password"}}}}})))
(html
  (head
   (link :href "css/bootstrap.css" :rel "stylesheet")
   (link :href "css/bootstrapValidator.css" :rel "stylesheet")
   (script :src "js/bootstrap.js" :type "text/javascript")
   (script :src "js/bootstrapValidator.js" :type "text/javascript"))
 (body
  (div :class "container"
       (div :class "row"
            (div :class "col-md-6"
                 (form :id "signupForm"
                       :role "form"
                       :class "form-horizontal"
                       :on-submit #(register! (val-id "fname") (val-id "lname")
                                              (val-id "email") (val-id "pass") (val-id "pass2"))
                       (legend "Create account (programmatic validation)")
                       (div :class "form-group"
                            (label :for "fname" :class "col-xs-4 control-label" "First name:")
                            (div :class "col-xs-8"
                                 (input :class "form-control" :type "text" :id "fname" :autofocus ""
                                        :name "fname"
                                        :placeholder "Anna")))

                       (div :class "form-group"
                            (label :for "lname" :class "col-xs-4 control-label" "Last name:")
                            (div :class "col-xs-8"
                                 (input :class "form-control" :type "text" :id "lname"
                                        :name "lname"
                                        :placeholder "Andersson")))

                       (div :class "form-group"
                            (label :for "email" :class "col-xs-4 control-label" "Email:")
                            (div :class "col-xs-8"
                                 (input :class "form-control" :type "email" :id "email"
                                        :name "email"
                                        :placeholder "anna.andersson@example.com")))

                       (div :class "form-group"
                            (label :for "pass" :class "col-xs-4 control-label" "Password:")
                            (div :class "col-xs-8"
                                 (input :class "form-control" :type "password" :id "pass"
                                        :name "pass"
                                        :placeholder "Password")))

                       (div :class "form-group"
                            (label :for "pass2" :class "col-xs-4 control-label" "Confirm password:")
                            (div :class "col-xs-8"
                                 (input :class "form-control" :type "password" :id "pass2"
                                        :name "pass2"
                                        :placeholder "Your password again")))

                       (div :class "form-group"
                            (div :class "col-xs-offset-4 col-xs-8"
                                 (button :class "btn btn-primary" :type "submit" "Create account")))))
            #_(script :src "js/signupForm.js" :type "text/javascript")
            (div :class "col-md-6"
                 (form :id "signupForm2"
                       :role "form"
                       :class "form-horizontal"
                       :on-submit #(register! (val-id "fname") (val-id "lname")
                                              (val-id "email") (val-id "pass") (val-id "pass2"))
                       :data-bv-feedbackicons-valid "glyphicon glyphicon-ok"
                       :data-bv-feedbackicons-invalid "glyphicon glyphicon-remove"
                       :data-bv-feedbackicons-validating "glyphicon glyphicon-refresh"
                       (legend "Create account (declarative validation)")
                       (div :class "form-group"
                            (label :for "fname" :class "col-xs-4 control-label" "First name:")
                            (div :class "col-xs-8"
                                 (input :class "form-control" :type "text" :id "fname" :autofocus ""
                                        :placeholder "Anna"
                                        :name "fname"
                                        :data-bv-notempty "true"
                                        :data-bv-notempty-message "The first name is required and cannot be empty")))

                       (div :class "form-group"
                            (label :for "lname" :class "col-xs-4 control-label" "Last name:")
                            (div :class "col-xs-8"
                                 (input :class "form-control" :type "text" :id "lname"
                                        :name "lname"
                                        :placeholder "Andersson"
                                        :data-bv-notempty "true"
                                        :data-bv-notempty-message "The last name is required and cannot be empty")))

                       (div :class "form-group"
                            (label :for "email" :class "col-xs-4 control-label" "Email:")
                            (div :class "col-xs-8"
                                 (input :class "form-control" :type "email" :id "email"
                                        :name "email"
                                        :placeholder "anna.andersson@example.com"
                                        :data-bv-notempty "true"
                                        :data-bv-notempty-message "The email is required and cannot be empty"
                                        :data-bv-emailaddress "true"
                                        :data-bv-emailaddress-message "The email address is not valid")))

                       (div :class "form-group"
                            (label :for "pass" :class "col-xs-4 control-label" "Password:")
                            (div :class "col-xs-8"
                                 (input :class "form-control" :type "password" :id "pass"
                                        :name "pass"
                                        :placeholder "Password"
                                        :data-bv-notempty "true"
                                        :data-bv-notempty-message "The password is required and cannot be empty")))

                       (div :class "form-group"
                            (label :for "pass2" :class "col-xs-4 control-label" "Confirm password:")
                            (div :class "col-xs-8"
                                 (input :class "form-control" :type "password" :id "pass2"
                                        :name "pass2"
                                        :placeholder "Your password again"
                                        :data-bv-notempty "true"
                                        :data-bv-notempty-message "The password confirmation is required and cannot be empty")))

                       (div :class "form-group"
                            (div :class "col-xs-offset-4 col-xs-8"
                                 (button :class "btn btn-primary" :type "submit" "Create account")))))))))