From c7e3174a9d83e0946142e63b09930c17533dc400 Mon Sep 17 00:00:00 2001
From: Aevann1 <randomname42029@gmail.com>
Date: Sat, 4 Dec 2021 03:22:25 +0200
Subject: [PATCH] 1

---
 files/templates/comments.html           | 116 +++-------------------
 files/templates/submission.html         |  90 +----------------
 files/templates/submission_listing.html | 123 +-----------------------
 3 files changed, 21 insertions(+), 308 deletions(-)

diff --git a/files/templates/comments.html b/files/templates/comments.html
index 79e1634db..4857f52c3 100644
--- a/files/templates/comments.html
+++ b/files/templates/comments.html
@@ -1,81 +1,5 @@
 {% if v %}
-	<script>
-		function vote(type, id, dir) {
-			var upvote = document.getElementById(type + '-' + id + '-up');
-			var downvote = document.getElementById(type + '-' + id + '-down');
-			var scoretext = document.getElementById(type + '-score-' + id);
-
-			var score = Number(scoretext.textContent);
-
-			if (dir == "1") {
-				if (upvote.classList.contains('active')) {
-					upvote.classList.remove('active')
-					scoretext.textContent = score - 1
-					votedirection = "0"
-				} else if (downvote.classList.contains('active')) {
-					upvote.classList.add('active')
-					downvote.classList.remove('active')
-					scoretext.textContent = score + 2
-					votedirection = "1"
-				} else {
-					upvote.classList.add('active')
-					scoretext.textContent = score + 1
-					votedirection = "1"
-				}
-
-				if (upvote.classList.contains('active')) {
-					scoretext.classList.add('score-up')
-					scoretext.classList.remove('score-down')
-					scoretext.classList.remove('score')
-				} else if (downvote.classList.contains('active')) {
-					scoretext.classList.add('score-down')
-					scoretext.classList.remove('score-up')
-					scoretext.classList.remove('score')
-				} else {
-					scoretext.classList.add('score')
-					scoretext.classList.remove('score-up')
-					scoretext.classList.remove('score-down')
-				}
-			}
-			else {
-				if (downvote.classList.contains('active')) {
-					downvote.classList.remove('active')
-					scoretext.textContent = score + 1
-					votedirection = "0"
-				} else if (upvote.classList.contains('active')) {
-					downvote.classList.add('active')
-					upvote.classList.remove('active')
-					scoretext.textContent = score - 2
-					votedirection = "-1"
-				} else {
-					downvote.classList.add('active')
-					scoretext.textContent = score - 1
-					votedirection = "-1"
-				}
-
-				if (upvote.classList.contains('active')) {
-					scoretext.classList.add('score-up')
-					scoretext.classList.remove('score-down')
-					scoretext.classList.remove('score')
-				} else if (downvote.classList.contains('active')) {
-					scoretext.classList.add('score-down')
-					scoretext.classList.remove('score-up')
-					scoretext.classList.remove('score')
-				} else {
-					scoretext.classList.add('score')
-					scoretext.classList.remove('score-up')
-					scoretext.classList.remove('score-down')
-				}
-			}
-
-			var xhr = new XMLHttpRequest();
-			xhr.open("POST", "/vote/" + type.replace('-mobile','') + "/" + id + "/" + votedirection, true);
-			var form = new FormData()
-			form.append("formkey", formkey());
-			xhr.withCredentials=true;
-			xhr.send(form);
-		}
-	</script>
+	{% include "award_modal.html" %}
 {% endif %}
 
 <style>
@@ -289,10 +213,9 @@
 
 				{% if c.parent_comment_id and not standalone and level<=7 %}<a href="#comment-{{ c.parent_comment_id }}-only" class="text-muted ml-2"><i class="fas fa-reply fa-sm fa-fw fa-flip-horizontal mr-1"></i>{{ c.parent_comment.author.username }}</a>{% endif %}
 
-				
-				<span id="timestamp-{{c.id}}" data-bs-toggle="tooltip" data-bs-placement="bottom" class="time-stamp">&nbsp;{{c.age_string}}</span>
+				<span id="timestamp-{{c.id}}" onmouseover="timestamp('timestamp-{{c.id}}','{{c.created_utc}}')" data-bs-toggle="tooltip" data-bs-placement="bottom" class="time-stamp">&nbsp;{{c.age_string}}</span>
 				{% if c.edited_utc %}
