changeset 484:bbbc357ac5f3

For #233; first commit for adding social media sharing buttons to news stories.
author Brian Neal <bgneal@gmail.com>
date Tue, 18 Oct 2011 00:04:37 +0000 (2011-10-18)
parents 3ac558402014
children 7c69b1449d7a
files gpp/bio/forms.py gpp/comments/forms.py gpp/core/templatetags/core_tags.py gpp/forums/forms.py gpp/gcalendar/forms.py gpp/news/models.py gpp/settings.py gpp/templates/base.html gpp/templates/core/open_graph_meta_tag.html gpp/templates/core/social_sharing_tag.html gpp/templates/home.html gpp/templates/news/index.html gpp/templates/news/story.html gpp/templates/news/story_summary.html
diffstat 14 files changed, 117 insertions(+), 26 deletions(-) [+]
line wrap: on
line diff
--- a/gpp/bio/forms.py	Sat Oct 15 22:04:18 2011 +0000
+++ b/gpp/bio/forms.py	Tue Oct 18 00:04:37 2011 +0000
@@ -48,12 +48,12 @@
 
     class Media:
         css = {
-            'all': settings.GPP_THIRD_PARTY_CSS['markitup'] + \
-                settings.GPP_THIRD_PARTY_CSS['jquery-ui']
+            'all': (settings.GPP_THIRD_PARTY_CSS['markitup'] +
+                settings.GPP_THIRD_PARTY_CSS['jquery-ui'])
         }
-        js = settings.GPP_THIRD_PARTY_JS['markitup'] + \
-            settings.GPP_THIRD_PARTY_JS['jquery-ui'] + \
-            ('js/bio.js', 'js/timezone.js')
+        js = (settings.GPP_THIRD_PARTY_JS['markitup'] +
+            settings.GPP_THIRD_PARTY_JS['jquery-ui'] +
+            ['js/bio.js', 'js/timezone.js'])
 
 
 class UploadAvatarForm(forms.Form):
--- a/gpp/comments/forms.py	Sat Oct 15 22:04:18 2011 +0000
+++ b/gpp/comments/forms.py	Tue Oct 18 00:04:37 2011 +0000
@@ -71,4 +71,4 @@
         }
         js = (settings.GPP_THIRD_PARTY_JS['markitup'] +
                 settings.GPP_THIRD_PARTY_JS['jquery-ui'] +
-                ('js/comments.js', ))
+                ['js/comments.js'])
--- a/gpp/core/templatetags/core_tags.py	Sat Oct 15 22:04:18 2011 +0000
+++ b/gpp/core/templatetags/core_tags.py	Tue Oct 18 00:04:37 2011 +0000
@@ -8,6 +8,7 @@
 from django import template
 from django.conf import settings
 from django.core.cache import cache
+from django.contrib.sites.models import Site
 
 import repoze.timeago
 
@@ -50,6 +51,39 @@
     }
 
 
+@register.inclusion_tag('core/social_sharing_tag.html')
+def social_sharing(title, url):
+    """
+    Displays social media sharing buttons.
+
+    """
+    if url.startswith('/'):
+        url = 'http://%s%s' % (Site.objects.get_current().domain, url)
+
+    return {
+        'title': title,
+        'url': url,
+    }
+
+
+@register.inclusion_tag('core/open_graph_meta_tag.html')
+def open_graph_meta_tags(item):
+    """
+    Generates Open Graph meta tags by interrogating the given item.
+
+    """
+    site = Site.objects.get_current()
+
+    props = item.ogp_tags()
+    props['og:site_name'] = site.name
+    props['fb:admins'] = settings.OGP_FB_ID
+
+    if 'og:image' not in props:
+        props['og:image'] = settings.OGP_DEFAULT_IMAGE
+
+    return {'props': props}
+
+
 # A somewhat ugly hack until we decide if we should be using UTC time
 # everywhere or not.
 repoze.timeago._NOW = datetime.datetime.now
--- a/gpp/forums/forms.py	Sat Oct 15 22:04:18 2011 +0000
+++ b/gpp/forums/forms.py	Tue Oct 18 00:04:37 2011 +0000
@@ -28,7 +28,7 @@
         }
         js = (settings.GPP_THIRD_PARTY_JS['markitup'] +
                 settings.GPP_THIRD_PARTY_JS['jquery-ui'] +
-                ('js/forums.js', ))
+                ['js/forums.js'])
 
     def __init__(self, *args, **kwargs):
         super(NewPostForm, self).__init__(*args, **kwargs)
@@ -82,7 +82,7 @@
         }
         js = (settings.GPP_THIRD_PARTY_JS['markitup'] +
                 settings.GPP_THIRD_PARTY_JS['jquery-ui'] +
-                ('js/forums.js', ))
+                ['js/forums.js'])
 
     def __init__(self, user, forum, *args, **kwargs):
         super(NewTopicForm, self).__init__(*args, **kwargs)
