Add first version of event list

benoittgt · Aug 13, 2021 · 845ea70 · 845ea70
1 parent 1f56c7a
commit 845ea70
Show file tree

Hide file tree

Showing 5 changed files with 61 additions and 2 deletions.
diff --git a/index.html b/index.html
@@ -55,7 +55,7 @@ <h1 hidden>Nantes Sous Pression</h1>
                 <a class="nav-link" href="#partenaires">Partenaires</a>
               </li>
               <li class="nav-item">
-                <a class="nav-link disabled" href="#evenements">Événements</a>
+                <a class="nav-link" href="#evenements">Événements</a>
               </li>
               <li class="nav-item">
                 <a class="nav-link disabled" href="#">FAQ</a>
@@ -110,7 +110,7 @@ <h5 class="m-4">
 
           <h4 id="evenements" class="water-dark mx-4 semi-bold">Les événements</h4>
 
-          <div class="row justify-content-center">
+          <div class="row justify-content-center" id="events">
             <div class="col col-4">
               <img id="placeholder-event" src="dist/img/placeholder.svg" alt="Verre à la main">
             </div>

diff --git a/package.json b/package.json
@@ -23,6 +23,7 @@
     "mini-css-extract-plugin": "^0.7.0",
     "node-sass": "^4.14.1",
     "optimize-css-assets-webpack-plugin": "^5.0.4",
+    "papaparse": "^5.3.1",
     "sass-loader": "^7.3.1",
     "style-loader": "^0.23.1",
     "svg-url-loader": "^2.3.3",

diff --git a/src/js/app.js b/src/js/app.js
@@ -1 +1,47 @@
 import 'bootstrap';
+import * as Papa from 'papaparse'
+
+function eventIcon(event) {
+}
+
+function beerEventTemplate(event) {
+  return `
+  <a href="${event.facebook_event}" target="_blank" rel="noopener noreferrer" class="list-group-item list-group-item-action flex-column align-items-start">
+    <div class="d-flex w-100 justify-content-between">
+      <h5 class="mb-1">${event.name}</h5>
+      <small>${event.day}</small>
+    </div>
+    <p class="mb-1">${event.description}</p>
+    <p class="mb-1">Lieu: ${event.place}</p>
+    <small><b>Prix:</b> ${event.price}. <b>Horaires:</b> ${event.times}. <b>Réservation:</b> ${event.reservation}</small>
+  </a>
+`
+}
+
+function addBeerEvent(events) {
+  let listGroupEvents = [];
+  events.forEach(function(row) {
+    if (row.active == 'FALSE') { return; }
+
+    listGroupEvents.push(beerEventTemplate(row))
+  })
+
+  let eventsTemplate = `
+    <div class="list-group list-group-flush">
+      ${listGroupEvents.join('')}
+    </div>
+    `
+  document.getElementById("events").innerHTML = eventsTemplate;
+}
+
+function init() {
+  Papa.parse('https://docs.google.com/spreadsheets/d/e/2PACX-1vTPHQ0uV24jynuVRLPPA22JxEgx658oqKFKWwZ_5LP7XFzlr7NZUFMx7qS1vNZrgUOT4DMEP9EfvE4b/pub?gid=0&single=true&output=csv', {
+    download: true,
+    header: true,
+    complete: function(results) {
+      addBeerEvent(results.data)
+    }
+  })
+}
+
+window.addEventListener('DOMContentLoaded', init)
diff --git a/src/scss/app.scss b/src/scss/app.scss
@@ -105,6 +105,13 @@ hr {
   width: auto;
 }
 
+.list-group-item {
+  background-color: transparent;
+  border-top: 1px solid #ddd;
+  border-radius: 0;
+  color: $water_dark;
+}
+
 @include media-breakpoint-up(md) {
   .partners-responsive {
     height: 80px;

diff --git a/yarn.lock b/yarn.lock
@@ -5205,6 +5205,11 @@ pako@~1.0.5:
   resolved "https://registry.yarnpkg.com/pako/-/pako-1.0.11.tgz#6c9599d340d54dfd3946380252a35705a6b992bf"
   integrity sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw==
 
+papaparse@^5.3.1:
+  version "5.3.1"
+  resolved "https://registry.yarnpkg.com/papaparse/-/papaparse-5.3.1.tgz#770b7a9124d821d4b2132132b7bd7dce7194b5b1"
+  integrity sha512-Dbt2yjLJrCwH2sRqKFFJaN5XgIASO9YOFeFP8rIBRG2Ain8mqk5r1M6DkfvqEVozVcz3r3HaUGw253hA1nLIcA==
+
 parallel-transform@^1.1.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/parallel-transform/-/parallel-transform-1.2.0.tgz#9049ca37d6cb2182c3b1d2c720be94d14a5814fc"