From 3aa06d30e0f5cbe9430935d7af6bb42856c56890 Mon Sep 17 00:00:00 2001
From: Martin Mahner <martin@mahner.org>
Date: Fri, 1 Sep 2017 18:57:06 +0200
Subject: [PATCH] 100% vanilla JS now.

---
 dpaste/static/dpaste/theme.css               |   6 +-
 dpaste/templates/dpaste/base.html            |  25 ++++
 dpaste/templates/dpaste/highlight/code.html  |   2 +-
 dpaste/templates/dpaste/snippet_details.html | 113 ++++++-------------
 dpaste/templates/dpaste/snippet_form.html    |  24 ----
 5 files changed, 65 insertions(+), 105 deletions(-)

diff --git a/dpaste/static/dpaste/theme.css b/dpaste/static/dpaste/theme.css
index ddf08c5..a1b4f83 100644
--- a/dpaste/static/dpaste/theme.css
+++ b/dpaste/static/dpaste/theme.css
@@ -137,12 +137,12 @@ h1, h2, h3, h4 {
     margin-top: 30px;
 }
 
-.snippet-reply-hidden {
+.snippet-reply[data-hidden=yes] {
     opacity: 0.3;
 }
 
-.snippet-reply-hidden,
-.snippet-reply-hidden *{
+.snippet-reply[data-hidden=yes],
+.snippet-reply[data-hidden=yes] *{
     cursor: pointer;
 }
 
diff --git a/dpaste/templates/dpaste/base.html b/dpaste/templates/dpaste/base.html
index 37e16b2..f4b7687 100644
--- a/dpaste/templates/dpaste/base.html
+++ b/dpaste/templates/dpaste/base.html
@@ -27,5 +27,30 @@
         PAGE MISSING
     {% endblock %}
 </div>
+
+{% block script_footer %}
+<script>
+  var af = document.querySelector(".autofocus textarea");
+  if (af !== null)
+    af.focus();
+
+  var se = document.querySelector(".superenter textarea");
+  if (se !== null) {
+    se.onkeydown = function(e) {
+      var metaKey;
+      if (navigator.appVersion.indexOf("Win") !== -1) {
+        metaKey = e.ctrlKey;
+      } else {
+        metaKey = event.metaKey;
+      }
+      if (e.keyCode == 13 && metaKey) {
+        document.querySelector(".snippet-form").submit();
+        return false;
+      }
+    }
+  }
+</script>
+{% endblock %}
+
 </body>
 </html>
diff --git a/dpaste/templates/dpaste/highlight/code.html b/dpaste/templates/dpaste/highlight/code.html
index 4c9ef72..7138c90 100644
--- a/dpaste/templates/dpaste/highlight/code.html
+++ b/dpaste/templates/dpaste/highlight/code.html
@@ -1 +1 @@
-<div class="code {{ snippet.lexer }}"><ol>{% for line in highlighted %}<li id="{{ forloop.counter }}">{{ line|safe|default:"&nbsp;" }}</li>{% endfor %}</ol></div>
+<div class="code {{ snippet.lexer }}"><ol>{% for line in highlighted %}<li id="l{{ forloop.counter }}">{{ line|safe|default:"&nbsp;" }}</li>{% endfor %}</ol></div>
diff --git a/dpaste/templates/dpaste/snippet_details.html b/dpaste/templates/dpaste/snippet_details.html
index db1d6e7..02d2f39 100644
--- a/dpaste/templates/dpaste/snippet_details.html
+++ b/dpaste/templates/dpaste/snippet_details.html
@@ -77,7 +77,7 @@
     <!-- ======================================================================
     Snippet Reply
     ======================================================================= -->
-    <div class="snippet-reply snippet-reply-hidden">
+    <div class="snippet-reply" data-hidden="yes">
         <h3>{% trans "Reply to this snippet" %} &rarr;</h3>
         {% include "dpaste/snippet_form.html" %}
     </div>
@@ -87,86 +87,45 @@
 {% block script_footer %}
 {{ block.super }}
 <script>
+  var reply = document.querySelector('.snippet-reply');
+  reply.onclick = function(e) {
+    this.dataset.hidden = "no";
+  };
 
-<!--
-    $('.snippet-reply-hidden').click(function(e) {
-        $(this).removeClass('snippet-reply-hidden');
-    });
-
-    var curLine = document.location.hash;
-
-    {% if snippet.parent %}
-    /* ------------------------------------------------------------------------
-       Diff Ajax Call
-    ------------------------------------------------------------------------ */
-    function fetchDiff() {
-        var a = {{ snippet.parent.pk }},
-            b = {{ snippet.pk }};
-
-        window.location.hash = 'D' + a + ',' + b;
-
-        // Cancel previous request if it is still pending
-        if (diffReq) {
-            diffReq.abort();
-        }
-
-        diffReq = $.get("{% url "snippet_diff" %}", {
-            a: a,
-            b: b
-        }).done(function(data) {
-            $('#diff').html(data).slideDown('fast');
-        }).complete(function() {
-            diffReq = null;
-        });
+  // Line Highlighting
+  var curLine = document.location.hash;
+  if (curLine.substring(0, 2) === '#L') {
+    hashlist = curLine.substring(2).split(',');
+    window.console.log(hashlist);
+    if (hashlist.length > 0 && hashlist[0] !== '') {
+      hashlist.forEach(function(el) {
+        var line = document.getElementById('l'+el)
+        if (line)
+          line.classList.add('marked');
+      });
     }
+  }
 
-    var diffReq;
-    $('.snippet-diff-trigger').click(function(e) {
-        e.preventDefault();
-        fetchDiff();
-        $('#snippet-diff').slideDown('fast');
-    });
+  document.getElementById('toggleWordwrap').onclick = function(e) {
+    e.preventDefault();
+    document.querySelector('.code').classList.toggle('wordwrap');
+  }
 
-    if (curLine.substring(0, 2) === '#D') {
-        fetchDiff();
-        $('#snippet-diff').slideDown('fast');
+  var lines = document.querySelectorAll('.code li');
+
+  lines.forEach(function(el){
+    el.onclick = function(e) {
+      el.classList.toggle('marked');
+
+      var hash = 'L';
+      var marked = document.querySelectorAll('.code li.marked');
+      marked.forEach(function(line){
+        if (hash !== 'L')
+          hash += ',';
+        hash += line.getAttribute('id').substring(1);
+      });
+      window.location.hash = hash;
     }
-    {% endif %}
-
-    /* ------------------------------------------------------------------------
-       Line Highlighting
-    ------------------------------------------------------------------------ */
-    if (curLine.substring(0, 2) === '#L') {
-        hashlist = curLine.substring(2).split(',');
-        if (hashlist.length > 0 && hashlist[0] !== '') {
-            $.each(hashlist, function(index, elem){
-                $('.code li#' + elem).addClass('marked');
-            });
-        }
-    }
-
-    $('.code li').click(function(e) {
-        var line = $(this),
-            hash = 'L';
-
-        line.toggleClass('marked');
-
-        $('.code li.marked').each(function (index, elem) {
-            if (hash !== 'L') hash += ',';
-            hash += $(elem).attr('id');
-        });
-
-        window.location.hash = hash;
-    });
-
-    /* ------------------------------------------------------------------------
-       Wordwrap
-    ------------------------------------------------------------------------ */
-    $('#toggleWordwrap').click(function(e){
-        e.preventDefault();
-        $('.code').toggleClass('wordwrap');
-    });
-});
--->
+  });
 </script>
 {% endblock %}
diff --git a/dpaste/templates/dpaste/snippet_form.html b/dpaste/templates/dpaste/snippet_form.html
index 8ead12a..6898ddf 100644
--- a/dpaste/templates/dpaste/snippet_form.html
+++ b/dpaste/templates/dpaste/snippet_form.html
@@ -38,27 +38,3 @@
         <span class="shortcut">&#8984;+&#9166; {% trans "or" %} Ctrl+&#9166;</span>
     </div>
 </form>
-
-{% block script_footer %}
-<script>
-  var af = document.querySelector(".autofocus textarea");
-  if (af !== null)
-    af.focus();
-
-  var se = document.querySelector(".superenter textarea");
-  if (se !== null) {
-    se.onkeydown = function(e) {
-      var metaKey;
-      if (navigator.appVersion.indexOf("Win") !== -1) {
-        metaKey = e.ctrlKey;
-      } else {
-        metaKey = event.metaKey;
-      }
-      if (e.keyCode == 13 && metaKey) {
-        document.querySelector(".snippet-form").submit();
-        return false;
-      }
-    }
-  }
-</script>
-{% endblock %}