Added actors and movies to global search results.

This commit is contained in:
DebaucheryLibrarian 2024-06-02 05:22:08 +02:00
parent b144728e5f
commit 5b4aa9644b
13 changed files with 284 additions and 65 deletions

2
.nvmrc
View File

@ -1 +1 @@
20.14.0 21.2.0

View File

@ -135,7 +135,7 @@ const cupRange = ref(pageProps.cupRange);
actors.value = pageProps.actors; actors.value = pageProps.actors;
const currentPage = ref(Number(routeParams.page)); const currentPage = ref(Number(routeParams.page));
const total = ref(Number(pageProps.total)); const total = ref(Number(pageProps.actorTotal || pageProps.total));
const order = ref(routeParams.order || urlParsed.search.order || 'likes.desc'); const order = ref(routeParams.order || urlParsed.search.order || 'likes.desc');
const filters = ref({ const filters = ref({

View File

@ -5,8 +5,6 @@
unstashed: !favorited && pageStash && user && pageStash.user.id === user?.id, unstashed: !favorited && pageStash && user && pageStash.user.id === user?.id,
}" }"
> >
<span class="name">{{ actor.name }}</span>
<div class="avatar-container"> <div class="avatar-container">
<Link <Link
:href="`/actor/${actor.id}/${actor.slug}`" :href="`/actor/${actor.id}/${actor.slug}`"
@ -36,37 +34,39 @@
@stashed="(stash) => { favorited = stash.id === currentStash.id ? true : favorited; }" @stashed="(stash) => { favorited = stash.id === currentStash.id ? true : favorited; }"
@unstashed="(stash) => { favorited = stash.id === currentStash.id ? false : favorited; }" @unstashed="(stash) => { favorited = stash.id === currentStash.id ? false : favorited; }"
/> />
</div>
<div class="details"> <div class="details">
<span class="birth"> <span class="birth">
<Gender :gender="actor.gender" /> <Gender :gender="actor.gender" />
<span
v-if="actor.ageFromBirth"
:title="`Born ${formatDate(actor.dateOfBirth, 'MMMM d, yyyy')}`"
class="age"
>{{ actor.ageFromBirth }}</span>
<span
v-if="actor.ageThen && actor.ageThen < actor.ageFromBirth"
title="Age on date of release"
class="age age-then"
>{{ actor.ageThen }}</span>
</span>
<span <span
v-if="actor.ageFromBirth" v-if="actor.origin?.country"
:title="`Born ${formatDate(actor.dateOfBirth, 'MMMM d, yyyy')}`" :title="`Born in ${actor.origin.country.alias || actor.origin.country.name}`"
class="age" class="country"
>{{ actor.ageFromBirth }}</span>
<span
v-if="actor.ageThen && actor.ageThen < actor.ageFromBirth"
title="Age on date of release"
class="age age-then"
>{{ actor.ageThen }}</span>
</span>
<span
v-if="actor.origin?.country"
:title="`Born in ${actor.origin.country.alias || actor.origin.country.name}`"
class="country"
>
{{ actor.origin.country.alpha2 }}
<img
:src="`/img/flags/${actor.origin.country.alpha2.toLowerCase()}.svg`"
class="flag"
> >
</span> {{ actor.origin.country.alpha2 }}
<img
:src="`/img/flags/${actor.origin.country.alpha2.toLowerCase()}.svg`"
class="flag"
>
</span>
</div>
</div> </div>
<span class="name">{{ actor.name }}</span>
</div> </div>
</template> </template>
@ -99,8 +99,8 @@ const favorited = ref(props.actor.stashes.some((actorStash) => actorStash.id ===
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
aspect-ratio: 2/3;
position: relative; position: relative;
aspect-ratio: 3/5;
border-radius: .25rem; border-radius: .25rem;
box-shadow: 0 0 3px var(--shadow-weak-30); box-shadow: 0 0 3px var(--shadow-weak-30);
overflow: hidden; overflow: hidden;
@ -108,10 +108,6 @@ const favorited = ref(props.actor.stashes.some((actorStash) => actorStash.id ===
&:hover { &:hover {
box-shadow: 0 0 3px var(--shadow-weak-20); box-shadow: 0 0 3px var(--shadow-weak-20);
.name {
color: var(--primary);
}
:deep(.bookmarks) .icon:not(.favorited):not(:hover) { :deep(.bookmarks) .icon:not(.favorited):not(:hover) {
fill: var(--text-light); fill: var(--text-light);
} }
@ -124,7 +120,7 @@ const favorited = ref(props.actor.stashes.some((actorStash) => actorStash.id ===
.name { .name {
flex-shrink: 0; flex-shrink: 0;
padding: .25rem .5rem; padding: .35rem .5rem;
font-weight: bold; font-weight: bold;
font-size: .9rem; font-size: .9rem;
white-space: nowrap; white-space: nowrap;

View File

@ -29,7 +29,7 @@
</a> </a>
<Heart <Heart
v-if="details" v-if="showDetails"
domain="movies" domain="movies"
:item="movie" :item="movie"
:show-secondary="false" :show-secondary="false"
@ -40,7 +40,7 @@
</div> </div>
<div <div
v-if="details" v-if="showDetails"
class="tile-info" class="tile-info"
> >
<div class="tile-meta"> <div class="tile-meta">
@ -128,7 +128,7 @@ const props = defineProps({
type: Object, type: Object,
default: null, default: null,
}, },
details: { showDetails: {
type: Boolean, type: Boolean,
default: true, default: true,
}, },

View File

@ -178,7 +178,7 @@ const aggChannels = ref(pageProps.aggChannels || []);
const currentPage = ref(Number(routeParams.page)); const currentPage = ref(Number(routeParams.page));
const scope = ref(routeParams.scope || props.defaultScope); const scope = ref(routeParams.scope || props.defaultScope);
const total = ref(Number(pageProps.total)); const total = ref(Number(pageProps.sceneTotal || pageProps.total));
const loading = ref(false); const loading = ref(false);
const actorIds = urlParsed.search.actors?.split(',').map((identifier) => parseActorIdentifier(identifier)?.id).filter(Boolean) || []; const actorIds = urlParsed.search.actors?.split(',').map((identifier) => parseActorIdentifier(identifier)?.id).filter(Boolean) || [];

View File

@ -181,7 +181,7 @@
v-for="movie in scene.movies" v-for="movie in scene.movies"
:key="`movie-${movie.id}`" :key="`movie-${movie.id}`"
:movie="movie" :movie="movie"
:details="false" :show-details="false"
/> />
</div> </div>

View File

@ -1,11 +1,184 @@
<template> <template>
<div> <div class="page">
<Scenes <div class="row">
default-scope="results" <div
/> v-if="actors.length > 0"
class="results"
>
<span class="results-meta">
Found {{ actorTotal }} {{ actorTotal > 1 ? 'actors' : 'actor' }}
<a
:href="`/actors/?q=${query}&order=results.desc`"
class="link"
>Full actor results</a>
</span>
<div class="results-container">
<div class="actors">
<ActorTile
v-for="actor in actors"
:key="`actor-${actor.id}`"
:actor="actor"
/>
</div>
</div>
</div>
<div
v-if="movies.length > 0"
class="results"
>
<span class="results-meta">
Found {{ movieTotal }} {{ movieTotal > 1 ? 'movies' : 'movie' }}
<a
:href="`/movies/results/?q=${query}`"
class="link"
>Full movie results</a>
</span>
<div class="results-container">
<div class="movies">
<MovieTile
v-for="movie in movies"
:key="`movie-${movie.id}`"
:movie="movie"
:show-details="false"
/>
</div>
</div>
</div>
</div>
<div
v-if="scenes.length > 0"
class="results"
>
<span class="results-meta">
Found {{ sceneTotal }} {{ sceneTotal > 1 ? 'scenes' : 'scene' }}
<a
:href="`/updates/results/?q=${query}`"
class="link"
>Full scene results</a>
</span>
<div class="scenes">
<SceneTile
v-for="scene in scenes"
:key="`scene-${scene.id}`"
:scene="scene"
/>
</div>
</div>
<span
v-if="actors.length === 0 && scenes.length === 0"
class="results-meta"
>No results for '{{ query }}'</span>
</div> </div>
</template> </template>
<script setup> <script setup>
import Scenes from '#/components/scenes/scenes.vue'; import { inject } from 'vue';
import ActorTile from '#/components/actors/tile.vue';
import SceneTile from '#/components/scenes/tile.vue';
import MovieTile from '#/components/movies/tile.vue';
const pageContext = inject('pageContext');
const {
actors,
scenes,
movies,
actorTotal,
sceneTotal,
movieTotal,
} = pageContext.pageProps;
const query = pageContext.urlParsed.search.q;
</script> </script>
<style scoped>
.page {
display: flex;
flex-direction: column;
}
.row {
width: 100%;
display: flex;
overflow: hidden;
}
.results {
display: flex;
flex: auto;
flex-direction: column;
}
.results-container {
max-height: 19rem;
overflow-y: auto;
}
.actors {
min-width: 10rem;
display: grid;
flex-grow: 1;
grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
gap: .25rem;
padding: 1rem;
}
.movies {
min-width: 15rem;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
gap: 1rem;
padding: 1rem;
}
.scenes {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
gap: .5rem;
padding: 1rem;
}
.results-meta {
box-sizing: border-box;
padding: 1rem 1rem 0 1rem;
color: var(--shadow);
font-weight: bold;
.link {
margin-left: .5rem;
font-weight: normal;
}
}
@media(--small-10) {
.row {
flex-direction: column;
}
.scenes {
grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
}
.actors,
.movies {
display: flex;
overflow-x: auto;
.tile,
.movie-tile {
width: 9rem;
min-width: 9rem;
}
}
}
</style>

View File

@ -1,36 +1,66 @@
import { fetchScenes } from '#/src/scenes.js'; import { fetchScenes } from '#/src/scenes.js';
import { fetchActors } from '#/src/actors.js';
import { fetchMovies } from '#/src/movies.js';
import { curateScenesQuery } from '#/src/web/scenes.js'; import { curateScenesQuery } from '#/src/web/scenes.js';
import { curateActorsQuery } from '#/src/web/actors.js';
import { curateMoviesQuery } from '#/src/web/movies.js';
export async function onBeforeRender(pageContext) { export async function onBeforeRender(pageContext) {
const searchScenes = await fetchScenes(await curateScenesQuery({ const [searchScenes, searchActors, searchMovies] = await Promise.all([
...pageContext.urlQuery, fetchScenes(await curateScenesQuery({
query: pageContext.urlParsed.search.q, ...pageContext.urlQuery,
scope: pageContext.urlParsed.search.scope || 'results', query: pageContext.urlParsed.search.q,
tagFilter: pageContext.tagFilter, scope: pageContext.urlParsed.search.scope || 'results',
}), { tagFilter: pageContext.tagFilter,
page: Number(pageContext.routeParams.page) || 1, }), {
limit: Number(pageContext.urlParsed.search.limit) || 30, page: Number(pageContext.routeParams.page) || 1,
}, pageContext.user); limit: Number(pageContext.urlParsed.search.limit) || 15,
}, pageContext.user),
fetchActors(curateActorsQuery(pageContext.urlQuery), {
page: Number(pageContext.routeParams.page) || 1,
limit: Number(pageContext.urlParsed.search.limit) || 10,
order: ['results', 'desc'],
}, pageContext.user),
fetchMovies(await curateMoviesQuery({
...pageContext.urlQuery,
scope: pageContext.routeParams.scope || 'results',
}), {
page: Number(pageContext.routeParams.page) || 1,
limit: Number(pageContext.urlParsed.search.limit) || 5,
}, pageContext.user),
]);
const { const {
scenes, scenes,
aggActors, aggActors,
aggTags, aggTags,
aggChannels, aggChannels,
total, total: sceneTotal,
limit,
} = searchScenes; } = searchScenes;
const {
actors,
total: actorTotal,
} = searchActors;
const {
movies,
total: movieTotal,
} = searchMovies;
return { return {
pageContext: { pageContext: {
title: `Search '${pageContext.urlParsed.search.q || ''}'`, title: `Search '${pageContext.urlParsed.search.q || ''}'`,
pageProps: { pageProps: {
actors,
scenes, scenes,
movies,
aggActors, aggActors,
aggTags, aggTags,
aggChannels, aggChannels,
limit, sceneTotal,
total, actorTotal,
movieTotal,
}, },
}, },
}; };

View File

@ -1,13 +1,18 @@
<template> <template>
<div> <div>
<Scenes <Scenes
:show-filters="false" :show-filters="!!query"
:show-meta="false" :show-meta="!!query"
:show-scope-tabs="true" :show-scope-tabs="!query"
/> />
</div> </div>
</template> </template>
<script setup> <script setup>
import { inject } from 'vue';
import Scenes from '#/components/scenes/scenes.vue'; import Scenes from '#/components/scenes/scenes.vue';
const pageContext = inject('pageContext');
const query = Object.hasOwn(pageContext.urlParsed.search, 'q');
</script> </script>

View File

@ -2,15 +2,24 @@ import { fetchScenes } from '#/src/scenes.js';
import { curateScenesQuery } from '#/src/web/scenes.js'; import { curateScenesQuery } from '#/src/web/scenes.js';
export async function onBeforeRender(pageContext) { export async function onBeforeRender(pageContext) {
const { scenes, limit, total } = await fetchScenes(await curateScenesQuery({ const withQuery = Object.hasOwn(pageContext.urlParsed.search, 'q');
const {
scenes,
aggTags,
aggChannels,
aggActors,
limit,
total,
} = await fetchScenes(await curateScenesQuery({
...pageContext.urlQuery, ...pageContext.urlQuery,
scope: pageContext.routeParams.scope || 'latest', scope: pageContext.routeParams.scope || 'latest',
isShowcased: true, isShowcased: withQuery ? null : true,
tagFilter: pageContext.tagFilter, tagFilter: pageContext.tagFilter,
}), { }), {
page: Number(pageContext.routeParams.page) || 1, page: Number(pageContext.routeParams.page) || 1,
limit: Number(pageContext.urlParsed.search.limit) || 30, limit: Number(pageContext.urlParsed.search.limit) || 30,
aggregate: false, aggregate: withQuery,
}, pageContext.user); }, pageContext.user);
return { return {
@ -18,6 +27,9 @@ export async function onBeforeRender(pageContext) {
title: pageContext.routeParams.scope, title: pageContext.routeParams.scope,
pageProps: { pageProps: {
scenes, scenes,
aggTags,
aggChannels,
aggActors,
limit, limit,
total, total,
}, },

View File

@ -446,6 +446,7 @@ async function queryManticoreSql(filters, options, _reqUser) {
} else if (options.order?.[0] === 'results') { } else if (options.order?.[0] === 'results') {
builder.orderBy([ builder.orderBy([
{ column: '_score', order: options.order[1] }, { column: '_score', order: options.order[1] },
{ column: 'actors.stashed', order: 'desc' },
{ column: 'actors.slug', order: 'asc' }, { column: 'actors.slug', order: 'asc' },
]); ]);
} else if (options.order?.[0] === 'stashed' && filters.stashId) { } else if (options.order?.[0] === 'stashed' && filters.stashId) {

View File

@ -433,6 +433,7 @@ async function queryManticoreSql(filters, options) {
} else if (filters.scope === 'results') { } else if (filters.scope === 'results') {
builder.orderBy([ builder.orderBy([
{ column: '_score', order: 'desc' }, { column: '_score', order: 'desc' },
{ column: 'movies.stashed', order: 'desc' },
{ column: 'movies.effective_date', order: 'desc' }, { column: 'movies.effective_date', order: 'desc' },
]); ]);
} else if (filters.scope === 'stashed' && filters.stashId) { } else if (filters.scope === 'stashed' && filters.stashId) {

View File

@ -533,6 +533,7 @@ async function queryManticoreSql(filters, options, _reqUser) {
} else if (filters.scope === 'results') { } else if (filters.scope === 'results') {
builder.orderBy([ builder.orderBy([
{ column: '_score', order: 'desc' }, { column: '_score', order: 'desc' },
{ column: 'scenes.stashed', order: 'desc' },
{ column: 'scenes.effective_date', order: 'desc' }, { column: 'scenes.effective_date', order: 'desc' },
]); ]);
} else if (filters.scope === 'stashed' && filters.stashId) { } else if (filters.scope === 'stashed' && filters.stashId) {