scripture-viewer/BibleServerCli/data/www/bible/index.html

66 lines
2.3 KiB
HTML

<!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">
</head>
<body>
<section class="hero is-primary">
<div class="hero-body">
<p class="title">
Scripture Viewer
</p>
<p class="subtitle">
Read The Bible in browser
</p>
</div>
</section>
<nav class="breadcrumb" aria-label="breadcrumbs">
<ul>
<li><a href="./">Home</a></li>
<li class="is-active"><a href="#" id="bible_link" aria-current="page">Bible</a></li>
</ul>
</nav>
<article class="tile is-child notification">
<p class="title">Books</p>
<p class="subtitle" id="subtitle">List of Books in the...</p>
<div class="content" id="books">
</div>
</article>
<script>
const books = document.getElementById('books');
const bible_link = document.getElementById('bible_link');
const subtitle = document.getElementById('subtitle');
//List Of Books in the
function init()
{
const params = new Proxy(new URLSearchParams(window.location.search), {
get: (searchParams, prop) => searchParams.get(prop),
});
// Get the value of "some_key" in eg "https://example.com/?some_key=some_value"
let bible = params.bible; // "some_value"
bible_link.innerText=bible;
subtitle.innerText = `List of Books in the ${bible}`;
fetch(`./api/v1/GetBooks${window.location.search}`).then(e=>e.json()).then(e=>{
e.Books.forEach(element => {
var b = document.createElement('a');
b.href = `./book?bible=${encodeURIComponent(bible)}&book=${encodeURIComponent(element)}`;
b.innerText = element;
b.classList.add('button');
b.classList.add('is-primary');
books.appendChild(b);
//books.appendChild(document.createElement('br'))
});
});
}
init();
</script>
</body>
</html>