It-Club/Stock-Game
7
0
Fork 0
mirror of https://git.astronand.dev/minecartchris/Stock-Game.git synced 2026-06-28 23:47:25 -04:00
Code Issues Packages Projects Releases Wiki Activity

Update templates/index.html

Browse Source
This commit is contained in:
minecartchris
2025-12-12 16:12:47 -05:00
parent 6365882d00
commit 21765f2b0b
1 changed files with 122 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
templates/index.html
View File

@@ -5,6 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Stock Trading Game</title> <title>Stock Trading Game</title>
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}"> <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</head> </head>
<body> <body>
<div class="container"> <div class="container">
@@ -18,20 +19,17 @@
<input type="number" id="daysInput" min="1" max="100" value="5"> <input type="number" id="daysInput" min="1" max="100" value="5">
<button onclick="startGame()">Start Game</button> <button onclick="startGame()">Start Game</button>
</div> </div>
<div class="form-group">
<button onclick="viewLeaderboard()" class="btn-leaderboard">View Leaderboard</button>
</div>
</div> </div>
<!-- Game Screen --> <!-- Game Screen -->
<div id="gameScreen" class="screen hidden"> <div id="gameScreen" class="screen hidden">
<div class="game-header"> <div id="message" class="message" style="margin-bottom: 20px;"></div>
<div class="info-box">
<h3>Balance: $<span id="balance">0</span></h3>
<h3>Day: <span id="day">1</span>/<span id="totalDays">5</span></h3>
<h3>Market Index: <span id="index">0</span></h3>
</div>
<div id="message" class="message"></div>
</div>
<div class="game-content"> <div class="game-content">
<div class="section"> <div class="section">
<h3>Stock Prices</h3> <h3>Stock Prices</h3>
<div id="stocksList" class="stocks-list"></div> <div id="stocksList" class="stocks-list"></div>
@@ -56,12 +54,28 @@
<button onclick="buyStock()" class="btn-buy">Buy</button> <button onclick="buyStock()" class="btn-buy">Buy</button>
<button onclick="sellStock()" class="btn-sell">Sell</button> <button onclick="sellStock()" class="btn-sell">Sell</button>
</div> </div>
<div class="button-group">
<button onclick="buyAll()" class="btn-buy-all">Buy All</button>
<button onclick="sellAll()" class="btn-sell-all">Sell All</button>
</div>
</div> </div>
<div class="section"> <div class="section">
<div class="info-box">
<h3>Balance: $<span id="balance">0</span></h3>
<h3>Day: <span id="day">1</span>/<span id="totalDays">5</span></h3>
<h3>Market Index: <span id="index">0</span></h3>
</div>
<button onclick="nextDay()" class="btn-next-day">Next Day</button> <button onclick="nextDay()" class="btn-next-day">Next Day</button>
</div> </div>
</div> </div>
<div class="charts-container">
<h3 style="grid-column: 1/-1; margin-bottom: 10px;">Stock Price Trends</h3>
<div class="chart-item" style="grid-column: 1/-1;">
<canvas id="priceChart"></canvas>
</div>
</div>
</div> </div>
<!-- End Game Screen --> <!-- End Game Screen -->
@@ -74,9 +88,33 @@
<p class="profit" id="profitText">Profit: $<span id="profit">0</span></p> <p class="profit" id="profitText">Profit: $<span id="profit">0</span></p>
<h3>Final Holdings:</h3> <h3>Final Holdings:</h3>
<div id="finalHoldings"></div> <div id="finalHoldings"></div>
<div class="charts-container" style="margin-top: 30px;">
<h3 style="grid-column: 1/-1; margin-bottom: 10px;">Final Price Trends</h3>
<div class="chart-item" style="grid-column: 1/-1;">
<canvas id="endPriceChart"></canvas>
</div>
</div>
<div class="form-group">
<label for="playerName">Enter your name for the scoreboard:</label>
<input type="text" id="playerName" placeholder="Your Name" value="">
<button onclick="saveScore()" class="btn-save-score">Save Score</button>
</div>
<button onclick="location.reload()">Play Again</button> <button onclick="location.reload()">Play Again</button>
</div> </div>
</div> </div>
<!-- Leaderboard Screen -->
<div id="leaderboardScreen" class="screen hidden">
<h2>Leaderboard</h2>
<div class="leaderboard-container">
<div id="leaderboardList" class="leaderboard-list"></div>
<div id="emptyLeaderboard" class="empty-message">No scores yet. Be the first to play!</div>
</div>
<button onclick="backToStart()" class="btn-back">Back to Start</button>
</div>
</div> </div>
<script src="{{ url_for('static', filename='game.js') }}"></script> <script src="{{ url_for('static', filename='game.js') }}"></script>