From: Loic Baron <loic.baron@lip6.fr>
Date: Tue, 18 Mar 2014 18:22:13 +0000 (+0100)
Subject: Fed4Fire templates and images
X-Git-Tag: myslice-1.1~190
X-Git-Url: http://git.onelab.eu/?a=commitdiff_plain;h=9473a2fa40c7a959be046e2b9888de042588e79a;hp=38e433559443ae1352efd15dbdddd2b78c175b5c;p=unfold.git

Fed4Fire templates and images
---

diff --git a/portal/static/img/institutions/fed4fire.iminds.gif b/portal/static/img/institutions/fed4fire.iminds.gif
new file mode 100644
index 00000000..5799ed99
Binary files /dev/null and b/portal/static/img/institutions/fed4fire.iminds.gif differ
diff --git a/portal/static/img/institutions/fed4fire.upmc.gif b/portal/static/img/institutions/fed4fire.upmc.gif
new file mode 100644
index 00000000..1a2d1cbb
Binary files /dev/null and b/portal/static/img/institutions/fed4fire.upmc.gif differ
diff --git a/portal/static/img/testbeds/fuseco.fokus.fraunhofer.de.png b/portal/static/img/testbeds/fuseco.fokus.fraunhofer.de.png
new file mode 100644
index 00000000..5ca08e09
Binary files /dev/null and b/portal/static/img/testbeds/fuseco.fokus.fraunhofer.de.png differ
diff --git a/portal/static/img/testbeds/iminds-wall2.cm.png b/portal/static/img/testbeds/iminds-wall2.cm.png
new file mode 100644
index 00000000..4ce8035c
Binary files /dev/null and b/portal/static/img/testbeds/iminds-wall2.cm.png differ
diff --git a/portal/static/img/testbeds/netmode.png b/portal/static/img/testbeds/netmode.png
new file mode 100644
index 00000000..8918573a
Binary files /dev/null and b/portal/static/img/testbeds/netmode.png differ
diff --git a/portal/templates/fed4fire/fed4fire__widget-topmenu.html b/portal/templates/fed4fire/fed4fire__widget-topmenu.html
index 4b2ae0ee..8e033264 100644
--- a/portal/templates/fed4fire/fed4fire__widget-topmenu.html
+++ b/portal/templates/fed4fire/fed4fire__widget-topmenu.html
@@ -1,38 +1,77 @@
-{% insert_str prelude "js/bootstrap.js" %}
-{% insert_str prelude "css/bootstrap.css" %}
-{% insert_str prelude "css/topmenu.css" %}
-{% insert_str prelude "js/logout.js" %}
-<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
-  <div class="navbar-header">
-    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-myslice-collapse">
-      <span class="sr-only">Toggle navigation</span>
-      <span class="icon-bar"></span>
-      <span class="icon-bar"></span>
-      <span class="icon-bar"></span>
-    </button>
-    <a class="navbar-brand" href="/"><img src="{{ STATIC_URL }}img/f4f-logo.png" height="30" alt="Fed4Fire logo" /></a>
-     <a href="/" alt="Home" class="logoTxt">Fed4Fire Portal</a>
-  </div>
-  <div class="collapse navbar-collapse navbar-myslice-collapse topmenu">
-    <ul class="nav navbar-nav">
-	{% for d in topmenu_items %} 
-	{% if d.dropdown %}
-	{% if d.is_active %} <li class='active'> {% else %} <li class='other'> {% endif %}
-	  <a class="dropdown-toggle" data-toggle="dropdown" href="{{ d.href }}">{{ d.label }}<b class="caret"></b></a>
-	  <ul class="dropdown-menu">
-	    {% for dd in d.contents %}
-	    <li class='{% if dd.is_active %}active{% else %}other{% endif %}{% if dd.disabled %} disabled{%endif%}'
-	    {% if dd.domid %} id='{{dd.domid}}'{% endif %}>
-	    <a href="{{ dd.href }}"> {{ dd.label }} </a> </li>
-	    {% endfor %}
-	  </ul>
-        </li>
-        {% else %} 
-	<li class='{% if d.is_active %}active{% else %}other{% endif %}{% if d.disabled %} disabled{%endif%}'
-	{% if d.domid %} id='{{d.domid}}'{% endif %}>
-	<a href="{{ d.href }}"> {{ d.label }} </a> </li>
-    {% endif %}
-    {% endfor %}
-</div>
-
 
