alazyreader/library
1
0
Fork 0
Code Issues 1 Pull Requests 2 Releases Wiki Activity

add search

Browse Source
This commit is contained in:
David 2017-05-18 21:42:54 -04:00
parent 5d09498ccb
commit ec8d4960cd
2 changed files with 60 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
css/style.css
View File

@ -12,6 +12,33 @@
display: inline; display: inline;
} }
#searchBox {
position: absolute;
right: 10px;
top: 7px;
text-align: right;
width: 400px;
}
#searchBox input {
width: 300px;
font-size: 16px;
background: #f9f8ed;
padding: 2px 5px;
border: none;
border-bottom: 2px solid #d8d0a0;
font-family: 'Libre Baskerville', sans-serif;
}
#searchBox input:focus {
outline: none;
}
#searchBox input::placeholder {
font-family: 'Libre Baskerville', sans-serif;
color: #d8d0a0;
}
#current { #current {
background-color: #f7f3dc; background-color: #f7f3dc;
width: calc(40vw - 40px); width: calc(40vw - 40px);

42
index.html
View File

@ -13,28 +13,41 @@
<script type='text/javascript'> <script type='text/javascript'>
var publicSpreadsheetUrl = 'https://docs.google.com/spreadsheets/d/1w5Dc57wV0_rrKFsG7KM-qdPWEpqYk6lFu3JzAA0cSv0/pubhtml'; var publicSpreadsheetUrl = 'https://docs.google.com/spreadsheets/d/1w5Dc57wV0_rrKFsG7KM-qdPWEpqYk6lFu3JzAA0cSv0/pubhtml';
function init() { function showInfo(data, tabletop) {
$("#reloadLink").unbind('click'); $("#reloadLink").unbind('click');
$("#reloadLink").on("click", function() { init(); }); $("#reloadLink").on("click", function() { init(); });
Tabletop.init({ $("#search").unbind('input');
key: publicSpreadsheetUrl, $("#search").on("input", function(e) { search(data, e.target.value); });
callback: showInfo,
simpleSheet: true renderTable(data, 'authorLast'); //default sorting on load is author's last name
});
} }
function showInfo(data, tabletop) { function search(data, searchString) {
renderTable(data, 'authorLast'); //default sorting on load is author's last name searchBy = searchString.toLowerCase();
relevantFields = ['title', 'author', 'genre', 'publisher', 'series', 'year'];
if (!searchString) {
renderTable(data, 'authorLast');
return false;
}
renderTable(_.filter(data, function(book) {
return _.find(_.pick(book, relevantFields), function(field) {
return field.toLowerCase().indexOf(searchBy) !== -1;
});
}));
} }
function renderTable(data, sortField) { function renderTable(data, sortField) {
data = _.sortBy(data, 'title'); data = _.sortBy(data, 'title');
data = _.sortBy(data, sortField); if (sortField) { data = _.sortBy(data, sortField); }
$.each(data, function(key, value) { $.each(data, function(key, value) {
value.rowNumber = key; // re-key for new sort value.rowNumber = key; // re-key for new sort
if (!value.sortTitle) {
value.sortTitle = titleCleaner(value.title); value.sortTitle = titleCleaner(value.title);
}
}); });
var template = $('#Table').html(); var template = $('#Table').html();
@ -61,7 +74,13 @@
.replace(/^(An?|The)\s/i, ''); .replace(/^(An?|The)\s/i, '');
} }
window.addEventListener('DOMContentLoaded', init); window.addEventListener('DOMContentLoaded', function() {
Tabletop.init({
key: publicSpreadsheetUrl,
callback: showInfo,
simpleSheet: true
});
});
</script> </script>
</head> </head>
<body> <body>
@ -71,6 +90,9 @@
<a target="_blank" href="https://docs.google.com/spreadsheets/d/1w5Dc57wV0_rrKFsG7KM-qdPWEpqYk6lFu3JzAA0cSv0/edit">spreadsheet</a> <a target="_blank" href="https://docs.google.com/spreadsheets/d/1w5Dc57wV0_rrKFsG7KM-qdPWEpqYk6lFu3JzAA0cSv0/edit">spreadsheet</a>
<a target="_blank" href="https://github.com/deltamualpha/my-library">github</a> <a target="_blank" href="https://github.com/deltamualpha/my-library">github</a>
<a id="reloadLink" href="#">reload</a> <a id="reloadLink" href="#">reload</a>
<div id="searchBox">
<input id="search" type="text" name="search" placeholder="Search..."/>
</div>
</div> </div>
<div id="current">No Book Selected</div> <div id="current">No Book Selected</div>
<div id="books"></div> <!-- Table goes here --> <div id="books"></div> <!-- Table goes here -->