changeset 12:f408971657b9

Changed the shoutbox: posts are now made by Ajax. The smiley farm is loaded only on demand. jQuery is now in the base template. May add scrolling later.
author Brian Neal <bgneal@gmail.com>
date Wed, 15 Apr 2009 01:13:17 +0000
parents cc8eb028def1
children 777451a98f9d
files gpp/bio/forms.py gpp/comments/forms.py gpp/core/widgets.py gpp/downloads/forms.py gpp/gcalendar/forms.py gpp/shoutbox/templatetags/shoutbox_tags.py gpp/shoutbox/views.py gpp/smiley/urls.py gpp/smiley/views.py gpp/templates/base.html gpp/templates/downloads/download_comments.html gpp/templates/downloads/download_list.html gpp/templates/downloads/download_summary.html gpp/templates/downloads/search_results.html gpp/templates/gcalendar/edit.html gpp/templates/membermap/index.html gpp/templates/news/story.html gpp/templates/polls/poll_results.html gpp/templates/potd/view.html gpp/templates/shoutbox/shout.html gpp/templates/shoutbox/shoutbox.html gpp/templates/shoutbox/view.html gpp/urls.py media/css/shoutbox.css media/icons/ajax_busy.gif media/js/shoutbox.js
diffstat 26 files changed, 102 insertions(+), 95 deletions(-) [+]
line wrap: on
line diff
--- a/gpp/bio/forms.py	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/bio/forms.py	Wed Apr 15 01:13:17 2009 +0000
@@ -43,8 +43,7 @@
             'all': settings.GPP_THIRD_PARTY_CSS['markitup'] + \
                 settings.GPP_THIRD_PARTY_CSS['jquery-ui']
         }
-        js = settings.GPP_THIRD_PARTY_JS['jquery'] + \
-            settings.GPP_THIRD_PARTY_JS['markitup'] + \
+        js = settings.GPP_THIRD_PARTY_JS['markitup'] + \
             settings.GPP_THIRD_PARTY_JS['jquery-ui'] + \
             ('js/bio.js', )
 
--- a/gpp/comments/forms.py	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/comments/forms.py	Wed Apr 15 01:13:17 2009 +0000
@@ -68,6 +68,5 @@
         css = {
             'all': settings.GPP_THIRD_PARTY_CSS['markitup'],
         }
-        js = settings.GPP_THIRD_PARTY_JS['jquery'] + \
-            settings.GPP_THIRD_PARTY_JS['markitup'] + \
+        js = settings.GPP_THIRD_PARTY_JS['markitup'] + \
             ('js/comments.js', )
--- a/gpp/core/widgets.py	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/core/widgets.py	Wed Apr 15 01:13:17 2009 +0000
@@ -13,8 +13,7 @@
         css = {
             'all': settings.GPP_THIRD_PARTY_CSS['jquery-autocomplete'],
         }
-        js = settings.GPP_THIRD_PARTY_JS['jquery'] + \
-             settings.GPP_THIRD_PARTY_JS['jquery-autocomplete']
+        js = settings.GPP_THIRD_PARTY_JS['jquery-autocomplete']
 
     def render(self, name, value, attrs=None):
         url = reverse('messages-ajax_users')
--- a/gpp/downloads/forms.py	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/downloads/forms.py	Wed Apr 15 01:13:17 2009 +0000
@@ -37,7 +37,6 @@
         css = {
             'all': settings.GPP_THIRD_PARTY_CSS['markitup'],
         }
-        js = settings.GPP_THIRD_PARTY_JS['jquery'] + \
-             settings.GPP_THIRD_PARTY_JS['markitup'] + \
+        js = settings.GPP_THIRD_PARTY_JS['markitup'] + \
             ('js/downloads/add.js', )
 
--- a/gpp/gcalendar/forms.py	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/gcalendar/forms.py	Wed Apr 15 01:13:17 2009 +0000
@@ -85,8 +85,7 @@
                    settings.GPP_THIRD_PARTY_CSS['jquery-ui'] + \
                    ('css/gcalendar.css', )
         }
