add video to timetable

private/js/modules/plugins/timetable.js

@@ -1,4 +1,4 @@
-$(function() {
+$(function () {
   var $body = $('body');
   var $timetable = $('#timetable');
 
@@ -9,7 +9,7 @@ $(function() {
   $(window).scrollTop(0);
 
   window.timetable_can_scroll = false;
-  window.setTimeout(function() {
+  window.setTimeout(function () {
     window.timetable_can_scroll = true;
   }, 2500);
 
@@ -39,17 +39,17 @@ $(function() {
   function init_timetable_items() {
     $timetable.attr('data-active', 1);
 
-    $timetable.find('.timetable__item').each(function() {
+    $timetable.find('.timetable__item').each(function () {
       $(this).addClass('reveal_container')
     });
-    window.setTimeout(function() {
+    window.setTimeout(function () {
       $timetable.addClass('active');
 
-      window.requestAnimationFrame(function() {
-        $timetable.find('.timetable__item').each(function() {
+      window.requestAnimationFrame(function () {
+        $timetable.find('.timetable__item').each(function () {
           var index = parseInt($(this).attr('data-id'));
           var elementWatcher = scrollMonitor.create(this);
-          elementWatcher.enterViewport(function() {
+          elementWatcher.enterViewport(function () {
             set_timetable_item(index);
           });
         });
@@ -76,7 +76,7 @@ $(function() {
   var $timetable_progress = $('#timetable__clock__progress');
   var timetable_clock_progress_max = parseFloat($timetable_progress.attr('stroke-dasharray'));
 
-  $body.on('click', '.timetable__next', function(event) {
+  $body.on('click', '.timetable__next', function (event) {
     event.preventDefault();
     if (!activated) {
       $(window).scrollTop($(window).height());
@@ -146,4 +146,43 @@ $(function() {
       $timetable_progress.attr('stroke-dashoffset', timetable_clock_progress_max * Math.abs(total_progress - 1));
     }
   }
+
+  document.querySelector('.timetable__button a').addEventListener('click', function (event) {
+    event.preventDefault();
+    var player;
+    var vimeo_id = document.querySelector('.timetable__button').getAttribute('data-video-vimeo-id');
+
+    var pswpElement = document.querySelectorAll('.pswp')[0],
+      gallery,
+      options,
+      items;
+
+    options = {
+      showHideOpacity: true,
+      download: false,
+      fullscreenEl: false,
+      shareEl: false,
+    };
+
+    items = [
+      {
+        html: '<div class="gallery__iframe"><div class="gallery__iframe__main"><iframe src="https://player.vimeo.com/video/' + vimeo_id + '" width="100%" height="100%" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe></div></div>',
+      },
+    ];
+
+    var gallery = new PhotoSwipe(pswpElement, PhotoSwipeUI_Default, items, options);
+
+    gallery.listen('close', function () {
+      document.querySelector('#timetable').style.height = '';
+      player.pause();
+    });
+
+    gallery.init();
+
+    document.querySelector('#timetable').style.height = '100%';
+      var iframe = document.querySelector('.pswp iframe');
+      player = new Vimeo.Player(iframe);
+      player.play();
+  });
+
 });