mirror of https://github.com/VueTubeApp/VueTube
feat: added description rendering
This commit is contained in:
parent
0baa3611cc
commit
123a28b9a3
|
@ -0,0 +1,33 @@
|
||||||
|
<template>
|
||||||
|
<div class="description">
|
||||||
|
<div v-for="(text, index) in render.description.runs" :key="index">
|
||||||
|
<component
|
||||||
|
:is="text.navigationEndpoint ? 'a' : 'span'"
|
||||||
|
:href="parseLinks(text.navEndpoint)"
|
||||||
|
target="_blank"
|
||||||
|
>{{ text.text }}
|
||||||
|
</component>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped></style>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props: ["render"],
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
parseLinks(navEndpoint) {
|
||||||
|
if (!navEndpoint) return;
|
||||||
|
if (navEndpoint.webviewEndpoint.url) {
|
||||||
|
return navEndpoint.webviewEndpoint.url;
|
||||||
|
} else if (navEndpoint.browseEndpoint) {
|
||||||
|
return navEndpoint.browseEndpoint.canonicalBaseUrl;
|
||||||
|
} else if (navEndpoint.navigationEndpoint) {
|
||||||
|
return; //for now
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
|
@ -137,9 +137,5 @@ export default {
|
||||||
return bottomText.join(" · ");
|
return bottomText.join(" · ");
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
mounted() {
|
|
||||||
console.log("gridVideoRenderer received: ", this.video);
|
|
||||||
},
|
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -60,7 +60,7 @@
|
||||||
<p>Channel Stuff</p>
|
<p>Channel Stuff</p>
|
||||||
</v-card-text>
|
</v-card-text>
|
||||||
<div v-if="showMore" class="scroll-y ml-2 mr-2">
|
<div v-if="showMore" class="scroll-y ml-2 mr-2">
|
||||||
{{ description }}
|
<slim-video-description-renderer :render="description">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- <v-bottom-sheet
|
<!-- <v-bottom-sheet
|
||||||
|
@ -102,9 +102,10 @@
|
||||||
import { Share } from "@capacitor/share";
|
import { Share } from "@capacitor/share";
|
||||||
import ShelfRenderer from "~/components/SectionRenderers/shelfRenderer.vue";
|
import ShelfRenderer from "~/components/SectionRenderers/shelfRenderer.vue";
|
||||||
import VidLoadRenderer from "~/components/vidLoadRenderer.vue";
|
import VidLoadRenderer from "~/components/vidLoadRenderer.vue";
|
||||||
|
import SlimVideoDescriptionRenderer from '../components/UtilRenderers/slimVideoDescriptionRenderer.vue';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: { ShelfRenderer, VidLoadRenderer },
|
components: { ShelfRenderer, VidLoadRenderer, SlimVideoDescriptionRenderer },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
interactions: [
|
interactions: [
|
||||||
|
@ -181,7 +182,7 @@ export default {
|
||||||
|
|
||||||
//--- Content Stuff ---//
|
//--- Content Stuff ---//
|
||||||
this.title = result.title;
|
this.title = result.title;
|
||||||
this.description = result.metadata.description; // While this works, I do recommend using the rendered description instead in the future as there are some things a pure string wouldn't work with
|
this.description = result.renderedData.description; // While this works, I do recommend using the rendered description instead in the future as there are some things a pure string wouldn't work with
|
||||||
this.views = result.metadata.viewCount.toLocaleString();
|
this.views = result.metadata.viewCount.toLocaleString();
|
||||||
this.likes = result.metadata.likes.toLocaleString();
|
this.likes = result.metadata.likes.toLocaleString();
|
||||||
this.uploaded = result.metadata.uploadDate;
|
this.uploaded = result.metadata.uploadDate;
|
||||||
|
|
|
@ -19,7 +19,6 @@ const ytApiVal = {
|
||||||
module.exports = {
|
module.exports = {
|
||||||
URLS: url,
|
URLS: url,
|
||||||
YT_API_VALUES: ytApiVal,
|
YT_API_VALUES: ytApiVal,
|
||||||
|
|
||||||
LOGGER_NAMES: {
|
LOGGER_NAMES: {
|
||||||
search: "Search",
|
search: "Search",
|
||||||
autoComplete: "AutoComplete",
|
autoComplete: "AutoComplete",
|
||||||
|
|
|
@ -181,9 +181,11 @@ class Innertube {
|
||||||
response.data.output?.playabilityStatus?.status == ("ERROR" || undefined)
|
response.data.output?.playabilityStatus?.status == ("ERROR" || undefined)
|
||||||
)
|
)
|
||||||
throw new Error(
|
throw new Error(
|
||||||
`Could not get information for video: ${response.status_code ||
|
`Could not get information for video: ${
|
||||||
response.data.output?.playabilityStatus?.status
|
response.status_code ||
|
||||||
} - ${response.message || response.data.output?.playabilityStatus?.reason
|
response.data.output?.playabilityStatus?.status
|
||||||
|
} - ${
|
||||||
|
response.message || response.data.output?.playabilityStatus?.reason
|
||||||
}`
|
}`
|
||||||
);
|
);
|
||||||
const responseInfo = response.data.output;
|
const responseInfo = response.data.output;
|
||||||
|
@ -241,7 +243,7 @@ class Innertube {
|
||||||
.find((contents) => contents.slimVideoMetadataSectionRenderer)
|
.find((contents) => contents.slimVideoMetadataSectionRenderer)
|
||||||
.slimVideoMetadataSectionRenderer?.contents.find(
|
.slimVideoMetadataSectionRenderer?.contents.find(
|
||||||
(contents) => contents.slimVideoDescriptionRenderer
|
(contents) => contents.slimVideoDescriptionRenderer
|
||||||
)?.slimVideoDescriptionRenderer.description.runs,
|
)?.slimVideoDescriptionRenderer,
|
||||||
recommendations: columnUI?.contents.find(
|
recommendations: columnUI?.contents.find(
|
||||||
(contents) => contents.shelfRenderer
|
(contents) => contents.shelfRenderer
|
||||||
).shelfRenderer,
|
).shelfRenderer,
|
||||||
|
|
Loading…
Reference in New Issue