-        js = settings.GPP_THIRD_PARTY_JS['jquery'] + \
-             settings.GPP_THIRD_PARTY_JS['markitup'] + \
+        js = settings.GPP_THIRD_PARTY_JS['markitup'] + \
              settings.GPP_THIRD_PARTY_JS['jquery-ui'] + \
              ('js/gcalendar.js', )
 
--- a/gpp/shoutbox/templatetags/shoutbox_tags.py	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/shoutbox/templatetags/shoutbox_tags.py	Wed Apr 15 01:13:17 2009 +0000
@@ -12,4 +12,5 @@
    return {
       'shouts': shouts,
       'user': context['user'],
+      'MEDIA_URL': context['MEDIA_URL'],
    }
--- a/gpp/shoutbox/views.py	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/shoutbox/views.py	Wed Apr 15 01:13:17 2009 +0000
@@ -10,6 +10,7 @@
 from django.http import HttpResponseForbidden
 from django.http import HttpResponseRedirect
 from django.contrib.auth.decorators import login_required
+from django.views.decorators.http import require_POST
 
 from core.paginator import DiggPaginator
 from shoutbox.forms import ShoutBoxForm
@@ -18,14 +19,18 @@
 SHOUTS_PER_PAGE = 10
 
 @login_required
+@require_POST
 def shout(request):
-    if request.method == 'POST':
-        msg = request.POST.get('msg', '').strip()
-        if msg != '':
-            shout = Shout(user=request.user, shout=msg)
-            shout.save()
-            
-    return HttpResponseRedirect(request.META.get('HTTP_REFERER', '/'))
+    msg = request.POST.get('msg', '').strip()
+    if msg == '':
+        return HttpResponse('')
+
+    shout = Shout(user=request.user, shout=msg)
+    shout.save()
+    return render_to_response('shoutbox/shout.html', {
+       'shout': shout,
+       },
+       context_instance = RequestContext(request))
 
 
 def view(request, page=1):
@@ -101,3 +106,5 @@
         return HttpResponse(id)
 
     return HttpResponseForbidden()
+
+# vim: ts=4 sw=4
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/gpp/smiley/urls.py	Wed Apr 15 01:13:17 2009 +0000
@@ -0,0 +1,9 @@
+"""
+Urls for the Smiley application.
+"""
+
+from django.conf.urls.defaults import *
+
+urlpatterns = patterns('smiley.views',
+    url(r'^farm/$', 'farm', name='smiley-farm'),
+)
--- a/gpp/smiley/views.py	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/smiley/views.py	Wed Apr 15 01:13:17 2009 +0000
@@ -1,1 +1,19 @@
-# Create your views here.
+"""
+Views for the Smiley application.
+"""
+from django.shortcuts import render_to_response
+from django.template import RequestContext
+from django.contrib.auth.decorators import login_required
+from django.views.decorators.http import require_GET
+
+from smiley.models import Smiley
+
+@login_required
+@require_GET
+def farm(request):
+    return render_to_response('smiley/smiley_farm.html', {
+        'smilies': Smiley.objects.get_smilies(),
+        },
+        context_instance = RequestContext(request))
+
+# vim: ts=4 sw=4
--- a/gpp/templates/base.html	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/templates/base.html	Wed Apr 15 01:13:17 2009 +0000
@@ -6,6 +6,7 @@
 {% load irc_tags %}
 {% load potd_tags %}
 {% load messages_tags %}
+{% load script_tags %}
 <head><title>SurfGuitar101.com | {% block title %}{% endblock %}</title>
 <meta http-equiv="Content-Type" content="text/html" />
 <meta http-equiv="Content-Language" content="en-US" />
@@ -19,10 +20,13 @@
 <![endif]-->
 <link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/base.css" />
 <link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/shoutbox.css" />
-<!--<script type="text/javascript" src="{{ MEDIA_URL }}js/shoutbox.js"></script>-->
+{% script_tags "jquery" %}
 {% block custom_head %}{% endblock %}
 {% block custom_css %}{% endblock %}
 {% block custom_js %}{% endblock %}
+{% if user.is_authenticated %}
+<script type="text/javascript" src="{{ MEDIA_URL }}js/shoutbox.js"></script>
+{% endif %}
 <!-- <link rel="shortcut icon" type="image/vnd.microsoft.com" href="{{ MEDIA_URL }}images/favicon.ico" /> -->
 </head>
 <body>
