etc/VueTube
0
0
Fork 0
mirror of https://github.com/VueTubeApp/VueTube synced 2024-11-22 03:05:15 +00:00
Code Issues Projects Releases Wiki Activity

bug fixes & improvements

Browse source
This commit is contained in:
Nikita Krupin 2022-05-17 23:19:22 -04:00
parent 2614d66c60
commit f131069ce4
9 changed files with 280 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
NUXT/components/CompactRenderers/compactChannelRenderer.vue
View file

@ -3,6 +3,18 @@
flat
to="/channel"
class="entry gridVideoRenderer background"
:class="
roundThumb && roundTweak > 0
? $vuetify.theme.dark
? 'background lighten-1'
: 'background darken-1'
: ''
"
:style="{
borderRadius: roundThumb ? `${roundTweak / 2}rem` : '0',
margin:
roundThumb && roundTweak > 0 ? '0 1rem 1rem 1rem' : '0 0 0.25rem 0',
}"
@click="$store.dispatch('channel/fetchChannel', video.channelId)"
>
<div id="details">
@ -20,7 +32,7 @@
"
/>
</a>
<v-card-text class="video-info pt-2" v-emoji>
<v-card-text class="video-info pt-2 pb-0" v-emoji>
<div
v-for="title in video.title.runs"
:key="title.text"
@ -43,6 +55,14 @@
<script>
export default {
props: ["video"],
computed: {
roundTweak() {
return this.$store.state.tweaks.roundTweak;
},
roundThumb() {
return this.$store.state.tweaks.roundThumb;
},
},
methods: {
parseBottom(video) {
const bottomText = [
@ -69,7 +89,6 @@ export default {
}
.avatar-thumbnail {
margin-top: 0.5rem;
margin-left: 0.5rem;
border-radius: 50%;
width: 50px;

2
NUXT/components/ListRenderers/sectionListRenderer.vue
View file

@ -6,8 +6,8 @@
class="pa-0 min-height-0"
>
<component
v-if="getComponents()[Object.keys(renderer)[0]]"
:is="Object.keys(renderer)[0]"
v-if="getComponents()[Object.keys(renderer)[0]]"
:key="index"
:render="renderer[Object.keys(renderer)[0]]"
></component>

4
NUXT/components/ListRenderers/verticalListRenderer.vue
View file

@ -1,13 +1,13 @@
<template>
<div>
<div class="fill-width">
<v-list-item
v-for="(video, index) in render.items"
:key="index"
class="pa-0 min-height-0"
>
<component
v-if="getComponents()[Object.keys(video)[0]]"
:is="Object.keys(video)[0]"
v-if="getComponents()[Object.keys(video)[0]]"
:key="video[Object.keys(video)[0]].videoId"
:video="video[Object.keys(video)[0]]"
></component>

4
NUXT/components/SectionRenderers/itemSectionRenderer.vue
View file

@ -14,7 +14,9 @@
</v-list-item>
<div
v-if="
render.separatorDetails && render.separatorDetails.hasBottomSeparator
render.separatorDetails &&
render.separatorDetails.hasBottomSeparator &&
!($store.state.tweaks.roundThumb && $store.state.tweaks.roundTweak > 0)
"
class="separator-bottom background"
:class="$vuetify.theme.dark ? 'lighten-1' : 'darken-1'"

33
NUXT/components/SectionRenderers/shelfRenderer.vue
View file

@ -1,18 +1,27 @@
<template>
<div class="fill-width">
<h4 v-if="render.headerRenderer" class="font-weight-bold shelf-header">
<h4
v-if="render.headerRenderer"
class="font-weight-bold shelf-header"
:style="{
marginLeft:
$store.state.tweaks.roundThumb && $store.state.tweaks.roundTweak > 0
? '1rem'
: '0',
}"
>
{{
render.headerRenderer.elementRenderer.newElement.type.componentType
.model.shelfHeaderModel.shelfHeaderData.title
}}
</h4>
<v-list-item class="pa-0 min-height-0">
<div class="pa-0 min-height-0">
<component
v-if="render.content && getComponents()[Object.keys(render.content)[0]]"
:is="Object.keys(render.content)[0]"
v-if="render.content && getComponents()[Object.keys(render.content)[0]]"
:render="render.content[Object.keys(render.content)[0]]"
></component
></v-list-item>
></component>
</div>
<!-- <div
v-if="render.separator && render.separator.hasBottomSeparator"
class="separator-bottom background"
@ -22,13 +31,6 @@
</div>
</template>
<style scoped>
.shelf-header {
width: 100%; /* Prevent Loading Weirdness */
padding: 10px;
}
</style>
<script>
import verticalListRenderer from "~/components/ListRenderers/verticalListRenderer.vue";
import horizontalListRenderer from "~/components/ListRenderers/horizontalListRenderer.vue";
@ -47,3 +49,10 @@ export default {
},
};
</script>
<style scoped>
.shelf-header {
width: 100%; /* Prevent Loading Weirdness */
padding: 10px;
}
</style>

221
NUXT/components/ryd.vue Normal file
View file

@ -0,0 +1,221 @@
<template>
<div class="ryd">
<div class="ryd__container">
<div class="ryd__content">
<slot></slot>
</div>
</div>
</div>
</template>
<script>
export default {
data: () => ({
apiUrl: "https://returnyoutubedislikeapi.com",
storedData: {
likes: 0,
dislikes: 0,
previousState: "NEUTRAL_STATE",
},
}),
methods: {
async solvePuzzle(puzzle) {
let challenge = Uint8Array.from(atob(puzzle.challenge), (c) =>
c.charCodeAt(0)
);
let buffer = new ArrayBuffer(20);
let uInt8View = new Uint8Array(buffer);
let uInt32View = new Uint32Array(buffer);
let maxCount = Math.pow(2, puzzle.difficulty) * 3;
for (let i = 4; i < 20; i++) {
uInt8View[i] = challenge[i - 4];
}
for (let i = 0; i < maxCount; i++) {
uInt32View[0] = i;
let hash = await crypto.subtle.digest("SHA-512", buffer);
let hashUint8 = new Uint8Array(hash);
if (countLeadingZeroes(hashUint8) >= puzzle.difficulty) {
return {
solution: btoa(
String.fromCharCode.apply(null, uInt8View.slice(0, 4))
),
};
}
}
return {};
},
generateUserID(length = 36) {
const charset =
"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
let result = "";
if (crypto && crypto.getRandomValues) {
const values = new Uint32Array(length);
crypto.getRandomValues(values);
for (let i = 0; i < length; i++) {
result += charset[values[i] % charset.length];
}
return result;
} else {
for (let i = 0; i < length; i++) {
result += charset[Math.floor(Math.random() * charset.length)];
}
return result;
}
},
storageChangeHandler(changes, area) {
if (changes.disableVoteSubmission !== undefined) {
handleDisableVoteSubmissionChangeEvent(
changes.disableVoteSubmission.newValue
);
}
if (changes.coloredThumbs !== undefined) {
handleColoredThumbsChangeEvent(changes.coloredThumbs.newValue);
}
if (changes.coloredBar !== undefined) {
handleColoredBarChangeEvent(changes.coloredBar.newValue);
}
if (changes.colorTheme !== undefined) {
handleColorThemeChangeEvent(changes.colorTheme.newValue);
}
if (changes.numberDisplayRoundDown !== undefined) {
handleNumberDisplayRoundDownChangeEvent(
changes.numberDisplayRoundDown.newValue
);
}
if (changes.numberDisplayFormat !== undefined) {
handleNumberDisplayFormatChangeEvent(
changes.numberDisplayFormat.newValue
);
}
if (changes.numberDisplayReformatLikes !== undefined) {
handleNumberDisplayReformatLikesChangeEvent(
changes.numberDisplayReformatLikes.newValue
);
}
},
async sendVote(videoId, vote) {
api.storage.sync.get(null, async (storageResult) => {
if (!storageResult.userId || !storageResult.registrationConfirmed) {
await this.register();
}
let voteResponse = await fetch(`${apiUrl}/interact/vote`, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
userId: storageResult.userId,
videoId,
value: vote,
}),
});
if (voteResponse.status == 401) {
await this.register();
await this.sendVote(videoId, vote);
return;
}
const voteResponseJson = await voteResponse.json();
const solvedPuzzle = await this.solvePuzzle(voteResponseJson);
if (!solvedPuzzle.solution) {
await this.sendVote(videoId, vote);
return;
}
await fetch(`${apiUrl}/interact/confirmVote`, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
...solvedPuzzle,
userId: storageResult.userId,
videoId,
}),
});
});
},
async register() {
const userId = this.generateUserID();
api.storage.sync.set({ userId });
const registrationResponse = await fetch(
`${apiUrl}/puzzle/registration?userId=${userId}`,
{
method: "GET",
headers: {
Accept: "application/json",
},
}
).then((response) => response.json());
const solvedPuzzle = await this.solvePuzzle(registrationResponse);
if (!solvedPuzzle.solution) {
await this.register();
return;
}
const result = await fetch(
`${apiUrl}/puzzle/registration?userId=${userId}`,
{
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(solvedPuzzle),
}
).then((response) => response.json());
if (result === true) {
return api.storage.sync.set({ registrationConfirmed: true });
}
},
like() {
if (checkForSignInButton() === false) {
if (this.storedData.previousState === "DISLIKED_STATE") {
sendVote(1);
if (this.storedData.dislikes > 0) this.storedData.dislikes--;
this.storedData.likes++;
createRateBar(this.storedData.likes, this.storedData.dislikes);
setDislikes(numberFormat(this.storedData.dislikes));
this.storedData.previousState = "LIKED_STATE";
} else if (this.storedData.previousState === "NEUTRAL_STATE") {
sendVote(1);
this.storedData.likes++;
createRateBar(this.storedData.likes, this.storedData.dislikes);
this.storedData.previousState = "LIKED_STATE";
} else if ((this.storedData.previousState = "LIKED_STATE")) {
sendVote(0);
if (this.storedData.likes > 0) this.storedData.likes--;
createRateBar(this.storedData.likes, this.storedData.dislikes);
this.storedData.previousState = "NEUTRAL_STATE";
}
}
},
dislike() {
if (checkForSignInButton() == false) {
if (this.storedData.previousState === "NEUTRAL_STATE") {
sendVote(-1);
this.storedData.dislikes++;
setDislikes(numberFormat(this.storedData.dislikes));
createRateBar(this.storedData.likes, this.storedData.dislikes);
this.storedData.previousState = "DISLIKED_STATE";
} else if (this.storedData.previousState === "DISLIKED_STATE") {
sendVote(0);
if (this.storedData.dislikes > 0) this.storedData.dislikes--;
setDislikes(numberFormat(this.storedData.dislikes));
createRateBar(this.storedData.likes, this.storedData.dislikes);
this.storedData.previousState = "NEUTRAL_STATE";
} else if (this.storedData.previousState === "LIKED_STATE") {
sendVote(-1);
if (this.storedData.likes > 0) this.storedData.likes--;
this.storedData.dislikes++;
setDislikes(numberFormat(this.storedData.dislikes));
createRateBar(this.storedData.likes, this.storedData.dislikes);
this.storedData.previousState = "DISLIKED_STATE";
}
}
},
},
};
</script>

