From 8825ef093010ac0413902ee19a99aed340c564d2 Mon Sep 17 00:00:00 2001
From: Martin Mahner <martin@mahner.org>
Date: Mon, 27 May 2019 09:55:39 +0200
Subject: [PATCH] Raw view improvements, copy snippet button, hide edit panel.
 #120

---
 CHANGELOG.rst                              |  8 +++++
 client/js/dpaste.js                        | 37 ++++++++++++++++++++--
 client/scss/components/_form.scss          |  5 +++
 client/scss/components/_header.scss        |  7 ++++
 dpaste/apps.py                             |  4 +++
 dpaste/templates/dpaste/details.html       | 19 ++++++++---
 dpaste/templates/dpaste/includes/form.html |  1 +
 dpaste/templates/dpaste/raw.html           | 13 ++++++++
 dpaste/views.py                            | 11 ++++++-
 9 files changed, 97 insertions(+), 8 deletions(-)
 create mode 100644 dpaste/templates/dpaste/raw.html

diff --git a/CHANGELOG.rst b/CHANGELOG.rst
index 823efbf..906ad30 100644
--- a/CHANGELOG.rst
+++ b/CHANGELOG.rst
@@ -1,6 +1,14 @@
 Changelog
 =========
 
+(development)
+-------------
+
+- "Edit Snippet" panel is now hidden by default to remove visual noise.
+- Added a dedicated "Copy Snippet" button to copy the content to the clipboard.
+- Added "View Raw" option to optionally render the 'raw' snippet content with a
+  template rather served as plain text. This was added to hinder abuse.
+
 3.1 (2019-05-16)
 ----------------
 
diff --git a/client/js/dpaste.js b/client/js/dpaste.js
index f03d890..c75d32c 100644
--- a/client/js/dpaste.js
+++ b/client/js/dpaste.js
@@ -102,12 +102,43 @@ lines.forEach(function(el) {
 // Copy URL to Clipboard
 // -----------------------------------------------------------------------------
 const clipboardLink = document.getElementById('copyToClipboard');
-const copyToClipboardField = document.getElementById('copyToClipboardField');
+const clipboardField = document.getElementById('copyToClipboardField');
 
-if (clipboardLink && copyToClipboardField) {
+if (clipboardLink && clipboardField) {
   clipboardLink.onclick = function(e) {
     e.preventDefault();
-    copyToClipboardField.select();
+    clipboardField.select();
     document.execCommand('Copy');
   };
 }
+
+// -----------------------------------------------------------------------------
+// Copy Snippet content to Clipboard
+// -----------------------------------------------------------------------------
+const snippetClipboardLink = document.getElementById('copySnippetToClipboard');
+const snippetClipboardField = document.getElementById('copySnippetSource');
+const snippetClipboardConfirm = document.getElementById('copy');
+
+if (snippetClipboardLink && snippetClipboardField) {
+  snippetClipboardLink.onclick = function(e) {
+    e.preventDefault();
+    snippetClipboardField.select();
+    document.execCommand('Copy');
+    snippetClipboardConfirm.style.maxHeight = '80px';
+    window.scrollTo(0, 0);
+  };
+}
+
+const editSnippetLink = document.getElementById('editSnippet');
+const editSnippetForm = document.getElementById('edit');
+
+if (editSnippetLink && editSnippetForm) {
+  editSnippetLink.onclick = function(e) {
+    e.preventDefault();
+    editSnippetForm.style.display = 'block';
+    window.scrollTo(
+        editSnippetForm.getBoundingClientRect().x,
+        editSnippetForm.getBoundingClientRect().y
+    );
+  };
+}
\ No newline at end of file
diff --git a/client/scss/components/_form.scss b/client/scss/components/_form.scss
index cf40fc1..1a602cb 100644
--- a/client/scss/components/_form.scss
+++ b/client/scss/components/_form.scss
@@ -5,6 +5,11 @@
   line-height: 17px;
 }
 
+// Edit panel in details view, not shown by default.
+#edit {
+  display: none;
+}
+
 .snippet-form {
   background-color: $bgColor;
 
diff --git a/client/scss/components/_header.scss b/client/scss/components/_header.scss
index a606f88..8da269b 100644
--- a/client/scss/components/_header.scss
+++ b/client/scss/components/_header.scss
@@ -133,3 +133,10 @@ ul#snippetOptions {
   font-size: 14px;
   font-weight: $baseFontDemiBold;
 }
+
+// Textarea that holds the unaltered snippet content to be copied to clipboard
+#copySnippetSource {
+  width: 0;
+  position: absolute;
+  left: -9999px;
+}
diff --git a/dpaste/apps.py b/dpaste/apps.py
index 7e34f80..8c743c0 100644
--- a/dpaste/apps.py
+++ b/dpaste/apps.py
@@ -77,6 +77,10 @@ class dpasteAppConfig(AppConfig):
     # Disable "view Raw" mode.
     RAW_MODE_ENABLED = True
 
