branding: Common cross app branding setting related to web fonts urls

Introduce BRANDING_FONTS_CSS_URLS setting to support loading of webfont
related css files from custom locations. By default fonts are loaded
from Google CDN servers. An essential utility setting for intranet
Synnefo deployments.

The `undocumented` setting UI_FONTS_BASE_URL is deprecated and no longer
used.

snf-astakos-app/astakos/im/static/im/cloudbar/cloudbar.js

@@ -27,11 +27,16 @@ $(document).ready(function(){
     css.attr({rel:'stylesheet', type:'text/css', href:cssloc + 'cloudbar.css'});
     $("head").append(css);
 
-    // load fonts
-    var font_url = 'https://fonts.googleapis.com/css?family=Open+Sans:400,600,700&subset=latin,greek-ext,greek';
-    var css_font = $("<link />");
-    css_font.attr({rel:'stylesheet', type:'text/css', href:font_url});
-    $("head").append(css_font);
+    // load extra css
+    var extra_css = window.CLOUDBAR_EXTRA_CSS || [];
+    var css_tag = undefined;
+    var css_uri = undefined;
+    for (var i=0; i<extra_css.length; i++) {
+        css_uri = extra_css[i];
+        css_tag = $("<link />");
+        css_tag.attr({rel:'stylesheet', type:'text/css', href: css_uri});
+        $("head").append(css_tag);
+    }
 
     // load service specific css
     var SKIP_ADDITIONAL_CSS = window.SKIP_ADDITIONAL_CSS == undefined ? false : window.SKIP_ADDITIONAL_CSS;

snf-astakos-app/astakos/im/templates/im/base.html

@@ -27,8 +27,10 @@
   {% endblock page.favicons %}
 
   {% block page.css %}
-
-      <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,600,700&subset=latin,greek-ext,greek' rel='stylesheet' type='text/css'>
+
+      {% for url in BRANDING_FONTS_CSS_URLS %}
+        <link href="{{ url }}" rel="stylesheet" type="text/css" >
+      {% endfor %}
       <link rel="stylesheet" type="text/css" href="{{ IM_STATIC_URL }}css/global.css">
       <link rel="stylesheet" type="text/css" href="{{ IM_STATIC_URL }}css/print.css" media="print">
       <!--[if lte IE 7]>
@@ -78,6 +80,7 @@
 
     {% if CLOUDBAR_ACTIVE %}
         {{ CLOUDBAR_CODE }}
+        <script>window.CLOUDBAR_INCLUDE_FONTS = false;</script>
     {% endif %}
 </head>
 

snf-branding/synnefo_branding/settings.py

@@ -53,3 +53,9 @@
 # Footer message appears above Copyright message at the Compute templates
 # and the Dashboard UI. Accepts html tags
 FOOTER_EXTRA_MESSAGE = getattr(settings, 'BRANDING_FOOTER_EXTRA_MESSAGE', '')
+
+# The location of the css files that contain the font loading css code
+FONTS_CSS_URLS = getattr(settings, 'BRANDING_FONTS_CSS_URLS', [
+    '//fonts.googleapis.com/css?family=Open+Sans&subset=latin,greek-ext,greek',
+    '//fonts.googleapis.com/css?family=Ubuntu&subset=latin,greek'
+])

snf-cyclades-app/synnefo/ui/templates/home.html

@@ -8,12 +8,10 @@
     <!--<meta http-equiv="X-UA-Compatible" content="IE=7">-->
     <meta http-equiv="content-type" content="text/html; charset=UTF-8">
 
-    {% if SYNNEFO_FONTS_BASE_URL %}
-    <link href="{{ SYNNEFO_FONTS_BASE_URL }}css?family=Ubuntu&subset=latin,greek" 
-          rel="stylesheet" type="text/css" >
-    <link href='{{ SYNNEFO_FONTS_BASE_URL }}css?family=Open+Sans&subset=latin,greek' 
-          rel='stylesheet' type='text/css'>
-    {% endif %}
+
+    {% for url in BRANDING_FONTS_CSS_URLS %}
+        <link href="{{ url }}" rel="stylesheet" type="text/css" >
+    {% endfor %}
 
     <link rel="shortcut icon" href="{{ BRANDING_FAVICON_URL }}" />
 
@@ -110,8 +108,10 @@
         });
         if (!tmp_auth_client.get_token()) { tmp_auth_client.redirect_to_login(); }
     </script>
