first commit

This commit is contained in:
2025-12-26 13:37:00 +01:00
commit 3e5fe2e386
30590 changed files with 6509 additions and 0 deletions
+266
View File
@@ -0,0 +1,266 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Shop - Buy Items</title>
<meta name="viewport" content="width=device-width,initial-scale=1" />
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&icon_names=shopping_cart"
/>
<link rel="stylesheet" href="static/css/index.css" />
</head>
<body>
<button id="loginBtn" class="login-btn" style="display: none">
Login
</button>
<button id="logoutBtn" class="logout-btn" style="display: none">
Logout
</button>
<button id="cartBtn" class="cart-btn">
<span class="material-symbols-outlined"> shopping_cart </span
><span id="cartCount" class="cart-count" style="display: none"
>0</span
>
</button>
<!--balance-->
<div id="balanceBtn" class="balance-Btn" style="display: none">
<span id="balanceAmount" class="balance-amount">0</span>
</div>
<h1>Shop - Items to Buy</h1>
<button
id="accountBtn"
class="login-btn"
style="left: auto; right: 130px; top: 24px; display: none"
>
Manage Account
</button>
<table id="items-list" class="item-table">
<thead>
<tr>
<th></th>
<th>Item Name</th>
<th>Amount</th>
<th>Price</th>
<th>Stock</th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr class="loading">
<td colspan="6">Loading items...</td>
</tr>
</tbody>
</table>
<div id="msg"></div>
<!-- Login Modal -->
<div id="loginModal" class="modal">
<div class="modal-content">
<button class="close-btn" onclick="closeLoginModal()">×</button>
<h2>Login</h2>
<form id="loginForm" autocomplete="off">
<div style="margin-bottom: 12px">
<label for="loginUsername">Username</label>
<input
id="loginUsername"
name="loginUsername"
type="text"
required
style="width: 100%"
/>
</div>
<div style="margin-bottom: 12px">
<label for="loginPassword">Password</label>
<input
id="loginPassword"
name="loginPassword"
type="password"
required
style="width: 100%"
/>
</div>
<button type="submit" style="width: 100%">Login</button>
</form>
<div
id="loginMsg"
style="margin-top: 10px; color: #ff5555"
></div>
</div>
</div>
<!-- Transfer modal -->
<div id="transferModal" class="transfer-modal">
<div class="transfer-content">
<button class="close-btn" onclick="closeTransferModal()">
×
</button>
<h2>Transfer</h2>
<div id="transferForm">
<div id="transferToList" style="margin-bottom: 12px"></div>
<div style="margin-bottom: 12px">
<label for="transferAmount">Amount</label>
<input
id="transferAmount"
name="transferAmount"
type="number"
min="0"
required
style="width: 100%"
/>
</div>
<button id="transferBtn" style="width: 100%">
Transfer
</button>
</div>
<div
id="transferMsg"
style="margin-top: 10px; color: #ff5555"
></div>
</div>
</div>
<!-- Cart Window -->
<div id="cartWindow" class="cart-window">
<div class="cart-content">
<button class="close-btn" onclick="closeCart()">×</button>
<h2>Your Cart</h2>
<div id="cartItems"></div>
<div id="cartTotal" style="margin: 12px 0"></div>
<button
id="checkoutBtn"
style="width: 100%; margin-top: 10px; background: #23a559"
>
Checkout
</button>
</div>
</div>
<!-- Address Selection Modal -->
<div id="addressModal" class="address-modal">
<div class="address-content">
<button class="close-btn" onclick="closeAddressModal()">
×
</button>
<h2>Select Address</h2>
<form id="addressForm">
<div id="addressList" class="address-list"></div>
<button
type="submit"
style="
width: 100%;
margin-top: 10px;
background: #5865f2;
"
>
Confirm Order
</button>
</form>
<div
id="addressMsg"
style="margin-top: 10px; color: #ff5555"
></div>
</div>
</div>
<!-- Account Management Modal -->
<div id="accountModal" class="modal">
<div
class="modal-content"
style="min-width: 340px; max-width: 95vw"
>
<button class="close-btn" onclick="closeAccountModal()">
×
</button>
<h2>Manage Account</h2>
<div
id="accountTabs"
style="display: flex; gap: 12px; margin-bottom: 16px"
>
<button id="tabPassword" style="flex: 1">
Change Password
</button>
<button id="tabAddresses" style="flex: 1">Addresses</button>
<button id="tabComputers" style="flex: 1">
Linked Computers
</button>
</div>
<div id="accountTabPassword" class="account-tab">
<form id="changePasswordForm" autocomplete="off">
<div style="margin-bottom: 10px">
<label>Current Password</label>
<input
id="currentPassword"
type="password"
required
style="width: 100%"
/>
</div>
<div style="margin-bottom: 10px">
<label>New Password</label>
<input
id="newPassword"
type="password"
required
minlength="6"
style="width: 100%"
/>
</div>
<div style="margin-bottom: 10px">
<label>Confirm New Password</label>
<input
id="confirmNewPassword"
type="password"
required
minlength="6"
style="width: 100%"
/>
</div>
<button
type="submit"
style="width: 100%; background: #23a559"
>
Change Password
</button>
</form>
<div id="changePasswordMsg" style="margin-top: 10px"></div>
</div>
<div
id="accountTabAddresses"
class="account-tab"
style="display: none"
>
<div id="addressesList"></div>
<form
id="addAddressForm"
autocomplete="off"
style="margin-top: 12px"
>
<input
id="newAddress"
type="text"
placeholder="New address"
style="width: 70%"
required
/>
<button type="submit" style="background: #5865f2">
Add Address
</button>
</form>
<div id="addressesMsg" style="margin-top: 10px"></div>
</div>
<div
id="accountTabComputers"
class="account-tab"
style="display: none"
>
<div id="computersList"></div>
<div id="computersMsg" style="margin-top: 10px"></div>
</div>
</div>
</div>
<script src="static/js/index.js"></script>
</body>
</html>