Style Manga-Display

Fix Manga.GetMangaCoverUrl
This commit is contained in:
2024-10-18 19:43:13 +02:00
parent 9d8dadc634
commit f27f11e7c2
3 changed files with 141 additions and 12 deletions

View File

@ -4,7 +4,6 @@ import { getData } from '../App';
export class Manga
{
static async GetAllManga(): Promise<IManga[]> {
let manga: IManga[] = [];
console.debug("Getting all Manga");
return getData("http://127.0.0.1:6531/v2/Mangas")
.then((json) => {
@ -40,12 +39,8 @@ export class Manga
});
}
static async GetMangaCoverUrl(internalId: string): Promise<string> {
static GetMangaCoverUrl(internalId: string): string {
console.debug(`Getting Manga Cover-Url ${internalId}`);
return await getData(`http://127.0.0.1:6531/v2/Manga/${internalId}/Cover`)
.then((json) => {
console.debug(`Got Cover-Url of Manga ${internalId}`);
return (json.toString());
});
return `http://127.0.0.1:6531/v2/Manga/${internalId}/Cover`;
}
}

View File

@ -25,10 +25,25 @@ export default interface IManga{
"mangaConnector": IMangaConnector
}
function ReleaseStatusFromNumber(n: number): string {
switch(n) {
case 0: return "Ongoing";
case 1: return "Completed";
case 2: return "OnHiatus";
case 3: return "Cancelled";
case 4: return "Unreleased";
}
return "";
}
export function HTMLFromIManga(manga: IManga) : ReactElement {
return (<div className="Manga" key={manga.internalId}>
<p>{manga.sortName}</p>
<p>Description: {manga.description}</p>
<p>MangaConnector: {manga.mangaConnector.name}</p>
</div>)
return(
<div className="Manga" key={manga.internalId}>
<img src={Manga.GetMangaCoverUrl(manga.internalId)}></img>
<div>
<p className="Manga-name">{manga.sortName}</p>
<p className="pill connector-name">{manga.mangaConnector.name}</p>
<div className="Manga-status" release-status={ReleaseStatusFromNumber(manga.releaseStatus)}></div>
</div>
</div>);
}