140 lines
5.5 KiB
HTML
Executable File
140 lines
5.5 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<!-- initialize theme vars
|
|
https://coolors.co/10002b-240046-3c096c-5a189a-7b2cbf-9d4edd-c77dff-e0aaff -->
|
|
|
|
<!-- initialize externals -->
|
|
<meta property="og:title" content="Selenite" />
|
|
<meta property="description" content="Selenite is the best unblocked games site. With over 400 games and an account system, no other websites come close to Selenite." />
|
|
|
|
<meta content="/favicon.png" property="og:image" />
|
|
<meta content="#c77dff" data-react-helmet="true" name="theme-color" />
|
|
<meta name="googlebot" content="index, follow, snippet" />
|
|
<link rel="canonical" href="https://selenite.cc/" />
|
|
<meta property="og:description" content="Selenite is the best unblocked games site. With over 400 games and an account system, no other websites come close to Selenite." />
|
|
<meta property="og:title" content="Selenite">
|
|
<meta property="og:type" content="website">
|
|
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "Organization",
|
|
"name": "Selenite",
|
|
"alternateName": "selenite.cc",
|
|
"url": "https://selenite.cc",
|
|
"logo": "https://selenite.cc/favicon.png",
|
|
"sameAs": [
|
|
"https://github.com/selenite-cc",
|
|
"https://youtube.com/@selenitecc",
|
|
"https://tiktok.com/@selenitecc",
|
|
"https://selenite.cc",
|
|
]
|
|
}
|
|
</script>
|
|
|
|
<!-- initialize my stuff -->
|
|
<script src="/js/all.min.js"></script>
|
|
<script src="/js/main.js"></script>
|
|
|
|
<link rel="stylesheet" href="/css/main.css" />
|
|
<link rel="stylesheet" href="/css/pages.css" />
|
|
<link rel="stylesheet" href="/css/profile.css" />
|
|
<link rel="manifest" href="/manifest.json" />
|
|
<!-- seo + other things -->
|
|
<title>{{ name }}'s Profile | Selenite</title>
|
|
<link rel="icon" href="/favicon.ico" />
|
|
<script>
|
|
document.addEventListener("DOMContentLoaded", ()=>{
|
|
let music = {{ is_music }};
|
|
let audioObject;
|
|
if(music) {
|
|
document.body.classList = "enter-on";
|
|
let url = "{{ song_url }}";
|
|
audioObject = new Audio(url);
|
|
audioObject.addEventListener("loadeddata", () => {
|
|
document.getElementById("totalLength").innerText = `${Math.floor(audioObject.duration/60)}:${String(Math.floor(audioObject.duration%60)).padStart(2, "0")}`;
|
|
document.getElementById("playbar").value = 0;
|
|
})
|
|
document.getElementById("enter").addEventListener("click", async ()=>{
|
|
document.getElementById("enter").style.backgroundColor = "#00000000"
|
|
document.getElementById("enter").style.backdropFilter = "blur(0px)"
|
|
document.getElementById("enter").style.opacity = "0";
|
|
setTimeout(() => {
|
|
audioObject.play();
|
|
audioObject.loop = true;
|
|
document.body.classList = "";
|
|
}, 500)
|
|
setTimeout( () => {
|
|
document.getElementById("enter").style.display = "none";
|
|
}, 950);
|
|
});
|
|
} else {
|
|
document.getElementById("enter").style.display = "none";
|
|
document.querySelectorAll("section")[0].querySelectorAll(".profile-element")[1].style.display = "none";
|
|
}
|
|
document.getElementById("playPause").addEventListener("click", ()=>{
|
|
if(audioObject.paused) {
|
|
document.getElementById("playPause").src = "/img/pause.svg";
|
|
audioObject.play();
|
|
} else {
|
|
document.getElementById("playPause").src = "/img/play.svg";
|
|
audioObject.pause();
|
|
}
|
|
});
|
|
document.getElementById("mute").addEventListener("click", ()=>{
|
|
if(audioObject.volume == 0) {
|
|
document.getElementById("mute").src = "/img/volume.svg";
|
|
audioObject.volume = 1;
|
|
} else {
|
|
document.getElementById("mute").src = "/img/muted.svg";
|
|
audioObject.volume = 0;
|
|
}
|
|
});
|
|
document.getElementById("playbar").addEventListener("input", (e) => {
|
|
audioObject.currentTime = document.getElementById("playbar").value/1000*audioObject.duration;
|
|
});
|
|
audioObject.addEventListener("timeupdate", (e) => {
|
|
document.getElementById("totalLength").innerText = `${Math.floor(audioObject.duration/60)}:${String(Math.floor(audioObject.duration%60)).padStart(2, "0")}`
|
|
document.getElementById("curPos").innerText = `${Math.floor(audioObject.currentTime/60)}:${String(Math.floor(audioObject.currentTime%60)).padStart(2, "0")}`
|
|
document.getElementById("playbar").value = (audioObject.currentTime / audioObject.duration) * 1000;
|
|
})
|
|
})
|
|
</script>
|
|
</head>
|
|
<alerts> </alerts>
|
|
<body>
|
|
<div id="enter"><h1 class="title">click to enter</h1><p>this user selected a song, please mute the tab if you don't want to listen</p></div>
|
|
<h1 class="title">{{ name }}'s profile</h1>
|
|
<section>
|
|
<img src="{{ user_pfp }}" class="pfp" />
|
|
<div class="profile-element">
|
|
<h1>{{ name }}</h1>
|
|
<p>/u/{{ username }}</p>
|
|
<div class="badges">{{ badges }}</div>
|
|
</div>
|
|
<div class="profile-element">
|
|
<h2>{{ song_title }}</h2>
|
|
<h3>{{ song_artist }}</h3>
|
|
<div class="samerow">
|
|
<p id="curPos">0:00</p>
|
|
<input type="range" id="playbar" min="1" max="1000" />
|
|
<p id="totalLength">9:99</p>
|
|
</div>
|
|
<div class="samerow">
|
|
<img id="playPause" src="/img/pause.svg" class="controls"/>
|
|
<img id="mute" src="/img/volume.svg" class="controls"/>
|
|
</div>
|
|
</div>
|
|
<div class="profile-element">
|
|
<h2>Joined {{ join_date }}</h2>
|
|
<h2>Last online {{ online_time }}</h2>
|
|
</div>
|
|
</section>
|
|
<section class="column" id="about">
|
|
<h1>about me</h1>
|
|
<p>{{ about }}</p>
|
|
</section>
|
|
</body>
|
|
</html>
|