From: Aleksander Łukasz <aleksander.lukasz@nowoczesnapolska.org.pl>
Date: Fri, 26 Apr 2013 09:17:49 +0000 (+0200)
Subject: Filtering UI
X-Git-Url: https://git.mdrn.pl/prawokultury.git/commitdiff_plain/49ccbd7b8491b408a08d17151ea852d783ff901d?ds=sidebyside

Filtering UI
---

diff --git a/prawokultury/settings.d/50-static.py b/prawokultury/settings.d/50-static.py
index 1149c7e..0346e85 100644
--- a/prawokultury/settings.d/50-static.py
+++ b/prawokultury/settings.d/50-static.py
@@ -32,6 +32,12 @@ PIPELINE_CSS = {
         ),
         'output_filename': 'compressed/base.css',
     },
+    'questions': {
+        'source_filenames': (
+            'questions/tagcloud.scss',
+        ),
+        'output_filename': 'compressed/questions.css'
+    }
 }
 PIPELINE_JS = {
     'base': {
@@ -42,6 +48,12 @@ PIPELINE_JS = {
         ),
         'output_filename': 'compressed/base.js',
     },
+    'questions': {
+        'source_filenames': (
+            'questions/tagcloud.js',
+        ),
+        'output_filename': 'compressed/questions.js'
+    }
 }
 
 PIPELINE_COMPILERS = (
diff --git a/prawokultury/templates/base.html b/prawokultury/templates/base.html
index 5ecc92d..c622f91 100755
--- a/prawokultury/templates/base.html
+++ b/prawokultury/templates/base.html
@@ -8,7 +8,7 @@
        <title>{% block "titleextra" %}{% endblock %}{% trans "Right to Culture" %}</title>
        <link rel="shortcut icon" type="image/png" href="{% static "img/favicon.png" %}" />
         {% compressed_css 'base' %}
-
+        {% block "extra_css" %}{% endblock %}
         <meta charset="UTF-8" />
         <meta property='og:url' content='{% block "ogurl" %}{{ request.get_full_path|build_absolute_uri:request }}{% endblock %}' />
         <meta property='og:title' content='{% block "ogtitle" %}{% trans "Right to Culture" %}{% endblock %}' />
@@ -119,5 +119,6 @@
     <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js" charset="utf-8"></script>
     {% compressed_js 'base' %}
     {{ piwik_tag|safe }}
+    {% block "extra_js" %}{% endblock %}
     </body>
 </html>
diff --git a/questions/static/questions/tagcloud.js b/questions/static/questions/tagcloud.js
new file mode 100644
index 0000000..992d573
--- /dev/null
+++ b/questions/static/questions/tagcloud.js
@@ -0,0 +1,21 @@
+$(function() {
+    var showTagsGroup = function(category_id) {
+        $('.questions-tags-group').hide();
+        $('.questions-tags-group[data-category-id=' + category_id +']').show();
+    }
+    $('#questions-categories a').click(function(e) {
+        e.preventDefault();
+        var target = $(e.target);
+        if(target.hasClass('selected'))
+            return;
+        var category_id = target.attr('data-category-id');
+        $('#questions-categories a').removeClass('selected');
+        target.addClass('selected');
+        showTagsGroup(category_id);
+    });
+    var selected = $('#questions-categories a.selected');
+    if(selected) {
+        var category_id = selected.attr('data-category-id');
+        showTagsGroup(category_id);
+    }
+});
\ No newline at end of file
diff --git a/questions/static/questions/tagcloud.scss b/questions/static/questions/tagcloud.scss
new file mode 100644
index 0000000..a10382d
--- /dev/null
+++ b/questions/static/questions/tagcloud.scss
@@ -0,0 +1,12 @@
+#questions-categories {
+    margin-bottom:10px;
+    a.selected {
+        cursor: default;
+        text-decoration: none;
+        color: black;
+    }
+}
+
+.questions-tags-group {
+    display: none;
+}
\ No newline at end of file
diff --git a/questions/templates/questions/question_list.html b/questions/templates/questions/question_list.html
index b6cea5a..b24b444 100755
--- a/questions/templates/questions/question_list.html
+++ b/questions/templates/questions/question_list.html
@@ -1,6 +1,7 @@
 {% extends "base.html" %}
 {% load url from future %}
 {% load pagination_tags fnp_prevnext %}
