https://cresta-bob-museum-stmoritz.ch/wp-content/themes/enfold-child/js/museum.js?ver=6.6.9

1(function($)
2{	
3"use strict";
4$(document).ready(function() {
5///////////////////////////////////////////////////////////////////////////////////
6// Code for cresta-bob-museum-stmoritz.ch
7///////////////////////////////////////////////////////////////////////////////////	
8
9
10
11
12///////////////////////////////////////////////////////////////////////////////////	
13// Timeline
14
15if ($("body").hasClass("page-id-196") || $("body").hasClass("page-id-732") || $("body").hasClass("page-id-1532") || $("body").hasClass("page-id-1506") || $("body").hasClass("page-id-1774")) {
16
17  var dateWidth = $(".date").width(), activeDate = 0, noDates = $(".date").length; 
18    
19  function changeDate(a) {
20    if (a < 0) {
21      activeDate = 0;
22      return;
23    }
24  
25    if (a > noDates - 1) {
26      activeDate = noDates - 1;
27      return;
28    }
29
30    pauseVideo(); // Pause the currently playing video
31  
32    $(".date").removeClass("active sibling");
33    
34    $(".date:nth-child(" + (a + 1) + ")").addClass("active");
35
36    $(".date.active").prev("div").addClass("sibling");
37
38    $(".dates-wrap").css("transform","translateX(" + -dateWidth * a + "px)");
39    setContentHeight();
40    setHeight();
41    
42  }
43    
44  $(".date").on('click', function(){
45    var chosen = $(this).index();
46    
47    if (chosen === activeDate) {
48      return;
49    }
50    activeDate = chosen;
51    changeDate(activeDate);
52    setContentHeight();
53    setHeight();
54    
55  });
56  
57  $(".controls").on("click", function() {
58    var direction = parseInt($(this).attr("data-direction"), 10);
59    activeDate += direction;  
60    changeDate(activeDate);
61    setContentHeight();
62    setHeight();
63    
64  });
65
66
67    //Hammer JS Swipe Event
68  let myElement = document.getElementById('draggable_timeline');
69  let mc = new Hammer.Manager(myElement);
70  mc.add(new Hammer.Pan({direction:Hammer.DIRECTION_HORIZONTAL, threshold:60, pointers: 0}));
71
72
73  mc.on("panend", function(ev) {
74      if(ev.direction == Hammer.DIRECTION_RIGHT) 
75      {
76          activeDate -= 1;  
77          changeDate(activeDate);
78          console.log("Threshold: " + ev.threshold);
79          console.log("Velocity: " + ev.velocity);
80      } else if(ev.direction == Hammer.DIRECTION_LEFT) { 
81          activeDate += 1;  
82          changeDate(activeDate);
83      }
84      setContentHeight();
85      setHeight();
86      
87  });
88
89
90  //set height of timeline
91  function setContentHeight() {
92    $(".date-content").each(function() {
93      let totalHeight = 0;
94      $(this).children().each(function(){
95        totalHeight = totalHeight + $(this).outerHeight(true);
96      });
97      $(this).css("height", totalHeight + 80);
98      //console.log("height of date-content element: " + totalHeight);
99    });
100  }
101  setContentHeight();
102
103  setTimeout(function() {
104    setContentHeight();
105  }, 3000);
106
107  function setHeight() {
108    //console.log("set height");
109    let activeDateHeight = parseInt($(".date.active").children(".date-content").css("height").replace('px', '')) + 250;
110    $(".time-line").css("height", activeDateHeight);
111    //console.log(activeDateHeight);
112  }
113  setHeight();
114
115  
116  //set height of timeline on resize
117  $(window).resize(function() {
118    setContentHeight();
119    setHeight(); 
120  });
121
122
123  function pauseVideo() {
124    var activeVideo = $(".date.active").find("video")[0]; // Get the video element in the active date
125    if (activeVideo && !activeVideo.paused) {
126      activeVideo.pause();
127    }
128  }
129
130  // Listen for fullscreenchange event on the document
131  document.addEventListener("fullscreenchange", function () {
132      setTimeout(function() {
133        setContentHeight();
134        setHeight();
135      }, 500);
136  });
137
138
139
140
141
142
143
144}
145
146
147///////////////////////////////////////////////////////////////////////////////////	
148// Content Slider always same height
149
150function setContentSliderHeight() {
151  $(".avia-content-slider-inner").each(function() {   
152    let maxHeight = 0;
153    $(this).children().each(function() {
154      let thisHeight = $(this).outerHeight(true);
155      if (thisHeight > maxHeight) {
156        maxHeight = thisHeight;
157      }
158    });
159    maxHeight = maxHeight + 50;
160    $(this).children().css("height", maxHeight);
161  });
162}
163
164setContentSliderHeight();
165
166$(window).resize(function() {
167  setContentSliderHeight();
168});
169
170
171
172
173
174
175///////////////////////////////////////////////////////////////////////////////////
176///////////////////////////////////////////////////////////////////////////////////	
177});
178})( jQuery );