Merge remote branch 'origin/features' into dev

2012-03-07 16:52:20 -04:00 · 2012-03-07 16:52:20 -04:00 · d81c2a9fed
--- a/apps/mozorg/helpers.py
+++ b/apps/mozorg/helpers.py
@ -10,6 +10,7 @@ of terms and example values for them:
 """

 from os import path
+import re

 import jinja2
 import jingo
@ -211,3 +212,23 @@ def field_with_attrs(bfield, **kwargs):
    fields from django forms"""
    bfield.field.widget.attrs.update(kwargs)
    return bfield
+
+@jingo.register.function
+def platform_img(url, **kwargs):
+    attrs = ' '.join(('%s="%s"' % (attr, val)
+                      for attr, val in kwargs.items()))
+    url = path.join(settings.MEDIA_URL, url.lstrip('/'))
+    (root, ext) = path.splitext(url)
+
+    def url(plat):
+        return '%s%s%s' % (root,
+                           {'win': '',
+                            'osx': '-mac',
+                            'linux': '-linux'}[plat],
+                           ext)
+
+    imgs = ('<img class="platform-img %s" src="%s" %s>'
+            % (plat, url(plat), attrs)
+            for plat in ('win', 'osx', 'linux'))
+
+    return jinja2.Markup(''.join(imgs))
--- a/apps/mozorg/templates/mozorg/firefox/customize.html
+++ b/apps/mozorg/templates/mozorg/firefox/customize.html
@ -122,8 +122,7 @@
    <p>Plugins are small bits of third-party software built by companies like Adobe Systems or Apple to power videos, animation and games (examples include Flash Player or Quicktime). They can cause browser crashes or pose security risks when they get out of date, so we’ve built an easy tool to help you stay current. <a href="/en-US/plugincheck/">Check your plugins.</a></p>
  </div>
  <div class="span7">
-     <!-- TODO: platformImage -->
-     <img src="{{ media('img/firefox/customize/make-it-work.png') }}" alt="Make It Work: Plugins" />
+     {{ platform_img('img/firefox/customize/make-it-work.png', alt='Make It Work: Plugins') }}
  </div>
 </div>
 </section>
--- a/media/css/sandstone/sandstone.less
+++ b/media/css/sandstone/sandstone.less
@ -657,3 +657,21 @@ px      68    160    252    344    436    */
 }

 /* }}} */
+
+
+
+/* {{{ Firefox site functionality 
+       This can be put into its own CSS file if needed. */
+
+.platform-img {
+    display: none;
+}
+
+.osx img.osx,
+.mac img.osx,
+.linux img.linux,
+.win img.win {
+    display: inline;
+}
+
+/* }}} */
--- a/media/js/site.js
+++ b/media/js/site.js
@ -0,0 +1,36 @@
+
+(function() {
+    var site = {
+        platform: 'windows'
+    };
+
+    if(navigator.platform.indexOf("Win32") != -1 ||
+       navigator.platform.indexOf("Win64") != -1) {
+        site.platform = 'windows';
+    }
+    else if(navigator.platform.indexOf("Linux") != -1) {
+        site.platform = 'linux';
+    }
+    else if (navigator.userAgent.indexOf("Mac OS X") != -1) {
+        site.platform = 'osx';
+    }
+    else if (navigator.userAgent.indexOf("MSIE 5.2") != -1) {
+        site.platform = 'osx';
+    }
+    else if (navigator.platform.indexOf("Mac") != -1) {
+        site.platform = 'mac';
+    }
+    else {
+        site.platform = 'other';
+    }
+
+    function init() {
+        var b = $(document.body);
+        // Remove the default platform
+        b.removeClass('win');
+        b.addClass(site.platform);
+    }
+
+    $(document).ready(init);
+    window.site = site;
+})();
--- a/settings/base.py
+++ b/settings/base.py
@ -110,9 +110,11 @@ MINIFY_BUNDLES = {
        ),
        'common': (
            'js/libs/jquery-1.7.1.min.js',
+            'js/site.js',
        ),
        'firefox': (
            'js/libs/jquery-1.7.1.min.js',
+            'js/site.js',
            'js/nav-main.js',
        ),
        'firefox-customize': (
--- a/templates/base.html
+++ b/templates/base.html
@ -23,7 +23,9 @@
    <link rel="shortcut icon" type="image/png" href="{{ MEDIA_URL }}img/favicon.png">
  </head>

-  <body id="{% block body_id %}{% endblock %}" class="html-{{ DIR }} {% block body_class %}{% endblock %}">
+  <!-- Note the "win" class, without javascript platform-specific
+       assets default to windows -->
+  <body id="{% block body_id %}{% endblock %}" class="html-{{ DIR }} win {% block body_class %}{% endblock %}">
    <div id="outer-wrapper">
    <div id="wrapper">