﻿$(document).ready(function () {
    var currentTab1 = "#tab-omschrijving";
    $(currentTab1).removeClass('object_tabs_content_c');
    $(currentTab1).addClass('object_tabs_content_c_active'); // Show the first div
    $('.object_tabs_tabs ul li:first').addClass('actief'); // Set the class of the first link to active
    $('.object_tabs_tabs ul li a').click(function () { //When any link is clicked

        var currentTab2 = $(this).attr('href'); // Set variable currentTab to value of href attribute of clicked link

        if (currentTab2 != "#tab-foto" && currentTab2 != "#tab-locatie" && currentTab2 != "#tab-plattegrond") {
            $('.object_tabs_tabs ul li').removeClass('actief'); // Remove active class from all links
            $(this).parent().addClass('actief'); //Set clicked link class to active
            $(currentTab1).removeClass('object_tabs_content_c_active');
            $(currentTab1).addClass('object_tabs_content_c');
            currentTab1 = currentTab2;
            $(currentTab2).removeClass('object_tabs_content_c');
            $(currentTab2).addClass('object_tabs_content_c_active');
        }
        return false;
    });
});
$(document).ready(function () {

    //select all the a tag with name equal to modal
    $('a[name=modal]').click(function (e) {
        //Cancel the link behavior
        e.preventDefault();
        //Get the A tag
        var id = $(this).attr('href');
        if (id == "#tab-locatie") {
            id = "#dialog";
        }

        //Get the screen height and width
        var maskHeight = $(document).height();
        var maskWidth = $(window).width();

        //Set height and width to mask to fill up the whole screen
        $('#mask').css({ 'width': maskWidth, 'height': maskHeight });

        //transition effect    
        $('#mask').fadeIn(500);
        $('#mask').fadeTo("fast", 0.8);

        //Get the window height and width
        var winH = $(window).height();
        var winW = $(window).width();

        //Set the popup window to center
        $(id).css('top', winH / 2 - $(id).height() / 2);
        $(id).css('left', winW / 2 - $(id).width() / 2);

        //transition effect
        $(id).fadeIn(1000);
        if (id == "#dialog") {
            initializee();
        }
    });

    //if close button is clicked
    $('.window .close_btn').click(function (e) {
        //Cancel the link behavior
        e.preventDefault();
        $('#mask, .window').hide();
    });

    //if mask is clicked
    $('#mask').click(function () {
        $(this).hide();
        $('.window').hide();
    });
    //select all the a tag with name equal to modal
    $('a[name=foto]').click(function (e) {
        //Cancel the link behavior
        e.preventDefault();
        //Get the A tag
        var id = $(this).attr('href');
        if (id == "#tab-foto" || id == "../#tab-foto") {
            id = "#gallery_container";
            $("#thumbImage").removeClass("Hidden");
            $("#bigImage").removeClass("Hidden");
            $("#thumbPlattegrond").addClass("Hidden");
            $("#bigPlattegrond").addClass("Hidden");
            settings();
        }

        //Get the screen height and width
        var maskHeight = $(document).height();
        var maskWidth = $(window).width();

        //Set height and width to mask to fill up the whole screen
        $('#mask').css({ 'width': maskWidth, 'height': maskHeight });

        //transition effect    
        $('#mask').fadeIn(500);
        $('#mask').fadeTo("fast", 0.8);

        //Get the window height and width
        var winH = $(window).height();
        var winW = $(window).width();

        //Set the popup window to center
        $(id).css('top', winH / 2 - $(id).height() / 2 -20);
        $(id).css('left', winW / 2 - $(id).width() / 2 -20);

        //transition effect
        $(id).fadeIn(1000);
        if (id == "#dialog") {
            initializee();
        }
    });

    //if close button is clicked
    $('.windowFoto .close_btn').click(function (e) {
        //Cancel the link behavior
        e.preventDefault();
        $('#mask, .windowFoto').hide();
    });

    //if mask is clicked
    $('#mask').click(function () {
        $(this).hide();
        $('.windowFoto').hide();
    });
    $('a[name=plattegrond]').click(function (e) {
        //Cancel the link behavior
        e.preventDefault();
        //Get the A tag
        var id = $(this).attr('href');
        if (id == "#tab-plattegrond") {
            id = "#gallery_container";
            $("#thumbImage").addClass("Hidden");
            $("#bigImage").addClass("Hidden");
            $("#thumbPlattegrond").removeClass("Hidden");
            $("#bigPlattegrond").removeClass("Hidden");
            settings();
        }

        //Get the screen height and width
        var maskHeight = $(document).height();
        var maskWidth = $(window).width();

        //Set height and width to mask to fill up the whole screen
        $('#mask').css({ 'width': maskWidth, 'height': maskHeight });

        //transition effect    
        $('#mask').fadeIn(500);
        $('#mask').fadeTo("fast", 0.8);

        //Get the window height and width
        var winH = $(window).height();
        var winW = $(window).width();

        //Set the popup window to center
        $(id).css('top', winH / 2 - $(id).height() / 2 -20);
        $(id).css('left', winW / 2 - $(id).width() / 2 -20);

        //transition effect
        $(id).fadeIn(1000);
        if (id == "#dialog") {
            initializee();
        }
    });

    //if close button is clicked
    $('.windowFoto .close_btn').click(function (e) {
        //Cancel the link behavior
        e.preventDefault();
        $('#mask, .windowFoto').hide();
    });

    //if mask is clicked
    $('#mask').click(function () {
        $(this).hide();
        $('.windowFoto').hide();
    });
    //select all the a tag with name equal to modal
    $('a[name=brochure]').click(function (e) {
        //Cancel the link behavior
        e.preventDefault();
        //Get the A tag
        var id = $(this).attr('href');
        if (id == "../#popup-brochure") {
            id = "#brochure";
        }

        //Get the screen height and width
        var maskHeight = $(document).height();
        var maskWidth = $(window).width();

        //Set height and width to mask to fill up the whole screen
        $('#mask').css({ 'width': maskWidth, 'height': maskHeight });

        //transition effect    
        $('#mask').fadeIn(500);
        $('#mask').fadeTo("fast", 0.8);

        //Get the window height and width
        var winH = $(window).height();
        var winW = $(window).width();

        //Set the popup window to center
        $(id).css('top', winH / 2 - $(id).height() / 2);
        $(id).css('left', winW / 2 - $(id).width() / 2);

        //transition effect
        $(id).fadeIn(1000);
    });

    //if close button is clicked
    $('.windowBrochure .close_btn').click(function (e) {
        //Cancel the link behavior
        e.preventDefault();
        $('#mask, .windowBrochure').hide();
    });

    //if mask is clicked
    $('#mask').click(function () {
        $(this).hide();
        $('.windowBrochure').hide();
    });
    //select all the a tag with name equal to modal
    $('a[name=woonwijk]').click(function (e) {
        //Cancel the link behavior
        e.preventDefault();
        //Get the A tag
        var id = $(this).attr('href');
        if (id == "#popup-woonwijk") {
            id = "#woonwijk";
        }

        //Get the screen height and width
        var maskHeight = $(document).height();
        var maskWidth = $(window).width();

        //Set height and width to mask to fill up the whole screen
        $('#mask').css({ 'width': maskWidth, 'height': maskHeight });

        //transition effect    
        $('#mask').fadeIn(500);
        $('#mask').fadeTo("fast", 0.8);

        //Get the window height and width
        var winH = $(window).height();
        var winW = $(window).width();

        //Set the popup window to center
        $(id).css('top', winH / 2 - $(id).height() / 2);
        $(id).css('left', winW / 2 - $(id).width() / 2);

        //transition effect
        $(id).fadeIn(1000);
    });

    //if close button is clicked
    $('.windowWoonwijk .close_btn').click(function (e) {
        //Cancel the link behavior
        e.preventDefault();
        $('#mask, .windowWoonwijk').hide();
    });

    //if mask is clicked
    $('#mask').click(function () {
        $(this).hide();
        $('.windowWoonwijk').hide();
    });
});
var x, y; //is voor de marker positie
var panoramX, panoramY; //is voor de positie van de camera
var place, panoramPosition; //place = marker positie, panoramPosition = camera positie
var marker;
var map;
var geocoder;
var hdng, ptch; //is voor het draaien van de camera (x en y-as)
var panorama;

