mirror of
https://dev.s-ul.net/Galexion/MaiMaiDXNet.git
synced 2024-11-24 04:30:12 +01:00
Icon Images & visual clean up
This commit is contained in:
Galexion
parent
f280aec60f
commit
a8d06a4ae1
1
.gitignore
vendored
1
.gitignore
vendored
@ -1,3 +1,4 @@
|
||||
config.json
|
||||
public/images
|
||||
public/assets
|
||||
node_modules
|
||||
@ -1,4 +1,6 @@
|
||||
|
||||
body {
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
#ACode {
|
||||
width:225px;
|
||||
@ -8,14 +10,6 @@
|
||||
margin-top: -1%;
|
||||
}
|
||||
|
||||
img {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
#loginContent {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
@ -24,7 +18,8 @@ img {
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 3em;
|
||||
font-size: 2em;
|
||||
text-transform: full-width-to-half-width;
|
||||
}
|
||||
h5 {
|
||||
font-size: 1.3em;
|
||||
@ -32,3 +27,11 @@ h5 {
|
||||
h4 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
#imgHeader {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
14
public/stylesheets/user.css
Normal file
14
public/stylesheets/user.css
Normal file
@ -0,0 +1,14 @@
|
||||
#user-image {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: 8em;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
#User {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin: 1%;
|
||||
}
|
||||
26
readme.md
26
readme.md
@ -8,6 +8,19 @@ Currently, I only have access to AQUA, but ARTEMiS could be supported once AQUA
|
||||
|
||||
# How to use:
|
||||
|
||||
## All Servers
|
||||
|
||||
You'll need to extract the assets from the game itself.
|
||||
|
||||
in the public folder, the assets should look like this
|
||||
|
||||
-- Public
|
||||
| - Assets
|
||||
\___ | - icon (icons should go here)
|
||||
| - more soon
|
||||
|
||||
Then, create the `/public/image/` folder. this will be where the images will be stored.
|
||||
|
||||
## Aqua
|
||||
|
||||
Create a `config.json` file and paste this in, with paths to your instance.
|
||||
@ -19,15 +32,16 @@ Create a `config.json` file and paste this in, with paths to your instance.
|
||||
}
|
||||
```
|
||||
|
||||
Then, create the `/public/image/` folder. this will be where the images will be stored.
|
||||
|
||||
# Project Progress
|
||||
|
||||
ToDo:
|
||||
- Make User Profile on User Page
|
||||
- (Done) Get User Data, and send it.
|
||||
- Grab the User Profile, and get the custom one if the user icon ID is set to 10.
|
||||
- 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
|
||||
|
||||
Complete:
|
||||
- Sign In Page
|
||||
- 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.
|
||||
@ -11,4 +11,7 @@
|
||||
<meta name="msapplication-TileColor" content="#da532c">
|
||||
<meta name="theme-color" content="#ffffff">
|
||||
</head>
|
||||
<body>
|
||||
<body>
|
||||
<div id="imgHeader">
|
||||
<img id="imgHeader" src="MaiMaiDXNet/maimaidxex.jpg">
|
||||
</div>
|
||||
@ -1,8 +1,6 @@
|
||||
<% var rootPath='../' ; %>
|
||||
<%- include(rootPath + 'templates/header.ejs' ); %>
|
||||
<div id="wrapper">
|
||||
<img src="MaiMaiDXNet/maimaidxex.jpg">
|
||||
</div>
|
||||
|
||||
<div id="loginContent">
|
||||
<h1>MaiMaiDX.Net</h1>
|
||||
<h5>Total Users Registered: <%= params.totalUsers %>
|
||||
|
||||
137
views/user.ejs
137
views/user.ejs
@ -1,65 +1,102 @@
|
||||
<% var rootPath='../' ; %>
|
||||
<%- include(rootPath + 'templates/header.ejs' ); %>
|
||||
<h1>Yo! Welcome Back ${User}!</h1>
|
||||
<button id="clear-storage-btn">Sign Out</button>
|
||||
<% 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>
|
||||
|
||||
<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();
|
||||
<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();
|
||||
|
||||
// Set the ext_id cookie to expire
|
||||
document.cookie = `ext_id=; expires=${expirationDate}`;
|
||||
// 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 luid cookie to expire
|
||||
document.cookie = `luid=; expires=${expirationDate}`;
|
||||
|
||||
// Set the aime_card_id cookie to expire
|
||||
document.cookie = `aime_card_id=; expires=${expirationDate}`;
|
||||
}
|
||||
// Set the aime_card_id cookie to expire
|
||||
document.cookie = `aime_card_id=; expires=${expirationDate}`;
|
||||
}
|
||||
|
||||
// Example usage
|
||||
removeCookies();
|
||||
// Example usage
|
||||
removeCookies();
|
||||
|
||||
console.log('Local storage cleared.');
|
||||
window.location = "/";
|
||||
});
|
||||
console.log('Local storage cleared.');
|
||||
window.location = "/";
|
||||
});
|
||||
|
||||
// Get the cookie string
|
||||
const cookieString = document.cookie;
|
||||
// Get the cookie string
|
||||
const cookieString = document.cookie;
|
||||
|
||||
// Parse the cookie string and extract the values
|
||||
const cookies = cookieString.split(';');
|
||||
let ext_id2, luid2;
|
||||
// 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('=');
|
||||
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] === 'ext_id') {
|
||||
ext_id2 = cookieParts[1];
|
||||
}
|
||||
|
||||
if (cookieParts[0] === 'luid') {
|
||||
luid2 = cookieParts[1];
|
||||
}
|
||||
}
|
||||
if (cookieParts[0] === 'luid') {
|
||||
luid2 = cookieParts[1];
|
||||
}
|
||||
}
|
||||
|
||||
// Use the values as needed
|
||||
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>
|
||||
// Use the values as needed
|
||||
if (ext_id2 && luid2) {
|
||||
console.log(`ext_id: ${ext_id2}, luid: ${luid2}`);
|
||||
|
||||
<details>
|
||||
<summary>Developer Only Information</summary>
|
||||
For Development purposes only, send statistics found in this menu when encontering UI Errors.
|
||||
</details>
|
||||
} else {
|
||||
console.log('User Data Not Detected! Please Sign In.');
|
||||
window.location = "/";
|
||||
}
|
||||
</script>
|
||||
|
||||
<% if(userdata.icon_id===10) { %>
|
||||
<img id="user-image" src="" alt="User Image">
|
||||
|
||||
<script>
|
||||
const userImage = document.getElementById('user-image');
|
||||
userImage.src = "images/" + ext_id2 + '-up.jpg';
|
||||
</script>
|
||||
|
||||
<% } else {%>
|
||||
<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) {
|
||||
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>
|
||||
Loading…
Reference in New Issue
Block a user