$(document).ready(function () {
    $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
        var target = $(e.target).attr("href");

        if (target == '#price_table') {
            resizePriceTable();
        }
    });

    $('.accommodation-details-thumbnail img').hover(
        function () {
            var sNewImgURL = $(this).attr('src');
            $('#accommodation_details_large_image').fadeOut(
                0, function () {
                    $(this).attr('src', sNewImgURL);
                }).
                fadeIn(150)
        },
        function () { }
    );

    /*$('input.update_search_results').click(function () {
        $('input#Offset').val(0);
        get_search_results();
    });*/

    $('select.update_search_results, input.update_search_results').change(function () {
        if ($(this).attr('name') == 'Destination') {
            $('input#DestinationWithoutAccommodations').val(0);
        }

        $('input#Offset').val(0);
        get_search_results();
    });

    $('a.update_search_results').click(function () {
        if ($(this).attr('name') == 'Destination') {
            $('input#DestinationWithoutAccommodations').val(0);
        }

        $('input#Offset').val(0);
        get_search_results();

        return false;
    });

    /*$('input[name="arrival_date"]').blur(function () {
        if ($(this).attr('name') == 'Destination') {
            $('input#DestinationWithoutAccommodations').val(0);
        }

        $('input#Offset').val(0);
        get_search_results();
    });*/

    $('button.btn-search-homepage').click(function () {
        window.location = $('select#Destination option:selected').attr('data-deeplink');
        return false;
    });

    $(document).scroll(function () {
        if ($(document).scrollTop() > 0) {
            $('.topbar').addClass('fixed-top');
            $('#height-spacer').show();
        } else {
            $('.topbar').removeClass('fixed-top');
            $('#height-spacer').hide();
        }
    });

    $(document).on('click', '.btnSaveTravelGroupDobs', function () {
        var bSetRoomLayout = $(this).attr('data-setRoomLayout');

        $.ajax({
            url: sBase + 'ajax/ajax.php?Request=book_accommodation.details',
            data: $('form#formTravelGroupDobs').serialize(),
            type: 'post',
            beforeSend: function () { showLoading('booking'); }
        })
            .done(
                function (sBookingHTML) {

                    $('#booking').html(sBookingHTML).fadeIn(150);

                    if (bSetRoomLayout == 1) {
                        scrollTo('booking-slip-roomlayout-section');
                    } else {
                        scrollTo('booking-slip-price-section');
                    }
                }
            )
    });

    $(document).on('click', '.showMPDInfo', function () {
        var oInfoDialog = $('<div><p>' + $(this).attr('data-text') + '</p></div>');

        oInfoDialog.dialog({
            title: 'Kinderkorting informatie',
            autoOpen: true,
            modal: true,
            width: 500,
            height: 500,
            buttons: [{
                text: 'OK',
                click: function () {
                    oInfoDialog.dialog('close');
                    oInfoDialog.remove();
                }
            }]
        });
    });

    $(document).on('click', '.btnBookingProcess_SaveTravelGroup', function () {
        $.ajax({
            url: sBase + 'ajax/ajax.php?Request=complete_booking_step1',
            data: $('form#form_TravelGroupData').serialize(),
            type: 'post',
            beforeSend: function () { showLoading('bookingprocess'); }
        })
            .done(function (sBookingProcessHTML) {
                $('#bookingprocess').html(sBookingProcessHTML);
            });
    });

    $(document).on('click', '.changeBooker', function () {
        var iBookingPersonId = $(this).val();
        showLoading('bookingprocess');

        $.ajax({
            url: sBase + 'ajax/ajax.php?Request=complete_booking_step1',
            data: 'setBooker=1&BookingPersonId=' + iBookingPersonId,
            type: 'post'
        })
            .always(function (sBookingProcessHTML) {
                $('#bookingprocess').html(sBookingProcessHTML);
            });

    });

    $(document).on('click', '.btnBookingProcess_SaveBooker', function () {
        $.ajax({
            url: sBase + 'ajax/ajax.php?Request=complete_booking_step2',
            data: $('form#form_BookerData').serialize(),
            type: 'post',
            beforeSend: function () { showLoading('bookingprocess'); }
        })
            .done(function (sBookingProcessHTML) {
                $('#bookingprocess').html(sBookingProcessHTML);
            });
    });

    $(document).on('click', '.btnSaveRoomGrouping', function () {
        var errors = '';

        $('.finalRoomGroup').each(function () {
            var inputContainer = $(this).closest('td').find('input');
            var personsInRoom = $('li', $(this)).length;
            var minPersonsInRoom = inputContainer.attr('data-minPopulation');

            if (personsInRoom < minPersonsInRoom) {
                errors = errors + inputContainer.attr('data-roomName') + '%' + minPersonsInRoom + '|';
            }

            $('li', $(this)).each(function () {
                inputContainer.attr('value', inputContainer.attr('value') + $(this).attr('data-bookingPersonId') + '|');
            });
        });

        if (errors == '') {
            $.ajax({
                url: sBase + 'ajax/ajax.php?Request=book_accommodation.details',
                data: $('form#formTravelGroupRoomGrouping').serialize(),
                type: 'post',
                beforeSend: function () { showLoading('booking'); }
            })
                .done(function (sBookingHTML) {
                    $('#booking').html(sBookingHTML);
                    scrollTo('booking-slip-price-section');
                });
        } else {
            var errorRooms = errors.split('|');
            var errorList = 'Beste bezoeker,<br/><br/>Helaas kunnen we jouw prijs op dit moment nog niet berekenen. De opgegeven kamerindeling is ongeldig. We raden je aan om je reisgezelschap in te delen zoals hieronder aangegeven. Uiteraard kunt je ook telefonisch contact met ons opnemen.<br/><br/><ul>';

            for (i = 0; i < errorRooms.length - 1; i++) {
                var errorDetails = errorRooms[i].split('%');

                errorList = errorList + '<li>De minimale bezetting voor kamer "' + errorDetails[0] + '" is ' + (errorDetails[1] == 1 ? '1 persoon' : errorDetails[1] + ' personen') + '.</li>';
            }

            var errorList = errorList + '</ul>';

            var errorDialog = $('<div>' + errorList + '</div>');
            errorDialog.dialog({
                autoOpen: true,
                modal: true,
                title: 'Ongeldige kamer/unit-indeling',
                width: 550,
                buttons: [{
                    text: 'OK',
                    click: function () {
                        errorDialog.dialog('close');
                        errorDialog.remove();
                    }
                }]
            });
        }
    });

    $(document).on('click', '.btnDeleteAccommodationFromBooking', function () {
        var confirmationDialog = $('<div>Weet je zeker dat je deze accommodatie wilt verwijderen uit je boeking?</div>');
        var iBookingAccommodationId = $(this).attr('data-bookingAccommodationId');

        confirmationDialog.dialog({
            autoOpen: true,
            modal: true,
            title: 'Accommodatie werkelijk verwijderen?',
            width: 550,
            buttons: [
                {
                    text: 'Annuleren',
                    click: function () {
                        $(this).dialog('close');
                        confirmationDialog.remove();
                    }
                },
                {
                    text: 'Ja',
                    click: function () {
                        $.ajax({
                            url: sBase + 'ajax/ajax.php?Request=book_accommodation.details',
                            data: 'deleteBookingAccommodation=1&BookingAccommodationId=' + iBookingAccommodationId,
                            type: 'post',
                            beforeSend: function () { showLoading('booking'); }
                        })
                            .done(
                                function (sBookingHTML) {
                                    scrollTo('booking-slip-top-section');
                                    $('#booking').html(sBookingHTML).fadeIn(150);
                                    confirmationDialog.dialog('close');
                                    confirmationDialog.remove();
                                }
                            )
                    }
                }
            ]
        });
    });

    $(document).on('click', '.btnDeleteRoomFromBooking', function () {
        var confirmationDialog = $('<div>Weet je zeker dat je deze kamer wilt verwijderen uit je boeking?</div>');
        var iBookingAccommodationId = $(this).attr('data-bookingAccommodationId');
        var iBookingRoomId = $(this).attr('data-bookingRoomId');

        confirmationDialog.dialog({
            autoOpen: true,
            modal: true,
            title: 'Kamer werkelijk verwijderen?',
            width: 550,
            buttons: [
                {
                    text: 'Annuleren',
                    click: function () {
                        $(this).dialog('close');
                        confirmationDialog.remove();
                    }
                },
                {
                    text: 'Ja',
                    click: function () {
                        $.ajax({
                            url: sBase + 'ajax/ajax.php?Request=book_accommodation.details',
                            data: 'deleteBookingRoom=1&BookingAccommodationId=' + iBookingAccommodationId + '&BookingRoomId=' + iBookingRoomId,
                            type: 'post',
                            beforeSend: function () { showLoading('booking'); }
                        })
                            .done(
                                function (sBookingHTML) {
                                    scrollTo('booking-slip-top-section');
                                    $('#booking').html(sBookingHTML).fadeIn(150);
                                    confirmationDialog.dialog('close');
                                    confirmationDialog.remove();
                                }
                            )
                    }
                }
            ]
        });
    });

    $(document).on('click', '.search_result_paginate', function () {
        $('html,body').animate({
            scrollTop: 0
        }, 250);

        $('input#Offset').val($(this).attr('data-offset'));
        get_search_results();

        return false;
    });

    $(document).on('click', '.change-price-table-viewstate', function () {
        var mCareTypeCode = $(this).attr('data-care-type');
        load_price_table($(this).attr('data-accommodation-id'), $(this).attr('data-month'), mCareTypeCode);

        if (mCareTypeCode === undefined || mCareTypeCode === false) {
            $('ul.nav-pills li.active').removeClass('active');
            $(this).parent('li').addClass('active');
        }
    });

    $(document).on('click', '.book-accommodation', function () {
        $.ajax({
            url: sBase +
                'ajax/ajax.php?Request=book_accommodation' +
                '&AccommodationId=' + $(this).attr('data-accommodation-id') +
                '&PricePeriodId=' + $(this).attr('data-priceperiod-id') +
                '&RoomTypeId=' + $(this).attr('data-roomtype-id') +
                '&Duration=' + $(this).attr('data-duration') +
                '&CareTypeId=' + $(this).attr('data-caretype-id') +
                '&ArrivalTimestamp=' + $(this).attr('data-arrival-timestamp'),
            beforeSend: function () { showLoading('booking'); }
        })
            .done(function (sBookingHTML) {
                console.log(sBookingHTML);
                scrollTo('booking-slip-top-section');
                $('#booking').html(sBookingHTML).fadeIn(150);
            });

        return false;
    });

    $(document).on('click', '.showPaymentInfo', function () {
        var clickedContainer = $(this).attr('data-container');

        $('#' + clickedContainer).fadeIn('fast');

        $('.showPaymentInfo').each(function () {
            var thisContainer = $(this).attr('data-container');
            if (thisContainer != clickedContainer) {
                $('#' + thisContainer).hide();
            }
        });
    });

    $(document).on('click', '.btnBook', function () {
        var bAgreedToTaC = $('#TermsAndConditions').prop('checked');
        var bPaymethodSelected = $('input[name="PaymentOption"]').is(':checked');

        if (bPaymethodSelected === false) {
            $('#error_Paymethod').fadeIn('fast');
        } else {
            $('#error_Paymethod').hide();
        }


        if (bAgreedToTaC === false) {
            $('#error_TermsAndConditions').fadeIn('fast');
        } else {
            $('#error_TermsAndConditions').hide();
        }

        if (bAgreedToTaC === true && bPaymethodSelected === true) {
            var oProcessingDialog = $('<div class="text-center"><i class="fa fa-spinner fa-spin"></i> Een ogenblik geduld alsjeblieft...</div>');

            oProcessingDialog.dialog({
                autoOpen: true,
                width: 300,
                height: 60,
                modal: true,
                dialogClass: 'hidden-titlebar'
            });

            $.ajax({
                url: sBase + 'ajax/ajax.php?Request=complete_booking_finalize',
                data: $('form#form_FinalizeBooking').serialize(),
                type: 'post',
                beforeSend: function () {
                    oProcessingDialog.dialog('open');
                }
            })
                .done(
                    function (sResponse) {
                        console.log(sResponse);
                        var oResponse = JSON.parse(sResponse);
                        oProcessingDialog.dialog('close');
                        oProcessingDialog.remove();

                        if (oResponse.state === true && oResponse.code == 'EndPoint') {
                            window.location = oResponse.data.url;
                        } else {
                            if (oResponse.code == 'MissingAmount') {
                                $('#error_Paymethod').hide();
                                $('#error_Paymethod').html('Als gevolg van broncodemanipulatie werd een ongeldige betalingswaarde meegestuurd. Vernieuw de pagina en probeer het opnieuw.');
                                $('#error_Paymethod').fadeIn('fast');
                            }

                            if (oResponse.code == 'IssuerManipulation') {
                                $('#error_Paymethod').hide();
                                $('#error_Paymethod').html('Als gevolg van broncodemanipulatie werd een ongeldige issuer-code meegestuurd. Vernieuw de pagina en probeer het opnieuw.');
                                $('#error_Paymethod').fadeIn('fast');
                            }

                            if (oResponse.code == 'AmountManipulation') {
                                $('#error_Paymethod').hide();
                                $('#error_Paymethod').html('Als gevolg van broncodemanipulatie werd een ongeldige betalingswaarde meegestuurd. Vernieuw de pagina en probeer het opnieuw.');
                                $('#error_Paymethod').fadeIn('fast');
                            }

                            if (oResponse.code == 'iDEALException') {
                                $('#error_Paymethod').hide();
                                $('#error_Paymethod').html('Tijdens het initieren van je transactie via iDEAL is een fout opgetreden. Wij zijn inmiddels op de hoogte gebracht van de foutmelding.');
                                $('#error_Paymethod').fadeIn('fast');
                            }

                            if (oResponse.code == 'PartnerCommunication') {
                                $('#error_General').hide();
                                $('#error_General').html(oResponse.data);
                                $('#error_General').fadeIn('fast');
                            }

                            if (oResponse.code == 'AllotmentIssue') {
                                var sHTML = '<ul style="list-style:disc; padding: 15px;">';
                                for (i = 0; i < oResponse.data.length; i++) {
                                    sHTML = sHTML + '<li>' + oResponse.data[i][0] + ', kamer: ' + oResponse.data[i][1] + '.</li>';
                                }

                                sHTML = sHTML + '</ul>';

                                $('#error_General').hide();
                                $('#error_General').html('Tijdens een laatste voorraadcontrole is gebleken dat we voor onderstaande kamer/unit in je boeking onvoldoende voorraad hebben. Dit kan voorkomen indien deze kamer/unit gelijktijdig met je boeking elders gereserveerd is. Indien je wilt, vragen we graag een extra kamer/unit aan bij de accommodatie zodat je alsnog je boeking af kunt ronden. Neem hiervoor contact op met onze klantenservice.<br/>' + sHTML);
                                $('#error_General').fadeIn('fast');
                            }
                        }
                    }
                );
        }
    });

    $(document).on('click', '.btnBookingProcess_Previous', function () {
        var iStepNumber = $(this).attr('data-step');

        if (iStepNumber == 1 || iStepNumber == 2) {
            $.ajax({
                url: sBase + 'ajax/ajax.php?Request=complete_booking_step' + iStepNumber,
                beforeSend: function () { showLoading('bookingprocess'); }
            })
                .done(function (sBookingProcessHTML) {
                    $('#bookingprocess').html(sBookingProcessHTML);
                });
        } else {
            return false;
        }
    });

    $('.toggle-submenu').hover(
        function () {
            $('div#' + $(this).attr('data-submenu')).slideDown('fast');
        },
        function () {
            $('div#' + $(this).attr('data-submenu')).slideUp('fast');
        }
    );

    $(document).on('click', '.showTerms', function (e) {
        var oInfoDialog = $('<div><p>' + $('#terms').html() + '</p></div>');

        oInfoDialog.dialog({
            title: 'Algemene voorwaarden',
            autoOpen: true,
            modal: true,
            width: 500,
            height: 500,
            buttons: [{
                text: 'OK',
                click: function () {
                    oInfoDialog.dialog('close');
                    oInfoDialog.remove();
                }
            }]
        });

        e.preventDefault();
        return false;
    });

    $(document).on('keyup', '#search_all_query', delay(function (e) {
        if (e.key !== 'Escape' && $('#search_all_query').val().length >= 3) {
            $.ajax({
                url: sBase + 'ajax/ajax.php?Request=overall_search&q=' + $('#search_all_query').val(),
            })
                .done(function (response) {
                    var data = JSON.parse(response);
                    var countPlural = data.length == 1 ? 'resultaat' : 'resultaten';
                    var listHtml = '<div><h3 style="padding: 15px;">' + data.length + ' ' + countPlural + '</h3></div><ul>';

                    $.each(data, function (key, entry) {
                        var query = $('#search_all_query').val();
                        var regex = new RegExp(`(${query})+`, 'gi');
                        listHtml += '<li><a href="' + entry.deeplink + '"><span class="title">' + entry.title.replace(regex, '<strong>$1</strong>') + '</span> <span class="type">' + entry.type + '</span></a></li>';
                    });

                    listHtml += '</ul>';

                    $('#search_all_results').html(listHtml).fadeIn();
                });
        } else {
            hideSearchResults();
        }
    }, 200));

    $(document).on('keyup', '#search_all_query_mobile', delay(function (e) {
        if (e.key !== 'Escape' && $('#search_all_query_mobile').val().length >= 3) {
            $.ajax({
                url: sBase + 'ajax/ajax.php?Request=overall_search&q=' + $('#search_all_query_mobile').val(),
            })
                .done(function (response) {
                    var data = JSON.parse(response);
                    var countPlural = data.length == 1 ? 'resultaat' : 'resultaten';
                    var listHtml = '<div><h3 style="padding: 15px;">' + data.length + ' ' + countPlural + '</h3></div><ul>';

                    $.each(data, function (key, entry) {
                        var query = $('#search_all_query_mobile').val();
                        var regex = new RegExp(`(${query})+`, 'gi');
                        listHtml += '<li><a href="' + entry.deeplink + '"><span class="title">' + entry.title.replace(regex, '<strong>$1</strong>') + '</span> <span class="type">' + entry.type + '</span></a></li>';
                    });

                    listHtml += '</ul>';

                    $('#search_all_results_mobile').html(listHtml).fadeIn();
                });
        } else {
            hideSearchResults();
        }
    }, 200));

    $(document).on('click', function () {
        hideSearchResults();
    });

    $('body').on('keydown', function (e) {
        if (e.key === 'Escape') {
            hideSearchResults();
        }
    });

    $(document).on('click', '.reset_arrival_date', function () {
        $('#arrival_date').val('');
        //get_search_results();
    });
});

