Merge branch 'VueTubeApp:main' into main

This commit is contained in:
gayolGate | Dev Studio 2022-12-28 13:25:18 +01:00 committed by GitHub
commit 8b8097f949
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
11 changed files with 115 additions and 136 deletions

View File

@ -32,7 +32,7 @@
<v-divider v-if="getComponents()[Object.keys(comment)[0]]"></v-divider>
</div>
<div class="loading" v-if="loading">
<div v-if="loading" class="loading">
<v-sheet
v-for="i in comments.length <= 0 ? 5 : 1"
:key="i"
@ -50,6 +50,7 @@
:defaultContinuation="replyData.replyContinuation"
class="transition-fast-in-fast-out v-card--reveal"
style="height: 100%"
@closeComments="$emit('changeState', false)"
></main-comment-reply-renderer>
</template>
</dialog-base>
@ -57,26 +58,26 @@
<script>
import dialogBase from "~/components/dialogBase.vue";
import commentsHeaderRenderer from "~/components/Comments/commentsHeaderRenderer.vue";
import commentThreadRenderer from "~/components/Comments/commentThreadRenderer.vue";
import continuationItemRenderer from "~/components/observer.vue";
import commentsHeaderRenderer from "~/components/Comments/commentsHeaderRenderer.vue";
import mainCommentReplyRenderer from "~/components/Comments/mainCommentReplyRenderer.vue";
import continuationItemRenderer from "~/components/observer.vue";
import backType from "~/plugins/classes/backType";
export default {
props: ["defaultContinuation", "commentData", "showComments"],
components: {
dialogBase,
commentThreadRenderer,
commentsHeaderRenderer,
mainCommentReplyRenderer,
continuationItemRenderer,
},
model: {
prop: "showComments",
event: "changeState",
},
components: {
dialogBase,
commentsHeaderRenderer,
commentThreadRenderer,
continuationItemRenderer,
mainCommentReplyRenderer,
},
props: ["defaultContinuation", "commentData", "showComments"],
data: () => ({
loading: true,
@ -145,6 +146,18 @@ export default {
openReply(event) {
this.showReply = true;
if (this.showReply) {
const dismissReply = new backType(
() => {
this.showReply = false;
},
() => {
return this.showReply;
}
);
this.$vuetube.addBackAction(dismissReply);
}
this.replyData = { parent: event, replyContinuation: null };
},
},

View File

@ -31,18 +31,16 @@ import commentThreadRenderer from "~/components/Comments/commentThreadRenderer.v
import continuationItemRenderer from "~/components/observer.vue";
export default {
props: ["defaultContinuation", "parentComment", "showReplies"],
model: {
prop: "showReplies",
event: "changeState",
},
components: {
dialogBase,
commentsHeaderRenderer,
commentThreadRenderer,
continuationItemRenderer,
},
model: {
prop: "showReplies",
event: "changeState",
},
props: ["defaultContinuation", "parentComment", "showReplies"],
};
</script>

View File

@ -1,2 +0,0 @@
@import "~vuetify/src/styles/settings/_variables";
$bottom-sheet-inset-width: 70% !default;

View File

@ -1,4 +0,0 @@
import swipeableBottomSheet from "./swipeableBottomSheet";
export { swipeableBottomSheet };
export default swipeableBottomSheet;

View File

@ -1,34 +0,0 @@
import "./swipeableBottomSheet.sass";
// Extensions
import { VDialog } from "vuetify/lib";
/* @vue/component */
export default VDialog.extend({
name: "swipeable-bottom-sheet",
props: {
inset: Boolean,
maxWidth: [String, Number],
transition: {
type: String,
default: "bottom-sheet-transition",
},
},
computed: {
classes() {
return {
...VDialog.options.computed.classes.call(this),
"swipeable-bottom-sheet": true,
"swipeable-bottom-sheet--inset": this.inset,
};
},
contentClasses() {
return {
"swipeable-bottom-sheet__content": true,
"swipeable-bottom-sheet__content--active": this.isActive,
};
},
},
});

View File

@ -1,44 +0,0 @@
@import './_variables.scss'
// Transition
.bottom-sheet-transition
&-enter
transform: translateY(100%)
&-leave-to
transform: translateY(100%)
// Block
.swipeable-bottom-sheet
&.v-dialog
align-self: flex-end
border-radius: 0
flex: 0 1 auto
margin: 0
overflow: visible
&.swipeable-bottom-sheet--inset
max-width: $bottom-sheet-inset-width
@media #{map-get($display-breakpoints, 'xs-only')}
max-width: none
&.v-dialog:not(.v-dialog--fullscreen)
max-height: 100%
height: 100%
.swipeable-bottom-sheet__content
align-items: center
display: flex
justify-content: center
pointer-events: none
position: absolute
transition: .2s map-get($transition, 'fast-in-fast-out'), z-index 1ms
width: 100%
height: 100%
outline: none
inset: 0

View File

@ -6,15 +6,20 @@
<v-divider v-if="!$store.state.tweaks.roundTweak" />
<v-bottom-navigation
v-model="tabSelection"
style="padding: 0 !important; box-shadow: none !important"
class="transparent"
style="
box-shadow: none !important;
padding: 0 !important;
position: relative;
"
class="transparent nav"
:shift="$store.state.tweaks.navigationShift"
>
<v-btn
v-for="(item, i) in tabs"
:key="i"
v-ripple="false"
class="navButton"
active-class="link-active"
class="navButton link"
:to="item.link"
plain
>
@ -31,7 +36,7 @@
: 'var(--v-background-darken4)',
}"
:class="
tabSelection == i
tabSelection == i && $store.state.tweaks.navigationShift
? $vuetify.theme.dark
? 'tab primary darken-4'
: 'tab primary lighten-4'
@ -53,7 +58,7 @@
v-if="$store.state.tweaks.navigationIcons === 2"
xmlns="http://www.w3.org/2000/svg"
fill="currentColor"
viewBox="0 0 20 20"
viewBox="0 0 21 21"
height="1.5rem"
width="1.5rem"
class="mt-1"
@ -64,7 +69,7 @@
v-if="$store.state.tweaks.navigationIcons === 3"
xmlns="http://www.w3.org/2000/svg"
fill="currentColor"
viewBox="0 0 32 32"
viewBox="0 0 33 33"
height="1.5rem"
width="1.5rem"
class="mt-1"
@ -74,6 +79,7 @@
</div>
<v-icon
v-if="$store.state.tweaks.navigationIcons === 0"
class="my-1"
:color="
tabSelection == i
? 'primary'
@ -82,7 +88,7 @@
: 'background darken-4'
"
:class="
tabSelection == i
tabSelection == i && $store.state.tweaks.navigationShift
? $vuetify.theme.dark
? 'tab primary darken-4'
: 'tab primary lighten-4'
@ -92,6 +98,13 @@
/>
<!-- + (tabSelection == i ? '' : '-outline') -->
</v-btn>
<div
v-if="!$store.state.tweaks.navigationShift"
:style="{
top: $store.state.tweaks.navigationText ? '0.35rem' : '0.75rem',
}"
class="link-anime"
></div>
<!-- <v-btn
text
class="navButton mr-2 fill-height"
@ -151,15 +164,41 @@ export default {
</script>
<style scoped>
.link-anime {
right: 0;
height: 2rem;
width: 3.25rem;
position: absolute;
transition: transform 0.15s ease-in-out, scale 0.1s ease;
background-color: var(--v-primary-base);
padding: 0.1em 0.5em 0.1em 0.5em;
border-radius: 2rem;
opacity: 0.25;
z-index: -1;
scale: 0;
}
/* TODO: calculate inside <template></template> based on tabs.length */
.nav .link:first-child.link-active ~ .link-anime {
transform: translateX(calc(-75vw + 50%));
scale: 1;
}
.nav .link:nth-child(2).link-active ~ .link-anime {
transform: translateX(calc(-50vw + 50%));
scale: 1;
}
.nav .link:nth-child(3).link-active ~ .link-anime {
transform: translateX(calc(-25vw + 50%));
scale: 1;
}
.bottomNav {
/* box-shadow: inset 0 0 10rem var(--v-background-base) !important; */
height: calc(4rem + env(safe-area-inset-bottom)) !important;
padding-bottom: env(safe-area-inset-bottom) !important;
box-shadow: none !important;
position: fixed;
z-index: 100;
width: 100%;
bottom: 0;
z-index: 100;
}
.navButton {
width: 25vw !important;

View File

@ -4,7 +4,7 @@
class="toolbar-container d-flex flex-column background"
style="flex-direction: column !important"
>
<v-toolbar color="background" flat>
<v-toolbar color="background" style="position: sticky; top: 0" flat>
<slot name="header"></slot>
</v-toolbar>
<v-divider></v-divider>

View File

@ -241,21 +241,17 @@
"
/>
<swipeable-bottom-sheet
<div
v-if="loaded && video.commentData"
v-model="showComments"
hide-overlay
persistent
no-click-animation
style="z-index: 2 !important"
attach="#content-container"
:class="showComments ? 'comments-open' : ''"
class="scroll-y comments"
>
<mainCommentRenderer
v-model="showComments"
:comment-data="video.commentData"
:default-continuation="video.commentContinuation"
></mainCommentRenderer>
</swipeable-bottom-sheet>
</div>
<!-- <swipeable-bottom-sheet
:v-model="showComments"
@ -281,14 +277,12 @@
</template>
<script>
import player from "~/components/Player/index.vue";
import { Share } from "@capacitor/share";
import { getCpn } from "~/plugins/utils";
import ShelfRenderer from "~/components/SectionRenderers/shelfRenderer.vue";
import player from "~/components/Player/index.vue";
import VidLoadRenderer from "~/components/vidLoadRenderer.vue";
import ItemSectionRenderer from "~/components/SectionRenderers/itemSectionRenderer.vue";
import mainCommentRenderer from "~/components/Comments/mainCommentRenderer.vue";
import SwipeableBottomSheet from "~/components/ExtendedComponents/swipeableBottomSheet";
import SlimVideoDescriptionRenderer from "~/components/UtilRenderers/slimVideoDescriptionRenderer.vue";
import backType from "~/plugins/classes/backType";
@ -296,11 +290,9 @@ import backType from "~/plugins/classes/backType";
export default {
components: {
player,
ShelfRenderer,
VidLoadRenderer,
ItemSectionRenderer,
mainCommentRenderer,
SwipeableBottomSheet,
SlimVideoDescriptionRenderer,
},
layout: "empty",
@ -494,6 +486,7 @@ export default {
// Toggle this.showComments to true or false. If it is true, then add the dismiss function to backStack.
toggleComment() {
document.getElementById("content-container").scrollTo(0, 0);
this.showComments = !this.showComments;
if (this.showComments) {
const dismissComment = new backType(
@ -512,6 +505,24 @@ export default {
</script>
<style>
.comments {
left: 0;
right: 0;
bottom: 0;
opacity: 0;
z-index: 2;
height: 100%;
max-height: 100%;
position: absolute;
pointer-events: none;
transform: translateY(100%);
transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}
.comments-open {
transform: translatey(0);
pointer-events: auto;
opacity: 1;
}
#watch-body {
height: 100%;
max-height: 100vh;

View File

@ -8,7 +8,7 @@ module.exports = {
restart: "Mulakan semula",
later: "Kemudian",
settingRestart:
"Mengubah tetapan ini memerlukan apl untuk dimulakan semula untuk menerapkan tetapan.",
"Mengubah tetapan ini memerlukan apl dimulakan semula untuk menerapkan tetapan.",
okay: "OK",
},
@ -27,8 +27,8 @@ module.exports = {
plugins: "Pemalam",
startup: "Permulaan",
theme: "Tema",
tweaks: "Pelarasan",
updates: "Kemaskini"
tweaks: "Pengubahsuaian",
updates: "Kemaskini",
},
index: {
@ -41,7 +41,7 @@ module.exports = {
general: "Umum",
theme: "Tema",
player: "Pemain",
uitweaker: "Pelarasan UI",
uitweaker: "Pengubahsuaian UI",
startupoptions: "Pilihan Permulaan",
plugins: "Pemalam",
updates: "Kemaskini",
@ -55,7 +55,7 @@ module.exports = {
language: "Bahasa",
backup: "Sandaran",
backupinfo: "Sandarkan atau pulihkan semula tetapan aplikasi anda",
restore: "Pulihkan semula"
restore: "Pulihkan semula",
},
theme: {
normal: "Normal",
@ -69,9 +69,9 @@ module.exports = {
tweaks: {
fullscreen: "Skrin Penuh",
navbarblur: "Bar Navigasi Kabur",
roundedcorners: "Sudut Bulat",
roundthumbnails: "Lakaran Kecil Bulat",
roundwatchpagecomponents: "Komponen Halaman Tonton Bulat",
roundedcorners: "Sudut Berbucu Bulat",
roundthumbnails: "Lakaran Kecil Berbucu Bulat",
roundwatchpagecomponents: "Komponen Halaman Tonton Berbucu Bulat",
radius: "Radius",
},
startup: {

View File

@ -76,16 +76,18 @@ Az alkalmazás telepítéséhez látogasson el erre az oldalra [vuetube.app/inst
### Android
| <a href=https://nightly.link/VueTubeApp/VueTube/workflows/ci/main/android.zip><img id="im" width="200" src=https://raw.githubusercontent.com/VueTubeApp/VueTube/main/resources/getunstable.png></a> | <a href=https://github.com/VueTubeApp/VueTube/releases/tag/0.4.2><img id="im" width="200" src=https://raw.githubusercontent.com/VueTubeApp/VueTube/main/resources/getcanary.png></a> | <a href=https://vuetube.app/install><img id="im" width="200" src=https://raw.githubusercontent.com/VueTubeApp/VueTube/main/resources/getstable.png></a> |
| <a href=https://nightly.link/VueTubeApp/VueTube/workflows/ci/main/android.zip><img id="im" width="200" src=https://raw.githubusercontent.com/VueTubeApp/VueTube/main/resources/getunstable.png></a> | <a href=https://github.com/VueTubeApp/VueTube/releases/tag/0.5><img id="im" width="200" src=https://raw.githubusercontent.com/VueTubeApp/VueTube/main/resources/getcanary.png></a> | <a href=https://vuetube.app/install><img id="im" width="200" src=https://raw.githubusercontent.com/VueTubeApp/VueTube/main/resources/getstable.png></a> |
| --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Eléggé unstabil, de előre megkapod a legújabb funkciókat. | Kevesebb hiba van benne mint a Unstable-ben, de mégis több a funkció benne mint a Stable-ben. | Még nem elérhető. |
### iOS
| <a href=https://nightly.link/VueTubeApp/VueTube/workflows/ci/main/iOS.zip><img id="im" width="200" src=https://raw.githubusercontent.com/VueTubeApp/VueTube/main/resources/getunstable.png></a> | <a href=https://cdn.discordapp.com/attachments/949908267855921163/972164558930198528/VueTube-Canary-May-6-2022.ipa><img id="im" width="200" src=https://raw.githubusercontent.com/VueTubeApp/VueTube/main/resources/getcanary.png></a> | <a href=https://vuetube.app/install><img id="im" width="200" src=https://raw.githubusercontent.com/VueTubeApp/VueTube/main/resources/getstable.png></a> |
| <a href=https://nightly.link/VueTubeApp/VueTube/workflows/ci/main/iOS.zip><img id="im" width="200" src=https://raw.githubusercontent.com/VueTubeApp/VueTube/main/resources/getunstable.png></a> | <a href=https://github.com/VueTubeApp/VueTube/releases/tag/0.3><img id="im" width="200" src=https://raw.githubusercontent.com/VueTubeApp/VueTube/main/resources/getcanary.png></a> | <a href=https://vuetube.app/install><img id="im" width="200" src=https://raw.githubusercontent.com/VueTubeApp/VueTube/main/resources/getstable.png></a> |
| ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Eléggé unstabil, de előre megkapod a legújabb funkciókat. | Kevesebb hiba van benne mint a Unstable-ben, de mégis több a funkció benne mint a Stable-ben. | Még nem elérhető. |
(Az Apple hivatalosan nem támogatja a sideloading-ot, vagyis nem lehet az alkalmazások telepítését csak a fájllal tenni anélkül, hogy azokat feltöltenék a cég hivatalos boltjába. A VueTube iPhone / iPad eszközökre történő telepítéséhez speciális módszereket kell használod)
</details>
<h2 align="left">