Library page improvements

This commit is contained in:
Aleksi Lassila
2023-07-11 13:52:49 +03:00
parent 7a738c0459
commit 75b250258c
9 changed files with 198 additions and 91 deletions

View File

@@ -47,7 +47,7 @@ export const getRadarrMovieByTmdbId = (tmdbId: string): Promise<RadarrMovie | un
}
}).then((r) => r.data?.find((m) => (m.tmdbId as any) == tmdbId));
export const addRadarrMovie = async (tmdbId: string) => {
export const addRadarrMovie = async (tmdbId: number) => {
const tmdbMovie = await getTmdbMovie(tmdbId);
const radarrMovie = await lookupRadarrMovieByTmdbId(tmdbId);
console.log('fetched movies', tmdbMovie, radarrMovie);
@@ -62,9 +62,9 @@ export const addRadarrMovie = async (tmdbId: string) => {
profileId: qualityProfile,
rootFolderPath: '/movies',
minimumAvailability: 'announced',
title: tmdbMovie.title,
tmdbId: tmdbMovie.id,
year: Number((await tmdbMovie).release_date.slice(0, 4)),
title: tmdbMovie.title || tmdbMovie.original_title || '',
tmdbId: tmdbMovie.id || 0,
year: Number(tmdbMovie.release_date?.slice(0, 4)),
monitored: false,
tags: [],
searchNow: false
@@ -124,14 +124,14 @@ export const getRadarrDownloads = (): Promise<RadarrDownload[]> =>
}
}).then((r) => (r.data?.records?.filter((record) => record.movie) as RadarrDownload[]) || []);
export const getRadarrDownloadById = (radarrId: number) =>
getRadarrDownloads().then((downloads) => downloads.find((d) => d.movie.id === radarrId));
export const getRadarrDownloadsById = (radarrId: number) =>
getRadarrDownloads().then((downloads) => downloads.filter((d) => d.movie.id === radarrId));
const lookupRadarrMovieByTmdbId = (tmdbId: string) =>
const lookupRadarrMovieByTmdbId = (tmdbId: number) =>
RadarrApi.get('/api/v3/movie/lookup/tmdb', {
params: {
query: {
tmdbId: Number(tmdbId)
tmdbId
}
}
}).then((r) => r.data as any as RadarrMovie);

View File

@@ -5,16 +5,18 @@
import { Clock, Star } from 'radix-icons-svelte';
export let tmdbId: string;
export let type: 'movie' | 'series' = 'movie';
export let title: string;
export let genres: string[];
export let runtimeMinutes: number;
export let runtimeMinutes = 0;
export let seasons = 0;
export let completionTime = '';
export let backdropUrl: string;
export let rating: number;
export let available = true;
export let progress = 0;
export let type: 'dynamic' | 'normal' | 'large' = 'normal';
export let size: 'dynamic' | 'normal' | 'large' = 'normal';
export let randomProgress = false;
if (randomProgress) {
progress = Math.random() > 0.3 ? Math.random() * 100 : 0;
@@ -23,15 +25,15 @@
<div
class={classNames('rounded overflow-hidden relative shadow-2xl shrink-0 aspect-video', {
'h-40': type === 'normal',
'h-60': type === 'large',
'w-full': type === 'dynamic'
'h-40': size === 'normal',
'h-60': size === 'large',
'w-full': size === 'dynamic'
})}
>
<div style={'width: ' + progress + '%'} class="h-[2px] bg-zinc-200 bottom-0 absolute z-[1]" />
<!-- svelte-ignore a11y-click-events-have-key-events -->
<div
on:click={() => window.open('/movie/' + tmdbId, '_self')}
on:click={() => window.open(`/${type}/${tmdbId}`, '_self')}
class="h-full w-full opacity-0 hover:opacity-100 transition-opacity flex flex-col justify-between cursor-pointer p-2 px-3 relative z-[1] peer"
style={progress > 0 ? 'padding-bottom: 0.6rem;' : ''}
>
@@ -59,6 +61,11 @@
</div>
</div>
{/if}
{#if seasons}
<div class="text-sm text-zinc-200">
{seasons} seasons
</div>
{/if}
{#if rating}
<div class="flex gap-1.5 items-center">