Extract inline CSS/JS, add EJS templates with shared layout

- Extract CSS into public/css/{shared,players,courses}.css - Extract JS into public/js/{chart,tooltips,progress,players,courses}.js - Consolidate 5 duplicated tooltip blocks into setupTooltip() helper - Add EJS view engine with layout partial and nav partial - Convert HTML pages to EJS templates (index.ejs, courses.ejs) - Add /courses route with redirect from /courses.html - Remove old monolithic HTML files (1478 + 612 lines)
2026-02-18 22:32:03 +01:00
parent 33a962e6b8
commit 20bbdbbfcf
18 changed files with 2010 additions and 2094 deletions
@@ -0,0 +1,101 @@
+function fetchRatingsWithProgress() {
+    const progressSection = document.getElementById('progress-section');
+    const progressBar = document.getElementById('progress-bar');
+    const progressText = document.getElementById('progress-text');
+    const tableDiv = document.getElementById('ratings-table');
+    
+    progressSection.style.display = 'block';
+    tableDiv.innerHTML = '';
+    
+    const eventSource = new EventSource('/api/ratings/progress');
+    
+    eventSource.onmessage = function(event) {
+        const data = JSON.parse(event.data);
+        
+        if (data.status === 'loading') {
+            const percentage = Math.round((data.current / data.total) * 100);
+            progressBar.style.width = `${percentage}%`;
+            progressBar.textContent = `${percentage}%`;
+            progressText.textContent = `Loading player ${data.current}/${data.total}: PDGA #${data.pdgaNumber}`;
+        } else if (data.status === 'completed') {
+            const percentage = Math.round((data.current / data.total) * 100);
+            progressBar.style.width = `${percentage}%`;
+            progressBar.textContent = `${percentage}%`;
+            progressText.textContent = `Loaded ${data.name} (${data.current}/${data.total})`;
+        } else if (data.status === 'error') {
+            const percentage = Math.round((data.current / data.total) * 100);
+            progressBar.style.width = `${percentage}%`;
+            progressBar.textContent = `${percentage}%`;
+            progressText.textContent = `Error loading PDGA #${data.pdgaNumber} (${data.current}/${data.total})`;
+        } else if (data.status === 'complete') {
+            progressSection.style.display = 'none';
+            displayRatings(data.ratings);
+            eventSource.close();
+        } else if (data.status === 'error') {
+            progressSection.style.display = 'none';
+            tableDiv.innerHTML = '<p>Error loading ratings. Please try again.</p>';
+            eventSource.close();
+        }
+    };
+    
+    eventSource.onerror = function() {
+        progressSection.style.display = 'none';
+        tableDiv.innerHTML = '<p>Connection error. Please refresh the page.</p>';
+        eventSource.close();
+    };
+}
+
+function loadAllPlayers() {
+    const button = document.getElementById('load-all-btn');
+    const originalText = button.textContent;
+    button.textContent = 'Loading...';
+    button.style.pointerEvents = 'none';
+    
+    try {
+        const progressSection = document.getElementById('progress-section');
+        const progressBar = document.getElementById('progress-bar');
+        const progressText = document.getElementById('progress-text');
+        const tableDiv = document.getElementById('ratings-table');
+        
+        progressSection.style.display = 'block';
+        tableDiv.innerHTML = '';
+        
+        const eventSource = new EventSource('/api/load-all-players');
+        
+        eventSource.onmessage = function(event) {
+            const data = JSON.parse(event.data);
+            
+            if (data.status === 'loading' || data.status === 'completed' || data.status === 'error') {
+                const percentage = Math.round((data.current / data.total) * 100);
+                progressBar.style.width = `${percentage}%`;
+                progressBar.textContent = `${percentage}%`;
+                
+                if (data.status === 'loading') {
+                    progressText.textContent = `Loading player ${data.current}/${data.total}: PDGA #${data.pdgaNumber}`;
+                } else if (data.status === 'completed') {
+                    progressText.textContent = `Loaded ${data.name} (${data.current}/${data.total})`;
+                } else if (data.status === 'error') {
+                    progressText.textContent = `Error loading PDGA #${data.pdgaNumber} (${data.current}/${data.total})`;
+                }
+            } else if (data.status === 'complete') {
+                progressSection.style.display = 'none';
+                displayRatings(data.ratings);
+                eventSource.close();
+                button.textContent = originalText;
+                button.style.pointerEvents = 'auto';
+            }
+        };
+        
+        eventSource.onerror = function() {
+            progressSection.style.display = 'none';
+            tableDiv.innerHTML = '<p>Connection error. Please refresh the page.</p>';
+            eventSource.close();
+            button.textContent = originalText;
+            button.style.pointerEvents = 'auto';
+        };
+    } catch (error) {
+        console.error('Error loading all players:', error);
+        button.textContent = originalText;
+        button.style.pointerEvents = 'auto';
+    }
+}