Add ability to name the CSV file

src/assets/js/test.js

@@ -90,13 +90,18 @@ function downloadCSV() {
     for (const player in playerStats) {
         csv += `${player},${playerStats[player].assists},${playerStats[player].goals},${playerStats[player].blocks}\n`;
     }
-
+    const fileName = document.getElementById('fileName').value
     const blob = new Blob([csv], { type: 'text/csv' });
     const url = URL.createObjectURL(blob);
     const a = document.createElement('a');
     a.setAttribute('hidden', '');
     a.setAttribute('href', url);
-    a.setAttribute('download', 'player_stats.csv');
+    if (!fileName){
+        a.setAttribute('download', 'player_stats.csv');
+    }
+    else {
+        a.setAttribute('download', fileName)
+    }
     document.body.appendChild(a);
     a.click();
     document.body.removeChild(a);

src/index.vto

@@ -21,7 +21,6 @@ title: Fris Stats
 </div>
 
 <h2>Player Stats Table</h2>
-<button onclick="downloadCSV()">Download as CSV</button>
 <table id="statsTable">
     <thead>
         <tr>
@@ -35,5 +34,8 @@ title: Fris Stats
     <tbody>
     </tbody>
 </table>
-
+<form id="csvName">
+        <label for="fileName">Enter a filename (e.g. game_1_leeds_open):</label>
+        <input type="text" id="fileName" name="fileName" required>
+<button onclick="downloadCSV()">Download as CSV</button>
 <script src="assets/js/test.js"></script>