-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
1 lines (1 loc) · 37.1 KB
/
index.html
File metadata and controls
1 lines (1 loc) · 37.1 KB
1
<!-- // Provinent Scripture Study - Bible study web application // Copyright (C) 2025 Jordan DiPasquale // // This program is free software: you can redistribute it and/or modify // it under the terms of the GNU General Public License version 3 as // published by the Free Software Foundation. // // This program is distributed in the hope that it will be useful, // but WITHOUT ANY WARRANTY; without even the implied warranty of // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the // GNU General Public License for more details. --> <!DOCTYPE html> <html lang="en-US"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"> <title>Provinent Scripture Study</title> <link rel="preconnect" href="https://cdnjs.cloudflare.com"> <link rel="preconnect" href="https://cdn.jsdelivr.net"> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="icon" type="image/svg+xml" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3ClinearGradient id='grad' x1='0%25' y1='0%25' x2='100%25' y2='100%25'%3E%3Cstop offset='0%25' style='stop-color:%232c3e50;stop-opacity:1' /%3E%3Cstop offset='100%25' style='stop-color:%233498db;stop-opacity:1' /%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='100' height='100' rx='15' fill='url(%23grad)'/%3E%3Cpath d='M30 25 L30 75 L50 65 L70 75 L70 25 Z' fill='%23f8f8f8' stroke='%23d4af37' stroke-width='2'/%3E%3Cline x1='40' y1='35' x2='60' y2='35' stroke='%232c3e50' stroke-width='1.5'/%3E%3Cline x1='40' y1='45' x2='60' y2='45' stroke='%232c3e50' stroke-width='1.5'/%3E%3Cline x1='40' y1='55' x2='60' y2='55' stroke='%232c3e50' stroke-width='1.5'/%3E%3Cline x1='35' y1='60' x2='65' y2='40' stroke='%23c8b072' stroke-width='2.5'/%3E%3Cline x1='35' y1='40' x2='65' y2='60' stroke='%23c8b072' stroke-width='2.5'/%3E%3C/svg%3E" aria-label="Bible with Cross Icon"> <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.11.174/pdf.min.js" defer></script> <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js" defer></script> <link rel="stylesheet" href="styles.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> </head> <body> <div class="welcome-screen" id="welcomeScreen"> <div class="welcome-content"> <div class="feature-icon" aria-hidden="true"><i class="fas fa-bible"></i></div> <h1>Welcome to Provinent Scripture Study!</h1> <p>A comprehensive Bible study companion with daily passages, notes, and powerful study tools.</p> <div class="feature-grid"> <div class="feature-card"> <div class="feature-icon" aria-hidden="true"><i class="fas fa-book-open"></i></div> <h3>Daily Passages</h3> <p>Get a new scripture passage every day with sequential or specific book reading plans.</p> </div> <div class="feature-card"> <div class="feature-icon" aria-hidden="true"><i class="fas fa-edit"></i></div> <h3>Highlight & Annotate</h3> <p>Right‑click verses to highlight in colors. Take notes with full markdown support.</p> </div> <div class="feature-card"> <div class="feature-icon" aria-hidden="true"><i class="fas fa-language"></i></div> <h3>Original Languages</h3> <p>Click any verse to access Strong's Concordance, Greek/Hebrew interlinear, and more.</p> </div> <div class="feature-card"> <div class="feature-icon" aria-hidden="true"><i class="fas fa-balance-scale"></i></div> <h3>Reference Bible</h3> <p>Open a side‑by‑side reference panel to compare translations while you study.</p> </div> <div class="feature-card"> <div class="feature-icon" aria-hidden="true"><i class="fas fa-save"></i></div> <h3>Export & Import</h3> <p>Save your highlights and notes. Import/export your data anytime.</p> </div> <div class="feature-card"> <div class="feature-icon" aria-hidden="true"><i class="fas fa-hdd"></i></div> <h3>Offline Mode</h3> <p>Upload a PDF Bible to read and take notes while offline.</p> </div> </div> <div class="offline-setup"> <h2><span aria-hidden="true"><div><i class="fas fa-hdd"></i></div></span> Optional: Upload a PDF to View Offline</h2> <p style="margin-bottom: 15px;"> You can upload a free Berean Standard Bible PDF. This is entirely optional – you can skip this and use the online version. </p> <div class="pdf-download-options"> <h4>1. Download a Berean Bible PDF (choose one):</h4> <a href="https://bereanbible.com/bsb-book-9.5.pdf" class="pdf-download-link" target="_blank" rel="noopener noreferrer" download> <div><i class="fas fa-download" aria-hidden="true"></i> BSB Standard Print (9.5pt) – Recommended</div> </a> <a href="https://bereanbible.com/bsb-vbv-book-9.5.pdf" class="pdf-download-link" target="_blank" rel="noopener noreferrer" download> <div><i class="fas fa-download" aria-hidden="true"></i> BSB Standard Print, verse‑by‑verse (9.5pt)</div> </a> <a href="https://bereanbible.com/bsb-book-11.pdf" class="pdf-download-link" target="_blank" rel="noopener noreferrer" download> <div><i class="fas fa-download" aria-hidden="true"></i> BSB Large Print (11pt)</div> </a> <a href="https://bereanbible.com/bsb-vbv-book-11.pdf" class="pdf-download-link" target="_blank" rel="noopener noreferrer" download> <div><i class="fas fa-download" aria-hidden="true"></i> BSB Large Print, verse‑by‑verse (11pt)</div> </a> </div> <h4 style="margin-top: 15px; margin-bottom: 10px;"> 2. Upload the downloaded PDF here: </h4> <div class="pdf-upload-area" id="welcomePdfUploadArea" role="button" aria-labelledby="welcomeUploadText"> <div aria-hidden="true"><i class="fas fa-upload"></i></div> <p id="welcomeUploadText">Click to select your downloaded PDF</p> <small>Or drag and drop here</small> </div> <input type="file" id="welcomePdfUpload" aria-describedby="welcomeUploadText" style="display: none;" accept=".pdf"> </div> <div class="welcome-actions"> <button class="btn-primary" id="getStartedBtn">Get Started!</button> </div> </div> </div> <div class="loading-overlay" id="loadingOverlay" aria-hidden="true" aria-label="Loading"> <div class="loading-spinner"></div> </div> <div class="container" id="mainContainer"> <aside class="sidebar" id="sidebar"> <button class="collapse-toggle" title="Collapse Sidebar" aria-label="Collapse sidebar"></button> <h2>Bible Study Resources</h2> <form id="bibleGatewayForm" action="https://www.biblegateway.com/quicksearch/" target="_blank" method="GET"> <input type="hidden" name="version" id="bgVersion" value="NASB1995" /> <div style="border: 1px solid #600; border-radius: 4px; overflow: hidden;"> <div style="background-color: #600; color:#fff; text-align: center; padding: 8px 10px; font-weight: bold;"> Lookup a word or passage in the Bible </div> <div style="background-color: #fff; text-align: center; padding: 15px 10px;"> <div style="margin-bottom: 10px;"> <input style="margin:5px; padding: 6px; border: 1px solid #ccc; border-radius: 3px; width: 200px;" type="text" name="quicksearch" placeholder="Enter search terms" /><br /> <input style="margin:5px; padding: 6px 12px; background-color: #600; color: white; border: none; border-radius: 3px; cursor: pointer;" type="submit" value="Search BibleGateway.com" /><br /> </div> <a href="https://www.biblegateway.com/" title="The Bible in multiple languages, versions, and formats" target="_blank"> <img src="https://www.biblegateway.com/assets/images/logos/bglogo_sm.gif?103106" width="146" height="44" alt="BibleGateway.com" border="0" /> </a><br /> <small style="color: #666666;"> <a href="https://www.biblegateway.com/usage/form/" target="_blank" style="color: #40a1f0; text-decoration: none;"> About </a><br /> </small> </div> </div> </form> <button class="reference-panel-toggle" id="referencePanelToggle"> Open Reference Bible </button> <div class="sidebar-section"> <div class="sidebar-section-header" data-section="bibles"> <h3>Online Bibles</h3> <span class="section-toggle" aria-hidden="true">▼</span> </div> <div class="sidebar-section-content" id="content-bibles"> <ul class="sidebar-links"> <li><a href="https://www.bible.com" target="_blank" rel="noopener noreferrer">Bible (YouVersion)</a></li> <li><a href="https://www.bibleref.com" target="_blank" rel="noopener noreferrer">BibleRef</a></li> <li><a href="https://www.biblegateway.com" target="_blank" rel="noopener noreferrer">Bible Gateway</a></li> <li><a href="https://biblehub.com" target="_blank" rel="noopener noreferrer">Bible Hub (.com)</a></li> <li><a href="https://biblewebapp.com" target="_blank" rel="noopener noreferrer">Bible Web App</a></li> <li><a href="https://ebible.com" target="_blank" rel="noopener noreferrer">eBible (.com)</a></li> <li><a href="https://ebible.org" target="_blank" rel="noopener noreferrer">eBible (.org)</a></li> <li><a href="https://www.esv.org" target="_blank" rel="noopener noreferrer">ESV Bible</a></li> <li><a href="https://netbible.org" target="_blank" rel="noopener noreferrer">NET Bible</a></li> <li><a href="https://relight.app" target="_blank" rel="noopener noreferrer">Relight App</a></li> <li><a href="https://www.stepbible.org" target="_blank" rel="noopener noreferrer">STEP Bible</a></li> </ul> </div> </div> <div class="sidebar-section"> <div class="sidebar-section-header" data-section="doctrines"> <h3>Christian Doctrine</h3> <span class="section-toggle" aria-hidden="true">▼</span> </div> <div class="sidebar-section-content" id="content-doctrines"> <ul class="sidebar-links"> <li><a href="https://www.desiringgod.org/articles/what-is-the-doctrine-of-the-trinity" target="_blank" rel="noopener noreferrer">The Trinity</a></li> <li><a href="https://www.gotquestions.org/foreknowledge.html" target="_blank" rel="noopener noreferrer">Doctrine of Foreknowledge</a></li> <li><a href="https://www.gotquestions.org/predestination.html" target="_blank" rel="noopener noreferrer">Doctrine of Predestination</a></li> <li><a href="https://www.thegospelcoalition.org/essay/the-doctrine-of-justification/" target="_blank" rel="noopener noreferrer">Doctrine of Justification</a></li> <li><a href="https://www.thegospelcoalition.org/essay/the-doctrine-of-imputation/" target="_blank" rel="noopener noreferrer">Doctrine of Imputation</a></li> <li><a href="https://learn.ligonier.org/guides/regeneration" target="_blank" rel="noopener noreferrer">Doctrine of Regeneration</a></li> <li><a href="https://www.gotquestions.org/Christian-doctrine-salvation.html" target="_blank" rel="noopener noreferrer">Doctrine of Salvation</a></li> <li><a href="https://www.thegospelcoalition.org/essay/the-doctrine-of-sanctification/" target="_blank" rel="noopener noreferrer">Doctrine of Sanctification</a></li> <li><a href="https://www.thegospelcoalition.org/essay/the-five-solas/" target="_blank" rel="noopener noreferrer">The Five Solas</a></li> <li><a href="https://reasonabletheology.org/five-points-calvinism-defining-doctrines-of-grace/" target="_blank" rel="noopener noreferrer">Doctrines of Grace</a></li> <li><a href="https://learn.ligonier.org/articles/what-is-total-depravity" target="_blank" rel="noopener noreferrer">Doctrine of Total Depravity</a></li> <li><a href="https://learn.ligonier.org/articles/what-is-unconditional-election" target="_blank" rel="noopener noreferrer">Doctrine of Election</a></li> <li><a href="https://learn.ligonier.org/articles/what-was-gods-purpose-cross" target="_blank" rel="noopener noreferrer">Doctrine of Limited Atonement</a></li> <li><a href="https://learn.ligonier.org/articles/what-is-irresistible-grace" target="_blank" rel="noopener noreferrer">Doctrine of Irresistible Grace</a></li> <li><a href="https://learn.ligonier.org/articles/what-is-perseverance-of-the-saints" target="_blank" rel="noopener noreferrer">Doctrine of Perseverance</a></li> <li><a href="https://www.monergism.com/legacy/mt/sitepages/what-monergism" target="_blank" rel="noopener noreferrer">Doctrine of Monergism</a></li> </ul> </div> </div> <div class="sidebar-section"> <div class="sidebar-section-header" data-section="studyTopics"> <h3>Study Topics and FAQs</h3> <span class="section-toggle" aria-hidden="true">▼</span> </div> <div class="sidebar-section-content" id="content-studyTopics"> <ul class="sidebar-links"> <li><a href="https://learn.ligonier.org/articles/what-does-it-mean-that-god-is-sovereign" target="_blank" rel="noopener noreferrer">What does it mean that God is sovereign?</a></li> <li><a href="https://www.gty.org/sermons/80-356/the-atonement-real-or-potential" target="_blank" rel="noopener noreferrer">The Atonement: Real or Potential?</a></li> <li><a href="https://www.gty.org/articles/A331/What-Is-the-Doctrine-of-Election" target="_blank" rel="noopener noreferrer">What is the Doctrine of Election?</a></li> <li><a href="https://www.desiringgod.org/articles/a-beginners-guide-to-free-will" target="_blank" rel="noopener noreferrer">A Beginner's Guide to 'Free Will'</a></li> <li><a href="https://www.gotquestions.org/predestination-vs-free-will.html" target="_blank" rel="noopener noreferrer">What does the Bible say about predestination vs. free will?</a></li> <li><a href="https://www.monergism.com/reformation-theology/blog/what-about-john-316" target="_blank" rel="noopener noreferrer">What about John 3:16?</a></li> <li><a href="https://www.gotquestions.org/arminianism.html" target="_blank" rel="noopener noreferrer">What is Arminianism, and is it biblical?</a></li> <li><a href="https://www.gotquestions.org/calvinism.html" target="_blank" rel="noopener noreferrer">What is Calvinism and is it biblical?</a></li> <li><a href="https://www.thegospelcoalition.org/essay/reformed-theology/" target="_blank" rel="noopener noreferrer">What is Reformed Theology?</a></li> <li><a href="https://carm.org/chronological-list-of-major-english-bible-translations" target="_blank" rel="noopener noreferrer">Chronological List of Major English Bible Translations</a></li> <li><a href="https://www.biblegateway.com/learn/bible-101/about-the-bible/bible-versions-guide/" target="_blank" rel="noopener noreferrer">Why are there so many Bible versions?</a></li> <li><a href="https://www.equip.org/articles/is-your-modern-translation-corrupt/" target="_blank" rel="noopener noreferrer">Is your modern translation corrupt?</a></li> <li><a href="https://carm.org/kjvo" target="_blank" rel="noopener noreferrer">What is King James Onlyism?</a></li> <li><a href="https://biblehub.com/q/what_is_textual_criticism.htm" target="_blank" rel="noopener noreferrer">What is textual criticism?</a></li> <li><a href="https://carm.org/what-are-election-and-predestination" target="_blank" rel="noopener noreferrer">What are election and predestination?</a></li> <li><a href="https://www.gotquestions.org/monergism-and-salvation.html" target="_blank" rel="noopener noreferrer">What is monergism?</a></li> <li><a href="https://www.gotquestions.org/synergism-and-salvation.html" target="_blank" rel="noopener noreferrer">What is synergism?</a></li> <li><a href="https://www.gotquestions.org/exegesis-eisegesis.html" target="_blank" rel="noopener noreferrer">What is the difference between exegesis and eisegesis?</a></li> <li><a href="https://www.blueletterbible.org/Comm/stewart_don/faq/bible-translations/question6-what-is-an-interlinear-bible.cfm" target="_blank" rel="noopener noreferrer">What is an interlinear Bible?</a></li> <li><a href="https://www.desiringgod.org/articles/what-is-the-apocrypha" target="_blank" rel="noopener noreferrer">What is the Apocrypha?</a></li> </ul> </div> </div> <div class="sidebar-section"> <div class="sidebar-section-header" data-section="theological"> <h3>Theological Resources</h3> <span class="section-toggle" aria-hidden="true">▼</span> </div> <div class="sidebar-section-content" id="content-theological"> <ul class="sidebar-links"> <li><a href="https://www.monergism.com/thethreshold/sdg/luther/Bondage%20of%20the%20Will%20-%20Martin%20Luther.pdf" target="_blank" rel="noopener noreferrer">Bondage of the Will by Martin Luther</a></li> <li><a href="https://www.aomin.org" target="_blank" rel="noopener noreferrer">Alpha & Omega Ministries</a></li> <li><a href="https://answersingenesis.org" target="_blank" rel="noopener noreferrer">Answers in Genesis</a></li> <li><a href="https://biblethinker.org" target="_blank" rel="noopener noreferrer">BibleThinker</a></li> <li><a href="https://carm.org" target="_blank" rel="noopener noreferrer">CARM</a></li> <li><a href="https://www.equip.org" target="_blank" rel="noopener noreferrer">Christian Research Institute</a></li> <li><a href="https://www.desiringgod.org" target="_blank" rel="noopener noreferrer">Desiring God</a></li> <li><a href="https://www.gotquestions.org" target="_blank" rel="noopener noreferrer">Got Questions</a></li> <li><a href="https://www.thegospelcoalition.org" target="_blank" rel="noopener noreferrer">The Gospel Coalition</a></li> <li><a href="https://www.ligonier.org" target="_blank" rel="noopener noreferrer">Ligonier Ministries</a></li> <li><a href="https://www.monergism.com" target="_blank" rel="noopener noreferrer">Monergism</a></li> <li><a href="https://reasonabletheology.org" target="_blank" rel="noopener noreferrer">Reasonable Theology</a></li> <li><a href="https://www.voddiebaucham.org" target="_blank" rel="noopener noreferrer">Voddie Baucham Ministries</a></li> </ul> </div> </div> <div class="sidebar-section"> <div class="sidebar-section-header" data-section="podcasts"> <h3>Podcasts</h3> <span class="section-toggle" aria-hidden="true">▼</span> </div> <div class="sidebar-section-content" id="content-podcasts"> <ul class="sidebar-links"> <li><a href="https://www.aomin.org/aoblog/webcast" target="_blank" rel="noopener noreferrer">Alpha & Omega Ministries Podcasts</a></li> <li><a href="https://www.desiringgod.org/podcasts" target="_blank" rel="noopener noreferrer">Desiring God Podcasts</a></li> <li><a href="https://www.gty.org/radio-broadcast" target="_blank" rel="noopener noreferrer">Grace to You Radio Broadcast</a></li> <li><a href="https://www.ligonier.org/podcasts/renewing-your-mind" target="_blank" rel="noopener noreferrer">Renewing Your Mind with R.C. Sproul</a></li> </ul> </div> </div> <div class="sidebar-section"> <div class="sidebar-section-header" data-section="devotionals"> <h3>Devotionals</h3> <span class="section-toggle" aria-hidden="true">▼</span> </div> <div class="sidebar-section-content" id="content-devotionals"> <ul class="sidebar-links"> <li><a href="https://spurgeonsmorningandevening.org" target="_blank" rel="noopener noreferrer">C.H. Spurgeon's Morning and Evening</a></li> <li><a href="https://www.desiringgod.org/solid-joys" target="_blank" rel="noopener noreferrer">Desiring God Devotionals</a></li> <li><a href="https://www.gty.org/devotionals" target="_blank" rel="noopener noreferrer">Grace to You Devotionals</a></li> <li><a href="https://www.ligonier.org/learn/devotionals" target="_blank" rel="noopener noreferrer">Ligonier Ministries Devotionals</a></li> <li><a href="https://www.studylight.org/reading-plans.html" target="_blank" rel="noopener noreferrer">Bible Reading Plans</a></li> <li><a href="https://biblereadingplangenerator.com" target="_blank" rel="noopener noreferrer">Bible Reading Plan Generator</a></li> </ul> </div> </div> <div class="sidebar-section"> <div class="sidebar-section-header" data-section="studyTools"> <h3>Study Tools</h3> <span class="section-toggle" aria-hidden="true">▼</span> </div> <div class="sidebar-section-content" id="content-studyTools"> <ul class="sidebar-links"> <li><a href="https://andbible.org" target="_blank" rel="noopener noreferrer">AndBible: Bible Study</a></li> <li><a href="https://apologist.ai/en" target="_blank" rel="noopener noreferrer">Apologist.ai</a></li> <li><a href="https://dbs.org/en/bibles/audio/" target="_blank" rel="noopener noreferrer">Audio Bibles (DBS)</a></li> <li><a href="https://berean.ai" target="_blank" rel="noopener noreferrer">Berean.ai</a></li> <li><a href="https://biblehub.net" target="_blank" rel="noopener noreferrer">Bible Hub (.net)</a></li> <li><a href="https://www.bibletools.org" target="_blank" rel="noopener noreferrer">BibleTools</a></li> <li><a href="https://dbs.org/en/bibles/" target="_blank" rel="noopener noreferrer">The Bible Cloud (DBS)</a></li> <li><a href="https://www.blueletterbible.org/resources/prefaces.cfm" target="_blank" rel="noopener noreferrer">Bible Prefaces (BLB)</a></li> <li><a href="https://openbible.com" target="_blank" rel="noopener noreferrer">Open Bible</a></li> <li><a href="https://biblehub.com/strongs.htm" target="_blank" rel="noopener noreferrer">Strong's Exhaustive Concordance</a></li> </ul> </div> </div> <div class="sidebar-section"> <div class="sidebar-section-header" data-section="commentaries"> <h3>Commentaries</h3> <span class="section-toggle" aria-hidden="true">▼</span> </div> <div class="sidebar-section-content" id="content-commentaries"> <ul class="sidebar-links"> <li><a href="https://bestcommentaries.com" target="_blank" rel="noopener noreferrer">Best Commentaries</a></li> <li><a href="https://biblehub.com/commentaries" target="_blank" rel="noopener noreferrer">Bible Hub Commentaries</a></li> <li><a href="https://www.studylight.org/commentaries" target="_blank" rel="noopener noreferrer">Study Light</a></li> </ul> </div> </div> </aside> <div class="reference-panel" id="referencePanel"> <button class="collapse-toggle" title="Collapse Reference Panel" aria-label="Collapse reference panel"></button> <div class="reference-panel-header"> <h3>Reference Bible</h3> <div class="reference-panel-controls"> <label for="referenceSource" class="sr-only">Reference Source</label> <select id="referenceSource"> <option value="biblegateway">Bible Gateway</option> <option value="biblecom">Bible.com (YouVersion)</option> <option value="biblehub">Bible Hub</option> <option value="stepbible">STEP Bible</option> <option value="ebibleorg">eBible.org</option> <option value="pdf">Custom PDF (Offline)</option> </select> <label for="referenceTranslation" class="sr-only">Reference Translation</label> <select id="referenceTranslation"> <option value="NASB1995">NASB 1995</option> <option value="NASB">NASB 2020</option> <option value="ASV">ASV</option> <option value="ESV">ESV</option> <option value="KJV">KJV</option> <option value="GNV">GNV</option> <option value="NKJV">NKJV</option> <option value="BSB">BSB</option> <option value="CSB">CSB</option> <option value="NET">NET</option> <option value="NIV">NIV</option> <option value="NLT">NLT</option> </select> <button class="reference-panel-close" aria-label="Close reference panel">×</button> </div> </div> <div class="reference-panel-content"> <iframe id="referenceIframe" class="reference-panel-iframe" src="" title="Reference Bible Content" sandbox="allow-same-origin allow-scripts allow-popups allow-forms"></iframe> <div class="pdf-viewer" id="pdfViewer"> <div class="pdf-controls"> <button id="prevPage">Previous</button> <label for="pageInput" class="sr-only">Page Number</label> <span>Page</span> <input type="number" id="pageInput" min="1" value="1"> <span>of <span id="pageCount">0</span></span> <button id="nextPage">Next</button> <span style="margin-left: 10px;">Zoom:</span> <button id="zoomOut" aria-label="Zoom out">-</button> <span id="zoomLevel">100%</span> <button id="zoomIn" aria-label="Zoom in">+</button> <label for="pdfSearchInput" class="sr-only">Search in PDF</label> <input type="text" id="pdfSearchInput" placeholder="Search in PDF..." style="margin-left: 15px; padding: 5px 10px;"> <button id="pdfSearchBtn">Search</button> <button id="prevSearchResult" style="display: none;" aria-label="Previous result">◀</button> <button id="nextSearchResult" style="display: none;" aria-label="Next result">▶</button> <span id="pdfSearchResults" style="margin-left: 10px; font-size: 12px;"></span> <button id="clearSearchBtn" style="display: none; margin-left: 5px;">Clear</button> </div> <div class="pdf-canvas-container"> <canvas id="pdfCanvas"></canvas> </div> </div> </div> <div class="resize-handle resize-handle-right" data-panel="referencePanel" aria-label="Resize reference panel"></div> </div> <main class="main-content"> <header class="header"> <h1>Provinent Scripture Study</h1> <div class="header-controls"> <button class="theme-toggle" title="Toggle Dark Mode" aria-label="Toggle dark mode"> <span id="themeIcon" aria-hidden="true">🌙</span> </button> <button class="btn toggle-notes" aria-label="Toggle notes">Notes</button> <button class="btn" id="openSettingsBtn">Settings</button> <button class="btn btn-secondary" id="exportDataBtn" aria-label="Export data"><i class="fas fa-download" aria-hidden="true"></i> Export</button> <button class="btn btn-secondary" id="importDataBtn" aria-label="Import data"><i class="fas fa-upload" aria-hidden="true"></i> Import</button> <input type="file" id="importFile" style="display: none;" accept=".json"> </div> </header> <div class="toolbar"> <button class="btn btn-secondary" id="prevPassageBtn" title="Previous passage"> Prev </button> <button class="btn btn-secondary" id="nextPassageBtn" title="Next passage"> Next </button> <button class="btn btn-secondary" id="resumeReadingPlanBtn" title="Resume the daily reading plan"> Resume Reading Plan </button> <span class="toolbar-divider" aria-hidden="true"></span> <button class="btn btn-secondary" id="randomPassageBtn" title="Random passage"> Random Passage </button> <span class="toolbar-divider" aria-hidden="true"></span> <label for="bookSelect" class="sr-only">Choose a book</label> <select class="btn btn-secondary" id="bookSelect" title="Choose a book"> </select> <label for="chapterSelect" class="sr-only">Choose a chapter</label> <select class="btn btn-secondary" id="chapterSelect" title="Choose a chapter"> </select> <span class="toolbar-info"> Click any verse for further analysis • Right‑click to highlight </span> </div> <div class="content-area"> <section class="scripture-section" id="scriptureSection"> <div id="errorContainer" role="alert"></div> <div class="passage-header"> <h2 id="passageHeaderTitle">Passage of the Day</h2> <div id="planLabel" class="plan-label"></div> <div class="date" id="currentDate"></div> </div> <div class="passage-reference" id="passageReference"></div> <div id="scriptureContent"></div> <div class="api-attribution"> <p><strong>Attribution</strong></p> <p>Scripture quotations are provided by API from <a href="https://bible.helloao.org" target="_blank" rel="noopener noreferrer">bible.helloao.org</a>, without which this app would not have been possible. And a thank you to <a href="https://berean.bible" target="_blank" rel="noopener noreferrer">Berean Bible</a> for their excellent translation work. All copyrights reserved by their respective owners. Currently selected translation: <span id="bibleName">Berean Standard Bible</span>®</p> <p style="margin-top: 10px;"> </p> </div> </section> <section class="notes-section" id="notesSection"> <button class="collapse-toggle" title="Collapse Notes" aria-label="Collapse notes"></button> <div class= "notes-header"> <h3>Study Notes</h3> <div class="notes-controls"> <button class="btn btn-secondary" data-format="md" aria-label="Export as markdown"><i class="fas fa-download" aria-hidden="true"></i> Export .md</button> <button class="btn btn-secondary" data-format="txt" aria-label="Export as text"><i class="fas fa-download" aria-hidden="true"></i> Export .txt</button> </div> </div> <div class="notes-view-toggle"> <button class="view-toggle-btn active" id="textViewBtn">Text</button> <button class="view-toggle-btn" id="markdownViewBtn">Markdown</button> </div> <div class="markdown-toolbar" id="markdownToolbar"> <button class="markdown-btn" data-format="bold" title="Bold (Ctrl+B)" aria-label="Bold"><strong>B</strong></button> <button class="markdown-btn" data-format="italic" title="Italic (Ctrl+I)" aria-label="Italic"><em>I</em></button> <button class="markdown-btn" data-format="h1" title="Heading 1" aria-label="Heading 1">H1</button> <button class="markdown-btn" data-format="h2" title="Heading 2" aria-label="Heading 2">H2</button> <button class="markdown-btn" data-format="h3" title="Heading 3" aria-label="Heading 3">H3</button> <button class="markdown-btn" data-format="ul" title="Bullet List" aria-label="Bullet list">• List</button> <button class="markdown-btn" data-format="ol" title="Numbered List" aria-label="Numbered list">1. List</button> <button class="markdown-btn" data-format="quote" title="Quote" aria-label="Quote">" Quote</button> <button class="markdown-btn" data-format="code" title="Code" aria-label="Code"></></button> <button class="markdown-btn" data-format="link" title="Link" aria-label="Insert link">🔗 Link</button> </div> <textarea id="notesInput" aria-label="Study notes" placeholder="Write your study notes here... Text mode: Plain text Markdown mode: Live markdown preview Examples: # Heading 1 ## Heading 2 **Bold text** *Italic text* - Bullet point 1. Numbered list > Quote [Link text](url) "></textarea> <div id="notesDisplay" style="display: none;"></div> <div class="resize-handle resize-handle-left" data-panel="notesSection" aria-label="Resize notes panel"></div> </section> </div> </main> </div> <div class="color-picker" id="colorPicker" role="menu" aria-label="Highlight color options"> <div class="color-options"> <div class="color-option highlight-yellow" data-color="yellow" title="Yellow" role="menuitem" tabindex="0"></div> <div class="color-option highlight-green" data-color="green" title="Green" role="menuitem" tabindex="0"></div> <div class="color-option highlight-blue" data-color="blue" title="Blue" role="menuitem" tabindex="0"></div> <div class="color-option highlight-pink" data-color="pink" title="Pink" role="menuitem" tabindex="0"></div> <div class="color-option highlight-orange" data-color="orange" title="Orange" role="menuitem" tabindex="0"></div> <div class="color-option highlight-purple" data-color="purple" title="Purple" role="menuitem" tabindex="0"></div> </div> <button class="btn btn-secondary" id="removeHighlight" style="width: 100%; margin-top: 10px;">Remove Highlight</button> </div> <div class="popup-overlay" id="popupOverlay" aria-hidden="true"></div> <div class="strongs-popup" id="strongsPopup" role="dialog" aria-labelledby="strongsPopupTitle" aria-modal="true"> <div class="popup-header"> <h2 id="strongsPopupTitle">Verse Analysis</h2> <button class="popup-close" aria-label="Close popup">×</button> </div> <div class="strongs-content" id="strongsContent"></div> </div> <div class="popup-overlay" id="settingsOverlay" aria-hidden="true"></div> <div class="settings-modal" id="settingsModal" role="dialog" aria-labelledby="settingsModalTitle" aria-modal="true"> <div class="popup-header"> <h2 id="settingsModalTitle">Settings</h2> <button class="popup-close" id="closeSettingsBtn" aria-label="Close settings">×</button> </div> <div class="settings-group"> <label for="bibleTranslationSetting">Daily Passage Bible Translation</label> <select id="bibleTranslationSetting"> <option value="ASV">American Standard Version (ASV)</option> <option value="KJV">King James Version (KJV)</option> <option value="GNV">Geneva Bible 1599 (GNV)</option> <option value="BSB">Berean Standard Bible (BSB)</option> <option value="NET">New English Translation (NET)</option> </select> <small>This sets the translation for the Passage of the Day.</small> </div> <div class="settings-group"> <label for="referenceVersionSetting">Reference Panel Bible Version</label> <select id="referenceVersionSetting"> <option value="NASB1995">NASB 1995 (Strictly literal)</option> <option value="NASB">NASB 2020 (Updated literal)</option> <option value="ASV">ASV (Rigorously literal)</option> <option value="ESV">ESV (Elegant literal)</option> <option value="KJV">KJV (Classic literal)</option> <option value="GNV">GNV (Scholarly literal; Old English)</option> <option value="NKJV">NKJV (Modernized classic)</option> <option value="BSB">BSB (Study‑focused)</option> <option value="CSB">CSB (Optimal balance)</option> <option value="NET">NET (Scholarly transparent)</option> <option value="NIV">NIV (Readable dynamic)</option> <option value="NLT">NLT (Thought‑for‑thought)</option> </select> <small> This sets the translation only for the side‑panel Reference Bible and the Bible Gateway search. Please note that the BSB translation is not supported by Bible Gateway. </small> </div> <div class="settings-group"> <label for="readingPlanSelect">Reading Plan</label> <select id="readingPlanId"> <option value="default">90‑Day Sequential</option> <option value="genesis">Genesis</option> <option value="psalms">Psalms</option> <option value="proverbs">Proverbs</option> <option value="ecclesiastes">Ecclesiastes</option> <option value="romans">Romans</option> <option value="revelation">Revelation</option> </select> <small>Select which set of passages the “Next/Prev” buttons iterate over for your reading plan.</small> </div> <div class="settings-group"> <button class="btn btn-secondary" id="restartReadingPlanBtn" title="Start the sequential plan again from the beginning"> Restart Reading Plan </button> <small style="display:block;margin-top:5px;"> This will set the plan back to the first entry. Your highlights and notes will be kept. </small> </div> <div class="settings-group"> <label>Offline Storage</label> <div class="settings-group"> <button class="btn btn-secondary" id="clearHighlightsBtn">Clear Highlights</button> <small style="display:block;margin-top:5px;"> Removes all verse‑highlight colors. Your notes stay intact. </small> </div> <div class="settings-group"> <button class="btn btn-secondary" id="clearCacheBtn">Clear Cached Data</button> <small style="display:block;margin-top:5px;"> Clear all cached Bible passages and resources. This will free up storage space but remove offline access to previously viewed content including any uploaded PDF. </small> </div> </div> <div> <div class="settings-group"> <button class="btn btn-danger" id="deleteAllDataBtn"> <i class="fas fa-trash" aria-hidden="true"></i> Delete All Stored Data </button> <small style="display:block;margin-top:5px;color:#f44336;"> <strong>Warning:</strong> This will permanently delete all your highlights, notes, uploaded PDF, and settings. This action cannot be undone. </small> </div> </div> <div class="settings-group"> <label>Offline Bible PDF (Berean Standard Bible)</label> <small style="margin-bottom: 10px;"> Download a free Berean Standard Bible PDF for offline use. After downloading, upload it here. Other PDFs may work but only the BSB ones below have been tested. Uploading a new PDF overwrites the existing one. </small> <div class="pdf-download-options"> <a href="https://bereanbible.com/bsb-book-9.5.pdf" class="pdf-download-link" target="_blank" rel="noopener noreferrer" download> <div><i class="fas fa-download" aria-hidden="true"></i> BSB Standard Print (9.5pt) – Recommended</div> </a> <a href="https://bereanbible.com/bsb-vbv-book-9.5.pdf" class="pdf-download-link" target="_blank" rel="noopener noreferrer" download> <div><i class="fas fa-download" aria-hidden="true"></i> BSB Standard Print, verse‑by‑verse (9.5pt)</div> </a> <a href="https://bereanbible.com/bsb-book-11.pdf" class="pdf-download-link" target="_blank" rel="noopener noreferrer" download> <div><i class="fas fa-download" aria-hidden="true"></i> BSB Large Print (11pt)</div> </a> <a href="https://bereanbible.com/bsb-vbv-book-11.pdf" class="pdf-download-link" target="_blank" rel="noopener noreferrer" download> <div><i class="fas fa-download" aria-hidden="true"></i> BSB Large Print, verse‑by‑verse (11pt)</div> </a> </div> <button class="btn btn-secondary" style="width: 100%; margin-top: 10px;" id="settingsPdfUploadBtn"> <div><i class="fas fa-upload" aria-hidden="true"></i> Upload PDF</div> </button> <input type="file" id="settingsPdfUpload" style="display: none;" accept=".pdf"> <div id="customPdfInfo"></div> </div> <div class="settings-group"> <label>Color Theme</label> <div class="color-theme-options"> <div class="color-theme-option" data-theme="blue"> <div class="color-theme-preview" style="background: linear-gradient(135deg, #2c3e50, #3498db);"></div> <div>Blue</div> </div> <div class="color-theme-option" data-theme="green"> <div class="color-theme-preview" style="background: linear-gradient(135deg, #1b5e20, #4caf50);"></div> <div>Green</div> </div> <div class="color-theme-option" data-theme="purple"> <div class="color-theme-preview" style="background: linear-gradient(135deg, #4a148c, #9c27b0);"></div> <div>Purple</div> </div> <div class="color-theme-option" data-theme="red"> <div class="color-theme-preview" style="background: linear-gradient(135deg, #b71c1c, #f44336);"></div> <div>Red</div> </div> <div class="color-theme-option" data-theme="orange"> <div class="color-theme-preview" style="background: linear-gradient(135deg, #e65100, #ff9800);"></div> <div>Orange</div> </div> <div class="color-theme-option" data-theme="teal"> <div class="color-theme-preview" style="background: linear-gradient(135deg, #004d40, #009688);"></div> <div>Teal</div> </div> </div> </div> <div class="settings-section"> <h3>About Provinent Scripture Study</h3> <div class="about-content"> <div class="about-creator"> <strong>Created by:</strong> Jordan DiPasquale </div> <div class="attribution-links"> <div class="about-description">Code written using AI tools</div> <a href="https://gab.ai/" target="_blank" class="attribution-link gab"> <div> <strong>Gab AI</strong> <div class="link-description">By Gab, free speech social media</div> </div> </a> <a href="https://lumo.proton.me/" target="_blank" class="attribution-link lumo"> <div> <strong>Lumo AI</strong> <div class="link-description">By Proton AG</div> </div> </a> </div> <div class="version-info"> <strong>Version:</strong> <span id="appVersion"></span> </div> </div> </div> <div class="settings-actions"> <button class="btn btn-secondary" id="cancelSettingsBtn">Cancel</button> <button class="btn" id="saveSettingsBtn">Save Settings</button> </div> </div> <script type="module" src="main.js" defer></script> </body> </html>