function initializee() {
    fillVariables();    //Vullen van de variabelen x,y,panoramX, panoramY,hdng, ptch(allen met waarde uit de database) en geocoder.        
    var mapOptions = {
        zoom: 13,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        center: place
    };
    map = new google.maps.Map(document.getElementById("map_canvas"), // creeren van de map
            mapOptions);
    if (x != "") { //als er een x waarde bestaat -> nieuwe marker
        createMarker();
    }
    setPanorama();
};
function toggleStreetView() {
    var toggle = panorama.getVisible();
    if (toggle == false) {
        panorama.setVisible(true);
    } else {
        panorama.setVisible(false);
    }
}
function fillVariables() {
    x = document.getElementById("plhContent_x").value;
    y = document.getElementById("plhContent_y").value;
    panoramX = document.getElementById("plhContent_panoramX").value;
    panoramY = document.getElementById("plhContent_panoramY").value;
    hdng = document.getElementById("plhContent_heading").value;
    ptch = document.getElementById("plhContent_pitch").value;
    geocoder = new google.maps.Geocoder();
    if (x == "") {
        place = new google.maps.LatLng(52.17719507215181, 5.295238494873047);
    }
    else {
        place = new google.maps.LatLng(x, y);
    }
    if (hdng == "") {
        hdng = 270;
        ptch = 0;
    }
    if (panoramX == "") {
        panoramPosition = new google.maps.LatLng(52.17719507215181, 5.295238494873047);
    }
    else {
        panoramPosition = new google.maps.LatLng(panoramX, panoramY);
    }
}
function createMarker() {
    marker = new google.maps.Marker({
        map: map,
        draggable: false,
        animation: google.maps.Animation.DROP,
        position: place
    });
    map.setZoom(15);
}
function setPanorama() {
    panorama = map.getStreetView(); //panorama( streetview) instellingen
    panorama.setPosition(panoramPosition);
    panorama.setPov({
        heading: parseFloat(hdng), //draaien van de camera x-as
        zoom: 1,
        pitch: parseFloat(ptch) //draaien vand e camera y-as
    });
}

