Fixed status on dynamic disc page

This commit is contained in:
bingus_violet 2024-01-11 19:12:58 +00:00
parent 3cdf3b0bce
commit 84e2535f53
4 changed files with 19 additions and 6 deletions

View file

@ -77,7 +77,6 @@ function pageUpdate() {
} else {
addedHTML += status.emoji.name
}
}
if (status.state) {
addedHTML += `<em><span style="color: lightgray">"`

View file

@ -25,7 +25,7 @@
<div class="container-fluid row" id="card">
<h2>Violet</h2>
<div style="display: flex; justify-content: center; align-items: center;">
<img src="https://api.lanyard.rest/534132311781015564.png?" class="pfp">
<img src="https://api.lanyard.rest/534132311781015564.png" class="pfp">
<div>
<p><a href="pronouns">They/Them</a></p>
<p>Developer</p>

View file

@ -19,7 +19,8 @@
</head>
<body>
<noscript><h2>Sorry! This page requires javascript... The rest of this site doesn't, though!</h2></noscript>
<div class="fadediv">
<noscript><h2>Sorry! This page requires javascript... The rest of this site doesn't, though!</h2></noscript>
<h1>Discord Status</h1>
<p>This is a more fleshed out version of the main discord status on my site, issue being, it requires Javascript. So, I choose not to use it, though it coulda been cool...</p>
<p>I still am tempted to add something like it to the main page, and just make it compatible without javascript, but I worry that'd upset people.</p>
@ -27,9 +28,8 @@
<div class="container-fluid row" id="card">
<h2>Violet</h2>
<div style="display: flex; justify-content: center; align-items: center;">
<img src="https://api.lanyard.rest/534132311781015564.png?" class="pfp">
<img src="https://api.lanyard.rest/534132311781015564.png" class="pfp">
<div>
<p><a href="pronouns">They/Them</a></p>
<p>Developer</p>
<p id="discStatus" style="transition: all 2s cubic-bezier(0.075, 0.82, 0.165, 1);">Offline</p>
</div>
@ -38,6 +38,7 @@
<p id="discQuote"></p>
</div>
</div>
</div>
</body>
<script src="./index.js"></script>
</html>

View file

@ -50,10 +50,23 @@ lanyard.addEventListener("message", (res) => {
$(".pfp").css("border-color", statusData.color)
if (lanyardData) {
$("#discQuote").html("")
for (let index = 0; index < lanyardData.activities.length; index++) {
const activity = lanyardData.activities[index];
var status = lanyardData.activities[0]
var addedHTML = ""
addedHTML += "<hr>"
if (activity.type == 4) {
$("#discQuote").html(`<hr><em><span style="color: lightgray">"${lanyardData.activities[0].state}"</span> - ${lanyardData.discord_user.display_name} ${new Date(Date.now()).getFullYear()}</em>`)
if (status.emoji) {
if (status.emoji.id) {
addedHTML += `<img class="emoji" src="https://cdn.discordapp.com/emojis/${status.emoji.id}.webp?size=32&quality=lossless"/> `
} else {
addedHTML += status.emoji.name
}
}
addedHTML += `<em><span style="color: lightgray">"${lanyardData.activities[0].state}"</span> - ${lanyardData.discord_user.display_name} ${new Date(Date.now()).getFullYear()}</em>`
$("#discQuote").html(addedHTML)
}
}
}