-				<span class="time-edited"><span>&#183;</span> <span class="font-italic">Edited {{c.edited_string}}</span></span>
+				<span class="time-edited" id="time-edit-{{c.id}}" onmouseover="timestamp('time-edit-{{c.id}}','{{c.edited_utc}}')"><span>&#183;</span> <span class="font-italic">Edited {{c.edited_string}}</span></span>
 				{% endif %}
 			</div>
 			{% if c.active_flags %}
@@ -825,9 +748,8 @@
 </style>
 
 {% if v %}
-	{% include "award_modal.html" %}
 	<script defer src="https://cdn.jsdelivr.net/npm/marked@3.0.8/lib/marked.min.js"></script>
-	<script defer src="/assets/js/comments_v.js?v=73"></script>
+	<script defer src="/assets/js/comments_v.js?v=75"></script>
 {% endif %}
 
 <script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.8/dist/clipboard.min.js"></script>
@@ -839,26 +761,9 @@
 {% include "expanded_image_modal.html" %}
 
 <script defer src="/assets/js/popover.js?v=9"></script>
+<script defer src="/assets/js/comments.js?v=1"></script>
 
 <script>
-	function collapse_comment(comment_id) {
-		const comment = "comment-" + comment_id
-		const element = document.getElementById(comment)
-		const closed = element.classList.toggle("collapsed")
-		const top = element.getBoundingClientRect().y
-
-		if (closed && top < 0) {
-			element.scrollIntoView()
-			window.scrollBy(0, - 100)
-		}
-	};
-
-	var clipboard = new ClipboardJS('.copy-link');
-	clipboard.on('success', function(e) {
-		var myToast = new bootstrap.Toast(document.getElementById('toast-success'));
-		myToast.show();
-	});
-
 	function poll_vote(cid, parentid) {
 		{% if v %}
 			for(let el of document.getElementsByClassName('presult-'+parentid)) {
@@ -897,9 +802,6 @@
 
 		(() => {
 			{% for c in comments %}
-				date = new Date({{c.created_utc*1000}});
-				document.getElementById('timestamp-{{c.id}}').title = date.toString();
-
 				{% if c.is_pinned %}
 					const pinned_info = document.getElementById('pinned-{{c.id}}')
 					{% if c.is_pinned.startswith('t:') %}
@@ -922,6 +824,14 @@
 			});
 		})
 	});
+
+  var perfEntries = performance.getEntriesByType("navigation");
+
+  for (var i=0; i < perfEntries.length; i++) {
+    var p = perfEntries[i];
+    console.log("DOM interactive = " + p.domInteractive);
+  }
+}
 </script>
 
 </body>
\ No newline at end of file
diff --git a/files/templates/submission.html b/files/templates/submission.html
index f49734d73..943617c15 100644
--- a/files/templates/submission.html
+++ b/files/templates/submission.html
@@ -380,10 +380,10 @@
 						{% if p.author.verified %}<i class="fas fa-badge-check align-middle ml-1" style="color:{% if p.author.verifiedcolor %}#{{p.author.verifiedcolor}}{% else %}#1DA1F2{% endif %}" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-original-title="{{p.author.verified}}"></i>
 						{% endif %}
 						<a class="user-name text-decoration-none" data-bs-placement="bottom" data-bs-toggle="popover" data-bs-trigger="focus" data-content-id="popover-{{p.id}}" href="javascript:void(0)" tabindex="0" style="color: #{{p.author.namecolor}}; font-weight: bold;" class="user-name"><img loading="lazy" src="{{p.author.profile_url}}" class="profile-pic-25 mr-2"><span {% if p.author.patron and not p.distinguish_level %}class="patron" style="background-color:#{{p.author.namecolor}};"{% elif p.distinguish_level and 'rama' in request.host %}class="mod"{% endif %}>{{p.author.username}}</span></a>{% if p.author.customtitle %}&nbsp;<bdi style="color: #{{p.author.titlecolor}}">&nbsp;{% if p.author.quadrant %}<img loading="lazy" height="20" src="/assets/images/quadrants/{{p.author.quadrant}}.webp?v=1">{% endif %}{{p.author.customtitle | safe}}</bdi>{% endif %}
