// Cookies functions
function setCookie(key, value) {
    var expires = new Date();
    expires.setTime(expires.getTime() + 31536000000); // 1 year
    document.cookie = key + '=' + value + '; expires=' + expires.toUTCString();
}

function getCookie(key) {
    var keyValue = document.cookie.match('(^|;) ?' + key + '=([^;]*)(;|$)');
    return keyValue ? keyValue[2] : null;
}

function deleteCookie(key) {
    var expires = new Date();
    expires.setTime(expires.getTime() - 1); // to the past
    document.cookie = key + '=; expires=' + expires.toUTCString();
}

// Function to translate page and repaint it based on language
var myPage = {
    translate: function (myLang) {
        $.get(
            "page1.xml",
            function ($xml) {
                // Select version
                var versionXML = $($xml).find("version[lang='" + myLang + "']");

                // Modify title
                document.title = versionXML.find("title").text();

                // Get body width
                var myWidth = $("body").outerWidth();

                // Modify flag and language
                $("div#flag img").attr("src", versionXML.find("flag").attr("src"));
                $("div#flag img").attr("alt", versionXML.find("flag").attr("alt"));
                $("div#flag img").attr("lang", myLang);
                $("div#flag h4").text(versionXML.find("flag").text());

                // Bottom of page
                $("div#copyright").text(versionXML.find("copyright").text());
                $("div#email").text(versionXML.find("email").text());

                // Empty all sections
                var mySections = $("div#sections");
                mySections.empty();

                mySectionID = 1;
                var myRowID = 1;

                // Loop for each section
                versionXML.find("section").each(function () {

                    $("<div class='center' id='caption1'></div>")
                        .html("<h2>" + $(this).find("caption1").text() + "</h2>").appendTo("div#sections");
                    $("<div class='center' id='caption2'></div>")
                        .html($(this).find("caption2").text()).appendTo("div#sections");

                    // Create table with the first row
                    $("<table class='parks' id='section" + mySectionID + "'></table>")
                        .html("<tr id='tr" + myRowID + "'></tr>").appendTo("div#sections");

                    var myRight = 0;

                    // Loop for each folder
                    $(this).find("folder").each(function () {

                        var myFolder = $(this).attr("fpath");
                        myRight += parseInt($(this).attr("width")) + 50;
                        if (myRight >= myWidth) {
                            myRowID++;
                            $("<tr id='tr" + myRowID + "'></tr>").appendTo("table#section" + mySectionID);
                            myRight = parseInt($(this).attr("width")) + 50;
                        }

                        $("<td></td>").html("<a href='" + myFolder + "/index.html'>" +
                            "<img class='thumbnail' src='" + myFolder + "/Images/" + $(this).attr("src") +
                            "' alt='" + $(this).attr("alt") +
                            "' width='" + $(this).attr("width") +
                            "' height='" + $(this).attr("height") + "'></img>" +
                            "<br /><b>" + $(this).text() + "</b></a>").appendTo("tr#tr" + myRowID);

                    });

                    // Add separator
                    $("<p /><hr />").appendTo("div#sections");

                    myRowID++;
                    mySectionID++;

                });

            },
            "xml"
        );
    },
    getLang: function () {
        var myLang = getCookie("lang");
        if (!myLang) {
            myLang = $("div#flag img").attr("lang");
            setCookie("lang", myLang);
        }
        return myLang;
    }
};

$(document).ready(
    function () {

	// Translate page
        myPage.translate(myPage.getLang());


        // Set change language event handler
        $("div#flag a").click(
            function ($e) {
                $e.preventDefault();
                var myLang = ($("div#flag img").attr("lang") == "en" ? "sk" : "en");
                setCookie("lang", myLang);
                myPage.translate(myLang);
            }
        );

        // Set windows resize event
        $(window).resize(function () {
            myPage.translate(myPage.getLang());
        });
    }
);