{% extends "layout-unfold1.html" %}

{% block unfold_main %}    

<div class="onelab-title well-lg">
 <h2>Join the OneLab Federation</h2>
</div>

<div class="well">
OneLab welcomes companies, universities, and research laboratories to join the OneLab Federation of Testbeds. <br>
We are supported by the European Commision through its 7th Framework Programs and FIRE initiative (Future Internet Research and Experimentation), as well as by other national and international funding initiatives.
<br>
<br>
If you wish to become a new member of OneLab Federation, you should first consult the Membership Agreement.
<br>
</div>

{% if errors %}
<div class="well">
    <ul class="error">
     {% for error in errors %}
     <li>{{ error }}</li>
     {% endfor %}
    </ul>
</div>
{% endif %}
  
<div class="well">
  <form action="" id="joinForm" method="post">
  {% csrf_token %}
    <fieldset>
      <table>
        <tr><td colspan="2"><h4>Site Information</h4></td></tr>
        <tr>
          <th><label for="site_name">Site name: <span class="form-required" title="This field is required.">*</span></label></th>
          <td><input type="text" id="site_name" name="site_name" value="{{ site_name }}" size="20" maxlength="40" class="form-control" required> </td>
        </tr>
       <tr>
          <th><label for="root_authority_hrn">Root authority: <span class="form-required" title="This field is required.">*</span></label></th>
          <td> 
               <select id="root_authority_hrn" name="root_authority_hrn" class="form-control" required>
               {% if root_authorities %}
                    {% for root_auth in root_authorities %}
               <option>{{ root_auth.authority_hrn }}</option>
                    {% endfor %}
               {% endif %}
               </select>
<!--
               <div class="ui-widget">
                   <input id="root_authority_hrn" name="root_authority_hrn" class="form-control" value="{{ root_authority_hrn }}" required>
               </div>
-->
          </td>
        </tr>
        <tr>
          <th><label for="site_authority">Site authority: <span class="form-required" title="This field is required.">*</span></label></th>
          <td><input type="text" id="site_authority" name="site_authority" value="{{ site_authority }}" size="10" maxlength="16" class="form-control" required> </td>
        </tr>
        <tr>
          <th><label for="site_abbreviated_name">Abbreviated name: <span class="form-required" title="This field is required.">*</span></label></th>
          <td><input type="text" id="site_abbreviated_name" name="site_abbreviated_name" value="{{ site_abbreviated_name }}" size="20" maxlength="40" class="form-control" required> </td>
        </tr>
        <tr>
          <th><label for="site_url">URL: <span class="form-required" title="This field is required.">*</span></label></th>
          <td><input type="text" id="site_url" name="site_url" value="{{ site_url }}" size="30" maxlength="128" class="form-control" required> </td>
        </tr>
        <tr>
          <th><label for="site_latitude">Latitude: <span class="form-required" title="This field is required.">*</span></label></th>
          <td><input type="text" id="site_latitude" name="site_latitude" value="{{ site_latitude }}" size="10" maxlength="10" class="form-control" required> </td>
        </tr>
        <tr>
          <th><label for="site_longitude">Longitude: <span class="form-required" title="This field is required.">*</span></label></th>
          <td><input type="text" id="site_longitude" name="site_longitude" value="{{ site_longitude }}" size="10" maxlength="10" class="form-control" required> </td>
        </tr>
        <tr><td colspan="2">&nbsp;</td></tr>
        <tr><td colspan="2"><h4>Principal Investigator Information</h4></td></tr>
        <tr>
          <th><label for="pi_first_name">PI First Name: <span class="form-required" title="This field is required.">*</span></label></th>
          <td><input type="text" id="pi_first_name" name="pi_first_name" value="{{ pi_first_name }}" size="20" maxlength="20" class="form-control" required> </td>
        </tr>
        <tr>
          <th><label for="pi_last_name">PI Last Name: <span class="form-required" title="This field is required.">*</span></label></th>
          <td><input type="text" id="pi_last_name" name="pi_last_name" value="{{ pi_last_name }}" size="20" maxlength="20" class="form-control" required> </td>
        </tr>
<!--
        <tr>
          <th><label class="" for="pi_title">PI Title: </label></th>
          <td><input type="text" id="pi_title" name="pi_title" value="{{ pi_title }}" size="6" maxlength="6" class="form-text "> </td>
        </tr>
