added map stuff, single view map and multiple map

geocamTalk/templates/geocamTalk/base.html

@@ -99,6 +99,7 @@ <h1>{% block pagetitle %}GeoCam Talk{% endblock %}</h1>
 		        		<ul id="bigsigh">
 		        			<li><a id="my_messages_link" href="{% url geocamTalk.views.message_list user.username%}">My Messages (<span id="new_message_count">{{user.profile.getUnreadMessageCount}}</span>)</a></li>
                 			<li><a href="{% url geocamTalk.views.message_list%}">All Messages</a></li>
+                			<li><a href="{% url geocamTalk.views.message_map %}">Talk Map</a></li>
 		        		</ul>
 	        		</div>
 	        	</div>

geocamTalk/templates/geocamTalk/details.html

@@ -0,0 +1,15 @@
+<div data-role="page">
+<img src="http://maps.google.com/maps/api/staticmap?markers={{ message.latitude }},{{ message.longitude }}&zoom=14&size=320x400&sensor=false" />
+<!--center={{ message.latitude }},{{ message.longitude }}-->
+<dl>
+	<dt>Latitude</dt>
+	<dd>{{ message.latitude }}</dd>
+    <dt>Longitude</dt>
+	<dd>{{ message.longitude }}</dd>
+    <dt>Altitude</dt>
+	<dd>{{ message.altitude }}</dd>
+    <dt>Accuracy</dt>
+	<dd>{{ message.accuracy }}</dd>
+</dl>
+<a href="docs-dialogs.html" data-role="button" data-inline="true" data-icon="check" data-rel="back" data-theme="c">Okay</a>   
+</div>

geocamTalk/templates/geocamTalk/map.html

@@ -0,0 +1,55 @@
+{% extends "geocamTalk/base.html" %}
+
+{% block js %}
+<script>
+	$('#bodydiv').live('pageshow', function(event) {
+        createMap({{ first_geolocation.0 }},{{ first_geolocation.1 }});
+	});
+
+function createMap(latitude, longitude) {
+    	var latlng = new google.maps.LatLng( latitude,longitude );
+		var myOptions = {
+			    zoom: 12,
+			    center: latlng,
+			    mapTypeControl: false,
+			    navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
+			    mapTypeId: google.maps.MapTypeId.ROADMAP
+			  };
+
+		var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
+
+		var messages =
+        [{% for m in gc_msg %}{% if m.has_geolocation %}
+		       	{marker:null,latitude:{{m.latitude}},longitude:{{m.longitude}},pk:{{m.pk}}},
+		   {% endif %}
+		{% endfor %}];
+
+		$(messages).each(function(i,msg){
+			var pos = new google.maps.LatLng(msg.latitude,msg.longitude);
+			msg.marker = new google.maps.Marker({position:pos,map:map});
+		});
+
+		var infoWindow = new google.maps.InfoWindow();
+		$(messages).each(function(i, msg) {
+			google.maps.event.addListener(msg.marker,"click", function() {
+				infoWindow.close();
+				$.getJSON("talk/messages/details/" + msg.pk + ".json", function(data) {
+					var messageHtml = "<strong>" + data['authorFullname'] + "</strong><br />"
+                                    + "<span>" + data['contentTimestamp'] + "</span>"
+					                + "<p>" + data['content'] + "</p>"
+					infoWindow.setContent(messageHtml);
+				});
+				infoWindow.open(map, msg.marker);
+			});
+		});
+
+		google.maps.event.trigger(map,'resize');
+	}
+
+</script>
+{% endblock %}
+
+{% block content %}
+<section id="map_canvas" style="width: 320px; height: 400px">
+</section>
+{% endblock %}

geocamTalk/templates/geocamTalk/message_list.html

@@ -42,7 +42,7 @@ <h1>
       {% else %}
           {{ m.get_author_string}}
       {% endif %}
-	  {% if m.has_geolocation %}<a href="#" data-rel="dialog" data-transition="pop" data-inline="true" data-role="button" data-icon="geoCam-map" data-iconpos="notext">Map Info</a>{%endif%}
+	  {% if m.has_geolocation %}<a href="{% url geocamTalk.views.message_details m.pk %}" data-rel="dialog" data-transition="pop" data-inline="true" data-role="button" data-icon="geoCam-map" data-iconpos="notext">Map Info</a>{%endif%}
 	  {% if m.has_audio %}
           <a class="media" href="{{m.audio_file.url}}"></a>
       {%endif%}

geocamTalk/urls.py

@@ -16,7 +16,9 @@
     url(r'messages/clear', 'clear_messages',
          name='talk_clear_messages'),
     url(r'messages/details/(?P<message_id>\d+).json', 'message_details_json', 
-        name="talk_message_details_json"),         
+        name="talk_message_details_json"),
+    url(r'messages/details/(?P<message_id>\d+)$', 'message_details', 
+        name="talk_message_details"),
     url(r'messages/(?P<recipient_username>[^ ]+)/(?P<author_username>[^ ]+).json', 'feed_messages',
          name="talk_message_list_to_from_json"),
     url(r'messages/(?P<recipient_username>[^ ]+).json', 'feed_messages',
@@ -29,4 +31,6 @@
          name="talk_message_list_author"),
     url(r'messages',  'message_list',
          name="talk_message_list_all"),
+    url(r'map', 'message_map', 
+        name="talk_message_map"),
 )

geocamTalk/views.py

@@ -20,6 +20,20 @@
 from django.db.models import Q, Count
 import json
 
+def get_first_geolocation(messages):
+    """ return the first geotagged message lat and long as tuple """
+    try:
+        return [(m.latitude, m.longitude) for m in messages if m.has_geolocation()][0]
+    except:
+        return ()
+
+@login_required
+def message_map(request):
+    messages = TalkMessage.getMessages()
+    return render_to_response('geocamTalk/map.html',
+                              dict(gc_msg=messages,
+                                   first_geolocation=get_first_geolocation(messages)),
+                              context_instance=RequestContext(request))
 
 @login_required
 def clear_messages(request):
@@ -89,7 +103,15 @@ def message_details_json(request, message_id):
     else:
         message = get_object_or_404(TalkMessage, pk=message_id)
         return HttpResponse(json.dumps(message.getJson()))
-
+
+@login_required
+def message_details(request, message_id):
+    message = get_object_or_404(TalkMessage, pk=message_id)
+
+    return render_to_response('geocamTalk/details.html',
+                              {'message':message},
+                              context_instance=RequestContext(request))
+
 @login_required
 def index(request):
     return render_to_response('geocamTalk/home.html',