function get_search_results() {
    var search = true;
    var roomPropagation = $('select[name="all_in_same_room"]').val();
    var arrivalDate = $('input[name="arrival_date"]').val();

    if (roomPropagation == '0' && arrivalDate == '') {
        search = false;
        var oInfoDialog = $('<div><p>Wanneer je meerdere kamers wilt boeken voor je reisgezelschap is het nodig om een aankomstdatum in te vullen om daarbij de actuele beschikbaar te kunnen tonen.</p></div>');

        oInfoDialog.dialog({
            title: 'Zoeken naar meerdere kamers',
            autoOpen: true,
            modal: true,
            width: 500,
            //height: 500,
            buttons: [{
                text: 'Ok',
                click: function () {
                    oInfoDialog.dialog('close');
                    oInfoDialog.remove();
                }
            }]
        });
    }

    if (arrivalDate != '') {
        var date = new Date(arrivalDate);
        var day = date.getDate();
        var month = date.getMonth() + 1;
        var summerMonths = [4, 5, 6, 7, 8, 9, 10];
        var winterMonths = [1, 2, 3, 4, 11, 12];
        var season = window.location.pathname.split('/')[1] == 'vakantie' ? 'Z' : 'W';
        var assistable = false;
        var toSeason = '';
        var fromSeason = '';
        var urlReplace = '';
        var urlReplaceWith = '';

        if (season == 'Z' && (summerMonths.indexOf(month) == -1 || (month == 4 && day < 16))) {
            // zoekdatum tussen 1-12 en 15-4, doe wintersuggestie
            assistable = true;
            toSeason = 'winter';
            fromSeason = 'zomer';
            urlReplace = '/vakantie';
            urlReplaceWith = '/wintersport';
        }

        if (season == 'W' && (winterMonths.indexOf(month) == -1 || (month == 4 && day > 15))) {
            // zoekdatum tussen 16-4 en 30-11, doe zomersuggestie
            assistable = true;
            toSeason = 'zomer';
            fromSeason = 'winter';
            urlReplace = '/wintersport';
            urlReplaceWith = '/vakantie';
        }

        if (assistable) {
            search = false;
            var oInfoDialog = $('<div><p>Het lijkt erop dat je wilt zoeken in ons ' + toSeason + 'aanbod, maar je bevindt je in het ' + fromSeason + 'gedeelte. Wil je omschakelen naar ons ' + toSeason + 'aanbod en daar zoeken?</p></div>');

            oInfoDialog.dialog({
                title: 'Mogen we proberen te helpen?',
                autoOpen: true,
                modal: true,
                maxWidth: 500,
                //height: 500,
                buttons: [{
                    text: 'Hier blijven',
                    click: function () {
                        oInfoDialog.dialog('close');
                        oInfoDialog.remove();
                        sendSearchRequest();
                    }
                },
                {
                    text: 'Naar ' + toSeason + 'aanbod',
                    click: function () {
                        $.ajax({
                            url: sBase + 'ajax/ajax.php?Request=get_search_results_preload&seasonChange=1&' + ($('form#search_parameters').serialize())
                            //beforeSend: function () { showLoading('search_results'); }
                        })
                            .done(function () {
                                oInfoDialog.dialog('close');
                                oInfoDialog.remove();
                                window.location = window.location.href.replace(urlReplace, urlReplaceWith);

                            });

                    }
                }]
            });
        }
    }

    if (search) {
        sendSearchRequest();
    }
}

