https://www.kasteelhuysterhorst.nl/template/template-vervolg/js/front.js?v1738053911

1'use strict';
2
3var $_GET=[];
4window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi,function(a,name,value){$_GET[name]=value;});
5
6$(window).scroll(function() {
7	let brandOffset = 15;
8	if ($( document ).width() < 1440 ) { brandOffset = 10; }
9	if ($( document ).width() < 1200 ) { brandOffset = 30; }
10
11	if ($(this).scrollTop() > brandOffset){
12		$('.navbar-brand').addClass('floating-brand');
13	}
14	else{
15		$('.navbar-brand').removeClass('floating-brand');
16	}
17});
18
19$(".navbar-nav [data-toggle='dropdown']").click(function(){
20  if ($(window).width() > 992) {
21    window.location = $(this).attr("href");
22  }
23});
24
25(function() {
26	let faqLists = $(".faq > ul").children();
27	faqLists.each(function(index) {
28		$(this).click(function() {
29			$(this).toggleClass('active');
30			$(this).children().toggle('fast');
31		});
32	});
33})()
34
35function toggleMobileFilters() {
36	$('.filters-contain').toggleClass('show');
37	$('body').toggleClass('filter-wrap-show');
38}
39
40
41var tijdsduurslider = $( "#slider-tijdsduur").slider({
42  range: true,
43  min: 0,
44  max: 12,
45  values: [ 0, 12 ],
46	step: 0.5,
47	slide: function(event, ui) {
48		if (ui.values[0] < 12) {
49			$('#tijdsduur-handle1 .value').html(ui.values[0] + ' uur');
50		}
51		else {
52			$('#tijdsduur-handle1 .value').html(ui.values[0] + '+ uur');
53		}
54		if (ui.values[1] < 2) {
55			$('#tijdsduur-handle2 .value').html(ui.values[1] + ' uur');
56		}
57		else {
58			$('#tijdsduur-handle2 .value').html(ui.values[1] + '+ uur');
59		}
60		$('#tijdsduur-view').html(ui.values[0] + ' uur - ' + ui.values[1]);
61	},
62    change: function(event, ui){
63        Filter();
64    }
65});
66
67var priceSliderMax = 85;
68var prijsslider = $( "#slider-prijs").slider({
69  range: true,
70  min: 0,
71  max: priceSliderMax,
72  values: [ 0, priceSliderMax ],
73	step: 1,
74	slide: function(event, ui) {
75
76		if (ui.values[0] < priceSliderMax) {
77			$('#prijs-handle1 .value').html('€' + ui.values[0]);
78		}
79		else {
80			$('#prijs-handle1 .value').html('€' + ui.values[0] + '+');
81		}
82		if (ui.values[1] < priceSliderMax) {
83			$('#prijs-handle2 .value').html('€' + ui.values[1]);
84		}
85		else {
86			$('#prijs-handle2 .value').html('€' + ui.values[1] + '+');
87		}
88		$('#prijs-view').html('€' + ui.values[0] + ' - €' + ui.values[1]);
89	},
90    change: function(event, ui){
91        Filter();
92    }
93});
94
95
96function updatePersonenSliderText(value) {
97    if (value == 1) {
98        $('#slider-personen .value').html('Alle mogelijkheden');
99        $('#personen-view.mobile-value-view').html('Alle mogelijkheden');
100
101        $('.filter-select-personen').val('all');
102        Filter();
103    } else {
104        $('#slider-personen .value').html('min. ' + value + ' personen');
105        $('#personen-view.mobile-value-view').html('min. ' + value + ' personen');
106    }
107}
108
109var personenslider = $("#slider-personen").slider({
110    range: "min", 
111    min: 1,
112    max: 350,
113    value: 1, 
114    step: 1,
115    slide: function(event, ui) {
116        if (ui.value == 1) {
117            updatePersonenSliderText(1);
118            return false;
119        } else {
120            updatePersonenSliderText(ui.value);
121        }
122    },
123    change: function(event, ui){
124        Filter();
125    }
126});
127
128$(document).ready(function() {
129    var initialValue = $(personenslider).slider("option", "value");
130    // console.log(initialValue);
131    updatePersonenSliderText(initialValue);
132});
133
134
135$('.activity-images').slick({
136	infinite: true,
137	slidesToShow: 1,
138	dots: true,
139	autoplay: true,
140  arrows: false
141});
142
143var tabs = document.getElementsByClassName('tab');
144var tabsContent = document.getElementsByClassName('tab-content');
145var activityContent = document.getElementsByClassName('activity-text-desc');
146
147for (let i=0;i<tabs.length;i++) {
148	tabs[i].addEventListener('click', function() {
149		for (let ii=0;ii<tabs.length;ii++) {
150			tabs[ii].classList.remove('active');
151			tabsContent[ii].classList.remove('active');
152			activityContent[ii].classList.remove('active');
153		}
154		tabs[i].classList.add('active');
155		tabsContent[i].classList.add('active');
156		activityContent[i].classList.add('active');
157	});
158}
159
160$( document ).ready(function() {
161		if (document.getElementsByClassName('tabs-contain').length > 0) {
162			if ($_GET['locatie'] == 'bij-ons') {
163				if (!tabs[0].classList.contains('no-tab')) {
164					tabs[0].click();
165				}
166			}
167			if ($_GET['locatie'] == 'bij-jou') {
168				if (!tabs[1].classList.contains('no-tab')) {
169					tabs[1].click();
170				}
171			}
172		}
173});
174
175console.log((UrlFilters.length > 0 ? '.' + UrlFilters.join(".") : "all"));
176
177var activitiesCheck = document.querySelector('.activities');
178
179if (activitiesCheck) {
180
181    var mixer = mixitup('.activities', {
182        animation: {
183            duration: 300
184        },
185        selectors: {
186            control: '.filter,.mixitup-control'
187        },
188        load: {
189            filter: (UrlFilters.length > 0 ? '.' + UrlFilters.join(".") : "all")
190        }
191    
192    });
193
194}
195
196
197
198if(UrlFilters.length > 0){
199    $( '.filter-select').each(function() {
200        $(this).find('option').each(function() {
201            if(UrlFilters.includes($(this).val())){
202                $(this).attr("selected", true).prop("selected", true);
203            }
204        });
205    });
206}
207
208// returnt een array met filter classes op basis van de selects en checkboxes (toggles).
209function CollectFilters(){
210    var classes = [];
211    $( '.filter-check').each(function() {
212
213        if($(this).is(":checked")){
214            classes.push($(this).val());
215        }
216    });
217
218    $( '.filter-select').each(function() {
219        if($(this).find("option:selected").val() != "all"){
220            classes.push($(this).find("option:selected").val());
221        }
222    });
223
224    return classes;
225
226}
227
228$(".filter").on('change', function(){
229    Filter();
230});
231
232
233$(".sort").on('change', function(){
234    var val = $(this).val();
235    mixer.sort(val);
236});
237
238function Filter(){
239    var Classes = CollectFilters();
240    var arrayLength = Classes.length;
241    var minPersonen = $(personenslider).slider("option", "value"); // Minimumaantal personen
242    
243    var prijs = $(prijsslider).slider("option", "values"); // Array [betweenmin, betweenmax]
244    var tijdsduur = $(tijdsduurslider).slider("option", "values"); // Array [betweenmin, betweenmax]
245
246    if(tijdsduur[1] == $(tijdsduurslider).slider("option", "max")){
247        tijdsduur[1] = 99999;
248    }
249
250    var $matching = $();
251    $('.mix').each(function() {
252        var thisMatching = true;
253        for (var i = 0; i < arrayLength; i++) {
254            if(!$(this).hasClass(Classes[i])) {
255                thisMatching = false;

256            }
257        }
258        if(tijdsduur.length == 2){
259            if($(this).data("mintime") >= tijdsduur[0] && $(this).data("maxtime") <= tijdsduur[1]) {
260                // Wel een match
261            } else {
262                thisMatching = false;
263            }
264        }
265
266        var minPersonsActivity = $(this).data("minpersons");
267        var maxPersonsActivity = $(this).data("maxpersons");
268
269        if (minPersonen !== 1) {
270            if(minPersonen < minPersonsActivity || minPersonen > maxPersonsActivity) {
271                thisMatching = false;
272            }
273        }
274   
275
276        if(prijs.length){
277            // Als de prijs hoger is dan de lage value
278            if($(this).data("pricefrom") >= prijs[0] &&
279                (
280                    // Als de prijs lager is dan de hoge value
281                    $(this).data("pricefrom") <= prijs[1]) ||
282                    (
283                        // Tenzij de hoge value max is, dan mag de prijs hoger zijn
284                        prijs[1] == priceSliderMax &&
285                        $(this).data("pricefrom") >= priceSliderMax
286                    )
287                )
288            {
289                if($(this).data("pricefrom") == ""){
290                    // Wel een match
291                }
292            }else{
293                thisMatching = false;
294            }
295        }
296        // Als het een match is wordt het element aan de lijst met matchende elementen toegevoegd
297        if(thisMatching) {
298            $matching = $matching.add(this);
299        }
300        else {
301            $matching = $matching.not(this);
302        }
303    });
304    // Filter is op basis van elementen in dit geval
305    mixer.filter($matching);
306}
307
308Filter();
309
310// Overbodige filters uitzetten
311document.addEventListener('DOMContentLoaded', function() {
312    var activities = document.querySelectorAll('.list.activities .mix');
313    var filterSelect = document.querySelector('.filter-select.categories');
314    
315    var categories = [];
316    activities.forEach(activity => activity.classList.forEach(category => {
317        if (category !== 'mix' && !categories.includes(category)) {
318            categories.push(category);
319        }
320    }));
321    
322    Array.from(filterSelect.options).forEach(option => {
323        if (option.value !== 'all' && !categories.includes(option.value)) {
324            option.style.display = 'none';
325        }
326    });
327});