$(document).ready(function () {
    //Below returns true if we are in the areasResponsive.aspx web page in desktop mode, otherwise false


    //Regardless of mode, if the url query reflects a certain area, the according accordion panel should be opened
    try {
        var urlParams = new URLSearchParams(window.location.search);

        if (window.location.pathname == '/areas.aspx' || window.location.pathname == '/engAreas.aspx') {

            switch (urlParams.get('area')) {
                case 'food':
                    $('.food').addClass('active');
                    return;
                    break;
                case 'lbu':
                    $('.lbu').addClass('active');
                    return;
                    break;
                case 'fishery':
                    $('.fish').addClass('active');
                    return;
                    break;
                case 'agriculture':
                    $('#initial-accordion-item').addClass('active');
                    return;
                    break;
            }
            //food is selected from Default.aspx
        }
    }
    catch(error){}

    if ((window.location.pathname == '/areas.aspx' || window.location.pathname == '/engAreas.aspx') && $(window).width() >= 900) {
        //Add class active to div 'jquery_accordion_content' connected to jordbruk
        $('#initial-accordion-item').addClass("active");
    }

    //Component Hero setup
    if (window.location.pathname == '/Default.aspx' || window.location.pathname == '/') {
        var slides = document.getElementsByClassName('slide');
        var pointContainer = document.getElementsByClassName('points')[slideNumber];
        for (i = 0; i < slides.length; i++) {
            slides[i].style.display = "none";
        }

        for (i = 0; i < slides.length; i++) {
            if (i == slideNumber) {
                pointContainer.innerHTML += '<img src="Images/herotest/point-open.png" style="min-width:0;width:initial;margin-left:2px;margin-right:2px;" />';
            }
            else {
                pointContainer.innerHTML += '<img src="Images/herotest/point.png" style="min-width:0;width:initial;margin-left:2px;margin-right:2px;" />';

            }

        }

        slides[0].style.display = "block";
        console.log('Kom hit');
        myVar = setInterval(myTimer, 15000);

    }
});

//Global variables

//Used by Component Hero
var slideNumber = 0;
var myVar;
var myTimer;

//Function used by component Hero to change slides (and dot-structure) when user has pressed buttons
function changeSlide(a) {
    clearInterval(myVar);
    myVar = setInterval(myTimer, 15000);
    var slides = document.getElementsByClassName('slide');
    slideNumber = slideNumber + a;

    if (slideNumber < 0) {
        slideNumber = slides.length - 1;
    }
    else if (slideNumber > slides.length - 1) {
        slideNumber = 0;
    }
    for (i = 0; i < slides.length; i++) {
        slides[i].style.display = "none";
    }

    slides[slideNumber].style.display = "block";
}

//Function used by component Hero to show next slide (and dot-structure) at given intervals
function myTimer() {
    slideNumber++;
    var slides = document.getElementsByClassName('slide');
    if (slideNumber == slides.length) {
        slideNumber = 0;
    }
    console.log(slideNumber);

    for (i = 0; i < slides.length; i++) {
        slides[i].style.display = "none";
    }

    slides[slideNumber].style.display = "block";

    //Add points
    //1 Find containing div
    var pointContainer = document.getElementsByClassName('points')[slideNumber];
    
    //Empty container
    pointContainer.innerHTML = '';

    //Add dots=number of slides, and make the current one stand out
    for (i = 0; i < slides.length; i++) {

        //If current slide, make dot stand out
        if (i == slideNumber) {
            pointContainer.innerHTML += '<img src="Images/herotest/point-open.png" style="min-width:0;width:initial;margin-left:2px;margin-right:2px;" />';
        }
        //If not current slide, make dot that does not stand out
        else {
            pointContainer.innerHTML += '<img src="Images/herotest/point.png" style="min-width:0;width:initial;margin-left:2px;margin-right:2px;" />';
        }
    }
}

function searchFocus(x) {
    x.value = "";
}

$("body").click(function () {
    $(".navigation").addClass("s-hide");
    $("#filterBox").addClass("s-hide");
    $("#publ-info-text").addClass("s-hide");

});

$(".hamburger>a").click(function (event) {
    event.stopPropagation();
    $(".navigation").toggleClass("s-hide");
    $("#filterBox").addClass("s-hide");
    $("#publ-info-text").addClass("s-hide");
    $("#search-mob").addClass("s-hide");
    //console.log($(".navigation").hasClass("s-hide"));
    if ($("#navigation").hasClass("s-hide") === false) {
        $('html, body').animate({
            scrollTop: ($('#nav-mob').offset().top)
        }, 500);
    }
});

$("#magnifier-mob").click(function (event) {
    event.stopPropagation();
    $("#search-mob").toggleClass("s-hide");
    $("#filterBox").addClass("s-hide");
    $("#publ-info-text").addClass("s-hide");
    $(".navigation").addClass("s-hide");

});