function sendSearchRequest() {
    $.ajax({
        url: sBase + 'ajax/ajax.php?Request=get_search_results_preload&' + ($('form#search_parameters').serialize()),
        beforeSend: function () { showLoading('search_results'); }
    })
        .done(function (sHTML) {
            $('#search_results').html(sHTML);
        });
}

function hideSearchResults() {
    var searchResults = $('#search_all_results');

    if (searchResults.css('display') == 'block') {
        searchResults.fadeOut();
    }

    var searchResults = $('#search_all_results_mobile');

    if (searchResults.css('display') == 'block') {
        searchResults.fadeOut();
    }
}

function showLoading(selector) {
    $('#' + selector).hide();
    $('#' + selector).html('<div class="text-center"><br/><i class="fa fa-spinner fa-spin fa-2x"></i><br/>Een ogenblik geduld a.u.b.</div>');
    $('#' + selector).show();
}

function delay(callback, ms) {
    var timer = 0;
    return function () {
        var context = this, args = arguments;
        clearTimeout(timer);
        timer = setTimeout(function () {
            callback.apply(context, args);
        }, ms || 0);
    };
}

function scrollTo(selector) {
    $(document).ready(function () {
        $('html, body').animate({
            scrollTop: $('#' + selector).offset().top - $('div#topbar').height()
        }, 750);
    });
}

