add eslint and change button

.eslintrc.json

@@ -0,0 +1,14 @@
+{
+    "env": {
+        "browser": true,
+        "es2021": true
+    },
+    "extends": [
+        "standard"
+    ],
+    "parserOptions": {
+        "ecmaVersion": 12
+    },
+    "rules": {
+    }
+}

.gitignore

@@ -0,0 +1 @@
+*node_modules*

booklist.js

@@ -1,20 +1,24 @@
+const displayUsingApi = false;
 (function ($) {
+  if (displayUsingApi) {
+    // TODO
 
+  } else {
     const list = JSON.parse(localStorage.getItem('booklist'))
     console.log(list)
-    const body = $('#book-list');
+    const body = $('#book-list')
     console.log()
 
     Object.keys(list).forEach((bookId) => {
-        console.log(bookId)
+      console.log(bookId)
-        body.append(makeListItem(list[bookId]));
+      body.append(makeListItem(list[bookId]))
-    });
+    })
+  }
 
-    function makeListItem(book) {
+  function makeListItem(book) {
-        const a = `<a href="${book.url}"><h3>${book.title}</h3></a>`;
+    const a = `<a href="${book.url}"><h3>${book.title}</h3></a>`
-        const li = `<li><div class="list-item"><img src="${book.imgSrc}"/>${a}<span>Author: ${book.author}</span><div></li>`;
+    const li = `<li><div class="list-item"><img src="${book.imgSrc}"/>${a}<span>Author: ${book.author}</span><div></li>`
-        console.log(li)
+    console.log(li)
-        return li;
+    return li
-    }
+  }
-
+})(jQuery) // eslint-disable-line
-})(jQuery);

ebooks/1661.html

@@ -204,6 +204,12 @@ Gutenberg metadata much faster than by scraping.
                                 <a onclick="printpage()" title="Print this page"><span
                                         class="icon icon_print"></span></a>
                             </li>
+                            <li>
+                                <div class="social-button booklist">
+                                    <button title="Add book to My Book List" id="add-to-booklist"
+                                        style="background-color: cornflowerblue;">+</button>
+                                </div>
+                            </li>
                         </ul>
                     </div>
                     <div id="qr">
@@ -215,10 +221,10 @@ Gutenberg metadata much faster than by scraping.
                         <div id="download">
                             <div about="[ebook:1661]" rel="dcterms:hasFormat">
                                 <h2>Download This eBook</h2>
-                                <button id="add-to-booklist"
+                                <!-- <button id="add-to-booklist"
                                     style="float: right;padding: 3px 5px;margin-top: -50px;background-color: cornflowerblue;">Add
                                     to My
-                                    Book List</button>
+                                    Book List</button> -->
                                 <table class="files">
                                     <colgroup>
                                         <col class="narrow">

ebooks/1952.html

@@ -203,6 +203,12 @@ Gutenberg metadata much faster than by scraping.
                                 <a onclick="printpage()" title="Print this page"><span
                                         class="icon icon_print"></span></a>
                             </li>
+                            <li>
+                                <div class="social-button booklist">
+                                    <button title="Add book to My Book List" id="add-to-booklist"
+                                        style="background-color: cornflowerblue;">+</button>
+                                </div>
+                            </li>
                         </ul>
                     </div>
                     <div id="qr">
@@ -214,10 +220,10 @@ Gutenberg metadata much faster than by scraping.
                         <div id="download">
                             <div about="[ebook:1952]" rel="dcterms:hasFormat">
                                 <h2>Download This eBook</h2>
-                                <button id="add-to-booklist"
+                                <!-- <button id="add-to-booklist"
                                     style="float: right;padding: 3px 5px;margin-top: -50px;background-color: cornflowerblue;">Add
                                     to My
-                                    Book List</button>
+                                    Book List</button> -->
                                 <table class="files">
                                     <colgroup>
                                         <col class="narrow">

ebooks/2542.html

@@ -196,6 +196,12 @@
               <li>
                 <a onclick="printpage()" title="Print this page"><span class="icon icon_print"></span></a>
               </li>
