Improve dolphin-emu.org page loading time.

* Point to minified versions of jquery and font-awesome.
* Use {% static %} everywhere to benefit from caching.
* pngcrush our static images.

dolweb/blog/templates/zinnia/tags/search_form.html

@@ -1,5 +1,7 @@
 {% load i18n %}
 {% load url from future %}
+{% load static from staticfiles %}
+
 <form method="get" action="{% url 'zinnia_entry_search' %}" role="search">
     <div class="input-group">
         <input type="text" placeholder="{% trans "Search articles" %}" name="pattern" class="form-control" />
@@ -12,6 +14,6 @@
 </form>
 
 <p class="alert alert-info" style="margin-top: 1em">
-<img src="{{ STATIC_URL }}zinnia/img/help.png" alt="?" class="help" width="14" height="14" />
+<img src="{% static "zinnia/img/help.png" %}" alt="?" class="help" width="14" height="14" />
 {% trans "You can use - to exclude words or phrases, &quot;double quotes&quot; for exact phrases and the AND/OR boolean operators combined with parenthesis for complex queries." %}
 </p>

dolweb/compat/templates/compat-list.html

@@ -4,6 +4,7 @@
 {% load humanize %}
 {% load i18n %}
 {% load l10n %}
+{% load static from staticfiles %}
 
 {% block "metadescr" %}{% trans "The Dolphin Emulator compatibility list contains all the games we tested, sorted by how well they work on the emulator." %}{% endblock %}
 
@@ -22,11 +23,11 @@
         <h3>{% trans "How to read the ratings" %}</h3>
 
         <ul>
-            <li><img src="{{ STATIC_URL }}img/stars/5.png" alt="{% trans "5 out of 5" %}"> {% trans "<strong>Perfect</strong>: No issues at all!" %}</li>
-            <li><img src="{{ STATIC_URL }}img/stars/4.png" alt="{% trans "4 out of 5" %}"> {% trans "<strong>Playable</strong>: Runs well, only minor graphical or audio glitches. Games can be played all the way through." %}</li>
-            <li><img src="{{ STATIC_URL }}img/stars/3.png" alt="{% trans "3 out of 5" %}"> {% trans "<strong>Starts</strong>: Starts, maybe even plays well, but crashes or major graphical/audio glitches." %}</li>
-            <li><img src="{{ STATIC_URL }}img/stars/2.png" alt="{% trans "2 out of 5" %}"> {% trans "<strong>Intro/Menu</strong>: Hangs/crashes somewhere between booting and starting." %}</li>
-            <li><img src="{{ STATIC_URL }}img/stars/1.png" alt="{% trans "1 out of 5" %}"> {% trans "<strong>Broken</strong>: Crashes when booting." %}</li>
+            <li><img src="{% static "img/stars/5.png" %}" alt="{% trans "5 out of 5" %}"> {% trans "<strong>Perfect</strong>: No issues at all!" %}</li>
+            <li><img src="{% static "img/stars/4.png" %}" alt="{% trans "4 out of 5" %}"> {% trans "<strong>Playable</strong>: Runs well, only minor graphical or audio glitches. Games can be played all the way through." %}</li>
+            <li><img src="{% static "img/stars/3.png" %}" alt="{% trans "3 out of 5" %}"> {% trans "<strong>Starts</strong>: Starts, maybe even plays well, but crashes or major graphical/audio glitches." %}</li>
+            <li><img src="{% static "img/stars/2.png" %}" alt="{% trans "2 out of 5" %}"> {% trans "<strong>Intro/Menu</strong>: Hangs/crashes somewhere between booting and starting." %}</li>
+            <li><img src="{% static "img/stars/1.png" %}" alt="{% trans "1 out of 5" %}"> {% trans "<strong>Broken</strong>: Crashes when booting." %}</li>
         </ul>
         </div>
     </div>
@@ -62,10 +63,10 @@
     <tbody>
         {% for game, cat, ts, hash in games %}
         <tr>
-            <td class="category"><img src="{{ STATIC_URL }}img/platforms/{{ cat }}.png" width="32" height="32" alt="{{ cat|capfirst }}" title="{{ cat|capfirst }}"></td>
+            <td class="category"><img src="{% platform_img_url cat %}" width="32" height="32" alt="{{ cat|capfirst }}" title="{{ cat|capfirst }}"></td>
             <td class="banner"><div class="bnr bnr-{{ hash }}"></div></td>
             <td class="title always-ltr"><a href="{{ game.wiki_url }}">{{ game.title }}</a></td>
-            <td class="rating"><img src="{{ STATIC_URL }}img/stars/{{ game.latest.text.data }}.png" alt="{{ game.latest.text.data|compat_text }}" title="{{ game.latest.text.data|compat_text }}"></td>
+            <td class="rating"><img src="{% compat_img_url game.latest.text.data|compat_text %}" alt="{{ game.latest.text.data|compat_text }}" title="{{ game.latest.text.data|compat_text }}"></td>
             <td class="update">{{ ts|naturaltime }}</td>
         </tr>
         {% endfor %}

dolweb/compat/templatetags/compat.py

@@ -1,5 +1,6 @@
 from django import template
 from django.conf import settings
+from django.contrib.staticfiles.storage import staticfiles_storage
 from django.utils.translation import ugettext_lazy as _
 from dolweb.compat.models import get_rating_count, get_rated_games
 
@@ -41,3 +42,11 @@ def rating_class(compat):
         4: 'success',
         5: 'info',
     }[int(compat)]
+
+@register.simple_tag
+def platform_img_url(platform):
+    return staticfiles_storage.url('img/platforms/%s.png' % platform)
+
+@register.simple_tag
+def compat_img_url(compat):
+    return staticfiles_storage.url('img/stars/%s.png' % compat)

dolweb/docs/templates/docs-guide.html

@@ -1,10 +1,11 @@
 {% extends "_base.html" %}
 
 {% load i18n %}
+{% load static from staticfiles %}
 
 {% block "title" %}{{ title }}{% endblock %}
 {% block "extracss" %}
-<link href="{{ STATIC_URL }}css/wiki.css" rel="stylesheet">
+<link href="{% static "css/wiki.css" %}" rel="stylesheet">
 {% endblock %}
 
 {% block "body" %}

dolweb/templates/_base.html

@@ -22,7 +22,7 @@
 
         <link rel="alternate" type="application/rss+xml" title="{% trans "Latest blog articles" %}" href="{% url zinnia_entry_latest_feed %}" />
 
-        <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
+        <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css" rel="stylesheet">
         <link href="{% static "css/bootstrap.min.css" %}" rel="stylesheet">
         <link href="{% static "css/bootstrap-theme.min.css" %}" rel="stylesheet">
         <link href="{% static "css/dolphin.css" %}" rel="stylesheet">
@@ -114,7 +114,7 @@
         </p>
         </footer>
 
-        <script src="//code.jquery.com/jquery.js"></script>
+        <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
         <script src="{% static "js/bootstrap.min.js" %}"></script>
         {% block "extrajs" %}
         {% endblock %}