+
     {{ CLOUDBAR_CODE }}
-
+    <script>window.CLOUDBAR_INCLUDE_FONTS = false;</script>
+
     <script>
         // empty object for console to avoid errors in browsers that don't support it
         if (!window.console) {window.console = {}; window.console.log = window.console.info = window.console.debug =

snf-cyclades-app/synnefo/ui/views.py

@@ -106,9 +106,6 @@
             "UI_SYNNEFO_JS_LIB_URL", UI_SYNNEFO_JS_URL + "lib/")
 UI_SYNNEFO_JS_WEB_URL = \
     getattr(settings, "UI_SYNNEFO_JS_WEB_URL", UI_SYNNEFO_JS_URL + "ui/web/")
-UI_SYNNEFO_FONTS_BASE_URL = \
-    getattr(settings,
-            "UI_FONTS_BASE_URL", "//fonts.googleapis.com/")
 
 # extensions
 ENABLE_GLANCE = getattr(settings, 'UI_ENABLE_GLANCE', True)
@@ -162,7 +159,6 @@ def template(name, request, context):
         'UI_MEDIA_URL': UI_MEDIA_URL,
         'SYNNEFO_JS_URL': UI_SYNNEFO_JS_URL,
         'SYNNEFO_JS_LIB_URL': UI_SYNNEFO_JS_LIB_URL,
-        'SYNNEFO_FONTS_BASE_URL': UI_SYNNEFO_FONTS_BASE_URL,
         'SYNNEFO_JS_WEB_URL': UI_SYNNEFO_JS_WEB_URL,
         'SYNNEFO_IMAGES_URL': UI_SYNNEFO_IMAGES_URL,
         'SYNNEFO_CSS_URL': UI_SYNNEFO_CSS_URL,

snf-webproject/synnefo/webproject/context_processors.py

@@ -1,6 +1,10 @@
+import json
+
 from django.utils.safestring import mark_safe
 from django.conf import settings
 
+from synnefo_branding import settings as branding_settings
+
 
 def cloudbar(request):
     """
@@ -30,6 +34,8 @@ def cloudbar(request):
 
     """
 
+    BRANDING_CSS = getattr(branding_settings, 'FONTS_CSS_URLS', [])
+
     CB_ACTIVE = getattr(settings, 'CLOUDBAR_ACTIVE', True)
     CB_LOCATION = getattr(settings, 'CLOUDBAR_LOCATION')
     CB_COOKIE_NAME = getattr(settings, 'CLOUDBAR_COOKIE_NAME',
@@ -49,6 +55,8 @@ def cloudbar(request):
         var GET_MENU_URL = "%(menu_url)s";
         var CLOUDBAR_HEIGHT = '%(height)s';
 
+        var CLOUDBAR_EXTRA_CSS = %(branding_css)s;
+
         $(document).ready(function(){
             $.getScript(CLOUDBAR_LOCATION + 'cloudbar.js');
         });
@@ -67,7 +75,8 @@ def cloudbar(request):
        'services_url': CB_SERVICES_URL,
        'menu_url': CB_MENU_URL,
        'height': str(CB_HEIGHT),
-       'bg_color': CB_BGCOLOR}
+       'bg_color': CB_BGCOLOR,
+       'branding_css': json.dumps(BRANDING_CSS)}
 
     CB_CODE = mark_safe(CB_CODE)