remove mustache

This commit is contained in:
David 2021-08-03 20:10:24 -04:00
parent f47f0e233c
commit 3e20c3a51e
3 changed files with 76 additions and 61 deletions

3
.gitignore vendored
View File

@ -1,3 +1,4 @@
/server /server
/manager /manager
*.properties *.properties
.DS_Store

View File

@ -3,7 +3,6 @@
<head> <head>
<title>Library</title> <title>Library</title>
<script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/mustache.js"></script>
<link <link
rel="stylesheet" rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
@ -91,7 +90,7 @@
} }
books.forEach((e, i) => (e.rowNumber = i)); // re-key for new sort books.forEach((e, i) => (e.rowNumber = i)); // re-key for new sort
$("#books").html(Mustache.render($("#Table").html(), { books })); $("#books").html(TableTemplate(books));
$("#books tbody tr") $("#books tbody tr")
.not(":first") // ignore the headers .not(":first") // ignore the headers
.on("click", function () { .on("click", function () {
@ -106,7 +105,7 @@
} }
function updateCurrentBook(book) { function updateCurrentBook(book) {
$("#current").html(Mustache.render($("#View").html(), { book })); $("#current").html(BookTemplate(book));
} }
function titleCleaner(title) { function titleCleaner(title) {
@ -138,6 +137,78 @@
return ISBN + (checkdigit === 10 ? "X" : checkdigit); return ISBN + (checkdigit === 10 ? "X" : checkdigit);
} }
function BookTemplate({
"isbn-13": isbn13,
authors,
coverurl,
description,
format,
notes,
onLoan,
publisher,
series,
signed,
title,
volume,
year,
}) {
return `${coverurl ? `<img src="${coverurl}"/>` : ""}
<h1 ${onLoan ? "class='onLoan' " : ""}>${title}</h1>
<h2>${authors}</h2>
<span>${isbn13}</span><br/>
<span>${publisher}, ${year}</span><br/>
${
series
? `<span>${series}${volume ? `, Volume ${volume}` : ""}</span><br/>`
: ""
}
${signed ? "<span>Signed by the author ✒</span><br/>" : ""}
<span>${format}</span>
${onLoan ? `<h2 class="onLoan">On loan to ${onLoan}</h2>` : ""}
<div class="description">
<p>${description}</p>
${notes ? `<span>Notes:</span><p>${notes}</p>` : ""}
</div>`;
}
function TableRowTemplate({
"isbn-13": isbn13,
authors,
onLoan,
publisher,
rowNumber,
signed,
title,
year,
}) {
return `<tr class="tRow ${onLoan ? "onLoan" : ""}" id="${rowNumber}">
<td class="title">
${title} ${
signed
? '<span class="signed" title="Signed by the author" ></span>'
: ""
}
</td>
<td class="author">${authors}</td>
<td class="publisher">${publisher}</td>
<td class="year">${year}</td>
<td class="isbn">${isbn13}</td>
</tr>`;
}
function TableTemplate(books) {
return `<table class="bookTable">
<tr>
<th data-sort-by="sortTitle" class="tHeader title">Title</th>
<th data-sort-by="sortAuthor" class="tHeader author">Author</th>
<th data-sort-by="publisher" class="tHeader publisher">Publisher</th>
<th data-sort-by="year" class="tHeader year">Year</th>
<th class="tHeader isbn">ISBN</th>
</tr>${books.reduce((acc, book) => {
return acc.concat(TableRowTemplate(book));
}, "")} </table>`;
}
window.addEventListener("DOMContentLoaded", init); window.addEventListener("DOMContentLoaded", init);
</script> </script>
</head> </head>
@ -162,61 +233,5 @@
<div id="books"></div> <div id="books"></div>
<!-- Table goes here --> <!-- Table goes here -->
</div> </div>
<script id="Table" type="text/html">
<table class="bookTable">
<tr>
<th data-sort-by="sortTitle" class="tHeader title">Title</th>
<th data-sort-by="sortAuthor" class="tHeader author">Author</th>
<th data-sort-by="publisher" class="tHeader publisher">Publisher</th>
<th data-sort-by="year" class="tHeader year">Year</th>
<th class="tHeader isbn">ISBN</th>
</tr>
{{#books}}
<tr class="tRow {{#onLoan}}onLoan{{/onLoan}}" id="{{rowNumber}}">
<td class="title">
{{title}} {{#signed}}<span
class="signed"
title="Signed by the author"
>✒</span
>{{/signed}}
</td>
<td class="author">{{authors}}</td>
<td class="publisher">{{publisher}}</td>
<td class="year">{{year}}</td>
<td class="isbn">{{isbn-13}}</td>
</tr>
{{/books}}
</table>
</script>
<script id="View" type="text/html">
{{#book}}
{{#coverurl}}
<img src="{{coverurl}}"/>
{{/coverurl}}
<h1 {{#onLoan}}class="onLoan" {{/onLoan}}>{{title}}</h1>
<h2>{{authors}}</h2>
<span>{{isbn-13}}</span><br/>
<span>{{publisher}}, {{year}}</span><br/>
{{#series}}
<span>{{series}}{{#volume}}, Volume {{volume}}</span>{{/volume}}<br/>
{{/series}}
{{#signed}}
<span>Signed by the author ✒</span><br/>
{{/signed}}
<span>{{format}}</span>
{{#onLoan}}
<h2 class="onLoan">On loan to {{onLoan}}</h2>
{{/onLoan}}
<div class="description">
<p>{{description}}</p>
{{#notes}}
<span>Notes:</span>
<p>{{notes}}</p>
{{/notes}}
</div>
{{/book}}
</script>
</body> </body>
</html> </html>

File diff suppressed because one or more lines are too long