mirror of
https://git.astronand.dev/minecartchris/Stock-Game.git
synced 2026-06-05 04:55:40 -04:00
85 lines
3.4 KiB
HTML
85 lines
3.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Stock Trading Game</title>
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<h1>Stock Trading Game</h1>
|
|
|
|
<!-- Start Game Screen -->
|
|
<div id="startScreen" class="screen">
|
|
<h2>Welcome to the Stock Game!</h2>
|
|
<div class="form-group">
|
|
<label for="daysInput">How many days do you wish to play?</label>
|
|
<input type="number" id="daysInput" min="1" max="100" value="5">
|
|
<button onclick="startGame()">Start Game</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Game Screen -->
|
|
<div id="gameScreen" class="screen hidden">
|
|
<div class="game-header">
|
|
<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="section">
|
|
<h3>Stock Prices</h3>
|
|
<div id="stocksList" class="stocks-list"></div>
|
|
</div>
|
|
|
|
<div class="section">
|
|
<h3>Your Holdings</h3>
|
|
<div id="holdingsList" class="holdings-list"></div>
|
|
</div>
|
|
|
|
<div class="section">
|
|
<h3>Buy/Sell Stocks</h3>
|
|
<div class="form-group">
|
|
<label for="stockSelect">Select Stock:</label>
|
|
<select id="stockSelect"></select>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="amountInput">Amount:</label>
|
|
<input type="number" id="amountInput" min="1" value="1">
|
|
</div>
|
|
<div class="button-group">
|
|
<button onclick="buyStock()" class="btn-buy">Buy</button>
|
|
<button onclick="sellStock()" class="btn-sell">Sell</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="section">
|
|
<button onclick="nextDay()" class="btn-next-day">Next Day</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- End Game Screen -->
|
|
<div id="endScreen" class="screen hidden">
|
|
<h2>Game Over!</h2>
|
|
<div class="end-stats">
|
|
<p>Starting Balance: $<span id="startBalance">1000</span></p>
|
|
<p>Ending Balance: $<span id="endBalance">0</span></p>
|
|
<p>Total Net Worth: $<span id="netWorth">0</span></p>
|
|
<p class="profit" id="profitText">Profit: $<span id="profit">0</span></p>
|
|
<h3>Final Holdings:</h3>
|
|
<div id="finalHoldings"></div>
|
|
<button onclick="location.reload()">Play Again</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="{{ url_for('static', filename='game.js') }}"></script>
|
|
</body>
|
|
</html>
|