From 79aa9b9a0a2edb58bb58b53d3dee096b35ac74b4 Mon Sep 17 00:00:00 2001
From: Nick Sergeant <nick@nicksergeant.com>
Date: Fri, 1 Jun 2012 21:05:25 -0400
Subject: [PATCH] Blogs

---
 .../templates/blogs/themes/default/base.html  |   5 +
 .../templates/blogs/themes/default/list.html  |  22 ++
 .../blogs/themes/default/snipt-list.html      |   6 +
 blogs/views.py                                |  28 ++-
 media/css/blog-themes/default/style.scss      | 196 +++++++++++++++---
 media/css/style.css                           | 175 +++++++++++++---
 snipts/models.py                              |   3 +
 snipts/templates/snipts/snipt-list.html       |   1 +
 snipts/views.py                               |   2 +-
 9 files changed, 372 insertions(+), 66 deletions(-)

diff --git a/blogs/templates/blogs/themes/default/base.html b/blogs/templates/blogs/themes/default/base.html
index 534d65f..ef0ee4f 100644
--- a/blogs/templates/blogs/themes/default/base.html
+++ b/blogs/templates/blogs/themes/default/base.html
@@ -46,6 +46,11 @@
                 {% endif %}
             </a>
         </h1>
+        {% if has_posts %}
+            <h2 class="blog-title">
+                &raquo; <a href="/blog/">Blog</a>
+            </h2>
+        {% endif %}
         {% block content %}{% endblock %}
     </section>
 {% endblock %}
diff --git a/blogs/templates/blogs/themes/default/list.html b/blogs/templates/blogs/themes/default/list.html
index 9bf4bda..81c5147 100644
--- a/blogs/templates/blogs/themes/default/list.html
+++ b/blogs/templates/blogs/themes/default/list.html
@@ -2,6 +2,8 @@
 
 {% load compress pagination_tags %}
 
+{% block body-class %}{{ block.super }} blog-list{% endblock %}
+
 {% block js %}
         {{ block.super }}
         window.detail = false;
@@ -18,6 +20,26 @@
             </div>
         {% endfor %}
         {% paginate %}
+        {% if single_blog_post %}
+            {% with snipts.0 as snipt %}
+            <div id="disqus_thread"></div>
+            <script type="text/javascript">
+                var disqus_shortname = 'snipt-net';
+                {% if debug %}
+                    var disqus_developer = 1;
+                {% endif %}
+                var disqus_url = '//{{ request.META.HTTP_HOST }}{{ request.path }}';
+                var disqus_title = '{{ snipt.title }}';
+                var disqus_identifier = {{ snipt.id }};
+
+                (function() {
+                    var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
+                    dsq.src = 'https://' + disqus_shortname + '.disqus.com/embed.js';
+                    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
+                })();
+            </script>
+            {% endwith %}
+        {% endif %}
     </section>
     <script type="text/javascript" id="disqus">
         var disqus_shortname = 'snipt-net';
diff --git a/blogs/templates/blogs/themes/default/snipt-list.html b/blogs/templates/blogs/themes/default/snipt-list.html
index 476db02..e0618c4 100644
--- a/blogs/templates/blogs/themes/default/snipt-list.html
+++ b/blogs/templates/blogs/themes/default/snipt-list.html
@@ -1,3 +1,9 @@
 {% extends "snipts/snipt-list.html" %}
 
+{% load humanize %}
+
 {% block author %}{% endblock %}
+
+{% block extra-snipt-header %}
+    <h3>{{ snipt.publish_date|naturalday }}</h3>
+{% endblock %}
diff --git a/blogs/views.py b/blogs/views.py
index 9c58d90..b0cbce3 100644
--- a/blogs/views.py
+++ b/blogs/views.py
@@ -14,20 +14,24 @@ def blog_homepage(request):
         return blog_list(request)
 
     context = {
-        'homepage': homepage,
         'blog_user': request.blog_user,
+        'homepage': homepage,
     }
 
     return context
 
 @render_to('blogs/themes/default/list.html')
