dev
/
sudo-archive
mirror of https://github.com/sussy-code/smov.git
2
1
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Polish flix page again, all we have to do is add endpoint redirects and posters!

This commit is contained in:
Cooper Ransom 2024-03-15 15:54:08 -04:00
parent 36e247cf24
commit b9a830a298
2 changed files with 37 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/layout/ThinContainer.tsx
View File

@ -21,7 +21,7 @@ export function ThinContainer(props: ThinContainerProps) {
export function ThiccContainer(props: ThinContainerProps) { export function ThiccContainer(props: ThinContainerProps) {
return ( return (
<div <div
className={`mx-auto w-[1250px] max-w-full px-8 sm:px-0 ${ className={`mx-auto w-[1000px] max-w-full sm:px-0 ${
props.classNames || "" props.classNames || ""
}`} }`}
> >

18
src/pages/TopFlix.tsx
View File

@ -20,7 +20,7 @@ function Button(props: {
return ( return (
<button <button
className={classNames( className={classNames(
"font-bold rounded h-10 w-40 scale-95 hover:scale-100 transition-all duration-200", "font-bold rounded h-10 w-40 scale-90 hover:scale-95 transition-all duration-200",
props.className, props.className,
)} )}
type="button" type="button"
@ -89,8 +89,8 @@ async function getTotalViews() {
const response = await fetch("https://backend.sudo-flix.lol/metrics"); const response = await fetch("https://backend.sudo-flix.lol/metrics");
const text = await response.text(); const text = await response.text();
// Regex to match the view counts of all shows/movies with success="true" // Add up all mw_media_watch_count entries
const regex = /mw_media_watch_count{[^}]*,success="true"} (\d+)/g; const regex = /mw_media_watch_count{[^}]*} (\d+)/g;
let totalViews = 0; let totalViews = 0;
let match = regex.exec(text); let match = regex.exec(text);
@ -158,21 +158,21 @@ export function TopFlix() {
return ( return (
<SubPageLayout> <SubPageLayout>
<ThiccContainer classNames="px-4"> <ThiccContainer>
<div className="mt-8 w-full px-8">
<Heading1>Top flix</Heading1> <Heading1>Top flix</Heading1>
<Paragraph className="mb-18"> <Paragraph className="mb-18">
The most popular movies on sudo-flix.lol, this data is fetched from The most popular movies on sudo-flix.lol, this data is fetched from
the current backend deployment. the current backend deployment.
</Paragraph> </Paragraph>
<div className="mt-8 w-auto"> <div className="mt-8 w-auto">
<div className="bg-buttons-secondary rounded-xl py-5 px-7 inline-block"> <div className="bg-buttons-secondary rounded-xl scale-95 py-3 px-5 mb-2 inline-block">
<p className="font-bold bg-opacity-90 text-buttons-secondaryText"> <p className="font-bold bg-opacity-90 text-buttons-secondaryText">
Overall Views: {totalViews} Overall Views: {totalViews}
</p> </p>
</div> </div>
</div> </div>
<div className="mt-8 w-full max-w-none">
<Divider marginClass="my-3" /> <Divider marginClass="my-3" />
{getItemsForCurrentPage().map((item) => { {getItemsForCurrentPage().map((item) => {
const coverUrl = getMediaPoster(item.tmdbFullId); const coverUrl = getMediaPoster(item.tmdbFullId);
@ -183,9 +183,10 @@ export function TopFlix() {
</ConfigValue> </ConfigValue>
); );
})} })}
</div>
<div <div
style={{ display: "flex", justifyContent: "space-between" }} style={{ display: "flex", justifyContent: "space-between" }}
className="mt-6" className="mt-5 w-full px-8"
> >
<Button <Button
className="py-px box-content bg-buttons-secondary hover:bg-buttons-secondaryHover bg-opacity-90 text-buttons-secondaryText justify-center items-center" className="py-px box-content bg-buttons-secondary hover:bg-buttons-secondaryHover bg-opacity-90 text-buttons-secondaryText justify-center items-center"
@ -194,7 +195,7 @@ export function TopFlix() {
> >
Previous page Previous page
</Button> </Button>
<div> <div style={{ display: "flex", alignItems: "center" }}>
{currentPage} / {maxPageCount} {currentPage} / {maxPageCount}
</div> </div>
<Button <Button
@ -205,7 +206,6 @@ export function TopFlix() {
Next page Next page
</Button> </Button>
</div> </div>
</div>
</ThiccContainer> </ThiccContainer>
</SubPageLayout> </SubPageLayout>
); );