@@ -159,7 +159,7 @@
         }
         js = (settings.GPP_THIRD_PARTY_JS['markitup'] +
                 settings.GPP_THIRD_PARTY_JS['jquery-ui'] +
-                ('js/forums.js', ))
+                ['js/forums.js'])
 
     def __init__(self, *args, **kwargs):
         topic_name = kwargs.pop('topic_name', None)
--- a/gpp/gcalendar/forms.py	Sat Oct 15 22:04:18 2011 +0000
+++ b/gpp/gcalendar/forms.py	Tue Oct 18 00:04:37 2011 +0000
@@ -86,11 +86,11 @@
         css = {
             'all': (settings.GPP_THIRD_PARTY_CSS['markitup'] +
                     settings.GPP_THIRD_PARTY_CSS['jquery-ui'] +
-                    ('css/gcalendar.css', ))
+                    ['css/gcalendar.css'])
         }
         js = (settings.GPP_THIRD_PARTY_JS['markitup'] +
               settings.GPP_THIRD_PARTY_JS['jquery-ui'] +
-              ('js/timezone.js', 'js/gcalendar.js', ))
+              ['js/timezone.js', 'js/gcalendar.js'])
 
     def __init__(self, *args, **kwargs):
         initial = kwargs.get('initial', {})
--- a/gpp/news/models.py	Sat Oct 15 22:04:18 2011 +0000
+++ b/gpp/news/models.py	Tue Oct 18 00:04:37 2011 +0000
@@ -98,3 +98,16 @@
 
     def search_summary(self):
         return u"\n".join((self.short_text, self.long_text))
+
+    def ogp_tags(self):
+        """
+        Returns a dict of Open Graph Protocol meta tags.
+
+        """
+        return {
+            'og:title': self.title,
+            'og:type': 'article',
+            'og:url': self.get_absolute_url(),
+            'og:image': self.category.icon.url,
+            'og:description': self.title,
+        }
--- a/gpp/settings.py	Sat Oct 15 22:04:18 2011 +0000
+++ b/gpp/settings.py	Tue Oct 18 00:04:37 2011 +0000
@@ -289,35 +289,45 @@
 QUEUE_REDIS_DB = 0
 
 #######################################################################
+# Open Graph Protocol related settings
+#######################################################################
+OGP_DEFAULT_IMAGE = 'http://surfguitar101.com/media/podcast/podcast_logo.jpg'
+OGP_FB_ID = '100001558124013'
+
+#######################################################################
 # URL's of 3rd party Javascript and CSS files.
 # These dictionaries are used by core/templatetags/script_tags, and
 # should also be used by developers when creating form media classes.
 GPP_THIRD_PARTY_JS = {
-    'jquery': (
+    'jquery': [
         'http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js',
-    ),
-    'jquery-jeditable': (
+    ],
+    'jquery-jeditable': [
         'js/jquery.jeditable.mini.js',
-    ),
-    'jquery-ui': (
+    ],
+    'jquery-ui': [
         'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js',
-    ),
-    'markitup': (
+    ],
+    'markitup': [
         'js/markitup/jquery.markitup.pack.js',
         'js/markitup/sets/markdown/set.js',
-    ),
-    'tiny_mce': (
+    ],
+    'tiny_mce': [
         'js/tiny_mce/tiny_mce.js',
         'js/tiny_mce_init_std.js',
-    ),
+    ],
+    'social': [
+        'http://platform.twitter.com/widgets.js',
+        'https://apis.google.com/js/plusone.js',
+    ],
 }
 GPP_THIRD_PARTY_CSS = {
-    'jquery-ui': (
+    'jquery-ui': [
         'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/themes/redmond/jquery-ui.css',
-    ),
-    'markitup': (
+    ],
+    'markitup': [
         'js/markitup/skins/markitup/style.css',
         'js/markitup/sets/markdown/style.css',
-    ),
+    ],
 }
 
--- a/gpp/templates/base.html	Sat Oct 15 22:04:18 2011 +0000
+++ b/gpp/templates/base.html	Tue Oct 18 00:04:37 2011 +0000
@@ -1,7 +1,10 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<html xmlns="http://www.w3.org/1999/xhtml" 
+   xmlns:og="http://ogp.me/ns#"
+   xmlns:fb="https://www.facebook.com/2008/fbml"
+   xml:lang="en" lang="en">
 {% load url from future %}
 {% load shoutbox_tags %}
 {% load irc_tags %}
@@ -17,6 +20,7 @@
 <meta name="robots" content="all" />
 <meta name="Author" content="Brian Neal" />
 <meta name="copyright" content="&copy; 2006 - 2011 Brian Neal" />