-def blog_list(request):
+def blog_list(request, username_or_custom_slug=None):
+
+    if username_or_custom_slug and username_or_custom_slug != 'blog':
+        return blog_post(request, username_or_custom_slug)
 
     snipts = Snipt.objects.filter(user=request.blog_user, blog_post=True, public=True).order_by('-created').exclude(title__iexact='Homepage')
 
     context = {
-        'snipts': snipts,
         'blog_user': request.blog_user,
+        'has_posts': True,
+        'snipts': snipts,
     }
 
     if 'rss' in request.GET:
@@ -36,6 +40,24 @@ def blog_list(request):
 
     return context
 
+@render_to('blogs/themes/default/list.html')
+def blog_post(request, username_or_custom_slug):
+
+    snipts = Snipt.objects.filter(user=request.blog_user,
+                                  blog_post=True,
+                                  public=True,
+                                  slug=username_or_custom_slug,
+                                  ).order_by('-created').exclude(title__iexact='Homepage')
+
+    context = {
+        'blog_user': request.blog_user,
+        'has_posts': True,
+        'single_blog_post': True,
+        'snipts': snipts,
+    }
+
+    return context
+
 def rss(request, context):
     return render_to_response(
             'rss.xml',
diff --git a/media/css/blog-themes/default/style.scss b/media/css/blog-themes/default/style.scss
index a4c10ce..f00581e 100644
--- a/media/css/blog-themes/default/style.scss
+++ b/media/css/blog-themes/default/style.scss
@@ -1,35 +1,3 @@
-body.blog-site {
-    margin: 0;
-
-    section.frame {
-        margin: 0 auto;
-        padding-top: 50px;
-        width: 500px;
-    }
-    h1.blog-title {
-        font-size: 34px;
-        margin-bottom: 50px;
-        margin-top: 0;
-
-        a {
-            color: #0094AF;
-            font-weight: normal;
-            text-decoration: none;
-        }
-    } 
-    header.main {
-        background: none;
-        border-bottom: 0;
-        height: auto;
-        margin: 0 auto;
-        width: 940px;
-
-        h1 {
-            margin: 0;
-            padding: 29px 0 0 15px;
-        }
-    }
-}
 // Fonts
 $Helvetica: 'Helvetica Neue', Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
 $Consolas: Consolas, Menlo, "Courier New", monospace;
@@ -114,14 +82,74 @@ body {
 body {
     color: #B3B3B3;
     font: normal 17px/24px $Helvetica;
+    margin: 0;
 
+    section.frame {
+        margin: 0 auto;
+        padding-top: 50px;
+        width: 610px;
+    }
+    a {
+        color: #0094AF;
+
+        &:hover {
+            color: #006577;
+            text-decoration: none;
+        }
+    }
     h1.blog-title {
+        display: inline-block;
+        font-size: 34px;
         line-height: 24px;
+        margin-top: 0;
+
+        a {
+            color: #0094AF;
+            font-weight: normal;
+            text-decoration: none;
+            verticsal-align: -1px;
+
+            &:hover {
+                color: #006577;
+            }
+        }
+    }
+    h2.blog-title {
+        display: inline-block;
+        font-weight: normal;
+        margin-left: 10px;
+        vertical-align: 1px;
+        
+        a {
+            color: #0094AF;
+            margin-left: 5px;
+
+            &:hover {
+                color: #006577;
+                text-decoration: none;
+            }
+        }
+    }
+    header.main {
+        background: none;
+        border-bottom: 0;
+        height: auto;
+        margin: 0 auto;
+        width: 940px;
+
+        h1 {
+            margin: 0;
+            padding: 29px 0 0 15px;
+        }
     }
 }
 body.blog-homepage {
     padding-bottom: 39px;
 
+    h1.blog-title {
+        margin-bottom: 24px;
+        margin-top: 4px;
+    }
     p {
         font: normal 17px/24px $Helvetica;
         margin: 17px 0;
@@ -143,3 +171,107 @@ body.blog-homepage {
         }
     }
 }
+article.snipt {
+    border-top: 1px solid #C9C6C7;
+    margin: 45px 0;
+    padding-top: 45px;
+
+    div.number {
+        display: none;
+    }
+    div.container {
+        width: auto;
+
+        header {
+            h1 {
+                font-size: 20px;
+                line-height: 26px;
+
+                a {
+                    color: #0088CC;
+
+                    &:hover {
+                        color: #006BA0;
+                    }
+                }
+            }
+            h2 {
+                display: none;
+            }
+            h3 {
+                font-size: 16px;
+                font-weight: normal;
+                margin-bottom: 20px;
+            }
+        }
+        section.code {
+            background: transparent;
+
+            div.markdown {
+                p {
+                    font: normal 17px/24px $Helvetica;
+                    line-height: 24px;
+                }
+                li {
+                    line-height: 24px;
+                    margin: 5px 15px;
+                }
+                div.highlight {
+                    margin: 20px 0;
+                }
+            }
+            div.highlight {
+                pre {
+                    background: #FFF;
+                }
+            }
+            a.expand {
+                display: none;
+            }
+        }
+        textarea.raw {
+            display: none;
+        }
+    }
+    aside {
+        section.tags {
+            display: none;
+        }
+        ul.options {
+            display: none;
+        }
+    }
+    footer {
+        display: none;
+    }
+}
+div#disqus_thread {
+    margin-bottom: 0;
+    margin-left: 15px;
+    margin-top: 60px;
+    width: 610px;
+
+    #dsq-content {
+        margin-top: -38px;
+
+        #dsq-global-toolbar {
+            margin-bottom: 18px;
+            margin-top: 0;
+        }
+        #dsq-sort-by {
+            display: none;
+        }
+        .dsq-comment-text {
+            color: #666;
+        }
+        h3 {
+            display: none;
+        }
+        .dsq-textarea-wrapper {
+            overflow: hidden;
+        }
+    }
+    #dsq-footer {
+        display: none;
+    }
+}
diff --git a/media/css/style.css b/media/css/style.css
index f905276..899bd8a 100644
--- a/media/css/style.css
+++ b/media/css/style.css
@@ -1,33 +1,3 @@
-body.blog-site {
-  margin: 0;
-}
-body.blog-site section.frame {
-  margin: 0 auto;
-  padding-top: 50px;
-  width: 500px;
-}
-body.blog-site h1.blog-title {
-  font-size: 34px;
-  margin-bottom: 50px;
-  margin-top: 0;
-}
-body.blog-site h1.blog-title a {
-  color: #0094AF;
-  font-weight: normal;
-  text-decoration: none;
-}
-body.blog-site header.main {
-  background: none;
-  border-bottom: 0;
-  height: auto;
-  margin: 0 auto;
-  width: 940px;
-}
-body.blog-site header.main h1 {
-  margin: 0;
-  padding: 29px 0 0 15px;
-}
-
 html, body {
   background: #f5f2f3 url("/static/images/bg.gif") top left repeat;
 }
