Added movies page to actors, entities and tags.

This commit is contained in:
DebaucheryLibrarian 2024-08-22 06:23:41 +02:00
parent a903c7f31f
commit c38206bbbf
12 changed files with 229 additions and 83 deletions

View File

@ -1,7 +1,8 @@
<template>
<nav class="domains">
<Link
:href="getPath('scenes')"
v-if="domains.includes('scenes')"
:href="`${path}/scenes`"
class="domain domain-scenes nolink"
:active="domain === 'scenes'"
>
@ -10,7 +11,8 @@
</Link>
<Link
:href="getPath('actors')"
v-if="domains.includes('actors')"
:href="`${path}/actors`"
class="domain domain-actors nolink"
:active="domain === 'actors'"
>
@ -19,7 +21,8 @@
</Link>
<Link
:href="getPath('movies')"
v-if="domains.includes('movies')"
:href="`${path}/movies`"
class="domain domain-movies nolink"
:active="domain === 'movies'"
>
@ -30,20 +33,24 @@
</template>
<script setup>
const props = defineProps({
defineProps({
stash: {
type: Object,
default: null,
},
path: {
type: String,
default: '',
},
domains: {
type: Array,
default: () => ['scenes', 'actors', 'movies'],
},
domain: {
type: String,
default: 'scenes',
},
});
function getPath(targetDomain) {
return `/stash/${props.stash.user.username}/${props.stash.slug}/${targetDomain}`;
}
</script>
<style scoped>
@ -52,10 +59,30 @@ function getPath(targetDomain) {
justify-content: center;
gap: .5rem;
padding: 0 1rem;
&.light .domain,
&.light .domain {
color: var(--glass-strong-10);
.icon {
fill: var(--glass-strong-10);
}
&.active,
&:hover {
color: var(--primary);
.icon {
fill: var(--primary);
}
}
}
}
.domain {
height: 100%;
display: flex;
align-items: center;
box-sizing: border-box;
padding: .75rem 1rem;
color: var(--highlight-strong-10);
@ -82,7 +109,7 @@ function getPath(targetDomain) {
transform: translateY(1px);
}
.domains-bar {
.domains-bar:not(.light) {
background: var(--grey-dark-50);
box-shadow: inset 0 0 3px var(--shadow);
}

View File

@ -16,8 +16,8 @@
</h2>
<Domains
:stash="stash"
:domain="domain"
:path="`/stash/${stash.user.username}/${stash.slug}`"
class="domains-header"
/>
@ -33,8 +33,8 @@
</div>
<Domains
:stash="stash"
:domain="domain"
:path="`/stash/${stash.user.username}/${stash.slug}`"
class="domains-bar"
/>
@ -47,7 +47,7 @@
<script setup>
import { inject } from 'vue';
import Domains from './domains.vue';
import Domains from '#/components/domains/domains.vue';
const pageContext = inject('pageContext');
const { routeParams } = pageContext;

View File

@ -53,7 +53,15 @@
>
</div>
<Scenes />
<Domains
:domain="domain"
:path="`/actor/${actor.id}/${actor.slug}`"
:domains="['scenes', 'movies']"
class="domains-bar light"
/>
<Scenes v-if="domain === 'scenes'" />
<Movies v-if="domain === 'movies'" />
</div>
</div>
</template>
@ -66,12 +74,16 @@ import getPath from '#/src/get-path.js';
import Bio from '#/components/actors/bio.vue';
import Gender from '#/components/actors/gender.vue';
import Scenes from '#/components/scenes/scenes.vue';
import Movies from '#/components/movies/movies.vue';
import Heart from '#/components/stashes/heart.vue';
import Domains from '#/components/domains/domains.vue';
const pageContext = inject('pageContext');
const { pageProps } = pageContext;
const { pageProps, routeParams } = pageContext;
const { actor } = pageProps;
const domain = routeParams.domain;
const photos = Object.values(Object.fromEntries(actor.profiles
.filter((profile) => !!profile.avatar)
.map((profile) => [profile.avatar.id, {
@ -152,6 +164,11 @@ const photos = Object.values(Object.fromEntries(actor.profiles
}
}
.domains-bar {
background: var(--background-base-10);
border-bottom: solid 1px var(--shadow-weak-40);
}
@media(--compact) {
.photos.has-avatar {
display: flex;

View File

@ -2,12 +2,13 @@ import { render } from 'vike/abort'; /* eslint-disable-line import/extensions */
import { fetchActorsById } from '#/src/actors.js';
import { fetchScenes } from '#/src/scenes.js';
import { fetchMovies } from '#/src/movies.js';
import { curateScenesQuery } from '#/src/web/scenes.js';
import { curateMoviesQuery } from '#/src/web/movies.js';
export async function onBeforeRender(pageContext) {
const [[actor], actorScenes] = await Promise.all([
fetchActorsById([Number(pageContext.routeParams.actorId)], {}, pageContext.user),
fetchScenes(await curateScenesQuery({
async function fetchReleases(pageContext) {
if (pageContext.routeParams.domain === 'movies') {
return fetchMovies(await curateMoviesQuery({
...pageContext.urlQuery,
scope: pageContext.routeParams.scope || 'latest',
actorId: Number(pageContext.routeParams.actorId),
@ -16,7 +17,25 @@ export async function onBeforeRender(pageContext) {
page: Number(pageContext.routeParams.page) || 1,
limit: Number(pageContext.urlParsed.search.limit) || 30,
aggregate: true,
}, pageContext.user),
}, pageContext.user);
}
return fetchScenes(await curateScenesQuery({
...pageContext.urlQuery,
scope: pageContext.routeParams.scope || 'latest',
actorId: Number(pageContext.routeParams.actorId),
tagFilter: pageContext.tagFilter,
}), {
page: Number(pageContext.routeParams.page) || 1,
limit: Number(pageContext.urlParsed.search.limit) || 30,
aggregate: true,
}, pageContext.user);
}
export async function onBeforeRender(pageContext) {
const [[actor], actorReleases] = await Promise.all([
fetchActorsById([Number(pageContext.routeParams.actorId)], {}, pageContext.user),
fetchReleases(pageContext),
]);
if (!actor) {
@ -28,7 +47,7 @@ export async function onBeforeRender(pageContext) {
title: actor.name,
pageProps: {
actor,
...actorScenes,
...actorReleases,
},
},
};

View File

@ -1,7 +1,7 @@
import { match } from 'path-to-regexp';
// import { resolveRoute } from 'vike/routing'; // eslint-disable-line import/extensions
const path = '/actor/:actorId/:actorSlug?/:scope?/:page?';
const path = '/actor/:actorId/:actorSlug?/:domain(scenes|movies)?/:scope?/:page?';
const urlMatch = match(path, { decode: decodeURIComponent });
export default (pageContext) => {
@ -12,6 +12,7 @@ export default (pageContext) => {
routeParams: {
actorId: matched.params.actorId,
actorSlug: matched.params.actorSlug,
domain: matched.params.domain || 'scenes',
scope: matched.params.scope || 'latest',
page: matched.params.page || '1',
path,

View File

@ -36,6 +36,13 @@
>{{ entity.name }}</h2>
</a>
<Domains
:domain="domain"
:path="`/${entity.type}/${entity.slug}`"
:domains="['scenes', 'movies']"
class="domains-header"
/>
<a
v-if="entity.parent"
:href="`/${entity.parent.type}/${entity.parent.slug}`"
@ -61,6 +68,13 @@
</div>
<div class="content">
<Domains
:domain="domain"
:path="`/${entity.type}/${entity.slug}`"
:domains="['scenes', 'movies']"
class="domains-bar"
/>
<div class="children-container">
<ul
v-if="entity.children.length > 0"
@ -98,7 +112,8 @@
</div>
</div>
<Scenes />
<Scenes v-if="domain === 'scenes'" />
<Movies v-if="domain === 'movies'" />
</div>
</div>
</template>
@ -108,14 +123,17 @@ import { ref, computed, inject } from 'vue';
import EntityTile from '#/components/entities/tile.vue';
import Scenes from '#/components/scenes/scenes.vue';
import Movies from '#/components/movies/movies.vue';
import Domains from '#/components/domains/domains.vue';
const { pageProps } = inject('pageContext');
const { pageProps, routeParams } = inject('pageContext');
const { entity } = pageProps;
const children = ref(null);
const expanded = ref(false);
const scrollable = computed(() => children.value?.scrollWidth > children.value?.clientWidth);
const domain = routeParams.domain;
const entityUrl = (() => {
if (!entity.url) {
@ -173,7 +191,7 @@ const entityUrl = (() => {
.logo {
height: 2rem;
max-width: 15rem;
padding: .75rem 1rem;
padding: .5rem 1rem;
object-fit: contain;
}
@ -184,7 +202,7 @@ const entityUrl = (() => {
.favicon {
display: none;
padding: .75rem 1rem;
padding: .5rem 1rem;
height: 1.5rem;
}
@ -256,6 +274,29 @@ const entityUrl = (() => {
}
}
.domains-bar {
display: none;
}
@media(--small-20) {
.logo {
padding: .5rem 1rem;
}
.favicon {
height: 1rem;
padding: .5rem 1rem;
}
.domains-header {
display: none;
}
.domains-bar {
display: flex;
}
}
@media(--compact) {
.logo {
height: 1.25rem;
@ -277,15 +318,4 @@ const entityUrl = (() => {
margin-right: 1rem;
}
}
@media(--small-20) {
.logo {
padding: .5rem 1rem;
}
.favicon {
height: 1rem;
padding: .5rem 1rem;
}
}
</style>

View File

@ -2,10 +2,38 @@ import { render } from 'vike/abort'; /* eslint-disable-line import/extensions */
import { fetchEntitiesById } from '#/src/entities.js';
import { fetchScenes } from '#/src/scenes.js';
import { fetchMovies } from '#/src/movies.js';
import { curateScenesQuery } from '#/src/web/scenes.js';
import { getRandomCampaigns } from '#/src/campaigns.js';
import { curateMoviesQuery } from '#/src/web/movies.js';
import { getRandomCampaigns, getCampaignIndex } from '#/src/campaigns.js';
import redis from '#/src//redis.js';
async function fetchReleases(pageContext, entityId) {
if (pageContext.routeParams.domain === 'movies') {
return fetchMovies(await curateMoviesQuery({
...pageContext.urlQuery,
scope: pageContext.routeParams.scope || 'latest',
entityId: Number(entityId),
tagFilter: pageContext.tagFilter,
}), {
page: Number(pageContext.routeParams.page) || 1,
limit: Number(pageContext.urlParsed.search.limit) || 30,
aggregate: true,
}, pageContext.user);
}
return fetchScenes(await curateScenesQuery({
...pageContext.urlQuery,
scope: pageContext.routeParams.scope || 'latest',
entityId: Number(entityId),
tagFilter: pageContext.tagFilter,
}), {
page: Number(pageContext.routeParams.page) || 1,
limit: Number(pageContext.urlParsed.search.limit) || 30,
aggregate: true,
}, pageContext.user);
}
export async function onBeforeRender(pageContext) {
const entityId = await redis.hGet('traxxx:entities:id_by_slug', pageContext.routeParams.entityType === 'network' ? `_${pageContext.routeParams.entitySlug}` : pageContext.routeParams.entitySlug);
@ -15,19 +43,10 @@ export async function onBeforeRender(pageContext) {
const [
[entity],
entityScenes,
entityReleases,
] = await Promise.all([
fetchEntitiesById([Number(entityId)], { includeChildren: true }),
fetchScenes(await curateScenesQuery({
...pageContext.urlQuery,
scope: pageContext.routeParams.scope || 'latest',
entityId: Number(entityId),
tagFilter: pageContext.tagFilter,
}), {
page: Number(pageContext.routeParams.page) || 1,
limit: Number(pageContext.urlParsed.search.limit) || 30,
aggregate: true,
}, pageContext.user),
fetchReleases(pageContext, entityId),
]);
const campaigns = await getRandomCampaigns([
@ -36,37 +55,35 @@ export async function onBeforeRender(pageContext) {
minRatio: 1.5,
allowRandomFallback: false,
},
{
entityIds: [entity.id, entity.parent?.id].filter(Boolean),
minRatio: 0.75,
maxRatio: 1.25,
allowRandomFallback: false,
},
{
entityIds: [entity.id, entity.parent?.id].filter(Boolean),
minRatio: 1.5,
allowRandomFallback: false,
},
], { tagFilter: pageContext.tagFilter });
pageContext.routeParams.domain === 'scenes' ? {
entityIds: [entity.id, entity.parent?.id].filter(Boolean),
minRatio: 0.75,
maxRatio: 1.25,
allowRandomFallback: false,
} : null,
].filter(Boolean), { tagFilter: pageContext.tagFilter });
const {
scenes,
} = entityScenes;
const releases = entityReleases.scenes || entityReleases.movies;
const campaignIndex = Math.floor((Math.random() * (0.5 - 0.2) + 0.2) * scenes.length);
const [metaCampaign, sceneCampaign, paginationCampaign] = campaigns;
const campaignIndex = getCampaignIndex(releases.length);
const [metaCampaign, paginationCampaign, sceneCampaign] = campaigns;
return {
pageContext: {
title: entity.name,
pageProps: {
entity,
...entityScenes,
...entityReleases,
},
campaigns: {
index: campaignIndex,
meta: metaCampaign,
scenes: scenes.length > 5 && sceneCampaign,
scenes: releases.length > 5 && sceneCampaign,
pagination: paginationCampaign,
},
},

View File

@ -1,7 +1,7 @@
import { match } from 'path-to-regexp';
// import { resolveRoute } from 'vike/routing'; // eslint-disable-line import/extensions
const path = '/:entityType(channel|network)/:entitySlug/:scope?/:page?';
const path = '/:entityType(channel|network)/:entitySlug/:domain(scenes|movies|series)?/:scope?/:page?';
const urlMatch = match(path, { decode: decodeURIComponent });
export default (pageContext) => {
@ -12,6 +12,7 @@ export default (pageContext) => {
routeParams: {
entityType: matched.params.entityType,
entitySlug: matched.params.entitySlug,
domain: matched.params.domain || 'scenes',
scope: matched.params.scope || 'latest',
page: matched.params.page || '1',
path,

View File

@ -11,7 +11,15 @@
v-html="description"
/>
<Scenes />
<Domains
:path="`/tag/${tag.slug}`"
:domains="['scenes', 'movies']"
:domain="domain"
class="domains-bar"
/>
<Scenes v-if="domain === 'scenes'" />
<Movies v-if="domain === 'movies'" />
</div>
</div>
</template>
@ -20,9 +28,13 @@
import { inject } from 'vue';
import Scenes from '#/components/scenes/scenes.vue';
import Movies from '#/components/movies/movies.vue';
import Domains from '#/components/domains/domains.vue';
const pageContext = inject('pageContext');
const { tag, description } = pageContext.pageProps;
const domain = pageContext.routeParams.domain;
</script>
<style>
@ -34,11 +46,14 @@ const { tag, description } = pageContext.pageProps;
<style scoped>
.page {
display: flex;
flex-grow: 1;
flex-direction: column;
overflow: hidden;
}
.content {
display: flex;
flex-direction: column;
flex-grow: 1;
overflow-y: auto;
}

View File

@ -3,17 +3,16 @@ import markdownItClass from '@toycode/markdown-it-class';
import { fetchTagsById } from '#/src/tags.js';
import { fetchScenes } from '#/src/scenes.js';
import { fetchMovies } from '#/src/movies.js';
import { curateScenesQuery } from '#/src/web/scenes.js';
import { curateMoviesQuery } from '#/src/web/movies.js';
import { getRandomCampaigns, getCampaignIndex } from '#/src/campaigns.js';
const md = markdownIt().use(markdownItClass, { a: 'link' });
export async function onBeforeRender(pageContext) {
const tagSlug = pageContext.routeParams.tagSlug;
const [[tag], tagScenes, campaigns] = await Promise.all([
fetchTagsById([tagSlug]),
fetchScenes(await curateScenesQuery({
async function fetchReleases(pageContext) {
if (pageContext.routeParams.domain === 'movies') {
return fetchMovies(await curateMoviesQuery({
...pageContext.urlQuery,
scope: pageContext.routeParams.scope || 'latest',
tagSlug: pageContext.routeParams.tagSlug,
@ -22,22 +21,41 @@ export async function onBeforeRender(pageContext) {
page: Number(pageContext.routeParams.page) || 1,
limit: Number(pageContext.urlParsed.search.limit) || 30,
aggregate: true,
}, pageContext.user),
}, pageContext.user);
}
return fetchScenes(await curateScenesQuery({
...pageContext.urlQuery,
scope: pageContext.routeParams.scope || 'latest',
tagSlug: pageContext.routeParams.tagSlug,
tagFilter: pageContext.tagFilter,
}), {
page: Number(pageContext.routeParams.page) || 1,
limit: Number(pageContext.urlParsed.search.limit) || 30,
aggregate: true,
}, pageContext.user);
}
export async function onBeforeRender(pageContext) {
const tagSlug = pageContext.routeParams.tagSlug;
const [[tag], tagReleases, campaigns] = await Promise.all([
fetchTagsById([tagSlug]),
fetchReleases(pageContext),
getRandomCampaigns([
{ tagSlugs: [tagSlug], minRatio: 1.5 },
{ tagSlugs: [tagSlug], minRatio: 0.75, maxRatio: 1.25 },
{ tagSlugs: [tagSlug], minRatio: 1.5 },
], { tagFilter: pageContext.tagFilter }),
pageContext.routeParams.domain === 'scenes'
? { tagSlugs: [tagSlug], minRatio: 0.75, maxRatio: 1.25 }
: null,
].filter(Boolean), { tagFilter: pageContext.tagFilter }),
]);
const {
scenes,
} = tagScenes;
const releases = tagReleases.scenes || tagReleases.movies;
const description = tag.description && md.renderInline(tag.description);
const campaignIndex = getCampaignIndex(scenes.length);
const [metaCampaign, sceneCampaign, paginationCampaign] = campaigns;
const campaignIndex = getCampaignIndex(releases.length);
const [metaCampaign, paginationCampaign, sceneCampaign] = campaigns;
return {
pageContext: {
@ -45,12 +63,12 @@ export async function onBeforeRender(pageContext) {
pageProps: {
tag,
description,
...tagScenes,
...tagReleases,
},
campaigns: {
index: campaignIndex,
meta: metaCampaign,
scenes: scenes.length > 5 && sceneCampaign,
scenes: releases.length > 5 && sceneCampaign,
pagination: paginationCampaign,
},
},

View File

@ -1,7 +1,7 @@
import { match } from 'path-to-regexp';
// import { resolveRoute } from 'vike/routing'; // eslint-disable-line import/extensions
const path = '/tag/:tagSlug?/:scope?/:page?';
const path = '/tag/:tagSlug?/:domain(scenes|movies)?/:scope?/:page?';
const urlMatch = match(path, { decode: decodeURIComponent });
export default (pageContext) => {
@ -11,6 +11,7 @@ export default (pageContext) => {
return {
routeParams: {
tagSlug: matched.params.tagSlug,
domain: matched.params.domain || 'scenes',
scope: matched.params.scope || 'latest',
page: matched.params.page || '1',
path,

2
static

@ -1 +1 @@
Subproject commit 6b062200fb4080aa9aeb3aa831623c6257f98c45
Subproject commit b4446bbb07b066a38545ae7d2a112937cd006c16