11
NUXT/layouts/default.vue
View file

@ -69,7 +69,7 @@
tile
dense
class="searchButton text-left text-none"
@click="youtubeSearch(item[1])"
@click="youtubeSearch(item)"
>
<v-icon class="mr-5">mdi-magnify</v-icon>
{{ item[0] }}
@ -170,10 +170,7 @@ export default {
if (isLink) {
this.response = [
`Watch Video from ID: ${isLink.searchParams.get("v")}`,
{
text: `Watch Video from ID: ${isLink.searchParams.get("v")}`,
id: isLink.searchParams.get("v"),
},
{ id: isLink.searchParams.get("v") },
];
return;
}
@ -181,7 +178,9 @@ export default {
},
youtubeSearch(item) {
const link = item.id ? `/watch?v=${item.id}` : `/search?q=${item[0]}`;
const link = item[1].id
? `/watch?v=${item[1].id}` // link pasted
: `/search?q=${item[0]}`; // regular suggestion
this.$router.push(link);
this.search = false;
},

4
NUXT/pages/watch.vue
View file

@ -379,7 +379,6 @@ export default {
// using item.action in the v-for loop
this[name]();
},
dislike() {},
async share() {
// this.share = !this.share;
await Share.share({
@ -431,7 +430,8 @@ export default {
{
name: "Likes",
icon: "mdi-thumb-up-outline",
// action: null,
// action: this.like(),
actionName: "like",
value: this.likes,
disabled: true,
},

8
NUXT/store/tweaks/index.js
View file

@ -9,10 +9,10 @@ export const mutations = {
// currently called on mounted() in pages/index.vue
if (process.client) {
state.roundTweak = localStorage.getItem("roundTweak") || 0;
state.roundThumb = localStorage.getItem("roundThumb");
state.roundWatch = localStorage.getItem("roundWatch");
console.log(state.roundThumb);
console.log(state.roundWatch);
state.roundThumb =
JSON.parse(localStorage.getItem("roundThumb")) === true;
state.roundWatch =
JSON.parse(localStorage.getItem("roundWatch")) === true;
}
},
setRoundTweak(state, payload) {