function update_markers_deprecated() {
    var map = $('#maps_canvas_search').data('map');
    var bounds = new google.maps.LatLngBounds();
    map.clearMarkers();


    $('.search-request-result-accommodation', document).each(function () {
        var oLatLng = new google.maps.LatLng($(this).attr('data-latitude'), $(this).attr('data-longitude'));
        var marker = new google.maps.Marker({
            position: oLatLng,
            map: map,
            icon: sBase + 'layout/media/map_marker.png',
            url: $(this).attr('data-deeplink')
        });
        map.markers.push(marker);
        bounds.extend(oLatLng);

        google.maps.event.addListener(marker, 'click', function () {
            window.location.href = marker.url;
        });
    });

    map.fitBounds(bounds);
}

function remove_markers() {
    var map = $('#maps_canvas_search').data('map');
    map.clearMarkers();
    map.panTo(new google.maps.LatLng(47.225164, 10.851316));
    map.setZoom(7);
}

function showFraction(iFractionNumber) {
    $('#PriceTable_Part_' + iFractionNumber).fadeIn();
}

function hideFraction(iFractionNumber) {
    $('#PriceTable_Part_' + iFractionNumber).hide();
}

function render_map(sDOMId, iZoomLevel) {
    var aGoogleMapsStyle = [{
        featureType: "all",
        elementType: "geometry",
        stylers: [
            { visibility: 'on' },
            { hue: '#ff9900' },
            { saturation: -61 },
            { weight: 0.4 }
        ]
    }, {
        featureType: 'administrative.country',
        elementType: 'geometry.stroke',
        stylers: [
            { 'weight': 2.5 }
        ]
    }];

    var oAccommodationLatLng = new google.maps.LatLng(
        $('#' + sDOMId).attr('data-latitude'),
        $('#' + sDOMId).attr('data-longitude'));

    if (typeof iZoomLevel != 'undefined') {
        var mapOptions = {
            center: oAccommodationLatLng,
            disableDefaultUI: true,
            styles: aGoogleMapsStyle,
            zoom: iZoomLevel
        };
    } else {
        var mapOptions = {
            center: oAccommodationLatLng,
            disableDefaultUI: true,
            styles: aGoogleMapsStyle
        };
    }

    var map = new google.maps.Map(document.getElementById(sDOMId), mapOptions);
    $('#' + sDOMId).data('map', map);

    map.markers = [];
    var marker = new google.maps.Marker({
        position: oAccommodationLatLng,
        map: map,
        icon: sBase + 'layout/media/map_marker.png'
    });
    map.markers.push(marker);
    google.maps.event.trigger(map, "resize");
}

