Extras page, moved Discord, added status page
This commit is contained in:
parent
1aa8264ad0
commit
0a627ddf94
4 changed files with 32 additions and 2 deletions
45
static/extras/discord/index.html
Normal file
45
static/extras/discord/index.html
Normal file
|
|
@ -0,0 +1,45 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<link rel="stylesheet" href="../style.css">
|
||||
|
||||
|
||||
<meta content="Discord Status - Violet's Purgatory" property="og:title" />
|
||||
<meta content="The answers to all your not-so-frequently-asked questions!" />
|
||||
<meta content="https://api.lanyard.rest/534132311781015564.png" property="og:image" />
|
||||
<meta content="#a200ff" data-react-helmet="true" name="theme-color" />
|
||||
|
||||
<script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
|
||||
|
||||
<title>Discord Status - Violet's Purgatory</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<a class="chip" href="../../">Home</a>
|
||||
<div class="fadediv">
|
||||
<noscript><h2>Sorry! This page requires javascript... The rest of this site doesn't, though!</h2></noscript>
|
||||
<h1>Discord Status (W.I.P)</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>
|
||||
|
||||
<div class="container-fluid row" id="card">
|
||||
<h2>Violet</h2>
|
||||
<div style="display: flex; justify-content: center; align-items: center;">
|
||||
<img src="https://thumbor-production-0e82.up.railway.app/unsafe/https://api.lanyard.rest/534132311781015564.png" class="pfp">
|
||||
<div>
|
||||
<p>Developer</p>
|
||||
<p id="discStatus" style="transition: all 2s cubic-bezier(0.075, 0.82, 0.165, 1);">Offline</p>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<p id="discQuote"></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="./index.js"></script>
|
||||
</html>
|
||||
74
static/extras/discord/index.js
Normal file
74
static/extras/discord/index.js
Normal file
|
|
@ -0,0 +1,74 @@
|
|||
var lanyard = new WebSocket('wss://api.lanyard.rest/socket')
|
||||
|
||||
var statuses = {
|
||||
"online": {
|
||||
"text": "Online",
|
||||
"color": "rgb(100, 255, 100)"
|
||||
},
|
||||
"dnd": {
|
||||
"text": "DND",
|
||||
"color": "rgb(255, 100, 100)"
|
||||
},
|
||||
"idle": {
|
||||
"text": "Idle",
|
||||
"color": "rgb(255, 255, 75)"
|
||||
},
|
||||
"offline": {
|
||||
"text": "Offline",
|
||||
"color": "rgb(125, 125, 125)"
|
||||
}
|
||||
}
|
||||
|
||||
function beat(dur) {
|
||||
lanyard.send(JSON.stringify({
|
||||
op: 3
|
||||
}))
|
||||
setTimeout(() => {
|
||||
beat(dur)
|
||||
}, dur);
|
||||
}
|
||||
|
||||
lanyard.addEventListener("message", (res) => {
|
||||
var data = JSON.parse(res.data)
|
||||
if (data.op == 1) {
|
||||
beat(data.d.heartbeat_interval)
|
||||
lanyard.send(JSON.stringify({
|
||||
op: 2,
|
||||
d: {
|
||||
subscribe_to_id: "534132311781015564"
|
||||
}
|
||||
}))
|
||||
} else if (data.op == 0) {
|
||||
var lanyardData = data.d
|
||||
// $("*").text(JSON.stringify(lanyardData))
|
||||
|
||||
|
||||
var statusData = statuses[lanyardData.discord_status]
|
||||
|
||||
$("#discStatus").text(statusData.text)
|
||||
$("#discStatus").css("color", statusData.color)
|
||||
$(".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) {
|
||||
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)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
28
static/extras/index.html
Normal file
28
static/extras/index.html
Normal file
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<link rel="stylesheet" href="../style.css">
|
||||
|
||||
|
||||
<meta content="FAQ - Violet's Purgatory" property="og:title" />
|
||||
<meta content="The answers to all your not-so-frequently-asked questions!" />
|
||||
<meta content="https://api.lanyard.rest/534132311781015564.png" property="og:image" />
|
||||
<meta content="#a200ff" data-react-helmet="true" name="theme-color" />
|
||||
|
||||
<title>Extras - Violet's Purgatory</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<a class="chip" href="../">Home</a>
|
||||
<h1><hr>Extras</h1>
|
||||
<p>Just some fun things that really don't have use on the main page but exist anyway!</p>
|
||||
|
||||
<div class="fadediv container-fluid ">
|
||||
<a href="./discord">Dynamic Discord Status (Javascript, W.I.P)</a>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue