selenite/backend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

finish up profiles, begin custom songs

Browse Source
This commit is contained in:
sky
2025-07-08 22:01:16 -04:00
parent cbdf039eab
commit acd6d2e9e2
7 changed files with 502 additions and 175 deletions
Download Patch File Download Diff File Expand all files Collapse all files

244
html/profile_edit.html
View File

@ -5,18 +5,65 @@
https://coolors.co/10002b-240046-3c096c-5a189a-7b2cbf-9d4edd-c77dff-e0aaff -->
<!-- initialize externals -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script src=" https://cdn.jsdelivr.net/npm/js-cookie@3.0.5/dist/js.cookie.min.js "></script>
<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 name="keywords" content="proxy, web proxy, unblock websites, unblock chromebook, free web proxy, proxy list, proxy sites, un block chromebook, online proxy, proxy server, proxysite, proxy youtube, bypass securly, bypass iboss, bypass lightspeed filter, chromebooks, unblock youtube, youtube proxy, unblocked youtube, youtube unblocked, unblock games, selenite, unblocked games, free games">
<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/all.js"></script>
<script src="/js/main.js"></script>
<link rel="stylesheet" href="/style.css" />
<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 async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3415518411898563" crossorigin="anonymous"></script>
<script>
let audioObject;
document.addEventListener("DOMContentLoaded", ()=>{
let music = false; // {{ is_music }}
if(music) {
let url = "/api/music/download?url=https://soundcloud.com/archive5077/fostered-alcoholism-grayskies"; // {{ music_url }}
let audioObject = new Audio(url);
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( () => {
document.getElementById("enter").style.display = "none";
audioObject.play();
}, 700);
});
}
})
</script>
<script>
let username = "{{ username }}";
let userData;
@ -53,6 +100,17 @@
console.log("promise finished");
body = { pfp: fileData };
console.log("body set");
} else if (state == "pfp") {
console.log("pfp");
let file = document.getElementById("pfp_upload").files[0];
if (file.size > 4000000) {
file.input = "";
return;
}
const fileData = await readFileAsDataURL(file);
console.log("promise finished");
body = { pfp: fileData };
console.log("body set");
} else if (state == "clearpfp") {
body = { pfp: "del" };
} else if (state == "close") {
@ -128,6 +186,8 @@
for (let i = 0; i < storeNames.length; i++) {
localStorage.setItem(storeNames[i], storage[storeNames[i]]);
}
} else if (state == song) {
// create body
}
console.log("sending");
body.username = username;
@ -158,7 +218,7 @@
console.log(e.target.parentElement.children[0].id);
if (e.target.parentElement.children[0].id == "name") {
state = "name";
document.getElementById("title").innerText = "Set your name.";
document.getElementById("title").innerText = "change your name";
document.getElementById("text").setAttribute("maxlength", "20");
document.getElementById("pfp_upload").style.display = "none";
document.getElementById("pfp_reminder").style.display = "none";
@ -172,7 +232,7 @@
document.getElementById("popup").style.display = "flex";
} else if (e.target.parentElement.children[0].id == "bio") {
state = "bio";
document.getElementById("title").innerText = "Set your about me.";
document.getElementById("title").innerText = "change your about me";
document.getElementById("text").setAttribute("maxlength", "200");
document.getElementById("pfp_upload").style.display = "none";
document.getElementById("pfp_reminder").style.display = "none";
@ -184,23 +244,21 @@
document.getElementById("counter").style.display = "flex";
document.getElementById("submit").style.display = "flex";
document.getElementById("popup").style.display = "flex";
} else if (e.target.parentElement.children[0].id == "custom") {
state = "custom";
document.getElementById("title").innerText = "Set your custom CSS.";
} else if (e.target.parentElement.children[0].id == "song") {
state = "song";
document.getElementById("title").innerText = "pick a song";
document.getElementById("text").setAttribute("maxlength", "2048");
document.getElementById("pfp_upload").style.display = "none";
document.getElementById("pfp_reminder").style.display = "none";
document.getElementById("body-text").style.display = "none";
document.getElementById("clear").style.display = "none";
document.getElementById("text").style.display = "flex";
document.getElementById("text").value = userData["css"];
document.getElementById("counter").innerText = `${document.getElementById("text").value.length} / ${document.getElementById("text").attributes.maxlength.value}`;
document.getElementById("counter").style.display = "flex";
document.getElementById("submit").style.display = "flex";
document.getElementById("text").style.display = "none";
document.getElementById("counter").style.display = "none";
document.getElementById("submit").style.display = "none";
document.getElementById("popup").style.display = "flex";
} else if (e.target.parentElement.children[0].id == "pfp") {
state = "pfp";
document.getElementById("title").innerText = "Set your new profile picture.";
document.getElementById("title").innerText = "upload a new profile picture";
document.getElementById("pfp_upload").style.display = "flex";
document.getElementById("pfp_reminder").style.display = "flex";
document.getElementById("body-text").style.display = "none";
@ -218,6 +276,30 @@
document.getElementById("text").addEventListener("input", () => {
document.getElementById("counter").innerText = `${document.getElementById("text").value.length} / ${document.getElementById("text").attributes.maxlength.value}`;
});
document.getElementById("search").addEventListener("input", async ()=>{
if(document.getElementById("search").value.length > 0) {
let query = document.getElementById("search").value;
let results = await fetch("/api/music/search?q=" + encodeURIComponent(document.getElementById("search").value));
let json = await results.json();
if(document.getElementById("search").value == query) {
document.querySelector("results").display = "flex";
console.log("searched")
let i = 0;
json.tracks.forEach((e)=>{
document.querySelectorAll("result")[i].querySelector("h2").innerText = e.title;
document.querySelectorAll("result")[i].querySelector("p").innerText = e.artists[0].name;
document.querySelectorAll("result")[i].setAttribute("data-url", e.url);
i++;
})
}
} else {
document.querySelectorAll("result").forEach((e) => {
e.removeAttribute("data-url");
e.querySelector("h2").innerText = null;
e.querySelector("p").innerText = null;
})
}
})
document.getElementById("upload").addEventListener("click", async () => {
state = "upload";
document.getElementById("title").innerText = "Warning";
@ -244,78 +326,80 @@
document.getElementById("submit").style.display = "flex";
document.getElementById("popup").style.display = "flex";
});
document.querySelectorAll("results").forEach(async e => {
e.addEventListener("click", await setProfile)
});
});
</script>
</head>
<alerts> </alerts>
<body>
<header>
<a href="/index.html">Home</a>
<a href="/bookmarklets.html">Bookmarklets</a>
<a href="/projects.html">Games</a>
<a href="/apps.html">Apps</a>
<a href="/settings.html">Settings</a>
<a id="blank" href="#">Open Blank</a>
<a href="/u/" class="usericon"><img src="/img/user.svg" /></a>
</header>
<main>
<!-- <a class="friend-icon" href="/friends"><img src="/img/friend.svg"></a> -->
<input type="text" readonly value="{{ url_gen }}" />
<div class="samerow">
<button id="download">Download Backup</button>
<button id="upload">Upload Backup</button>
<div id="popup" style="display: none">
<h1 id="title"></h1>
<p id="body-text"></p>
<input type="text" id="text" />
<input type="text" id="search" />
<results id="results">
<result><h2></h2><p></p></result>
<result><h2></h2><p></p></result>
<result><h2></h2><p></p></result>
<result><h2></h2><p></p></result>
<result><h2></h2><p></p></result>
<result><h2></h2><p></p></result>
<result><h2></h2><p></p></result>
<result><h2></h2><p></p></result>
<result><h2></h2><p></p></result>
<result><h2></h2><p></p></result>
</results>
<p id="counter">0 / 0</p>
<input type="file" id="pfp_upload" name="filename" accept=".png,.jpg,.jpeg,.gif,.avif,.webp,.tiff,.svg" />
<p id="pfp_reminder">4 MB file upload max</p>
<button id="clear">Clear Profile Picture</button>
<button id="submit">Submit</button>
<button id="close">X</button>
</div>
<div class="samerow">
<button id="download">Download Backup</button>
<button id="upload">Upload Backup</button>
</div>
<h1 class="title">{{ name }}'s profile</h1>
<section>
<img src="{{ user_pfp }}" class="pfp" id="pfp"/>
<img src="/img/edit.svg" id="edit" />
<div>
<div class="samerow" id="name">
<h1 id="name">{{ name }}</h1>
<img src="/img/edit.svg" id="edit" />
</div>
<p>/u/{{ username }}</p>
<div class="badges">{{ badges }}</div>
</div>
<div>
<div id="custom"></div>
{{ css_edit }}
<div class="samerow" id="song">
<h2 id="song">{{ song_title }}</h2>
<img src="/img/edit.svg" id="edit" />
</div>
<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 top">
<img src="{{ user_pfp }}" class="pfp" id="pfp" />
<div>
<h2>Joined {{ join_date }}</h2>
<h2>Last online {{ online_time }}</h2>
</div>
</section>
<section class="column">
<div class="samerow edit" id="about">
<h1 id="bio">about me</h1>
<img src="/img/edit.svg" id="edit" />
<div class="profile top text">
<div class="samerow edit" id="name">
<h1 id="name">{{ name }}</h1>
<img src="/img/edit.svg" id="edit" />
</div>
<div class="samerow">{{ badges }}</div>
<h2>Joined {{ join_date }}</h2>
<h2>Last online {{ online_time }}</h2>
</div>
<div class="profile top text right">
<div class="samerow edit" id="about">
<h1 id="bio">Bio</h1>
<img src="/img/edit.svg" id="edit" />
</div>
<h2 id="about">{{ about }}</h2>
</div>
</div>
<div class="profile played">
<h2>Top Games:</h2>
<div id="played-games">
{{ played_games }}
</div>
</div>
</main>
<popups>
<div id="popup" style="display: none">
<h1 id="title"></h1>
<p id="body-text"></p>
<input type="text" id="text" />
<p id="counter">0 / 0</p>
<input type="file" id="pfp_upload" name="filename" accept=".png,.jpg,.jpeg,.gif,.avif,.webp,.tiff,.svg" />
<p id="pfp_reminder">4 MB file upload max</p>
<button id="clear">Clear Profile Picture</button>
<button id="submit">Submit</button>
<button id="close">X</button>
</div>
</popups>
<footer>
<a href="https://gitlab.com/skysthelimit.dev/selenite">Source</a>
<a href="https://discord.gg/7jyufnwJNf">Discord</a>
<a href="/suggest.html">Suggestions & Bugs</a>
<a href="/contact.html">Contact</a>
<a href="/support.html">Donate</a>
<a href="/about.html">About</a>
</footer>
<p>{{ about }}</p>
</section>
</body>
</html>