commit

Author: alanfox2000software

bible/script.js

@@ -29,13 +29,17 @@ async function loadBookData(bookFile) {
 }
 
 async function loadBook(bookFile) {
-    bookData = await loadBookData(bookFile);
-    currentBook = Object.keys(bookData)[0];
-    currentChapter = Object.keys(bookData[currentBook])[0];
-    
-    document.getElementById('navigation').style.display = 'flex';
-    updateChapterNavigation();
-    loadChapter(currentChapter);
+    try {
+        bookData = await loadBookData(bookFile);
+        currentBook = Object.keys(bookData)[0];
+        currentChapter = Object.keys(bookData[currentBook])[0];
+        
+        document.getElementById('navigation').style.display = 'flex';
+        updateChapterNavigation();
+        loadChapter(currentChapter);
+    } catch (error) {
+        console.error("Failed to load book:", error);
+    }
 }
 
 function updateChapterNavigation() {
@@ -102,5 +106,31 @@ window.addEventListener('resize', () => {
     }
 });
 
-// Initialize the app
-initBooks(); // Critical missing line added
+// Load Genesis by default
+window.addEventListener('DOMContentLoaded', async () => {
+    // Find Genesis in book manifest
+    const genesisBook = bookManifest.find(b => b.name === "Genesis");
+    
+    if (genesisBook) {
+        await loadBook(genesisBook.file);
+        
+        // Close mobile sidebar after loading
+        if (window.innerWidth < 768) {
+            document.getElementById('sidebar').style.left = '-100%';
+        }
+    }
+});
+
+// Initialize books and load Genesis
+function initApp() {
+    initBooks();
+    
+    // Load Genesis after slight delay to ensure DOM is ready
+    setTimeout(async () => {
+        const genesis = bookManifest.find(b => b.name === "Genesis");
+        if (genesis) await loadBook(genesis.file);
+    }, 100);
+}
+
+// Start the app
+initApp();

bible/styles.css

@@ -18,6 +18,18 @@ body {
     -webkit-tap-highlight-color: transparent;
 }
 
+@media (max-width: 767px) {
+    .main-content {
+        padding-top: 20px !important;
+    }
+    
+    #mobile-menu {
+        top: 4px;
+        left: 4px;
+        padding: 6px 12px;
+    }
+}
+
 #mobile-menu {
     display: block;
     position: fixed;