SEGAy/MaiMaiDXNet
1
0
Fork 0
mirror of https://dev.s-ul.net/Galexion/MaiMaiDXNet.git synced 2024-11-24 04:40:11 +01:00
Code Releases Activity

3 words. Nested. Fucking. Divs.

Browse Source
This commit is contained in:
Galexion 2023-02-17 06:47:28 -05:00
parent 13a06b19da
commit 93a9e0ee64
6 changed files with 313 additions and 188 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

71
public/javascript/login.js Normal file
View File

@ -0,0 +1,71 @@
// Get the cookie string
const cookieString = document.cookie;
// Parse the cookie string and extract the values
const cookies = cookieString.split(';');
let ext_id, luid;
for (let i = 0; i < cookies.length; i++) {
const cookie = cookies[i].trim();
const cookieParts = cookie.split('=');
if (cookieParts[0] === 'ext_id') {
ext_id = cookieParts[1];
}
if (cookieParts[0] === 'luid') {
luid = cookieParts[1];
}
}
// Sends user to User Page if already signed in
if (ext_id && luid) {
console.log(`User Data Detected, sending to user page.`);
window.location = "/user";
} else {
console.log('User Data Not Detected! Please Sign In.');
}
const form = document.getElementById("myForm");
form.addEventListener("submit", function(event) {
event.preventDefault(); // Prevent the default form submission behavior
const input = document.getElementsByName("myInput")[0].value;
const url = "/api/getExtId"; // Replace with your API endpoint URL
// Send the input data to the API endpoint using fetch
fetch(url, {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({
input: input
})
})
.then(response => response.json())
.then(data => {
console.log(data)
let releventData = {
luid: data.data.luid,
ext_id: data.data.ext_id
}
console.log(releventData)
// Set the cookie expiration to 7 days from now
const expirationDate = new Date(Date.now() + 7 * 24 * 60 * 60 * 1000);
// Set the ext_id cookie
document.cookie = `ext_id=${data.data.ext_id}; expires=${expirationDate.toUTCString()}`;
// Set the luid cookie
document.cookie = `luid=${data.data.luid}; expires=${expirationDate.toUTCString()}`;
console.log(data.data.id)
// Set the aime_card_id cookie
document.cookie = `aime_card_id=${data.data.id.toString()}; expires=${expirationDate.toUTCString()}`;
// Set the cookie
window.location = "/user";
})
.catch(error => console.error(error));
});

105
public/javascript/user.js Normal file
View File

@ -0,0 +1,105 @@
// Get the clear storage button element
const clearStorageBtn = document.getElementById('clear-storage-btn');
// Add a click event listener to the clear storage button
clearStorageBtn.addEventListener('click', () => {
// Remove the cookies
function removeCookies() {
// Set the expiration date to a date in the past
const expirationDate = new Date(0).toUTCString();
// Set the ext_id cookie to expire
document.cookie = `ext_id=; expires=${expirationDate}`;
// Set the luid cookie to expire
document.cookie = `luid=; expires=${expirationDate}`;
// Set the aime_card_id cookie to expire
document.cookie = `aime_card_id=; expires=${expirationDate}`;
}
// Example usage
removeCookies();
console.log('Local storage cleared.');
window.location = "/";
});
// Get the cookie string
const cookieString = document.cookie;
// Parse the cookie string and extract the values
const cookies = cookieString.split(';');
let ext_id, luid;
for (let i = 0; i < cookies.length; i++) {
const cookie = cookies[i].trim();
const cookieParts = cookie.split('=');
if (cookieParts[0] === 'ext_id') {
ext_id = cookieParts[1];
}
if (cookieParts[0] === 'luid') {
luid = cookieParts[1];
}
}
// Send the user to the sign in page if they aren't already signed in to the website.
if (ext_id && luid) {
console.log(`ext_id: ${ext_id}, luid: ${luid}`);
} else {
console.log('User Data Not Detected! Please Sign In.');
window.location = "/";
}
const userdata = JSON.parse(document.currentScript.getAttribute('data-userdata'));
// Check if the user image element exists
if(userdata.icon_id === 10) {
const userImage = document.getElementById('user-image');
userImage.src = "images/" + ext_id + '-up.jpg';
} else if (document.currentScript.getAttribute('data-userdata')) {
const userImage = document.getElementById('user-image');
const UI_Icon = userdata.icon_id;
// Pad the number because game weird
function padNumber(num, size) {
let s = num + "";
while (s.length < size) {
s = "0" + s;
}
return s;
}
// Set the user image source
userImage.src = "assets/icon/UI_Icon_" + padNumber(Number(UI_Icon), 6) + '.png';
}
// title getting
const request = new XMLHttpRequest();
request.open('GET', '/assets/metadata/titleMetadata.json', true);
request.onload = function() {
if (this.status >= 200 && this.status < 400) {
const data = JSON.parse(this.response);
const userTitle = document.getElementById('user-title-text');
var userTitleText = ""
for (title of data) {
if(userdata.title_id === title.titleId) {
userTitleText = title.name
break
}
continue
}
userTitle.textContent = userTitleText
} else {
// handle the error
}
};
request.onerror = function() {
// handle the error
};
request.send();

