https://havel-oase.de/js/main.js

1var curr_id = 0;
2var new_id = 0;
3var subnav;
4var move_to;
5var small = false;
6var contact_send = false;
7
8var all_map_areas = new Array();
9
10$(document).ready(function() {
11	// Sondernachricht ausblenden
12	if ($(".temp_overlay").length) {
13		$(".temp_overlay").unbind().click(function() {
14			$(".temp_overlay").fadeOut();
15		});
16	}
17	init();
18});
19
20function check_scroll () {
21	var offset = window.pageYOffset;
22	if (offset > 20) {
23		if ($(".small_nav_button").css("display") != "block") {
24			$("#havel_oase_logo").css("width", "10em");
25			$(".havel_oase_logo_wrapper").css("height", "5em");
26			$(".main_navigation").css("top", "5em");
27			$(".content_wrapper").css("paddingTop", "8em");
28			$(".content_wrapper").css("minHeight", "calc(100% - 10em)");
29		} else {
30			$(".havel_oase_logo_wrapper").css("opacity", "0.4");
31			$(".havel_oase_logo_wrapper").css("backgroundImage", "none");
32		}
33	} else {
34		if ($(".small_nav_button").css("display") != "block") {
35			$("#havel_oase_logo").css("width", "20em");
36			$(".havel_oase_logo_wrapper").css("height", "8em");
37			$(".main_navigation").css("top", "8em");
38			$(".content_wrapper").css("paddingTop", "11em");
39			$(".content_wrapper").css("minHeight", "calc(100% - 12em)");
40		} else {
41			$(".havel_oase_logo_wrapper").css("backgroundImage", "url(img/havel-oase-banner.png)");
42			$(".havel_oase_logo_wrapper").css("opacity", "1");
43		}
44	}
45}
46
47// Prüfen, ob Smartphone-Auflösung
48function check_small () {
49	if ($(".small_nav_button").css("display") == "block") {
50		small = true;
51	}
52}
53
54window.onresize = check_small;
55window.onscroll = check_scroll;
56
57function init () {
58	check_small ();
59	slideshow ();
60	slideshow_interval = window.setInterval(slideshow, 6000);
61	if (small) {
62		$("#is_smartphone").html("tippen");
63	}
64
65	$("#pics_build").unbind().click(function() {
66		$("#build_wrapper").fadeIn(function() {
67			Galleria.loadTheme('js/galleria/src/themes/classic/galleria.classic.js');
68			var images = Array();
69			for (var i = 1; i <= 10; i++) {
70				images.push({
71					image: "img/pics/build/" + i + ".jpg",
72					thumb: "img/pics/build/" + i + ".jpg"
73				});
74			}
75
76			if ($("#galleria_1").length) {
77				Galleria.run("#galleria_1", {
78					showInfo: false,
79					dataSource: images,
80					autoplay: 2000
81				});
82			}
83			$(".area_map_description_close").unbind().click(function() {
84				$("#build_wrapper").fadeOut();
85			});
86		});
87	});
88
89	// Recaptcha-Größe
90	if (small) {
91		$(".g-recaptcha").css("transform", "scale(0.8)");
92		$(".g-recaptcha").css("margin-left", "-1em");
93	}
94
95	// Größe Bild anpassen
96	var height = $("#section_2").css("height");
97	$(".calendar_image").css("height", (height / 2));
98
99	// Scroll-Funktionen
100  $.scrollify({
101    section : ".sections",
102		standardScrollElements : "#section_1",
103		before  : function() {
104			curr_id = $.scrollify.current().attr("id").substr(8);
105			$(".nav_button_clicked").switchClass("nav_button_clicked", "nav_button");
106			$("#nav_button_" + curr_id).switchClass("nav_button", "nav_button_clicked");
107		}
108  });
109
110	// Navigation
111	$(".nav_button, .nav_button_clicked").unbind().click(function() {
112		new_id 	= $(this).attr("id").substr(11);
113		subnav = $("#subnavi_wrapper_" + new_id);
114		move_to = "#" + $("#nav_to_" + new_id).val();
115		if (subnav.length) {
116			if (subnav.css("display") == "block") {
117				subnav.slideUp();
118			} else {
119				subnav.slideDown();
120			}
121		} else {
122			if (small) {
123				$(".main_navigation").animate({right: "-80%"}, 500);
124			}
125		}
126		$.scrollify.move(move_to);
127	});
128
129	// Subnavigation ein- und ausblenden
130	$("*", "body").mousedown(function(evt) {
131    if($(".subnavi_wrapper").css("display") == "block" && !$(evt.target).is("#nav_button_" + curr_id) && !$(evt.target).is(".subnavi_wrapper") && !$(evt.target).is(".subnavi_button")) {
132			if (small) {
133				$(".main_navigation").animate({right: "-80%"}, 500);
134			}
135			$(".subnavi_wrapper").slideUp();
136    }
137	});
138
139  $(".small_nav_button").unbind().click(function() {
140		$(".main_navigation").animate({right: "0"}, 500, function() {
141			$(".small_close_button").unbind().click(function() {
142				$(".main_navigation").animate({right: "-80%"}, 500);
143			});
144		});
145	});
146
147	// Webcam einblenden
148	$("#webcam").unbind().click(function() {
149		show_map(99);
150	});
151
152	// Beschreibung für Karte einblenden
153	var all_map_areas_temp = all_map_areas.join(", .");
154
155	$("." + all_map_areas_temp + ", .legend_entry").unbind().click(function() {
156		var id	= $(this).attr("id").substr(9);
157		show_map(id);
158	});
159
160	// Kontaktformular
161	$("#contact_send").unbind().click(function() {
162		if (!contact_send) {
163			var error = "";
164			var name = $("#name").val();
165			var mail = $("#email").val();
166			var note = $("#note").val();
167			if (name == "" || mail == undefined) {
168				error += "Bitte tragen Sie Ihren Namen ein.\n";
169			}
170			if (mail == "" || mail == undefined) {
171				error += "Bitte tragen Sie Ihren E-Mail-Adresse ein.\n";
172			} else {
173				var check = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
174				var test_check = check.test(mail);
175				if (!test_check) {
176					error += "Bitte tragen Sie eine erlaubte E-Mail-Adresse ein.\n";
177				}
178			}
179			if (note == "" || note == undefined) {
180				error += "Bitte geben Sie Ihre Nachricht ein.\n";
181			}
182			var isHuman = grecaptcha.getResponse();
183			if (isHuman.length == 0) {
184				error += "Bitte klicken Sie, dass Sie kein Roboter sind.\n";
185			}
186			if (error != "") {
187				alert(error);
188			} else {
189				contact_send = true;
190				$("#contact_send").html("Bitte warten...");
191				var form_data = {
192					"todo"	: "send_contact",
193					"name"	: name,
194					"mail"	: mail,
195					"note"	: note
196				};
197				var url = "contact.php";
198				$.ajax({
199					type		: "POST",
200					url			: url,
201					data		: form_data
202				}).done(function(result) {
203					if (result == "done") {
204						$("#name").val("");
205						$("#email").val("");
206						$("#note").val("");
207						contact_send = false;

208						$("#contact_send").html("Absenden");
209						alert("Nachricht versendet. Vielen Dank!");
210					} else {
211						alert("Ihre Nachricht konnte leider nicht versendet werden. Bitte versuchen Sie es erneut!");
212					}
213				});
214			}
215		}
216	});
217	// Buchungsbuttons einblenden (Häuser)
218	$("#booking_house_wrapper").unbind().click(function() {
219		$("#booking_house_button_1, #booking_house_button_2, #booking_house_button_3").fadeIn("fast", function() {
220			$("#booking_house_button_1, #booking_house_button_2, #booking_house_button_3").css("top", "-4em");
221			$("#booking_house_button_1, #booking_house_button_2, #booking_house_button_3").css("height", "3em");
222			$("#booking_house_button_1, #booking_house_button_2, #booking_house_button_3").css("width", "3em");
223			$("#booking_house_button_1, #booking_house_button_2, #booking_house_button_3").css("backgroundSize", "2em");
224			$("#booking_house_button_2").css("left", "calc(50% - 6em)");
225			$("#booking_house_button_3").css("left", "calc(50% + 4em)");
226			document.getElementById("booking_house_wrapper").className = "link_button_grey";
227
228			$("#booking_house_button_1").unbind().click(function() {
229				window.open("http://havel-oase.de/bookings/?object_id=2");
230			});
231			$("#booking_house_button_2").unbind().click(function() {
232				window.open("http://havel-oase.de/bookings/?object_id=3");
233			});
234			$("#booking_house_button_3").unbind().click(function() {
235				window.open("http://havel-oase.de/bookings/?object_id=4");
236			});
237		});
238	});
239	// Buchungsbuttons einblenden (Boote)
240	$("#booking_boat_wrapper").unbind().click(function() {
241		$("#booking_boat_button_1, #booking_boat_button_2, #booking_boat_button_3").fadeIn("fast", function() {
242			$("#booking_boat_button_1, #booking_boat_button_2, #booking_boat_button_3").css("top", "-4em");
243			$("#booking_boat_button_1, #booking_boat_button_2, #booking_boat_button_3").css("left", "calc(50% - 7em)");
244			$("#booking_boat_button_1, #booking_boat_button_2, #booking_boat_button_3").css("height", "3em");
245			$("#booking_boat_button_1, #booking_boat_button_2, #booking_boat_button_3").css("width", "3em");
246			$("#booking_boat_button_1, #booking_boat_button_2, #booking_boat_button_3").css("backgroundSize", "2em");
247			$("#booking_boat_button_2").css("left", "calc(50% - 3em)");
248			$("#booking_boat_button_3").css("left", "calc(50% + 1em)");
249			document.getElementById("booking_boat_wrapper").className = "link_button_grey";
250
251			$("#booking_boat_button_1").unbind().click(function() {
252				window.open("http://havel-oase.de/bookings/?object_id=5");
253			});
254			$("#booking_boat_button_2").unbind().click(function() {
255				window.open("http://havel-oase.de/bookings/?object_id=6");
256			});
257			$("#booking_boat_button_3").unbind().click(function() {
258				window.open("http://havel-oase.de/bookings/?object_id=7");
259			});
260		});
261	});
262}
263
264function show_map (id) {
265	var url	= "map_areas.php?id=" + id;
266	$.ajax({url:url}).done(function(result) {
267		var result_array = result.split("#!#");
268		var background = result_array[0];
269		var headline = result_array[1];
270		var content = result_array[2];
271		var show_photos	= false;
272
273		$(".area_map_description_content").html("<h1>" + headline + "</h1>" + content).ready(function() {
274			$(".area_map_description").css("backgroundImage", "url(img/pics/" + background + ")").ready(function() {
275				$(".area_map_description").fadeIn().ready(function() {
276					$(".area_map_description").scrollTop(0);
277					// Buchungsbuttons
278					$(".link_button, .link_button_grey, .link_button_grey_1").unbind().click(function() {
279						var button_id	= $(this).attr("id").split("_");
280
281						if (button_id[0] == "foto") { // Fotos ansehen
282							if (!show_photos) {
283								$(".description_wrapper").slideUp(function() {
284									var html = "<div class=\"galleria\" id=\"galleria\"></div>";
285									if (small) {
286										html += "<p>Tippen Sie doppelt f&uuml;r Vollbild.</p>";
287									}
288
289									$(".photos_wrapper").html(html).ready(function() {
290										Galleria.loadTheme('js/galleria/src/themes/classic/galleria.classic.js');
291										var images = Array();
292										var max_images = 1;
293										if (button_id[1] == "house") {
294											max_images = 13;
295										}
296										if (button_id[1] == "hut") {
297											max_images = 5;
298										}
299										if (button_id[1] == "houses") {
300											max_images = 6;
301										}
302										if (button_id[1] == "villa") {
303											max_images = 11;
304										}
305										if (button_id[1] == "houseboats") {
306											max_images = 9;
307										}
308										if (button_id[1] == "camping") {
309											max_images = 4;
310										}
311										if (button_id[1] == "party") {
312											max_images = 7;
313										}
314										if (button_id[1] == "deluxe") {
315											max_images = 15;
316										}
317										if (button_id[1] == "family") {
318											max_images = 10;
319										}
320
321										for (var i = 1; i <= max_images; i++) {
322											images.push({
323												image: "img/pics/" + button_id[1] + "/" + i + ".jpg",
324												thumb: "img/pics/" + button_id[1] + "/" + i + ".jpg"
325											});
326										}
327
328										if ($("#galleria").length) {
329											Galleria.run("#galleria", {
330												showInfo: false,
331												dataSource: images,
332												autoplay: 2000
333											});
334										}
335										$(".photos_wrapper").slideDown(function() {
336											$(".link_button_grey").html("Beschreibung");
337											show_photos = true;
338										});
339									});
340								});
341							} else {
342								$(".photos_wrapper").slideUp(function() {
343									$(".description_wrapper").slideDown(function() {
344										$(".link_button_grey").html("Fotos ansehen");
345										show_photos = false;

346									});
347								});
348							}
349						} else if (button_id[0] == "youtube") { // Fotos ansehen
350							if (button_id[1] == "house") {
351								window.open("https://www.youtube.com/watch?v=FK4yBh3X7tg?autoplay=1");
352							}
353						} else { // Buchen
354							if (button_id[1] == "house") {
355								window.open("bookings/?object_id=1");
356							}
357							if (button_id[1] == "camping") {
358								window.open("campingreservierung");
359							}
360							if (button_id[1] == "hut" || button_id[1] == "houses" || button_id[1] == "villa" || button_id[1] == "deluxe" || button_id[1] == "family") {
361								var additional = "";
362								if (button_id[1] == "hut") {additional = "3";}
363								if (button_id[1] == "houses") {additional = "2";}
364								if (button_id[1] == "villa") {additional = "4";}
365								if (button_id[1] == "deluxe") {additional = "6";}
366								if (button_id[1] == "family") {additional = "7";}
367
368								window.open("http://havel-oase.de/bookings/?object_id=" + additional);
369							}
370							if (button_id[1] == "houseboatsold") {
371								window.open("http://funboot-havelsee.de/Buchungssystem/extern.php?user_id=8e296a067a37563370ded05f5a3bf3ec&selected_room_id=0");
372							}
373							if (button_id[1] == "houseboats") {
374								window.open("bookings/?object_id=5");
375							}
376						}
377					});
378
379					$(".area_map_description_close").unbind().click(function() {
380						$(".area_map_description").fadeOut();
381					});
382				});
383			});
384		});
385	});
386}
387
388var new_slideshow_pic = new Image();
389var slideshow_nmb = 1;
390var slideshow_interval = null;
391var toggle = true;
392var new_slideshow;
393var old_slideshow;
394
395// Slideshow
396function slideshow () {
397	if (slideshow_nmb == 13) {slideshow_nmb = 1;}
398
399	if (toggle) {
400		var new_slideshow = $(".slideshow_1");
401		var old_slideshow = $(".slideshow");
402		toggle = false;
403	} else {
404		var new_slideshow = $(".slideshow");
405		var old_slideshow = $(".slideshow_1");
406		toggle = true;
407	}
408	old_slideshow.css("transform", "scale(1.0)");
409	old_slideshow.css("zIndex", "10");
410	new_slideshow.css("transform", "scale(1.0)");
411	new_slideshow.css("zIndex", "5");
412
413	new_slideshow_pic.src = "img/pics/slideshow/" + slideshow_nmb + ".jpg";
414	new_slideshow_pic.onload = function() {
415		new_slideshow.css("backgroundImage", "url(" + new_slideshow_pic.src + ")").ready(function() {
416			old_slideshow.hide().ready(function() {
417				new_slideshow.show().ready(function() {
418					new_slideshow.css("transform", "scale(1.1)");
419				});
420			});
421		});
422	};
423	slideshow_nmb++;
424}