log to supabase

app/static/js/attacks.js

@@ -68,6 +68,8 @@ class AttackSimulator {
         }
     }
 
+
+
     switchTab(attackType) {
         // Update tab buttons
         document.querySelectorAll('.attack-tab').forEach(tab => {

app/static/js/main.js

@@ -22,6 +22,7 @@ async function initIdentity() {
   } catch {}
 }
 initIdentity();
+track('page_view', { path: location.pathname, title: document.title });
 
 function identify(user) {
   userContext = { ...userContext, ...{
@@ -87,6 +88,23 @@ class DPSGDExplorer {
 // Add view toggle listeners
         document.getElementById('view-epochs')?.addEventListener('click', () => this.switchView('epochs'));
         document.getElementById('view-iterations')?.addEventListener('click', () => this.switchView('iterations'));
+
+        document.getElementById('dataset-select')?.addEventListener('change', (e) => {
+            track('dataset_change', { dataset: e.target.value });
+        });
+
+        document.getElementById('model-select')?.addEventListener('change', (e) => {
+            track('model_change', { model_architecture: e.target.value });
+        });
+        document.getElementById('preset-high-privacy')?.addEventListener('click', () => {
+            track('preset_apply', { preset: 'high-privacy' });
+        });
+        document.getElementById('preset-balanced')?.addEventListener('click', () => {
+            track('preset_apply', { preset: 'balanced' });
+        });
+        document.getElementById('preset-high-utility')?.addEventListener('click', () => {
+            track('preset_apply', { preset: 'high-utility' });
+        });
     }
 
     initializeSliders() {
@@ -484,6 +502,14 @@ tab.addEventListener('click', () => {
         try {
             console.log('Starting training with parameters:', this.getParameters()); // Debug log
 
+            // === Analytics: training started ===
+            try {
+              track('train_start', {
+                ...this.getParameters(),
+                view: this.currentView
+              });
+            } catch (e) {}
+
             const response = await fetch('/api/train', {
                 method: 'POST',
                 headers: {
@@ -496,6 +522,17 @@ tab.addEventListener('click', () => {
             
             if (!response.ok) {
                 throw new Error(data.error || 'Unknown error occurred');
+                // === Analytics: training succeeded ===
+                try {
+                  track('train_success', {
+                    trainer_type: data.trainer_type,
+                    dataset: data.dataset,
+                    model_architecture: data.model_architecture,
+                    final_metrics: data.final_metrics,
+                    privacy_budget: data.privacy_budget,
+                    epochs: this.getParameters().epochs
+                  });
+                } catch (e) {}
             }
 
             console.log('Received training data:', data); // Debug log
@@ -504,6 +541,13 @@ tab.addEventListener('click', () => {
             this.updateCharts(data);
             this.updateResults(data);
         } catch (error) {
+            // === Analytics: training failed ===
+            try {
+              track('train_error', {
+                message: error.message || 'unknown',
+                params: this.getParameters()
+              });
+            } catch (e) {}
             console.error('Training error:', error);
             // Show error message to user
             const errorMessage = document.createElement('div');
@@ -516,6 +560,9 @@ tab.addEventListener('click', () => {
                 errorMessage.remove();
             }, 5000);
         } finally {
+            try {
+              track('train_end', { ended_at: Date.now() });
+            } catch (e) {}
             this.stopTraining();
         }
     }

app/templates/base.html

@@ -24,9 +24,27 @@
                 </div>
                 <nav>
                     <ul class="nav-list">
-                        <li><a href="{{ url_for('main.attacks') }}" class="nav-link {% if request.endpoint == 'main.attacks' %}active{% endif %}">Privacy Attacks</a></li>
-                        <li><a href="{{ url_for('main.learning') }}" class="nav-link {% if request.endpoint == 'main.learning' %}active{% endif %}">Learning Hub</a></li>
-                        <li><a href="{{ url_for('main.index') }}" class="nav-link {% if request.endpoint == 'main.index' %}active{% endif %}">Playground</a></li>
+                        <li>
+                            <a href="{{ url_for('main.attacks') }}"
+                               class="nav-link {% if request.endpoint == 'main.attacks' %}active{% endif %}"
+                               data-track="nav_attacks">
+                                Privacy Attacks
+                            </a>
+                        </li>
+                        <li>
+                            <a href="{{ url_for('main.learning') }}"
+                               class="nav-link {% if request.endpoint == 'main.learning' %}active{% endif %}"
+                               data-track="nav_learning">
+                                Learning Hub
+                            </a>
+                        </li>
+                        <li>
+                            <a href="{{ url_for('main.index') }}"
+                               class="nav-link {% if request.endpoint == 'main.index' %}active{% endif %}"
+                               data-track="nav_playground">
+                                Playground
+                            </a>
+                        </li>
                     </ul>
                 </nav>
             </div>
@@ -45,4 +63,8 @@
     <script src="{{ url_for('static', filename='js/main.js') }}"></script>
     {% block extra_scripts %}{% endblock %}
 </body>
-</html> 
+</html>
+
+<a ... class="nav-link" data-track="nav_attacks">Privacy Attacks</a>
+<a ... class="nav-link" data-track="nav_learning">Learning Hub</a>
+<a ... class="nav-link" data-track="nav_playground">Playground</a>

app/templates/learning.html

@@ -254,8 +254,14 @@ document.addEventListener('DOMContentLoaded', () => {
             // Show selected content
             const stepName = step.getAttribute('data-step');
             document.getElementById(`${stepName}-content`).classList.add('active');
+
+            // ✅ Analytics
+          if (typeof track === 'function') {
+            track('learning_step_open', { step: stepName });
+          }
         });
     });
 });
 </script>
-{% endblock %} 
+{% endblock %}
+