+{% block custom_meta %}{% endblock %}
 <link rel="stylesheet" href="{{ STATIC_URL }}css/blueprint/screen.css" type="text/css" media="screen, projection" />
 <link rel="stylesheet" href="{{ STATIC_URL }}css/blueprint/print.css" type="text/css" media="print" /> 
 <!--[if lt IE 8]>
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/gpp/templates/core/open_graph_meta_tag.html	Tue Oct 18 00:04:37 2011 +0000
@@ -0,0 +1,3 @@
+{% for key, val in props.items %}
+<meta property="{{ key }}" content="{{ val }}" />
+{% endfor %}
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/gpp/templates/core/social_sharing_tag.html	Tue Oct 18 00:04:37 2011 +0000
@@ -0,0 +1,13 @@
+<div class="social-sharing">
+<ul class="no-bullet-inline-block">
+<li style="vertical-align:top">
+<a href="https://twitter.com/share" class="twitter-share-button" data-text="{{ title }}" data-url="{{ url }}" data-count="horizontal" data-via="surfguitar101">Tweet</a>
+</li>
+<li style="vertical-align:top">
+<div class="g-plusone" data-size="medium" data-href="{{ url }}"></div>
+</li>
+<li style="vertical-align:top">
+<iframe src="//www.facebook.com/plugins/like.php?href={{ url|urlencode:"" }}&amp;send=false&amp;layout=button_count&amp;width=50&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowTransparency="true"></iframe>
+</li>
+</ul>
+</div>
--- a/gpp/templates/home.html	Sat Oct 15 22:04:18 2011 +0000
+++ b/gpp/templates/home.html	Tue Oct 18 00:04:37 2011 +0000
@@ -6,6 +6,7 @@
 {% load downloads_tags %}
 {% load poll_tags %}
 {% load forum_tags %}
+{% load script_tags %}
 {% load cache %}
 {% block title %}Home{% endblock %}
 {% block custom_head %}
@@ -30,6 +31,7 @@
 <style type="text/css">
 #home-slideshow img { display: none }
 </style>
+{% script_tags "social" %}
 {% endblock %}
 {% block content %}
 <h2>Welcome to SurfGuitar101!</h2>
--- a/gpp/templates/news/index.html	Sat Oct 15 22:04:18 2011 +0000
+++ b/gpp/templates/news/index.html	Tue Oct 18 00:04:37 2011 +0000
@@ -1,8 +1,12 @@
 {% extends 'news/base.html' %}
+{% load script_tags %}
 {% block title %}News: {{ title }}{% endblock %}
 {% block news_css %}
 <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/pagination.css" />
 {% endblock %}
+{% block custom_js %}
+{% script_tags "social" %}
+{% endblock %}
 {% block news_content %}
 <h3>{{ title }}</h3>
 
--- a/gpp/templates/news/story.html	Sat Oct 15 22:04:18 2011 +0000
+++ b/gpp/templates/news/story.html	Tue Oct 18 00:04:37 2011 +0000
@@ -3,7 +3,11 @@
 {% load tagging_tags %}
 {% load comment_tags %}
 {% load script_tags %}
+{% load core_tags %}
 {% block title %}News: {{ story.title }}{% endblock %}
+{% block custom_meta %}
+{% open_graph_meta_tags story %}
+{% endblock %}
 {% block news_css %}
 <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/comments.css" />
 {% endblock %}
@@ -12,6 +16,7 @@
 {% script_tags "markitup jquery-ui" %}
 <script type="text/javascript" src="{{ STATIC_URL }}js/comments.js"></script>
 {% endif %}
+{% script_tags "social" %}
 {% endblock %}
 {% block news_content %}
 <div class="solid-background">
@@ -48,6 +53,7 @@
       </ul>
    </div>
    {% endif %}
+   {% social_sharing story.title story.get_absolute_url %}
 </div>
 {% get_comment_count for story as comment_count %}
 <p>This story has <span id="comment-count">{{ comment_count }}</span> comment{{ comment_count|pluralize }}.</p>
--- a/gpp/templates/news/story_summary.html	Sat Oct 15 22:04:18 2011 +0000
+++ b/gpp/templates/news/story_summary.html	Tue Oct 18 00:04:37 2011 +0000
@@ -1,6 +1,7 @@
 {% load url from future %}
 {% load tagging_tags %}
 {% load comment_tags %}
+{% load core_tags %}
 <div class="news-story-container solid-background">
 {% if on_home %}
 <h3><a href="{{ story.get_absolute_url }}">{{ story.title }}</a></h3>
@@ -43,4 +44,5 @@
    </ul>
 </div>
 {% endif %}
+{% social_sharing story.title story.get_absolute_url %}
 </div>