--- a/gpp/templates/downloads/download_comments.html	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/templates/downloads/download_comments.html	Wed Apr 15 01:13:17 2009 +0000
@@ -8,7 +8,6 @@
 <link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/downloads.css" />
 {% endblock %}
 {% block custom_js %}
-{% script_tags "jquery" %}
 {% script_tags "markitup" %}
 <script type="text/javascript" src="{{ MEDIA_URL }}js/comments.js"></script>
 <script type="text/javascript" src="{{ MEDIA_URL }}js/downloads/rating.js"></script>
--- a/gpp/templates/downloads/download_list.html	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/templates/downloads/download_list.html	Wed Apr 15 01:13:17 2009 +0000
@@ -1,6 +1,5 @@
 {% extends 'base.html' %}
 {% load downloads_tags %}
-{% load script_tags %}
 {% block title %}Downloads: {{ category.title }}{% endblock %}
 {% block custom_css %}
 <link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/downloads.css" />
@@ -8,7 +7,6 @@
 <link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/pagination.css" />
 {% endblock %}
 {% block custom_js %}
-{% script_tags "jquery" %}
 <script type="text/javascript" src="{{ MEDIA_URL }}js/downloads/rating.js"></script>
 {% endblock %}
 {% block content %}
--- a/gpp/templates/downloads/download_summary.html	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/templates/downloads/download_summary.html	Wed Apr 15 01:13:17 2009 +0000
@@ -1,12 +1,10 @@
 {% extends 'base.html' %}
 {% load downloads_tags %}
-{% load script_tags %}
 {% block title %}{{ title }}{% endblock %}
 {% block custom_css %}
 <link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/downloads.css" />
 {% endblock %}
 {% block custom_js %}
-{% script_tags "jquery" %}
 <script type="text/javascript" src="{{ MEDIA_URL }}js/downloads/rating.js"></script>
 {% endblock %}
 {% block content %}
--- a/gpp/templates/downloads/search_results.html	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/templates/downloads/search_results.html	Wed Apr 15 01:13:17 2009 +0000
@@ -1,6 +1,5 @@
 {% extends 'base.html' %}
 {% load downloads_tags %}
-{% load script_tags %}
 {% block title %}Downloads: Search Results{% endblock %}
 {% block custom_css %}
 <link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/downloads.css" />
@@ -8,7 +7,6 @@
 <link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/pagination.css" />
 {% endblock %}
 {% block custom_js %}
-{% script_tags "jquery" %}
 <script type="text/javascript" src="{{ MEDIA_URL }}js/downloads/rating.js"></script>
 {% endblock %}
 {% block content %}
--- a/gpp/templates/gcalendar/edit.html	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/templates/gcalendar/edit.html	Wed Apr 15 01:13:17 2009 +0000
@@ -1,8 +1,6 @@
 {% extends 'base.html' %}
-{% load script_tags %}
 {% block title %}Edit Calendar Events{% endblock %}
 {% block custom_js %}
-{% script_tags "jquery" %}
 <script type="text/javascript" src="{{ MEDIA_URL }}js/gcalendar_edit.js"></script>
 {% endblock %}
 {% block content %}
--- a/gpp/templates/membermap/index.html	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/templates/membermap/index.html	Wed Apr 15 01:13:17 2009 +0000
@@ -1,8 +1,6 @@
 {% extends 'base.html' %}
-{% load script_tags %}
 {% block title %}Member Map{% endblock %}
 {% block custom_js %}
-{% script_tags "jquery" %}
 <script type="text/javascript" src="{{ MEDIA_URL }}js/membermap.js"></script>
 <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAql_1Xw9MGW3mOxzo8gLb3hStsp1UIpjYO7Py4hlJXjRzAdyQtBTt5uM4QCgXtTKcuwba8HA9TL9LgQ" type="text/javascript"></script>
 {{ form.media }}
--- a/gpp/templates/news/story.html	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/templates/news/story.html	Wed Apr 15 01:13:17 2009 +0000
@@ -8,7 +8,6 @@
 {% endblock %}
 {% block custom_js %}
 {% if story.can_comment_on %}
-{% script_tags "jquery" %}
 {% script_tags "markitup" %}
 <script type="text/javascript" src="{{ MEDIA_URL }}js/comments.js"></script>
 {% endif %}
