Moving the Pro blog content sections into Snipts.

blogs/templates/blogs/themes/pro-adams/base.html

@@ -24,9 +24,15 @@
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
 
-    <script type="text/javascript" src="{{ STATIC_URL }}js/pro.js"></script>
+    <script type="text/javascript" charset="utf-8">
+        {% if blog_user.profile.gittip_username %}
+            window.gittip_username = '{{ blog_user.profile.gittip_username }}';
+        {% endif %}
+    </script>
 
-    <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/pro.css?15" />
+    <script type="text/javascript" src="{{ STATIC_URL }}js/pro.js?1"></script>
+
+    <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/pro.css?16" />
 
     <link rel="shortcut icon" href="/static/images/blog-favicon.ico" >
 
@@ -67,12 +73,8 @@
                             {{ blog_user.username }}
                         {% endif %}
                     </a>
-                    {% if blog_user.username == 'nick' %}
+                    {% if header %}
-                        <p>
+                        {{ header.stylized|safe }}
-                            I'm a front-end web developer in Rochester, NY working on the <a href="http://amara.org/">Amara</a> project for <a href="http://pculture.org/">PCF</a>. I also created <a href="https://snipt.net/">Snipt</a>.
-                        </p>
-                    {% elif blog_user.username == 'ashley' %}
-                        <p>Life is like photography, we use<br />the negatives to develop.</p>
                     {% endif %}
                 </div>
             </header>
@@ -82,39 +84,9 @@
                 {% block content %}{% endblock %}
             </section>
             <aside class="main">
-                {% if blog_user.username == 'nick' %}
+                {% if sidebar %}
-                    <section class="module hire">
+                    {{ sidebar.stylized|safe }}
-                        <h1>Hire me</h1>
+                {% endif %}
-                        <p>
-                            I'm available for select freelance<br />
-                            projects. View my <a href="/work/">work</a>, then<br />
-                            <a href="mailto:nick@nicksergeant.com">email me</a>.
-                        </p>
-                        <iframe style="border: 0; margin: 0; padding: 0;" src="https://www.gittip.com/nicksergeant/widget.html" width="48pt" height="22pt"></iframe>
-                    </section>
-                    <section class="module projects">
-                        <h1>Notable projects</h1>
-                        <ul>
-                            <li><a href="https://snipt.net/">Snipt</a></li>
-                            <li><a href="http://amara.org">Amara</a></li>
-                            <li><a href="http://sidepros.com/">SidePros</a></li>
-                            <li><a href="http://elfpowered.com/">Elf Powered</a></li>
-                            <li><a href="http://afeedapart.com/">A Feed Apart</a></li>
-                            <li><a href="http://rochestermade.com">Rochester Made</a></li>
-                            <li><a href="http://refreshroc.org/">Refresh Rochester</a></li>
-                            <li class="more"><a href="/work/">View more &raquo;</a></li>
-                        </ul>
-                    </section>
-                    <section class="module places">
-                        <h1>Elsewhere</h1>
-                        <ul>
-                            <li><a href="mailto:nick@nicksergeant.com">Email</a></li>
-                            <li><a href="https://twitter.com/nicksergeant">Twitter</a></li>
-                            <li><a href="https://github.com/nicksergeant">GitHub</a></li>
-                            <li><a href="http://www.linkedin.com/in/nicksergeant">LinkedIn</a></li>
-                            <li><a href="/work/">Portfolio</a></li>
-                        </ul>
-                    </section>
                 <section class="module snipts">
                     <h1>Recent snipts</h1>
                     <ul>
@@ -123,21 +95,6 @@
                         {% endfor %}
                     </ul>
                 </section>
-                {% elif blog_user.username == 'ashley' %}
-                    <section class="module places">
-                        <h1>Elsewhere</h1>
-                        <ul>
-                            <li><a href="mailto:ashley@ashleysergeant.com">Email</a></li>
-                            <li><a href="https://twitter.com/ashleysergeant">Twitter</a></li>
-                        </ul>
-                    </section>
-                {% else %}
-                    {% if sidebar %}
-                        <section class="module places">
-                            {{ sidebar.stylized|safe }}
-                        </section>
-                    {% endif %}
-                {% endif %}
             </aside>
         </section>
     </div>

blogs/views.py

@@ -27,13 +27,13 @@ def blog_list(request, username_or_custom_slug=None):
     normal_snipts = normal_snipts.exclude(tags__name__in=['tmp'])
     normal_snipts = normal_snipts[:3]
 
-    sidebar = get_object_or_None(Snipt,
+    sidebar = get_object_or_None(Snipt, user=request.blog_user, title='Sidebar', blog_post=True)
-                                 user=request.blog_user,
+    header = get_object_or_None(Snipt, user=request.blog_user, title='Header', blog_post=True)
-                                 title='Blog Sidebar')
 
     context = {
         'blog_user': request.blog_user,
         'has_snipts': True,
+        'header': header,
         'normal_snipts': normal_snipts,
         'public': True,
         'sidebar': sidebar,
@@ -66,9 +66,8 @@ def blog_post(request, username_or_custom_slug):
                                      slug=username_or_custom_slug,
                                      )
 
