LDAP integration: change name/email/password/keys -- Guilherme Iecker
[myslice.git] / portal / templates / fibre / fibre_registration_view.html
index eb59dfe..44b16a7 100644 (file)
@@ -4,13 +4,13 @@
 
 <div class="row">
        <div class="col-md-12">
-       <h1><img src="{{ STATIC_URL }}img/icon_user_small.png" alt="User Registration" /> FIBRE Experimenter Registration</h1>
+       <h1><img src="{{ STATIC_URL }}icons/user-xs.png" alt="User Registration" />User sign-up</h1>
        </div>
 </div>
 <div class="row">
        <div class="col-md-12">
-               <h3>For First Line Support please <a href="/portal/contact" >Contact Support</a></h3>
-       </div>
+               <p><strong>Questions? <a href="/portal/contact" >Contact us.</a></strong></p>
+  </div>
 </div>
 {% if errors %}
 <ul>
   {% endfor %}
 </ul>
 {% endif %}
-   
+
+
+<form action="/register" class="cmxform form-horizontal" method="post" enctype="multipart/form-data">
 <div class="row">
-       <div class="col-md-2"></div>
-       <div class="col-md-8">
-       <form class="cmxform form-horizontal" id="registrationForm" method="post" enctype="multipart/form-data" role="form">
-    {% csrf_token %}
-    <div class="form-group">
-       <label for="firstname" class="control-label">First Name</label>
-               <input type="text" name="firstname" class="form-control" minlength="2" value="{{ firstname }}" placeholder="First Name" required />
-    </div>
-    <div class="form-group">
-       <label for="lastname" class="control-label">Last Name</label>
-               <input type="text" name="lastname" size="25" class="form-control" minlength="2" value="{{ lastname }}" placeholder="Last Name" required />
-    </div>
-    <div class="form-group">
-      <label for="authority_hrn" class="control-label">Authority</label>
-      <input id="authority_hrn" name="authority_hrn" class="form-control" value="{{ authority_hrn }}" required>
-      <p class="help-block">An authority responsible for vetting your account</p>
-    </div>
+       
+       <div class="col-md-12">
+                       
+                       <div class="form-group">
+                               {% csrf_token %}
+                               <label for="authority_hrn" class="control-label">Organization</label>
+                               <p></p>
+                               <input id="authority_hrn" name="org_name" class="form-control" style="width:590px" value="{{ organization }}" 
+                               title="Choose your organization (company/university) from the list that apears when you click in the field and start to type.
+                                Use the arrow keys to scroll through the list; type part of the name to narrow down the list. If it is not in the list, 
+                               please choose the FIBRE organization. We will send an email to the managers that we have on record for
+                               your organization, asking them to validate your sign-up request." required />
+                               <p></p>
+                               <!-- <p>Organization not listed? <a href="/portal/join">Request its addition now.</a></p> -->
+                       </div>
+       </div>
+</div>
 
-       <!-- LOGIN
-       TODO: Login should be suggested from user email or first/last name, and
-       checked for existence. In addition, the full HRN should be shown to the
-       user.
-    <div class="form-group">
-      <label for="login" class="col-xs-2 control-label">Login</label>
-      <div class="col-xs-4">
-         <input type="text" name="login" size="25" class="form-control" minlength="2" value="{{ login }}" placeholder="Login" required />
-      </div>
-      <div class="col-xs-6"><p class="form-hint">Enter your login</p></div>
-    </div>
-       -->
+<div class="row">
+       <div class="col-md-6">
+       
+           <div class="form-group">
+                       <label for="firstname" class="control-label">Personal information</label>
+                       <p></p>
+                       <input type="text" name="firstname" class="form-control" style="width:350px" minlength="2" value="{{ first_name }}" placeholder="First name" required />
+           </div>
+           <div class="form-group">
+                       <input type="text" name="lastname" size="25" class="form-control" style="width:350px" minlength="2" value="{{ last_name }}" placeholder="Last name" required />
+           </div>
+               <div class="form-group">
+               <input type="email" name="email" size="25"  class="form-control" style="width:350px" value="{{ email }}" 
+                       title="Your e-mail address will be your identifier for logging in. We contact you to verify your account and then, occasionally, for important issues."
+                       placeholder="Email" required />
+               </div>
+               <div class="form-group">
+                       <label for="Reasons" class="control-label" >Reasons for Applying</label>
+                       <p></p>
+                       <textarea type="text" rows="4" cols="70" name="reasons" size="25" class="form-control" style="width:350px;height:60px"  minlength="5" maxlength="250" value="{{reasons}}" placeholder="Reasons for applying" title="Identify yourself and tell us more about your expectations to use the testbed." required ></textarea>
+               </div>
+       </div>  
 
