From 923d1676d58b457e58f78f6844fb24c1b6546dff Mon Sep 17 00:00:00 2001
From: Nick Sergeant <nick@nicksergeant.com>
Date: Thu, 16 Feb 2012 12:01:31 -0500
Subject: [PATCH] Pulling out snipt/list.html and working on edit.

---
 snipt/media/css/style.scss                    |  2 +-
 snipt/media/js/src/modules/snipt.js           | 12 +++----
 snipt/snipts/templates/snipts/detail.html     |  2 +-
 .../snipts/templates/snipts/list-public.html  | 31 +------------------
 snipt/snipts/templates/snipts/list-user.html  | 29 +----------------
 snipt/snipts/templates/snipts/list.html       | 28 +++++++++++++++++
 snipt/templates/base.html                     | 15 ++++-----
 7 files changed, 46 insertions(+), 73 deletions(-)
 create mode 100644 snipt/snipts/templates/snipts/list.html

diff --git a/snipt/media/css/style.scss b/snipt/media/css/style.scss
index 8ebfa49..e1bc172 100644
--- a/snipt/media/css/style.scss
+++ b/snipt/media/css/style.scss
@@ -769,7 +769,7 @@ article.snipt {
 article.private-snipt {
     div.container {
         header {
-            @include vertical-gradient-with-image(#FFF, #FFFAF2, url('/media/images/private-icon.png') top right no-repeat);
+            @include vertical-gradient-with-image(url('/media/images/private-icon.png') top right no-repeat, #FFF, #FFFAF2);
 
             h1 {
                 a {
diff --git a/snipt/media/js/src/modules/snipt.js b/snipt/media/js/src/modules/snipt.js
index 6ed7ebc..58036b0 100644
--- a/snipt/media/js/src/modules/snipt.js
+++ b/snipt/media/js/src/modules/snipt.js
@@ -86,10 +86,10 @@
         },
         edit: function() {
             if (!$('section.main-edit:visible').length) {
+                this.select();
                 var editPane = this.editTemplate(this.model.toJSON());
-                $main = $('section.main');
-                $main.hide();
-                $main.after(editPane);
+                $('section#main').hide();
+                $('section#main-edit').html(editPane).show();
             }
             return false;
         },
@@ -208,9 +208,9 @@
                 }
             });
             $document.bind('keydown', 'esc', function() {
-                if ($('section.main-edit:visible').length) {
-                    $('section.main-edit').remove();
-                    $('section.main').show();
+                if ($('section#main-edit:visible').length) {
+                    $('section#main-edit').hide();
+                    $('section#main').show();
                     $('html, body').animate({
                         scrollTop: $selected.offset().top - 50
                     }, 0);
diff --git a/snipt/snipts/templates/snipts/detail.html b/snipt/snipts/templates/snipts/detail.html
index 4108d93..90b5544 100644
--- a/snipt/snipts/templates/snipts/detail.html
+++ b/snipt/snipts/templates/snipts/detail.html
@@ -1,6 +1,6 @@
 {% extends "base.html" %}
 
-{% block page-title %}/ {{ user.username }} / {{ snipt.title }} - {{ block.super }}{% endblock %}
+{% block page-title %}/ {{ snipt.title }} / {{ user.username }} - {{ block.super }}{% endblock %}
 {% block body-class %}detail{% endblock %}
 
 {% block breadcrumb %}
diff --git a/snipt/snipts/templates/snipts/list-public.html b/snipt/snipts/templates/snipts/list-public.html
index 81c3a11..48da64c 100644
--- a/snipt/snipts/templates/snipts/list-public.html
+++ b/snipt/snipts/templates/snipts/list-public.html
@@ -1,8 +1,4 @@
-{% extends "base.html" %}
-
-{% load pagination_tags %}
-
-{% block page-title %}/ public{% if tag %} / {{ tag }}{% endif %} - {{ block.super }}{% endblock %}
+{% extends "snipts/list.html" %}
 
 {% block breadcrumb %}
     <li><a href="/public/">public</a></li>
@@ -14,28 +10,3 @@
 {% block tags %}
     {% include "snipts/tags-public.html" %}
 {% endblock %}
-
-{% block content %}
-    <section class="snipts" id="snipts">
-        {% with public='true' %}
-            {% autopaginate snipts 20 %}
-            {% for snipt in snipts %}
-                {% include "snipts/snipt-list.html" %}
-            {% endfor %}
-            {% paginate %}
-        {% endwith %}
-    </section>
-    <script type="text/javascript">
-        var disqus_shortname = 'snipt-net';
-        {% if debug %}
-            var disqus_developer = 1;
-        {% endif %}
-
-        (function () {
-            var s = document.createElement('script'); s.async = true;
-            s.type = 'text/javascript';
-            s.src = 'http://' + disqus_shortname + '.disqus.com/count.js';
-            (document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
-        }());
-    </script>
-{% endblock %}
diff --git a/snipt/snipts/templates/snipts/list-user.html b/snipt/snipts/templates/snipts/list-user.html
index 7e0eed2..3870235 100644
--- a/snipt/snipts/templates/snipts/list-user.html
+++ b/snipt/snipts/templates/snipts/list-user.html
@@ -1,8 +1,4 @@
-{% extends "base.html" %}
-
-{% load pagination_tags %}
-
-{% block page-title %}/ {{ user.username }}{% if tag %} / {{ tag }}{% endif %} - {{ block.super }}{% endblock %}
+{% extends "snipts/list.html" %}
 
 {% block breadcrumb %}
     <li><a href="/{{ user.username }}/">{{ user.username }}</a></li>
@@ -14,26 +10,3 @@
 {% block tags %}
     {% include "snipts/tags-user.html" %}
 {% endblock %}
-
-{% block content %}
-    <section class="snipts" id="snipts">
-        {% autopaginate snipts 20 %}
-        {% for snipt in snipts %}
-            {% include "snipts/snipt-list.html" %}
-        {% endfor %}
-        {% paginate %}
-    </section>
-    <script type="text/javascript">
-        var disqus_shortname = 'snipt-net';
-        {% if debug %}
-            var disqus_developer = 1;
-        {% endif %}
-
-        (function () {
-            var s = document.createElement('script'); s.async = true;
-            s.type = 'text/javascript';
-            s.src = 'http://' + disqus_shortname + '.disqus.com/count.js';
-            (document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
-        }());
-    </script>
-{% endblock %}
diff --git a/snipt/snipts/templates/snipts/list.html b/snipt/snipts/templates/snipts/list.html
new file mode 100644
index 0000000..fa335bc
--- /dev/null
+++ b/snipt/snipts/templates/snipts/list.html
@@ -0,0 +1,28 @@
+{% extends "base.html" %}
+
+{% load pagination_tags %}
+
+{% block page-title %}/ {% if public %}public{% else %}{{ user.username }}{% endif %}{% if tag %} / {{ tag }}{% endif %} - {{ block.super }}{% endblock %}
+
+{% block content %}
+    <section class="snipts" id="snipts">
+        {% autopaginate snipts 20 %}
+        {% for snipt in snipts %}
+            {% include "snipts/snipt-list.html" %}
+        {% endfor %}
+        {% paginate %}
+    </section>
+    <script type="text/javascript">
+        var disqus_shortname = 'snipt-net';
+        {% if debug %}
+            var disqus_developer = 1;
+        {% endif %}
+
+        (function () {
+            var s = document.createElement('script'); s.async = true;
+            s.type = 'text/javascript';
+            s.src = 'http://' + disqus_shortname + '.disqus.com/count.js';
+            (document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
+        }());
+    </script>
+{% endblock %}
diff --git a/snipt/templates/base.html b/snipt/templates/base.html
index c38ffbe..db6adce 100644
--- a/snipt/templates/base.html
+++ b/snipt/templates/base.html
@@ -96,7 +96,7 @@
             </div>
         </header>
     {% endblock %}
-    <section class="main group">
+    <section class="main group" id="main">
         <div class="inner">
             {% block content %}{% endblock %}
         </div>
@@ -132,6 +132,9 @@
         <div class="left-y ruler"></div>
         <div class="right-y ruler"></div>
     </section>
+    {% if snipts or snipt %}
+        <section class="main group hidden" id="main-edit"></section>
+    {% endif %}
     <div class="modal hide" id="keyboard-shortcuts">
         <div class="modal-header">
             <a href="#" class="close">×</a>
@@ -245,12 +248,10 @@
                     </div>
                 </div>
                 <div id="edit">
-                    <section class="main main-edit">
-                        <div class="inner">
-                            {{url}}<br />
-                            {{title}}
-                        </div>
-                    </section>
+                    <div class="inner">
+                        {{url}}<br />
+                        {{title}}
+                    </div>
                 </div>
             </div>
         {% endverbatim %}