+<div id="header">
+	<div class="wrapper">
+		<div class="logo">
+			<a href="/"><img src="{{ STATIC_URL }}img/f4f-logo.png" alt="Fed4Fire Portal" width="80px" /> Fed4Fire Portal</a>
+		</div>
+		
+		<div id="secondary">
+			<ul>
+				<li>News</li>
+				<li><a href="/portal/about">About</a></li>
+				<li><a target="_blank" href="http://www.fed4fire.eu">Project Website</a></li>
+			</ul>
+		</div>
+	</div>
+	
+	{% if username %}
+	<div id="navigation">
+		<div class="wrapper">
+		<ul>
+			<li id="nav-account"><a href="/portal/account/">{{ username }}</a></li>
+			<li>|</li>
+			<li id="nav-institution" class=""><a href="/portal/institution">INSTITUTION</a></li>
+			<li class="slices">
+				<a class="dropdown-toggle" data-toggle="dropdown" href="#">
+       				SLICES <span class="caret"></span>
+    			</a>
+				
+				<div class="dropdown-menu" style="z-index:99;">
+						<ul>
+							<li><a href="/portal/slice_request/">Request Slice</a></li>
+                            <!--
+							<li><a href="/slice/ple.upmc.agent3/">ple.upmc.agent3</a></li>
+						    <li><a href="/slice/ple.upmc.agent/">ple.upmc.agent</a></li>
+						    <li><a href="/slice/ple.upmc.myslicedemo/">ple.upmc.myslicedemo</a></li>
+						    <li><a href="/slice/ple.upmc.slicestat/">ple.upmc.slicestat</a></li>
+						    <li><a href="/slice/ple.upmc.agent2/">ple.upmc.agent2</a></li>
+                            -->
+						</ul>
+				</div>
+				</li>
+			<li id="nav-request"><a href="/portal/validate">REQUESTS</a></li>
+			<li id="nav-support"><a href="http://doc.fed4fire.eu/support.html" target="_blank">SUPPORT</a></li>
+			<li>|</li>
+			<li id="nav-logout" style="margin-top: 10px;"><a id="logout" style="cursor:pointer;" data-username="{{ username }}"><span class="glyphicon glyphicon-off"></span> LOGOUT</a></li>
+		</ul>
+		</div>
+	</div>
+	{% else %}
+	<div id="navigation">
+		<div class="wrapper"></div>
+	</div>
+	{% endif %}
+</div>
+<script>
+	$(document).ready(function() {
+		$('li.slices').mouseenter(function() {
+			$('div#menu-slice-list').fadeIn(100);
+		});
+		$('div#menu-slice-list').mouseleave(function(e) {
+			if (!$('li.slices').is(":hover")) {
+				$(this).fadeOut(100);
+			}
+		});
+		// var slices = localStorage.getItem('slices');
+		// if (slices.length == 0) {
+			// $.post("/rest/user/",{'filters':{'user_hrn':'$user_hrn'}}, function( data ) {
+		  	// var items = [];
+		  		// localStorage.setItem('slices', data[0].slice);
+			// });
+		// }
+		// $.each(slices, function( key, val ) {
+		  	// items.push( "<li><a href=\"/slice/"+val.slice_hrn+"\">" + val.slice_hrn + "</a></li>" );
+		// });
+		// $("div#home-slice-list").html($( "<ul/>", { html: items.join( "" ) }));
+	});
+</script>
diff --git a/portal/templates/fed4fire/fed4fire_base.html b/portal/templates/fed4fire/fed4fire_base.html
new file mode 100644
index 00000000..f411ec2b
--- /dev/null
+++ b/portal/templates/fed4fire/fed4fire_base.html
@@ -0,0 +1,43 @@
+{# This is required by insert_above #}{% insert_handler %}<!DOCTYPE html>
+<html lang="en"><head>
+<title>Fed4Fire Portal - {{ section }}</title>
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<link rel="shortcut icon" href="/static/img/myslice-icon.png">
+{# This is where insert_str will end up #}{% media_container prelude %}
+{% include 'messages-transient-header.html' %}
+<script type="text/javascript"> {# raw js code - use {% insert prelude_js %} ... {% endinsert %} #} {% container prelude_js %}</script>
+<script src="{{ STATIC_URL }}js/jquery.dataTables.min.js"></script>
+<script src="{{ STATIC_URL }}js/bootstrap.datatables.js"></script>
+<script src="{{ STATIC_URL }}js/myslice.js"></script>
+<script src="{{ STATIC_URL }}js/myslice-ui.js"></script>
+<style type="text/css">{# In case we need to add raw css code #}{% container prelude_css %}</style>
+{{ header_prelude }}
+{% block head %} {% endblock head %}
+{# let's add these ones no matter what #}
+{% insert_str prelude "js/jquery.min.js" %}
+{% insert_str prelude "js/jquery.html5storage.min.js" %}
+{% insert_str prelude "js/messages-runtime.js" %}
+{% insert_str prelude "js/class.js" %}
+{% insert_str prelude "js/plugin-helper.js" %}
+{% insert_str prelude "js/mustache.js" %}
+{% insert_str prelude "js/plugin.js" %}
+{% insert_str prelude "js/manifold.js" %}
+{% insert_str prelude "css/manifold.css" %}
+{% insert_str prelude "css/plugin.css" %}
+{% insert_str prelude "js/bootstrap.js" %}
+{% insert_str prelude "css/bootstrap.css" %}
+{% insert_str prelude "css/topmenu.css" %}
+{% insert_str prelude "js/logout.js" %}
+<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/{{ theme }}.css">
+</head>
+<body>
+{% block container %}
+  	{% block topmenu %}
+  	{% include theme|add:"__widget-topmenu.html" %}
+  	{% endblock topmenu %}
+	{% include 'messages-transient.html' %}
+	{% block base_content %}
+	{% endblock %}
+{% endblock container %}
+</body>
+</html>
diff --git a/portal/templates/fed4fire/fed4fire_contact.html b/portal/templates/fed4fire/fed4fire_contact.html
new file mode 100644
index 00000000..600eb4a7
--- /dev/null
+++ b/portal/templates/fed4fire/fed4fire_contact.html
@@ -0,0 +1,38 @@
+{% extends "layout.html" %}
+
+{% block head %}
+{{ wizard.form.media }}
+{% endblock %}
+
+{% block content %}
+<div class="row">
+	<div class="col-md-12">
+	<h1><img src="{{ STATIC_URL }}icons/support-xs.png" alt="Open a Ticket" /> Fed4Fire Support</h1>
+	</div>
+</div>
+<div class="row">
+	<div class="col-md-12">&nbsp;</div>
+</div>
+<div class="row">
+	<div class="col-md-12">
+	<p>Please check the <a href="http://doc.fed4fire.eu/support.html" target="_blank">documentation</a></p>
+	</div>
+</div>
+
+<div class="row">
+	<div class="col-md-2"></div>
+	<div class="col-md-8">
+		<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-default">Create Ticket</button>
+		</form>
+	</div>
+</div>
+{% endblock %}
+
diff --git a/portal/templates/fed4fire/fed4fire_home-view.html b/portal/templates/fed4fire/fed4fire_home-view.html
index bc018a45..0429edaa 100644
--- a/portal/templates/fed4fire/fed4fire_home-view.html
+++ b/portal/templates/fed4fire/fed4fire_home-view.html
@@ -1,19 +1,119 @@
-{# fine for either layout-unfold1.html (logged in) or layout-unfold2.html (needs a login prompt) #}
-{% extends layout_1_or_2 %}
- 
-{% block unfold_margin %}
-{% include 'fed4fire/_widget-login.html' %}
-{% endblock unfold_margin %}
+{% extends "layout.html" %}
 
-{% block unfold_main %}
-<div class='well-lg f4f-title'>
-  <h2 style="font-weight: bold;">Welcome to Fed4Fire portal !</h2>
-  <h4>New to Fed4fire? Please <a href="/portal/register">register</a> or learn more about <a href="http://fed4fire.eu/" target="_blank">the project</a>.</h3>
+{% block content %}
+<div class="row" id="home-dashboard">
+	<ul class="nav nav-tabs">
+	  <li class="active"><a class="home-tab" data-panel="user" href="#">USER</a></li>
+	  <li><a class="home-tab" data-panel="manager" href="#">MANAGER</a></li>
+	</ul>
+	<div class="home-panel" id="user">
+		<table>
+			<tr>
+				<td>ACCOUNT</td>
+				<td>SLICES</td>
+				<td>SUPPORT</td>
+			</tr>
+			<tr>
+				<td><a href="/portal/account/"><img src="{{ STATIC_URL }}img/icon_user_color.png" alt="" /></a></td>
+				<td><a href="#"><img src="{{ STATIC_URL }}img/icon_slices.png" alt="" /></a></td>
+				<td><a href="/portal/support"><img src="{{ STATIC_URL }}img/icon_support.png" alt="" /></a></td>
+			</tr>
+			<tr>
+				{% if person %}
+				<td class="logged-in">
+					<button id="logoutbtn" type="button" class="btn btn-default" data-username="{{ username }}"><span class="glyphicon glyphicon-off"></span> Logout</button>
+					<div>
+					{% if person.last_name %}
+						{{person.first_name}} {{person.last_name}}<br />
+					{% endif %}
+	    				<span class="label">Email:</span> <a href='/portal/account/'>{{person.email}}</a>
+	    			</div>
+	   			{% else %}
+	   			<td>
+					{% include '_widget-login-user.html' %}
+				{% endif %}
+				</td>
+				<td>
+				{% if person %}
+					<button id="slicerequestbtn" type="button" class="btn btn-default"><span class="glyphicon glyphicon-plus"></span> Request Slice</button>
+					<div id="home-slice-list"><img src="{{ STATIC_URL }}img/loading.gif" alt="Loading Slices" /></div>
+				{% else %}
+				{% endif %}
+				</td>
+				<td class="support">
+					<button id="ticketbtn" type="button" class="btn btn-default"><span class="glyphicon glyphicon-plus"></span> Create Ticket</button>
+					<div>
+						<a href="/portal/contact">Contact</a> <br />
+						<a href="/portal/support/documentation">Documentation</a>
+					</div>
+				</td>
+			</tr>
+		</table>
+	</div>
+	<div class="home-panel" id="manager">
+		<table>
+			<tr>
+				<td>INSTITUTION</td>
+				<td>SLICES</td>
+				<td>REQUESTS</td>
+			</tr>
+			<tr>
+				<td><a href="/portal/institution"><img src="{{ STATIC_URL }}img/icon_authority_color.png" alt="" /></a></td>
+				<td><a href="/portal/institution#slices"><img src="{{ STATIC_URL }}img/icon_slices.png" alt="" /></a></td>
+				<td><a href="/portal/validate"><img src="{{ STATIC_URL }}img/icon_testbed_color.png" alt="" /></a></td>
+			</tr>
+			<tr>
+				{% if person %}
+				<td class="logged-in">
+					<button id="logoutbtn" type="button" class="btn btn-default" data-username="{{ username }}"><span class="glyphicon glyphicon-off"></span> Logout</button>
+	   			{% else %}
+	   			<td>
+					{% include '_widget-login-manager.html' %}
+				{% endif %}
+				</td>
+				<td>
+					{% if person %}
+				    <button id="slicerequestbtn" type="button" class="btn btn-default"><span class="glyphicon glyphicon-plus"></span> Create Slice</button>
+					{% endif %}
+				</td>
+				<td class="support">
+					{% if person %}
+				    <button id="validaterequestbtn" type="button" class="btn btn-default"><span class="glyphicon glyphicon-ok"></span> Validate Requests</button>
+					{% endif %}
+				</td>
+			</tr>
+		</table>
+	</div>
 </div>
-<div class='well'>
-<p>
-A federation of experimentation facilities will significantly accelerate Future Internet research. Fed4FIRE will deliver open and easily accessible facilities to the FIRE experimentation communities, which focus on fixed and wireless infrastructures, services and applications, and combinations thereof. 
-</p>
-<p>This UI server is connected to the manifold backend running at <code>{{ MANIFOLD_URL }}</code>.</p>
-</div>
-{% endblock unfold_main %}
+<script>
+	$(document).ready(function() {
+		$('a.home-tab').click(function() {
+			$('ul.nav-tabs li').removeClass('active');
+			$(this).parent().addClass('active');
+			$('div.home-panel').hide();
+			$('div#'+$(this).data('panel')).show();
+		});
+		$('button#validaterequestbtn').click(function() {
+			window.location="/portal/validate/";
+		});
+		$('button#ticketbtn').click(function() {
+			window.location="/portal/contact/";
+		});
+		$('button#slicerequestbtn').click(function() {
+			window.location="/portal/slice_request/";
+		});
+		
+		{% if person %}
+        $.post("/rest/user/",{'filters':{'user_hrn':'$user_hrn'}}, function( data ) {
+		  var items = [];
+		  $.each( data[0].slices, function(i, val) {
+		  	items.push( "<li><a href=\"/slice/"+val+"\">" + val + "</a></li>" );
+		  });
+		  
+		  $("div#home-slice-list").html($( "<ul/>", { html: items.join( "" ) }));
+		  
+		});
+		{% endif %}
+	});
+</script>
+{% endblock %}
diff --git a/portal/templates/fed4fire/fed4fire_supportview.html b/portal/templates/fed4fire/fed4fire_supportview.html
new file mode 100644
index 00000000..2f6e183b
--- /dev/null
+++ b/portal/templates/fed4fire/fed4fire_supportview.html
@@ -0,0 +1,46 @@
+{% extends "layout.html" %}
+
+{% block content %}
+	<div class="row">
+		<h1><img src="{{ STATIC_URL }}icons/support-xs.png" alt="Support" /> Fed4Fire Portal Support</h1>
+	</div>
+
+	
+	<div class="row">
+		<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>
+	</div>
+	
+	<div class="row">
+	
+		<h2><a href="/portal/support/documentation">FAQ</a></h2>
+		<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>
+		<p>
+		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> 
+		</p>
+	</div>
+
+<script>
+    $(document).ready(function() {
+		$('li#nav-support').addClass("active");
+        $('button#ticketbtn').click(function() {
+            window.location="/portal/contact/";
+        });
+    });
+</script>
+
+
+{% endblock %}
+
diff --git a/portal/templates/fed4fire/fed4fire_widget-slice-sections.html b/portal/templates/fed4fire/fed4fire_widget-slice-sections.html
new file mode 100644
index 00000000..bf64b8d8
--- /dev/null
+++ b/portal/templates/fed4fire/fed4fire_widget-slice-sections.html
@@ -0,0 +1,33 @@
+{% if section == "resources" %}
+<ul class="nav nav-tabs nav-section">
+	<li><a href="/slice/{{ slice }}#info"><img src="{{ STATIC_URL }}icons/slices-xs.png" alt="About MySlice" /> {{ slice }}</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" data-toggle="tab">Experiment</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" alt="About MySlice" /> {{ slice }}</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" data-toggle="tab">Experiment</a></li>
+</ul>
+<script>
+$(document).ready(function() {
+	$('.nav-tabs a').click(function (e) {
+		if ($(this).hasClass('link')) return;
+  		e.preventDefault();
+  		$(this).tab('show');
+    	var id = $(this).attr('href').substr(1);    	
+    	$("#" + id).load('/' + id + '/{{ slice }}/');
+	});
+	$('div#info').load('/info/{{ slice }}/');
+});
+</script>
+{% endif %}
\ No newline at end of file
diff --git a/portal/templates/fed4fire/old._widget-topmenu.html b/portal/templates/fed4fire/old._widget-topmenu.html
new file mode 100644
index 00000000..4b2ae0ee
--- /dev/null
+++ b/portal/templates/fed4fire/old._widget-topmenu.html
@@ -0,0 +1,38 @@
+{% insert_str prelude "js/bootstrap.js" %}
+{% insert_str prelude "css/bootstrap.css" %}
+{% insert_str prelude "css/topmenu.css" %}
+{% insert_str prelude "js/logout.js" %}
+<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
+  <div class="navbar-header">
+    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-myslice-collapse">
+      <span class="sr-only">Toggle navigation</span>
+      <span class="icon-bar"></span>
+      <span class="icon-bar"></span>
+      <span class="icon-bar"></span>
+    </button>
+    <a class="navbar-brand" href="/"><img src="{{ STATIC_URL }}img/f4f-logo.png" height="30" alt="Fed4Fire logo" /></a>
+     <a href="/" alt="Home" class="logoTxt">Fed4Fire Portal</a>
+  </div>
+  <div class="collapse navbar-collapse navbar-myslice-collapse topmenu">
+    <ul class="nav navbar-nav">
+	{% for d in topmenu_items %} 
+	{% if d.dropdown %}
+	{% if d.is_active %} <li class='active'> {% else %} <li class='other'> {% endif %}
+	  <a class="dropdown-toggle" data-toggle="dropdown" href="{{ d.href }}">{{ d.label }}<b class="caret"></b></a>
+	  <ul class="dropdown-menu">
+	    {% for dd in d.contents %}
+	    <li class='{% if dd.is_active %}active{% else %}other{% endif %}{% if dd.disabled %} disabled{%endif%}'
+	    {% if dd.domid %} id='{{dd.domid}}'{% endif %}>
+	    <a href="{{ dd.href }}"> {{ dd.label }} </a> </li>
+	    {% endfor %}
+	  </ul>
+        </li>
+        {% else %} 
+	<li class='{% if d.is_active %}active{% else %}other{% endif %}{% if d.disabled %} disabled{%endif%}'
+	{% if d.domid %} id='{{d.domid}}'{% endif %}>
+	<a href="{{ d.href }}"> {{ d.label }} </a> </li>
+    {% endif %}
+    {% endfor %}
+</div>
+
+
diff --git a/portal/templates/fed4fire/old.home-view.html b/portal/templates/fed4fire/old.home-view.html
new file mode 100644
index 00000000..bc018a45
--- /dev/null
+++ b/portal/templates/fed4fire/old.home-view.html
@@ -0,0 +1,19 @@
+{# fine for either layout-unfold1.html (logged in) or layout-unfold2.html (needs a login prompt) #}
+{% extends layout_1_or_2 %}
+ 
+{% block unfold_margin %}
+{% include 'fed4fire/_widget-login.html' %}
+{% endblock unfold_margin %}
+
+{% block unfold_main %}
+<div class='well-lg f4f-title'>
+  <h2 style="font-weight: bold;">Welcome to Fed4Fire portal !</h2>
+  <h4>New to Fed4fire? Please <a href="/portal/register">register</a> or learn more about <a href="http://fed4fire.eu/" target="_blank">the project</a>.</h3>
+</div>
+<div class='well'>
+<p>
+A federation of experimentation facilities will significantly accelerate Future Internet research. Fed4FIRE will deliver open and easily accessible facilities to the FIRE experimentation communities, which focus on fixed and wireless infrastructures, services and applications, and combinations thereof. 
+</p>
+<p>This UI server is connected to the manifold backend running at <code>{{ MANIFOLD_URL }}</code>.</p>
+</div>
+{% endblock unfold_main %}