+{% load compressed %}
 
 {% block "titleextra" %}Pierwsza pomoc w prawie autorskim :: {% endblock %}
 {% block "body" %}
@@ -27,23 +28,29 @@ autorem szeregu publikacji naukowych poświęconych korzystaniu z
 technologii informacyjno-komunikacyjnych oraz posiada wieloletnie
 doświadczenie doradcze w tej tematyce.</p>
 
-Kategorie:
-<div>
-{% for category in tag_categories %}
-        <span style="font-size: {{category.factor}}em;">{{category}}</span>
-{% endfor %}
-</div>
+<div id="questions-filter">
 
-Tematy: 
-{% if tag %}<a href=".">wszystkie</a>
-{% else %}<strong>wszystkie</strong>
-{% endif %}
+    {% if tag %}<a href=".">Wyświetl wszystkie</a> lub w {% else %}W{% endif %}ybierz kategorię tematów:
+    <div id="questions-categories">
+    <a href="#" data-category-id="0">bez kategorii</a>
+    {% for category in tag_categories %} /
+            <a href="#" style="font-size: {{category.factor}}em;" {% if tag.category == category %}class="selected"{% endif %} data-category-id="{{category.id}}">{{category}}</a>
+    {% endfor %}
+    </div>
 
-{% for atag in tags %} /
-    {% if atag == tag %}<strong>{{ atag }}</strong>
-    {% else %}<a href="?tag={{ atag.slug }}">{{ atag }}</a>
-    {% endif %}
-{% endfor %}
+    <div id="questions-subjects">
+    {% for category_id, tag_list in tag_lists.items %}
+        <div class="questions-tags-group" data-category-id="{{category_id}}">
+        Wyświetl tylko na temat:
+        {% for atag in tag_list %} {% if not forloop.first %}/{% endif %}
+            {% if atag == tag %}<strong>{{ atag }}</strong>
+            {% else %}<a href="?tag={{ atag.slug }}">{{ atag }}</a>
+            {% endif %}
+        {% endfor %}
+        </div>
+    {% endfor %}
+    </div>
+</div>
 
 <h2>Odpowiedzi na już zadane pytania
     {% if tag %}na temat: {{ tag }}{% endif %}
@@ -64,3 +71,11 @@ Tematy:
 
 
 {% endblock %}
+
+{% block "extra_css" %}
+    {% compressed_css 'questions' %}
+{% endblock %}
+
+{% block "extra_js" %}
+    {% compressed_js 'questions' %}
+{% endblock %}
\ No newline at end of file
diff --git a/questions/views.py b/questions/views.py
index d493dd9..9b4b035 100644
--- a/questions/views.py
+++ b/questions/views.py
@@ -42,20 +42,21 @@ class QuestionListView(ListView):
 
     def get_context_data(self, *args, **kwargs):
         context = super(QuestionListView, self).get_context_data(*args, **kwargs)
-        context['tags'] = Tag.objects.filter(items__question__published=True
-            ).annotate(c=models.Count('items__tag')).order_by('-c', 'slug')
         context['tag'] = self.tag
         context['tag_categories'] = TagCategory.objects.all().annotate(click_count = models.Sum('tags__click_count'))
+        context['tag_lists'] = dict()
         
-        # Calculating factors for category and tag clouds
+        tags = Tag.objects.filter(items__question__published=True
+            ).annotate(c=models.Count('items__tag')).order_by('category__slug', '-c', 'slug')
         all_tag_clicks_count = Tag.objects.all().aggregate(models.Sum('click_count'))['click_count__sum']
         annotated_categories = dict()
         minimum_factor = 0.7
         for category in context['tag_categories']:
             annotated_categories[category.id] = category
             category.factor =  '%.2f' % (minimum_factor + (float(category.click_count) / all_tag_clicks_count))
-        for tag in [t for t in context['tags'] if t.category]:
-            category = annotated_categories[tag.category.id]
-            tag.factor = '%.2f' % (minimum_factor + ((float(tag.click_count) / category.click_count) if category.click_count else 0))
-        
+        for tag in tags:
+            if tag.category:
+                category = annotated_categories[tag.category.id]
+                tag.factor = '%.2f' % (minimum_factor + ((float(tag.click_count) / category.click_count) if category.click_count else 0))
+            context['tag_lists'].setdefault(tag.category.id if tag.category else 0, []).append(tag)
         return context