/* German initialisation for the jQuery UI date picker plugin. */
/* Written by Milian Wolff (mail@milianw.de). */
( function( factory ) {
	if ( typeof define === "function" && define.amd ) {

		// AMD. Register as an anonymous module.
		define( [ "../widgets/datepicker" ], factory );
	} else {

		// Browser globals
		factory( jQuery.datepicker );
	}
}( function( datepicker ) {

if ($('html').attr('lang') == 'de') {

	datepicker.regional.de = {
		closeText: "Schließen",
		prevText: "&#x3C;Zurück",
		nextText: "Vor&#x3E;",
		currentText: "Aktueller Monat",
		monthNames: [ "Januar","Februar","März","April","Mai","Juni","Juli","August","September","Oktober","November","Dezember" ],
		monthNamesShort: [ "Jan","Feb","Mär","Apr","Mai","Jun","Jul","Aug","Sep","Okt","Nov","Dez" ],
		dayNames: [ "Sonntag","Montag","Dienstag","Mittwoch","Donnerstag","Freitag","Samstag" ],
		dayNamesShort: [ "So","Mo","Di","Mi","Do","Fr","Sa" ],
		dayNamesMin: [ "So","Mo","Di","Mi","Do","Fr","Sa" ],
		weekHeader: "KW",
		dateFormat: "dd.mm.yy",
		firstDay: 1,
		isRTL: false,
		showMonthAfterYear: false,
		yearSuffix: "" };
	datepicker.setDefaults( datepicker.regional.de );

	return datepicker.regional.de;

} else if ($('html').attr('lang') == 'dk') {

	datepicker.regional.dk = {
		closeText: "Luk",
		prevText: "&#x3C;Tilbage",
		nextText: "Frem&#x3E;",
		currentText: "Aktuel måned",
		monthNames: [ "Januar","Februar","Marts","April","Maj","Juni","Juli","August","September","Oktober","November","December" ],
		monthNamesShort: [ "Jan","Feb","Mar","Apr","Maj","Jun","Jul","Aug","Sep","Okt","Nov","Dec" ],
		dayNames: [ "Søndag","Mandag","Tirsdag","Onsdag","Torsdag","Fredag","Lørdag" ],
		dayNamesShort: [ "Sø","Ma","Ti","On","To","Fr","Lø" ],
		dayNamesMin: [ "Sø","Ma","Ti","On","To","Fr","Lø" ],
		weekHeader: "KW",
		dateFormat: "dd.mm.yy",
		firstDay: 1,
		isRTL: false,
		showMonthAfterYear: false,
		yearSuffix: "" };
	datepicker.setDefaults( datepicker.regional.dk );

	return datepicker.regional.dk;

} else if ($('html').attr('lang') == 'cn') {

	datepicker.regional.cn = {
		closeText: "关闭",
		prevText: "&#x3C;向后",
		nextText: "向前&#x3E;",
		currentText: "当前月份",
		monthNames: [ "一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月" ],
		monthNamesShort: [ "一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月" ],
		dayNames: [ "星期日","星期一","星期二","星期三","星期四","星期五","星期六" ],
		dayNamesShort: [ "星期日","星期一","星期二","星期三","星期四","星期五","星期六" ],
		dayNamesMin: [ "星期日","星期一","星期二","星期三","星期四","星期五","星期六" ],
		weekHeader: "KW",
		dateFormat: "dd.mm.yy",
		firstDay: 1,
		isRTL: false,
		showMonthAfterYear: false,
		yearSuffix: "" };
	datepicker.setDefaults( datepicker.regional.cn );

	return datepicker.regional.cn;

} else if ($('html').attr('lang') == 'ar') {

	datepicker.regional.ar = {
		closeText: "إغلاق",
		prevText: "&#x3C;عودة",
		nextText: "السابق&#x3E;",
		currentText: "الشهر الحالي",
		monthNames: [ "يناير","فبراير","مارس","أبريل","مايو","يونيو","يوليو","أغسطس","سبتمبر","أكتوبر","نوفمبر","ديسمبر" ],
		monthNamesShort: [ "يناير","فبراير","مارس","أبريل","مايو","يونيو","يوليو","أغسطس","سبتمبر","أكتوبر","نوفمبر","ديسمبر" ],
		dayNames: [ "الأحد","الاثنين","الثلاثاء","الأربعاء","الخميس","الجمعة","السبت" ],
		dayNamesShort: [ "الأحد","الاثنين","الثلاثاء","الأربعاء","الخميس","الجمعة","السبت" ],
		dayNamesMin: [ "الأحد","الاثنين","الثلاثاء","الأربعاء","الخميس","الجمعة","السبت" ],
		weekHeader: "KW",
		dateFormat: "dd.mm.yy",
		firstDay: 1,
		isRTL: false,
		showMonthAfterYear: false,
		yearSuffix: "" };
	datepicker.setDefaults( datepicker.regional.ar );

	return datepicker.regional.ar;

}

} ) );