function load_price_table(iAccommodationId, iMonth, sCareType) {
    $.ajax({
        url: sBase + 'ajax/ajax.php?Request=get_price_table&AccommodationId=' + iAccommodationId + '&Month=' + iMonth + '&CareType=' + sCareType,
        beforeSend: function () { showLoading('accommodation_price_table_output') }
    })
        .done(function (sPriceTableHTML) {
            console.log('call done.');
            $('#accommodation_price_table_output').html(sPriceTableHTML);
            console.log('resizing table..');
        });
}

if (typeof google != 'undefined') {
    google.maps.Map.prototype.clearMarkers = function () {
        for (var i = 0; i < this.markers.length; i++) {
            this.markers[i].setMap(null);
        }
        this.markers = new Array();
    };
}

function bindRoomGrouping() {
    $('.roomgrouping').sortable({
        connectWith: '.roomgrouping'
    }).disableSelection();
}

function update_markers(json) {
    var map = $('#maps_canvas_search').data('map');
    var bounds = new google.maps.LatLngBounds();
    map.clearMarkers();

    for (i = 0; i < json.length; i++) {
        var data = json[i];
        var latLng = new google.maps.LatLng(data.lat, data.lng);
        var marker = new google.maps.Marker({
            position: latLng,
            map: map,
            icon: sBase + 'layout/media/map_marker.png',
            url: '/'
        });
        var infoWindow = new google.maps.InfoWindow({
            content: ''
        });

        map.markers.push(marker);
        bounds.extend(latLng);

        bindInfoWindow(marker, map, infoWindow, data);
    }

    map.fitBounds(bounds);
}

var openInfoWindow = null;

function bindInfoWindow(marker, map, infoWindow, data) {
    google.maps.event.addListener(marker, 'click', function () {
        if (openInfoWindow != null) {
            openInfoWindow.close();
        }

        var classification = '';
        for (i = 0; i < data.classification[0]; i++) {
            classification += '<i class="fa fa-star" style="color: #f1c40f;"></i>';
        }
        if (data.classification.length > 1) {
            classification += '<i class="fa fa-star-half" style="color: #f1c40f;"></i>';
        }
        console.log(data);
        console.log(data.classification.length);
        console.log(classification);

        infoWindow.setContent('<strong>' + data.name + ' ' + classification + '</strong><br/><table width="275"><tr><td width="130"><img src="' + sBase + 'SiteManager3/Binaries/Image/Accommodations/' + data.img + '" width="120"/></td><td style="vertical-align: top;">' + data.countryName + ', ' + data.cityName + '<br/>Vanaf ' + data.priceFrom + ' ' + data.priceUnit + '<br/><a href="' + data.deeplink + '">Bekijken</a></td></tr></table>');
        infoWindow.open(map, marker);
        openInfoWindow = infoWindow;
    });
}

(function (d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/nl_NL/all.js#xfbml=1";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));