Files
infinsweeper/index.erb
2025-09-03 15:36:28 +01:00

103 lines
3.6 KiB
Plaintext

<!doctype html>
<html>
<head>
<title>InfinSweeper</title>
<link rel="icon" type="image/png" href="src/assets/img/logo_sm.png" />
<meta
name="viewport"
content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"
/>
<meta name="signed_in" content="<%= @signed_in %>">
<meta name="csrf" content="<%= @csrf_token %>">
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=WDXL+Lubrifont+JP+N&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="src/assets/style.css" />
<script type="module" src="src/js/accounts.js"></script>
<script type="module" src="src/js/game.js"></script>
</head>
<body>
<div class="header">
<a href="/">
<img
src="src/assets/img/logo_lg.png"
alt="InfinSweeper"
class="logo pixelart"
/>
</a>
<div class="header-right">
<button class="account-button" id="logout-button">LOGOUT</button>
<button class="account-button" id="login-button">LOGIN</button>
<button class="account-button" id="signup-button">SIGN UP</button>
</div>
</div>
<span id="message"><%= @message %></span>
<canvas id="main-canvas"></canvas>
<div class="popup" id="popup">
<span class="close" id="close">&times;</span>
<div class="popup-tab" id="login">
<form id="login-form" class="form">
<label for="username">USERNAME</label>
<input type="text" name="username" placeholder="Username" required />
<label for="pass">PASSWORD</label>
<input type="password" name="pass" placeholder="Password" required />
<button type="submit">LOGIN</button>
<span class="link" id="forgot-link">Forgot password?</span>
<span class="info" id="login-info"></span>
</form>
</div>
<div class="popup-tab" id="signup">
<form id="signup-form" class="form">
<label for="username">USERNAME</label>
<input type="text" name="username" placeholder="Username" required />
<label for="email">EMAIL</label>
<input
type="email"
name="email"
placeholder="Email"
required
autocapitalize="off"
/>
<label for="pass">PASSWORD</label>
<input type="password" name="pass" placeholder="Password" required />
<button type="submit">SIGN UP</button>
<span class="info" id="signup-info"></span>
</form>
</div>
<div class="popup-tab" id="settings">
<!-- TODO: settings -->
</div>
<div class="popup-tab" id="forgot-pass">
<form id="forgot-form" class="form">
<input
type="email"
name="email"
placeholder="Email"
required
autocapitalize="off"
autocomplete="off"
/>
<button type="submit">SUBMIT</button>
<span class="info" id="forgot-info"></span>
</form>
</div>
<div class="popup-tab" id="reset-pass">
<form id="reset-form" class="form">
<input type="password" name="pass" placeholder="Password" required />
<input
type="password"
name="pass_confirm"
placeholder="Confirm Password"
required
/>
<button type="submit">SUBMIT</button>
<span class="info" id="reset-info"></span>
</form>
</div>
</div>
</body>
</html>