portal/templates/registration_view.html

   1 {% extends "layout.html" %}
   2
   3 {% block content %}
   4
   5 <div class="row">
   6         <div class="col-md-12">
   7         <h1><img src="{{ STATIC_URL }}icons/user-xs.png" alt="User Registration" />User sign-up</h1>
   8         </div>
   9 </div>
  10 <div class="row">
  11         <div class="col-md-12">
  12                 <p><strong>Questions? <a href="/contact" >Contact us.</a></strong></p>
  13   </div>
  14 </div>
  15 {% if errors %}
  16 <div class="row">
  17         <div class="col-md-12">
  18                 <ul class="error">
  19                   {% for error in errors %}
  20                   <li>{{ error | safe }}</li>
  21                   {% endfor %}
  22                 </ul>
  23         </div>
  24 </div>
  25 {% endif %}
  26                                 <form action="/register" class="cmxform form-horizontal" method="post" enctype="multipart/form-data">
  27 <div class="row">
  28         <div class="col-md-12">
  29                         <div class="form-group">
  30                                 {% csrf_token %}
  31                                 <label for="authority_hrn" class="control-label">Organization</label>
  32                                 <p></p>
  33                 <div class="ui-widget">
  34                                 <select id="org_name" name="org_name" class="form-control" style="width:590px" value="{{ organization }}"
  35                                 title="Choose your organization (company/university) from the list that apears when you click in the field and start to type.
  36                                  Use the arrow keys to scroll through the list; type part of the name to narrow down the list. We will send an email to
  37                                  the managers that we have on record for your organization, asking them to validate your sign-up request." required>
  38                 {% if authorities %}
  39                     {% for authority in authorities %}
  40                         {% if authority.name %}
  41                             <option value="{{ authority.authority_hrn }}">{{authority.name}}</option>
  42                         {% else %}
  43                             <option value="{{ authority.authority_hrn }}">{{authority.authority_hrn}}</option>
  44                         {% endif %}
  45                     {% endfor %}
  46                 {% else %}
  47                     <option value:"">No authority found !!!</option>
  48                 {% endif %}
  49                 </select>
  50                 </div>
  51                                 <p></p>
  52                                 <p>Organization not listed? <a href="/portal/join">Request its addition now.</a></p>
  53                         </div>
  54         </div>
  55 </div>
  56
  57 <div class="row">
  58         <div class="col-md-6">
  59
  60             <div class="form-group">
  61                         <label for="firstname" class="control-label">Personal information</label>
  62                         <p></p>
  63                         <input type="text" name="firstname" class="form-control" style="width:350px" minlength="2" value="{{ first_name }}" placeholder="First name" required />
  64             </div>
  65             <div class="form-group">
  66                         <input type="text" name="lastname" size="25" class="form-control" style="width:350px" minlength="2" value="{{ last_name }}" placeholder="Last name" required />
  67             </div>
  68                 <div class="form-group">
  69                 <input type="email" name="email" size="25"  class="form-control" style="width:350px" value="{{ email }}"
  70                         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."
  71                         placeholder="Email" required />
  72                 </div>
  73         </div>
  74
  75         <div class="col-md-6">
  76             <div class="form-group">
  77               <label for="password" class="control-label">Authentication</label>
  78                   <p></p>
  79               <input type="password"  id="password" name="password"   class="form-control" style="width:250px" minlength="4" value="{{ password }}"
  80                         title="Your password allows you to log in to this portal."
  81                         placeholder="Password" required />
  82             </div>
  83             <div class="form-group">
  84                         <input type="password"  id="confirmpassword" name="confirmpassword" style="width:250px"  minlength="4" class="form-control" value=""
  85                                 placeholder="Confirm password" required />
  86             </div>
  87             <div class="form-group">
  88                         <select name="question" class="form-control" style="width:350px" id="key-policy"
  89                                 title="Your public/private key pair allows you to access the testbeds." required >
  90                                 <option value="generate">Generate my keys for me (recommended)</option>
  91                                 <option value="upload">Upload my public key (advanced users only)</option>
  92                         </select>
  93             </div>
  94             <div class="form-group" style="display:none;" id="upload_key">
  95                 <label for="file" class="control-label">Upload public key</label>
  96                 <input type="file" name="user_public_key" class="form-control" style="width:200px" id="user_public_key" />
  97                 <br />
  98                         <div class="alert alert-danger" id="pkey_del_msg">
  99                                 In order for the portal to contact testbeds on your behalf, so as to list and reserve resources, you will need to
 100                                 <a href="/portal/manual_delegation" target="_blank">delegate your credentials to the portal.</a>
 101                         </div>
 102             </div>
 103         </div>
 104 </div>
 105 <div class="row">
 106         <div class="col-md-12">
 107                 <div class="form-group">
 108                         <p></p>
 109                         <input type="checkbox" name="agreement" value="agreement" required />&nbsp;&nbsp; I agree to the
 110                         <a href="#" data-toggle="modal" data-target="#myModal">terms and conditions.</a>
 111                 </div>
 112         </div>
 113 </div>
 114 <div class="row">
 115         <div class="col-md-10">
 116                 <div class="form-group" id="register">
 117                         <span class="glyphicon glyphicon-info-sign"></span> &nbsp;
 118                 If you are a <b>PlanetLab Europe</b> user, please fill in this form using the same email address that you
 119                  currently use for your PlanetLab Europe account.
 120                 Your existing credentials will be used to validate your OneLab account.
 121                 Please be sure to specify a different password for your new OneLab account.
 122             </div>
 123         </div>
 124 </div>
 125 <div class="row">
 126         <div class="col-md-12">
 127                 <div class="form-group" id="register">
 128                         <p></p>
 129                 <input class="submit btn btn-onelab" type="submit" value="Sign up" />
 130                 </form>
 131             </div>
 132         </div>
 133 </div>
 134
 135         <!-- Modal - columns selector -->
 136 <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
 137                         <div class="modal-dialog">
 138                         <div class="modal-content">
 139                                 <div class="modal-header">
 140                                         <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
 141                                                 <h4 class="modal-title" id="myModalLabel">Terms & Conditions</h4>
 142                                 </div>
 143                                 <div class="modal-body">
 144                                                 <p align="left">
 145                                                         To be added soon.
 146                                                 </p>
 147
 148                                 </div>
 149                                 <div class="modal-footer">
 150                                         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
 151                                 </div>
 152                         </div>
 153                         </div>
 154 </div>
 155
 156
 157 <script>
 158 $(document).ready(function(){
 159     var availableTags = [
 160     {% if authorities %}
 161         {% for authority in authorities %}
 162             {% if authority.name %}
 163                 {value:"{{ authority.authority_hrn }}",label:"{{authority.name}}"},
 164                         // show hrn if we don't have the name
 165             {% else %}
 166                 {value:"{{ authority.authority_hrn }}",label:"{{authority.authority_hrn}}"},
 167             {% endif %}
 168         {% endfor %}
 169     {% else %}
 170         {value:"",label:"No authority found !!!"}
 171     {% endif %}
 172     ];
 173         // sorting the list
 174
 175         availableTags.sort(function(a,b){
 176                 var nameA=a.value.toLowerCase(), nameB=b.value.toLowerCase();
 177                 if (nameA < nameB) {
 178                 return -1;
 179                 }
 180                 if (nameA > nameB) {
 181                 return 1;
 182                 }
 183         return 0;
 184         });
 185         // auto-complete the form
 186     jQuery("#org_name").combobox();
 187         $('[title!=""]').qtip();
 188         $("form").validate();
 189         $("form").submit(function() {
 190                 if ($('select option:selected').val() == 'upload') {
 191                         if ($('input[name=user_public_key]').val() == '') {
 192                                 alert('Please specify the key file to upload');
 193                                 return false;
 194                         }
 195                 }
 196         });
 197 });
 198 </script>
 199 {% endblock %}
 200