-    sidebar = get_object_or_None(Snipt,
+    sidebar = get_object_or_None(Snipt, user=request.blog_user, title='Sidebar', blog_post=True)
-                                 user=request.blog_user,
+    header = get_object_or_None(Snipt, user=request.blog_user, title='Header', blog_post=True)
-                                 title='Blog Sidebar')
 
     normal_snipts = Snipt.objects.filter(blog_post=False, user=request.blog_user, public=True).order_by('-created')
     normal_snipts = normal_snipts.exclude(title__in=[''])
@@ -83,6 +82,7 @@ def blog_post(request, username_or_custom_slug):
         'blog_user': request.blog_user,
         'detail': True,
         'has_snipts': True,
+        'header': header,
         'normal_snipts': normal_snipts,
         'public': True,
         'sidebar': sidebar,

media/css/blog-themes/pro-adams/style.scss

@@ -158,7 +158,7 @@ header.main {
             color: #B7B7B7;
             font: 500 12px $Helvetica;
             line-height: 18px;
-            margin-top: 1px;
+            margin: 0;
             max-width: 340px;
 
             a {
@@ -174,6 +174,9 @@ header.main {
                     color: #666;
                 }
             }
+            &:first-of-type {
+                margin-top: 1px;
+            }
         }
     }
 }
@@ -198,16 +201,20 @@ section.main {
         padding-left: 20px;
         width: 220px;
 
-        section.module {
-            margin-bottom: 40px;
-
         h1 {
             color: #666;
             font: bold 12px $Helvetica;
             margin-bottom: 10px;
         }
+        p {
+            color: #999;
+            font: normal 12px $Helvetica;
+            line-height: 18px;
+            margin-bottom: 20px;
+        }
         ul {
-                margin: 0;
+            margin-bottom: 20px;
+            margin-left: 0;
 
             li {
                 list-style-type: none;
@@ -240,13 +247,14 @@ section.main {
                             background: #CCC;
                         }
                     }
-                    }
                     &.more {
-                        a {
                         font-size: 10px;
                         margin-left: 19px;
                         margin-top: 5px;
 
+                        &:after {
+                            content: " »";
+                        }
                         &:before {
                             display: none;
                         }
@@ -254,12 +262,6 @@ section.main {
                 }
             }
         }
-            p {
-                color: #999;
-                font: normal 12px $Helvetica;
-                line-height: 18px;
-            }
-        }
     }
 }
 div.pagination {

media/js/pro.js

@@ -0,0 +1,17 @@
+$(function() {
+
+    var $aside = $('aside');
+
+    // Convert "View more" links into nicer links.
+    $('a:contains("View more")', $aside).addClass('more');
+
+    // Populate any GitTip widgets.
+    if (window.gittip_username) {
+        $aside.html($aside.html().replace(
+           '[[ gittip ]]',
+           '<iframe style="border: 0; margin: 0; padding: 0;" src="https://www.gittip.com/' + window.gittip_username + '/widget.html" width="48pt" height="22pt"></iframe>')
+        );
+        $('iframe', $aside).parent('p').prev('p').css('margin-bottom', '10px');
+    }
+
+});

media/js/src/pro.js

@@ -0,0 +1,17 @@
+$(function() {
+
+    var $aside = $('aside');
+
+    // Convert "View more" links into nicer links.
+    $('a:contains("View more")', $aside).addClass('more');
+
+    // Populate any GitTip widgets.
+    if (window.gittip_username) {
+        $aside.html($aside.html().replace(
+           '[[ gittip ]]',
+           '<iframe style="border: 0; margin: 0; padding: 0;" src="https://www.gittip.com/' + window.gittip_username + '/widget.html" width="48pt" height="22pt"></iframe>')
+        );
+        $('iframe', $aside).parent('p').prev('p').css('margin-bottom', '10px');
+    }
+
+});

media/js/src/pro.min.js

@@ -0,0 +1,2 @@
+
+$(function(){var $aside=$('aside');$('a:contains("View more")',$aside).addClass('more');if(window.gittip_username){$aside.html($aside.html().replace('[[ gittip ]]','<iframe style="border: 0; margin: 0; padding: 0;" src="https://www.gittip.com/'+window.gittip_username+'/widget.html" width="48pt" height="22pt"></iframe>'));$('iframe',$aside).parent('p').prev('p').css('margin-bottom','10px');}});

templates/base.html

@@ -19,7 +19,7 @@
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
 
-    <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/snipt.css?51" />
+    <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/snipt.css?52" />
 
     {% if has_snipts and not detail %}
         <link rel="alternate" type="application/rss+xml" title="RSS" href="{{ request.path }}?rss{% if not public %}&amp;api_key={{ request.user.api_key.key }}{% endif %}" />
@@ -346,7 +346,7 @@
         </div>
     {% endblock %}
 
-    <script type="text/javascript" src="{{ STATIC_URL }}js/snipt.js?35"></script>
+    <script type="text/javascript" src="{{ STATIC_URL }}js/snipt.js?36"></script>
     {% block extra-scripts %}{% endblock %}
 
     {% block inline-js %}