80
public/stylesheets/user.css
View File

@ -2,8 +2,8 @@
display: block;
margin-left: auto;
margin-right: auto;
max-width: 8em;
height: auto;
max-width: 100%;
width: 100%;
}
#User {
@ -12,3 +12,79 @@
margin-right: auto;
margin: 1%;
}
#wrapper {
display: flex;
justify-content: center;
align-items: center;
}
#user-profile-wrapper {
display: inline-grid;
margin: 0px;
grid-template-areas:
"profile-image user-title user-title"
"profile-image user-name dx-rating"
"profile-image user-class awakens";
gap: 10px;
border: 2px solid black;
border-radius: 10px;
justify-items: center;
align-items: center;
width: fit-content;
margin: 0 auto;
}
@media screen and (max-width: 768px) {
#user-profile-wrapper {
display: inline-block;
margin: 0;
padding: 20px;
border: 2px solid black;
border-radius: 10px;
align-items: center;
justify-content: center;
}
}
.profile-image {
grid-area: profile-image;
max-width: 100%;
width: 100%;
}
.user-title {
grid-area: user-title;
}
.user-name {
grid-area: user-name;
}
.dx-rating {
grid-area: dx-rating;
}
.user-rank {
grid-area: user-rank;
}
.awakens {
grid-area: awakens;
}
h4 {
font-size: 2em;
}
@media (max-width: 768px) {
h4 {
font-size: 1.5em;
}
}
@media (max-width: 480px) {
h4 {
font-size: 1.2em;
}
}

14
readme.md
View File

@ -36,13 +36,15 @@ Create a `config.json` file and paste this in, with paths to your instance.
# Project Progress
ToDo:
- Make User Profile on User Page (almost done)
- fuck you go work on divs and grids and spacing and go watch Hyperplexed you no name piece of shit - literally me talking to me
- Literally everything else
- Create Play Data Tab
- Create Photos Tab
- Create Area Tab
- Create Collection Tab
- Create Ranking Tab
- Create Options Tab
- add a background i guess
Complete:
- Sign In Page
- Make User Profile on User Page (almost done)
- (Done) Get User Data, and send it.
- (Done) Grab the User Profile, and get the custom one if the user icon ID is set to 10.
- Fuck you css go kill yourself

95
views/index.ejs
View File