//google.maps.event.addDomListener(window, 'load', initializee);

var addthis_share = { templates: { twitter: '<%#Title %>: {{url}} @VanWijkMakSoest'} };

$(document).ready(function () {
    var selectedOption;

    $('.selectbox').each(function () {
        if ($(this).find("option:selected")) {
            selectedOption = $(this).find("option:selected").text();
        } else {
            selectedOption = $(this).find("select option:first-child").text();
        }
        $(this).find(".selectbox_selected").text(selectedOption);
    });


    $('.selectbox select').change(function () {
        selectedOption = $(this).find("option:selected").text();
        $(this).parent().find(".selectbox_selected").text(selectedOption);
        return true;
    });


    $('.selectbox select').focus(function () {
        $(this).parent().addClass("active");
    });
    $('.selectbox select').blur(function () {
        $(this).parent().removeClass("active");
    });
    $('.open_house_btn').hover(function () {
        $(".open_house_Expand").fadeIn("fast");
    });
    $('.open_house_btn').mouseleave(function () {
        $(".open_house_Expand").fadeOut("fast");
    });
    $('.DynamicBlockBtn').hover(function () {
        $(".DynamicBlockExpand").fadeIn("fast");
    });
    $('.DynamicBlockBtn').mouseleave(function () {
        $(".DynamicBlockExpand").fadeOut("fast");
    });

    $('.selectbox').click(function () {
        $(this).toggleClass("active");
    });
});
$(document).ready(function () {
    $(".team_member").click(function () {
        if ($(this).find(".tm_overlay").is(":visible")) {
            $(".tm_overlay").slideUp();
        } else {
            $(".tm_overlay").slideUp("fast");
            $(this).find(".tm_overlay").slideDown();
        }
    });
});