$(document).ready(function($) {

	$(window).load(function() {
		setMobileClass();
		setNavbarWidth();
		set_trenner();
		modify_start_slider();
		set_res_form_link();

		// Magnifik (Zoom)
		$('.mobile #header_img_1 .csc-textpic-image, .page-61 #header_img_1 .item').magnifik({
			seekImage: false
		});

		// Bei Leserichtung rechts nach links
		if ($('html').attr('dir') == 'rtl') {
			
			// Wenn es nur ein Bild gibt 
			if (!$('#header_img_2_3_wrapper').length && $('#header_img_1').length) {
				$('#header_img_1').css('float','none');
			}
		}

		// FORMULAR mobil
		// für bestimmte Felder weitere Eigenschaften setzen
		if ($('form').length !== false) {
			if (isMobile()) {
				// Telefon, Fax
				$('input[name*=fax], input[name*=phone]').attr({
					type: 'tel'
				});

				// E-Mail
				$('input[name*=email]').attr({
					type: 'email'
				});

				// Datum
				$('#bookingstart-private, #bookingend-private, input[name*=start_date], input[name*=end_date]')
					.attr({
						type: 'date'
					})
					.removeClass('datepicker')
					.removeClass('hasDatepicker')
					.next('.ui-datepicker-trigger').remove()

				$('#bookingstart-private, #bookingend-private').prev('.label_datepicker').css('display','block');

				// Uhrzeit
				$('input[name*=start_time], input[name*=end_time]').attr({
					type: 'time'
				});

				// Zahl
				$('input[name*=person]').attr({
					pattern:'[0-9]*',
					inputmode: 'numeric'
				});
			}
		}

		// Formular Pflichtfeld Text
		// Shariff Sprache
		mandatory_text = 'This field ist mandatory';
		shariff_lang = 'en';
		if ($('html').attr('lang') == 'de') {
			mandatory_text = 'Dies ist ein Pflichtfeld';
			shariff_lang = 'de';
		} else if ($('html').attr('lang') == 'dk') {
			mandatory_text = 'Dette er et pligtfelt';
			shariff_lang = 'da';
		} else if ($('html').attr('lang') == 'cn') {
			mandatory_text = '这是必填区。';
			shariff_lang = 'zh';
		} else if ($('html').attr('lang') == 'ar') {
			mandatory_text = 'هذه الخانة إلزامية';
			shariff_lang = 'ar';
		}

		// FORMULAR select
		// Eigentlich ist über formLayout im Typo3-Formular-Bearbeiter definiert,
		// dass select-Felder einen umschließenden DIV haben. Das funktioniert aber
		// nach dem Update auf Typo3 7.6 und lässt sich offenbar auch nicht über
		// Typoscript realisieren.
		$('select').each(function() {
			if ($(this).parent('.select_wrapper').length === 0) {
				$(this).wrap('<div class="select_wrapper"></div>');
			}
		});

		// Shariff Social Media Buttons
		buttonsContainer = $('.shariff');
		new Shariff(buttonsContainer, {
			lang: shariff_lang,
			services: ['facebook', 'twitter', 'googleplus', 'mail'],
			mailUrl: 'mailto:'
		});

		// Buchungsformular 
		if (isMobile()) {
			$('#form_res_private').appendTo('#content_header');
		}

	});

	$(window).resize(function() {
		setMobileClass();
		setNavbarWidth();
		set_trenner();
		set_res_form_link();
	});

	// ----------------------------------
	//
	// FORMULAR
	// Validierung
	//
	// ----------------------------------
	// Pflichtfelder können nur am * erkannt werden, required-Attribut setzt Typo3 offenbar nicht
	$('input, textarea').blur(function() {
		if ($(this).val() == '' && $(this).prev('label').find('em').text() == '*') {
			if ($(this).prev('label').find('strong').length == 0) {
				$(this).prev('label').append('<strong>'+mandatory_text+'</strong>');
			}
		} else {
			$(this).prev('label').find('strong').remove();
		}
	});


	// ----------------------------------
	//
	// DATEPICKER
	//
	// ----------------------------------
	//date_format = 'dd/mm/yy';
	//if ($('html').attr('lang') == 'de') {
		date_format = 'dd.mm.yy';	// Auch für EN das deutsche Format, weil die Reservierungsseite das sonst nicht verarbeiten kann.
	//}
	if (!isMobile()) {
		$( ".datepicker" ).datepicker({
			//closeText: "X",
			showButtonPanel: true,
			showOn: "both",
			buttonImageOnly: true,
			buttonImage: "fileadmin/grand-elysee/layout/datepicker-button.png",
			dateFormat: date_format,
			//changeMonth: true,
			nextText: "&raquo;",
			prevText: "&laquo;",
			minDate: +0,
			onClose: function( selectedDate ) {
				if ($(this).attr('id') == 'bookingstart-private') {
					$("#bookingend-private" ).datepicker( "option", "minDate", selectedDate );
					if ($("#bookingend-private" ).val() == '') {
						dateArr = selectedDate.split('.');
						nextDate = new Date(dateArr[2], dateArr[1]-1, dateArr[0], '00', '01');
						nextDate.setDate(nextDate.getDate() + 1);
						//nextDateFormat = nextDate.getDate() + '.' + nextDate.getMonth() + '.' + nextDate.getFullYear();
						dd = nextDate.getDate();
						mm = nextDate.getMonth()+1;
						yyyy = nextDate.getFullYear();
						if(dd<10) {
							dd='0'+dd
						} 
						if(mm<10) {
							mm='0'+mm
						}
						nextDateFormat = dd+'.'+mm+'.'+yyyy;
						$("#bookingend-private" ).val(nextDateFormat);
					}
				// } else if ($(this).attr('id') == 'bookingend-private') {
				// 	$("#bookingstart-private" ).datepicker( "option", "maxDate", selectedDate );
				} else if ($(this).attr('id') == 'bookingstart-business') {
					$("#bookingend-business" ).datepicker( "option", "minDate", selectedDate );
					if ($("#bookingend-business" ).val() == '') {
						dateArr = selectedDate.split('.');
						nextDate = new Date(dateArr[2], dateArr[1]-1, dateArr[0], '00', '01');
						nextDate.setDate(nextDate.getDate() + 1);
						//nextDateFormat = nextDate.getDate() + '.' + nextDate.getMonth() + '.' + nextDate.getFullYear();
						dd = nextDate.getDate();
						mm = nextDate.getMonth()+1;
						yyyy = nextDate.getFullYear();
						if(dd<10) {
							dd='0'+dd
						} 
						if(mm<10) {
							mm='0'+mm
						}
						nextDateFormat = dd+'.'+mm+'.'+yyyy;
						$("#bookingend-business" ).val(nextDateFormat);
					}
				// } else if ($(this).attr('id') == 'bookingend-business') {
				// 	$("#bookingstart-business" ).datepicker( "option", "maxDate", selectedDate );
				}
			}
		});
		$.datepicker.setDefaults( $.datepicker.regional[ "de" ] );
	}


	// ----------------------------------
	//
	// BILDWECHSLER
	//
	// ----------------------------------
	$('#header_img_2_3_wrapper img').click(function() {
		img_big_src = $('#header_img_1 img').attr('src');
		img_big_alt = $('#header_img_1 img').attr('alt');
		img_small_src = $(this).attr('src');
		img_small_alt = $(this).attr('alt');
		$('#header_img_1 img').attr('src', img_small_src);
		$('#header_img_1 img').attr('alt', img_small_alt);
		$(this).attr('src', img_big_src);
		$(this).attr('alt', img_big_alt);
	});



	// ----------------------------------
	//
	// LANGUAGE SWITCH
	//
	// ----------------------------------
	// $('.footer-langswitch select').change(function() {
	$('.footer-langswitch select, .nav-mobile-langswitch select').change(function() {
		window.location = $(this).val();
	});



	// ----------------------------------
	//
	// BOOKING OVERLAY
	//
	// ----------------------------------
	$('.overlayBooking').click(function(){$('#overlayBooking, .overlayBookingClose').fadeIn();
	$('.overlayBookingClose').fadeIn();return false});
	$('.overlayBookingClose').click(function(){$('#overlayBooking').fadeOut();
	$('.overlayBookingClose').fadeOut()});


	// ----------------------------------
	//
	// RESERVIERUNGSFORMULAR
	// Switch privat/geschäftl.
	//
	// ----------------------------------
	// $('#form_res_company').fadeOut(0);
	// $('.res_form_switch span').click(function() {
	// 	//$('.res_form_switch span').removeClass('active');
	// 	//$(this).addClass('active');
	// 	form_id = $(this).attr('class');
	// 	form_id = form_id.replace('active', '');
	// 	form_id = form_id.replace(' ', '');
	// 	// $('.form_reservation').fadeOut(300, function() {
	// 	// 	$('#'+form_id).delay(300).fadeIn(300);
	// 	// });
	// 	$('.form_reservation').fadeOut(300);
	// 	$('#'+form_id).delay(300).fadeIn(300);
	// });


});