@ -1,85 +1,16 @@
<% var rootPath='../' ; %>
<%- include(rootPath + 'templates/header.ejs' ); %>
<%- include(rootPath + 'templates/header.ejs' ); %>
<div id="loginContent">
<h1>MaiMaiDX.Net</h1>
<h5>Total Users Registered: <%= params.totalUsers %>
</h5>
<div id="loginContent">
<h1>MaiGateDX</h1>
<h5>Total Users Registered: <%= params.totalUsers %></h5>
<h4>Please Input your 20 Digit Access Code.</h4>
<form id="myForm">
<input type="text" name="myInput" maxlength="20" placeholder="0000011111222223333344444" required>
<button type="submit">Submit</button>
</form>
<script type="text/javascript" src="/javascript/login.js"></script>
</div>
</body>
<h4>Please Input your 20 Digit Access Code.</h4>
<form id="myForm">
<input type="text" name="myInput" maxlength="20" placeholder="0000011111222223333344444" required>
<button type="submit">Submit</button>
</form>
<script>
// Get the cookie string
const cookieString = document.cookie;
// Parse the cookie string and extract the values
const cookies = cookieString.split(';');
let ext_id2, luid2;
for (let i = 0; i < cookies.length; i++) {
const cookie = cookies[i].trim();
const cookieParts = cookie.split('=');
if (cookieParts[0] === 'ext_id') {
ext_id2 = cookieParts[1];
}
if (cookieParts[0] === 'luid') {
luid2 = cookieParts[1];
}
}
// Sends user to User Page if already signed in
if (ext_id2 && luid2) {
console.log(`User Data Detected, sending to user page.`);
window.location = "/user";
} else {
console.log('User Data Not Detected! Please Sign In.');
}
const form = document.getElementById("myForm");
form.addEventListener("submit", function (event) {
event.preventDefault(); // Prevent the default form submission behavior
const input = document.getElementsByName("myInput")[0].value;
const url = "/api/getExtId"; // Replace with your API endpoint URL
// Send the input data to the API endpoint using fetch
fetch(url, {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({ input: input })
})
.then(response => response.json())
.then(data => {
console.log(data)
let releventData = { luid: data.data.luid, ext_id: data.data.ext_id }
console.log(releventData)
// Set the cookie expiration to 7 days from now
const expirationDate = new Date(Date.now() + 7 * 24 * 60 * 60 * 1000);
// Set the ext_id cookie
document.cookie = `ext_id=${data.data.ext_id}; expires=${expirationDate.toUTCString()}`;
// Set the luid cookie
document.cookie = `luid=${data.data.luid}; expires=${expirationDate.toUTCString()}`;
console.log(data.data.id)
// Set the aime_card_id cookie
document.cookie = `aime_card_id=${data.data.id.toString()}; expires=${expirationDate.toUTCString()}`;
// Set the cookie
window.location = "/user";
})
.catch(error => console.error(error));
});
</script> <!-- ToDo: Move this script to a seperate JS file.-->
</div>
</body>
</html>
</html>

136
views/user.ejs
View File