@@ -56,14 +26,68 @@ body li {
 body {
   color: #B3B3B3;
   font: normal 17px/24px "Helvetica Neue", Helvetica, Arial, "Liberation Sans", FreeSans, sans-serif;
+  margin: 0;
+}
+body section.frame {
+  margin: 0 auto;
+  padding-top: 50px;
+  width: 610px;
+}
+body a {
+  color: #0094AF;
+}
+body a:hover {
+  color: #006577;
+  text-decoration: none;
 }
 body h1.blog-title {
+  display: inline-block;
+  font-size: 34px;
   line-height: 24px;
+  margin-top: 0;
+}
+body h1.blog-title a {
+  color: #0094AF;
+  font-weight: normal;
+  text-decoration: none;
+  verticsal-align: -1px;
+}
+body h1.blog-title a:hover {
+  color: #006577;
+}
+body h2.blog-title {
+  display: inline-block;
+  font-weight: normal;
+  margin-left: 10px;
+  vertical-align: 1px;
+}
+body h2.blog-title a {
+  color: #0094AF;
+  margin-left: 5px;
+}
+body h2.blog-title a:hover {
+  color: #006577;
+  text-decoration: none;
+}
+body header.main {
+  background: none;
+  border-bottom: 0;
+  height: auto;
+  margin: 0 auto;
+  width: 940px;
+}
+body header.main h1 {
+  margin: 0;
+  padding: 29px 0 0 15px;
 }
 
 body.blog-homepage {
   padding-bottom: 39px;
 }
+body.blog-homepage h1.blog-title {
+  margin-bottom: 24px;
+  margin-top: 4px;
+}
 body.blog-homepage p {
   font: normal 17px/24px "Helvetica Neue", Helvetica, Arial, "Liberation Sans", FreeSans, sans-serif;
   margin: 17px 0;
@@ -83,3 +107,94 @@ body.blog-homepage a:hover {
   color: #292929;
   text-decoration: none;
 }
+
+article.snipt {
+  border-top: 1px solid #C9C6C7;
+  margin: 45px 0;
+  padding-top: 45px;
+}
+article.snipt div.number {
+  display: none;
+}
+article.snipt div.container {
+  width: auto;
+}
+article.snipt div.container header h1 {
+  font-size: 20px;
+  line-height: 26px;
+}
+article.snipt div.container header h1 a {
+  color: #0088CC;
+}
+article.snipt div.container header h1 a:hover {
+  color: #006BA0;
+}
+article.snipt div.container header h2 {
+  display: none;
+}
+article.snipt div.container header h3 {
+  font-size: 16px;
+  font-weight: normal;
+  margin-bottom: 20px;
+}
+article.snipt div.container section.code {
+  background: transparent;
+}
+article.snipt div.container section.code div.markdown p {
+  font: normal 17px/24px "Helvetica Neue", Helvetica, Arial, "Liberation Sans", FreeSans, sans-serif;
+  line-height: 24px;
+}
+article.snipt div.container section.code div.markdown li {
+  line-height: 24px;
+  margin: 5px 15px;
+}
+article.snipt div.container section.code div.markdown div.highlight {
+  margin: 20px 0;
+}
+article.snipt div.container section.code div.highlight pre {
+  background: #FFF;
+}
+article.snipt div.container section.code a.expand {
+  display: none;
+}
+article.snipt div.container textarea.raw {
+  display: none;
+}
+article.snipt aside section.tags {
+  display: none;
+}
+article.snipt aside ul.options {
+  display: none;
+}
+article.snipt footer {
+  display: none;
+}
+
+div#disqus_thread {
+  margin-bottom: 0;
+  margin-left: 15px;
+  margin-top: 60px;
+  width: 610px;
+}
+div#disqus_thread #dsq-content {
+  margin-top: -38px;
+}
+div#disqus_thread #dsq-content #dsq-global-toolbar {
+  margin-bottom: 18px;
+  margin-top: 0;
+}
+div#disqus_thread #dsq-content #dsq-sort-by {
+  display: none;
+}
+div#disqus_thread #dsq-content .dsq-comment-text {
+  color: #666;
+}
+div#disqus_thread #dsq-content h3 {
+  display: none;
+}
+div#disqus_thread #dsq-content .dsq-textarea-wrapper {
+  overflow: hidden;
+}
+div#disqus_thread #dsq-footer {
+  display: none;
+}
diff --git a/snipts/models.py b/snipts/models.py
index f7a86e3..db075e2 100644
--- a/snipts/models.py
+++ b/snipts/models.py
@@ -99,6 +99,9 @@ class Snipt(models.Model):
         if self.custom_slug:
             return '/{}/'.format(self.custom_slug)
 
