|
|
|
@ -130,10 +130,12 @@
|
|
|
|
|
document.getElementById("title").innerText = "Upload successful!";
|
|
|
|
|
document.getElementById("text").style.display = "none";
|
|
|
|
|
document.getElementById("popup").style.display = "flex";
|
|
|
|
|
document.getElementById("blur").style.display = "flex";
|
|
|
|
|
} else {
|
|
|
|
|
document.getElementById("title").innerText = "Upload failed. This probably means something bad happened, send an email to support@selenite.cc or ping @skysthelimit.dev";
|
|
|
|
|
document.getElementById("text").style.display = "none";
|
|
|
|
|
document.getElementById("popup").style.display = "flex";
|
|
|
|
|
document.getElementById("blur").style.display = "flex";
|
|
|
|
|
}
|
|
|
|
|
return;
|
|
|
|
|
} else if (state == "download") {
|
|
|
|
@ -156,11 +158,13 @@
|
|
|
|
|
document.getElementById("title").innerText = "Download successful!";
|
|
|
|
|
document.getElementById("text").style.display = "none";
|
|
|
|
|
document.getElementById("popup").style.display = "flex";
|
|
|
|
|
document.getElementById("blur").style.display = "flex";
|
|
|
|
|
} else {
|
|
|
|
|
document.getElementById("title").innerText = "Download failed.";
|
|
|
|
|
document.getElementById("body-text").innerText = data.reason;
|
|
|
|
|
document.getElementById("body-text").style.display = "flex";
|
|
|
|
|
document.getElementById("popup").style.display = "flex";
|
|
|
|
|
document.getElementById("blur").style.display = "flex";
|
|
|
|
|
}
|
|
|
|
|
console.log(data);
|
|
|
|
|
data = JSON.parse(data.data);
|
|
|
|
@ -193,7 +197,8 @@
|
|
|
|
|
document.getElementById("search").style.display = "none";
|
|
|
|
|
document.querySelector("results").style.display = "none";
|
|
|
|
|
document.getElementById("popup").style.display = "flex";
|
|
|
|
|
await fetch("/api/profile/edit", {
|
|
|
|
|
document.getElementById("blur").style.display = "flex";
|
|
|
|
|
let data = await fetch("/api/profile/edit", {
|
|
|
|
|
credentials: "include",
|
|
|
|
|
headers: {
|
|
|
|
|
"Content-type": "application/json; charset=UTF-8",
|
|
|
|
@ -202,7 +207,24 @@
|
|
|
|
|
method: "POST",
|
|
|
|
|
mode: "cors",
|
|
|
|
|
});
|
|
|
|
|
location.reload();
|
|
|
|
|
let resp = await data.json();
|
|
|
|
|
if(data.status == 200) {
|
|
|
|
|
location.reload();
|
|
|
|
|
} else {
|
|
|
|
|
document.getElementById("title").innerText = "error!";
|
|
|
|
|
document.getElementById("pfp_upload").style.display = "none";
|
|
|
|
|
document.getElementById("pfp_reminder").style.display = "none";
|
|
|
|
|
document.getElementById("body-text").style.display = "flex";
|
|
|
|
|
document.getElementById("body-text").innerText = resp.err;
|
|
|
|
|
document.getElementById("clear").style.display = "none";
|
|
|
|
|
document.getElementById("text").style.display = "none";
|
|
|
|
|
document.getElementById("counter").style.display = "none";
|
|
|
|
|
document.getElementById("submit").style.display = "none";
|
|
|
|
|
document.getElementById("search").style.display = "none";
|
|
|
|
|
document.querySelector("results").style.display = "none";
|
|
|
|
|
document.getElementById("popup").style.display = "flex";
|
|
|
|
|
document.getElementById("blur").style.display = "flex";
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
document.addEventListener("DOMContentLoaded", async () => {
|
|
|
|
|
document.getElementById("pfp_upload").addEventListener("change", (e) => {
|
|
|
|
@ -213,73 +235,76 @@
|
|
|
|
|
});
|
|
|
|
|
document.getElementById("submit").addEventListener("click", await setProfile);
|
|
|
|
|
document.getElementById("clear").addEventListener("click", async()=>{state="clearpfp";await setProfile()});
|
|
|
|
|
document.querySelectorAll("#edit").forEach((element) => {
|
|
|
|
|
element.addEventListener("click", (e) => {
|
|
|
|
|
console.log(e.target.parentElement.children[0].id);
|
|
|
|
|
if (e.target.parentElement.children[0].id == "name") {
|
|
|
|
|
state = "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";
|
|
|
|
|
document.getElementById("body-text").style.display = "none";
|
|
|
|
|
document.getElementById("clear").style.display = "none";
|
|
|
|
|
document.getElementById("text").style.display = "flex";
|
|
|
|
|
document.getElementById("text").value = userData["name"];
|
|
|
|
|
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("popup").style.display = "flex";
|
|
|
|
|
document.getElementById("search").style.display = "none";
|
|
|
|
|
document.querySelector("results").style.display = "none";
|
|
|
|
|
} else if (e.target.parentElement.children[0].id == "bio") {
|
|
|
|
|
state = "bio";
|
|
|
|
|
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";
|
|
|
|
|
document.getElementById("body-text").style.display = "none";
|
|
|
|
|
document.getElementById("clear").style.display = "none";
|
|
|
|
|
document.getElementById("text").style.display = "flex";
|
|
|
|
|
document.getElementById("text").value = userData["about"];
|
|
|
|
|
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("popup").style.display = "flex";
|
|
|
|
|
document.getElementById("search").style.display = "none";
|
|
|
|
|
document.querySelector("results").style.display = "none";
|
|
|
|
|
} 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 = "none";
|
|
|
|
|
document.getElementById("counter").style.display = "none";
|
|
|
|
|
document.getElementById("submit").style.display = "none";
|
|
|
|
|
document.getElementById("popup").style.display = "flex";
|
|
|
|
|
document.getElementById("search").style.display = "flex";
|
|
|
|
|
document.querySelector("results").style.display = "flex";
|
|
|
|
|
} else if (e.target.parentElement.children[0].id == "pfp") {
|
|
|
|
|
state = "pfp";
|
|
|
|
|
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";
|
|
|
|
|
document.getElementById("clear").style.display = "flex";
|
|
|
|
|
document.getElementById("text").style.display = "none";
|
|
|
|
|
document.getElementById("counter").style.display = "none";
|
|
|
|
|
document.getElementById("submit").style.display = "flex";
|
|
|
|
|
document.getElementById("popup").style.display = "flex";
|
|
|
|
|
document.getElementById("search").style.display = "none";
|
|
|
|
|
document.querySelector("results").style.display = "none";
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
document.getElementById("pfp").addEventListener("click", () => {
|
|
|
|
|
state = "pfp";
|
|
|
|
|
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";
|
|
|
|
|
document.getElementById("clear").style.display = "flex";
|
|
|
|
|
document.getElementById("text").style.display = "none";
|
|
|
|
|
document.getElementById("counter").style.display = "none";
|
|
|
|
|
document.getElementById("submit").style.display = "flex";
|
|
|
|
|
document.getElementById("popup").style.display = "flex";
|
|
|
|
|
document.getElementById("blur").style.display = "flex";
|
|
|
|
|
document.getElementById("search").style.display = "none";
|
|
|
|
|
document.querySelector("results").style.display = "none";
|
|
|
|
|
});
|
|
|
|
|
document.getElementById("name").addEventListener("click", () => {
|
|
|
|
|
state = "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";
|
|
|
|
|
document.getElementById("body-text").style.display = "none";
|
|
|
|
|
document.getElementById("clear").style.display = "none";
|
|
|
|
|
document.getElementById("text").style.display = "flex";
|
|
|
|
|
document.getElementById("text").value = userData["name"];
|
|
|
|
|
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("popup").style.display = "flex";
|
|
|
|
|
document.getElementById("blur").style.display = "flex";
|
|
|
|
|
document.getElementById("search").style.display = "none";
|
|
|
|
|
document.querySelector("results").style.display = "none";
|
|
|
|
|
});
|
|
|
|
|
document.getElementById("about").addEventListener("click", () => {
|
|
|
|
|
state = "bio";
|
|
|
|
|
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";
|
|
|
|
|
document.getElementById("body-text").style.display = "none";
|
|
|
|
|
document.getElementById("clear").style.display = "none";
|
|
|
|
|
document.getElementById("text").style.display = "flex";
|
|
|
|
|
document.getElementById("text").value = userData["about"];
|
|
|
|
|
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("popup").style.display = "flex";
|
|
|
|
|
document.getElementById("blur").style.display = "flex";
|
|
|
|
|
document.getElementById("search").style.display = "none";
|
|
|
|
|
document.querySelector("results").style.display = "none";
|
|
|
|
|
});
|
|
|
|
|
document.getElementById("song").addEventListener("click", () => {
|
|
|
|
|
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 = "none";
|
|
|
|
|
document.getElementById("counter").style.display = "none";
|
|
|
|
|
document.getElementById("submit").style.display = "none";
|
|
|
|
|
document.getElementById("popup").style.display = "flex";
|
|
|
|
|
document.getElementById("blur").style.display = "flex";
|
|
|
|
|
document.getElementById("search").style.display = "flex";
|
|
|
|
|
document.querySelector("results").style.display = "flex";
|
|
|
|
|
})
|
|
|
|
|
document.getElementById("close").addEventListener("click", () => {
|
|
|
|
|
document.getElementById("popup").style.display = "none";
|
|
|
|
|
document.getElementById("blur").style.display = "none";
|
|
|
|
|
});
|
|
|
|
|
document.getElementById("text").addEventListener("input", () => {
|
|
|
|
|
document.getElementById("counter").innerText = `${document.getElementById("text").value.length} / ${document.getElementById("text").attributes.maxlength.value}`;
|
|
|
|
@ -295,8 +320,10 @@
|
|
|
|
|
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].querySelectorAll("p")[0].innerText = e.artists[0].name;
|
|
|
|
|
document.querySelectorAll("result")[i].querySelectorAll("p")[1].innerText = e.url.slice(22);
|
|
|
|
|
document.querySelectorAll("result")[i].setAttribute("data-url", e.url);
|
|
|
|
|
document.querySelectorAll("result")[i].style.display = "flex";
|
|
|
|
|
i++;
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
@ -304,7 +331,9 @@
|
|
|
|
|
document.querySelectorAll("result").forEach((e) => {
|
|
|
|
|
e.removeAttribute("data-url");
|
|
|
|
|
e.querySelector("h2").innerText = null;
|
|
|
|
|
e.querySelector("p").innerText = null;
|
|
|
|
|
e.querySelectorAll("p")[0].innerText = null;
|
|
|
|
|
e.querySelectorAll("p")[1].innerText = null;
|
|
|
|
|
e.style.display = "none";
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
@ -320,6 +349,7 @@
|
|
|
|
|
document.getElementById("counter").style.display = "none";
|
|
|
|
|
document.getElementById("submit").style.display = "flex";
|
|
|
|
|
document.getElementById("popup").style.display = "flex";
|
|
|
|
|
document.getElementById("blur").style.display = "flex";
|
|
|
|
|
});
|
|
|
|
|
document.getElementById("download").addEventListener("click", async () => {
|
|
|
|
|
state = "download";
|
|
|
|
@ -333,6 +363,7 @@
|
|
|
|
|
document.getElementById("counter").style.display = "none";
|
|
|
|
|
document.getElementById("submit").style.display = "flex";
|
|
|
|
|
document.getElementById("popup").style.display = "flex";
|
|
|
|
|
document.getElementById("blur").style.display = "flex";
|
|
|
|
|
});
|
|
|
|
|
document.querySelectorAll("result").forEach(async e => {
|
|
|
|
|
e.addEventListener("click", async (element) => {
|
|
|
|
@ -349,22 +380,23 @@
|
|
|
|
|
</script>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<div id="blur"></div>
|
|
|
|
|
<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" />
|
|
|
|
|
<input type="text" id="search" placeholder="search a song title here.."/>
|
|
|
|
|
<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>
|
|
|
|
|
<result><h2></h2><p></p><p></p></result>
|
|
|
|
|
<result><h2></h2><p></p><p></p></result>
|
|
|
|
|
<result><h2></h2><p></p><p></p></result>
|
|
|
|
|
<result><h2></h2><p></p><p></p></result>
|
|
|
|
|
<result><h2></h2><p></p><p></p></result>
|
|
|
|
|
<result><h2></h2><p></p><p></p></result>
|
|
|
|
|
<result><h2></h2><p></p><p></p></result>
|
|
|
|
|
<result><h2></h2><p></p><p></p></result>
|
|
|
|
|
<result><h2></h2><p></p><p></p></result>
|
|
|
|
|
<result><h2></h2><p></p><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" />
|
|
|
|
@ -378,22 +410,18 @@
|
|
|
|
|
<button id="upload">Upload Backup</button>
|
|
|
|
|
</div>
|
|
|
|
|
<h1 class="title">{{ name }}'s profile</h1>
|
|
|
|
|
<h3>click on one of the following areas to edit</h3>
|
|
|
|
|
<h3>profile picture, name, song, and about me</h3>
|
|
|
|
|
<p style="font-size: 16px;">share your profile at {{ url_gen }}</p>
|
|
|
|
|
<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>
|
|
|
|
|
<img src="{{ user_pfp }}" class="pfp edit" id="pfp" />
|
|
|
|
|
<div class="profile-element edit" id="name">
|
|
|
|
|
<h1>{{ name }}</h1>
|
|
|
|
|
<p>/u/{{ username }}</p>
|
|
|
|
|
<div class="badges">{{ badges }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<div class="samerow" id="song">
|
|
|
|
|
<h2 id="song">{{ song_title }}</h2>
|
|
|
|
|
<img src="/img/edit.svg" id="edit" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="profile-element edit" id="song">
|
|
|
|
|
<h2>{{ song_title }}</h2>
|
|
|
|
|
<h3>{{ song_artist }}</h3>
|
|
|
|
|
<div class="samerow">
|
|
|
|
|
<p id="curPos">0:00</p>
|
|
|
|
@ -405,17 +433,14 @@
|
|
|
|
|
<img id="mute" src="/img/volume.svg" class="controls"/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<div class="profile-element">
|
|
|
|
|
<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>
|
|
|
|
|
<p>{{ about }}</p>
|
|
|
|
|
<section class="column edit" id="about">
|
|
|
|
|
<h1>about me</h1>
|
|
|
|
|
<p class="about">{{ about }}</p>
|
|
|
|
|
</section>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
|
|
|
|