Merge branch 'main' into docker

src/app.js

@@ -118,8 +118,10 @@ app.use(
         intervalMs: 900000 //ms = 15min
       }
     }),
+    cookie: { maxAge: 86400000 }, // value of maxAge is defined in milliseconds. 
     teamsnap_token: "",
     current_team: "",
+    csrfToken:"",
     secret: process.env['SECRET'],
     resave: false, // don't save session if unmodified
     saveUninitialized: false, // don't create session until something stored

src/lib/utils.js

@@ -164,7 +164,7 @@ exports.compilePositionLabel = (label, flags) => {
 function toFlagsSet(flags) {
   let flags_set
     if (typeof(flags) == 'string'){
-      const flags_set = new Set(flags.split(',').map(s=>s.trim()))
+      flags_set = new Set(flags.split(',').map(s=>s.trim()))
     } else if (flags.constructor === Array){
       flags_set = new Set(flags)
     } else if (flags.constructor === Set){

src/public/js/eventlineup.js

@@ -296,10 +296,10 @@ function emailModal(el, url) {
 async function onSubmit(form, event) {
   event.preventDefault();
   console.log(event)
-  teamsnap_icon = document.querySelector("#teamsnap-icon");
+  teamsnap_icon = form.querySelector("#teamsnap-icon");
-  waiting_icon = document.querySelector("#waiting-icon");
+  waiting_icon = form.querySelector("#waiting-icon");
-  success_icon = document.querySelector("#success-icon");
+  success_icon = form.querySelector("#success-icon");
-  failure_icon = document.querySelector("#failure-icon");
+  failure_icon = form.querySelector("#failure-icon");
   data = new FormData(form);
   console.log(form)
   url = form.attributes.action.textContent;
@@ -610,6 +610,7 @@ function insertLineup(direction, teamId, eventId, element) {
       const new_lineup_doc = parser.parseFromString(html, 'text/html')
       const new_lineup_doc_node = new_lineup_doc.firstElementChild.querySelector('[id*=event-lineup]')
       const main = document.querySelector("main")
+      const new_csrf_token = new_lineup_doc.querySelector('form input[name=csrfToken]').value
 
       direction > 0 ? main.appendChild(new_lineup_doc_node) : main.insertBefore(new_lineup_doc_node, element.closest('[id*=event-lineup]'))
 
@@ -625,6 +626,9 @@ function insertLineup(direction, teamId, eventId, element) {
       Array.from(document.querySelectorAll("[id^=event-lineup] .Panel")).forEach((bcLineupPanel) => {
         bcLineupPanel.classList.remove('Panel--full')
       })
+      for (input of document.querySelectorAll("form input[name=csrfToken]")){
+        input.value = new_csrf_token
+      }
 
       initPage();
     })

src/views/event/partials/event_panel.hbs

@@ -12,21 +12,23 @@
         </div>
     </div>
     <div class=" Panel-footer u-flex u-flexJustifyAround u-padSm">
-        <a class="Button" href="/{{team.id}}/event/{{event.id}}">
+        <div class="u-maxWidthXs">
-            <span>{{{embeddedSvgFromPath "/bootstrap-icons/calendar.svg"}}}</span> 
+            <a class="Button" href="/{{team.id}}/event/{{event.id}}">
-            <span class="u-hidden u-xs-inline">Details</span> 
+                <span>{{{embeddedSvgFromPath "/bootstrap-icons/calendar.svg"}}}</span>
-        </a>
+                <span class="u-hidden">Details</span>
-        <a class="Button" href="/{{team.id}}/event/{{event.id}}/lineup">
+            </a>
-            <span>{{{embeddedSvgFromPath "/bootstrap-icons/clipboard.svg"}}}</span> 
+            <a class="Button" href="/{{team.id}}/event/{{event.id}}/lineup">
-            <span class="u-hidden u-xs-inline">Lineup</span> 
+                <span>{{{embeddedSvgFromPath "/bootstrap-icons/clipboard.svg"}}}</span>
-        </a>
+                <span class="u-hidden">Lineup</span>
-        <a class="Button" href="/{{team.id}}/event/{{event.id}}/sheet">
+            </a>
-            <span>{{{embeddedSvgFromPath "/bootstrap-icons/file-earmark.svg"}}}</span> 
+            <a class="Button" href="/{{team.id}}/event/{{event.id}}/sheet">
-            <span class="u-hidden u-xs-inline">Sheet</span> 
+                <span>{{{embeddedSvgFromPath "/bootstrap-icons/file-earmark.svg"}}}</span>
-        </a>
+                <span class="u-hidden">Sheet</span>
-        <a class="Button" href="https://go.teamsnap.com/{{team.id}}/schedule/view_game/{{event.id}}">
+            </a>
-            <span>{{{embeddedSvgFromPath "/media/teamsnap_star.svg"}}}</span> 
+            <a class="Button" href="https://go.teamsnap.com/{{team.id}}/schedule/view_game/{{event.id}}">
-            <span class="u-hidden u-xs-inline">TeamSnap</span> 
+                <span>{{{embeddedSvgFromPath "/media/teamsnap_star.svg"}}}</span>
-        </a>
+                <span class="u-hidden">TeamSnap</span>
+            </a>
+        </div>
     </div>
 </div>

src/views/eventlineup/edit.hbs

@@ -1,5 +1,5 @@
 <div class="u-spaceSidesNone u-sm-spaceSidesAuto" id="event-lineup-{{event.id}}" data-event-lineup-id="{{event_lineup.id}}" data-event-id="{{event.id}}">
-<form onsubmit="onSubmit(this,event)" action="#">
+<form onsubmit="onSubmit(this,event)" action="/{{team.id}}/event/{{event.id}}/lineup/{{event_lineup.id}}">
   <input type="hidden" name="event_lineup_id" value="{{event_lineup.id}}">
   {{!-- <input type="hidden" name="_csrf" value="{{csrfToken}}"> --}}
   <input type="hidden" name="csrfToken" value="{{csrfToken}}">

src/views/layouts/main.hbs

@@ -25,7 +25,7 @@
         {{> navbar }}
         {{{_sections.header}}}
     </header>
-    <main class="u-sm-spaceSidesMd">
+    <main class="u-xs-spaceSidesMd">
     {{{ body }}}
     </main>
 </body>

src/views/opponent/list.hbs

@@ -1,5 +1,6 @@
 <h1>
   {{title}}
+  <hr class="Divider" />
 </h1>
 <div class="Panel">
   <div class="Panel-body">

src/views/team/home.hbs

@@ -29,24 +29,23 @@
   </div>
 </div>
 
-<div class=" Panel Panel--full">
+
-  <div class=" Panel-header">
+<h2 class=" ">Upcoming Events</h2>
-    <h2 class=" Panel-title">Upcoming Events</h2>
+<hr class="Divider" />
-  </div>
+<div class="Grid Grid--withGutter">
-  <div class=" Panel-body">
     {{#each upcoming_events}}
+  <div class="Grid-cell u-xs-size1of2 u-sm-size1of3">
       {{>event_panel event=this}}
-    {{/each}}
   </div>
+    {{/each}}
 </div>
 
-<div class=" Panel Panel--full">
+<h2 class="">Recent Events</h2>
-  <div class=" Panel-header">
+<hr class="Divider" />
-    <h2 class=" Panel-title">Recent Events</h2>
+<div class="Grid Grid--withGutter">
-  </div>
-  <div class=" Panel-body">
     {{#each recent_events}}
+  <div class="Grid-cell u-xs-size1of2 u-sm-size1of3">
       {{>event_panel event=this}}
-    {{/each}}
   </div>
+    {{/each}}
 </div>