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

Allow hiding replies, and make strings translatable.

Browse Source 
Closes #591
This commit is contained in:
FireMaskterK 2021-11-04 10:52:28 +00:00
parent 149aa69739
commit e6bbcdd3c3
No known key found for this signature in database
GPG Key ID: 49451E4482CC5BCD
3 changed files with 33 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
src/components/Comment.vue
View File

@ -35,14 +35,21 @@
   
<font-awesome-icon v-if="comment.hearted" icon="heart"></font-awesome-icon> <font-awesome-icon v-if="comment.hearted" icon="heart"></font-awesome-icon>
</div> </div>
<div v-if="comment.repliesPage && notLoading"> <template v-if="comment.repliesPage && (!loadingReplies || !showingReplies)">
<div @click="loadReplies"> <div @click="loadReplies">
<a class="uk-link-text">Show Replies</a> <a class="uk-link-text" v-t="'actions.show_replies'" />
&nbsp; &nbsp;
<font-awesome-icon icon="level-down-alt"></font-awesome-icon> <font-awesome-icon icon="level-down-alt" />
</div> </div>
</div> </template>
<div v-if="replies" class="replies uk-width-4-5@xl uk-width-3-4@s uk-width-1"> <template v-if="showingReplies">
<div @click="hideReplies">
<a class="uk-link-text" v-t="'actions.hide_replies'" />
&nbsp;
<font-awesome-icon icon="level-up-alt" />
</div>
</template>
<div v-show="showingReplies" v-if="replies" class="replies uk-width-4-5@xl uk-width-3-4@s uk-width-1">
<div <div
v-for="reply in replies" v-for="reply in replies"
:key="reply.commentId" :key="reply.commentId"
@ -52,9 +59,9 @@
<Comment :comment="reply" :uploader="uploader" :video-id="videoId" /> <Comment :comment="reply" :uploader="uploader" :video-id="videoId" />
</div> </div>
<div v-if="nextpage" @click="loadReplies"> <div v-if="nextpage" @click="loadReplies">
<a class="uk-link-text">Load more Replies</a> <a class="uk-link-text" v-t="'actions.load_more_replies'" />
&nbsp; &nbsp;
<font-awesome-icon icon="level-down-alt"></font-awesome-icon> <font-awesome-icon icon="level-down-alt" />
</div> </div>
</div> </div>
</div> </div>
@ -75,14 +82,21 @@ export default {
}, },
data() { data() {
return { return {
notLoading: true, loadingReplies: false,
showingReplies: false,
replies: [], replies: [],
nextpage: null, nextpage: null,
}; };
}, },
methods: { methods: {
loadReplies() { async loadReplies() {
this.notLoading = false; if (!this.showingReplies && this.loadingReplies) {
this.showingReplies = true;
return;
}
this.loadingReplies = true;
this.showingReplies = true;
this.fetchJson(this.apiUrl() + "/nextpage/comments/" + this.videoId, { this.fetchJson(this.apiUrl() + "/nextpage/comments/" + this.videoId, {
nextpage: this.nextpage || this.comment.repliesPage, nextpage: this.nextpage || this.comment.repliesPage,
}).then(json => { }).then(json => {
@ -90,6 +104,9 @@ export default {
this.nextpage = json.nextpage; this.nextpage = json.nextpage;
}); });
}, },
async hideReplies() {
this.showingReplies = false;
},
}, },
}; };
</script> </script>

5
src/locales/en.json
View File

@ -65,7 +65,10 @@
"search": "Search", "search": "Search",
"filter": "Filter", "filter": "Filter",
"loading": "Loading...", "loading": "Loading...",
"clear_history": "Clear History" "clear_history": "Clear History",
"show_replies": "Show Replies",
"hide_replies": "Hide Replies",
"load_more_replies": "Load more Replies"
}, },
"comment": { "comment": {
"pinned_by": "Pinned by" "pinned_by": "Pinned by"

2
src/main.js
View File

@ -12,6 +12,7 @@ import {
faChevronLeft, faChevronLeft,
faLevelDownAlt, faLevelDownAlt,
faTv, faTv,
faLevelUpAlt,
} from "@fortawesome/free-solid-svg-icons"; } from "@fortawesome/free-solid-svg-icons";
import { faGithub, faBitcoin, faYoutube } from "@fortawesome/free-brands-svg-icons"; import { faGithub, faBitcoin, faYoutube } from "@fortawesome/free-brands-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
@ -29,6 +30,7 @@ library.add(
faRss, faRss,
faChevronLeft, faChevronLeft,
faLevelDownAlt, faLevelDownAlt,
faLevelUpAlt,
faTv, faTv,
); );