@ -1,102 +1,42 @@
<% var rootPath='../' ; %>
<%- include(rootPath + 'templates/header.ejs' ); %>
<% function normalizeText(text) { return text .normalize('NFD') .replace(/[\u0300-\u036f]/g, '' )
.replace(/[\uFF01-\uFF5E]/g, function(ch) { return String.fromCharCode(ch.charCodeAt(0) - 0xFEE0); }); } %>
<link href="/stylesheets/user.css" rel="stylesheet" type="text/css">
<div id="User">
<h1>Yo! Welcome Back <%= normalizeText(userdata.user_name) %>!</h1>
<button id="clear-storage-btn">Sign Out</button>
<%- include(rootPath + 'templates/header.ejs' ); %>
<% function normalizeText(text) { return text .normalize('NFD') .replace(/[\u0300-\u036f]/g, ''
).replace(/[\uFF01-\uFF5E]/g, function(ch) { return String.fromCharCode(ch.charCodeAt(0) - 0xFEE0); }); } %>
<link href="/stylesheets/user.css" rel="stylesheet" type="text/css">
<div id="User">
<h1>Yo! Welcome Back <%= normalizeText(userdata.user_name) %>!</h1>
<div id="wrapper">
<div id="user-profile-wrapper">
<div class="profile-image"><img id="user-image" src="" alt="User Image" onerror="this.src='assets/icon/UI_Icon_000000.png'"></div>
<div class="user-title">
<h4 id="user-title-text"></h4>
</div>
<div class="user-name">
<h4><%= normalizeText(userdata.user_name) %></h4>
</div>
<div class="dx-rating">
<h4><%= userdata.music_rating%></h4>
</div>
<div class="user-class"></div>
<div class="awakens">
<h4>★ ☓<%= userdata.total_awake%></h4>
</div>
</div>
</div>
<details>
<summary>Developer Only Information</summary>
For Development purposes only, send statistics found in this menu when encontering UI
Errors.
<details>
<summary>Raw User Details</summary>
<pre><code><%=JSON.stringify(userdata, null, 2)%></code></pre>
</details>
</details>
<button id="clear-storage-btn">Sign Out</button>
<script>
const extId = localStorage.getItem('ext_id');
const luid = localStorage.getItem('luid');
const clearStorageBtn = document.getElementById('clear-storage-btn');
clearStorageBtn.addEventListener('click', () => {
// Remove the cookies
function removeCookies() {
// Set the expiration date to a date in the past
const expirationDate = new Date(0).toUTCString();
</div>
// Set the ext_id cookie to expire
document.cookie = `ext_id=; expires=${expirationDate}`;
<script type="text/javascript" src="/javascript/user.js" data-userdata="<%=JSON.stringify(userdata)%>"></script>
</body>
// Set the luid cookie to expire
document.cookie = `luid=; expires=${expirationDate}`;
// Set the aime_card_id cookie to expire
document.cookie = `aime_card_id=; expires=${expirationDate}`;
}
// Example usage
removeCookies();
console.log('Local storage cleared.');
window.location = "/";
});
// Get the cookie string
const cookieString = document.cookie;
// Parse the cookie string and extract the values
const cookies = cookieString.split(';');
let ext_id2, luid2;
for (let i = 0; i < cookies.length; i++) {
const cookie = cookies[i].trim();
const cookieParts = cookie.split('=');
if (cookieParts[0] === 'ext_id') {
ext_id2 = cookieParts[1];
}
if (cookieParts[0] === 'luid') {
luid2 = cookieParts[1];
}
}
// Sends user to the sign in page if they aren't already signed in to the website.
if (ext_id2 && luid2) {
console.log(`ext_id: ${ext_id2}, luid: ${luid2}`);
} else {
console.log('User Data Not Detected! Please Sign In.');
window.location = "/";
}
</script>
<% if(userdata.icon_id===10) { %> <!-- If the user icon id is set to 10, it's a custom image and you need to grab the image that the user uploaded. -->
<img id="user-image" src="" alt="User Image">
<script>
const userImage = document.getElementById('user-image');
userImage.src = "images/" + ext_id2 + '-up.jpg';
</script>
<% } else {%> <!-- If Not, use the userdata.icon_id variable to find which icon you need. -->
<img id="user-image" src="" alt="User Image">
<script data-userdata="<%=JSON.stringify(userdata)%>">
const userdata = JSON.parse(document.currentScript.getAttribute('data-userdata'));
const userImage = document.getElementById('user-image');
const UI_Icon = userdata.icon_id
function padNumber(num, size) { // pad the number because haha game weird
var s = num + "";
while (s.length < size) s = "0" + s;
return s;
}
// Usage:
userImage.src = "assets/icon/UI_Icon_" + padNumber(Number(UI_Icon),6) + '.png';
</script>
<%}%>
<details>
<summary>Developer Only Information</summary>
For Development purposes only, send statistics found in this menu when encontering UI
Errors.
<details>
<summary>Raw User Details</summary>
<pre><code><%=JSON.stringify(userdata, null, 2)%></code></pre>
</details>
</details>
</div>
</html>