-						<span data-bs-toggle="tooltip" data-bs-placement="bottom" id="timestamp">&nbsp;{{p.age_string}}</span>
+						<span data-bs-toggle="tooltip" data-bs-placement="bottom" id="timestamp" onmouseover="timestamp('timestamp','{{p.created_utc}}')">&nbsp;{{p.age_string}}</span>
 						({% if p.realurl(v) %}<a href="/search/posts/?q=domain%3A{{p.domain}}&sort=new&t=all" {% if not v or v.newtabexternal %}target="_blank"{% endif %}>{{p.domain}}</a>{% else %}text post{% endif %})
 
-						{% if p.edited_utc %}&nbsp;&nbsp;Edited <span data-bs-toggle="tooltip" data-bs-placement="bottom" id="edited_timestamp">{{p.edited_string}}</span>{% endif %}
+						{% if p.edited_utc %}&nbsp;&nbsp;Edited <span data-bs-toggle="tooltip" data-bs-placement="bottom"  onmouseover="timestamp('edited_timestamp','{{p.edited_utc}}')" id="edited_timestamp">{{p.edited_string}}</span>{% endif %}
 						&nbsp;&nbsp;{{p.views}} views
 					</div>
 					{% if p.active_flags %}
@@ -831,13 +831,6 @@
 <script>
 	window.addEventListener("load",function(event) {
 		(() => {
-			const date = new Date({{p.created_utc*1000}});
-			document.getElementById('timestamp').title = date.toString();
-			{% if p.edited_utc %}
-				const dateEdited = new Date({{p.edited_utc*1000}});
-				document.getElementById('edited_timestamp').title = dateEdited.toString();
-			{% endif %}
-
 			{% if (not v or v.highlightcomments) %}
 				showNewCommentCounts('{{p.id}}', {{p.comment_count}})
 			{% endif %}
@@ -895,84 +888,7 @@
 	</script>
 
 	{% if v %}
-		<script>
-			function vote(type, id, dir) {
-				var upvote = document.getElementById(type + '-' + id + '-up');
-				var downvote = document.getElementById(type + '-' + id + '-down');
-				var scoretext = document.getElementById(type + '-score-' + id);
-
-				var score = Number(scoretext.textContent);
-
-				if (dir == "1") {
-					if (upvote.classList.contains('active')) {
-						upvote.classList.remove('active')
-						scoretext.textContent = score - 1
-						votedirection = "0"
-					} else if (downvote.classList.contains('active')) {
-						upvote.classList.add('active')
-						downvote.classList.remove('active')
-						scoretext.textContent = score + 2
-						votedirection = "1"
-					} else {
-						upvote.classList.add('active')
-						scoretext.textContent = score + 1
-						votedirection = "1"
-					}
-
-					if (upvote.classList.contains('active')) {
-						scoretext.classList.add('score-up')
-						scoretext.classList.remove('score-down')
-						scoretext.classList.remove('score')
-					} else if (downvote.classList.contains('active')) {
-						scoretext.classList.add('score-down')
-						scoretext.classList.remove('score-up')
-						scoretext.classList.remove('score')
-					} else {
-						scoretext.classList.add('score')
-						scoretext.classList.remove('score-up')
-						scoretext.classList.remove('score-down')
-					}
-				}
-				else {
-					if (downvote.classList.contains('active')) {
-						downvote.classList.remove('active')
-						scoretext.textContent = score + 1
-						votedirection = "0"
-					} else if (upvote.classList.contains('active')) {
-						downvote.classList.add('active')
-						upvote.classList.remove('active')
-						scoretext.textContent = score - 2
-						votedirection = "-1"
-					} else {
-						downvote.classList.add('active')
-						scoretext.textContent = score - 1
-						votedirection = "-1"
-					}
-
-					if (upvote.classList.contains('active')) {
-						scoretext.classList.add('score-up')
-						scoretext.classList.remove('score-down')
-						scoretext.classList.remove('score')
-					} else if (downvote.classList.contains('active')) {
-						scoretext.classList.add('score-down')
-						scoretext.classList.remove('score-up')
-						scoretext.classList.remove('score')
-					} else {
-						scoretext.classList.add('score')
-						scoretext.classList.remove('score-up')
-						scoretext.classList.remove('score-down')
-					}
-				}
-
-				var xhr = new XMLHttpRequest();
-				xhr.open("POST", "/vote/" + type.replace('-mobile','') + "/" + id + "/" + votedirection, true);
-				var form = new FormData()
-				form.append("formkey", formkey());
-				xhr.withCredentials=true;
-				xhr.send(form);
-			}
-		</script>
-		<script defer src="/assets/js/comments_v.js?v=73"></script>
+		<script defer src="/assets/js/comments_v.js?v=75"></script>
 		{% include "award_modal.html" %}
 		{% include "emoji_modal.html" %}
 		{% include "gif_modal.html" %}
diff --git a/files/templates/submission_listing.html b/files/templates/submission_listing.html
index fb29fea5d..4851a518b 100644
--- a/files/templates/submission_listing.html
+++ b/files/templates/submission_listing.html
@@ -1,81 +1,5 @@
 {% if v %}
-	<script>
-		function vote(type, id, dir) {
-			var upvote = document.getElementById(type + '-' + id + '-up');
-			var downvote = document.getElementById(type + '-' + id + '-down');
-			var scoretext = document.getElementById(type + '-score-' + id);
-
-			var score = Number(scoretext.textContent);
-
-			if (dir == "1") {
-				if (upvote.classList.contains('active')) {
-					upvote.classList.remove('active')
-					scoretext.textContent = score - 1
-					votedirection = "0"
-				} else if (downvote.classList.contains('active')) {
-					upvote.classList.add('active')
-					downvote.classList.remove('active')
-					scoretext.textContent = score + 2
-					votedirection = "1"
-				} else {
-					upvote.classList.add('active')
-					scoretext.textContent = score + 1
-					votedirection = "1"
-				}
-
-				if (upvote.classList.contains('active')) {
-					scoretext.classList.add('score-up')
-					scoretext.classList.remove('score-down')
-					scoretext.classList.remove('score')
-				} else if (downvote.classList.contains('active')) {
-					scoretext.classList.add('score-down')
-					scoretext.classList.remove('score-up')
-					scoretext.classList.remove('score')
-				} else {
-					scoretext.classList.add('score')
-					scoretext.classList.remove('score-up')
-					scoretext.classList.remove('score-down')
-				}
-			}
-			else {
-				if (downvote.classList.contains('active')) {
-					downvote.classList.remove('active')
-					scoretext.textContent = score + 1
-					votedirection = "0"
-				} else if (upvote.classList.contains('active')) {
-					downvote.classList.add('active')
-					upvote.classList.remove('active')
-					scoretext.textContent = score - 2
-					votedirection = "-1"
-				} else {
-					downvote.classList.add('active')
-					scoretext.textContent = score - 1
-					votedirection = "-1"
-				}
-
-				if (upvote.classList.contains('active')) {
-					scoretext.classList.add('score-up')
-					scoretext.classList.remove('score-down')
-					scoretext.classList.remove('score')
-				} else if (downvote.classList.contains('active')) {
-					scoretext.classList.add('score-down')
-					scoretext.classList.remove('score-up')
-					scoretext.classList.remove('score')
-				} else {
-					scoretext.classList.add('score')
-					scoretext.classList.remove('score-up')
-					scoretext.classList.remove('score-down')
-				}
-			}
-
-			var xhr = new XMLHttpRequest();
-			xhr.open("POST", "/vote/" + type.replace('-mobile','') + "/" + id + "/" + votedirection, true);
-			var form = new FormData()
-			form.append("formkey", formkey());
-			xhr.withCredentials=true;
-			xhr.send(form);
-		}
-	</script>
+	{% include "award_modal.html" %}
 {% endif %}
 
 {% if request.host == 'pcmemes.net' %}
@@ -136,13 +60,6 @@
 <script>
 	window.addEventListener("load",function(event) {
 		(() => {
-			const date = new Date({{p.created_utc*1000}});
-			document.getElementById('timestamp-{{p.id}}').title = date.toString();
-			{% if p.edited_utc %}
-				const dateEdited = new Date({{p.edited_utc*1000}});
-				document.getElementById('edited_timestamp-{{p.id}}').title = dateEdited.toString();
-			{% endif %}
-
 			{% if (not v or v.highlightcomments) %}
 				showNewCommentCounts('{{p.id}}', {{p.comment_count}})
 			{% endif %}
@@ -273,10 +190,10 @@
 				{% if p.author.verified %}<i class="fas fa-badge-check align-middle ml-1" style="color:{% if p.author.verifiedcolor %}#{{p.author.verifiedcolor}}{% else %}#1DA1F2{% endif %}" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-original-title="{{p.author.verified}}"></i>
 				{% endif %}
 				<a class="user-name text-decoration-none" data-bs-placement="bottom" data-bs-toggle="popover" data-bs-trigger="focus" data-content-id="popover-{{p.id}}" href="javascript:void(0)" tabindex="0" style="color: #{{p.author.namecolor}};  font-weight: bold;"><img loading="lazy" src="{{p.author.profile_url}}" class="profile-pic-25 mr-2"><span {% if p.author.patron and not p.distinguish_level %}class="patron" style="background-color:#{{p.author.namecolor}};"{% elif p.distinguish_level and 'rama' in request.host %}class="mod"{% endif %}>{{p.author.username}}</span></a>{% if p.author.customtitle %}<bdi  style="color: #{{p.author.titlecolor}}">&nbsp;&nbsp;{% if p.author.quadrant %}<img loading="lazy" height="20" src="/assets/images/quadrants/{{p.author.quadrant}}.webp?v=1">{% endif %}{{p.author.customtitle | safe}}</bdi>{% endif %}
-				<span data-bs-toggle="tooltip" data-bs-placement="bottom" id="timestamp-{{p.id}}">&nbsp;{{p.age_string}}</span>
+				<span data-bs-toggle="tooltip" data-bs-placement="bottom" onmouseover="timestamp('timestamp-{{p.id}}','{{p.created_utc}}')" id="timestamp-{{p.id}}">&nbsp;{{p.age_string}}</span>
 				&nbsp;
 				({% if p.realurl(v) %}<a href="/search/posts/?q=domain%3A{{p.domain}}&sort=new&t=all" target="_blank">{{p.domain}}</a>{% else %}text post{% endif %})
-				{% if p.edited_utc %}&nbsp;&nbsp;Edited <span data-bs-toggle="tooltip" data-bs-placement="bottom" id="edited_timestamp-{{p.id}}">{{p.edited_string}}</span>{% endif %}
+				{% if p.edited_utc %}&nbsp;&nbsp;Edited <span data-bs-toggle="tooltip" data-bs-placement="bottom" id="edited_timestamp-{{p.id}}" onmouseover="timestamp('edited_timestamp-{{p.id}}','{{p.edited_utc}}')">{{p.edited_string}}</span>{% endif %}
 				&nbsp;&nbsp;{{p.views}} views
 			</div>
 
@@ -738,35 +655,5 @@
 
 <script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.8/dist/clipboard.min.js"></script>
 
-<script>
-	function expandText(id) {
-		document.getElementById('post-text-'+id).classList.toggle('d-none');
-		document.getElementsByClassName('text-expand-icon-'+id)[0].classList.toggle('fa-expand-alt');
-		document.getElementsByClassName('text-expand-icon-'+id)[0].classList.toggle('fa-compress-alt');
-	};
-
-	window.addEventListener("load",function(event) {
-		var clipboard = new ClipboardJS('.copy-link');
-		clipboard.on('success', function(e) {
-			var myToast = new bootstrap.Toast(document.getElementById('toast-success'));
-			myToast.show();
-		});
-
-		const popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]'));
-
-		const popoverList = popoverTriggerList.map(function(popoverTriggerEl) {
-			const popoverId = popoverTriggerEl.getAttribute('data-content-id');
-			const contentEl = document.getElementById(popoverId).innerHTML;
-			return new bootstrap.Popover(popoverTriggerEl, {
-				content: contentEl,
-				html: true,
-			});
-		})
-	});
-</script>
-
-{% if v %}
-	{% include "award_modal.html" %}
-{% endif %}
-
-<script defer src="/assets/js/popover.js?v=9"></script>
\ No newline at end of file
+<script defer src="/assets/js/popover.js?v=9"></script>
+<script defer src="/assets/js/submission_listing.js?v=1"></script>
\ No newline at end of file