refactor book script to not need jquery

ebooks/book.js

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