make book.js a fetch

This commit is contained in:
Lucas 2023-03-14 19:09:27 +01:00
parent fdd32a7676
commit 209f21535e
2 changed files with 89 additions and 73 deletions

View file

@ -36,7 +36,7 @@
<div class="view-container" style="display: flex;align-items: center;flex-direction: column;">
<h1 id="book_title"></h1>
<div class="view-container">
<div><a target="_blank" id="cf-link"><i class="fa-solid fa-hand-holding-dollar icon" ></i></a><span class="view-details" id="cf-date"></span></div>
<div><a target="_blank" id="book_cf-link"><i class="fa-solid fa-hand-holding-dollar icon" ></i></a><span class="view-details" id="cf-date"></span></div>
<div class="view-container row"><a target="_blank" id="physical-link"><i class="fa-solid fa-cart-shopping icon"></i></a>
<a target="_blank" id="pdf-link"><i class="fa-solid fa-file-pdf icon"></i></a>
</div>

View file

@ -1,4 +1,9 @@
import data from "/lang/books-en.json" assert { type: "json" };
var lastbook;
var currentbook;
fetch("/lang/books-en.json")
.then((response) => response.json())
.then((data) => {
console.log(data);
const gallery = document.getElementsByClassName("gallery")[0];
@ -15,21 +20,24 @@ for (const key in data) {
</div>
`;
gallery.insertAdjacentHTML("afterbegin", bookHTML);
};
var lastbook;
var currentbook;
}
var flkty = new Flickity(".gallery", {
freeScroll: true,
wrapAround: true,
hash: true, // options
});
refreshBooks();
currentbook = document.getElementsByClassName("gallery-cell is-selected")[0].getAttribute("id");
currentbook = document
.getElementsByClassName("gallery-cell is-selected")[0]
.getAttribute("id");
//TODO: Fill view-container with books
fillBookView();
flkty.on("select", function(index) {
currentbook = document.getElementsByClassName("gallery-cell is-selected")[0].getAttribute("id");
currentbook = document
.getElementsByClassName("gallery-cell is-selected")[0]
.getAttribute("id");
if (currentbook == lastbook) {
return;
}
@ -40,12 +48,20 @@ flkty.on("select", function (index) {
console.log("Flickity settled at " + index);
refreshBooks();
});*/
});
function fillBookView() {
var bookAttributes = ["book_title","book_desc","cf-date","physical-link","pdf-link","cf-link"]
var bookAttributes = [
"book_title",
"book_desc",
"cf-date",
"physical-link",
"pdf-link",
"book_cf-link",
];
bookAttributes.forEach(function(attr) {
setLocalizeDataAttr(attr, currentbook+'.'+attr.split("_")[1]);
setLocalizeDataAttr(attr, currentbook + "." + attr.split("_")[1]);
});
setLocalizeDataAttr("view-title", currentbook + ".title");
setLocalizeDataAttr("view-desc", currentbook + ".desc");