// ----------------------------------
//
// MOBILE:
// - Navbar Breite setzen
// - Headerbild zentrieren
//
// ----------------------------------
function setNavbarWidth() {
	windowWidth = $(window).width();
	if (windowWidth < 625) {

		resFormWidth = $('#sidebar-wrapper .form_reservation').outerWidth();
		resFormHeight = $('#sidebar-wrapper .form_reservation').outerHeight();

		// --- NAVBAR BREITE ---
		// navbarWidth = windowWidth - resFormWidth;
		// $('.navbar-collapse').width(navbarWidth);


		if ($('#header_img_1').find('.carousel').length > 0) {
			// --- SLIDER ---
			
	
		} else {
			// --- HEADERBILD ZENTRIEREN ---
			headerImgOverflow = $('#header_img_1 img').width() - windowWidth;
			if (headerImgOverflow > 0) {  // horizontal
				headerImgMargin = headerImgOverflow / 2;
				$('#header_img_1 img').css({
					'margin-left': '-'+headerImgMargin+'px',
					// 'height': resFormHeight,
					// 'width': 'auto'
				});

			} else {

				headerImgNoOverflow = $('#header_img_1 img').width() + resFormWidth - windowWidth;
				if (headerImgNoOverflow > 0) {  // horizontal, nicht zentriert
					if (windowWidth > 445) {
						marginLeft = resFormWidth;
					} else {
						marginLeft = 0;
					}
					$('#header_img_1 img').css({
						'margin-left': marginLeft,
						'width': 'auto'
					});

				} else {  // vertikal
					imgWidth = windowWidth - resFormWidth;
					$('#header_img_1 img').css({
						'margin-left': resFormWidth,
						'width': imgWidth,
						'height': 'auto'
					});
					headerImgOverflowHeight = resFormHeight - $('#header_img_1 img').height();
					if (headerImgOverflowHeight < 0) {
						headerImgMargin = headerImgOverflowHeight / 2;
						$('#header_img_1 img').css('margin-top',headerImgMargin+'px');
						$('#header_img_1').css({
							'height': resFormHeight,
							'overflow': 'hidden',
							'margin-bottom': '10px'
						});
					}
				}
			}			
		}


	} else {
		// alles zurücksetzen
		$('.navbar-collapse').width('auto');
		$('#header_img_1').css({
			'height': 'auto',
			'margin-bottom': 'auto'
		});
		$('#header_img_1 img').css({
			'margin-left': 0,
			'maring-top': 0,
			'width': '100%',
			'height': 'auto'
		});
	}
}


