0
0
Fork 0
mirror of https://github.com/VueTubeApp/VueTube synced 2024-11-25 04:35:17 +00:00

Community post placeholder

This commit is contained in:
Nikita Krupin 2022-05-19 13:52:08 -04:00
parent 9fa841b6e7
commit 228c560386
6 changed files with 125 additions and 9 deletions

View file

@ -22,12 +22,12 @@
:render="render.content[Object.keys(render.content)[0]]"
></component>
</div>
<!-- <div
<div
v-if="render.separator && render.separator.hasBottomSeparator"
class="separator-bottom background"
:class="$vuetify.theme.dark ? 'lighten-1' : 'darken-1'"
:style="{ height: render.separator.height + 'px' }"
></div> -->
></div>
</div>
</template>

View file

@ -1,11 +1,23 @@
<template>
<div>
<b>Description</b>
<div class="pa-8">
<h3 class="my-2">Description</h3>
<p>{{ $store.state.channel.descriptionPreview }}</p>
<br />
<br />
<b>Links</b>
<h3 class="my-2">Links</h3>
<div v-ripple class="py-2 d-flex flex-row">
<v-avatar tile size="20" color="primary"> </v-avatar>
<span class="ml-4 primary--text">Social Media</span>
</div>
<br />
<b>More Info</b>
<h3 class="my-2">More Info</h3>
<div v-ripple class="py-2 d-flex flex-row">
<v-icon size="24" color="primary">mdi-web</v-icon>
<span class="ml-4">https://www.youtube.com/c/todo</span>
</div>
<div v-ripple class="py-2 d-flex flex-row">
<v-icon size="24" color="primary">mdi-earth</v-icon>
<span class="ml-4">United States</span>
</div>
</div>
</template>

View file

@ -1,5 +1,5 @@
<template>
<div class="pt-4">
<div>
<v-list-item
v-for="(channel, index) in $store.state.channel.featuredChannels"
:key="index"

View file

@ -1,3 +1,89 @@
<template>
<div></div>
<div>
<!-- TODO: make this a community-post-renderer -->
<v-card
v-ripple
flat
class="background"
:class="
$store.state.tweaks.roundThumb && $store.state.tweaks.roundTweak > 0
? $vuetify.theme.dark
? 'lighten-1'
: 'darken-1'
: ''
"
:style="{
borderRadius: $store.state.tweaks.roundThumb
? `${$store.state.tweaks.roundTweak / 2}rem`
: '0',
margin:
$store.state.tweaks.roundThumb && $store.state.tweaks.roundTweak > 0
? '0 1rem 1rem 1rem'
: '0 0 0.25rem 0',
}"
>
<div class="d-flex flex-row pa-4">
<v-avatar size="50" color="primary" />
<div class="d-flex flex-column my-auto pl-4">
<b>Work in progress</b>
<div
class="background--text"
:class="$vuetify.theme.dark ? 'text--lighten-4' : 'text--darken-4'"
>
69 years ago
</div>
</div>
<v-btn
fab
text
elevation="0"
style="width: 50px !important; height: 50px !important"
@click.prevent=""
>
<v-icon>mdi-share-outline</v-icon>
<div
class="mt-2"
style="font-size: 0.66rem"
v-text="item.value || item.name"
/>
</v-btn>
</div>
<p class="px-4">Blurb Blurb Text Goes Here ...</p>
<v-img
contain
class="background my-4"
:class="$vuetify.theme.dark ? 'lighten-2' : 'darken-2'"
style="max-height: 15rem"
:style="{
borderRadius: `${$store.state.tweaks.roundTweak / 4}rem`,
marginLeft:
!(
$store.state.tweaks.roundThumb && $store.state.tweaks.roundTweak
) > 0
? '1rem'
: '0',
marginRight:
!(
$store.state.tweaks.roundThumb && $store.state.tweaks.roundTweak
) > 0
? '1rem'
: '0',
}"
src="/dev.svg"
/>
<div class="d-flex flex-row px-4 pb-4">
<v-icon>mdi-thumb-up-outline</v-icon>
<b class="mx-2">123</b>
<v-icon class="ml-2">mdi-thumb-down-outline</v-icon>
</div>
</v-card>
<div
v-if="
!($store.state.tweaks.roundThumb && $store.state.tweaks.roundTweak > 0)
"
class="separator-bottom background"
:class="$vuetify.theme.dark ? 'lighten-1' : 'darken-1'"
style="height: 4px"
></div>
</div>
</template>

View file

@ -1,3 +1,12 @@
<template>
<div></div>
<div>
<!-- <compact-video-renderer :video="$store.state.channel.videoExample" /> -->
</div>
</template>
<script>
import CompactVideoRenderer from "../../components/CompactRenderers/compactVideoRenderer.vue";
export default {
components: { CompactVideoRenderer },
};
</script>

View file

@ -11,6 +11,7 @@ const getDefaultState = () => {
subscribers: null,
videosCount: null,
featuredChannels: null,
videoExample: null,
};
};
export const state = () => {
@ -55,6 +56,14 @@ export const actions = {
);
state.featuredChannels =
featuredSection.shelfRenderer.content.horizontalListRenderer.items;
console.log(
channel.contents.singleColumnBrowseResultsRenderer.tabs[0].tabRenderer
.content.sectionListRenderer.contents[0].shelfRenderer.content
.verticalListRenderer.items[0].elementRenderer.newElement.type
.componentType.model
);
state.videoExample =
channel.contents.singleColumnBrowseResultsRenderer.tabs[0].tabRenderer.content.sectionListRenderer.contents[0].shelfRenderer.content.verticalListRenderer.items[0].elementRenderer.newElement.type.componentType.model.videoWithContextModel.videoWithContextData.videoData;
})
.catch((err) => {
state.loading = false;