feat: Implemented jellyfin api

This commit is contained in:
Aleksi Lassila
2024-03-28 00:49:43 +02:00
parent da2b4ee6d5
commit 71b70e5868
15 changed files with 157 additions and 64 deletions

View File

@@ -6,7 +6,7 @@
import type { TitleType } from '../types';
import type { ComponentProps } from 'svelte';
import Poster from '../components/Card/Card.svelte';
import { getJellyfinItems, type JellyfinItem } from '../apis/jellyfin/jellyfinApi';
import { type JellyfinItem } from '../apis/jellyfin/jellyfin-api';
import { jellyfinItemsStore } from '../stores/data.store';
import Carousel from '../components/Carousel/Carousel.svelte';
import { _ } from 'svelte-i18n';
@@ -62,12 +62,12 @@
const fetchPopularMovies = () => getTmdbPopularMovies();
const fetchLibraryItems = async () => {
const items = await getJellyfinItems();
const props = await fetchCardProps(items, 'series');
console.log('JellyfinItems', items, props);
return props;
};
// const fetchLibraryItems = async () => {
// const items = await getJellyfinItems();
// const props = await fetchCardProps(items, 'series');
// console.log('JellyfinItems', items, props);
// return props;
// };
function parseIncludedLanguages(includedLanguages: string) {
return includedLanguages.replace(' ', '').split(',').join('|');
@@ -76,8 +76,8 @@
<Container focusOnMount>
<HeroShowcase items={getTmdbPopularMovies().then(getShowcasePropsFromTmdb)}>
<Carousel scrollClass="px-2 sm:px-8 2xl:px-16">
<div slot="title" class="text-lg font-semibold text-zinc-300">
<Carousel scrollClass="px-8">
<div slot="title" class="text-xl font-semibold text-zinc-300">
{$_('discover.streamingNow')}
</div>
{#await fetchNowStreaming()}

View File

@@ -1,9 +1,13 @@
<script lang="ts">
import { settings } from '../stores/settings.store';
import { jellyfinItemsStore } from '../stores/data.store';
import Carousel from '../components/Carousel/Carousel.svelte';
import CarouselPlaceholderItems from '../components/Carousel/CarouselPlaceholderItems.svelte';
import Container from '../../Container.svelte';
import { jellyfinApi } from '../apis/jellyfin/jellyfin-api';
import CardGrid from '../components/CardGrid.svelte';
import JellyfinCard from '../components/Card/JellyfinCard.svelte';
const libraryItemsP = jellyfinApi.getLibraryItems();
settings.update((prev) => ({
...prev,
@@ -21,9 +25,15 @@
});
</script>
<Container focusOnMount>
<Container focusOnMount class="pl-20">
<div>LibraryPage</div>
<Carousel>
<CarouselPlaceholderItems />
</Carousel>
<CardGrid>
{#await libraryItemsP}
<CarouselPlaceholderItems />
{:then items}
{#each items as item}
<JellyfinCard {item} />
{/each}
{/await}
</CardGrid>
</Container>