// ----------------------------------
//
// CLASS "MOBILE" IN BODY SETZEN
//
// ----------------------------------
function setMobileClass() {
	// if (isMobile()) {
	if ($('body').width() < 768) {
		$('body').addClass('mobile');
	} else {
		$('body').removeClass('mobile');
	}
}



// ----------------------------------
//
// SCREEN KLEINER ALS 768 PIXEL?
//
// ----------------------------------
function isMobile() {
	if ($('body').width() < 768) {
		return true;
	} else {
		return false;
	}
}




// ----------------------------------
//
// STARTSEITE: SLIDER MOBIL
// Für kleine Screens nur das erste
// Bild anzeigen.
//
// ----------------------------------
function modify_start_slider() {
	// if ($('body').hasClass('page-61') && isMobile()) {
	if ($('body').hasClass('page-61') && $('body').width() < 768) {
		img = $('#header_img_1 .carousel-inner .item').first();
		$('#header_img_1 .csc-default').first().append(img);
		$('#header_img_1 .carousel').remove();
	}
}




// ----------------------------------
//
// STARTSEITE TRENNER 
//
// ----------------------------------
function set_trenner() {
	// if ($('.trenner').length > 0 && !isMobile()) {
	if ($('.trenner').length > 0 && !$('body').width() < 768) {

		heightHeader = $('#c2077').height() + $('#c2078').height();
		heightLeft = $('#sidebar-wrapper').height();
		widthLeft = $('#sidebar-wrapper').outerWidth();

		$('.trenner').css({
			'border-top': '1px solid #dad8d2',
			'border-bottom': '1px solid #dad8d2',
			'background': '#fdfaf2',
			'padding-bottom': '25%',
			'margin-left': '-'+widthLeft+'px',
			'margin-top': '0'
		});

		if (heightLeft > heightHeader) {
			diff = heightLeft - heightHeader;
			$('.trenner').css('margin-top',diff+'px');
		}
	}
}


