Update index.html

index.html

@@ -6,6 +6,9 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Google TTS Document Reader (BYOK)</title>
     <script src="https://cdn.tailwindcss.com"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.16.105/pdf.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/mammoth/1.4.21/mammoth.browser.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
     <style>
         /* Existing styles... */
@@ -557,8 +560,10 @@
             </div>
     </div>
 
-    <!-- PDF.js library for PDF support -->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.12.313/pdf.min.js"></script>
+    <!-- Required libraries for document processing -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.16.105/pdf.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/mammoth/1.4.21/mammoth.browser.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
     
     <script>
         document.addEventListener('DOMContentLoaded', () => {
@@ -1440,9 +1445,9 @@
                     loadVoices();
                 }
                 
-                // Set PDF.js worker path
+                // Set PDF.js worker path - Use CDN worker
                 if (typeof pdfjsLib !== 'undefined') {
-                    pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.12.313/pdf.worker.min.js';
+                    pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.16.105/pdf.worker.min.js';
                 }
                 
                 // Initialize AudioContext on user interaction
@@ -2789,14 +2794,21 @@
             // Enhanced PDF reader with progress
             function readPDFFile(file) {
                 if (typeof pdfjsLib === 'undefined') {
-                    showToast('PDF.js not loaded. Refreshing page...', 'error');
-                    setTimeout(() => window.location.reload(), 2000);
+                    showToast('PDF.js not loaded. Please refresh the page and try again.', 'error');
+                    documentContent.innerHTML = '<p class="text-gray-500 italic">PDF.js library not available.</p>';
+                    showFileProgress(file.name, 'error');
                     return;
                 }
                 
                 const fileURL = URL.createObjectURL(file);
                 
-                pdfjsLib.getDocument(fileURL).promise.then(pdf => {
+                // Get the document
+                const loadingTask = pdfjsLib.getDocument({
+                    url: fileURL,
+                    verbosity: 0 // Reduce console logging
+                });
+                
+                loadingTask.promise.then(pdf => {
                     let text = '';
                     const numPages = pdf.numPages;
                     const pagePromises = [];
@@ -2819,7 +2831,15 @@
                                         <p class="text-xs text-gray-400 mt-2">${pagesProcessed}/${numPages} pages</p>
                                     </div>
                                 `;
-                                return textContent.items.map(item => item.str).join(' ');
+                                
+                                // Extract text items and join them
+                                return textContent.items.map(item => {
+                                    // Handle different item types
+                                    if (item.str) {
+                                        return item.str;
+                                    }
+                                    return '';
+                                }).join(' ');
                             });
                         }));
                     }
@@ -2838,7 +2858,7 @@
                     });
                 }).catch(error => {
                     console.error('Error loading PDF:', error);
-                    showToast('Failed to load PDF file', 'error');
+                    showToast('Failed to load PDF file: ' + error.message, 'error');
                     URL.revokeObjectURL(fileURL);
                     showFileProgress(file.name, 'error');
                 });
@@ -2846,24 +2866,69 @@
             
             // Word document reader (.doc/.docx)
             function readWordDocument(file) {
+                // Check if mammoth is available
+                if (typeof mammoth === 'undefined') {
+                    showToast('Mammoth.js not loaded. Please refresh the page and try again.', 'error');
+                    documentContent.innerHTML = '<p class="text-gray-500 italic">Mammoth.js library not available for Word documents.</p>';
+                    showFileProgress(file.name, 'error');
+                    return;
+                }
+                
                 const reader = new FileReader();
                 reader.onload = async (e) => {
                     try {
+                        showFileProgress(file.name, 'processing');
+                        
                         // Use mammoth to convert docx to text
-                        const result = await mammoth.extractRawText({arrayBuffer: e.target.result});
-                        setDocumentContent(result.value);
+                        const options = {
+                            convertImage: mammoth.images.ignoreImages // Ignore images for TTS
+                        };
+                        
+                        const result = await mammoth.extractRawText({
+                            arrayBuffer: e.target.result
+                        }, options);
                         
-                        if (result.messages.length > 0) {
+                        if (result.value && result.value.trim()) {
+                            setDocumentContent(result.value);
+                            showFileProgress(file.name, 'success');
+                            showToast(`Loaded Word document: ${file.name}`, 'success');
+                        } else {
+                            showToast('No text content found in Word document', 'error');
+                            documentContent.innerHTML = '<p class="text-gray-500 italic">No readable text found in document.</p>';
+                            showFileProgress(file.name, 'error');
+                        }
+                        
+                        // Log any warnings
+                        if (result.messages && result.messages.length > 0) {
                             console.warn('Word processing warnings:', result.messages);
+                            // Show non-error messages as info
+                            const nonErrorMessages = result.messages.filter(m => m.type !== 'error');
+                            if (nonErrorMessages.length > 0) {
+                                showToast(`Processed with ${nonErrorMessages.length} warnings. Check console for details.`, 'success', 3000);
+                            }
                         }
                     } catch (error) {
                         console.error('Error reading Word document:', error);
-                        showToast('Error reading Word document. Please try saving as a different format.', 'error');
+                        
+                        // Provide more specific error messages
+                        let errorMessage = 'Error reading Word document.';
+                        if (error.message.includes('Unsupported file format')) {
+                            errorMessage = 'Unsupported Word format. Please use .docx format.';
+                        } else if (error.message.includes('corrupted')) {
+                            errorMessage = 'Document appears to be corrupted. Please try saving it again.';
+                        }
+                        
+                        showToast(errorMessage, 'error');
+                        documentContent.innerHTML = '<p class="text-gray-500 italic">Error loading Word document. Please try a different format.</p>';
+                        showFileProgress(file.name, 'error');
                     }
                 };
+                
                 reader.onerror = () => {
-                    showToast('Error reading Word document', 'error');
+                    showToast('Error reading file', 'error');
+                    showFileProgress(file.name, 'error');
                 };
+                
                 reader.readAsArrayBuffer(file);
             }