From 42806a8c108bddeda11e233957ceff0f65d905fa Mon Sep 17 00:00:00 2001
From: Étienne Loks <etienne.loks@peacefrogs.net>
Date: Sun, 28 Oct 2012 17:14:00 +0100
Subject: JS UI: be sure that there is no ID conflicts during the browsing

---
 chimere/templates/chimere/detail.html | 16 ++++++++--------
 chimere/views.py                      |  2 ++
 2 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/chimere/templates/chimere/detail.html b/chimere/templates/chimere/detail.html
index 70e66b5..bff0935 100644
--- a/chimere/templates/chimere/detail.html
+++ b/chimere/templates/chimere/detail.html
@@ -48,13 +48,13 @@
 {% endif %}
 </div>
 {% if marker.multimedia_items %}
-<div id='gallery-{{marker.pk}}' class='gallery'>
+<div id='gallery-{{time_now}}' class='gallery'>
     <div class='tabs'>
         <ul>{% for item in marker.multimedia_items %}
-            <li><a href="#tab-{{marker.pk}}-{{ forloop.counter }}">{{ item.name }}</a></li>{% endfor %}
+            <li><a href="#tab-{{time_now}}-{{ forloop.counter }}">{{ item.name }}</a></li>{% endfor %}
         </ul>
         {% for multimedia_item in marker.multimedia_items %}
-        <div id="tab-{{marker.pk}}-{{ forloop.counter }}" class='{% ifequal multimedia_item.multimedia_type.media_type 'V' %}video{% else %}other{% endifequal %}'>
+        <div id="tab-{{time_now}}-{{ forloop.counter }}" class='{% ifequal multimedia_item.multimedia_type.media_type 'V' %}video{% else %}other{% endifequal %}'>
             {% multimedia_render multimedia_item %}
         </div>{% endfor %}
     </div>
@@ -63,7 +63,7 @@
 <script language='javascript' type='text/javascript'>
 $('html').addClass('js-on');
 $(document).ready(function(){
-    $("#gallery-{{marker.pk}}").dialog({title:"{{marker.name}}", autoOpen: false,
+    $("#gallery-{{time_now}}").dialog({title:"{{marker.name}}", autoOpen: false,
                            height: "auto", width: "auto",
         open: function(event,ui) {
             $('.tabs').tabs({
@@ -90,9 +90,9 @@ $(document).ready(function(){
             }).bind('userinactive', function(){
                 $('div.media-controls', this).stop().animate({opacity: 0});
             });
-            $("#gallery-{{marker.pk}}").dialog("option", "height", 'auto');
-            $("#gallery-{{marker.pk}}").dialog("option", "width", 'auto');
-            $("#gallery-{{marker.pk}}").dialog("option", "position",
+            $("#gallery-{{time_now}}").dialog("option", "height", 'auto');
+            $("#gallery-{{time_now}}").dialog("option", "width", 'auto');
+            $("#gallery-{{time_now}}").dialog("option", "position",
                                                ['center', 'center']);
         },
         close: function(event, ui){
@@ -104,7 +104,7 @@ $(document).ready(function(){
         }
     });
     $('.show_gallery_link').click(function(){
-        $("#gallery-{{marker.pk}}").dialog('open');
+        $("#gallery-{{time_now}}").dialog('open');
         return false;
     });
     $("a[rel^='prettyPhoto']").prettyPhoto({
diff --git a/chimere/views.py b/chimere/views.py
index a1f22c3..e78b092 100644
--- a/chimere/views.py
+++ b/chimere/views.py
@@ -471,6 +471,8 @@ def getDetail(request, area_name, marker_id):
     for network in settings.CHIMERE_SHARE_NETWORKS:
         share_networks.append((network[0], network[1] % net_dct, network[2]))
     response_dct['share_networks'] = share_networks
+    # to be sure there is unique IDs during a browsing
+    response_dct['time_now'] = datetime.datetime.now().strftime('%H%M%S')
     response_dct['dated'] = settings.CHIMERE_DAYS_BEFORE_EVENT \
                             and marker.start_date
     return render_to_response('chimere/detail.html', response_dct,
-- 
cgit v1.2.3