// ----------------------------------
//
// RESERVIERUNGSFORMULAR BUCHUNGSLINK
// für mobil eine andere action-URL
//
// ----------------------------------
function set_res_form_link() {
	if ($(window).width() < 721) {
		//Reservierungsformular in linker Spalte
		$('form.form_reservation').attr('action','https://reservations.grand-elysee.com/tb3/mobile/index.cfm?bf=grandelyseemobile');
		$('form.form_reservation input[name=bf]').val('grandelyseemobile');

		// Sämtliche Links, die zur Reservierung führen
		if ($("a[href^='https://www.yourreservation.net/tb3/']").length > 0) {
			$("a[href^='https://www.yourreservation.net/tb3/']").each(function() {
				link = $(this).attr('href');
				link_new = link.replace('/tb3/', '/tb3/mobile/');
				link_new = link_new.replace('bf=GrandElyseeHamburg', 'bf=grandelyseemobile');
				$(this).attr('href', link_new);
			});
		}
	} else {
		//Reservierungsformular in linker Spalte
		$('form.form_reservation').attr('action','https://reservations.grand-elysee.com/tb3/index.cfm');
		$('form.form_reservation input[name=bf]').val('GrandElyseeHamburg');

		// Sämtliche Links, die zur Reservierung führen
		if ($("a[href^='https://www.yourreservation.net/tb3/']").length > 0) {
			$("a[href^='https://www.yourreservation.net/tb3/']").each(function() {
				link = $(this).attr('href');
				link_new = link.replace('/tb3/mobile/', '/tb3/');
				link_new = link_new.replace('bf=grandelyseemobile', 'bf=GrandElyseeHamburg');
				$(this).attr('href', link_new);
			});
		}
	}
}


// ----------------------------------
//
// DATUM AUFBEREITEN VOR SUBMIT
//
// ----------------------------------
function pushDate() {
	if (isMobile()) {
		if ($('#bookingstart').val()) $('#arrivalDate').val(formatDateMobil($('#bookingstart').val()));
		if($('#bookingend').val())$('#departureDate').val(formatDateMobil($('#bookingend').val()));
		if($('#bookingstart-private').val())$('#arrivalDate-private').val(formatDateMobil($('#bookingstart-private').val()));
		if($('#bookingend-private').val())$('#departureDate-private').val(formatDateMobil($('#bookingend-private').val()));
		if($('#bookingstart-business').val())$('#arrivalDate-business').val(formatDateMobil($('#bookingstart-business').val()));
		if($('#bookingend-business').val())$('#departureDate-business').val(formatDateMobil($('#bookingend-business').val()));
	} else {
		if ($('#bookingstart').val()) $('#arrivalDate').val(formatDate($('#bookingstart').val()));
		if($('#bookingend').val())$('#departureDate').val(formatDate($('#bookingend').val()));
		if($('#bookingstart-private').val())$('#arrivalDate-private').val(formatDate($('#bookingstart-private').val()));
		if($('#bookingend-private').val())$('#departureDate-private').val(formatDate($('#bookingend-private').val()));
		if($('#bookingstart-business').val())$('#arrivalDate-business').val(formatDate($('#bookingstart-business').val()));
		if($('#bookingend-business').val())$('#departureDate-business').val(formatDate($('#bookingend-business').val()));
	}
}

function formatDate(formdate) {
	var newDate=formdate,newDateArr=newDate.split('.');
	newDate=newDateArr[2]+'-'+newDateArr[1]+'-'+newDateArr[0];return newDate;
}

function formatDateMobil(formdate) {
	var newDate=formdate,newDateArr=newDate.split('-');
	newDate = newDateArr[1]+'/'+newDateArr[2]+'/'+newDateArr[0];
	return newDate;
}