加载默认日志按钮

index.html

@@ -119,7 +119,7 @@
                         <i data-feather="download" class="mr-2"></i> Export
                     </button>
                     <button id="sampleButton" class="bg-purple-600 hover:bg-purple-700 text-white px-4 py-2 rounded-md flex items-center">
-                        <i data-feather="file-text" class="mr-2"></i> Sample Data
+                        <i data-feather="download" class="mr-2"></i> Load Sample Log
                     </button>
 </div>
 

script.js

@@ -441,42 +441,69 @@ function exportAnnotations() {
     link.click();
     document.body.removeChild(link);
 }
-function generateSampleLog() {
-    const frames = 100;
-    const rows = 40;
-    const cols = 70;
-    logData = [];
-    
-    for (let i = 0; i < frames; i++) {
-        const matrix = [];
-        for (let r = 0; r < rows; r++) {
-            const row = [];
-            for (let c = 0; c < cols; c++) {
-                row.push(Math.random() * 100);
+async function generateSampleLog() {
+    try {
+        // Show loading state
+        const sampleBtn = document.getElementById('sampleButton');
+        const originalText = sampleBtn.innerHTML;
+        sampleBtn.innerHTML = '<i data-feather="loader" class="animate-spin mr-2"></i> Loading Sample...';
+        feather.replace();
+
+        // Fetch sample log data from public API
+        const response = await fetch('https://raw.githubusercontent.com/loglens/sample-logs/main/frame_analysis_sample.log');
+        const content = await response.text();
+        
+        // Process the sample log
+        processLogContent(content);
+        
+        // Create some sample annotations
+        annotations = [
+            { id: 1, timestamp: 0.5, text: "Initialization complete", frameIndex: 5 },
+            { id: 2, timestamp: 3.2, text: "First peak detected", frameIndex: 32 },
+            { id: 3, timestamp: 7.8, text: "System warning", frameIndex: 78 }
+        ];
+        updateAnnotationsDisplay();
+
+        // Update file name display
+        document.getElementById('fileName').textContent = 'sample_frame_analysis.log';
+
+    } catch (error) {
+        console.error('Error loading sample log:', error);
+        alert('Failed to load sample log. Using generated data instead.');
+        
+        // Fallback to generated data
+        const frames = 100;
+        const rows = 40;
+        const cols = 70;
+        logData = [];
+        
+        for (let i = 0; i < frames; i++) {
+            const matrix = [];
+            for (let r = 0; r < rows; r++) {
+                const row = [];
+                for (let c = 0; c < cols; c++) {
+                    row.push(Math.random() * 100);
+                }
+                matrix.push(row);
             }
-            matrix.push(row);
+            
+            logData.push({
+                timestamp: i * 0.1,
+                matrix: matrix
+            });
         }
         
-        logData.push({
-            timestamp: i * 0.1,
-            matrix: matrix
-        });
+        updateLogInfo();
+        renderHeatmap();
+        updateTimeline();
+        currentFrameIndex = 0;
+        updateFrameDisplay();
+    } finally {
+        // Restore button state
+        const sampleBtn = document.getElementById('sampleButton');
+        sampleBtn.innerHTML = '<i data-feather="download" class="mr-2"></i> Load Sample Log';
+        feather.replace();
     }
-    
-    // Update UI
-    updateLogInfo();
-    renderHeatmap();
-    updateTimeline();
-    currentFrameIndex = 0;
-    updateFrameDisplay();
-    
-    // Create some sample annotations
-    annotations = [
-        { id: 1, timestamp: 0.5, text: "Initialization complete", frameIndex: 5 },
-        { id: 2, timestamp: 3.2, text: "First peak detected", frameIndex: 32 },
-        { id: 3, timestamp: 7.8, text: "System warning", frameIndex: 78 }
-    ];
-    updateAnnotationsDisplay();
 }
 function updateAnnotationsDisplay() {
     const annotationPanel = document.querySelector('custom-annotation-panel');