Permalink
Browse files

jQuery Mobile working w/ message updates and Clear Message Link

  • Loading branch information...
1 parent 26f4bb7 commit 57f2c69c0ac70c60db4b6b1393d6b2eeb78ae95e @ahsteele ahsteele committed Apr 15, 2011
Showing with 70 additions and 68 deletions.
  1. +60 −57 geocamTalk/templates/geocamTalk/base.html
  2. +0 −1 geocamTalk/templates/geocamTalk/message_list.html
  3. +10 −10 geocamTalk/views.py
@@ -14,75 +14,77 @@
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
$(document).bind("mobileinit", function () {
- $.mobile.ajaxEnabled = true;
+ //$.mobile.ajaxEnabled = true;
$.extend($.mobile, {
ajaxFormsEnabled: false/*,
ajaxEnabled: false*/
});
});
-/* $('#bodydiv').live('pageshow', function() {
- $('a.media').media( { width: 300, height: 20 } );
- });*/
var running_timestamp = {{ timestamp }};
var new_message_count = {{ user.profile.getUnreadMessageCount }};
- //var updateFunction = ;
- $('div').live('pageshow', function(){
- {% if author %}
- var url = '{% url geocamTalk.views.feed_messages recipient.username author.username %}';
- {% else %}
- {% if recipient %}
- var url = '{% url geocamTalk.views.feed_messages recipient.username %}';
- {% else %}
- var url = '{% url geocamTalk.views.feed_messages %}';
- {% endif %}
- {% endif %}
- url = url + '?since=' + running_timestamp;
- $.getJSON(url, function(data) {
- var html_str = "";
- for (var i in data['ms']) {
- var msg = data['ms'][i];
- var pk = msg['messageId'];
- var content = msg['content'];
- var has_geolocation = msg['hasGeolocation'];
- var authorUsername = msg['authorUsername'];
- var authorFullname = msg['authorFullname'];
- {% if recipient %}
- authorFullname = '<a href="{% url geocamTalk.views.message_list recipient.username %}/' +authorUsername+ '">' +authorFullname+ '</a>' ;
- {% endif %}
-
- var msgDate = new Date (msg['contentTimestamp']);
- var content_timestamp =
- msgDate.getDate() + "/" + msgDate.getMonth() + "/" + msgDate.getFullYear()
- + " " + msgDate.getHours() + ":" + msgDate.getMinutes();
+ var updateFunction = function() {
+ var url = '{% url geocamTalk.views.feed_messages %}';
+
+ url += '?since=' + running_timestamp;
+ $.getJSON(url, function(data) {
+ var html_str = "";
+ for (var i in data['ms']) {
+ var msg = data['ms'][i];
+ var pk = msg['messageId'];
+ var content = msg['content'];
+ var has_geolocation = msg['hasGeolocation'];
+ var authorUsername = msg['authorUsername'];
+ var authorFullname = msg['authorFullname'];
+ {% if recipient %}
+ authorFullname = '<a href="{% url geocamTalk.views.message_list recipient.username %}/' +authorUsername+ '">' +authorFullname+ '</a>' ;
+ {% endif %}
+
+ var msgDate = new Date (msg['contentTimestamp']);
+ var content_timestamp =
+ msgDate.getDate() + "/" + msgDate.getMonth() + "/" + msgDate.getFullYear()
+ + " " + msgDate.getHours() + ":" + msgDate.getMinutes();
- html_str += '<li id="message_'+pk+'"><p id="message_'+pk+'_header">';
- html_str += 'On '+content_timestamp+' '+authorFullname;
- if (has_geolocation == true) {
- html_str += '<a href="#" data-rel="dialog" data-transition="pop" data-inline="true" data-role="button" data-icon="geoCam-map" data-iconpos="notext" title="Map Info" data-theme="c" class="ui-btn ui-btn-inline ui-btn-icon-notext ui-btn-corner-all ui-shadow ui-btn-up-c"><span class="ui-btn-inner ui-btn-corner-all"><span class="ui-btn-text">Map Info</span><span class="ui-icon ui-icon-geoCam-map ui-icon-shadow"></span></span></a>';
- }
- html_str += '</p>';
- html_str += '<p id="message_'+pk+'_content">'+content+'</p>';
- html_str += '</li>';
- }
+ html_str += '<li id="message_'+pk+'"><p id="message_'+pk+'_header">';
+ html_str += 'On '+content_timestamp+' '+authorFullname;
+ if (has_geolocation == true) {
+ html_str += '<a href="#" data-rel="dialog" data-transition="pop" data-inline="true" data-role="button" data-icon="geoCam-map" data-iconpos="notext" title="Map Info" data-theme="c" class="ui-btn ui-btn-inline ui-btn-icon-notext ui-btn-corner-all ui-shadow ui-btn-up-c"><span class="ui-btn-inner ui-btn-corner-all"><span class="ui-btn-text">Map Info</span><span class="ui-icon ui-icon-geoCam-map ui-icon-shadow"></span></span></a>';
+ }
+ html_str += '</p>';
+ html_str += '<p id="message_'+pk+'_content">'+content+'</p>';
+ html_str += '</li>';
+ }
- running_timestamp = data['ts'];
- new_message_count += data['msgCnt'];
-
- $('div[data-role="page"]').each(function() {
- $(this).find('#message_list').prepend(html_str);
- $(this).find('#new_message_count').html(new_message_count);
+ running_timestamp = data['ts'];
+ new_message_count += data['msgCnt'];
+
+ $('div[data-role="page"]').each(function() {
+ $(this).find('#message_list').prepend(html_str);
+ $(this).find('#new_message_count').html(new_message_count);
+ });
+
+ if (new_message_count > 0
+ && $('div[data-role="page"]').find('#clear_link').length == 0) {
+ var link = $('<a href="#" id="clear_link" data-role="button" data-inline="true" data-theme="c" class="ui-btn ui-btn-inline ui-btn-corner-all ui-shadow ui-btn-up-c"><span class="ui-btn-inner ui-btn-corner-all"><span class="ui-btn-text">Clear Received Messages</span></span></a>');
+ link.click(function() {
+ $.get('{% url geocamTalk.views.clear_messages %}', function(data) {
+ $('div[data-role="page"]').each(function() {
+ $(this).find('#clear_link').remove();
+ $(this).find('#new_message_count').html(0);
+ });
+ running_timestamp = data['ts'];
+ });
});
- });
- });
- </script>
- <script>
- $(document).ready(function() {
- //$('a.media').media( { width: 300, height: 20 } );
- //updateFunction();
- //setInterval(updateFunction, 3 *1000);
+ $('div[data-role="page"]').find('#new_message_link').after(link);
+ }
+ });
+ }
+ $('div').live('pagebeforeshow', function(event, ui){
+ $('a.media').media( { width: 300, height: 20 } );
+ updateFunction();
});
- </script>
+ setInterval(updateFunction, 3 *1000);
+ </script>
<script src="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a4.min.js"></script>
<script src="http://jquery.malsup.com/media/jquery.media.js?v.92"></script>
{% block css %}{% endblock %}
@@ -103,6 +105,7 @@
</header>
<content>
<div data-role="content">
+ <a id="new_message_link" href="{% url geocamTalk.views.create_message %}" data-role="button" data-inline="true">New Message</a>
{% block content %}
{% endblock %}
</div>
@@ -3,7 +3,6 @@
{% block title%}GeoCam Talk Messages{% endblock %}
{% block content %}
-<a href="{% url geocamTalk.views.create_message %}" data-role="button" data-inline="true">New Message</a>
<h1>
{% if recipient != None and author != None %}
Messages to
View
@@ -5,7 +5,7 @@
# __END_LICENSE__
from django.shortcuts import render_to_response, get_object_or_404
-from django.http import HttpResponse, HttpResponseRedirect, HttpResponseForbidden, Http404,\
+from django.http import HttpResponse, HttpResponseRedirect, HttpResponseForbidden, Http404, \
HttpResponseBadRequest
from django.template import RequestContext
from django.contrib.auth.decorators import login_required
@@ -27,7 +27,7 @@ def clear_messages(request):
profile.last_viewed_mymessages = TalkMessage.getLargestMessageId()
profile.save()
- return HttpResponse(status=200)
+ return HttpResponse(json.dumps({'ts': TalkMessage.getLargestMessageId()}))
@login_required
def message_list(request, recipient_username=None, author_username=None):
@@ -47,9 +47,9 @@ def message_list(request, recipient_username=None, author_username=None):
profile.last_viewed_mymessages = timestamp
profile.save()
- return render_to_response('geocamTalk/message_list.html',
- dict(gc_msg=TalkMessage.getMessages(recipient,author),
- recipient=recipient,
+ return render_to_response('geocamTalk/message_list.html',
+ dict(gc_msg=TalkMessage.getMessages(recipient, author),
+ recipient=recipient,
author=author,
timestamp=timestamp),
context_instance=RequestContext(request))
@@ -93,7 +93,7 @@ def message_details_json(request, message_id):
@login_required
def index(request):
return render_to_response('geocamTalk/home.html',
- dict(),
+ dict(),
context_instance=RequestContext(request))
@login_required
@@ -116,7 +116,7 @@ def create_message(request):
else:
form = GeocamTalkForm()
return render_to_response('geocamTalk/message_form.html',
- dict(form=form),
+ dict(form=form),
context_instance=RequestContext(request))
@@ -146,9 +146,9 @@ def create_message_json(request):
message = TalkMessage.fromJson(messageDict)
if "audio" in request.FILES:
- filename = "%s%s.mp4" % (message.author, message.content_timestamp.strftime("%H%M%S"))
+ filename = "%s%s.mp4" % (message.author, message.content_timestamp.strftime("%H%M%S"))
file_content = ContentFile(request.FILES['audio'].read())
- file_format = os.path.splitext( request.FILES['audio'].name)[-1]
+ file_format = os.path.splitext(request.FILES['audio'].name)[-1]
message.audio_file.save(filename, file_content)
try:
print message
@@ -167,4 +167,4 @@ def create_message_json(request):
else:
return HttpResponseServerError()
else:
- return HttpResponseForbidden()
+ return HttpResponseForbidden()

0 comments on commit 57f2c69

Please sign in to comment.