Skip to content

Commit

Permalink
refactor(Collectionner): ♻️ Reworking the createSeries
Browse files Browse the repository at this point in the history
  • Loading branch information
Nytuo committed Aug 30, 2023
1 parent 1046806 commit 8122117
Show file tree
Hide file tree
Showing 2 changed files with 76 additions and 55 deletions.
111 changes: 65 additions & 46 deletions src/components/ContentViewer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { PDP, currentProfile } from "@/utils/Common.ts";
import { AllForOne, changeRating, downloadBook, getFromDB } from "@/utils/Fetchers.ts";
import { IBook } from "@/interfaces/IBook.ts";
import { providerEnum } from "@/utils/utils.ts";
import { ArrowBack, ArrowForward, AutoStories, Check, Close, Done, Download, Edit, Favorite, PlayArrow, QuestionMark, Refresh, YoutubeSearchedFor } from "@mui/icons-material";
import { ArrowBack, ArrowForward, AutoStories, Check, Close, Done, Download, Edit, Favorite, OpenInNew, PlayArrow, QuestionMark, Refresh, YoutubeSearchedFor } from "@mui/icons-material";
import { Avatar, Box, Chip, CircularProgress, Container, IconButton, Paper, Stack, Tooltip, Typography, styled } from "@mui/material";
import Rating from "@mui/material/Rating/Rating";
import Grid2 from "@mui/material/Unstable_Grid2/Grid2";
Expand Down Expand Up @@ -46,6 +46,8 @@ function ContentViewer({ provider, TheBook, type, handleAddBreadcrumbs }: {
};
const APINOTFOUND = /[a-zA-Z]/g.test(TheBook.ID_book);

console.log("TheBook", TheBook);

const fetchCharacters = async () => {
if (type === "volume") {
if (TheBook.characters !== "null") {
Expand Down Expand Up @@ -146,22 +148,31 @@ function ContentViewer({ provider, TheBook, type, handleAddBreadcrumbs }: {
}
}
const handleAsyncBG = async () => {
if (TheBook.URLCover != null && TheBook.URLCover !== "null") {
console.log("TheBook.URLCover", TheBook.URLCover);
const options = {
let options;
if (TheBook.BG_cover != null && TheBook.BG_cover !== "null") {
options = {
method: "GET", headers: {
"Content-Type": "application/json", "img": TheBook.BG_cover
}
};
} else if (TheBook.URLCover != null && TheBook.URLCover !== "null") {
options = {
method: "GET", headers: {
"Content-Type": "application/json", "img": TheBook.URLCover
}
};
await fetch(PDP + "/img/getPalette/" + currentProfile.getToken, options).then(function (response) {
return response.text();
}).then(function (data) {
const Blurcolors = data;
setTimeout(function () {
document.getElementsByTagName("body")[0].style.backgroundColor = Blurcolors;
}, 500);
});
} else {
return "#000000";
}
await fetch(PDP + "/img/getPalette/" + currentProfile.getToken, options).then(function (response) {
return response.text();
}).then(function (data) {
const Blurcolors = data;
setTimeout(function () {
document.getElementsByTagName("body")[0].style.backgroundColor = Blurcolors;
}, 500);
});

};
handleAsyncBG();
}, [TheBook.URLCover]);
Expand Down Expand Up @@ -199,7 +210,7 @@ function ContentViewer({ provider, TheBook, type, handleAddBreadcrumbs }: {
}
}
>
<img id="imageBGOV2" src="#" alt="#" style={{ width: "100vw", height: "auto" }} />
<img id="imageBGOV2" src="#" alt="#" style={{ width: "100vw", height: "auto", display: "none" }} />
<Box sx={{
width: "90vw",
}}>
Expand Down Expand Up @@ -234,15 +245,15 @@ function ContentViewer({ provider, TheBook, type, handleAddBreadcrumbs }: {
{
type === "volume" ? (
(provider === providerEnum.Marvel) ?
<h1><a target='_blank' href={((TheBook.URLs === null || TheBook.URLs === "null") ? ("#") : (JSON.parse(TheBook.URLs)[0].url))} style={{ color: 'white' }}>{TheBook.NOM}<i style={{ fontSize: '18px', top: '-10px', position: 'relative' }} className='material-icons'>open_in_new</i></a></h1>
<h1><a target='_blank' href={((TheBook.URLs === null || TheBook.URLs === "null") ? ("#") : (JSON.parse(TheBook.URLs)[0].url))} style={{ color: 'white' }}>{TheBook.NOM}<OpenInNew /></a></h1>
: (provider === providerEnum.Anilist) ?
<h1><a target='_blank' style={{ color: 'white' }}>{TheBook.NOM}</a></h1> :
<h1><a target='_blank' style={{ color: 'white' }}>{TheBook.NOM}</a></h1>) :
(provider === providerEnum.Marvel) ?
<h1><a target='_blank' href={((TheBook.URLs == "null") ? ("#") : (JSON.parse(TheBook.URLs)[0].url))} style={{ color: 'white' }}>{TheBook.NOM}<i style={{ fontSize: '18px', top: '-10px', position: 'relative' }} className='material-icons'>open_in_new</i></a></h1> :
(provider === providerEnum.Anilist) ?
<h1><a target='_blank' href={(TheBook.URLs == "null") ? ("#") : (TheBook.URLs)} style={{ color: 'white' }}>{TheBook.NOM}</a></h1> :
<h1><a target='_blank' style={{ color: 'white' }}>{TheBook.NOM}</a></h1>
<h1><a target='_blank' href={(TheBook.URLs == "null") ? ("#") : (TheBook.URLs)} style={{ color: 'white' }}>{TheBook.NOM}<OpenInNew /></a></h1> :
<h1><a target='_blank' style={{ color: 'white' }}>{TheBook.NOM}<OpenInNew /></a></h1>
}
<Grid2 container sx={
{
Expand Down Expand Up @@ -335,7 +346,13 @@ function ContentViewer({ provider, TheBook, type, handleAddBreadcrumbs }: {
}
</Grid2>
</Grid2>
<div id="startDate">
<div id="startDate"
style={
{
marginBottom: "10px",
}
}
>
{
type === "volume" ?
(TheBook.dates !== "null" ? t("dates") + JSON.parse(TheBook.dates).map((date: { type: string; date: string; }, index: number) => {
Expand All @@ -358,7 +375,7 @@ function ContentViewer({ provider, TheBook, type, handleAddBreadcrumbs }: {
(JSON.parse(TheBook.end_date) == null || JSON.parse(TheBook.end_date) > new Date().getFullYear()) ? "?" : JSON.parse(TheBook.end_date) : "" : ""
}
</div>
<Stack spacing={5}> <Grid2 container spacing={2} id='btnsActions'>
<Stack spacing={3}> <Grid2 container spacing={2} id='btnsActions'>
<Tooltip title={t('PLAY')}>

<IconButton id="playbutton" onClick={
Expand Down Expand Up @@ -581,15 +598,16 @@ function ContentViewer({ provider, TheBook, type, handleAddBreadcrumbs }: {
{
(provider === providerEnum.Anilist || provider === providerEnum.MANUAL || provider === providerEnum.OL || provider === providerEnum.GBooks) ? t("Genres") : ""
}
{": "}
{
JSON.parse(TheBook.genres).map((el: any, index: number) => {
return (index !== JSON.parse(TheBook.genres).length - 1) ? el + ", " : el;
return (index !== JSON.parse(TheBook.genres).length - 1) ? el + " / " : el;
})
}
</div>
<div id="chapters">
{
type === "volume" ? TheBook.issueNumber === (null || "null" || "") ? "" : t("Numberofthisvolumewithintheseries") + TheBook.issueNumber : ((provider === providerEnum.Marvel) ? (t("NumberComics")) : (t("NumberChapter"))) + TheBook["chapters"]
type === "volume" ? TheBook.issueNumber === (null || "null" || "") ? "" : t("Numberofthisvolumewithintheseries") + ": " + TheBook.issueNumber : ((provider === providerEnum.Marvel) ? (t("NumberComics")) : (t("NumberChapter"))) + ": " + TheBook.issueNumber
}
</div>
<div id="id">
Expand Down Expand Up @@ -620,40 +638,41 @@ function ContentViewer({ provider, TheBook, type, handleAddBreadcrumbs }: {
</div>
<div id="Volumes">
{
(TheBook.volumes != null && TheBook.volumes !== "null") ? t("numberOfVolume") + TheBook.volumes : ""
(TheBook.volumes != null && TheBook.volumes !== "null") ? t("numberOfVolume") + ": " + TheBook.volumes : ""
}
</div>
<div id="Trending">
{
(TheBook.trending != null && TheBook.trending !== "null") ? t("trending") + TheBook.trending : ""
(TheBook.trending != null && TheBook.trending !== "null") ? t("trending") + ": " + TheBook.trending : ""
}
</div>
{
TheBook.characters !== "null" ? <div id="readstat"><input type="number" step="1" min="0" id="readAddInput" value={
TheBook.pageCount
} max={
TheBook.pageCount
}
onBlur={
async (e) => {
const options = {
method: "POST", headers: {
"Content-Type": "application/json"
}, body: JSON.stringify({
"token": currentProfile.getToken,
"table": "Books",
"column": "last_page",
"whereEl": TheBook.ID_book,
"value": e.target.value,
"where": "ID_book"
}, null, 2)
};
await fetch(PDP + "/DB/update", options).catch((err) => {
Toaster(err, "error");
});
}
type == "volume" ? (
TheBook.characters !== "null" ? <div id="readstat"><input type="number" step="1" min="0" id="readAddInput" value={
TheBook.pageCount
} max={
TheBook.pageCount
}
/>/ {TheBook.pageCount} {t('pagesRead')}</div> : ""
onBlur={
async (e) => {
const options = {
method: "POST", headers: {
"Content-Type": "application/json"
}, body: JSON.stringify({
"token": currentProfile.getToken,
"table": "Books",
"column": "last_page",
"whereEl": TheBook.ID_book,
"value": e.target.value,
"where": "ID_book"
}, null, 2)
};
await fetch(PDP + "/DB/update", options).catch((err) => {
Toaster(err, "error");
});
}
}
/>/ {TheBook.pageCount} {t('pagesRead')}</div> : "") : ""
}
</Box>
<Box
Expand Down
20 changes: 11 additions & 9 deletions src/components/Drawer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -304,7 +304,7 @@ export default function MiniDrawer() {
setUserAccountOpen(false);
};

const [cardMode, setCardMode] = React.useState(false);
const [cardMode, setCardMode] = React.useState(true);

/**
*
Expand Down Expand Up @@ -364,13 +364,14 @@ export default function MiniDrawer() {
if (provider === providerEnum.Marvel) {
node = JSON.parse(res[0].title);
} else if (provider == providerEnum.Anilist) {
if (JSON.parse(res[0].title)["english"] !== undefined && JSON.parse(res[0].title)["english"] !== null) {
node = JSON.parse(res[0].title)["english"];
} else if (JSON.parse(res[0].title)["romaji"] !== undefined && JSON.parse(res[0].title)["romaji"] !== null) {
node = JSON.parse(res[0].title)["romaji"];
} else {
node = JSON.parse(res[0].title);
}
// if (JSON.parse(res[0].title)["english"] !== undefined && JSON.parse(res[0].title)["english"] !== null) {
// node = JSON.parse(res[0].title)["english"];
// } else if (JSON.parse(res[0].title)["romaji"] !== undefined && JSON.parse(res[0].title)["romaji"] !== null) {
// node = JSON.parse(res[0].title)["romaji"];
// } else {
// node = JSON.parse(res[0].title);
// }
node = (JSON.parse(res[0].title).english + " / " + JSON.parse(res[0].title).romaji + " / " + JSON.parse(res[0].title).native);
} else if (provider == providerEnum.MANUAL || provider === providerEnum.OL || provider === providerEnum.GBooks) {
node = res[0].title;
}
Expand Down Expand Up @@ -427,6 +428,7 @@ export default function MiniDrawer() {
volumes: res[0]["volumes"],
lock: res[0]["lock"],
note: res[0]["note"],
BG_cover: res[0]["BG"],
});
setOpenExplorer({ open: true, explorer: OSseries, provider: provider, booksNumber: FolderRes.length });
// onclick on the cover : await createSeries(provider, path, libraryPath, res);
Expand Down Expand Up @@ -792,7 +794,7 @@ export default function MiniDrawer() {
<CircularProgress />
<p id="decompressfilename" style={{ marginTop: "10px" }}></p>
<p id="overlaymsg" style={{ marginTop: "10px" }}>
We take care of your comics
{t("overlaymsg_takecare")}
</p>
</div>
</div> : <></>}
Expand Down

0 comments on commit 8122117

Please sign in to comment.