

function fn_RssFeeds() {
    var RSS = [];
    var CACHE = [];
    var NEWS = [];
    RSS.News = $.ajax("https://www.co.monterey.ca.us/Home/Components/RssFeeds/RssFeed/View?id=2").done( function() {
        var i = 1;
        var newsCount = 1;
        CACHE.News = [];
        var xmlDoc = $.parseXML(RSS.News.responseText);
        $xml = $(xmlDoc);
        $xml.find("item").each(function() {
            if(i<4) {
                var temp = $(this).find("link")[0];
                var url = $(temp).text();

                var str1 = "https://www.co.monterey.ca.us/Home/Components/News/News/";
                var str2 = "/";
                var navid = url.substr( url.indexOf( str1 ) + str1.length );
                navid = navid.substr( 0, navid.indexOf(str2) );

                NEWS[i] = [];
                NEWS[i]['navid'] = navid;
                NEWS[i]['url'] = url + "9711";

                temp =  $(this).find("title")[0];
                NEWS[i]['title'] = $(temp).text();


                
                console.log(i + ". Item: " + NEWS[i]['title']);
                console.log(i + ". Adding to Cache: " + url);

                CACHE.News[i] = $.ajax(url).done( function (data) {
                    console.log(data);
                    var str1 = "Home%2fComponents%2fNews%2fNews%2f";
                    var str2 = "%2f";
                    var navid = data.substr( data.indexOf( str1 ) + str1.length );
                    navid = navid.substr( 0, navid.indexOf(str2) );
					/*if(NEWS[newsCount]['navid'] === navid){
						NEWS[newsCount]['image'] = $(data).find("img[src^='/Home']").attr("src");

						if(NEWS[newsCount]['image'] == undefined) {
							NEWS[newsCount]['image'] = "/Home/ShowPublishedImage/24801";        
						}
					}*/
                    //const index = NEWS.findIndex(e => e['navid'] === navid);
                    NEWS.forEach(e => {
                        if(e['navid'] === navid){
                            e['image'] = $(data).find("img[class^='news-thumbnail']").attr("src");
                            if(e['image'] == undefined) {
                                e['image'] = "/Home/ShowPublishedImage/24801";        
                            }                            
                        }
                    } )
                    console.log("NavID: " + navid);
                    console.log(newsCount + ". Image: " + $(data).find("img[src^='/Home']").attr("src") );
					console.log(NEWS[newsCount]['image'])
                    newsCount++;

                    if(newsCount == 4) {
                        
                        console.log (NEWS);
                        updateContent(NEWS);
                    }
                    
                });

                i++;
            }
        });
    });

    function updateContent(NEWS) {

        // start count
        var count = 1;
        var label = 'first';

        // start html container
        var html = '\
            <div class="content">\
                <h2 class="block-title"><span class="block-title-text">News</span></h2>\
                <a class="more" href="/?navid=9710"><span>All News</span></a>\
            </div>\
            <div class="content">';

        // loop through the items
        NEWS.forEach(function(data) {
			console.log(data);
            if(count == 1) { var label = 'first'; }
            if(count == 2) { var label = 'second'; }
            if(count == 3) { var label = 'third'; }
            html += '\
                <a href="' + data.url + '">\
                    <div class="' + label + ' third">\
                        <div class="imageGroup" style="background: url(' + data.image + ') no-repeat 50% 50%; background-size: cover;">\
                            <div class="gradient">\
                                <span class="title">' + data.title + '</span>\
                            </div>\
                        </div>\
                    </div>\
                </a>';
            count++;
        });
        html += '<div class="content footer"></div>';

        $(".ls-news-container").html(html);

    }
}

function plusSlides(n) { showSlides(slideIndex += n); }

function currentSlide(n) { showSlides(slideIndex = n); }

function showSlides(n) {
    var i;
    var slides = document.getElementsByClassName("ls-slide");
    // var dots = document.getElementsByClassName("ls-dot");

    if (n > slides.length) { slideIndex = 1 }
    if (n < 1) { slideIndex = slides.length }
    for (i = 0; i < slides.length; i++) { slides[i].style.display = "none"; }
    // for (i = 0; i < dots.length; i++) { dots[i].className = dots[i].className.replace(" ls-active", ""); }

    var currentSlide = slides[slideIndex - 1];
    if (currentSlide != undefined) { currentSlide.style.display = "block"; }
    // dots[slideIndex - 1].className += " ls-active";
}
//9741