-    <div class="form-group">
-       <label for="email" class="control-label">Email</label>
-       <input type="email" name="email" size="25"  class="form-control" value="{{ email }}" required/>
-    </div>
-    <div class="form-group">
-      <label for="password" class="control-label">Password</label>
-      <input type="password"  id="password" name="password"   class="form-control" minlength="4" value="{{ password }}" required/>
-    </div>
-    <div class="form-group">
-       <label for="password" class="control-label">Confirm Password</label>
-               <input type="password"  id="confirmpassword" name="confirmpassword"   minlength="4" class="form-control" value="" placeholder="Confirm Password" required/>
-    </div>
-    <div class="form-group">
-       <label for="question" class="control-label">My Keys</label>
-               <select name="question" class="form-control" id="key-policy" required>        
-                       <option value="generate">Generate key pairs for me </option>
-                       <option value="upload">Upload my public key </option>
-               </select>
-       <p class="help-block">Genkey: Account Delegation Automatic (Recommended)</p>
-    </div>
-    <div class="form-group" style="display:none;" id="upload_key">
-       <label for="file" class="control-label">Upload public key</label>
-       <input type="file" name="user_public_key" class="form-control" id="user_public_key" required>
-       <br />
-               <div class="alert alert-danger" id="pkey_del_msg">
-                       Once your account is validated, you will have to delegate your credentials manually using SFA [Advanced users only]
+       <div class="col-md-6">
+           <div class="form-group">
+             <label for="password" class="control-label">Authentication</label>
+                 <p></p>       
+                       <input type="text" name="username" size="25" class="form-control" style="width:350px" minlength="5" value="{{ username }}" placeholder="Username" required />
+           </div>
+            <div class="form-group">
+                       <input type="password"  id="password" name="password"   class="form-control" style="width:250px" minlength="4" value="{{ password }}" 
+                       title="Your password allows you to log in to this portal."
+                       placeholder="Password" required />      
+           </div>
+           <div class="form-group">
+                       <input type="password"  id="confirmpassword" name="confirmpassword" style="width:250px"  minlength="4" class="form-control" value="" 
+                               placeholder="Confirm password" required />
+           </div>
+           <div class="form-group">
+                       <select name="question" class="form-control" style="width:350px" id="key-policy" 
+                               title="Your public/private key pair allows you to access the testbeds." required >        
+                               <option value="generate">Generate my keys for me (recommended)</option>
+                               <option value="upload">Upload my public key (advanced users only)</option>
+                       </select>
+           </div>
+           <div class="form-group" style="display:none;" id="upload_key">
+               <label for="file" class="control-label">Upload public key</label>
+               <input type="file" name="user_public_key" class="form-control" style="width:200px" id="user_public_key" />
+               <br />
+                       <div class="alert alert-danger" id="pkey_del_msg">
+                               In order for the portal to contact testbeds on your behalf, so as to list and reserve resources, you will need to 
+                               <a href="http://trac.myslice.info/wiki/InstallSfa" target="_blank">delegate your public key to the portal.</a>
+                       </div>
+           </div>
+       </div>
+</div>
+<div class="row">
+       <div class="col-md-12">
+               <div class="form-group">
+                       <p></p>
+                       <input type="checkbox" name="agreement" value="agreement" required />&nbsp;&nbsp; I agree to the 
+                       <a href="#" data-toggle="modal" data-target="#myModal">terms and conditions.</a> 
                </div>
-       <p class="help-block">Account Delegation: Manual (Advanced Users)</p>
-    </div>
-    <div class="form-group" id="register">
-      <button class="submit btn btn-default" type="submit">Register</button>
-    </div>
-  </form>  
+       </div>
 </div>