+        if self.blog_post:
+            return '/{}/'.format(self.slug)
+
         if self.public:
             return '/{}/{}/'.format(self.user.username, self.slug)
         else:
diff --git a/snipts/templates/snipts/snipt-list.html b/snipts/templates/snipts/snipt-list.html
index 959204f..33c8a8e 100644
--- a/snipts/templates/snipts/snipt-list.html
+++ b/snipts/templates/snipts/snipt-list.html
@@ -9,6 +9,7 @@
             <header>
                 <h2>{{ snipt.lexer_name }}</h2>
                 <h1><a href="{{ snipt.get_absolute_url }}">{% if snipt.title %}{{ snipt.title }}{% else %}Untitled{% endif %}</a></h1>
+                {% block extra-snipt-header %}{% endblock %}
             </header>
             <section class="code {% if request.GET.style %}{{ request.GET.style }}{% else %}autumn{% endif %}">
                 {% if snipt.lexer == 'markdown' %}
diff --git a/snipts/views.py b/snipts/views.py
index 5006774..6d77a5c 100644
--- a/snipts/views.py
+++ b/snipts/views.py
@@ -109,7 +109,7 @@ def list_public(request, tag_slug=None):
 def list_user(request, username_or_custom_slug, tag_slug=None):
 
     if request.blog_user:
-        return blog_list(request)
+        return blog_list(request, username_or_custom_slug)
 
     user = get_object_or_None(User, username=username_or_custom_slug)