$("#filterButton").click(function (event) {
    event.stopPropagation();
    $("#filterBox").toggleClass("s-hide");
    $(".navigation").addClass("s-hide");
    $("#publ-info-text").addClass("s-hide");
    $("#search-mob").addClass("s-hide");
    //TODO: Only enable scroll if element was shown,  and is now hidden
    if ($("#filterBox").hasClass("s-hide") === false) {
        $('html, body').animate({
            scrollTop: ($('#filterButton').offset().top)
        }, 500);
    }

});

$("#filterBox").click(function (event) {
    event.stopPropagation();
});

$("#publ-info-button").click(function (event) {
    event.stopPropagation();
    $("#publ-info-text").toggleClass("s-hide");
    $(".navigation").addClass("s-hide");
    $("#filterBox").addClass("s-hide");
    $("#search-mob").addClass("s-hide");
    //TODO: Only enable scroll if element was shown, and is now hidden
    if ($("#publ-info-text").hasClass("s-hide") === false) {
        $('html, body').animate({
            scrollTop: ($('#publ-info-button').offset().top)
        }, 500);
    }
});

$(".message").click(function (event) {

    $("#confirmUpdate").hide().fadeIn(400).delay(1000).fadeOut(400);
});

//Component accordion
//Author: Kristian Sundström (2018)

$('.jquery_accordion_title').click(function (event) {
    event.stopPropagation();
    //Check if .jquery_accordion_content that is next sibling to clicked '.jquery_accordion_title' has .active
    //If it has, remove .active and .page-load, and then exit function
    //This is so that clicking an already open accordion pane will close it
    if ($(this).next().hasClass('active') && !($(this).next().hasClass('page-load'))) {
        $(this).next().removeClass('active');
        return;
    }

    //Remove 'active' class from all .jquery_accordion_content
    $('.jquery_accordion_content').each(function () {
        $(this).removeClass('active');
        //$(this).removeClass('page-load');
    });

    //Add 'active' class to .jquery_accordion_content that is next sibling to the currently clicked '.jquery_accordion_title'
    $(this).next().addClass('active');
    //TODO: Set "Om" as default tab and display its accoring panel
    $('html, body').animate({
        scrollTop: 0
    }, 500);
});

//Component tabs
//Author: Kristian Sundström (2018)

//If you click on one of the tabs, it will change color, and its corresponding (as given by the rel attribute) panel will show while the others will close
$('.ctabs_tabs>ul>li>a').click(function () {

    //remove class activeButton from all ctabs_tabBtn (a-elements)

    //Get all relevant ctabs_tabBtn a elements
    //var aElements = document.getElementsByClassName('ctabs_tabBtn');

    //Loop through elements and remove class=ctabs_activeBtn
    //for (var i = 0; i < aElements.length; i++) {
    //    aElements[i].classList.remove('ctabs_activeBtn');
    //}

    //Remove class=ctabs_activeBtn from other tabs in the relevant accordion pane
    $(this).parent().siblings().each(function () {
        $(this).children(":first").removeClass('ctabs_activeBtn');
    });

    //Add class=ctabs_activeBtn to the clicked tab
    $(this).addClass('ctabs_activeBtn');

    //Get which panel should be active
    var activePanel = $(this).parent().attr('rel');

    //Make relevant panel visible, and remove visibility of all other panels within the relevant accordion pane
    $("#" + activePanel).addClass('ctabs_active').siblings().each(function () {
        $(this).removeClass("ctabs_active");

    });

    /* Component cookie-consent */
    /* Javascript, jQuery required*/
    /* Author: Kristian Sundström (2019) */

    //If consent box (id="accept-cookies") accepted, remove surrounding div (id="cookie-consent") and set cookie to 1 (=accepted)






    //Former functionality where 'ctabs_active' was removed from all panels in all accordion panes
    //Get all panels
    //var panels = document.getElementsByClassName('ctabs_panel');

    //Remove active for all panels except the one that should be active
    //for (var i = 0; i < panels.length; i++) {
    //    //If ID of current panel matches the activePanel, then make panel active
    //    if (panels[i].getAttribute('id') === activePanel) {
    //        panels[i].classList.add('ctabs_active');
    //    } else {
    //        panels[i].classList.remove('ctabs_active');
    //    }
    //}
    return false;
});

//If cookie does not exist/has the wrong value, display consent box
if (getCookie("cookie-consent") != "1") {
    $("#cookie-consent").css("display", "block");
}

//Help function that returns value of cookie if cookie 'name' exists, else returns null
function getCookie(name) {
    var v = document.cookie.match('(^|;) ?' + name + '=([^;]*)(;|$)');
    //console.log(v);
    return v ? v[2] : null;
}
$("#accept-cookies").click(function () {
    console.log("Kom hit");
    $("#cookie-consent").css("display", "none");
    //Calculate expiry date to 1 year from now
    var now = new Date();
    var time = now.getTime();
    time += 60 * 60 * 24 * 365 * 1000;
    now.setTime(time);
    //Set cookie to 1 and add expiry date
    document.cookie = 'cookie-consent=1;expires=' + now.toUTCString();
});