+<div class="row">
+       <div class="col-md-12">
+               <div class="form-group" id="register">
+                       <p></p> 
+               <input class="submit btn btn-onelab" type="submit" value="Request My Account" />
+
+           </div>
+       </div>
+</div>
+</form>
+
+       <!-- Modal - columns selector -->
+<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+                       <div class="modal-dialog">
+                       <div class="modal-content">
+                               <div class="modal-header">
+                                       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+                                               <h4 class="modal-title" id="myModalLabel">Terms & Conditions</h4>
+                               </div>
+                               <div class="modal-body">
+                                               <p align="left">
+                                       Fibre: Future Internet testbeds experimentation between Brazil and Europe
+                                       <br/>
+                                               <a href="/portal/terms" target="_blank">[Printable format]</a>
+                                               </p>
+                   <p align="justify">
+                    By registering as a FIBRE-BR testbed user, experimenters shall be deemed to accept these conditions of use:
+                    </p>
+                   <ol style="text-align:justify">
+                                        <li>
+                        Users shall not use the testbed resources for any unlawful purpose and not (attempt to) breach or circumvent any administrative or security controls.
+                    </li><br/>
+                                        <li>
+                        Users shall respect intellectual property and confidentiality agreements.
+                    </li><br/>
+                                        <li>
+                        Users shall protect their access credentials (e.g. private keys or passwords).
+                    </li><br/>
+                                        <li>
+                        User access credentials will expire 1 year after your registration. Users can renew your registration at any time after the expiry date.
+                    </li><br/>
+                                        <li>
+                        Users shall immediately report any known or suspected security breach or misuse of the testbed or access credentials to FIBRE-BR´s Network Operation Centre (a.k.a. NOC).
+                    </li><br/>
+                                        <li>
+                        Users must notify the NOC of any changes to their Registration Information.
+                    </li><br/>
+                                        <li>
+                        Use of the testbed resources is at their own risk. The resources offered by each island are provided “as is”, with no guarantee that the testbed will be available at any time or that it will suit any purpose.
+                    </li><br/>
+                                        <li>
+                        Logged information, including information provided by users for registration purposes, is used for administrative, operational, accounting, monitoring and security purposes only. This information may be disclosed, via secured mechanisms, only for the same purposes and only as far as necessary to other organizations cooperating with the FIBRE-BR testbed. Although efforts are made to maintain confidentiality, no guarantees are given.
+                    </li><br/>
+                                        <li>
+                        The island administrators and resource providers are entitled to regulate, suspend or terminate users’ access, within their domain of authority, and users shall immediately comply with their instructions.
+                    </li><br/>
+                                        <li>
+                        Users are liable for the consequences of their violation of any of these conditions of use.
+                    </li><br/>
+                   </ol>
+                               </div>
+                               <div class="modal-footer">
+                                       <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+                               </div>
+                       </div>
+                       </div>
+</div>
+
+    
 <script>