function fn_homepage_updateSlider(homepageSlider) {
    var html = '';
    for (i = 1; i < Object.keys(homepageSlider).length + 1; i++) {
        html += '\
            <div class="ls-slide item-' + i + '" style="display: block; background-image: url(/Home/ShowImage?id=' + homepageSlider[i].image + ');">\
                <div class="ls-title">\
                    <a href="/?navid=' + homepageSlider[i].url + '">\
                        <p class="ls-p0">' + homepageSlider[i].p1 + '</p>\
                        <p class="ls-p1">' + homepageSlider[i].p2 + '</p>\
                        <p class="ls-p2">' + homepageSlider[i].p3 + '</p>\
                        <p class="ls-date">' + homepageSlider[i].date + '</p>\
                    </a>\
                    <p class="ls-link-visit"><a href="/?navid='+ homepageSlider[i].link + '"><span>Plan Your Visit</span></a></p>\
                </div>\
            </div>';
    };
        html += '\
        <a class="ls-prev" onclick="plusSlides(-1)">&larr;</a>\
        <a class="ls-next" onclick="plusSlides(1)">&rarr;</a>\
        <div class="ls-bottom-div style-01"></div>';

    $(document).ready(function() {
        $(".ls-slideshow-container").prepend(html);
    });
    showSlides(1);
}

function fn_getIGfeed() {
    var igRemotePage = $.ajax("https://www.instagram.com/weathertechraceway/?_=123").success(function () {
        html = '\
            <div class="content">\
                <h2 class="block-title"><span class="block-title-text">Social</span></h2>\
                <a class="ls-instagramLink" href="https://www.instagram.com/weathertechraceway/"><span>@weathertechraceway</span></a>\
            </div>\
            <div class="content">';

        var jSon = JSON.parse( igRemotePage.responseText.split('<script type="text/javascript">window._sharedData =')[1].split(';</script>')[0] );
        //for(i=0; i < jSon.entry_data.ProfilePage[0].graphql.user.edge_owner_to_timeline_media.edges.length; i++) {
        for(i=0; i < 7; i++) {
            var url = "https://instagram.com/p/" + jSon.entry_data.ProfilePage[0].graphql.user.edge_owner_to_timeline_media.edges[i].node.shortcode;
            var image = jSon.entry_data.ProfilePage[0].graphql.user.edge_owner_to_timeline_media.edges[i].node.display_url;
            html += '\
                <div class="social-media-entry">\
                    <a href="' + url + '" target="_blank"><img src="' + image + '"></a>\
                </div>';
        }
            // html += '\
            // </div>\
            // <div style="clear:both;"></div>\
            // <ul style="float:left;">\
            //     <li class="facebook">\
            //         <a id="ls-link-facebook"></a>\
            //     </li>\
            //     <li class="instagram">\
            //         <a id="ls-link-instagram"></a>\
            //     </li>\
            //     <li class="twitter">\
            //         <a id="ls-link-twitter"></a>\
            //     </li>\
            //     <li class="youtube">\
            //         <a id="ls-link-youtube"></a>\
            //     </li>\
            // </ul>\
            // <p style="float:right;">Tag your photos to <strong>#WeatherTechRaceway</strong> for a chance to be featured on our site!</p>\
            // ';
            html += '\
            </div>\
            <p style="text-align:center;float: right;width: 100%;">Tag your photos to <strong>#WeatherTechRaceway</strong> for a chance to be featured on our site!</p>\
            ';
        //console.log(html);
        $(".ls-container-socialmedia").html(html + "</div>");

    });
}
    
function fn_homepage_updateEvents(data) {
    var html = '<div class="content">\
                    <h2 class="block-title"><span class="block-title-text">Events</span></h2>\
                    <a class="more" href="/?navid=9998"><span>All Events</span></a><br>\
                    <br>\
                    <br>\
                </div>\
                <div class="content">';
    for (i = 1; i < Object.keys(data).length + 1; i++) {
        
        // 1,2,4th items need a left/right container
        if(i==1) {
            html += '<div class="left">';
        } else if (i == 2 || i == 4) {
            html += '<div class="right">';
        }

        // determine top/bottom position
        var verticalPosition = "top";
        if(i%2 == 0) { verticalPosition = "bottom"; }


         html += '\
                        <a href="/?navid=' + data[i].url + '">\
                            <div class="imageGroup ' + verticalPosition + '" style="background-image: url(/Home/ShowImage?id=' + data[i].image + '); background-position: ' + data[i].bgPosition + ';">\
                                <div class="gradient">\
                                    <span class="title">' + data[i].title + '</span>\
                                    <span class="subtitle">' + data[i].subtitle + '</span>\
                                </div>\
                            </div>\
                        </a>';

        // close container for
        if (i ==1 || i == 3 || i == 5) {
            html += "</div>";
        }
    }
        html += '\
                    </div>\
                </div>\
                <div class="clear-reset"></div>\
                <div class="content-footer"></div>';

    $(document).ready(function() {
        $(".ls-events-container").html(html);
    });
}




document.addEventListener("DOMContentLoaded", function(event) { 
   

    // check for homepage
    if (window.visionOptions.navigationID != undefined && window.visionOptions.navigationID  == 9658) {

        console.log("** Homepage");

        if (homepageSlider != undefined) {
            console.log("Updating events");
            fn_homepage_updateSlider(homepageSlider);    
        }

        if(homepageEvents != undefined) {
            console.log("Updating slider");
            
            fn_homepage_updateEvents(homepageEvents);
            showSlides(1);
        }    

        if(fn_RssFeeds != undefined) {
            fn_RssFeeds();
        }

        if (fn_getIGfeed != null) {
            fn_getIGfeed();
        }
    }
});