MinPluto/MinPluto-Frontend
MinPluto/MinPluto-Frontend
Archived
1
Fork 0
Code Issues Pull requests Activity

Check if the creator is live or not

Browse source
This commit is contained in:
Korbs 2024-09-08 22:37:18 -04:00
parent 9583ff6ab9
commit 641927f864
1 changed files with 36 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

48
source/src/pages/live.astro
View file

@ -14,9 +14,14 @@ import { ArrowDown } from "@iconoir/vue";
// Fetch // Fetch
const CreatorName = Astro.url.href.split("live?=").pop(); const CreatorName = Astro.url.href.split("live?=").pop();
const Creator = await fetch( const Creator = await fetch("https://twitch-backend.sudovanilla.org" + "/api/users/" + CreatorName,).then((response) => response.json());
"https://twitch-backend.sudovanilla.org" + "/api/users/" + CreatorName,
).then((response) => response.json()); // Check if the Creator is live
if(Creator.isLive === true) {
var IsLive = true
} else if(Creator.isLive === false) {
var IsLive = false
}
--- ---
<Base> <Base>
@ -36,21 +41,31 @@ const Creator = await fetch(
<div class="creator-tw-start"> <div class="creator-tw-start">
<img src={"https://ipx.sudovanilla.org" + "/" + Creator.data.pfp} /> <img src={"https://ipx.sudovanilla.org" + "/" + Creator.data.pfp} />
<p style="font-size: 14px;">{Creator.data.username}</p> <p style="font-size: 14px;">{Creator.data.username}</p>
<span>|</span> {IsLive ?
<p style="font-weight: bold">{Creator.data.stream.title}</p> <span>|</span>
<p style="font-weight: bold">{Creator.data.stream.title}</p>
:
null
}
</div> </div>
<div class="creator-tw-end"> <div class="creator-tw-end">
<p style="font-size: 14px;opacity: 0.5;">{Creator.data.followers} Followers</p> <p style="font-size: 14px;opacity: 0.5;">{Creator.data.followers} Followers</p>
<!-- <button><ArrowDown /></button> --> <!-- <button><ArrowDown /></button> -->
</div> </div>
</div> </div>
<Zorn {IsLive ?
Live <Zorn
Video={"https://twitch-backend.sudovanilla.org" + Live
"/proxy/stream/" + Video={"https://twitch-backend.sudovanilla.org" +
CreatorName + "/proxy/stream/" +
"/hls.m3u8"} CreatorName +
/> "/hls.m3u8"}
/>
:
<div style={'background: linear-gradient(0deg, #23232345, #' + Creator.data.colorHex + ');'} class="creator-is-offline">
<p>They're currently offline.</p>
</div>
}
</Base> </Base>
<style is:global lang="scss"> <style is:global lang="scss">
@ -112,6 +127,15 @@ const Creator = await fetch(
} }
} }
} }
.creator-is-offline {
color: white;
font-weight: bold;
text-align: center;
margin: 48px 24px 0px 24px;
padding: 16% 0px;
border-radius: 12px;
font-size: 32px;
}
</style> </style>
<style is:global lang="scss"> <style is:global lang="scss">