Merge pull request #715 from andrea-kyurchiev/feat/make-calendar-show-in-user-timezone

feat: makes calendar show in user timezone

Author: CiaraFlanagan

assets/js/script.js

@@ -4,6 +4,12 @@
   // Preloader js    
   $(window).on('load', function () {
     $('.preloader').fadeOut(100);
+    var calendarContainer = document.getElementById('calendar-container');
+    if(calendarContainer){
+      const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone 
+      const html = `<iframe src="https://calendar.google.com/calendar/embed?src=c_62694f414055ac569e5cb12dafbb0890ca22f3640b177a4b10b53171fbc9bdd4%40group.calendar.google.com&ctz=${timezone}" style=" border:0 " width="800" height="600" frameborder="0" scrolling="no"></iframe>`
+      calendarContainer.innerHTML = html;
+    }
   });
 
   // Accordions

content/en/calendar/_index.md

@@ -8,14 +8,10 @@ draft: false
 <section class="section">
   <div class="container">
     <div class="row align-items-center">
-        <p>Welcome to the InnerSource Commons Calendar! Our events and working groups are open to everyone because we know that magic happens when people come together to share their experience and knowledge. 
-        <p>A note about this calendar ... If you're using google, our calendar may display in the GMT timezone. To make sure you see events in your own timezone, please open the calendar on an incognito browser window or use a different search engine.
-        <div class="col-md-6 order-1 order-md-2 mb-4 mb-md-0">
-<iframe src="https://calendar.google.com/calendar/embed?src=c_62694f414055ac569e5cb12dafbb0890ca22f3640b177a4b10b53171fbc9bdd4%40group.calendar.google.com" style="border: 0" width="800" height="600" frameborder="0" scrolling="no"></iframe>        </p>
-      </div>
+        <p>Welcome to the InnerSource Commons Calendar! Our events and working groups are open to everyone because we know that magic happens when people come together to share their experience and knowledge. </p>
+        <div class="col-md-6 order-1 order-md-2 mb-4 mb-md-0" id="calendar-container">
+        </div>
       </div>
     </div>
   </div>
 </section>
-
-