Add printable
This commit is contained in:
parent
ffbad1005e
commit
c20e168ce2
|
@ -14,6 +14,8 @@
|
|||
</p>
|
||||
<p class="subtitle">
|
||||
Read The Bible in browser
|
||||
<br>
|
||||
<a class="button" href="./printable">Printable</a>
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
@ -0,0 +1,14 @@
|
|||
@media screen
|
||||
{
|
||||
.print-only
|
||||
{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media print {
|
||||
.screen-only
|
||||
{
|
||||
display: none;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,120 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Scripture Viewer</title>
|
||||
<link rel="stylesheet" href="./bulma.min.css" media="only screen">
|
||||
<link rel="stylesheet" href="./print.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="screen-only">
|
||||
<textarea id="text" class="textarea" placeholder="Place your book/chapter/verse urls here"></textarea>
|
||||
<button id="btn" class="button is-primary">Print</button>
|
||||
|
||||
</div>
|
||||
<h1 id="title" class="print-only"></h1>
|
||||
<ul id="verses" class="print-only">
|
||||
|
||||
</ul>
|
||||
<script>
|
||||
const title = document.getElementById('title');
|
||||
title.innerText = `Created on ${window.location.href}`;
|
||||
const text=document.getElementById('text');
|
||||
var genPage = true;
|
||||
const btn = document.getElementById('btn');
|
||||
const verses = document.getElementById('verses');
|
||||
btn.onclick = async(e)=>{
|
||||
|
||||
await BeforePrint();
|
||||
genPage=false;
|
||||
window.print();
|
||||
genPage=true;
|
||||
};
|
||||
|
||||
function additem(text)
|
||||
{
|
||||
var d=document.createElement('li');
|
||||
d.innerText = text;
|
||||
verses.appendChild(d);
|
||||
}
|
||||
async function GetVerses(bible,book,chapter)
|
||||
{
|
||||
if(chapter === -1) return await GetBook(bible,book);
|
||||
var res=await fetch(`./api/v1/GetVerses?bible=${encodeURIComponent(bible)}&book=${encodeURIComponent(book)}&chapter=${chapter}`);
|
||||
return await res.json();
|
||||
}
|
||||
async function GetVerse(bible,book,chapter,verse)
|
||||
{
|
||||
if(verse === -1) return await GetVerses(bible,book,chapter);
|
||||
var res=await fetch(`./api/v1/GetVerse?bible=${encodeURIComponent(bible)}&book=${encodeURIComponent(book)}&chapter=${chapter}&verse=${verse}`);
|
||||
return [await res.json()];
|
||||
}
|
||||
async function GetBook(bible,book)
|
||||
{
|
||||
if(book === '') return GetBible(bible);
|
||||
var res=await fetch(`./api/v1/GetChapterCount?bible=${encodeURIComponent(bible)}&book=${encodeURIComponent(book)}`);
|
||||
var json = await res.json();
|
||||
var list=[];
|
||||
|
||||
for(i = 0; i< json;i++)
|
||||
{
|
||||
list=list.concat(await GetVerses(bible,book,i+1));
|
||||
}
|
||||
|
||||
return list;
|
||||
}
|
||||
async function GetBible(bible)
|
||||
{
|
||||
if(bible === '') return [];
|
||||
var res=await fetch(`./api/v1/GetBooks?bible=${encodeURIComponent(bible)}`);
|
||||
var json = await res.json();
|
||||
var list=[];
|
||||
|
||||
for(const book of json.Books)
|
||||
{
|
||||
list=list.concat(await GetBook(bible,book));
|
||||
}
|
||||
|
||||
return list;
|
||||
}
|
||||
|
||||
async function BeforePrint()
|
||||
{
|
||||
if(genPage){
|
||||
verses.innerHTML="";
|
||||
for(const line of text.value.split(/\r\n|\r|\n/g))
|
||||
{
|
||||
try{
|
||||
var url=new URL(line);
|
||||
var bible=url.searchParams.get("bible") ?? '';
|
||||
var book = url.searchParams.get('book') ?? '';
|
||||
var chapter = parseInt(url.searchParams.get('chapter') ?? '-1');
|
||||
var verse = url.hash.replace('#verse-','');
|
||||
var verseNo = parseInt(verse === '' ? '-1' : verse);
|
||||
for(const verse of await GetVerse(bible,book,chapter,verseNo))
|
||||
{
|
||||
console.dir(verse);
|
||||
var d=document.createElement('li');
|
||||
var hdr=document.createElement('h3');
|
||||
hdr.innerText = verse.reference;
|
||||
d.appendChild(hdr);
|
||||
var p = document.createElement('p');
|
||||
p.innerText = verse.text;
|
||||
d.appendChild(p);
|
||||
d.appendChild(document.createElement('br'));
|
||||
verses.appendChild(d);
|
||||
}
|
||||
}catch(ex)
|
||||
{
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
window.addEventListener("beforeprint", BeforePrint);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in New Issue