activity: Put the three tables into Bootstrap tabs

(imported from commit 508c4b15a82df969b08b430ad892c4b13ed68092)

templates/zephyr/activity.html

@@ -4,8 +4,19 @@
 
 {% block content %}
 
+<ul class="nav nav-tabs">
+{% for name, activity in data.iteritems %}
+    <li {% if activity.default_tab %} class="active" {% endif %}>
+        <a href="#{{ name }}" data-toggle="tab">{{ name }}</a>
+    </li>
+{% endfor %}
+</ul>
+
+<div class="tab-content">
+
 {% for name, activity in data.iteritems %}
 
+    <div class="tab-pane {% if activity.default_tab %} active {% endif %}" id="{{ name }}">
     <h2>{{ name }} usage</h2>
     <table class="table sortable table-striped table-bordered">
     <thead class="activity_head">
@@ -35,9 +46,12 @@
     {% endfor %}
     </tbody>
     </table>
+    </div>
 
 {% endfor %}
 
+</div>
+
 <script type="text/javascript" src="/static/third/sorttable/sorttable.js"></script>
 <link href='{{ static_hidden }}styles/activity.css?dummy_time={% now "U" %}' rel='stylesheet'>
 

zephyr/views.py

@@ -969,7 +969,8 @@ def json_fetch_api_key(request, user_profile, password=POST):
     return json_success({"api_key": user_profile.api_key})
 
 class ActivityTable(object):
-    def __init__(self, client_name, queries):
+    def __init__(self, client_name, queries, default_tab=False):
+        self.default_tab = default_tab
         self.has_pointer = False
         self.rows = {}
         for url, query_name in queries:
@@ -1014,7 +1015,7 @@ def get_activity(request):
 
     return render_to_response('zephyr/activity.html',
         { 'data': {
-            'Website': ActivityTable('website',       web_queries),
+            'Website': ActivityTable('website',       web_queries, default_tab=True),
             'Mirror':  ActivityTable('zephyr_mirror', api_queries),
             'API':     ActivityTable('API',           api_queries)
         }}, context_instance=RequestContext(request))