TeamPiped-mirror/Piped
1
0
Fork 0
mirror of https://github.com/TeamPiped/Piped.git synced 2024-08-14 23:57:27 +00:00
Code Issues Projects Releases Packages Wiki Activity

Rewrite comments since they now include HTML

Browse source
This commit is contained in:
Kavin 2022-12-07 23:31:27 +00:00
parent a075e4ee14
commit 9de2323db0
No known key found for this signature in database
GPG key ID: 49451E4482CC5BCD
2 changed files with 24 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/CommentItem.vue
View file

@ -28,7 +28,7 @@
</div> </div>
<div class="comment-meta text-sm mb-1.5" v-text="comment.commentedTime" /> <div class="comment-meta text-sm mb-1.5" v-text="comment.commentedTime" />
</div> </div>
<div class="whitespace-pre-wrap" v-html="urlify(comment.commentText)" /> <div class="whitespace-pre-wrap" v-html="purifyHTML(comment.commentText)" />
<div class="comment-footer mt-1 flex items-center"> <div class="comment-footer mt-1 flex items-center">
<div class="i-fa-solid:thumbs-up" /> <div class="i-fa-solid:thumbs-up" />
<span class="ml-1" v-text="numberFormat(comment.likeCount)" /> <span class="ml-1" v-text="numberFormat(comment.likeCount)" />

25
src/components/WatchVideo.vue
View file

@ -449,7 +449,10 @@ export default {
this.fetchSponsors().then(data => (this.sponsors = data)); this.fetchSponsors().then(data => (this.sponsors = data));
}, },
async getComments() { async getComments() {
this.fetchComments().then(data => (this.comments = data)); this.fetchComments().then(data => {
this.rewriteComments(data.comments);
this.comments = data;
});
}, },
async fetchSubscribedStatus() { async fetchSubscribedStatus() {
if (!this.channelId) return; if (!this.channelId) return;
@ -472,6 +475,23 @@ export default {
this.subscribed = json.subscribed; this.subscribed = json.subscribed;
}); });
}, },
rewriteComments(data) {
data.forEach(comment => {
const parser = new DOMParser();
const xmlDoc = parser.parseFromString(comment.commentText, "text/html");
xmlDoc.querySelectorAll("a").forEach(elem => {
if (!elem.innerText.match(/(?:[\d]{1,2}:)?(?:[\d]{1,2}):(?:[\d]{1,2})/))
elem.outerHTML = elem.getAttribute("href");
});
comment.commentText = xmlDoc
.querySelector("body")
.innerHTML.replaceAll(/(?:http(?:s)?:\/\/)?(?:www\.)?youtube\.com(\/[/a-zA-Z0-9_?=&-]*)/gm, "$1")
.replaceAll(
/(?:http(?:s)?:\/\/)?(?:www\.)?youtu\.be\/(?:watch\?v=)?([/a-zA-Z0-9_?=&-]*)/gm,
"/watch?v=$1",
);
});
},
subscribeHandler() { subscribeHandler() {
if (this.authenticated) { if (this.authenticated) {
this.fetchJson(this.authApiUrl() + (this.subscribed ? "/unsubscribe" : "/subscribe"), null, { this.fetchJson(this.authApiUrl() + (this.subscribed ? "/unsubscribe" : "/subscribe"), null, {
@ -498,7 +518,8 @@ export default {
}).then(json => { }).then(json => {
this.comments.nextpage = json.nextpage; this.comments.nextpage = json.nextpage;
this.loading = false; this.loading = false;
json.comments.map(comment => this.comments.comments.push(comment)); this.rewriteComments(json.comments);
this.comments.comments = this.comments.comments.concat(json.comments);
}); });
} }
}, },