From: Ciro Scognamiglio <ciro.scognamiglio@cslash.net>
Date: Fri, 4 Jul 2014 15:11:24 +0000 (+0200)
Subject: breadcrumbs, copied some templates in the onleab theme dir
X-Git-Tag: myslice-1.1~60^2~3
X-Git-Url: http://git.onelab.eu/?a=commitdiff_plain;h=e9f4c27f8db6850b0a583f5be192e102ab44bc13;p=myslice.git

breadcrumbs, copied some templates in the onleab theme dir
---

diff --git a/portal/static/css/onelab.css b/portal/static/css/onelab.css
index 458e5acb..3486d15e 100644
--- a/portal/static/css/onelab.css
+++ b/portal/static/css/onelab.css
@@ -11,6 +11,7 @@ body {
 }
 a, a:active, a:focus {
     outline: 0;
+    text-decoration:none;
 }
 
 h1 {
@@ -55,6 +56,11 @@ span.label {
 div.el {
     padding-bottom:15px;
 }
+div.breadcrumbs {
+    margin:15px 0;
+    color:gray;
+    font-size:10pt;
+}
 /* buttons */
 button.btn, input.btn {
     padding:6px 10px;
@@ -264,27 +270,21 @@ div#ticket-request p {
 }
 
 ul.nav-tabs {
-    margin:15px 0;
+    margin:0 0 15px 0;
 }
 ul.nav-tabs ul {}
 ul.nav-tabs li {}
 
 ul.nav-section li a {
+    color:black;
     border-bottom:0;
 }
 ul.nav-section li:first-child {
     padding:0;
 }
 ul.nav-section li:first-child a {
-    font-weight:bold;
-    padding:6px 15px 4px 15px;
 }
 ul.nav-section li:first-child.active a {
-    padding:6px 15px 3px 15px;
-}
-ul.nav-section li:first-child img {
-    margin:0 4px 1px 0;
-    padding:0;
 }
 
 ul.nav-resources {
diff --git a/portal/templates/base.html b/portal/templates/base.html
index 5989508a..940d1c17 100644
--- a/portal/templates/base.html
+++ b/portal/templates/base.html
@@ -66,7 +66,7 @@ $(document).ready(function() {
         var items = [];
 		
         $.each( slices, function(i, val) {
-            items.push( "<li><a href=\"/slice/"+val+"\">" + val + "</a></li>" );
+            items.push( "<li><a href=\"/resources/"+val+"\">" + val + "</a></li>" );
         });
         $("div#home-slice-list").html($( "<ul/>", { html: items.join( "" ) }));
         $("ul#dropdown-slice-list").append(items.join( "" ));
diff --git a/portal/templates/contact.html b/portal/templates/contact.html
index d9d2c518..fdb5d0dd 100644
--- a/portal/templates/contact.html
+++ b/portal/templates/contact.html
@@ -33,7 +33,7 @@
 	      	{{ field.errors }} {{ field }}
 	    </div>
 	    {% endfor %}
-		<button type="submit" class="btn btn-primary">Create Ticket</button>
+		<button type="submit" class="btn btn-onelab">Create Ticket</button>
 		</form>
 	</div>
 </div>
diff --git a/portal/templates/onelab/onelab_account-view.html b/portal/templates/onelab/onelab_account-view.html
new file mode 100644
index 00000000..9941e97c
--- /dev/null
+++ b/portal/templates/onelab/onelab_account-view.html
@@ -0,0 +1,332 @@
+{% extends "layout.html" %}
+{% block content %}
+
+<div class="row">
+	<div class="col-md-12">
+		 <div class="breadcrumbs">
+		 	 Account &nbsp;>&nbsp; {{ person.email }}
+		 </div>
+	</div>
+</div>
+{% if messages %}
+<ul class="messages">
+    {% for message in messages %}
+    <li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message }}</li>
+    {% endfor %}
+</ul>
+{% endif %}
+<div class="row">
+	<div class="col-md-12">
+		<ul class="nav nav-tabs nav-section">
+			<li class="active"><a href="#profile">User Profile</a></li>
+			<li><a href="#account">Account</a></li>
+			<li><a href="#access">Testbed Access</a></li>
+		</ul>
+    </div>
+</div>
+<div class="tab-content">
+	<div class="tab-pane active row" id="profile">
+		
+	  	<div class="col-md-12">
+
+			<form id="editForm" method="post" action="account_process" enctype="multipart/form-data">
+			  	{% csrf_token %}
+			  		<table class="profile">          
+			    		<tr>
+			      			<td colspan="2">
+								<div><h3>Platform: Myslice</h3></div>
+			      			</td>
+			    		</tr>
+			    		<tr>
+			      			<td class="key">Email</td>
+			      			<td class="value">
+								<span id="emailval" class="value" >{{ person.email }}</span>
+								<button class="btn btn-default" type="button" id="edit_email" onclick="editAlert();"  title="To change your affiliation please contact the administrator">
+		    						<span class="glyphicon glyphicon-question-sign"></span> Edit
+								</button>
+							</td>
+			      		</tr>
+			      		<tr class="odd">
+							<td class="key">Password</td>
+							<td class="value"> 
+				  				<button class="btn btn-default btn-xs" type="button" title="Password" name="edit_pass" id="edit_pass">
+									<span class="glyphicon glyphicon-edit"></span> Edit
+								</button>
+				  				<span id="passval"class="value">******** </span>
+				  				<span class="hide_this" id="span_pass">
+				    				<button type="button" class="btn btn-default btn-xs" title="Cancel" id="cancel_pass_change"> Cancel </button>
+				    				<div style='display:none;' id="pass_form">
+				    				<input type='hidden'  value='' /></div>
+				    				<table id="edit_password">
+				      					<tr>
+											<td>Enter password: </td>
+											<td class="field"> <input type="password" name="password" id="password" /> </td>
+				      						</tr>
+				      						<tr>
+											<td>Confirm password: </td>
+											<td class="field"> 
+					  							<input type="password" name="confirmpassword" id="confirmpassword" /> 
+					  							<input type="submit" class="btn btn-default btn-xs" name="submit_pass" value="Save"/> 
+											</td>
+				      					</tr>
+				    				</table>
+				  				</span>	
+							</td>
+			      		</tr>
+			      		<tr class="even">
+							<td class="key">Full Name</td>
+							<td class="value">
+				  				<span id="nameval" class="value" >{{ fullname }} </span>
+				  				<span class="hide_this" id="span_name">
+				    				<button type="button" class="btn btn-default btn-xs" title="Cancel" id="cancel_name_change"> Cancel </button> 
+				    				<div style='display:none;'><input type='hidden'  name='nameform'  /></div>
+				    				<input id="fname" type="text" name="fname" class="required"  maxlength="200" value="{{firstname}}" />
+				    				<input id="lname" type="text" name="lname" class="required"  maxlength="200" value="{{lastname}}" />
+				    				<input type="submit" class="btn btn-default btn-xs" name="submit_name" value="Save"/>
+				  				</span>
+				  				<button class="btn btn-default btn-xs" type="button"title="Full Name" id="edit_name">
+									<span class="glyphicon glyphicon-edit"></span> Edit
+								</button>
+							</td>
+			      		</tr>
+			      		<tr class="odd">
+							<td class="key">Authority</td>
+							<td class="value">
+				  				<span id="affval" class="value">{{ authority }}</span>
+								 <button class="btn btn-default btn-xs" type="button" id="edit_auth" onclick="editAlert()"  title="To change your authority please contact the administrator">
+		     						<span class="glyphicon glyphicon-question-sign"></span> Edit
+								 </button>
+				  			</td>
+						</tr>
+						{%if 'Enabled'  in user_status %}
+						<tr class="even">
+				  			<td class="key">Generate Keys</td>
+				  			<td>
+								<input type="submit" name="generate" class="btn btn-primary" value="Generate a new Key Pair" id="generate_keypair" 
+									   onclick="return confirm('Are you sure? If you do so, your current credentials will be overwritten.');" 
+									   title="It will generate a new key Pair and your current credentials will be overwritten."/>
+			      			</td> 
+			    		</tr>
+			    		<tr class="odd">
+			      			<td class="key">Public Key</td>
+			      			<td class="value">
+								<span id="keyval" class="value">******** </span>
+								<span class="hide_this" id="span_upload">
+				  					<button type="button" class="btn btn-default" title="Cancel" id="cancel_upload"> Cancel </button>
+				  					<div style='display:none;'>
+				  						<input type='hidden'  name='upload'  /></div>
+				  						<input type="file" name="pubkey" class="required" id="pubkey"/>  
+				  						<input class="btn btn-default btn-xs" name="upload_key" id="upload_key"  type="submit" title="Upload your public key" value="Upload"
+										   onclick="return confirm('Are you sure? It will overwrite your current credentials and you have delegate it manually.');"/>
+								</span>
+								<div style='display:none;'> <input type='hidden'  name='dload'  /> </div> 
+								<button type="submit" name="dl_pubkey" class="btn btn-default btn-xs" title="Download your public key" id="dl_file">
+									<span class="glyphicon glyphicon-download"></span> Download
+								</button>
+								<button class="btn btn-default btn-xs" id="upload_file" type="button" title="Upload a public key">
+									<span class="glyphicon glyphicon-upload"></span> Upload
+								</button>       
+			      			</td>
+			    		</tr>
+			    		<tr class="even" id="pkey_row">
+						 {%if 'N/A' not in user_private_key%}
+			      			<td class="key">Private Key </td> <!-- Hide if priv_key doesn't exist in myslice platform   -->
+			      			<td class="value">********<a href="#"></a>
+			      				<button type="submit" name="dl_pkey" class="btn btn-default" title="Download your privaye key" id="dl_pkey">
+									<span class="glyphicon glyphicon-download"></span> Download	
+								</button>
+			      				<input class="btn btn-danger btn-xs" id="delete" name="delete" type="submit"  value="Delete" title="Delete your private key"
+										onclick="return confirm('Are you sure? If you do so, you have to delegate your credentials manually.');"/> 
+			    			</td>
+						  {%else%}
+							<td class="key">Private Key </td> <!-- Hide if priv_key doesn't exist in myslice platform   -->
+		 					<td class="value">********<a href="#"></a>
+		     					<button type="submit" name="dl_pkey" class="btn btn-default disabled" title="Download your privaye key" id="dl_pkey">
+		        					<span class="glyphicon glyphicon-download"></span> Download 
+		     					</button>
+		     					<input class="btn btn-danger btn-xs disabled" id="delete" name="delete" type="submit" title="Delete your private key" value="Delete" />
+							</td>
+						 {%endif%}		
+			  			</tr>
+			  			<tr class="even">
+			    			<td colspan="2">
+			      				<p class="message" id="pkey_del_msg"><b> Tradeoff:</b> Ease-of-use vs Security.<br>
+									<b>Ease-of-use:</b> Automatic account delegation. Don't delete private key.<br>
+									<b>Security:</b> Manual account delegation. Download & Delete private key.
+								</p>
+			    			</td>
+			  			</tr>
+						{%endif%}
+					</table>
+			
+		</div>
+	</div>
+
+	<div class="tab-pane row" id="account">
+	  	<div class="col-md-12">
+	
+		<h3>Principal Account <small>Account used for delegating credentials</small></h3>
+		<table class="table"> 
+			<tr class="odd"> 
+    			<th>Platform</th> 
+        		<th>Account Type</th>
+				<th>Account Delegation</th>
+        		<th>User hrn</th>
+				<th>User Status</th>
+        		<!--<th>Pub Key</th> -->
+    		</tr>   
+			{% for row in principal_acc %}         
+   			<tr class="border_bottom">
+    			<td class="odd"> {{ row.platform_name }} </td>
+        		<td class="odd"> {{ row.account_type }} </td>
+				<td class="odd"> {{ row.delegation_type }} </td>
+       			<td class="odd"> {{ row.usr_hrn }}  </td>
+				<td class="odd"> {{ row.user_status }}  </td>
+        	<!--	<td class="even"> {{ row.usr_pubkey }} </td> -->
+    		</tr> 
+			{%endfor%}               
+		</table>
+	
+		</div>
+	
+
+	{%if 'Enabled'  in user_status %}
+	  	<div class="col-md-12">
+		<h3>Credentials <small>Delegated to Principal Account</small></h3>
+		        <table class="table">
+					<caption><b>Delegated User Credential</b></caption> 
+		            <tr class="odd"> 
+		                <th>Expiration Date</th>
+						<th>Download</th>
+		            </tr>
+					{% for row in my_users %}         
+					<tr class="border_bottom">
+		    			<td class="odd"> {{ row.cred_exp }} </td>
+						<td class="odd">
+							<button class="btn btn-default btn-xs" name= "dl_user_cred" type="submit" title="Download User Credential">
+								<span class="glyphicon glyphicon-download"></span> Credential
+							</button>
+							<button class="btn btn-default btn-xs" name= "dl_user_cert" type="submit" title="Download User Certificate">
+								<span class="glyphicon glyphicon-download"></span> Certificate
+							</button>
+                             <button class="btn btn-default btn-xs" name= "dl_user_p12" type="submit" title="Download User PKCS12">
+                                 <span class="glyphicon glyphicon-download"></span> PKCS p12
+                             </button>
+						</td>
+					</tr>
+					{%endfor%}
+				 </table>
+				<p></p>
+				<table class="mytable table table-bordered table-hover">
+					<caption><b>Delegated Slice Credentials</b></caption>  
+		     		<tr class="odd"> 
+						<th>Slice Name</th> 
+		         		<th>Expiration Date</th>
+						<th>Download</th>
+		     		</tr>
+					{% for row in my_slices %}     
+		     		<tr class="border_bottom">
+		         		<td class="odd"> {{ row.slice_name }} </td>
+						<td class="odd"> {{ row.cred_exp }} </td>
+						<td class="odd"> 
+							<button class="btn btn-default btn-xs" name= "dl_{{row.slice_name}}" type="submit" title="Download Slice Credentials">
+								<span class="glyphicon glyphicon-download"></span> Download
+							</button> 
+						</td>
+		     		</tr>
+		     		{%endfor%}
+		  		</table>
+				<p></p>
+				<table class="mytable table table-bordered table-hover">
+		   			<caption><b>Delegated Authority Credentials</b></caption>
+		   			<tr class="odd"> 
+		       			<th>Authority Name</th> 
+		       			<th>Expiration Date</th>
+						<th>Download</th>
+		   			</tr>
+		   			{% for row in my_auths %}
+		   			<tr class="border_bottom">
+		       			<td class="odd"> {{ row.auth_name }} </td>
+		       			<td class="odd"> {{ row.cred_exp }} </td>
+						<td class="odd">
+							<button class="btn btn-default btn-xs" name= "dl_{{row.auth_name}}" type="submit" title="Download Authority Credentials">
+								<span class="glyphicon glyphicon-download"></span> Download
+							</button>
+						</td>
+		   			</tr>
+		   			{%endfor%}
+				</table>
+				<p></p>
+				 {%if '' not in my_users%}	
+				<p><button class="btn btn-danger btn-lg btn-block"   name= "clear_cred" type="submit" title="Clear All Credentials">Clear Credentials</button></p>
+				{%else%}
+				<p><button class="btn btn-danger btn-lg btn-block disabled"   name= "clear_cred" type="submit" title="Clear All Credentials">Clear Credentials</button></p>
+				{%endif%}
+		</div>
+	</div>
+
+	<div class="tab-pane row" id="access">
+	  	<div class="col-md-12">
+	
+		<h3>Testbed Access <small>Reference Accounts in the following testbeds</small></h3>
+        <table class="mytable table table-bordered table-hover"> 
+            <tr class="odd"> 
+                <th>Platform</th> 
+                <th>Account Type</th>
+				<th>Reference to</th>
+				<th>Remove Account</th>
+            </tr>   
+            {% for row in ref_acc %}         
+            <tr class="border_bottom">
+                <td class="odd"> {{ row.platform_name }} </td>
+                <td class="odd"> {{ row.account_type }} </td>
+				<td class="odd"> {{ row.account_reference }} </td>
+				<td class="odd">
+    				<button class="btn btn-danger" name="delete_{{row.platform_name}}" type="submit" title="Delete account from this platform">
+						<span class="glyphicon glyphicon-minus"></span>
+					</button>
+				</td>
+            </tr> 
+            {%endfor%}               
+        </table>		
+		
+		
+		<h3>Add reference account to the following testbeds</h3>
+        <table class="mytable table table-bordered table-hover"> 
+            <tr class="odd"> 
+                <th>Platforms</th> 
+                <th>Add Account</th>
+            </tr>   
+            {% for platform in platform_list %}         
+            <tr class="border_bottom">
+                <td class="odd"> {{ platform.platform_no_access }} </td>
+                <td class="odd">
+					<button class="btn btn-success btn-sm" name= "add_{{platform.platform_no_access}}" type="submit" title="Add account to this platform">
+						<span class="glyphicon glyphicon-plus"></span>
+					</button>
+				</td>
+            </tr> 
+            {%endfor%}               
+        </table>
+	</div>
+{%endif%} 
+</div>
+</form>
+</div>
+
+<script>
+    $(document).ready(function() {
+    	$('.nav-tabs a').click(function (e) {
+			e.preventDefault();
+			$(this).tab('show');
+			id = $(this).attr('href').substr(1);
+		
+		});
+		
+        $('button#createslice').click(function() {
+            window.location="/portal/slice_request/";
+        });
+    });
+</script>
+
+{% endblock %}
diff --git a/portal/templates/onelab/onelab_contact.html b/portal/templates/onelab/onelab_contact.html
new file mode 100644
index 00000000..21608da4
--- /dev/null
+++ b/portal/templates/onelab/onelab_contact.html
@@ -0,0 +1,40 @@
+{% extends "layout.html" %}
+
+{% block head %}
+{{ wizard.form.media }}
+{% endblock %}
+
+{% block content %}
+<div class="row">
+	<div class="col-md-12">
+		 <div class="breadcrumbs">
+		 	 Support &nbsp;>&nbsp; Contact
+		 </div>
+	</div>
+</div>
+<div class="row">
+	<div class="col-md-12">
+	<p>Please check our <a href="/portal/support/">FAQ</a> section. Most of the basic problems are explained there.</p>
+	<p>
+	If you haven't find your answes in the FAQ, please contact us by filling the form below.<br />
+	You can also <a href="mailto:support@myslice.info">e-mail</a> us directly.
+	</p>
+	</div>
+</div>
+
+<div class="row">
+	<div class="col-md-4">
+		<form role="form" method="post">
+		{% csrf_token %}
+		{% for field in form %}
+	    <div class="form-group">
+	      	<label for="{{ field.html_name }}" class="control-label">{{ field.label }}</label>
+	      	{{ field.errors }} {{ field }}
+	    </div>
+	    {% endfor %}
+		<button type="submit" class="btn btn-onelab">Create ticket</button>
+		</form>
+	</div>
+</div>
+{% endblock %}
+
diff --git a/portal/templates/onelab/onelab_institution.html b/portal/templates/onelab/onelab_institution.html
index 4b429c9c..6c358123 100644
--- a/portal/templates/onelab/onelab_institution.html
+++ b/portal/templates/onelab/onelab_institution.html
@@ -5,11 +5,20 @@
 {% endblock head %}
 
 {% block content %}
+<div class="container">
+	<div class="row">
+		<div class="col-md-12">
+			 <div class="breadcrumbs">
+			 	 Management &nbsp;>&nbsp; Institution: <span id="authority_name"></span>
+			 </div>
+		</div>
+	</div>
+</div>
 <div class="container">
 	<div class="row">
 		<div class="col-md-12">
 			<ul class="nav nav-tabs nav-section">
-				<li class="active"><a href="#info"><img src="{{ STATIC_URL }}icons/authority-xs.png" alt="Institution" /> Institution {{user_details.parent_authority}}</a></li>
+				<li class="active"><a href="#info">About</a></li>
 				<li><a href="#users">Users</a></li>
 				<li><a href="#slices">Slices</a></li>
 				<li><a href="#requests">Requests</a></li>
@@ -93,11 +102,13 @@ $(document).ready(function() {
     {% if user_details.parent_authority %}
         
         $.post("/rest/authority/",{'filters':{'authority_hrn':'{{user_details.parent_authority}}'}}, function( data ) {
+        	
             var authority_data = [];
             var onelab_data = [];
 			/* 'city','enabled','legal','longitude','onelab_membership','address','parent_authority','slice','user','country',
             'tech','abbreviated_name','url','postcode','description','scientific','authority_hrn','latitude','name'	*/
             $.each( data, function( key, val ) {
+            	$('#authority_name').text(val.name);
                 authority_row = "<img src='{{ STATIC_URL }}img/institutions/{{user_details.parent_authority}}.gif' alt='' /><br>";
                 authority_row += "<br>";
                 authority_row += "<b>authority:</b> "+val.authority_hrn+"<br>";
diff --git a/portal/templates/onelab/onelab_registration_view.html b/portal/templates/onelab/onelab_registration_view.html
new file mode 100644
index 00000000..ab6776c2
--- /dev/null
+++ b/portal/templates/onelab/onelab_registration_view.html
@@ -0,0 +1,536 @@
+{% extends "layout.html" %}
+
+{% block content %}        
+
+<div class="row">
+	<div class="col-md-12">
+	<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">
+  		<p><strong>Questions? <a href="/portal/contact" >Contact us.</a></strong></p>
+  </div>
+</div>
+{% if errors %}
+<ul>
+  {% for error in errors %}
+  <li>{{ error }}</li>
+  {% endfor %}
+</ul>
+{% endif %}
+<div class="row">
+	<div class="col-md-12">
+		
+			<div class="form-group">
+				<form class="cmxform form-horizontal" id="registrationForm" method="post" enctype="multipart/form-data" role="form">
+			{% 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 request its addition by clicking the link below. 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>
+
+<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>	
+
+	<!-- 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="col-md-6">
+	    <div class="form-group">
+	      <label for="password" class="control-label">Authentication</label>
+		  <p></p>	
+	      <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">
+	    	<!--<label for="question" class="control-label">Keys</label> -->
+			<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" required/>
+	      	<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>
+	</div>
+</div>
+<div class="row">
+	<div class="col-md-12">
+		<div class="form-group" id="register">
+			<p></p>	
+	    	<button class="submit btn btn-onelab" type="submit">Sign up</button>
+	    </div>
+	</form> 
+	</div>
+</div>
+	
+	
+	<!-- 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">
+    					for OneLab Basic level service
+    					<br/>
+    					Version 0.6 of 20 May 2014
+						<br>
+						<a href="/portal/terms" target="_blank">[Printable format]</a>
+						</p>
+					<h1 align="left">1 Context</h1>
+					<h2 align="left">1.1 OneLab</h2>
+					<p align="left">
+    				OneLab is an experimental facility for testing new ideas and new technologies in the area of computer networking. It consists of a variety of types of
+    				platforms, including:</p>
+					<ul type="disc">
+    				<li>
+        			<strong>internet overlay testbeds</strong>
+        			, testbeds that offer virtual machines distributed across locations in different countries, allowing users to deploy overlays on the internet;
+    				</li>
+    				<li>
+        			<strong>wireless testbeds</strong>
+        			, testbeds that consist of clusters of computers that are within Wi-Fi communication range of each other, either in an office environment or in an
+        			isolated setting;
+    				</li>
+    				<li>
+        			<strong>internet of things testbeds</strong>
+        			, testbeds that consist of embedded computing nodes with sensor capabilities, communicating wirelessly in an isolated environment;
+    				</li>
+    				<li>
+        			<strong>emulation testbeds,</strong>
+        			computing clusters that offer virtual machines on servers that are interconnected by a high speed switch, enabling large scale network emulation.
+    				</li>
+					</ul>
+					<p align="left">
+    				This list of types of platforms is subject to change, and the current list, along with the identities of the specific platforms of each type, can be found
+    				on the OneLab website (onelab.eu).</p>
+					<p align="left">
+    				Each platform has its own owners, and OneLab is the grouping of these platforms through a consortium of institutions. The OneLab consortium is coordinated
+    				by UPMC Sorbonne Universités. It operates on a not-for-profit basis.</p>
+					<p align="left">
+    				Access to OneLab may also provide access to additional platforms that are not part of OneLab, due to a federation agreement between OneLab and the owners
+    				of those platforms.</p>
+					<h2 align="left">1.2 Fee-free Basic level service</h2>
+					<p align="left">These terms and conditions define and apply to OneLab's Basic level service, which is available free of charge.</p>
+					<p align="left">
+    				Users who would like additional services are encouraged to contact support@onelab.eu. Some additional services require a written agreement, but are
+    				otherwise free. Others require the payment of fees or in-kind contributions. (An example of an in-kind contribution is the hosting of a PlanetLab Europe
+    				server node.)</p>
+					<h2 align="left">1.3 Managers and standard users</h2>
+					<p align="left">
+    				There are two classes of OneLab user: the manager and the standard user. OneLab grants access rights to managers, who, in turn, provide access rights to
+   					standard users. Examples are: for a small enterprise, an executive may be the manager and the employees may be standard users; for a research team, a
+    				senior scientist (faculty member or research scientist) may be a manager and doctoral students and other members of the team may be standard users; for a
+    				university course, a professor may be a manager and the students may be standard users.</p>
+					<h2 align="left">1.4 These terms and conditions</h2>
+					<p align="left">
+    				Acceptance of these terms and conditions is a condition of obtaining OneLab Basic level user service. They are posted to the OneLab portal site
+    				(portal.onelab.eu). They may be changed without other notice than the posting of a new version to the portal site.</p>
+					<h1 align="left">2 Services provided by OneLab</h1>
+					<h2 align="left">2.1 Access to the experimental facility</h2>
+					<p align="left">
+    				OneLab provides users with access to the platforms that make up the experimental facility. Each platform owner determines the specifics of this access (for
+    				example, how many nodes are available to a user, what happens in case of oversubscription, etc.), with the proviso that Basic level service requires that
+   	 				users be able to conduct meaningful experiments on every OneLab testbed.</p>
+					<p align="left">
+    				Basic level service may also provide access to platforms that are federated with OneLab, but such access depends upon the terms of the federation
+    				agreements with those platforms, which may require that the user have a higher level of service in order to gain access. For example, Basic level service
+    				provides access to PlanetLab Europe, a OneLab platform, without providing access to PlanetLab Central, a federated platform. Users wanting full access
+    				across the global PlanetLab system should contact support@onelab.eu to arrange to enter into a PlanetLab Europe membership agreement.</p>
+					<p align="left">OneLab's role is to facilitate access to the platforms. Specifically, it provides each user with:</p>
+					<ul>
+    				<li align="left">
+        			<strong>a single account,</strong>
+        			the credentials for which can be used to access all of the OneLab testbeds;
+    				</li>
+    				<li align="left">
+        			<strong>tools through which to access the testbeds</strong>
+        			, including, notably, a web-based portal (portal.onelab.eu) that allows a user to see the resources available on each testbed and to reserve them,
+        			along with a number of experiment control tools that a user can employ to deploy an experiment on those resources;
+    				</li>
+    				<li align="left">
+        			<strong>support</strong>
+        			, with documentation on how to use the tools, pointers to documentation for individual testbeds, and a helpdesk to respond to user questions.
+    				</li>
+					</ul>
+<p align="left">
+    Additional support, such as accompaniment through the design and deployment of experiments and the interpretation of their results, is available through
+    higher levels of service.
+</p>
+<h2 align="left">
+    2.2 Best effort, without guarantees
+</h2>
+<p align="left">
+    OneLab and the owners of the individual OneLab testbeds do their best to provide the services outlined here, with the understanding that Basic level
+    service offers no guarantees. Users should clearly understand the following limitations.
+</p>
+<ul type="disc">
+    <li>
+        <strong>Reliability:</strong>
+        OneLab does not provide any guarantees with respect to the reliability of the portal, of other tools, or of the individual nodes on platforms. These
+        may be taken down for maintenance, rebooted, or reinstalled at any time. Reinstallation implies that disks are wiped, meaning that users should not
+        consider a local disk to be a persistent form of storage.
+    </li>
+    <li>
+        <strong>Fitness:</strong>
+        OneLab does not guarantee that the platforms are suitable for the experiments that users intend to conduct. There may be limitations in the
+        technologies that are offered that prevent certain types of experiments from being carried out.
+    </li>
+    <li>
+        <strong>Privacy</strong>
+        : OneLab does not guarantee the privacy of traffic generated on the platforms (e.g., wireless signals, packets). Unless otherwise specified by an
+        individual platform owner, users should assume that traffic is monitored and logged. Such monitoring may be done intentionally, for example, to allow
+        platform administrators as well as other users to investigate abuse.
+    </li>
+</ul>
+<p align="left">
+    Users who seek such guarantees are invited to consider a higher level of service.
+</p>
+<h2 align="left">
+    2.3 Limitedliability
+</h2>
+<p align="left">
+    In no event shall the partners of the OneLab consortium be liable to any user for any consequential, incidental, punitive, or lost profit damages, or for
+    any damages arising out of loss of use or loss of data, to the extent that such damages arise out of the activities of OneLab consortium partners, or any
+    breach of the present terms and conditions, even if the consortium partner has been advised of the possibility of such damages.
+</p>
+<p align="left">
+    Nothing contained in these terms and conditions shall be deemed as creating any rights or liabilities in or for third parties who are not Basic level users
+    of OneLab.
+</p>
+<h1 align="left">
+    3 Acceptable use policy
+</h1>
+<h2 align="left">
+    3.1 Responsibilities of managers and standard users
+</h2>
+<p align="left">
+    OneLab creates and administers accounts for managers and delegates to managers the responsibility for creating and administering accounts for standard
+    users. Both managers and standard users are required to follow OneLab's acceptable use policy. In addition, managers are fully responsible for the
+    activities of the standard users whose accounts they create.
+</p>
+<p align="left">
+    A manager is expected to grant user access only an individual with whom he or she has a working relationship. In general, this means an individual who
+    works for the same institution as the manager, or, in the case of higher education and research, an individual who is a student at the university where the
+    manager works. Managers may also grant access to individuals from other institutions, provided that they are collaborating on a common project on OneLab.
+    If there is a doubt, a manager should refer the question to support@onelab.eu.
+</p>
+<h2 align="left">
+    3.2 Types of use
+</h2>
+<p align="left">
+    OneLab may be used by enterprise, by scientific researchers, and by educators.
+</p>
+<p align="left">
+    OneLab may be used for pre-commercial research and development. In keeping with OneLab's not-for-profit status, it may not be used to deploy services that
+    are designed to generate a commercial profit.
+</p>
+<p align="left">
+    Not-for-profit use of OneLab to deploy services that are designed to generate revenue requires prior approval through a written agreement, and thus may not
+    be carried out on a Basic level account. Interested users are invited to contact support@onelab.eu.
+</p>
+<p align="left">
+    OneLab may be used for scientific research.
+</p>
+<p align="left">
+    OneLab may be used to host lab exercises for university courses.
+</p>
+<p align="left">
+    Questions about other types of use should be addressed to support@onelab.eu.
+</p>
+<h2 align="left">
+    3.3 Applicable laws and regulations
+</h2>
+<p align="left">
+    OneLab is managed, and the portal is hosted, in France. Information regarding the countries in which individual testbeds are managed and hosted is
+    available from those testbeds. Users are responsible for being aware of the countries in which their experiments are deployed and for ensuring that their
+    use of OneLab fully conforms to the laws and regulations of those countries, as well as the laws and regulations of the country in which they themselves
+    are present when conducting their experiments.
+</p>
+<p align="left">
+    Above and beyond specific national laws, the activities email spamming, phishing through web services, and all types of Internet fraud are prohibited on
+    OneLab.
+</p>
+<h2>
+    3.4 Security and accounting mechanisms
+</h2>
+<p align="left">
+    Users are expected to respect the security and accounting mechanisms put in place by OneLab, its platforms, and federated platforms. For example, access to
+    PlanetLab Europe is designed to take place through the SSH cryptographically-secured connection protocol, which uses public/private key pair
+    authentication, and so users should not attempt to bypass this mechanism. As another example, OneLab's notion of a "slice" associates a set of resources
+    with the group of users who have reserved those resources, and users should not attempt to obscure the identities of participants in a slice.
+</p>
+<p align="left">
+    Hacking attempts against the OneLab portal and testbeds are not permitted. This includes "red team" (hacker test) experiments.
+</p>
+<h2>
+    3.5 Sharing of resources
+</h2>
+<p align="left">
+    OneLab is intended for ambitious experiments. Large numbers of resources and extended leases on resources may legitimately be granted in order to carry
+    these out. At the same time, OneLab and its testbeds are shared environments, and when there is contention for resources, limits must be imposed.
+</p>
+<p align="left">
+    Each OneLab platform sets its own policies for handling resource contention. As a general rule, users are encouraged to design their experiments to use
+    resources efficiently. In particular, spinning/busy-waiting techniques for extended periods of time are strongly discouraged. Some resource contention
+    policies (e.g., PlanetLab Europe's) terminate the jobs that are using the most resources in the case of contention.
+</p>
+<h2>
+    3.6 Internet-connected platforms
+</h2>
+<p align="left">
+    Some of OneLab's platforms allow experiments to take place on resources that have access to the public internet. These experiments can potentially generate
+    traffic to, and receive traffic from, any host or router in the internet.<a></a><a id="_anchor_1" href="#_msocom_1" name="_msoanchor_1">[LB1]</a>
+</p>
+<p align="left">
+    Furthermore, some internet-connected platforms (e.g., PlanetLab Europe) consist of servers that are hosted by a large number of member institutions.
+</p>
+<p align="left">
+    The accessibility of internet-connected platforms and the distributed hosting model of some of these platforms imply certain responsibilities on the part
+    of users, as detailed below.
+</p>
+<h3>
+    3.6.1 General guidance
+</h3>
+<p align="left">
+    A good litmus test when considering whether an experiment is appropriate for such internet-connected platforms is to ask what the network administrator at
+    one's own organisation would say about the experiment running locally. If the experiment disrupts local activity (e.g., uses more than its share of the
+    site's internet bandwidth) or triggers complaints from remote network administrators (e.g., performs systematic port scans), then it is not appropriate for
+    such internet-connected platforms.
+</p>
+<p align="left">
+    It is the responsibility of the user and the user's manager to ensure that an application that will run on an internet-connected platform is tested and
+    debugged in a controlled environment, to better understand its behaviour prior to deployment.
+</p>
+<h3>
+    3.6.2 Standards of network etiquette
+</h3>
+<p align="left">
+    Internet-connected platforms are designed to support experiments that generate unusual traffic, such as network measurements. However, it is expected that
+    all users adhere to widely accepted standards of network etiquette in an effort to minimise complaints from network administrators. Activities that have
+    been interpreted as worm and denial-of-service attacks in the past (and should be avoided) include sending SYN packets to port 80 on random machines,
+    probing random IP addresses, repeatedly pinging routers, overloading bottleneck links with measurement traffic, and probing a single target machine from
+    many nodes.
+</p>
+<p align="left">
+    For internet-connected platforms that have a distributed hosting model, each host institution will have its own acceptable use policy. Users should not
+    knowingly violate such local policies. Conflicts between local policies and OneLab's stated goal of supporting research into wide-area networks should be
+    brought to the attention of OneLab administrators at support@onelab.eu.
+</p>
+<h3>
+    3.6.3 Specific network usage rules
+</h3>
+<p align="left">
+    It is not allowed to use one or more nodes of an internet-connected platform to generate a high number of network flows or flood a site with high traffic
+    to the point of interfering with its normal operation. Use of congestion-controlled flows for large transfers is highly encouraged.
+</p>
+<p align="left">
+    It is not allowed to perform systematic or random port or address block scans from an internet-connected platform.
+</p>
+<p align="left">
+    For internet-connected platforms that use a distributed hosting model, it is not allowed to spoof or sniff traffic on a hosted server or on the network the
+    server belongs to.
+</p>
+<p align="left">
+    Access to a server on a distributed hosting platform may not be used to gain access to other servers or networked equipment that are not part of the
+    testbed.
+</p>
+<h2>
+    3.7 Wireless platforms
+</h2>
+<p align="left">
+    Wireless-connected platforms give users access to nodes that communicate via Wi-Fi and other wireless technologies. They may be capable of detecting
+    wireless activity in the neighbourhood of those nodes: traffic generated by other users of the platform or by individuals not associated with the platform.
+    In general, much of the traffic will be encrypted, with certain aspects (such as SSIDs) not encrypted, but it is also possible that there will be fully
+    unencrypted traffic. They may also be capable of generating wireless activity that reaches equipment outside of the testbed.
+</p>
+<p align="left">
+    Furthermore, some wireless-connected platforms may have built-in limitations to prevent them from generating signals at a strength that exceeds health and
+    safety regulations.
+</p>
+<p align="left">
+    These characteristics of wireless-connected platforms imply certain responsibilities on the part of users, as detailed below.
+</p>
+<h3>
+    3.7.1 Specific network usage rules
+</h3>
+<p align="left">
+    Experimenters may make no attempt to defeat the encryption of encrypted third-party traffic. Furthermore, experimenters must treat with utmost discretion
+    any unencrypted traffic. Limited metadata can be recorded for the bona fide purposes of an experiment, but under no case should third party communications
+    be recorded.
+</p>
+<p align="left">
+    No attempt may be made to reverse engineer traffic in order to learn the identities of the parties who have generated the traffic.
+</p>
+<p align="left">
+    Wireless-connected platforms may not be used to gain access to any network equipment that is not part of the testbed itself.
+</p>
+<p align="left">
+    It is not allowed to perform systematic or random scans of wireless networks that are not part of a wireless-connected platform. Similarly, it is not
+    allowed to spoof or sniff wireless traffic of the institution that hosts a wireless-connected platform or of other networks in the proximity.
+</p>
+<p align="left">
+    Care must be taken so that traffic on wireless-connected platforms does not interfere with the normal functioning of network equipment that is not part of
+    the testbed itself.
+</p>
+<p align="left">
+    No attempt may be made to defeat the mechanisms that limit signal strength on wireless-connected platforms.
+</p>
+<h2>
+    3.8 Handling suspected violations
+</h2>
+<p align="left">
+    Suspected violations of the OneLab acceptable use policy should be reported to support@onelab.eu.
+</p>
+<p align="left">
+    Upon notification or detection of a possible violation, OneLab management will attempt to understand if a violation has in fact occurred. To do so,
+    management will freely communicate with the users concerned, the operators of the platforms concerned, as well as any third parties that might be involved.
+    An example of a third party is a network operator who detects what they believe to be unauthorized traffic emanating from a OneLab platform.
+</p>
+<p align="left">
+    The priority is to resolve any real or apparent violations amicably. However, if OneLab management believes that a violation may have occurred, it can, at
+    its sole discretion, and without prior notice, apply any of the following measures:
+</p>
+<ul type="disc">
+    <li>
+        notification of the users of the concerned slice (set of resources);
+    </li>
+    <li>
+        disabling of the concerned slice;
+    </li>
+    <li>
+        disabling an individual user's account;
+    </li>
+    <li>
+        reporting of the user's activity to his/her manager;
+    </li>
+    <li>
+        disabling of the manager's account and all user accounts for which the manager is responsible;
+    </li>
+    <li>
+        disabling of all accounts associated with the user's institution.
+    </li>
+</ul>
+<p align="left">
+    In the case of suspected illegal activity, OneLab management might need, without prior notice, to notify the relevant authorities.
+</p>
+<div>
+    <div>
+        <div id="_com_1">
+        </div>
+    </div>
+</div>
+      				</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(){
+    var availableTags = [
+    {% if authorities %}
+        {% for authority in authorities %}
+            {% if authority.name %}
+                {value:"{{ authority.name }}",label:"{{authority.name}}"},
+			// to show only full name
+           // {% else %}
+           //     {value:"{{ authority.authority_hrn }}",label:"{{authority.authority_hrn}}"},
+            {% endif %}
+        {% endfor %}    
+    {% else %}
+        {value:"",label:"No authority found !!!"}
+    {% endif %}
+    ];
+	// 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
+    jQuery( "#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("#authority_hrn").val("");
+          }
+      }
+      //select: function( event, ui ) {console.log(jQuery(this))}
+    });
+	// for hover texts
+	jQuery('[title!=""]').qtip();
+});
+</script>
+{% endblock %}
+
diff --git a/portal/templates/onelab/onelab_slicerequest_view.html b/portal/templates/onelab/onelab_slicerequest_view.html
new file mode 100644
index 00000000..ef0ca28f
--- /dev/null
+++ b/portal/templates/onelab/onelab_slicerequest_view.html
@@ -0,0 +1,87 @@
+{% extends "layout.html" %}
+{% load i18n %}
+
+{% block content %}
+	<div class="row">
+		<div class="col-md-12">
+			 <div class="breadcrumbs">
+			 	 Experiment &nbsp;>&nbsp; Request a new Slice
+			 </div>
+		</div>
+	</div>
+
+	{% if errors %}
+	<div class="row">
+		<div class="col-md-12">
+		<ul>
+		  {% for error in errors %}
+		  <li>{{ error }}</li>
+		  {% endfor %}
+		</ul>
+		</div>
+	</div>
+	{% endif %}
+	
+	<div class="row">
+		<div class="col-md-8 el">
+			<form role="form" method="post">
+			{% csrf_token %}
+			  <div class="form-group" style="display:none">
+			    <input type="email" class="form-control" id="email" style="width:300px" value="{{ email }}" readonly="readonly">
+			  </div>
+			  <div class="form-group">
+			    <input type="text" class="form-control" name="slice_name" id="slice_name" style="width:300px" placeholder="Slice Name" 
+				title="Please enter a name for your slice"required="required">
+			  </div>
+			  <div class="form-group">
+				{%if 'is_pi'  in pi %}
+				<input type="text" class="form-control" id="authority_hrn" name="authority_hrn" style="width:300px" placeholder="Authority" 
+				title="An authority responsible for vetting your slice" required="required">
+				{%else%}
+			    <input type="text" class="form-control" id="authority_hrn" name="authority_hrn" placeholder="Authority" style="width:300px; display:none;" 
+				title="An authority responsible for vetting your slice" required="required" readonly="readonly">
+				{%endif%}
+			  </div>
+			  <div class="form-group">
+			    <input type="number" class="form-control" name="number_of_nodes" id="number_of_nodes" style="width:300px" placeholder="Number of Nodes"
+				title="Number of nodes you expect to request (informative)">
+			  </div>
+			  <div class="form-group">
+			  	<textarea id="purpose" name="purpose" class="form-control" rows="6" placeholder="Experiment Purpose" style="width:300px" 
+				title="Purpose of your experiment (informative)" required="required">{{ purpose }}</textarea>
+			  </div>
+			  <button type="submit" class="btn btn-onelab"><span class="glyphicon glyphicon-plus"></span> Request Slice</button>
+			</form>
+	
+		</div>
+	</div>
+		
+<script>
+jQuery(document).ready(function(){
+	
+	$("#authority_hrn").load("/rest/user/", {"fields" : ["parent_authority"], "filters": {"user_hrn": "{{ user_hrn }}"}}, function(data) {
+		var jsonData = JSON.parse(data);
+        $(this).attr("value", jsonData[0]['parent_authority']);
+    });
+    var availableTags = [
+     {% if authorities %}
+         {% for authority in authorities %}
+             {% if authority.name %}
+                 {value:"{{ authority.authority_hrn }}",label:"{{authority.name}}"},
+             {% else %}
+                 {value:"{{ authority.authority_hrn }}",label:"{{authority.authority_hrn}}"},
+             {% endif %}
+         {% endfor %}    
+     {% else %}
+         {value:"",label:"No authority found !!!"}
+     {% endif %}
+    ];
+    $( "#authority_hrn" ).autocomplete({
+      source: availableTags,
+      minLength: 0,
+      select: function( event, ui ) {console.log(jQuery(this));}
+    });
+});
+</script>
+{% endblock %}
+
diff --git a/portal/templates/onelab/onelab_supportview.html b/portal/templates/onelab/onelab_supportview.html
new file mode 100644
index 00000000..e33127cd
--- /dev/null
+++ b/portal/templates/onelab/onelab_supportview.html
@@ -0,0 +1,143 @@
+{% extends "layout_wide.html" %}
+
+{% block content %}
+<div class="container">
+	<div class="row">
+		<div class="col-md-12">
+			 <div class="breadcrumbs">
+			 	 Support
+			 </div>
+		</div>
+	</div>
+</div>
+<div class="container">
+	<div class="row">
+		<div class="col-md-12">
+			<ul class="nav nav-tabs nav-section">
+				<li class="active"><a href="#support">Tickets</a></li>
+				<li><a href="#faq">FAQ</a></li>
+				<li><a href="#contact">Contact</a></li>
+			</ul>
+	    </div>
+	</div>
+</div>
+
+<div class="container tab-content">
+	<div class="tab-pane active row" id="support">
+	  	<div class="col-md-12">
+	  		<h2>Report a Bug</h2>
+			<p>If you have found a bug or having difficulties accesing some features or found some anomalies, please report it using our ticketing system.</p>
+			<button id="ticketbtn" type="button" class="btn btn-default"><span class="glyphicon glyphicon-plus"></span> Create Ticket</button>
+<!--			<h3>Unresolved Tickets</h3>
+			<table class="mytable table table-bordered table-hover">
+		        <tr>
+		            <th>Ticket No</th>
+					<th>Reported By</th>
+					<th>Description</th>
+		            <th>Status</th>
+		        </tr>
+		        <tr>
+		            <td>1</td>
+					<td>yasin.upmc@gmail.com</td>
+					<td> Slice_request page is not working </td>
+					<td> Unresolved</td>
+		        </tr>
+				<tr>
+					<td>2</td>
+					<td>azerty@lip6.fr</td>
+					<td>Unable to Register</td>
+					<td>Unresolved</td>
+				</tr> 
+		
+		    </table> -->
+	  	</div>
+	  </div>
+	<div class="tab-pane row" id="faq">
+	  	<div class="col-md-12">
+	  		<h2>Frequently Asked Questions (FAQs)<h2>
+
+			<h3>Users</h3>
+			<ul>
+			<li><h4>Who is a user?</h4></li>
+			<p>A user is an experimenter who registers to the OneLab portal and able to use all the facilites that the portal has to offer. However, a user does not
+			have the right to do any admin operation such as managing slices, users and resources.</p>
+			
+			
+			<li><h4>How do I register?</h4></li>
+			<p>In order to register you must go to the <a href="/portal/register">Registration</a> page. You have to choose your corresponding institution (authority). After registration you have to wait until the PI validates your account. However upon registration, you will be able login to the portal with a limited access. Do not try to re-register with the same email address.</p>
+			
+			<li><h4>Why can't I register with my email?</h4></li>
+			<p>If you have already registered then you won't be able to register again with the same email address. However, if you have never registered and still you are not able to use your email then please 
+			<a href="/portal/contact">Contact Support</a> and mention the error message that you are getting while trying to register.</p>
+			
+			<li><h4>In registration, in "My keys" option, what should i choose?</h4></li>
+			<p>There are two choices.</p> 
+				<p class="text-justify"><b>1. Generate Key Pairs:</b> This option is for users who have no knowledge about SFA and MySlice i.e., new users. We offer convenience to the new users in order to avoid addtional efforts to delegate keys manually. If you choose this option, the portal will automatically handle your credentials and you would be able use the portal as soon as the PI validates your account. However, you can delete your private key from the portal if you are concerned about privacy issues. In that case once your current credentials expire, you have to delegate your credentials manually using <a href="http://trac.myslice.info/wiki/InstallSfa" target="_blank">SFA</a>. As this needs advance knowledge about SFA and Myslice, we highly recommend to the new users to keep both private and public keys in the portal in order to keep the process automatic. </p>
+				<p class="text-justify"><b>2. Upload My Public Key:</b> This option is for users who have experience with MySlice and SFA. If you choose this option, once the PI validates your account, you have to delegate your credentials manually using <a href="http://trac.myslice.info/wiki/InstallSfa" target="_blank">SFA</a>. You have to repeat the same process everytime your credentials expire. Normally, credentials expire every one month. You can see the expiration date in your Account page. </p>
+			
+			<li><h4>Who is responsible for validating my account?</h4></li>
+			<p>When you register, you choose an authority fromt he list of authorities. For each authority there is a Principal Investigator (PI). PI of your authority will verify your identity and if he finds that you are from his institution, he will validate your account otherwise he will reject your account.</p>
+			
+			<li><h4>How long I have to wait for validation?</h4></li>
+			<p>It depends on the PI of your authority. In general, it should not take more than a week. If you are waiting more than usual, please <a href="/portal/contact">Contact Support</a> and explain your problem.</p>
+			<li><h4>I just registered. Why can't I see any slices and resources?</h4></li>
+			<p>Once you register, you can login to your account with limited access. It means that you can view your account details, modify your name and password. You can also view other pages. However, you will not be able to see any slices as well as resources before your account validation. But you can <a href="/portal/slice_request/">Request Slice</a> before being validated. Therefore, the PI will validate your account as well as your requested slice. Once validated, you will be able to see your slice and if you click on your slice, you will be able to see resources in that slice and you can reserve nodes and start your experiment.</p>
+			
+			<li><h4>How can I get access to a slice?</h4></li>
+			<p>If you are a completely new user, you have to <a href="/portal/slice_request/">Request Slice</a>. It is upto the PI of your authority to accept/reject your slice request. </br>On the other hand, if you are a new user to the portal but you already have an account in OneLab SFA registry and you have access to slices, you will be able to see all your slices once your account is validated by the PI.</p> 
+			
+			<li><h4>I forgot my password, how to recover it?</h4></li>
+			<p>If you have an account in the portal but you forgot the password, you can always <a href="/portal/pass_reset/">Reset your password</a>.</p></ul>
+			
+			<h3>Managers</h3>
+			<ul>
+			<li><h4>Who is a manager?</h4></li>
+			<p>A manager is the Principal Investigator (PI) of the institution. Each PI has authority over his own institution. A PI can add, delete, validate users/ 
+			slices that belong to his institution.</p>
+			
+			<li><h4>What is pending users/slices?</h4></li>
+			<p>In <a href="/portal/validate">Requests</a> page you will be able to see all the users that registered under your authority and the slices that users of your authority has requested. Therefore, pending users/slices are those users and slices that are yet to be validated. You can validate/reject these requests based on the policy of your institution.</p>
+			
+			<li><h4>How can I manage the users/slices that belong to my institution?</h4></li>
+			<p>In <a href="/portal/institution">Instution</a> page, under "Users" tab, you will be able to see all the users that belong to your authority. You can delete the users that you don't want anymore. Under "Slices" tab, you will be able to see all the slices that belong to your authority. You can renew/delete the slices based on your requirements. As a PI you can also <a href="/portal/slice_request/">Create Slice</a>. Just fill the form of request slice and the slice will be automatically validated if it is requested by a PI. </p>
+			
+			</ul>
+	  	</div>
+	  </div>
+
+	<div class="tab-pane row" id="contact">
+	  	<div class="col-md-12">
+	  		<h2>Contact Us</h2>
+		
+			<h3>Mailing List</h3>
+			<p>You can subscribe to our mailing list by sending a request to: <b>support</b> AT <b>myslice</b> DOT <b>info</b></p>
+			<p>Also you can adress any issues in the same email address.</p>
+			
+			<h3>Mailing Address</h3>
+			<address>
+			UPMC - LIP6<br> 
+			Boîte courrier 16 <br>
+			Couloir 26-00, Etage 01, Bureau 102<br>
+			4 place Jussieu<br>
+			75252 PARIS CEDEX 05<br>
+			France<br> 
+			</address>
+	  	</div>
+	  </div>
+</div>
+
+<script>
+$(document).ready(function() {
+    $('button#ticketbtn').click(function() {
+        window.location="/portal/contact/";
+    });
+	$('.nav-tabs a').click(function (e) {
+  		e.preventDefault();
+  		$(this).tab('show');
+	});
+});
+</script>
+
+
+{% endblock %}
+
diff --git a/portal/templates/onelab/onelab_widget-slice-sections.html b/portal/templates/onelab/onelab_widget-slice-sections.html
index 3a9c1acb..bef7c001 100644
--- a/portal/templates/onelab/onelab_widget-slice-sections.html
+++ b/portal/templates/onelab/onelab_widget-slice-sections.html
@@ -1,22 +1,29 @@
+<div class="row">
+	<div class="col-md-12">
+		 <div class="breadcrumbs">
+		 	 Experiment &nbsp;>&nbsp; {{ slice }}
+		 </div>
+	</div>
+</div>
 {% if section == "resources" %}
 <ul class="nav nav-tabs nav-section">
-	<li><a href="/slice/{{ slice }}#info"><img src="{{ STATIC_URL }}icons/slices-xs.png" /> {{ slice }}</a></li>
+	<li><a href="/slice/{{ slice }}#info">Information</a></li>
 	<!-- <li><a href="/slice/{{ slice }}#testbeds">Testbeds</a></li> -->
 	<li class="active"><a class="link" href="/resources/{{ slice }}">Resources</a></li>
 	<li><a href="/slice/{{ slice }}#users">Users</a></li>
 	<!-- <li><a href="/slice/{{ slice }}#experiment">Statistics</a></li> -->
 	<!-- <li><a href="/slice/{{ slice }}#experiment">Measurements</a></li> -->
-	<li><a href="/slice/{{ slice }}#experiment">Experiment</a></li>
+	<li><a href="/slice/{{ slice }}#experiment">Tools</a></li>
 </ul>
 {% else %}
 <ul class="nav nav-tabs nav-section">
-	<li class="active"><a href="#info"><img src="{{ STATIC_URL }}icons/slices-xs.png" /> {{ slice }}</a></li>
+	<li class="active"><a href="#info">Information</a></li>
 	<!-- <li class="testbeds"><a href="#testbeds">Testbeds</a></li> -->
 	<li><a class="link" href="/resources/{{ slice }}">Resources</a></li>
 	<li class="users"><a href="#users">Users</a></li>
 	<!-- <li class="statistics"><a href="#experiment">Statistics</a></li> -->
 	<!-- <li class="measurements"><a href="#experiment">Measurements</a></li> -->
-	<li class="experiment"><a href="#experiment">Experiment</a></li>
+	<li class="experiment"><a href="#experiment">Tools</a></li>
 </ul>
 <script>
 $(document).ready(function() {
diff --git a/portal/templates/supportview.html b/portal/templates/supportview.html
index ce6b9fd1..ff513765 100644
--- a/portal/templates/supportview.html
+++ b/portal/templates/supportview.html
@@ -18,7 +18,7 @@
 	  	<div class="col-md-12">
 	  		<h2>Report a Bug</h2>
 			<p>If you have found a bug or having difficulties accesing some features or found some anomalies, please report it using our ticketing system.</p>
-			<button id="ticketbtn" type="button" class="btn btn-default btn-onelab"><span class="glyphicon glyphicon-plus"></span> Create Ticket</button>
+			<button id="ticketbtn" type="button" class="btn btn-default"><span class="glyphicon glyphicon-plus"></span> Create Ticket</button>
 <!--			<h3>Unresolved Tickets</h3>
 			<table class="mytable table table-bordered table-hover">
 		        <tr>