Update script.js

script.js

@@ -0,0 +1,43 @@
+document.addEventListener('DOMContentLoaded', () => {
+    const tableBody = document.getElementById('dataTable');
+    const sentimentFilter = document.getElementById('sentimentFilter');
+
+    // Load CSV data
+    fetch('data.csv')
+        .then(response => response.text())
+        .then(data => {
+            const rows = data.trim().split('\n').slice(1); // Skip header
+            const dataset = rows.map(row => {
+                const [index, text, label] = row.split(/,(?=(?:(?:[^"]*"){2})*[^"]*$)/);
+                return { index: parseInt(index), text: text.replace(/^"|"$/g, ''), label: label.replace(/^"|"$/g, '') };
+            });
+
+            // Display data
+            function displayData(filter = 'all') {
+                tableBody.innerHTML = '';
+                dataset.forEach(item => {
+                    if (filter === 'all' || item.label === filter) {
+                        const row = document.createElement('tr');
+                        row.innerHTML = `
+                            <td>${item.index}</td>
+                            <td>${item.text}</td>
+                            <td>${item.label}</td>
+                        `;
+                        tableBody.appendChild(row);
+                    }
+                });
+            }
+
+            // Initial display
+            displayData();
+
+            // Filter event listener
+            sentimentFilter.addEventListener('change', () => {
+                displayData(sentimentFilter.value);
+            });
+        })
+        .catch(error => {
+            console.error('Error loading data:', error);
+            tableBody.innerHTML = '<tr><td colspan="3">Error loading dataset.</td></tr>';
+        });
+});