refactor book script to not need jquery
parent
573121b9e9
commit
b44747bf2f
|
@ -1,59 +1,54 @@
|
||||||
(function ($) {
|
|
||||||
const addbtn = $('#add-to-booklist')
|
|
||||||
const url = window.location && window.location.toString().split('/')
|
window.onload = function() {
|
||||||
const bookId = url[url.length - 1].match(/(\d+)/)[0]
|
|
||||||
|
const addbtn = document.getElementById('add-to-booklist')
|
||||||
|
|
||||||
const currentList = JSON.parse(localStorage.getItem('booklist'))
|
const currentList = JSON.parse(localStorage.getItem('booklist'))
|
||||||
|
|
||||||
if (currentList && currentList[bookId]) {
|
if (currentList && currentList[bookId]) {
|
||||||
// book already in list
|
// book already in list
|
||||||
addbtn.html('-')
|
addbtn.innerHTML = '-'
|
||||||
addbtn.attr('title', 'Remove book from My Book List')
|
addbtn.setAttribute('title', 'Remove book from My Book List')
|
||||||
addbtn.css('background-color', 'indianred')
|
addbtn.setAttribute('style', 'background-color: indianred;')
|
||||||
addbtn.addClass('book-in-list')
|
addbtn.classList.add('book-in-list')
|
||||||
}
|
}
|
||||||
|
|
||||||
addbtn.on('click', function (event) {
|
addbtn.onclick = function () {
|
||||||
if (addbtn.hasClass('book-in-list')) {
|
if(addbtn.classList.contains('book-in-list')){
|
||||||
removeBook()
|
removeBook()
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
// add book to list
|
try{
|
||||||
let author = ''
|
const bookData = getBookMetadata();
|
||||||
$('tbody>tr').each(function (index) {
|
const newList = { ...JSON.parse(localStorage.getItem('booklist')) }
|
||||||
const row = $(this)
|
newList[bookId] = bookData
|
||||||
const rowTitle = row.find('th:first').html()
|
|
||||||
if (rowTitle === 'Author') {
|
addbtn.classList.add('book-in-list')
|
||||||
const tableRow = row.find('td:first')
|
addbtn.innerHTML = '-'
|
||||||
author = tableRow.find('a:first').html()
|
addbtn.setAttribute('title', 'Remove book from My Book List')
|
||||||
}
|
addbtn.setAttribute('style', 'background-color: indianred;')
|
||||||
})
|
|
||||||
const bookData = {
|
localStorage.setItem('booklist', JSON.stringify(newList))
|
||||||
title: $('h1').html(),
|
console.log(localStorage.getItem('booklist'))
|
||||||
bookId: bookId,
|
|
||||||
imgSrc: $('img.cover-art').attr('src'),
|
|
||||||
author: author,
|
|
||||||
url: window.location.href
|
|
||||||
}
|
}
|
||||||
|
catch(err){
|
||||||
const newList = { ...JSON.parse(localStorage.getItem('booklist')) }
|
console.log('Error adding book', err)
|
||||||
newList[bookId] = bookData
|
}
|
||||||
addbtn.addClass('book-in-list')
|
|
||||||
addbtn.html('-')
|
}
|
||||||
addbtn.attr('title', 'Remove book from My Book List')
|
|
||||||
addbtn.css('background-color', 'indianred')
|
|
||||||
|
|
||||||
localStorage.setItem('booklist', JSON.stringify(newList))
|
|
||||||
console.log(localStorage.getItem('booklist'))
|
|
||||||
})
|
|
||||||
|
|
||||||
function removeBook () {
|
function removeBook () {
|
||||||
const newlist = JSON.parse(localStorage.getItem('booklist'))
|
const newlist = JSON.parse(localStorage.getItem('booklist'))
|
||||||
delete newlist[bookId]
|
delete newlist[bookId]
|
||||||
localStorage.setItem('booklist', JSON.stringify(newlist))
|
localStorage.setItem('booklist', JSON.stringify(newlist))
|
||||||
console.log(localStorage.getItem('booklist'))
|
console.log(localStorage.getItem('booklist'))
|
||||||
addbtn.removeClass('book-in-list')
|
addbtn.classList.remove('book-in-list')
|
||||||
addbtn.html('+')
|
addbtn.innerHTML = '+'
|
||||||
addbtn.attr('title', 'Add book to My Book List')
|
addbtn.setAttribute('title', 'Add book to My Book List')
|
||||||
addbtn.css('background-color', 'cornflowerblue')
|
addbtn.setAttribute('style', 'background-color: cornflowerblue;')
|
||||||
}
|
}
|
||||||
})(jQuery) // eslint-disable-line
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue