Shot Calculator

Golf Shot Distance Tracker

Golf Shot Distance Tracker

Logged Shots

Club Distance (yards) Date Conditions

Average Distances

body { font-family: Arial, sans-serif; background-color: #f4f4f4; padding: 20px; } .tracker { max-width: 700px; margin: 0 auto; background-color: white; padding: 20px; border-radius: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } h1, h2 { text-align: center; } .input-group { margin-bottom: 15px; } .input-group label { display: block; margin-bottom: 5px; } .input-group input, .input-group select { width: 100%; padding: 10px; margin: 5px 0; box-sizing: border-box; } button { width: 100%; padding: 10px; background-color: #28a745; color: white; border: none; cursor: pointer; border-radius: 5px; } button:hover { background-color: #218838; } table { width: 100%; margin-top: 20px; border-collapse: collapse; } table th, table td { padding: 10px; border: 1px solid #ddd; text-align: center; } const log = []; function logShot() { const club = document.getElementById('club').value; const distance = parseFloat(document.getElementById('distance').value); const date = document.getElementById('date').value || "Not provided"; const conditions = document.getElementById('conditions').value || "Not provided"; log.push({ club, distance, date, conditions }); displayLog(); calculateAverage(); } function displayLog() { const logEntries = document.getElementById('log-entries'); logEntries.innerHTML = ''; log.forEach(entry => { const row = ` ${entry.club} ${entry.distance} ${entry.date} ${entry.conditions} `; logEntries.innerHTML += row; }); } function calculateAverage() { const clubDistances = {}; log.forEach(entry => { if (!clubDistances[entry.club]) { clubDistances[entry.club] = []; } clubDistances[entry.club].push(entry.distance); }); const averageOutput = document.getElementById('average-output'); averageOutput.innerHTML = ''; for (const club in clubDistances) { const distances = clubDistances[club]; const average = (distances.reduce((a, b) => a + b, 0) / distances.length).toFixed(2); averageOutput.innerHTML += `

${club}: ${average} yards

`; } }