Merge pull request #1616 from alemoreau/feature-minimize_comments

Feature minimize comments
This commit is contained in:
Kavin 2022-10-24 10:49:47 +01:00 committed by GitHub
commit a8c51758b9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 27 additions and 15 deletions

View File

@ -66,11 +66,11 @@
@change="onChange($event)"
/>
</label>
<label class="pref" for="chkShowComments">
<strong v-t="'actions.show_comments'" />
<label class="pref" for="chkMinimizeComments">
<strong v-t="'actions.minimize_comments_default'" />
<input
id="chkShowComments"
v-model="showComments"
id="chkMinimizeComments"
v-model="minimizeComments"
class="checkbox"
type="checkbox"
@change="onChange($event)"
@ -365,7 +365,7 @@ export default {
countryMap: CountryMap,
countrySelected: "US",
defaultHomepage: "trending",
showComments: true,
minimizeComments: false,
minimizeDescription: false,
minimizeRecommendations: false,
watchHistory: false,
@ -501,7 +501,7 @@ export default {
this.bufferingGoal = Math.max(Number(localStorage.getItem("bufferGoal")), 10);
this.countrySelected = this.getPreferenceString("region", "US");
this.defaultHomepage = this.getPreferenceString("homepage", "trending");
this.showComments = this.getPreferenceBoolean("comments", true);
this.minimizeComments = this.getPreferenceBoolean("minimizeComments", false);
this.minimizeDescription = this.getPreferenceBoolean("minimizeDescription", false);
this.minimizeRecommendations = this.getPreferenceBoolean("minimizeRecommendations", false);
this.watchHistory = this.getPreferenceBoolean("watchHistory", false);
@ -560,7 +560,7 @@ export default {
localStorage.setItem("bufferGoal", this.bufferingGoal);
localStorage.setItem("region", this.countrySelected);
localStorage.setItem("homepage", this.defaultHomepage);
localStorage.setItem("comments", this.showComments);
localStorage.setItem("minimizeComments", this.minimizeComments);
localStorage.setItem("minimizeDescription", this.minimizeDescription);
localStorage.setItem("minimizeRecommendations", this.minimizeRecommendations);
localStorage.setItem("watchHistory", this.watchHistory);

View File

@ -162,9 +162,14 @@
<hr />
<div class="grid xl:grid-cols-5 sm:grid-cols-4 grid-cols-1">
<div v-if="!commentsEnabled" class="xl:col-span-4 sm:col-span-3">
<p class="text-center mt-8" v-t="'comment.user_disabled'"></p>
<div class="xl:col-span-4 sm:col-span-3">
<button
class="btn mb-2"
@click="toggleComments"
v-t="`actions.${showComments ? 'minimize_comments' : 'show_comments'}`"
/>
</div>
<div v-if="!showComments" class="xl:col-span-4 sm:col-span-3"></div>
<div v-else-if="!comments" class="xl:col-span-4 sm:col-span-3">
<p class="text-center mt-8" v-t="'comment.loading'"></p>
</div>
@ -243,6 +248,7 @@ export default {
sponsors: null,
selectedAutoLoop: false,
selectedAutoPlay: null,
showComments: true,
showDesc: true,
showRecs: true,
showChapters: true,
@ -277,9 +283,6 @@ export default {
year: "numeric",
});
},
commentsEnabled() {
return this.getPreferenceBoolean("comments", true);
},
},
mounted() {
// check screen size
@ -327,7 +330,7 @@ export default {
this.index = Number(this.$route.query.index);
this.getPlaylistData();
this.getSponsors();
if (!this.isEmbed && this.commentsEnabled) this.getComments();
if (!this.isEmbed && this.showComments) this.getComments();
window.addEventListener("resize", () => {
this.smallView = this.smallViewQuery.matches;
});
@ -335,6 +338,7 @@ export default {
activated() {
this.active = true;
this.selectedAutoPlay = this.getPreferenceBoolean("autoplay", false);
this.showComments = !this.getPreferenceBoolean("minimizeComments", false);
this.showDesc = !this.getPreferenceBoolean("minimizeDescription", false);
this.showRecs = !this.getPreferenceBoolean("minimizeRecommendations", false);
if (this.video.duration) {
@ -365,6 +369,12 @@ export default {
'"]',
});
},
toggleComments() {
this.showComments = !this.showComments;
if (this.showComments && this.comments === null) {
this.fetchComments();
}
},
fetchComments() {
return this.fetchJson(this.apiUrl() + "/comments/" + this.getVideoId());
},
@ -477,7 +487,7 @@ export default {
},
handleScroll() {
if (this.loading || !this.comments || !this.comments.nextpage) return;
if (window.innerHeight + window.scrollY >= this.$refs.comments.offsetHeight - window.innerHeight) {
if (window.innerHeight + window.scrollY >= this.$refs.comments?.offsetHeight - window.innerHeight) {
this.loading = true;
this.fetchJson(this.apiUrl() + "/nextpage/comments/" + this.getVideoId(), {
nextpage: this.comments.nextpage,

View File

@ -47,7 +47,7 @@
"buffering_goal": "Buffering Goal (in seconds)",
"country_selection": "Country Selection",
"default_homepage": "Default Homepage",
"show_comments": "Show Comments",
"minimize_comments_default": "Minimize Comments by default",
"minimize_description_default": "Minimize Description by default",
"store_watch_history": "Store Watch History",
"language_selection": "Language Selection",
@ -62,6 +62,8 @@
"loop_this_video": "Loop this Video",
"auto_play_next_video": "Auto Play next Video",
"donations": "Development donations",
"minimize_comments": "Minimize Comments",
"show_comments": "Show Comments",
"minimize_description": "Minimize Description",
"show_description": "Show Description",
"minimize_recommendations": "Minimize Recommendations",