Merge branch 'onelab' of ssh://git.onelab.eu/git/myslice into onelab
[myslice.git] / portal / templates / fed4fire / fed4fire_home-view.html
index bc018a4..4c1c6fb 100644 (file)
-{# 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>
+{% extends "layout_base.html" %}
+{% load portal_filters %}
+
+{% block content %}
+<!-- <div class="row">
+{% widget '_widget-news.html' %}
+</div> -->
+{% if username %}
+<!-- Modal- No credentials -->
+<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">No credentials are delegated to the portal</h4>
+                    </div>
+                    <div class="modal-body" style="text-align:justify;">
+                                       <p>You are getting this message for any of the following reasons:</p>
+                                       <ul>
+                                               <li>If your account is still pending for validation</li>
+                                               <li>If you press the "Clear Credentials" button</li>
+                                               <li>If you "Generate a new key pair"</li>
+                                               <li>If a new slice is added to your account</li>
+                                       </ul>
+                                       <p>Unless your account has not yet been validated, it is sufficient to refresh the page or go back to the home page. 
+                                               The portal will then regenerate your credentials. In some cases it may take more time than usual. If nothing works, 
+                                               then please logout and login back into to the portal.
+                                       </p>
+                                       <h3>Manual delegation of credentials</h3>
+                                               <p>
+                                                       You have selected upon sign-up to upload your public key. As you have uploaded your own public key, 
+                                                       the portal can no longer generate your credentials automatically. In order to have your credentials 
+                                                       delegated to the portal, please follow these instructions:
+                                               </p>
+                                               <ul>
+                                                       <li>Your account must first be validated by the manager of your organization.</li>
+                                                       <li>In order for the portal to contact testbeds on your behalf, so as to list and reserve resources, you will need to
+                                                               <a href="/portal/manual_delegation" target="_blank">delegate your credentials to the portal.</a></li>
+                                               </ul>
+                                       </p>
+                                       <h3>Contact support</h3>
+                                       <p>If you don't have the above mentioned cases and still have this message, please  <a href="/contact/" target="_blank">contact us</a>.</p>
+                    </div>
+                    <div class="modal-footer">
+                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+                    </div>
+                </div>
+            </div>
+</div>
+<div class="container dashboard">
+       <div class="row">
+       {%if 'no_creds'  in user_cred %}
+       <p class="command"><a href="#" style="color:red" data-toggle="modal" data-target="#myModal">NO CREDENTIALS</a> are delegated to the portal!</p>
+       {%endif%}
+       {%if 'creds_expired'  in user_cred %}
+       <p class="command"><a href="#" style="color:red" data-toggle="modal" data-target="#myModal">EXPIRED CREDENTIALS</a> Please delegate again your credentials to the portal!</p>
+    {%endif%}
+               {% if pi %}
+               <div class="col-md-3">
+                       <h3>
+                               EXPERIMENT
+                       </h3>
+                       <div>
+                               <a href="#"><img src="{{ STATIC_URL }}img/icon_slices.png" alt="" /></a>
+                       </div>
+                       <div>
+                               <button id="slicerequestbtn" type="button" class="btn btn-default"><span class="glyphicon glyphicon-plus"></span> Create Slice</button>
+                       </div>
+                       <div>
+                               <p><strong>Your slices </strong>
+                                       <span title="A slice is a set of testbed resources on which you can conduct an experiment. 
+                                       Either ask your colleagues to give you access to an existing slice or request a new slice by clicking 'Request Slice'. 
+                                       However, on the Fed4FIRE portal, you will only see slices that you have created through Fed4FIRE. If you have created slices elsewhere, 
+                                       those slices will not appear here."
+                                       class="glyphicon glyphicon-info-sign">
+                               </span>
+
+                               </p>
+                       </div>
+                       <div>   
+                               <div id="home-slice-list"><img src="{{ STATIC_URL }}img/loading.gif" alt="Loading Slices" /></div>
+                       </div>
+                       <h3 title="Some tools do their own slice creation and management.">Experiment now</h3>
+                       <a class="btn btn-primary" style="width: 150px;" 
+                    href='http://jfed.iminds.be/releases/5.4-dev/r2289/webstart/experimenter/jfed-experimenter.jnlp'
+                                       title="Click here to start your experiment with jFed" 
+                                       onclick="return  launchApplication('http://jfed.iminds.be/releases/5.4-dev/r2289/webstart/experimenter/jfed-experimenter.jnlp');">
+                    <span class="glyphicon glyphicon-cloud"></span> jFed</a>
+               </div>
+               <div class="col-md-3">
+                       <h3>MANAGEMENT</h3>
+                       <div>
+                               <a href="/portal/institution"><img src="{{ STATIC_URL }}img/icon_authority_color.png" alt="" /></a>
+                       </div>
+                       <div>
+                               <button id="projectrequestbtn" type="button" class="btn btn-default" style="width:165px;"><span class="glyphicon glyphicon-plus"></span> Join Project</button>
+                       </div>
+                       <div>
+                               <button id="validaterequestbtn" type="button" class="btn btn-default"><span class="glyphicon glyphicon-ok"></span> Validate Requests</button>
+                       </div>
+                       <div>
+                               <p><strong>Your projects </strong>
+                                       <span title="A project is a sub-authority under the responsability of your institution gathering users, who will be able to create slices for their experiments."
+                                       class="glyphicon glyphicon-info-sign">
+                               </span>
+                               </p>
+                       </div>
+                       <div>   
+                               <div id="home-project-list"><img src="{{ STATIC_URL }}img/loading.gif" alt="Loading projects" /></div>
+                       </div>
+
+               </div>
+               <div class="col-md-3">
+                       <h3>
+                               SUPPORT
+                       </h3>
+                       <div>
+                               <a href="/portal/support"><img src="{{ STATIC_URL }}img/icon_support.png" alt="" /></a>
+                       </div>
+                       <div>
+                               <button id="ticketbtn" type="button" class="btn btn-default"><span class="glyphicon glyphicon-envelope"></span> Contact</button>
+                       </div>
+                       <p></p>
+                       <div>
+                       <button id="statbtn" type="button" style="width: 170px;" class="btn btn-default"><span class="glyphicon glyphicon-stats" style="margin-right: 10px;"></span>Testbeds' status</button>
+                       </div>
+                       <div>
+                       <button id="repbtn" type="button" style="width: 170px;" class="btn btn-default"><span class="glyphicon glyphicon-stats"></span>Testbeds' reputation</button>
+                       </div>
+               </div>
+               
+               <div class="col-md-3">
+                       <h3>
+                               ACCOUNT
+                       </h3>
+                       <div>
+                               <a href="/portal/account/"><img src="{{ STATIC_URL }}img/icon_user_color.png" alt="" /></a>
+                       </div>
+                       <div>
+                               <button id="logoutbtn" type="button" class="btn btn-default" data-username="{{ username }}"><span class="glyphicon glyphicon-off"></span> Logout</button>
+                       </div>
+                       <div>
+                               {% if person.last_name %}
+                                       {{person.first_name}} {{person.last_name}}<br />
+                               {% endif %}
+                       <span class="label">Username:</span> <a href='/portal/account/' title="Click here to see and edit your account details.">{{person.email}}</a>
+               </div>
+               </div>
+       </div>
+       {%else%}
+       <div class="row">
+               <div class="col-md-4">
+                       <h3>
+                               EXPERIMENT
+                       </h3>
+                       <div>
+                               <a href="#"><img src="{{ STATIC_URL }}img/icon_slices.png" alt="" /></a>
+                       </div>
+                       <div>
+                               <button id="slicerequestbtn" type="button" class="btn btn-default"><span class="glyphicon glyphicon-plus"></span> Request Slice</button>
+                       </div>
+                       <div>
+                               <p><strong>Your slices </strong>
+                               <span title="A slice is a set of testbed resources on which you can conduct an experiment. 
+                                       Either ask your colleagues to give you access to an existing slice or request a new slice by clicking 'Request Slice'. 
+                                       However, on the Fed4FIRE portal, you will only see slices that you have created through Fed4FIRE. If you have created slices elsewhere, 
+                                       those slices will not appear here."
+                                       class="glyphicon glyphicon-info-sign">
+                               </span>
+                               </p>
+                       </div>
+                       <div>   
+                               <div id="home-slice-list"><img src="{{ STATIC_URL }}img/loading.gif" alt="Loading Slices" /></div>
+                       </div>
+                       {% if pending_slices %}
+                       <p><strong>Pending slices</strong>
+                       <span title="Slices that you have requested and are pending for validation by the contact person of your organization."
+                               class="glyphicon glyphicon-info-sign">
+                       <ul>
+                       {% for slices in pending_slices %}
+                       <li>{{slices}}</li>
+                       {% endfor %}
+                       </ul>
+                       </span>
+                       </p>
+                       {%endif%}
+                       <h3 title="Some tools do their own slice creation and management.">Experiment now</h3>
+                       <a class="btn btn-primary" style="width: 150px;" 
+                    href='http://jfed.iminds.be/releases/5.4-dev/r2289/webstart/experimenter/jfed-experimenter.jnlp'
+                                       title="Click here to start your experiment with jFed" 
+                                       onclick="return  launchApplication('http://jfed.iminds.be/releases/5.4-dev/r2289/webstart/experimenter/jfed-experimenter.jnlp');">
+                    <span class="glyphicon glyphicon-cloud"></span> jFed</a>   
+               </div>
+               <div class="col-md-4">
+                       <h3>
+                               SUPPORT
+                       </h3>
+                       <div>
+                               <a href="/portal/support"><img src="{{ STATIC_URL }}img/icon_support.png" alt="" /></a>
+                       </div>
+                       <div>
+                               <button id="ticketbtn" type="button" class="btn btn-default"><span class="glyphicon glyphicon-envelope"></span> Contact</button>
+                       </div>
+                       <p></p>
+                       <div>
+                       <button id="statbtn" type="button" style="width: 150px;" class="btn btn-default"><span class="glyphicon glyphicon-stats"></span>Testbeds' status</button>
+                       </div>
+                       <div>
+                       <button id="repbtn" type="button" style="width: 170px;" class="btn btn-default"><span class="glyphicon glyphicon-stats"></span>Testbeds' reputation</button>
+                       </div>
+               </div>
+               
+               <div class="col-md-4">
+                       <h3>
+                               ACCOUNT
+                       </h3>
+                       <div>
+                               <a href="/portal/account/"><img src="{{ STATIC_URL }}img/icon_user_color.png" alt="" /></a>
+                       </div>
+                       <div>
+                               <button id="logoutbtn" type="button" class="btn btn-default" data-username="{{ username }}"><span class="glyphicon glyphicon-off"></span> Logout</button>
+                       </div>
+                       <div>
+                               {% if person.last_name %}
+                                       {{person.first_name}} {{person.last_name}}<br />
+                               {% endif %}
+                       <span class="label">Username:</span> <a href='/portal/account/' title="Click here to see and edit your account details.">{{person.email}}</a>
+               </div>
+               </div>
+       </div>
+       {%endif%}
+
 </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>
+{% else %}
+<div class="container-fluid home">
+       <div class="">
+               <div class="col-sm-2"></div>
+               <div class="col-sm-4 slogan">
+                       <h2>
+                               Fed4FIRE Portal
+                       </h2>
+                       <h3>
+                               Your easy access to Future Internet Research and Experimentation testbeds belonging to the Fed4FIRE federation.
+                       </h3>
+                       <h3>
+                                <a href='http://doc.fed4fire.eu'>Want to learn more?</a>
+                       </h3>
+               </div>
+               <div class="col-sm-4 col-sm-offset-1" style="width:400px; top:16px; float:left;">
+                       <div class="row">
+                               {% widget '_widget-login-user.html' %}
+                       </div>
+               </div>
+               <div class="col-sm-1"></div>
+       </div>
 </div>
-{% endblock unfold_main %}
+{% endif %}
+
+
+<script type="text/javascript">
+       $(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/institution#requests";
+               });
+               $('button#ticketbtn').click(function() {
+                       window.location="/portal/contact/";
+               });
+               $('button#statbtn').click(function() {
+               window.location="https://flsmonitor.fed4fire.eu";
+               });
+                $('button#repbtn').click(function() {
+               window.location="/portal/reputation";
+                });
+               $('button#signupbtn').click(function() {
+                       window.location="/portal/register/";
+               });
+               $('button#slicerequestbtn').click(function() {
+                       window.location="/portal/slice_request/";
+               });
+               $('button#projectrequestbtn').click(function() {
+                       window.location="/portal/project_request/";
+               });
+
+        myslice.loadSlices();
+});
+</script>
+
+<!--for jfed tool-->
+<script type="text/javascript" src="{{STATIC_URL}}js/fed4fire_dtjava_orig.js"></script>
+<script>
+       function launchApplication(jnlpfile) {
+       dtjava.launch(
+               { url : jnlpfile },
+            {
+               javafx : '2.2+',
+                toolkit: 'swing'
+               },
+                {}
+        );
+        return false;
+     }
+</script>
+{# widget "_widget-monitor.html" #}
+{# widget "_widget-stats-top-slices.html" #}
+
+{% endblock %}