--- a/gpp/templates/polls/poll_results.html	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/templates/polls/poll_results.html	Wed Apr 15 01:13:17 2009 +0000
@@ -8,7 +8,6 @@
 {% endblock %}
 {% block custom_js %}
 {% if poll.is_open %}
-{% script_tags "jquery" %}
 {% script_tags "markitup" %}
 <script type="text/javascript" src="{{ MEDIA_URL }}js/comments.js"></script>
 {% endif %}
--- a/gpp/templates/potd/view.html	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/templates/potd/view.html	Wed Apr 15 01:13:17 2009 +0000
@@ -7,7 +7,6 @@
 <link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/comments.css" />
 {% endblock %}
 {% block custom_js %}
-{% script_tags "jquery" %}
 {% script_tags "markitup" %}
 <script type="text/javascript" src="{{ MEDIA_URL }}js/comments.js"></script>
 {% endblock %}
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/gpp/templates/shoutbox/shout.html	Wed Apr 15 01:13:17 2009 +0000
@@ -0,0 +1,6 @@
+{% load smiley_tags %}
+<p style="display:none;">
+<span class="shoutbox-user">{{ shout.user.username }}:</span>
+<span class="shoutbox-shout">{{ shout.shout|smilify|urlizetrunc:15 }}</span>
+<span class="shoutbox-date">{{ shout.shout_date|date:"D M d Y H:i:s" }}</span>
+</p>
--- a/gpp/templates/shoutbox/shoutbox.html	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/templates/shoutbox/shoutbox.html	Wed Apr 15 01:13:17 2009 +0000
@@ -2,11 +2,7 @@
 {% load smiley_tags %}
 {% block block_title %}Shoutbox{% endblock %}
 {% block block_content %}
-{% if shouts %}
-<!--<div id="marqueecontainer" onmouseover="copyspeed=pausespeed" onmouseout="copyspeed=marqueespeed">-->
-<div id="marqueecontainer">
-<!--<div id="vmarquee" style="position: absolute; width: 98%; overflow:auto;">-->
-   {# for shout in shouts reversed #}
+<div id="shoutbox-shout-container">
    {% for shout in shouts %}
       <p>
       <span class="shoutbox-user">{{ shout.user.username }}:</span>
@@ -14,20 +10,18 @@
       <span class="shoutbox-date">{{ shout.shout_date|date:"D M d Y H:i:s" }}</span>
       </p>
    {% endfor %}
-<!--</div>-->
 </div>
-{% endif %}
 <center><a href="{% url shoutbox-view page=1 %}">Shout History</a></center>
 {% if user.is_authenticated %}
 <center>
 <form action="{% url shoutbox-shout %}" method="post">
    <input type="text" maxlength="2048" size="13" name="msg" value="" id="shoutbox-smiley-input" />
    <br />
-   <input type="submit" value="Shout" />
-   <input type="button" value="Smilies" onclick="sb_toggle_smilies();" />
+   <input id="shoutbox-submit" type="submit" value="Shout" />
+   <input id="shoutbox-smilies" type="button" value="Smilies" />
 </form>
 <div id="shoutbox-smiley-frame" style="display:none;">
-{% smiley_farm %}
+<img id="shoutbox-busy-icon" src="{{ MEDIA_URL }}icons/ajax_busy.gif" alt="Please wait" />
 </div>
 </center>
 {% else %}
--- a/gpp/templates/shoutbox/view.html	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/templates/shoutbox/view.html	Wed Apr 15 01:13:17 2009 +0000
@@ -7,7 +7,6 @@
 <link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/pagination.css" />
 {% endblock %}
 {% block custom_js %}
-{% script_tags "jquery" %}
 {% script_tags "jquery-jeditable" %}
 <script type="text/javascript" src="{{ MEDIA_URL }}js/shoutbox_app.js"></script>
 {% endblock %}
--- a/gpp/urls.py	Tue Apr 14 02:35:35 2009 +0000
+++ b/gpp/urls.py	Wed Apr 15 01:13:17 2009 +0000
@@ -32,6 +32,7 @@
    (r'^potd/', include('potd.urls')),
    (r'^profile/', include('bio.urls')),
    (r'^shout/', include('shoutbox.urls')),
+   (r'^smiley/', include('smiley.urls')),
 )
 
 if settings.DEBUG:
