Add email format validation to the input text field in the setup modal.
[arvados.git] / apps / workbench / app / views / users / _setup_popup.html.erb
index 0fc0110301db1bd23b64a5d5274e2cb8c853b8f9..90cab2cc9c206bd26690673158c5425fe5e30446 100644 (file)
@@ -1,33 +1,38 @@
-  <div class="modal-header">
-    <h3 id="myModalLabel">Information you had already provided is prefilled for you. You may change it as needed.</h3>
-  </div>
-
   <div class="modal-body">
-    <%= uuid = @object.uuid %>
-    <%= disable_email = @object.uuid? %>
-    <%= identity_url_prefix = @current_selections[:identiry_url_prefix] %>
-    <%= selected_repo = @current_selections[:repo_name] %>
-    <%= selected_vm = @current_selections[:vm_uuid] %>
-
-    <%= form_tag setup_user_url(id: uuid), method: 'get', remote: true, class: 'form-search' do %>    
+    <% if @object%>
+      <% uuid = @object.uuid %>
+      <% email = @object.email %>
+    <% end %>
+    <% disable_email = uuid != nil %>
+    <% identity_url_prefix = @current_selections[:identity_url_prefix] %>
+    <% disable_url_prefix = identity_url_prefix != nil %>
+    <% selected_repo = @current_selections[:repo_name] %>
+    <% selected_vm = @current_selections[:vm_uuid] %>
+    
+    <%= form_tag setup_user_path, {id: 'setup_form', name: 'setup_form', method: 'get', 
+                    class: 'form-search', remote: true} do %>
+      <input id="user_uuid" maxlength="250" name="user_uuid" type="hidden" value="<%=uuid%>">
       <div>
         <table><tbody>
           <tr>
             <% if disable_email %>
               <td> Email </td>
-              <td> <input id="email" maxlength="250" name="email" type="text" value="<%=@object.email%>" disabled=<%=disable_email%> > </td>
+              <td> <input id="email" maxlength="250" name="email" type="text" value="<%=email%>" 
+                    disabled=true > </td>
             <% else %>
               <td> Email </td>
               <td> <input id="email" maxlength="250" name="email" type="text" > </td>
             <% end %>
           </tr>
           <tr>
-            <% if disable_email %>
-              <td> Identity URL Prefix </td>
-              <td> <input id="openid_prefix" maxlength="250" name="openid_prefix" type="text" value="<%=identity_url_prefix%>" disabled=<%=disable_email%> > </td>
+            <% if disable_url_prefix %>
+              <td> Identity URL Prefix &nbsp </td>
+              <td> <input id="openid_prefix" maxlength="250" name="openid_prefix" type="text" 
+                    value="<%=identity_url_prefix%>" disabled=true > </td>
             <% else %>
               <td> Openid Prefix </td>
-              <td> <input id="openid_prefix" maxlength="250" name="openid_prefix" type="text"> </td>
+              <td> <input id="openid_prefix" maxlength="250" name="openid_prefix" type="text" 
+                    value="<%= Rails.configuration.default_openid_prefix %>"> </td>
             <% end %>
           </tr>
           <tr>
             <td> Virtual Machine </td>
             <td>
               <select name="vm_uuid">
+                <% if selected_vm %>
+                  <option value=""> Choose One: </option>
+                <% else %>
+                  <option value="" selected> Choose One: </option>
+                <% end %>
                 <% @vms.each do |vm| %>
                   <% if selected_vm == vm.uuid %>
                     <option value=<%=vm.uuid%> selected> <%=vm.hostname%> </option>
           </tr>
         </tbody></table>
       </div>
-      <div align="left">
-        <button type="submit" class="btn">Submit</button>
-        <button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
+      <div align="center">
+        <br/>
+        <button type="submit" id="register" class="btn btn-primary" autofocus>Submit</button>
+        <button class="btn btn-primary" data-dismiss="modal" aria-hidden="true">Cancel</button>
       </div>
     <% end %>
   </div>
+
+<script>
+  var $input = $('input:text'),
+  $register = $('#register');
+
+  var email_disabled = document.forms["setup_form"]["email"].disabled;
+  var email_value = document.forms["setup_form"]["email"].value;
+  var prefix_value = document.forms["setup_form"]["openid_prefix"].value;
+  if ((email_disabled == false) && (email_value == null || email_value == "" || 
+        prefix_value == null || prefix_value == "")) {
+    $register.attr('disabled', true);
+  }
+
+  $input.keyup(function() {
+    var trigger = false;
+
+    var email_disabled = document.forms["setup_form"]["email"].disabled;
+    var email_value = document.forms["setup_form"]["email"].value;
+    var prefix_value = document.forms["setup_form"]["openid_prefix"].value;
+
+    var emailRegExp = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
+    var validEmail = false;
+    if (emailRegExp.test(email_value )) {
+      validEmail = true;
+    }
+
+    if ((email_disabled == false) && (!validEmail || email_value == null || 
+            email_value == "" || prefix_value == null || prefix_value == "")){
+      trigger = true;
+    }
+
+    trigger ? $register.attr('disabled', true) : $register.removeAttr('disabled');
+  });
+</script>