deploy: e0db305

aschri1 · Oct 1, 2023 · a102446 · a102446
commit a102446
Show file tree

Hide file tree

Showing 7 changed files with 435 additions and 0 deletions.
diff --git a/.nojekyll b/.nojekyll
diff --git a/index.html b/index.html
@@ -0,0 +1,54 @@
+<!doctype html>
+<html class="h-100" lang="en">
+
+<head>
+  <!-- Required meta tags -->
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=yes">
+
+  <!-- Bootstrap CSS -->
+  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
+  <!-- Owl CSS -->
+  <link rel="stylesheet" href="owl/owl.carousel.min.css">
+  <!-- Main CSS -->
+  <link rel="stylesheet" href="style.css">
+  <!-- Font Awesome -->
+  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.12.0/css/all.css" type="text/css">
+
+  <title>New Books</title>
+</head>
+
+<body class="d-flex flex-column h-150 bg-transparent">
+  <div class="my-auto">
+    <div class="container-fluid">
+      <div class="row align-items-center justify-content-around">
+        <div class="col-auto order-first px-3 pr-0">
+          <button type="button" class="btn btn-secondary btn-circle" id="previous">
+            <i class="fas fa-chevron-left"></i>
+            <span class="sr-only">Previous</span>
+          </button>
+        </div>
+        <div class="col-auto order-last px-3 pl-0">
+          <button type="button" class="btn btn-secondary btn-circle" id="next">
+            <i class="fas fa-chevron-right"></i>
+            <span class="sr-only">Next</span>
+          </button>
+        </div>
+        <div class="col overflow-hidden px-0">
+          <div class="owl-carousel">
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <!-- Optional JavaScript -->
+  <!-- jQuery first, then Popper.js, then Bootstrap JS -->
+  <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
+  <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
+  <script src="new-books.js"></script>
+  <script src="owl/owl.carousel.min.js"></script>
+</body>
+
+</html>
diff --git a/new-books.js b/new-books.js
@@ -0,0 +1,95 @@
+$(document).ready(function() {
+  $.getJSON("new-books.json", function(data) {
+    var slides = [];
+    $.each(data, function(i, book) {
+      if (book["cover-url"] != "") {
+        var slide = `
+        <a class="card" target="_top" href="` + book["primo-url"] + `" title="` + book["title"] + `">
+          <img src="` + book["cover-url"] + `" alt="` + book["title"] + `" class="card-img">
+        </a>
+        `
+      }
+      /*
+      else {
+        var slide = `
+        <a class="card" href="` + book["primo-url"] + `">
+        <div class="card-body text-center p-3">
+          <h1 class="card-title text-dark">
+            ` + book["title"] + `
+          </h1>
+          <h2 class="card-subtitle text-muted">
+            ` + book["author"]  + `
+          </h2>
+        </div>
+        </a>
+        `
+      }
+      */
+      slides.push(slide);
+    });
+    $(".owl-carousel").append(slides);
+    var owl = $('.owl-carousel');
+    owl.owlCarousel({
+      margin: 10,
+      loop: false,
+      autoWidth: true,
+      items: 10,
+      nav: false,
+      dots: false,
+      responsive: {
+        0: {
+          slideBy: 1
+        },
+        420: {
+          slideBy: 2
+        },
+        570: {
+          slideBy: 3
+        },
+        725: {
+          slideBy: 4
+        },
+        880: {
+          slideBy: 5
+        },
+        1035: {
+          slideBy: 6
+        },
+        1190: {
+          slideBy: 7
+        },
+        1345: {
+          slideBy: 8
+        },
+        1500: {
+          slideBy: 9
+        },
+      }
+    });
+    owl.on('changed.owl.carousel', function(event) {
+      var minimum = event.relatedTarget.minimum(),
+        maximum = event.relatedTarget.maximum(),
+        current = event.relatedTarget.current();
+      if (current <= minimum) {
+        $('#previous').prop('disabled', true);
+      } else {
+        $('#previous').prop('disabled', false);
+      }
+      if (current >= maximum) {
+        $('#next').prop('disabled', true);
+      } else {
+        $('#next').prop('disabled', false);
+      }
+    });
+    // Go to the next item
+    $('#next').click(function() {
+      owl.trigger('next.owl.carousel');
+    });
+    // Go to the previous item
+    $('#previous').click(function() {
+      // With optional speed parameter
+      // Parameters has to be in square bracket '[]'
+      owl.trigger('prev.owl.carousel');
+    });
+  });
+});