Upload files to "static"

static/game.js

@@ -0,0 +1,258 @@
+// Game state
+let gameActive = false;
+
+async function startGame() {
+    const daysInput = document.getElementById('daysInput');
+    const days = parseInt(daysInput.value);
+
+    if (!days || days < 1) {
+        alert('Please enter a valid number of days');
+        return;
+    }
+
+    try {
+        const response = await fetch('/api/start', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify({ days: days })
+        });
+
+        if (!response.ok) throw new Error('Failed to start game');
+
+        gameActive = true;
+        document.getElementById('startScreen').classList.add('hidden');
+        document.getElementById('gameScreen').classList.remove('hidden');
+        document.getElementById('totalDays').textContent = days;
+
+        await updateGameDisplay();
+        populateStockSelect();
+    } catch (error) {
+        alert('Error starting game: ' + error.message);
+    }
+}
+
+async function updateGameDisplay() {
+    try {
+        const response = await fetch('/api/game-state');
+        if (!response.ok) throw new Error('Failed to fetch game state');
+
+        const data = await response.json();
+
+        document.getElementById('balance').textContent = data.balance;
+        document.getElementById('day').textContent = data.day;
+        document.getElementById('index').textContent = data.index;
+
+        displayStocks(data.stocks);
+        displayHoldings(data.holdings);
+        displayMessage(data.message);
+    } catch (error) {
+        console.error('Error updating game display:', error);
+    }
+}
+
+function displayStocks(stocks) {
+    const stocksList = document.getElementById('stocksList');
+    stocksList.innerHTML = '';
+
+    stocks.forEach(stock => {
+        const div = document.createElement('div');
+        div.className = 'stock-item';
+        div.innerHTML = `<span>${stock.name}</span><span>$${stock.price}</span>`;
+        stocksList.appendChild(div);
+    });
+}
+
+function displayHoldings(holdings) {
+    const holdingsList = document.getElementById('holdingsList');
+    holdingsList.innerHTML = '';
+
+    holdings.forEach(holding => {
+        const div = document.createElement('div');
+        div.className = 'holding-item';
+        div.innerHTML = `<span>${holding.name}</span><span>${holding.amount} shares</span>`;
+        holdingsList.appendChild(div);
+    });
+}
+
+function displayMessage(message) {
+    const messageDiv = document.getElementById('message');
+    if (message) {
+        messageDiv.textContent = message;
+        messageDiv.classList.add('show');
+        messageDiv.classList.remove('error');
+    } else {
+        messageDiv.classList.remove('show');
+    }
+}
+
+function populateStockSelect() {
+    const stocks = [
+        { id: 1, name: 'Kwik trip' },
+        { id: 2, name: 'Apple computers' },
+        { id: 3, name: 'Microsoft' },
+        { id: 4, name: 'Walmart Super Store' },
+        { id: 5, name: 'Car company' }
+    ];
+
+    const select = document.getElementById('stockSelect');
+    select.innerHTML = '';
+    stocks.forEach(stock => {
+        const option = document.createElement('option');
+        option.value = stock.id;
+        option.textContent = `${stock.name}`;
+        select.appendChild(option);
+    });
+}
+
+async function buyStock() {
+    if (!gameActive) return;
+
+    const stockId = parseInt(document.getElementById('stockSelect').value);
+    const amount = parseInt(document.getElementById('amountInput').value);
+
+    if (!amount || amount < 1) {
+        showError('Please enter a valid amount');
+        return;
+    }
+
+    try {
+        const response = await fetch('/api/buy', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify({
+                stock_id: stockId,
+                amount: amount
+            })
+        });
+
+        const data = await response.json();
+
+        if (!response.ok) {
+            showError(data.error);
+            return;
+        }
+
+        document.getElementById('amountInput').value = '1';
+        await updateGameDisplay();
+    } catch (error) {
+        showError('Error buying stock: ' + error.message);
+    }
+}
+
+async function sellStock() {
+    if (!gameActive) return;
+
+    const stockId = parseInt(document.getElementById('stockSelect').value);
+    const amount = parseInt(document.getElementById('amountInput').value);
+
+    if (!amount || amount < 1) {
+        showError('Please enter a valid amount');
+        return;
+    }
+
+    try {
+        const response = await fetch('/api/sell', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify({
+                stock_id: stockId,
+                amount: amount
+            })
+        });
+
+        const data = await response.json();
+
+        if (!response.ok) {
+            showError(data.error);
+            return;
+        }
+
+        document.getElementById('amountInput').value = '1';
+        await updateGameDisplay();
+    } catch (error) {
+        showError('Error selling stock: ' + error.message);
+    }
+}
+
+async function nextDay() {
+    if (!gameActive) return;
+
+    try {
+        const response = await fetch('/api/next-day', {
+            method: 'POST'
+        });
+
+        const data = await response.json();
+
+        if (data.game_over) {
+            await endGame();
+            return;
+        }
+
+        await updateGameDisplay();
+    } catch (error) {
+        showError('Error advancing to next day: ' + error.message);
+    }
+}
+
+async function endGame() {
+    try {
+        const response = await fetch('/api/end-game');
+        if (!response.ok) throw new Error('Failed to fetch end game stats');
+
+        const data = await response.json();
+
+        document.getElementById('startBalance').textContent = data.starting_balance;
+        document.getElementById('endBalance').textContent = data.ending_balance;
+        document.getElementById('netWorth').textContent = data.total_net_worth;
+        document.getElementById('profit').textContent = data.profit;
+
+        // Color profit red or green
+        const profitText = document.getElementById('profitText');
+        if (data.profit >= 0) {
+            profitText.style.color = '#4caf50';
+        } else {
+            profitText.style.color = '#f44336';
+        }
+
+        // Display final holdings
+        const finalHoldings = document.getElementById('finalHoldings');
+        finalHoldings.innerHTML = '';
+        data.holdings.forEach((holding, index) => {
+            if (holding.amount > 0) {
+                const div = document.createElement('div');
+                div.className = 'holding-final';
+                const stockPrice = data.stocks[index].price;
+                const value = holding.amount * stockPrice;
+                div.innerHTML = `
+                    <span>${holding.name}: ${holding.amount} shares</span>
+                    <span>Value: $${value}</span>
+                `;
+                finalHoldings.appendChild(div);
+            }
+        });
+
+        gameActive = false;
+        document.getElementById('gameScreen').classList.add('hidden');
+        document.getElementById('endScreen').classList.remove('hidden');
+    } catch (error) {
+        showError('Error getting game stats: ' + error.message);
+    }
+}
+
+function showError(message) {
+    const messageDiv = document.getElementById('message');
+    messageDiv.textContent = message;
+    messageDiv.classList.add('show', 'error');
+}
+
+// Initialize when page loads
+document.addEventListener('DOMContentLoaded', () => {
+    populateStockSelect();
+});