{% set current_sort = request.GET.get('sort', 'created') %} 
    {% set query = request.GET.get('q','') %}

    {% if show_sorts %}
    <div class="gallery-head">
        <h2 class="count">{{ ngettext('{count} Demo', '{count} Demos', paginator.count) | f(count=paginator.count) }}{% if show_submit %} <a class="button positive" href="{{ url('demos.views.submit') }}">Submit a Demo</a>{% endif %}</h2>
      <ul class="sort">
        {% set sort_orders = (
            ( 'upandcoming', _('Sort demos by most recent likes and views'), _('You are viewing demos by most recent likes and views'), _('Up and Coming') ),
            ( 'launches', _('Sort demos by most views'), _('You are viewing demos by most views'), _('Most Viewed') ),
            ( 'likes', _('Sort demos by most likes'), _('You are viewing demos by most likes'), _('Most Liked') ),
            ( 'created', _('Sort demos by most recently submitted'), _('You are viewing demos by most recently submitted'), _('Most Recent') ),
        ) %}
        {% for order in sort_orders %}
            {% set sort_url = pagination_base_url ~ '?sort=' ~ order[0] %}
            {% if query %}
                {% set sort_url = sort_url ~ '&q=' ~ query %}
            {% endif %}
            <li>{% if order[0] == current_sort %}
                <strong title="{{ order[2] }}">{{ order[3] }}</strong>
            {% else %}
                <a href="{{ sort_url }}" title="{{ order[1] }}">{{ order[3] }}</a>
            {% endif %}</li>
        {% endfor %}
      </ul>
    </div>
    {% endif %}

    <ul class="gallery">
        {% if cols_per_row == 4 %}
            {% set extra_class = cycler(' row-first', '', '', '') %}
        {% else %}
            {% set extra_class = cycler(' row-first', '', '') %}
        {% endif %}
        {% for submission in submission_list %}
            {{ submission_thumb(submission, extra_class) }}
        {% else %}
        {% endfor %}
    </ul>
    <script type="text/javascript">
        var els = document.getElementsByTagName('ul');
        for (var i=0,el; el=els[i]; i++) {
            if (el.className == 'gallery') { el.className += ' js'; }
        }
    </script>
    
    <div class="gallery-foot">
        {% if page_obj %}
            <p class="showing">{{_('{start}&ndash;{end} of {total}') | f(start=page_obj.start_index(),end=page_obj.end_index(),total=paginator.count) | safe }}</p>
        {% endif %}
        {% if is_paginated %}
          {% set page_state_url = pagination_base_url ~ '?sort=' ~ current_sort %}
          {% if query %}
              {% set page_state_url = page_state_url ~ '&q=' ~ query %}
          {% endif %}
          <ul class="paging">
            {% if page_obj.number != 1 %}
                <li class="first"><a href="{{ page_state_url }}&page=1" title="{{_('Go to the first page')}}">First</a></li>
            {% endif %}
            {% if page_obj.has_previous() %}
                <li class="prev"><a href="{{ page_state_url }}&page={{ page_obj.previous_page_number() }}" title="{{_('Go to the previous page')}}">{{_('Previous')}}</a></li>
            {% endif %}
            {% if page_obj.has_next() %}
                <li class="next"><a href="{{ page_state_url }}&page={{ page_obj.next_page_number() }}" title="{{_('Go to the next page')}}">{{_('Next')}}</a></li>
            {% endif %}
            {% if page_obj.number != paginator.num_pages %}
                <li class="last"><a href="{{ page_state_url }}&page={{ paginator.num_pages }}" title="{{_('Go to the last page')}}">{{_('Last')}}</a></li>
            {% endif %}
          </ul>
        {% endif %}
        {% if feed_url %}
        <p class="feed"><a href="{{feed_url}}" rel="alternate" title="{{feed_title}}">{{_('Feed')}}</a></p>
        {% endif %}
    </div>