Javascript

<script>
MemberStack.onReady.then(async function(member) {

  if (!member.loggedIn) {
    document.querySelectorAll("[data-item]").forEach(function(element) {
      var likeButton = element.querySelector("[likeButton]")
      likeButton.classList.remove("saved")
    })
    document.querySelector(".like-loader").style.display = "none" 
    return
  }
  //get member metadata
  var metadata = await member.getMetaData()

  var books = metadata.books

  if (!books) books = [];

  document.querySelectorAll("[data-item]").forEach(function(element) {
    var link = element.querySelector("[data-link]")
    var url = (new URL(link.href)).pathname
    var likeButton = element.querySelector("[likeButton]")
    if (!books.includes(url)) likeButton.classList.remove("saved")

    likeButton.addEventListener("click", function(event){
      event.preventDefault()
      if (!books.includes(url)) {
        books.push(url)
        likeButton.classList.add("saved")
      } else {
        var index = books.indexOf(url);
        if (index > -1) {
          books.splice(index, 1);
        }
        likeButton.classList.remove("saved")
      }
      member.updateMetaData({books: books})
    }) 
  })
  document.querySelector(".like-loader").style.display = "none"
 })
</script>