fix: web interface improvments

static/index.html

@@ -133,8 +133,8 @@
                             <tr>
                                 <th>Title</th>
                                 <th>IMDb ID</th>
-                                <th>Released</th>
-                                <th>Date Added</th>
+                                <th>Movie Released</th>
+                                <th>Date Added to Library</th>
                                 <th>Source</th>
                                 <th>Date Type</th>
                                 <th>Video File</th>

static/js/app.js

@@ -245,6 +245,9 @@ function updateMoviesTable(data) {
                     <button class="btn btn-sm btn-primary" onclick="editMovie('${movie.imdb_id}', '${dateadded}', '${movie.source || ''}')">
                         <i class="fas fa-edit"></i> Edit
                     </button>
+                    <button class="btn btn-sm btn-secondary" onclick="debugMovie('${movie.imdb_id}')" title="Debug Data">
+                        <i class="fas fa-bug"></i>
+                    </button>
                 </td>
             </tr>
         `;
@@ -591,7 +594,13 @@ function closeSmartFixModal() {
 }
 
 async function applySmartFix(mediaType, options) {
-    const selectedIndex = document.querySelector('input[name="date-option"]:checked').value;
+    const selectedRadio = document.querySelector('input[name="date-option"]:checked');
+    if (!selectedRadio) {
+        showToast('Please select a date option', 'warning');
+        return;
+    }
+    
+    const selectedIndex = selectedRadio.value;
     const selectedOption = options.options[selectedIndex];
     
     let dateadded = selectedOption.date;
@@ -601,11 +610,37 @@ async function applySmartFix(mediaType, options) {
     if (selectedOption.type === 'manual') {
         const manualDateInput = document.getElementById(`manual-date-${selectedIndex}`);
         if (manualDateInput && manualDateInput.value) {
-            dateadded = new Date(manualDateInput.value).toISOString();
+            try {
+                dateadded = new Date(manualDateInput.value).toISOString();
+            } catch (e) {
+                showToast('Invalid date format', 'error');
+                return;
+            }
         } else {
             showToast('Please enter a date for manual option', 'warning');
             return;
         }
+    } else if (dateadded) {
+        // Fix date format for non-manual options
+        try {
+            let dateValue = dateadded;
+            
+            // Handle timezone offsets
+            if (dateValue.includes('+00:00')) {
+                dateValue = dateValue.replace('+00:00', 'Z');
+            }
+            
+            const date = new Date(dateValue);
+            if (isNaN(date.getTime())) {
+                showToast('Invalid date from server', 'error');
+                return;
+            }
+            dateadded = date.toISOString();
+        } catch (e) {
+            console.error('Date conversion error:', e, dateadded);
+            showToast('Date conversion error', 'error');
+            return;
+        }
     }
     
     try {
@@ -617,6 +652,7 @@ async function applySmartFix(mediaType, options) {
         closeSmartFixModal();
     } catch (error) {
         console.error('Smart fix failed:', error);
+        showToast('Smart fix failed: ' + error.message, 'error');
     }
 }
 
@@ -832,11 +868,26 @@ function updateEditDateFromOption(optionIndex, option) {
     const sourceSelect = document.getElementById('edit-source');
     
     if (option.date) {
-        // Convert to datetime-local format
+        // Convert to datetime-local format with better date parsing
         try {
-            const date = new Date(option.date);
-            dateInput.value = date.toISOString().slice(0, 16);
+            let dateValue = option.date;
+            
+            // Handle timezone offsets by converting to local time
+            if (dateValue.includes('+00:00') || dateValue.includes('Z')) {
+                dateValue = dateValue.replace('+00:00', 'Z');
+            }
+            
+            const date = new Date(dateValue);
+            if (isNaN(date.getTime())) {
+                console.error('Invalid date:', dateValue);
+                dateInput.value = '';
+            } else {
+                // Convert to local datetime-local format
+                const localDateTime = new Date(date.getTime() - (date.getTimezoneOffset() * 60000));
+                dateInput.value = localDateTime.toISOString().slice(0, 16);
+            }
         } catch (e) {
+            console.error('Date parsing error:', e, option.date);
             dateInput.value = '';
         }
     } else {
@@ -857,8 +908,19 @@ async function handleEnhancedEditSubmit(event) {
     const dateadded = document.getElementById('edit-dateadded').value;
     const source = document.getElementById('edit-source').value;
     
-    // Convert datetime-local to ISO string
-    const isoDateadded = dateadded ? new Date(dateadded).toISOString() : null;
+    if (!dateadded) {
+        showToast('Please enter a date', 'warning');
+        return;
+    }
+    
+    // Convert datetime-local to ISO string with error handling
+    let isoDateadded = null;
+    try {
+        isoDateadded = new Date(dateadded).toISOString();
+    } catch (e) {
+        showToast('Invalid date format', 'error');
+        return;
+    }
     
     try {
         if (mediaType === 'movie') {
@@ -870,6 +932,7 @@ async function handleEnhancedEditSubmit(event) {
         closeModal();
     } catch (error) {
         console.error('Enhanced edit failed:', error);
+        showToast('Update failed: ' + error.message, 'error');
     }
 }
 
@@ -1024,4 +1087,36 @@ function showToast(message, type = 'info') {
             toast.parentNode.removeChild(toast);
         }
     });
+}
+
+// Debug function
+async function debugMovie(imdbId) {
+    try {
+        const data = await apiCall(`/api/debug/movie/${imdbId}/raw`);
+        
+        const debugInfo = `
+DEBUG INFO for ${imdbId}:
+
+Raw Database Data:
+- imdb_id: ${data.raw_data.imdb_id}
+- path: ${data.raw_data.path}
+- released: ${data.raw_data.released}
+- dateadded: ${data.raw_data.dateadded}
+- source: ${data.raw_data.source}
+- has_video_file: ${data.raw_data.has_video_file}
+- last_updated: ${data.raw_data.last_updated}
+
+Analysis:
+- Movie Released: ${data.raw_data.released || 'Not set'}
+- Library Import Date: ${data.raw_data.dateadded || 'Not set'}
+- Date Source: ${data.raw_data.source || 'Unknown'}
+        `;
+        
+        alert(debugInfo);
+        console.log('🔍 Debug data for', imdbId, data);
+        
+    } catch (error) {
+        console.error('Debug failed:', error);
+        showToast('Debug failed: ' + error.message, 'error');
+    }
 }