incorporate skeleton layout in the galleries

[mediagoblin.git] / mediagoblin / templates / mediagoblin / utils / object_gallery.html

diff --git a/mediagoblin/templates/mediagoblin/utils/object_gallery.html b/mediagoblin/templates/mediagoblin/utils/object_gallery.html
index 8c88c174ae78c7850c6f6a16f643cc1acdded1b8..1b4a15ed7682548502193872108750b93415d82c 100644 (file)
--- a/mediagoblin/templates/mediagoblin/utils/object_gallery.html
+++ b/mediagoblin/templates/mediagoblin/utils/object_gallery.html
@@ -1,6 +1,6 @@
 {#
 # GNU MediaGoblin -- federated, autonomous media hosting
-# Copyright (C) 2011 Free Software Foundation, Inc
+# Copyright (C) 2011, 2012 MediaGoblin contributors.  See AUTHORS.
 #
 # This program is free software: you can redistribute it and/or modify
 # it under the terms of the GNU Affero General Public License as published by
@@ -16,20 +16,61 @@
 # along with this program.  If not, see <http://www.gnu.org/licenses/>.
 #}
 
-{% block object_gallery_content -%}
-  <div>
-    {% if media_entries %}
-      <ul class="media_thumbnail">
-        {% for entry in media_entries %}
-          <li class="media_thumbnail">
-            <a href="{{ entry.url_for_self(request.urlgen) }}">
-            <img src="{{ request.app.public_store.file_url(
-                  entry['media_files']['thumb']) }}" /></a>
-          </li>
-        {% endfor %}
-      </ul>
-      {% include "mediagoblin/utils/pagination.html" %}
-    {%  endif %}
+{% from "mediagoblin/utils/pagination.html" import render_pagination %}
 
+{% macro media_grid(request, media_entries, col_number=5) %}
+  <div class="thumb_gallery">
+    {% for row in media_entries|batch(col_number) %}
+      <div class="row thumb_row
+                 {%- if loop.first %} thumb_row_first
+                 {%- elif loop.last %} thumb_row_last{% endif %}">
+        {% for entry in row %}
+          {% set entry_url = entry.url_for_self(request.urlgen) %}
+          <div class="three columns media_thumbnail thumb_entry
+                     {%- if loop.first %} thumb_entry_first
+                     {%- elif loop.last %} thumb_entry_last{% endif %}">
+            <a href="{{ entry_url }}">
+              <img src="{{ entry.thumb_url }}" />
+            </a>
+            {% if entry.title %}
+              <a class="thumb_entry_title" href="{{ entry_url }}">{{ entry.title }}</a>
+            {% endif %}
+          </div>
+        {% endfor %}
+      </div>
+    {% endfor %}
   </div>
-{% endblock %}    
+{%- endmacro %}
+
+{#
+  Render a media gallery with pagination.
+
+  Args:
+   - request: Request
+   - media_entries: db cursor of media entries
+   - pagination: Paginator object
+   - pagination_base_url: If you want the pagination to point to a
+     different URL, point it here
+   - col_number: How many columns per row (default 5)
+#}
+{% macro object_gallery(request, media_entries, pagination,
+                        pagination_base_url=None, col_number=5) %}
+  {% if media_entries and media_entries.count() %}
+    {{ media_grid(request, media_entries, col_number=col_number) }}
+    <div class="clear"></div>
+    {% if pagination_base_url %}
+      {# different url, so set that and don't keep the get params #}
+      {{ render_pagination(request, pagination, pagination_base_url, False) }}
+    {% else %}
+      {{ render_pagination(request, pagination) }}
+    {% endif %}
+  {% else %}
+    <p>
+      <i>
+        {%- trans -%}
+          There doesn't seem to be any media here yet...
+        {%- endtrans -%}
+      </i>
+    </p>
+  {% endif %}
+{% endmacro %}