-->
        <tr>
          <th><label for="pi_phone">PI Phone: <span class="form-required" title="This field is required.">*</span></label></th>
          <td><input type="text" id="pi_phone" name="pi_phone" value="{{ pi_phone }}" size="20" maxlength="20" class="form-control" required> </td>
        </tr>
        <tr>
          <th><label for="pi_email">PI email: <span class="form-required" title="This field is required.">*</span></label></th>
          <td><input type="text" id="pi_email" name="pi_email" value="{{ pi_email }}" size="20" maxlength="40" class="form-control" required> </td>
        </tr>
        <tr>
          <th><label for="pi_password">PI password: <span class="form-required" title="This field is required.">*</span></label></th>
          <td><input type="password" id="pi_password" name="pi_password" value="" size="20" maxlength="20" class="form-control" required> </td>
        </tr>
        <tr><td colspan="2">&nbsp;</td></tr>
        <tr><td colspan="2"><h4>Postal address</h4></td></tr>
        <tr>
          <th><label class="" for="address_line1">Address: </label></th>
          <td><input type="text" id="address_line1" name="address_line1" value="{{ address_line1 }}" size="30" maxlength="40" class="form-text"> </td>
        </tr>
        <tr>
          <th><label class="" for="address_line2">Address (2): </label></th>
          <td><input type="text" id="address_line2" name="address_line2" value="{{ address_line2 }}" size="30" maxlength="40" class="form-text"> </td>
        </tr>
        <tr>
          <th><label class="" for="address_line3">Address (3): </label></th>
          <td><input type="text" id="address_line3" name="address_line3" value="{{ address_line3 }}" size="30" maxlength="40" class="form-text"> </td>
        </tr>
        <tr>
          <th><label class="" for="address_city">City: </label></th>
          <td><input type="text" id="address_city" name="address_city" value="{{ address_city }}" size="20" maxlength="20" class="form-text"> </td>
        </tr>
        <tr>
          <th><label class="" for="address_postalcode">Postal Code: </label></th>
          <td><input type="text" id="address_postalcode" name="address_postalcode" value="{{ address_postalcode }}" size="10" maxlength="10" class="form-text"> </td>
        </tr>
        <tr>
          <th><label class="" for="address_state">State: </label></th>
          <td><input type="text" id="address_state" name="address_state" value="{{ address_state }}" size="20" maxlength="20" class="form-text"> </td>
        </tr>
        <tr>
          <th><label class="" for="address_country">Country: </label></th>
          <td><input type="text" id="address_country" name="address_country" value="{{ address_country }}" size="20" maxlength="20" class="form-text "> </td>
        </tr>
        <tr><td colspan="2">&nbsp;</td></tr>
        <tr><td colspan="2" style="text-align:center"><input type="submit" name="op" value="Register" class="form-submit"></td></tr>
      </table>
    </fieldset>
  </form>
</div>

<div class="well">
A membership agreement document will be sent to your email address as a PDF file.
<br>
Please print and sign a copy of the agreement and send it to:
<br>
<br>
Ciro Scognamiglio<br>
UPMC - LIP6<br>
Campus Jussieu<br>
Couloir 26-00, bureau 102<br>
Boite courrier 169<br>
4 place Jussieu<br>
F-75252 PARIS cedex 05 - FRANCE<br>
<br>
Once your membership has been processed we will contact you to welcome you as a member.
<br>
If you have any questions about membership, contact the <a href="/portal/contact" >OneLab Support team</a>.
</div>
<script>
/*
jQuery(document).ready(function(){
  var availableTags = [
  {% if root_authorities %}
    {% for authority in root_authorities %}
    {value:"{{ authority.authority_hrn }}",label:"{{authority.authority_hrn}}"},
    {% endfor %}  
  {% else %}
    {value:"",label:"No authority found !!!"}
  {% endif %}
  ];
  jQuery( "#root_authority_hrn" ).autocomplete({
   source: availableTags,
   minLength: 0,
   change: function (event, ui) {
     if(!ui.item){
       //http://api.jqueryui.com/autocomplete/#event-change -
       // The item selected from the menu, if any. Otherwise the property is null
       //so clear the item for force selection
       jQuery("#root_authority_hrn").val("");
     }
   }
   //select: function( event, ui ) {console.log(jQuery(this))}
  });
});
*/
</script>
{% endblock %}