-jQuery(document).ready(function(){
+$(document).ready(function(){
     var availableTags = [
     {% if authorities %}
         {% for authority in authorities %}
             {% if authority.name %}
-                {value:"{{ authority.authority_hrn }}",label:"{{authority.name}}"},
+                {value:"{{ authority.name }}",label:"{{authority.name}}"},
             {% else %}
-                {value:"{{ authority.authority_hrn }}",label:"{{authority.authority_hrn}}"},
+               {% if authority.authority_hrn == "fibre.ufrj" %}
+                        {value:"{{ authority.authority_hrn }}",label:"UFRJ - UNIVERSIDADE FEDERAL DO RIO DE JANEIRO"},
+                {% else %}
+                      {% if authority.authority_hrn == "fibre.ufg" %}
+                              {value:"{{ authority.authority_hrn }}",label:"UFG - UNIVERSIDADE FEDERAL DE GOIAS"},
+                      {% else %}
+                              {% if authority.authority_hrn == "fibre.uff" %}
+                                     {value:"{{ authority.authority_hrn }}",label:"UFF - UNIVERSIDADE FEDERAL FLUMINENSE"},
+                              {% else %}
+                                     {% if authority.authority_hrn == "fibre.ufpa" %}
+                                             {value:"{{ authority.authority_hrn }}",label:"UFPA - UNIVERSIDADE FEDERAL DO PARA"},
+                                     {% else %}
+                                             {% if authority.authority_hrn == "fibre.ufpe" %}
+                                                     {value:"{{ authority.authority_hrn }}",label:"UFPE - UNIVERSIDADE FEDERAL DE PERNAMBUCO"},
+                                             {% else %}
+                                                     {% if authority.authority_hrn == "fibre.ufscar" %}
+                                                            {value:"{{ authority.authority_hrn }}",label:"UFSCAR - UNIVERSIDADE FEDERAL DE SAO CARLOS"},
+                                                     {% else %}
+                                                            {% if authority.authority_hrn == "fibre.unifacs" %}
+                                                                     {value:"{{ authority.authority_hrn }}",label:"UNIFACS - UNIVERSIDADE SALVADOR"},
+                                                            {% else %}
+                                                                     {% if authority.authority_hrn == "fibre.usp" %}
+                                                                            {value:"{{ authority.authority_hrn }}",label:"USP - UNIVERSIDADE DE SAO PAULO"},
+                                                                     {% else %}
+                                                                            {% if authority.authority_hrn == "fibre.cpqd" %}
+                                                                                    {value:"{{ authority.authority_hrn }}",label:"CPQD - CENTRO DE PESQUISA E DESENVOLVIMENTO EM TELECOMUNICACOES"},
+                                                                            {% else %}
+                                                                                    {% if authority.authority_hrn == "fibre.rnp" %}
+                                                                                             {value:"{{ authority.authority_hrn }}",label:"(Catch-all) RNP - REDE NACIONAL DE ENSINO E PESQUISA"},
+                                                                                    {% else %}
+                                                                                       {% if authority.authority_hrn == "fibre.i2cat" %}
+                                                                                               {value:"{{ authority.authority_hrn }}",label:"I2CAT - FOUNDATION, RESEARCH AND INNOVATION IN THE INTERNET AREA"},
+                                                                                       {% else %}
+                                                                                               {% if authority.authority_hrn == "fibre.uth" %}
+                                                                                                        {value:"{{ authority.authority_hrn }}",label:"UTH - UNIVERSITY OF THESSALY"},
+                                                                                               {% else %}
+                                                                                                     {% if authority.authority_hrn == "fibre.bristol" %}
+                                                                                                            {value:"{{ authority.authority_hrn }}",label:"UNIBRIS - UNIVERSITY OF BRISTOL"},
+                                                                                                      {% else %}
+                                                                                                            {% if authority.authority_hrn == "fibre.upmc" %}
+                                                                                                                   {value:"{{ authority.authority_hrn }}",label:"UPMC - UNIVERSITE PIERRE ET MARIE CURIE"},
+                                                                                                            {% else %}
+                                                                                                                   {value:"{{ authority.authority_hrn }}",label:"FIBRE"},
+                                                                                                               {% endif %}
+                                                                                               {% endif %}
+                                                                                       {% endif %}
+                                                                               {% endif %}
+                                                                            {% endif %}
+                                                                         {% endif %}
+                                                                     {% endif %}
+                                                            {% endif %}
+                                                    {% endif %}
+                                             {% endif %}
+                                    {% endif %}
+                              {% endif %}
+                      {% endif %}
+                {% endif %}
             {% endif %}
         {% endfor %}    
     {% else %}
         {value:"",label:"No authority found !!!"}
     {% endif %}
     ];
-    jQuery( "#authority_hrn" ).autocomplete({
+       // sorting the list
+       availableTags.sort(function(a,b){
+               var nameA=a.value.toLowerCase(), nameB=b.value.toLowerCase();
+               if (nameA < nameB) {
+               return -1;
+               }
+               if (nameA > nameB) {
+               return 1;
+               }
+       return 0;
+       }); 
+       // auto-complete the form
+    $( "#authority_hrn" ).autocomplete({
       source: availableTags,
       minLength: 0,
       change: function (event, ui) {
@@ -114,6 +271,17 @@ jQuery(document).ready(function(){
       }
       //select: function( event, ui ) {console.log(jQuery(this))}
     });
+       // for hover texts
+       $('[title!=""]').qtip();
+       $("form").validate();
+       $("form").submit(function() {
+               if ($('select option:selected').val() == 'upload') {
+                       if ($('input[name=user_public_key]').val() == '') {
+                               alert('Please specify the key file to upload');
+                               return false;
+                       }
+               }
+       });
 });
 </script>
 {% endblock %}