--- a/media/css/shoutbox.css	Tue Apr 14 02:35:35 2009 +0000
+++ b/media/css/shoutbox.css	Wed Apr 15 01:13:17 2009 +0000
@@ -21,7 +21,7 @@
     cursor: pointer;
 }
 
-#marqueecontainer {
+#shoutbox-shout-container {
 position: relative;
 width: 142; /*marquee width */
 height: 200px; /*marquee height */
Binary file media/icons/ajax_busy.gif has changed
--- a/media/js/shoutbox.js	Tue Apr 14 02:35:35 2009 +0000
+++ b/media/js/shoutbox.js	Wed Apr 15 01:13:17 2009 +0000
@@ -1,53 +1,40 @@
-/***********************************************
-* Cross browser Marquee II- © Dynamic Drive (www.dynamicdrive.com)
-* This notice MUST stay intact for legal use
-* Visit http://www.dynamicdrive.com/ for this script and 100s more.
-***********************************************/
-
-var delayb4scroll=2000 //Specify initial delay before marquee starts to scroll on page (2000=2 seconds)
-var marqueespeed=1 //Specify marquee scroll speed (larger is faster 1-10)
-var pauseit=1 //Pause marquee onMousever (0=no. 1=yes)?
-
-////NO NEED TO EDIT BELOW THIS LINE////////////
-
-var copyspeed=marqueespeed
-var pausespeed=(pauseit==0)? copyspeed: 0
-var actualheight=''
-
-function scrollmarquee(){
-if (parseInt(cross_marquee.style.top)>(actualheight*(-1)+8))
-cross_marquee.style.top=parseInt(cross_marquee.style.top)-copyspeed+"px"
-else
-cross_marquee.style.top=parseInt(marqueeheight)+8+"px"
-}
-
-function initializemarquee(){
-cross_marquee=document.getElementById("vmarquee")
-cross_marquee.style.top=0
-marqueeheight=document.getElementById("marqueecontainer").offsetHeight
-actualheight=cross_marquee.offsetHeight
-if (window.opera || navigator.userAgent.indexOf("Netscape/7")!=-1){ //if Opera or Netscape 7x, add scrollbars to scroll and exit
-cross_marquee.style.height=marqueeheight+"px"
-cross_marquee.style.overflow="scroll"
-return
-}
-setTimeout('lefttime=setInterval("scrollmarquee()",30)', delayb4scroll)
-}
-
-if (window.addEventListener)
-window.addEventListener("load", initializemarquee, false)
-else if (window.attachEvent)
-window.attachEvent("onload", initializemarquee)
-else if (document.getElementById)
-window.onload=initializemarquee
-
-///////////////////////////////
-
-function sb_toggle_smilies()
-{
-    var d = document.getElementById("shoutbox-smiley-frame");
-    d.style.display = d.style.display == "none" ? "block" : "none";
-}
+$(document).ready(function() {
+   var submit = $('#shoutbox-submit');
+   submit.click(function () {
+      var input = $('#shoutbox-smiley-input');
+      var msg = input.val();
+      msg = msg.replace(/^\s+/, '');
+      msg = msg.replace(/\s+$/, '');
+      if (msg.length == 0) {
+         return false;
+      }
+      submit.attr('disabled', 'disabled');
+      $.post('/shout/shout/', {
+         msg: msg
+         },
+         function (data, textStatus) {
+            input.val('');
+            if (data != '') {
+               $('#shoutbox-shout-container').prepend(data);
+               $('#shoutbox-shout-container p:first').fadeIn(2500);
+            }
+            submit.removeAttr('disabled');
+         },
+         'html');
+      return false;
+   });
+   var smilies_loaded = false;
+   var smiley_frame = $('#shoutbox-smiley-frame');
+   $('#shoutbox-smilies').click(function () {
+      smiley_frame.toggle();
+      if (!smilies_loaded) {
+         smiley_frame.load('/smiley/farm/', function () {
+            $('#shoutbox-busy-icon').hide();
+            smilies_loaded = true;
+         });
+      }
+   });
+});
 
 function sb_smiley_click(code)
 {