CSS: myslice.css is generic, the CSS for each theme will only override the colors
[unfold.git] / portal / templates / base.html
index decc1b3..ceebc5d 100644 (file)
@@ -1,9 +1,19 @@
 {% load portal_filters %}
 {# This is required by insert_above #}{% insert_handler %}<!DOCTYPE html>
-<html lang="en"><head>
+<html lang="en">
+<head>
 <title>{{theme}} portal - {{ section }}</title>
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
-<link rel="shortcut icon" href="/static/img/favicon.ico">
+
+<!--Selecting favicon based on theme. Add more for other portals -->
+{% if theme == "fed4fire" %}
+    <link rel="shortcut icon" href="/static/img/fed4fire_favicon.ico">
+{% elif theme == "smartfire" %}
+    <link rel="shortcut icon" href="/static/img/smartfire_favicon.ico">
+{% else %}
+    <link rel="shortcut icon" href="/static/img/favicon.ico">
+{% endif %}
+
 {# 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/jquery.qtip.min.js"></script>
 <script src="{{ STATIC_URL }}js/bootstrap.datatables.js"></script>
-<!-- <script src="{{ STATIC_URL }}js/stash.min.js"></script> -->
+<script src="{{ STATIC_URL }}js/common.functions.js"></script>
 <script src="{{ STATIC_URL }}js/myslice.js"></script>
 <script src="{{ STATIC_URL }}js/myslice-ui.js"></script>
+
+<script type="text/javascript" src="{{STATIC_URL}}/js/spin-presets.js"></script>
+<script type="text/javascript" src="{{STATIC_URL}}/js/spin.min.js"></script>
+<script type="text/javascript" src="{{STATIC_URL}}/js/jquery.spin.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 #}
+{#NOTE: DO NOT ADD JQUERY-UI JS & CSS HERE. IT BREAKS THE RESOURCE BROWSING PAGE -- DETAILS WITH JORDAN AUGE#}
 {% insert_str prelude "js/jquery.min.js" %}
 {% insert_str prelude "js/angular/angular.min.js" %}
 {% insert_str prelude "js/jquery.html5storage.min.js" %}
@@ -38,6 +54,7 @@
 {% insert_str prelude "css/slider.css" %}
 {% insert_str prelude "css/topmenu.css" %}
 {% insert_str prelude "js/logout.js" %}
+<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/myslice.css">
 <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/{{ theme }}.css">
 <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/jquery.qtip.min.css">
 
@@ -50,7 +67,7 @@ This list of slices should go into SESSION !
 $(document).ready(function() {
 {% if username %}
     myslice.login(function(){
-        user = myslice.user();
+        user = myslice.get_user();
 
         var slices = [];
         if($.isEmptyObject(user)){
@@ -60,36 +77,81 @@ $(document).ready(function() {
             slices.push("no slice");
         }else{
             slices = user.slices;
+            {% if theme != "fed4fire" or "onelab" in theme %}
             drawSlices(slices);
+            {% endif %}
+        }
+        {% if theme == "fed4fire" or "onelab" in theme%}
+        p = myslice.get_projects();
+        if(p != null){
+            //drawProjects(p);
+            drawProjectsTree(p,slices);
         }
-        {% if theme == "fed4fire" %}
-        myslice.loadProjects(function(){
-            p = myslice.projects();
-            drawProjects(p);
-        });
         {% endif %}
     });
 
     function drawSlices(slices){
         var items = [];
-               
+        console.log(slices);
         $.each( slices, function(i, val) {
-            items.push( "<li><a href=\"/resources/"+val+"\">" + val + "</a></li>" );
+            items.push( "<li><a href=\"/resources/"+val+"\" title='Add resources to slice "+val+"'><img src='/static/img/icon_slices_small.png' style='width: 12px;'>" + val + "</a></li>" );
         });
         $("div#home-slice-list").html($( "<ul/>", { html: items.join( "" ) }));
         $("ul#dropdown-slice-list").append(items.join( "" ));
     }
     
-    {% if theme == "fed4fire" %}
+    {% if theme == "fed4fire" or "onelab" in theme%}
     function drawProjects(projects){
         var items = [];
                
         $.each( projects, function(i, val) {
-            items.push( "<li><a href=\"/portal/project/"+val.authority_hrn+"\">" + val.authority_hrn + "</a></li>" );
+            items.push( "<li><a href=\"/portal/project/"+val+"\" title='Manage project "+val+"'>" + val + "</a></li>" );
         });
         $("div#home-project-list").html($( "<ul/>", { html: items.join( "" ) }));
         $("ul#dropdown-project-list").append(items.join( "" ));
     }
+    function drawProjectsTree(projects,slices) {
+        var items = [];
+        var items_sl = [];
+        var slices_no_project = [];
+        $.each( projects, function(i, p) {
+            $.each( slices, function(y, s) {
+                if (s.match('^' + escapeRegExp(p))) {
+                    slicename = s.replace(p + '.','')
+                    items_sl.push( "<li><a href=\"/resources/" + s + "\" title='Add resources to slice "+slicename+"'><img src='/static/img/icon_slices_small.png' style='width: 12px;'>  " + slicename + "</a></li>" );
+                }else if(s.split('.').length < 4){
+                     slices_no_project.push( "<li><a href=\"/resources/" + s + "\" title='Add resources to slice "+s+"'><img src='/static/img/icon_slices_small.png' style='width: 12px;'>  " + s + "</a></li>" );
+                }
+            });
+            el = "<li><a href=\"/portal/project/" + p + "\" title='Manage project "+p+"' >" + p + "</a>";
+            if (items_sl.length > 0) {
+                el += "<ul>" + items_sl.join( "" ) + "</ul>";
+            }
+            el += "</li>";
+            items.push(el);
+            items_sl = [];
+        });
+        if (projects.length == 0){
+            $.each( slices, function(y, s) {
+                slices_no_project.push( "<li><a href=\"/resources/" + s + "\" title='Add resources to slice "+s+"'><img src='/static/img/icon_slices_small.png' style='width: 12px;'>  " + s + "</a></li>" );
+            });
+        }
+        if (slices_no_project.length > 0) {
+            elm = '<li>other slices <span class="glyphicon glyphicon-info-sign" title="these are <b>legacy slices</b> from now on, slices must be created within a project">&nbsp;</span>';
+            elm += "<ul>" + slices_no_project.join( "" ) + "</ul>";
+            elm += "</li>";
+            items.push(elm);
+        }
+
+        $("div#home-project-tree").html($( "<ul/>", { html: items.join( "" ) }));
+        if (projects.length > 0) {
+            $('.dashboard-create-slice').show();
+        }
+    }
+    
+    window.setTimeout(function() {
+        $('.projects-loading').hide();
+    },20000);
     {% endif %}
 {% endif %}
        jQuery('[title!=""]').qtip();
@@ -97,6 +159,9 @@ $(document).ready(function() {
 </script>
 </head>
 <body ng-app="ManifoldApp">
+<div class="row">
+{% widget '_widget-message.html' %}
+</div>
 {% block container %}
        {% block topmenu %}
        {% widget "_widget-topmenu.html" %}