fix on images ordering
authordurandn
Mon, 25 Jul 2016 16:41:17 +0200
changeset 75 853cd5c1ce5a
parent 74 d1cdbbfff73f
child 76 cfb718dadcdf
fix on images ordering
src/iconolab/templates/iconolab/detail_item.html
--- a/src/iconolab/templates/iconolab/detail_item.html	Fri Jul 22 17:33:48 2016 +0200
+++ b/src/iconolab/templates/iconolab/detail_item.html	Mon Jul 25 16:41:17 2016 +0200
@@ -9,7 +9,7 @@
 {% block content %}
 <div class="row">
 	<div class="col-md-6">
-        {% for image in item.images.all %}
+        {% for image in item.images.all|dictsort:"pk" %}
           <div id="img-{{image.image_guid}}" class="item-detail-image-block {% if forloop.first %}selected{% endif %}">
     		{% thumbnail image.media "500x500" crop=False as im %}
   			   <img src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}">
@@ -45,20 +45,21 @@
 
 {% block footer_js %}
 <script>
-	$(".item-detail-image-block:not(.selected)").hide()
-	$(".image-annotations-list").hide()
+	$(".item-detail-image-block:not(.selected)").hide();
+	$(".image-annotations-list").hide();
 	var initialSelectedID = /img\-([0-9a-z\-]+)/.exec($(".item-detail-image-block.selected").attr("id"))[1];
-	$(".item-image-thumbnail#thumb-"+initialSelectedID).hide()
-	$(".image-annotations-list#annotations-"+initialSelectedID).show()
+	$(".item-image-thumbnail#thumb-"+initialSelectedID).hide();
+	$(".image-annotations-list#annotations-"+initialSelectedID).show();
 	$(".item-image-thumbnail").on("click", function(e){
 	    imageID = /thumb\-([0-9a-z\-]+)/.exec($(this).attr("id"))[1];
-	    $(".item-detail-image-block").hide()
-	    $(".item-detail-image-block#img-"+imageID).show()
-	    $(".item-detail-image-block#img-"+imageID).addClass("selected")
-	    $(".item-image-thumbnail").show()
-		$(".item-image-thumbnail#thumb-"+imageID).hide()
-		$(".image-annotations-list").hide()
-		$(".image-annotations-list#annotations-"+imageID).show()
+	    $(".item-detail-image-block").hide();
+	    $(".item-detail-image-block").removeClass("selected");
+	    $(".item-detail-image-block#img-"+imageID).show();
+	    $(".item-detail-image-block#img-"+imageID).addClass("selected");
+	    $(".item-image-thumbnail").show();
+		$(".item-image-thumbnail#thumb-"+imageID).hide();
+		$(".image-annotations-list").hide();
+		$(".image-annotations-list#annotations-"+imageID).show();
 	})
 </script>
 {% endblock %}
\ No newline at end of file