Display improvements on category tree
authorveltr
Thu, 26 Jul 2012 19:03:34 +0200
changeset 212 3e1193c6dce3
parent 211 81fa19c40b1c
child 213 e5b74094b27a
Display improvements on category tree
web/hdalab/static/hdalab/css/cattree.css
web/hdalab/static/hdalab/js/cattree.js
web/hdalab/views/ajax.py
--- a/web/hdalab/static/hdalab/css/cattree.css	Wed Jul 18 15:30:02 2012 +0200
+++ b/web/hdalab/static/hdalab/css/cattree.css	Thu Jul 26 19:03:34 2012 +0200
@@ -63,23 +63,35 @@
     font-weight: normal;
 }
 
-.cattree a.content {
-    color: #000060; text-decoration: none;
+.cattree .content p.title {
+    color: #000060; font-weight: bold; cursor: pointer;
+}
+
+.cattree .img-container {
+    float: left; margin: 4px 0; width: 60px; height: 50px; background: #dddddd;
 }
 
-.cattree li, p {
+.cattree .img-container img {
+    min-width: 30px; max-width: 60px; max-height: 50px; margin: 0px auto;
+}
+
+.cattree .content p.description {
+    margin: 4px 0 4px 64px; font-size: 12px; min-height: 50px;
+}
+
+.cattree li, .cattree p.category, .cattree p.tag {
     margin: 4px 0; font-size: 13px; position: relative;
 }
 
-.cattree p {
+.cattree p.tag, .cattree p.category {
     font-weight: bold; cursor: pointer;
 }
 
-.cattree p:after {
+.cattree p.tag:after, .cattree p.category:after, .cattree .content p.title:after {
     content: " [-]"
 }
 
-.cattree .folded p:after {
+.cattree .folded p.tag:after, .cattree .folded p.category:after, .cattree .content.folded p.title:after {
     content: " [+]"
 }
 
@@ -87,7 +99,7 @@
     list-style: none; position: relative; overflow: hidden; padding: 0; margin: 0;
 }
 
-.cattree .folded ul {
+.cattree .folded ul, .cattree .folded p.description, .cattree .folded .img-container {
      display: none;
 }
 
--- a/web/hdalab/static/hdalab/js/cattree.js	Wed Jul 18 15:30:02 2012 +0200
+++ b/web/hdalab/static/hdalab/js/cattree.js	Thu Jul 26 19:03:34 2012 +0200
@@ -1,6 +1,23 @@
 function render(_data) {
-    var _prefix = '<li><p class="category">{{category}}</p><ul>',
-        _suffix = '{{#tags}}<li><p class="tag">{{label}}</p><ul>{{#contents}}<li><a href="{{url}}" target="_blank" class="content">{{title}}</a></li>{{/contents}}</ul></li>{{/tags}}{{#contents}}<li><a href="{{url}}" target="_blank" class="content">{{title}}</a></li>{{/contents}}</ul></li>',
+    _data.theme_count =
+        (typeof _data.sub_categories == "object" && typeof _data.sub_categories.slice == "function" ? _data.sub_categories.length : 0)
+        + (typeof _data.tags == "object" && typeof _data.tags.slice == "function" ? _data.tags.length : 0);
+    _data.contents_count = (typeof _data.contents == "object" && typeof _data.contents.slice == "function" ? _data.contents.length : 0);
+    _(_data.tags).each(function(_tag) {
+        _(_tag.contents).each(function(_content) {
+            _content.trimmed_description = _content.description.trim().replace(/(\n|\r|\r\n)/mg,' ').replace(/(^.{150,200})[\s].+$/m,'$1&hellip;');
+        });
+    });
+    _(_data.contents).each(function(_content) {
+        _content.trimmed_description = _content.description.trim().replace(/(\n|\r|\r\n)/mg,' ').replace(/(^.{150,200})[\s].+$/m,'$1&hellip;');
+    });
+    var _prefix = '<li><p class="category">{{category}} &mdash; {{theme_count}} thème(s), {{contents_count}} ressource(s)</p><ul>',
+        _contents = '{{#contents}}<li class="content folded" id="content_{{id}}"><p class="title">{{title}}</p><div class="img-container"><img src="http://www.histoiredesarts.culture.fr/images/cached/images/{{hda_id}}.jpg" /></div><p class="description"><a href="{{url}}" target="_blank" class="content">{{trimmed_description}}</a></p></li>{{/contents}}',
+        _suffix = '{{#tags}}<li><p class="tag">{{label}} &mdash; {{contents.length}} ressource(s)</p><ul>'
+            + _contents
+            + '</ul></li>{{/tags}}'
+            + _contents
+            + '</ul></li>',
         _html = Mustache.to_html(_prefix, _data);
     if (typeof _data.sub_categories == "object" && typeof _data.sub_categories.slice == "function") {
         for (var _i = 0; _i < _data.sub_categories.length; _i++) {
@@ -23,8 +40,9 @@
             $(".label-name").html(_label);
             if (_data) {
                 $("#tree").html(render(_data));
-                $(".cattree p").click(function() {
+                $(".cattree p.category, .cattree p.tag, .cattree p.title").click(function() {
                     $(this).parent().toggleClass("folded");
+                    return false;
                 });
                 $(".results").show();
                 $(".content-count").html($(".cattree a.content").length);
--- a/web/hdalab/views/ajax.py	Wed Jul 18 15:30:02 2012 +0200
+++ b/web/hdalab/views/ajax.py	Thu Jul 26 19:03:34 2012 +0200
@@ -132,6 +132,7 @@
     ROOT_MAX_TAG_ORDER = 5
     MAX_TAG_ORDER = 5
     MAX_LEVEL = 3
+    LEVEL_COEFF = 5
     label = request.GET.get('label', None)
     lowerlabel = label.lower()
     globtags = {}
@@ -155,7 +156,7 @@
         for ts in TaggedSheet.objects.select_related('tag','datasheet').filter(datasheet__id=datasheet.id,order__lte=MAX_TAG_ORDER):
             label = ts.tag.label
             if globtags.has_key(label):
-                score = 3 * globtags[label]['level'] - ts.order
+                score = LEVEL_COEFF * globtags[label]['level'] - ts.order
                 if score > maintagscore:
                     maintagscore = score
                     maintag = label
@@ -163,7 +164,14 @@
                 if label.lower() == lowerlabel:
                     rootscore = (ROOT_MAX_TAG_ORDER - ts.order)
         if maintag is not None:
-            globtags[maintag]['access']['contents'].append({'id': datasheet.id, 'title': datasheet.title, 'url': datasheet.url, 'score': (dsscore + rootscore)})
+            globtags[maintag]['access']['contents'].append({
+                'id': datasheet.id,
+                'title': datasheet.title,
+                'url': datasheet.url,
+                'description': datasheet.description,
+                'hda_id': datasheet.hda_id,
+                'score': (dsscore + rootscore)
+            })
     cleantags(resobj)
                     
 #        resobj['contents'] = [{'id': d.id, 'title': d.title, 'tags': [t.label for t in d.tags.filter(taggedsheet__order__lte=5)]} for d in datasheets]