Redesigned forums lists

static/cranefly/css/cranefly.css

@@ -968,10 +968,12 @@ a.btn-link:hover,a.btn-link:active,a.btn-link:focus{opacity:0.9;filter:alpha(opa
 .index-category table .forum-icon{padding-right:2.95px;width:1%;}.index-category table .forum-icon .forum-icon-wrap{background-color:#555555;border:1px solid #3b3b3b;border-radius:3px;padding:3px 4px;}.index-category table .forum-icon .forum-icon-wrap.forum-icon-new{background-color:#cf402e;border:1px solid #a53325;}
 .index-category table .forum-icon .forum-icon-wrap.forum-icon-redirect{background-color:#9466c6;border:1px solid #7a43b6;}
 .index-category table .forum-main h3{float:left;margin:0px;padding:0px;font-size:17.5px;font-weight:normal;line-height:20px;}.index-category table .forum-main h3 a:link,.index-category table .forum-main h3 a:visited{color:#333333;}
-.index-category table .forum-main .forum-details{float:right;margin-top:-1.0999999999999996px;color:#999999;font-size:11.9px;}.index-category table .forum-main .forum-details strong,.index-category table .forum-main .forum-details a{color:#555555;font-weight:normal;}
+.index-category table .forum-main .forum-details{background-color:#f7f7f7;border-bottom:1px solid #f0f0f0;border-radius:3px;float:right;margin:-2px 0px;margin-top:-3.0999999999999996px;padding:2px 8px;width:230px;color:#999999;font-size:11.9px;}.index-category table .forum-main .forum-details strong,.index-category table .forum-main .forum-details a{color:#555555;font-weight:normal;}
 .index-category table .forum-main .forum-details a:hover,.index-category table .forum-main .forum-details a:active{color:#333333;}
 .index-category table .forum-main .forum-details strong.stat-increment{color:#46a546;}
-.index-category table .forum-main .forum-description{clear:both;margin:0px;margin-bottom:-2.0999999999999996px;padding:0px;color:#8c8c8c;font-size:11.9px;}
+.index-category table .forum-main .forum-meta-tooltip .tooltip-inner{max-width:400px;text-align:left;}.index-category table .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats{color:#999999;font-size:10.5px;}.index-category table .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats strong{color:#ffffff;}
+.index-category table .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats span{margin-right:14px;}
+.index-category table .forum-main .forum-meta-tooltip .tooltip-inner .forum-description{clear:both;margin:0px;margin-bottom:7px;padding:0px;color:#eeeeee;font-size:14px;}
 .index-category.index-category-important caption{background-color:#cf402e;border:1px solid #a53325;color:#ffffff;text-shadow:0px 1px 0px #672017;}.index-category.index-category-important caption small{color:#280c09;text-shadow:none;}
 .index-category.index-category-inverse caption{background-color:#333333;border:1px solid #1a1a1a;color:#eeeeee;text-shadow:0px 1px 0px #000000;}.index-category.index-category-inverse caption small{color:#b3b3b3;text-shadow:none;}
 .index-category.index-category-info caption{background-color:#3c85a3;border:1px solid #2e677e;color:#ffffff;text-shadow:0px 1px 0px #1a3946;}.index-category.index-category-info caption small{color:#1a3946;text-shadow:none;}
@@ -1028,10 +1030,12 @@ a.btn-link:hover,a.btn-link:active,a.btn-link:focus{opacity:0.9;filter:alpha(opa
 .category-forums-list table .forum-icon{padding-right:2.95px;width:1%;}.category-forums-list table .forum-icon .forum-icon-wrap{background-color:#555555;border:1px solid #3b3b3b;border-radius:3px;padding:3px 4px;}.category-forums-list table .forum-icon .forum-icon-wrap.forum-icon-new{background-color:#cf402e;border:1px solid #a53325;}
 .category-forums-list table .forum-icon .forum-icon-wrap.forum-icon-redirect{background-color:#9466c6;border:1px solid #7a43b6;}
 .category-forums-list table .forum-main h3{float:left;margin:0px;padding:0px;font-size:17.5px;font-weight:normal;line-height:20px;}.category-forums-list table .forum-main h3 a:link,.category-forums-list table .forum-main h3 a:visited{color:#333333;}
-.category-forums-list table .forum-main .forum-details{float:right;margin-top:-1.0999999999999996px;color:#999999;font-size:11.9px;}.category-forums-list table .forum-main .forum-details strong,.category-forums-list table .forum-main .forum-details a{color:#555555;font-weight:normal;}
+.category-forums-list table .forum-main .forum-details{background-color:#f7f7f7;border-bottom:1px solid #f0f0f0;border-radius:3px;float:right;margin:-2px 0px;margin-top:-3.0999999999999996px;padding:2px 8px;width:230px;color:#999999;font-size:11.9px;}.category-forums-list table .forum-main .forum-details strong,.category-forums-list table .forum-main .forum-details a{color:#555555;font-weight:normal;}
 .category-forums-list table .forum-main .forum-details a:hover,.category-forums-list table .forum-main .forum-details a:active{color:#333333;}
 .category-forums-list table .forum-main .forum-details strong.stat-increment{color:#46a546;}
-.category-forums-list table .forum-main .forum-description{clear:both;margin:0px;margin-bottom:-2.0999999999999996px;padding:0px;color:#8c8c8c;font-size:11.9px;}
+.category-forums-list table .forum-main .forum-meta-tooltip .tooltip-inner{max-width:400px;text-align:left;}.category-forums-list table .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats{color:#999999;font-size:10.5px;}.category-forums-list table .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats strong{color:#ffffff;}
+.category-forums-list table .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats span{margin-right:14px;}
+.category-forums-list table .forum-main .forum-meta-tooltip .tooltip-inner .forum-description{clear:both;margin:0px;margin-bottom:7px;padding:0px;color:#eeeeee;font-size:14px;}
 .category-forums-list.category-forums-important{border:1px solid #902d20;-webkit-box-shadow:0px 0px 0px 3px #cf402e;-moz-box-shadow:0px 0px 0px 3px #cf402e;box-shadow:0px 0px 0px 3px #cf402e;}
 .category-forums-list.category-forums-inverse{border:1px solid #333333;-webkit-box-shadow:0px 0px 0px 3px #555555;-moz-box-shadow:0px 0px 0px 3px #555555;box-shadow:0px 0px 0px 3px #555555;}
 .category-forums-list.category-forums-info{border:1px solid #27576b;-webkit-box-shadow:0px 0px 0px 3px #3c85a3;-moz-box-shadow:0px 0px 0px 3px #3c85a3;box-shadow:0px 0px 0px 3px #3c85a3;}
@@ -1051,10 +1055,12 @@ a.btn-link:hover,a.btn-link:active,a.btn-link:focus{opacity:0.9;filter:alpha(opa
 .forum-subforums-list table .forum-icon{padding-right:2.95px;width:1%;}.forum-subforums-list table .forum-icon .forum-icon-wrap{background-color:#555555;border:1px solid #3b3b3b;border-radius:3px;padding:3px 4px;}.forum-subforums-list table .forum-icon .forum-icon-wrap.forum-icon-new{background-color:#cf402e;border:1px solid #a53325;}
 .forum-subforums-list table .forum-icon .forum-icon-wrap.forum-icon-redirect{background-color:#9466c6;border:1px solid #7a43b6;}
 .forum-subforums-list table .forum-main h3{float:left;margin:0px;padding:0px;font-size:17.5px;font-weight:normal;line-height:20px;}.forum-subforums-list table .forum-main h3 a:link,.forum-subforums-list table .forum-main h3 a:visited{color:#333333;}
-.forum-subforums-list table .forum-main .forum-details{float:right;margin-top:-1.0999999999999996px;color:#999999;font-size:11.9px;}.forum-subforums-list table .forum-main .forum-details strong,.forum-subforums-list table .forum-main .forum-details a{color:#555555;font-weight:normal;}
+.forum-subforums-list table .forum-main .forum-details{background-color:#f7f7f7;border-bottom:1px solid #f0f0f0;border-radius:3px;float:right;margin:-2px 0px;margin-top:-3.0999999999999996px;padding:2px 8px;width:230px;color:#999999;font-size:11.9px;}.forum-subforums-list table .forum-main .forum-details strong,.forum-subforums-list table .forum-main .forum-details a{color:#555555;font-weight:normal;}
 .forum-subforums-list table .forum-main .forum-details a:hover,.forum-subforums-list table .forum-main .forum-details a:active{color:#333333;}
 .forum-subforums-list table .forum-main .forum-details strong.stat-increment{color:#46a546;}
-.forum-subforums-list table .forum-main .forum-description{clear:both;margin:0px;margin-bottom:-2.0999999999999996px;padding:0px;color:#8c8c8c;font-size:11.9px;}
+.forum-subforums-list table .forum-main .forum-meta-tooltip .tooltip-inner{max-width:400px;text-align:left;}.forum-subforums-list table .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats{color:#999999;font-size:10.5px;}.forum-subforums-list table .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats strong{color:#ffffff;}
+.forum-subforums-list table .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats span{margin-right:14px;}
+.forum-subforums-list table .forum-main .forum-meta-tooltip .tooltip-inner .forum-description{clear:both;margin:0px;margin-bottom:7px;padding:0px;color:#eeeeee;font-size:14px;}
 .forum-subforums-list.forum-subforums-important caption{background-color:#cf402e;border:1px solid #a53325;color:#ffffff;text-shadow:0px 1px 0px #672017;}.forum-subforums-list.forum-subforums-important caption small{color:#280c09;text-shadow:none;}
 .forum-subforums-list.forum-subforums-inverse caption{background-color:#333333;border:1px solid #1a1a1a;color:#eeeeee;text-shadow:0px 1px 0px #000000;}.forum-subforums-list.forum-subforums-inverse caption small{color:#b3b3b3;text-shadow:none;}
 .forum-subforums-list.forum-subforums-info caption{background-color:#3c85a3;border:1px solid #2e677e;color:#ffffff;text-shadow:0px 1px 0px #1a3946;}.forum-subforums-list.forum-subforums-info caption small{color:#1a3946;text-shadow:none;}

static/cranefly/css/cranefly/category.less

@@ -59,8 +59,14 @@
       }
 
       .forum-details {
+        background-color: darken(@categoryBackground, 3%);
+        border-bottom: 1px solid darken(@categoryBackground, 6%);
+        border-radius: @baseBorderRadius;
         float: right;
-        margin-top: ((@baseFontSize - @fontSizeSmall) * -1) + 1px;
+        margin: -2px 0px;
+        margin-top: ((@baseFontSize - @fontSizeSmall) * -1) - 1px;
+        padding: 2px 8px;
+        width: 230px;
 
         color: @grayLight;
         font-size: @fontSizeSmall;
@@ -79,14 +85,34 @@
         }
       }
 
-      .forum-description {
-        clear: both;
-        margin: 0px;
-        margin-bottom: (@baseFontSize - @fontSizeSmall) * -1;
-        padding: 0px;
-
-        color: lighten(@textColor, 35%);
-        font-size: @fontSizeSmall;
+      .forum-meta-tooltip {
+        .tooltip-inner {
+          max-width: 400px;
+          text-align: left;
+
+          .forum-stats {
+            color: @grayLight;
+            font-size: @fontSizeMini;
+
+            strong {
+              color: @white;
+            }
+
+            span {
+              margin-right: @baseFontSize;
+            }
+          }
+
+          .forum-description {
+            clear: both;
+            margin: 0px;
+            margin-bottom: @baseFontSize / 2;
+            padding: 0px;
+
+            color: @grayLighter;
+            font-size: @baseFontSize;
+          }
+        }
       }
     }
   }

static/cranefly/css/cranefly/forum.less

@@ -74,8 +74,14 @@
       }
 
       .forum-details {
+        background-color: darken(@categoryBackground, 3%);
+        border-bottom: 1px solid darken(@categoryBackground, 6%);
+        border-radius: @baseBorderRadius;
         float: right;
-        margin-top: ((@baseFontSize - @fontSizeSmall) * -1) + 1px;
+        margin: -2px 0px;
+        margin-top: ((@baseFontSize - @fontSizeSmall) * -1) - 1px;
+        padding: 2px 8px;
+        width: 230px;
 
         color: @grayLight;
         font-size: @fontSizeSmall;
@@ -94,14 +100,34 @@
         }
       }
 
-      .forum-description {
-        clear: both;
-        margin: 0px;
-        margin-bottom: (@baseFontSize - @fontSizeSmall) * -1;
-        padding: 0px;
+      .forum-meta-tooltip {
+        .tooltip-inner {
+          max-width: 400px;
+          text-align: left;
 
-        color: lighten(@textColor, 35%);
-        font-size: @fontSizeSmall;
+          .forum-stats {
+            color: @grayLight;
+            font-size: @fontSizeMini;
+
+            strong {
+              color: @white;
+            }
+
+            span {
+              margin-right: @baseFontSize;
+            }
+          }
+
+          .forum-description {
+            clear: both;
+            margin: 0px;
+            margin-bottom: @baseFontSize / 2;
+            padding: 0px;
+
+            color: @grayLighter;
+            font-size: @baseFontSize;
+          }
+        }
       }
     }
   }

static/cranefly/css/cranefly/index.less

@@ -81,8 +81,14 @@
       }
 
       .forum-details {
+        background-color: darken(@categoryBackground, 3%);
+        border-bottom: 1px solid darken(@categoryBackground, 6%);
+        border-radius: @baseBorderRadius;
         float: right;
-        margin-top: ((@baseFontSize - @fontSizeSmall) * -1) + 1px;
+        margin: -2px 0px;
+        margin-top: ((@baseFontSize - @fontSizeSmall) * -1) - 1px;
+        padding: 2px 8px;
+        width: 230px;
 
         color: @grayLight;
         font-size: @fontSizeSmall;
@@ -101,14 +107,34 @@
         }
       }
 
-      .forum-description {
-        clear: both;
-        margin: 0px;
-        margin-bottom: (@baseFontSize - @fontSizeSmall) * -1;
-        padding: 0px;
-
-        color: lighten(@textColor, 35%);
-        font-size: @fontSizeSmall;
+      .forum-meta-tooltip {
+        .tooltip-inner {
+          max-width: 400px;
+          text-align: left;
+
+          .forum-stats {
+            color: @grayLight;
+            font-size: @fontSizeMini;
+
+            strong {
+              color: @white;
+            }
+
+            span {
+              margin-right: @baseFontSize;
+            }
+          }
+
+          .forum-description {
+            clear: both;
+            margin: 0px;
+            margin-bottom: @baseFontSize / 2;
+            padding: 0px;
+
+            color: @grayLighter;
+            font-size: @baseFontSize;
+          }
+        }
       }
     }
   }

templates/cranefly/category.html

@@ -34,18 +34,32 @@
         {% for forum in category.subforums %}
         <tr>
           <td class="forum-icon"><span class="forum-icon-wrap{% if forum.type == 'redirect' %} forum-icon-redirect{% elif not forum.is_read %} forum-icon-new{% endif %}"><i class="icon-{% if forum.type == 'redirect' %}circle-arrow-right{% else %}comment{% endif %} icon-white"></i></span></td>
-          <td class="forum-main">
-            <h3{% if not forum.is_read %} class="forum-title-new"{% endif %}><a href="{{ forum.type|url(slug=forum.slug, forum=forum.id) }}">{{ forum.name }}</a></h3>
-            {% if forum.show_details %}
+          <td id="forum-{{ forum.id }}" class="forum-main">
+            <h3 class="forum-title{% if not forum.is_read %} forum-title-new{% endif %}"><a href="{{ forum.type|url(slug=forum.slug, forum=forum.id) }}">{{ forum.name }}</a></h3>
+            {% if forum.show_details and forum.type != 'redirect' %}
             <div class="forum-details">
-              {% if forum.type == 'redirect' %}
-              {{ redirect_stats(forum) }}
-              {% else %}
-              {{ forum_stats(forum) }}
-              {% endif %}
+              {% if acl.forums.can_browse(forum) and (acl.threads.can_read_threads(forum) == 2 or (acl.threads.can_read_threads(forum) == 1 and forum.last_poster_id == user.pk)) %}
+              {% if forum.last_thread_id -%}
+              {% trans %}Latest{% endtrans %}: <a href="{% url 'thread_new' thread=forum.last_thread_id, slug=forum.last_thread_slug %}" class="tooltip-top" title="{{ forum.last_thread_name }}">{{ forum.last_thread_name|short_string(28) }}</a>
+              {%- else -%}
+              <em>{% trans %}This forum is empty{% endtrans %}</em>
+              {%- endif %}
+              {%- else -%}
+              <em>{% trans %}This forum is protected{% endtrans %}</em>
+              {%- endif %}
             </div>
             {% endif %}
-            {% if forum.description %}<p class="forum-description">{{ forum.description }}</p>{% endif %}
+            <div class="hide forum-meta">
+              {% if forum.description %}<p class="forum-description">{{ forum.description }}</p>{% endif %}
+              <div class="forum-stats">
+                {% if forum.type != 'redirect' %}
+                <span>{% trans %}Posts{% endtrans %}: <strong>{{ forum.posts|intcomma }}</strong></span>
+                {% trans %}Threads{% endtrans %}: <strong>{{ forum.threads|intcomma }}</strong>
+                {% else %}
+                {% trans %}Clicks{% endtrans %}: <strong>{{ forum.redirects|intcomma }}</strong>
+                {% endif %}
+              </div>
+            </div>
           </td>
         </tr>
         {% endfor %}
@@ -58,35 +72,20 @@
 </div>
 {% endblock %}
 
-
-{% macro forum_stats(forum) -%}
-{% if forum.last_thread_id and not forum.attr('hidethread') -%}
-  {% trans count=forum.posts, posts=fancy_number(forum.posts, forum.posts_delta), thread=forum_thread(forum) -%}
-  {{ posts }} post - last in {{ thread }}
-  {%- pluralize -%}
-  {{ posts }} posts - last in {{ thread }}
-  {%- endtrans %}
-{%- else -%}
-  {% trans count=forum.posts, posts=fancy_number(forum.posts, forum.posts_delta) -%}
-  {{ posts }} post
-  {%- pluralize -%}
-  {{ posts }} posts
-  {%- endtrans %}
-{%- endif %}
-{%- endmacro %}
-
-{% macro forum_thread(forum) -%}
-<a href="{% url 'thread_new' thread=forum.last_thread_id, slug=forum.last_thread_slug %}">{{ forum.last_thread_name }}</a>
-{%- endmacro %}
-
-{% macro redirect_stats(forum) -%}
-{% trans count=forum.redirects, redirects=fancy_number(forum.redirects, forum.redirects_delta) -%}
-{{ redirects }} click
-{%- pluralize -%}
-{{ redirects }} clicks
-{%- endtrans %}
-{%- endmacro %}
-
-{% macro fancy_number(number, delta) -%}
-<strong{% if delta < number %} class="stat-increment"{% endif %}>{{ number|intcomma }}</strong>
-{%- endmacro %}
+{% block javascripts -%}{{ super() }}
+  <script type="text/javascript">
+    $(function () {
+      function populateForumTooltip(target) {
+        return $('#forum-' + target + ' .forum-meta').html();
+      };
+      {% for category in forums_list %}{% for forum in category.subforums %}
+        $('#forum-{{ forum.id }} .forum-title').tooltip({
+          template: '<div class="tooltip forum-meta-tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',
+          placement: 'right',
+          html: true,
+          title: populateForumTooltip({{ forum.id }})
+        });
+      {% endfor %}{% endfor %}
+    });
+  </script>
+{%- endblock %}

templates/cranefly/index.html

@@ -20,18 +20,32 @@
             {% for forum in category.subforums %}
             <tr>
               <td class="forum-icon"><span class="forum-icon-wrap{% if forum.type == 'redirect' %} forum-icon-redirect{% elif not forum.is_read %} forum-icon-new{% endif %}"><i class="icon-{% if forum.type == 'redirect' %}circle-arrow-right{% else %}comment{% endif %} icon-white"></i></span></td>
-              <td class="forum-main">
-                <h3{% if not forum.is_read %} class="forum-title-new"{% endif %}><a href="{{ forum.type|url(slug=forum.slug, forum=forum.id) }}">{{ forum.name }}</a></h3>
-                {% if forum.show_details %}
+              <td id="forum-{{ forum.id }}" class="forum-main">
+                <h3 class="forum-title{% if not forum.is_read %} forum-title-new{% endif %}"><a href="{{ forum.type|url(slug=forum.slug, forum=forum.id) }}">{{ forum.name }}</a></h3>
+                {% if forum.show_details and forum.type != 'redirect' %}
                 <div class="forum-details">
-                  {% if forum.type == 'redirect' %}
-                  {{ redirect_stats(forum) }}
-                  {% else %}
-                  {{ forum_stats(forum) }}
-                  {% endif %}
+                  {% if acl.forums.can_browse(forum) and (acl.threads.can_read_threads(forum) == 2 or (acl.threads.can_read_threads(forum) == 1 and forum.last_poster_id == user.pk)) %}
+                  {% if forum.last_thread_id -%}
+                  {% trans %}Latest{% endtrans %}: <a href="{% url 'thread_new' thread=forum.last_thread_id, slug=forum.last_thread_slug %}" class="tooltip-top" title="{{ forum.last_thread_name }}">{{ forum.last_thread_name|short_string(28) }}</a>
+                  {%- else -%}
+                  <em>{% trans %}This forum is empty{% endtrans %}</em>
+                  {%- endif %}
+                  {%- else -%}
+                  <em>{% trans %}This forum is protected{% endtrans %}</em>
+                  {%- endif %}
                 </div>
                 {% endif %}
-                {% if forum.description %}<p class="forum-description">{{ forum.description }}</p>{% endif %}
+                <div class="hide forum-meta">
+                  {% if forum.description %}<p class="forum-description">{{ forum.description }}</p>{% endif %}
+                  <div class="forum-stats">
+                    {% if forum.type != 'redirect' %}
+                    <span>{% trans %}Posts{% endtrans %}: <strong>{{ forum.posts|intcomma }}</strong></span>
+                    {% trans %}Threads{% endtrans %}: <strong>{{ forum.threads|intcomma }}</strong>
+                    {% else %}
+                    {% trans %}Clicks{% endtrans %}: <strong>{{ forum.redirects|intcomma }}</strong>
+                    {% endif %}
+                  </div>
+                </div>
               </td>
             </tr>
             {% endfor %}
@@ -69,7 +83,7 @@
       <ul class="unstyled">
         {% for thread in popular_threads %}
         <li>
-          <a href="{% url 'thread' thread=thread.pk, slug=thread.slug %}" class="index-popular-thread">{{ thread.name }}</a>
+          <a href="{% url 'thread' thread=thread.pk, slug=thread.slug %}" class="index-popular-thread">{{ thread.name|short_string(38) }}</a>
           <div class="muted"><a href="{% url 'forum' forum=thread.forum_id, slug=thread.forum_slug %}">{{ thread.forum_name }}</a> - {{ thread.last|reltimesince }}</div>
         </li>
         {% endfor %}
@@ -105,35 +119,20 @@
 </div>
 {% endblock %}
 
-
-{% macro forum_stats(forum) -%}
-{% if forum.last_thread_id and not forum.attr('hidethread') -%}
-  {% trans count=forum.posts, posts=fancy_number(forum.posts, forum.posts_delta), thread=forum_thread(forum) -%}
-  {{ posts }} post - last in {{ thread }}
-  {%- pluralize -%}
-  {{ posts }} posts - last in {{ thread }}
-  {%- endtrans %}
-{%- else -%}
-  {% trans count=forum.posts, posts=fancy_number(forum.posts, forum.posts_delta) -%}
-  {{ posts }} post
-  {%- pluralize -%}
-  {{ posts }} posts
-  {%- endtrans %}
-{%- endif %}
-{%- endmacro %}
-
-{% macro forum_thread(forum) -%}
-<a href="{% url 'thread_new' thread=forum.last_thread_id, slug=forum.last_thread_slug %}">{{ forum.last_thread_name }}</a>
-{%- endmacro %}
-
-{% macro redirect_stats(forum) -%}
-{% trans count=forum.redirects, redirects=fancy_number(forum.redirects, forum.redirects_delta) -%}
-{{ redirects }} click
-{%- pluralize -%}
-{{ redirects }} clicks
-{%- endtrans %}
-{%- endmacro %}
-
-{% macro fancy_number(number, delta) -%}
-<strong{% if delta < number %} class="stat-increment"{% endif %}>{{ number|intcomma }}</strong>
-{%- endmacro %}
+{% block javascripts -%}{{ super() }}
+  <script type="text/javascript">
+    $(function () {
+      function populateForumTooltip(target) {
+        return $('#forum-' + target + ' .forum-meta').html();
+      };
+      {% for category in forums_list %}{% for forum in category.subforums %}
+        $('#forum-{{ forum.id }} .forum-title').tooltip({
+          template: '<div class="tooltip forum-meta-tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',
+          placement: 'right',
+          html: true,
+          title: populateForumTooltip({{ forum.id }})
+        });
+      {% endfor %}{% endfor %}
+    });
+  </script>
+{%- endblock %}

templates/cranefly/threads/list.html

@@ -37,19 +37,33 @@
       <tbody>
         {% for subforum in forum.subforums %}
         <tr>
-          <td class="forum-icon"><span class="forum-icon-wrap{% if subforum.type == 'redirect' %} forum-icon-redirect{% elif not subforum.is_read %} forum-icon-new{% endif %}"><i class="icon-{% if subforum.type == 'redirect' %}circle-arrow-right{% else %}comment{% endif %} icon-white"></i></span></td>
-          <td class="forum-main">
-            <h3><a href="{{ subforum.type|url(slug=subforum.slug, forum=subforum.id) }}">{{ subforum.name }}</a></h3>
-            {% if subforum.show_details %}
+          <td class="forum-icon"><span class="forum-icon-wrap{% if forum.type == 'redirect' %} forum-icon-redirect{% elif not forum.is_read %} forum-icon-new{% endif %}"><i class="icon-{% if forum.type == 'redirect' %}circle-arrow-right{% else %}comment{% endif %} icon-white"></i></span></td>
+          <td id="forum-{{ forum.id }}" class="forum-main">
+            <h3 class="forum-title{% if not forum.is_read %} forum-title-new{% endif %}"><a href="{{ forum.type|url(slug=forum.slug, forum=forum.id) }}">{{ forum.name }}</a></h3>
+            {% if forum.show_details and forum.type != 'redirect' %}
             <div class="forum-details">
-              {% if forum.type == 'redirect' %}
-              {{ redirect_stats(forum) }}
-              {% else %}
-              {{ forum_stats(forum) }}
-              {% endif %}
+              {% if acl.forums.can_browse(forum) and (acl.threads.can_read_threads(forum) == 2 or (acl.threads.can_read_threads(forum) == 1 and forum.last_poster_id == user.pk)) %}
+              {% if forum.last_thread_id -%}
+              {% trans %}Latest{% endtrans %}: <a href="{% url 'thread_new' thread=forum.last_thread_id, slug=forum.last_thread_slug %}" class="tooltip-top" title="{{ forum.last_thread_name }}">{{ forum.last_thread_name|short_string(28) }}</a>
+              {%- else -%}
+              <em>{% trans %}This forum is empty{% endtrans %}</em>
+              {%- endif %}
+              {%- else -%}
+              <em>{% trans %}This forum is protected{% endtrans %}</em>
+              {%- endif %}
             </div>
             {% endif %}
-            {% if subforum.description %}<p class="forum-description">{{ subforum.description }}</p>{% endif %}
+            <div class="hide forum-meta">
+              {% if forum.description %}<p class="forum-description">{{ forum.description }}</p>{% endif %}
+              <div class="forum-stats">
+                {% if forum.type != 'redirect' %}
+                <span>{% trans %}Posts{% endtrans %}: <strong>{{ forum.posts|intcomma }}</strong></span>
+                {% trans %}Threads{% endtrans %}: <strong>{{ forum.threads|intcomma }}</strong>
+                {% else %}
+                {% trans %}Clicks{% endtrans %}: <strong>{{ forum.redirects|intcomma }}</strong>
+                {% endif %}
+              </div>
+            </div>
           </td>
         </tr>
         {% endfor %}
@@ -228,11 +242,21 @@
 {% endif %}
 {% endmacro %}
 
-{% block javascripts -%}
-{{ super() }}
-{%- if user.is_authenticated() and list_form %}
+{% block javascripts -%}{{ super() }}
   <script type="text/javascript">
     $(function () {
+      function populateForumTooltip(target) {
+        return $('#forum-' + target + ' .forum-meta').html();
+      };
+      {% for category in forums_list %}{% for forum in category.subforums %}
+        $('#forum-{{ forum.id }} .forum-title').tooltip({
+          template: '<div class="tooltip forum-meta-tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',
+          placement: 'right',
+          html: true,
+          title: populateForumTooltip({{ forum.id }})
+        });
+      {% endfor %}{% endfor %}
+      {%- if user.is_authenticated() and list_form %}
       $('#threads_form').submit(function() {
         if ($('.check-cell[]:checked').length == 0) {
           alert("{% trans %}You have to select at least one thread.{% endtrans %}");
@@ -243,7 +267,7 @@
           return decision;
         }
         return true;
-      });
+      });{% endif %}
     });
-  </script>{% endif %}
+  </script>
 {%- endblock %}