JS: improve category menu management

3 files changed, 21 insertions, 7 deletions

diff --git a/chimere/static/chimere/css/styles.css b/chimere/static/chimere/css/styles.css
index 43dc3c6..bfdf36e 100644
--- a/chimere/static/chimere/css/styles.css
+++ b/chimere/static/chimere/css/styles.css
@@ -658,6 +658,11 @@ ul.subcategories label img{
     height:20px;
 }
 
+li.main_category > span:hover,
+li.main_category label:hover{
+    cursor:pointer;
+}
+
 #categories li#display_submited{
     font-variant:normal;
 }
diff --git a/chimere/static/chimere/js/jquery.chimere.js b/chimere/static/chimere/js/jquery.chimere.js
index 31b0e0f..381f8bb 100644
--- a/chimere/static/chimere/js/jquery.chimere.js
+++ b/chimere/static/chimere/js/jquery.chimere.js
@@ -577,7 +577,7 @@ OpenLayers.Layer.MapQuestOSM = OpenLayers.Class(OpenLayers.Layer.XYZ, {
             }
             var _toggle_categories = function (subcategory_element) {
                 var parent = subcategory_element.closest('ul');
-                var parent_label = parent.parent().find("> span > label");
+                var parent_label = parent.parent().find("> span");
                 if (parent.find('input[type=checkbox]:checked').length){
                     parent_label.addClass('category-selected');
                 } else {
@@ -638,8 +638,9 @@ OpenLayers.Layer.MapQuestOSM = OpenLayers.Class(OpenLayers.Layer.XYZ, {
                     var id = this.id.substr(this.id.lastIndexOf("_")+1);
                     helpers.zoom_to_subcategories([id]);
                 });
-                $(".toggle_category").bind("click", function (e) {
-                    var id = this.id.substr(this.id.lastIndexOf("_")+1);
+                $(".toggle_category").parent().bind("click", function (e) {
+                    var item = $(this).children('.toggle_category');
+                    var id = item.attr('id').substr(item.attr('id').lastIndexOf("_")+1);
                     methods.toggle_category(id);
                 });
             }
@@ -1218,24 +1219,32 @@ OpenLayers.Layer.MapQuestOSM = OpenLayers.Class(OpenLayers.Layer.XYZ, {
             // Check if element is currently visible or not
             var was_visible = $("#maincategory_" + id).is(":visible");
             // Close all categories
+            var category_plus = STATIC_URL + "chimere/img/plus.png";
+            var category_minus = STATIC_URL + "chimere/img/minus.png";
             if (settings.category_accordion){
                 $("#categories ul.subcategories").hide();
-                $("#categories img.toggle_category").attr("src", STATIC_URL + "chimere/img/plus.png");
+                $("#categories img.toggle_category").attr("src", category_plus);
+                $("#categories .main_category").addClass("toggle_plus");
+                $("#categories .main_category").removeClass("toggle_minus");
             }
             // Put a minus image
             if (!was_visible)
             {
                 // Show the subcategories
                 $("#maincategory_" + id).toggle();
+                $("#maincategory_" + id).parent().addClass("toggle_minus");
+                $("#maincategory_" + id).parent().removeClass("toggle_plus");
                 // Put a plus image
-                $("#maincategory_img_" + id).attr("src", STATIC_URL + "chimere/img/minus.png");
+                $("#maincategory_img_" + id).attr("src", category_minus);
                 settings.current_category = id;
             }
             if (!settings.category_accordion && was_visible)
             {
                 $("#maincategory_" + id).toggle();
+                $("#maincategory_" + id).parent().addClass("toggle_plus");
+                $("#maincategory_" + id).parent().removeClass("toggle_minus");
                 // Put a minus image
-                $("#maincategory_img_" + id).attr("src", STATIC_URL + "chimere/img/plus.png");
+                $("#maincategory_img_" + id).attr("src", category_plus);
             }
         },
         zoomToCurrentExtent: function(){
diff --git a/chimere/templates/chimere/blocks/categories.html b/chimere/templates/chimere/blocks/categories.html
index 9c5ffd6..490b453 100644
--- a/chimere/templates/chimere/blocks/categories.html
+++ b/chimere/templates/chimere/blocks/categories.html
@@ -1,7 +1,7 @@
 {% load i18n %}
     <ul id='ul_categories'>
         {% for category, lst_sub_categories in sub_categories %}
-        <li>
+        <li class='main_category'>
             <img class="control_image toggle_category" id="maincategory_img_{{category.id}}" alt="control" src="{{ STATIC_URL }}chimere/img/{% if category.selected %}minus.png{% else %}plus.png{% endif %}" />
             <input type="checkbox" id='checkall_{{category.id}}'>
             {% trans category.name %}