fluoride: Fix like/retweet for quote posts

2 files changed, 32 insertions, 29 deletions

diff --git a/static/fluoride.js b/static/fluoride.js
index 73d4939..d77b3ee 100644
--- a/static/fluoride.js
+++ b/static/fluoride.js
@@ -47,13 +47,15 @@ function updateActionForm(id, f, action) {
 	f.dataset.action = action;
 }
 
-function handleLikeForm(id, f) {
+function handleLikeForm(f) {
+	var id = f.dataset.id;
 	f.onsubmit = function(event) {
 		event.preventDefault();
 
 		var action = f.dataset.action;
 		var forms = document.
-			querySelectorAll(".status-"+id+" .status-like");
+			querySelectorAll(".status-action-container-"+id+" .status-like");
+
 		for (var i = 0; i < forms.length; i++) {
 			updateActionForm(id, forms[i], reverseActions[action]);
 		}
@@ -70,7 +72,7 @@ function handleLikeForm(id, f) {
 			if (count === 0)
 				count = "";
 			var counts = document.
-				querySelectorAll(".status-"+id+" .status-like-count");
+				querySelectorAll(".status-action-container-"+id+" .status-like-count");
 			for (var i = 0; i < counts.length; i++) {
 				if (count > 0) {
 					counts[i].innerHTML = "(" + count + ")";
@@ -88,13 +90,14 @@ function handleLikeForm(id, f) {
 	}
 }
 
-function handleRetweetForm(id, f) {
+function handleRetweetForm(f) {
+	var id = f.dataset.id;
 	f.onsubmit = function(event) {
 		event.preventDefault();
 
 		var action = f.dataset.action;
 		var forms = document.
-			querySelectorAll(".status-"+id+" .status-retweet");
+			querySelectorAll(".status-action-container-"+id+" .status-retweet");
 		for (var i = 0; i < forms.length; i++) {
 			updateActionForm(id, forms[i], reverseActions[action]);
 		}
@@ -111,7 +114,7 @@ function handleRetweetForm(id, f) {
 			if (count === 0)
 				count = "";
 			var counts = document.
-				querySelectorAll(".status-"+id+" .status-retweet-count");
+				querySelectorAll(".status-action-container-"+id+" .status-retweet-count");
 			for (var i = 0; i < counts.length; i++) {
 				if (count > 0) {
 					counts[i].innerHTML = "(" + count + ")";
@@ -298,29 +301,29 @@ document.addEventListener("DOMContentLoaded", function() {
 	checkCSRFToken();
 	checkAntiDopamineMode();
 
-	var statuses = document.querySelectorAll(".status-container");
-	for (var i = 0; i < statuses.length; i++) {
-		var s = statuses[i];
-		var id = s.dataset.id;
-
-		var likeForm = s.querySelector(".status-like");
-		handleLikeForm(id, likeForm);
+	var likeForms = document.querySelectorAll(".status-like");
+	for (var j = 0; j < likeForms.length; j++) {
+		handleLikeForm(likeForms[j]);
+	}
 
-		var retweetForm = s.querySelector(".status-retweet");
-		handleRetweetForm(id, retweetForm);
+	var retweetForms = document.querySelectorAll(".status-retweet");
+	for (var j = 0; j < retweetForms.length; j++) {
+		handleRetweetForm(retweetForms[j]);
+	}
 
-		var replyToLink = s.querySelector(".status-reply-to-link");
-		handleReplyToLink(replyToLink);
+	var replyToLinks = document.querySelectorAll(".status-reply-to-link");
+	for (var j = 0; j < replyToLinks.length; j++) {
+		handleReplyToLink(replyToLinks[j]);
+	}
 
-		var replyLinks = s.querySelectorAll(".status-reply-link");
-		for (var j = 0; j < replyLinks.length; j++) {
-			handleReplyLink(replyLinks[j]);
-		}
+	var replyLinks = document.querySelectorAll(".status-reply-link");
+	for (var j = 0; j < replyLinks.length; j++) {
+		handleReplyLink(replyLinks[j]);
+	}
 
-		var links = s.querySelectorAll(".status-content a");
-		for (var j = 0; j < links.length; j++) {
-			handleStatusLink(links[j]);
-		}
+	var links = document.querySelectorAll(".status-content a");
+	for (var j = 0; j < links.length; j++) {
+		handleStatusLink(links[j]);
 	}
 
 	var links = document.querySelectorAll(".user-profile-description a, .user-fields a");
diff --git a/templates/status.tmpl b/templates/status.tmpl
index d841a93..83e210a 100644
--- a/templates/status.tmpl
+++ b/templates/status.tmpl
@@ -15,7 +15,7 @@
 	{{else}}
 	{{block "status" (WithContext . $.Ctx)}}
 	{{with $s := .Data}}
-	<div class="status-container status-{{.ID}}" data-id="{{.ID}}">
+	<div class="status-container" data-id="{{.ID}}">
 		<div class="status-profile-img-container">
 			<a class="img-link" href="/user/{{.Account.ID}}">
 				<img class="status-profile-img" src="{{.Account.Avatar}}" title="@{{.Account.Acct}}" alt="@{{.Account.Acct}}" height="48">
@@ -184,7 +184,7 @@
 				</div>
 				{{end}}
 			{{end}}
-			<div class="status-action-container"> 
+			<div class="status-action-container status-action-container-{{.ID}}">
 				<div class="status-action">
 					<a href="/thread/{{.ID}}?reply=true#status-{{.ID}}">reply</a>
 					<a class="status-reply-count {{if or $.Ctx.AntiDopamineMode (not .RepliesCount)}}hidden{{end}}" 
@@ -196,7 +196,7 @@
 				</div>
 				<div class="status-action">
 					{{$rt := "retweet"}} {{if .Reblogged}} {{$rt = "unretweet"}} {{end}}
-					<form class="status-retweet" data-action="{{$rt}}" action="/{{$rt}}/{{.ID}}" method="post" target="_self">
+					<form class="status-retweet" data-action="{{$rt}}" action="/{{$rt}}/{{.ID}}" method="post" target="_self" data-id="{{.ID}}">
 						<input type="hidden" name="csrf_token" value="{{$.Ctx.CSRFToken}}">
 						<input type="hidden" name="referrer" value="{{$.Ctx.Referrer}}">
 						<input type="hidden" name="retweeted_by_id" value="{{.RetweetedByID}}">
@@ -212,7 +212,7 @@
 				</div>
 				<div class="status-action">
 					{{$like := "like"}} {{if .Favourited}} {{$like = "unlike"}} {{end}}
-					<form class="status-like" data-action="{{$like}}" action="/{{$like}}/{{.ID}}" method="post" target="_self">
+					<form class="status-like" data-action="{{$like}}" action="/{{$like}}/{{.ID}}" method="post" target="_self" data-id="{{.ID}}">
 						<input type="hidden" name="csrf_token" value="{{$.Ctx.CSRFToken}}">
 						<input type="hidden" name="referrer" value="{{$.Ctx.Referrer}}">
 						<input type="hidden" name="retweeted_by_id" value="{{.RetweetedByID}}">