hide and seek

src/Activate.purs

@@ -4,7 +4,7 @@ import Prelude (Unit, bind, not, pure, show, unit, ($), (&&), (<>), (=<<), (==))
 import Control.Monad.Aff (runAff)
 import Control.Monad.Eff (Eff)
 import Control.Monad.Eff.Console (CONSOLE, log)
-import Control.Monad.Eff.JQuery (JQuery, JQueryEvent, getValue, on, preventDefault, ready, select)
+import Control.Monad.Eff.JQuery (JQuery, JQueryEvent, display, hide, getValue, on, preventDefault, ready, select)
 
 import DOM (DOM)
 
@@ -32,6 +32,8 @@ main :: forall eff. Eff ( ajax :: AJAX
 main =
   ready $ do
     log "activating"
+    display =<< select ".js-hidden"
+    hide =<< select ".noscript"
     activate <- select "#activate"
     on "click" (onActivateClick activate) activate
 

src/Login.purs

@@ -4,7 +4,7 @@ import Prelude (Unit, bind, not, pure, show, unit, ($), (&&), (<$>), (<>), (=<<)
 import Control.Monad.Aff (runAff)
 import Control.Monad.Eff (Eff)
 import Control.Monad.Eff.Console (CONSOLE, log)
-import Control.Monad.Eff.JQuery (JQuery, JQueryEvent, getValue, hide, on, preventDefault, ready, select, setProp)
+import Control.Monad.Eff.JQuery (JQuery, JQueryEvent, display, getValue, hide, on, preventDefault, ready, select, setProp)
 
 import DOM (DOM)
 
@@ -36,6 +36,8 @@ main :: forall eff. Eff ( ajax :: AJAX
 main =
   ready $ do
     log "logging in"
+    display =<< select ".js-hidden"
+    hide =<< select ".noscript"
     login <- select "#login"
     on "click" (onLoginClick login) login
 

static/css/main.css

@@ -197,6 +197,10 @@ ul, ol {
 	text-align: left;
 }
 
+.js-hidden {
+	display: none;
+}
+
 @media (max-width: 755px) {
 	#main {
 		margin-top: 120px;

templates/activate.hamlet

@@ -1,18 +1,18 @@
 $newline always
 <div .medium>
-  <noscript>You need to have Javascript enabled
+  <div .noscript .btn .btn-danger>You need to have Javascript enabled
+  <form .js-hidden>
     <h3>Activate your account
-  <form>
     <div .form-group .required>
       <label for="password1">Password:
       <input #password1 type="password" required>
     <div .form-group .required>
       <label for="password2">Confirm your password:
       <input #password2 type="password" required>
-    <p #progress>
     <div .form-group .optional>
       <button #activate type="submit" data-token="#{token}" data-salt="#{hexSalt}">Activate
+    <div #progress>
 
   <script src="/static/js/jquery.min.js" type="text/javascript">
-  <script src="/static/js/jsSHA.js" type="text/javascript">
+  <!--<script src="/static/js/jsSHA.js" type="text/javascript">-->
   <script src="/static/js/purs_activate.js" type="text/javascript">

templates/login.hamlet

@@ -1,8 +1,8 @@
 $newline always
 <div .medium>
-  <noscript>Please enable Javascript
-  <h3>Login
-  <form>
+  <div .noscript .btn .btn-danger>Please enable Javascript to log in
+  <form .js-hidden>
+    <h3>Login
     <div .form-group .required>
       <label for="username">User:
       <input .form-control #username type="text" required>