wiki: Add a view source button.

r2/r2/public/static/css/wiki.less

@@ -204,4 +204,11 @@
             background-color: #5F99CF;
         }
     }
+    .source {
+        width: 100%;
+        display: none;
+    }
+    .toggle-source {
+        float: right;
+    }
 }

r2/r2/public/static/js/wiki.js

@@ -25,6 +25,12 @@ r.wiki = {
 
     init: function() {
         $('body').delegate('.wiki-page .revision_hide', 'click', this.toggleHide)
+        $('body').delegate('.wiki-page .toggle-source', 'click', this.toggleSource)
+    },
+
+    toggleSource: function(event) {
+        event.preventDefault()
+        $('.wiki-page .source').toggle('slow')
     },
 
     toggleHide: function(event) {

r2/r2/templates/wikiview.html

@@ -24,6 +24,7 @@
 
 <%!
     from r2.lib.pages import WrappedUser
+    from r2.lib.filters import SC_OFF, SC_ON
 %>
 
 %if thing.diff:
@@ -37,14 +38,18 @@
     %else:
         ${unsafe(thing.page_content)}
     %endif
+    ${unsafe(SC_OFF)}
+    <textarea readonly class="source" rows="20" cols="20">${thing.page_content_md}</textarea>
+    ${unsafe(SC_ON)}
 </p>
+<hr/>
+<em>
 %if thing.edit_date:
-    <hr/>
-    <em>
-        %if thing.edit_by:
-             ${unsafe(_("revision by&nbsp;%s") % WrappedUser(thing.edit_by).render())}
-             &mdash;&nbsp;
-        %endif
-        ${unsafe("%(time)s&nbsp;ago" % dict(time=timestamp(thing.edit_date)))}
-    </em>
+    %if thing.edit_by:
+         ${unsafe(_("revision by&nbsp;%s") % WrappedUser(thing.edit_by).render())}
+         &mdash;&nbsp;
+    %endif
+    ${unsafe("%(time)s&nbsp;ago" % dict(time=timestamp(thing.edit_date)))}
 %endif
+<a href="#" class="toggle-source">${_("view source")}</a>
+</em>