75 lines
2.6 KiB
Plaintext
75 lines
2.6 KiB
Plaintext
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>FFXI Trust Characters</title>
|
|
<link rel="stylesheet" href="styles.css">
|
|
<script>
|
|
// Pass environment variables to client-side JavaScript
|
|
window.ENV = {
|
|
PSQL_HOST: '<%= process.env.PSQL_HOST %>',
|
|
PSQL_PORT: '<%= process.env.PSQL_PORT %>',
|
|
PSQL_USER: '<%= process.env.PSQL_USER %>',
|
|
PSQL_PASSWORD: '<%= process.env.PSQL_PASSWORD %>',
|
|
PSQL_DBNAME: '<%= process.env.PSQL_DBNAME %>'
|
|
};
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<h1>Final Fantasy XI Trust Characters</h1>
|
|
<div class="search-container">
|
|
<input type="text" id="search-input" placeholder="Search for characters...">
|
|
</div>
|
|
<div class="view-toggle-container">
|
|
<div class="view-toggle">
|
|
<button class="view-toggle-btn active" data-view="all">All</button>
|
|
<button class="view-toggle-btn" data-view="acquired">Acquired</button>
|
|
<button class="view-toggle-btn" data-view="unacquired">Unacquired</button>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<main>
|
|
<div class="container">
|
|
<div class="roles-container">
|
|
<h2>Roles</h2>
|
|
<ul id="roles-list">
|
|
<!-- Roles will be populated here -->
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="characters-container">
|
|
<h2 id="current-role">All Characters</h2>
|
|
<div id="characters-grid">
|
|
<!-- Characters will be populated here -->
|
|
</div>
|
|
<div id="synergy-sets-container" class="synergy-sets-container">
|
|
<h2>Synergy Sets</h2>
|
|
<div id="synergy-sets">
|
|
<!-- Synergy sets will be populated here -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="character-details">
|
|
<div id="character-info">
|
|
<!-- Character details will be displayed here -->
|
|
<div class="placeholder-message">
|
|
<p>Select a character to view details</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<footer>
|
|
<p>Final Fantasy XI Trust Characters Database</p>
|
|
</footer>
|
|
|
|
<script src="db_parser.js"></script>
|
|
<script src="app.js"></script>
|
|
</body>
|
|
</html>
|