+    # If enabled, the "raw View" mode will display the snippet content as
+    # plain text rather rendered in a template.
+    RAW_MODE_PLAIN_TEXT = True
+
     # Lexers which have wordwrap enabled by default
     LEXER_WORDWRAP = ('rst',)
 
diff --git a/dpaste/templates/dpaste/details.html b/dpaste/templates/dpaste/details.html
index 035bd9c..305402e 100644
--- a/dpaste/templates/dpaste/details.html
+++ b/dpaste/templates/dpaste/details.html
@@ -36,6 +36,9 @@
     {% if raw_mode and snippet.expire_type != 3 %}
       <li><a href="{% url "snippet_details_raw" snippet.secret_id %}">{% trans "View Raw" %}</a></li>
     {% endif %}
+    <textarea id="copySnippetSource">{{ snippet.content }}</textarea>
+    <li><a href="#copy" id="copySnippetToClipboard">{% trans "Copy Snippet" %}</a></li>
+    <li><a href="#edit" id="editSnippet">{% trans "Edit Snippet" %}</a></li>
     {% if snippet.lexer != 'text' %}
       <li>
         <label for="wordwrap">
@@ -45,6 +48,12 @@
     {% endif %}
   </ul>
 
+  <div id="copy" class="confirm-modal">
+    <form method="POST" action="">
+      {% trans "Snippet content copied to clipboard." %}
+    </form>
+  </div>
+
   <div id="delete" class="confirm-modal">
     <form method="POST" action="">
       {% csrf_token %}
@@ -77,9 +86,11 @@
 
   {{ snippet.highlight }}
 
-  <header class="sub">
-    <h2>{% trans "Edit this Snippet" %}</h2>
-  </header>
+  <div id="edit">
+    <header class="sub">
+      <h2>{% trans "Edit this Snippet" %}</h2>
+    </header>
 
-  {% include "dpaste/includes/form.html" %}
+    {% include "dpaste/includes/form.html" %}
+  </div>
 {% endblock %}
diff --git a/dpaste/templates/dpaste/includes/form.html b/dpaste/templates/dpaste/includes/form.html
index 876a6f3..bc063e1 100644
--- a/dpaste/templates/dpaste/includes/form.html
+++ b/dpaste/templates/dpaste/includes/form.html
@@ -37,3 +37,4 @@
     {{ form.content }}
   </p>
 </form>
+
diff --git a/dpaste/templates/dpaste/raw.html b/dpaste/templates/dpaste/raw.html
new file mode 100644
index 0000000..3f3f386
--- /dev/null
+++ b/dpaste/templates/dpaste/raw.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>{{ snippet.secret_id }}</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+  <meta name="robots" content="noindex, nofollow"/>
+</head>
+<body>
+
+<pre>{{ object.content }}</pre>
+
+</body>
+</html>
diff --git a/dpaste/views.py b/dpaste/views.py
index b4dac05..aeac554 100644
--- a/dpaste/views.py
+++ b/dpaste/views.py
@@ -152,6 +152,8 @@ class SnippetRawView(SnippetDetailView):
     Display the raw content of a snippet
     """
 
+    template_name = 'dpaste/raw.html'
+
     def dispatch(self, request, *args, **kwargs):
         if not config.RAW_MODE_ENABLED:
             return HttpResponseForbidden(
@@ -161,13 +163,20 @@ class SnippetRawView(SnippetDetailView):
             )
         return super(SnippetRawView, self).dispatch(request, *args, **kwargs)
 
-    def render_to_response(self, context, **response_kwargs):
+    def render_plain_text(self, context, **response_kwargs):
         snippet = self.get_object()
         response = HttpResponse(snippet.content)
         response['Content-Type'] = 'text/plain;charset=UTF-8'
         response['X-Content-Type-Options'] = 'nosniff'
         return response
 
+    def render_to_response(self, context, **response_kwargs):
+        if config.RAW_MODE_PLAIN_TEXT:
+            return self.render_plain_text(config, **response_kwargs)
+        return super(SnippetRawView, self).render_to_response(
+            context, **response_kwargs
+        )
+
 
 class SnippetHistory(TemplateView):
     """