+              <li>
+                <div class="social-button booklist">
+                  <button title="Add book to My Book List" id="add-to-booklist"
+                    style="background-color: cornflowerblue;">+</button>
+                </div>
+              </li>
             </ul>
           </div>
           <div id="qr">
@@ -207,9 +213,9 @@
             <div id="download">
               <div about="[ebook:2542]" rel="dcterms:hasFormat">
                 <h2>Download This eBook</h2>
-                <button id="add-to-booklist"
+                <!-- <button id="add-to-booklist"
                   style="float: right;padding: 3px 5px;margin-top: -50px;background-color: cornflowerblue;">Add to My
-                  Book List</button>
+                  Book List</button> -->
                 <table class="files">
                   <colgroup>
                     <col class="narrow">

ebooks/book.js

@@ -1,58 +1,59 @@
 (function ($) {
-    const addbtn = $('#add-to-booklist');
+  const addbtn = $('#add-to-booklist')
-    const url = window.location && window.location.toString().split('/');
+  const url = window.location && window.location.toString().split('/')
-    const bookId = url[url.length - 1].match(/(\d+)/)[0];
+  const bookId = url[url.length - 1].match(/(\d+)/)[0]
 
-    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('Remove book from My Book List')
+    addbtn.html('-')
-        addbtn.css("background-color", "indianred");
+    addbtn.attr('title', 'Remove book from My Book List')
-        addbtn.addClass('book-in-list')
+    addbtn.css('background-color', 'indianred')
+    addbtn.addClass('book-in-list')
+  }
+
+  addbtn.on('click', function (event) {
+    if (addbtn.hasClass('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
     }
 
+    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')
 
-    addbtn.on('click', function (event) {
+    localStorage.setItem('booklist', JSON.stringify(newList))
-        if (addbtn.hasClass('book-in-list')) {
+    console.log(localStorage.getItem('booklist'))
-            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
-        };
 
-        const newList = { ...JSON.parse(localStorage.getItem('booklist')) };
+  function removeBook() {
-        newList[bookId] = bookData;
+    const newlist = JSON.parse(localStorage.getItem('booklist'))
-        addbtn.addClass('book-in-list')
+    delete newlist[bookId]
-        addbtn.html('Remove book from My Book List')
+    localStorage.setItem('booklist', JSON.stringify(newlist))
-        addbtn.css("background-color", "indianred")
+    console.log(localStorage.getItem('booklist'))
-
+    addbtn.removeClass('book-in-list')
-        localStorage.setItem('booklist', JSON.stringify(newList));
+    addbtn.html('+')
-        console.log(localStorage.getItem('booklist'));
+    addbtn.attr('title', 'Add book to My Book List')
-    });
+    addbtn.css('background-color', 'cornflowerblue')
-
+  }
-    function removeBook() {
+})(jQuery) // eslint-disable-line
-        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('Add to My Book List')
-        addbtn.css("background-color", "cornflowerblue")
-    }
-
-})(jQuery);

index.js

@@ -1,5 +1,3 @@
 (function ($) {
 
-
+})(jQuery) // eslint-disable-line
-
-})(jQuery);

package.json

@@ -0,0 +1,28 @@
+{
+  "name": "reading-list",
+  "version": "1.0.0",
+  "description": "Setup is very simple as all the content as of now is static.",
+  "main": "index.js",
+  "scripts": {
+    "lint": "eslint ./ --fix",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://aundus@github.com/EbookFoundation/reading-lists.git"
+  },
+  "author": "",
+  "license": "ISC",
+  "bugs": {
+    "url": "https://github.com/EbookFoundation/reading-lists/issues"
+  },
+  "homepage": "https://github.com/EbookFoundation/reading-lists#readme",
+  "devDependencies": {
+    "eslint": "^7.11.0",
+    "eslint-config-standard": "^14.1.1",
+    "eslint-plugin-import": "^2.22.1",
+    "eslint-plugin-node": "^11.1.0",
+    "eslint-plugin-promise": "^4.2.1",
+    "eslint-plugin-standard": "^4.0.1"
+  }
+}