var currentYear;
var currentMonth;
var currentSubcat;
var currentVideo;


// ********* ******** ******* ****** ***** **** *** ** * ** *** **** ***** ****** ******* ******** *********
// INIT WEB: stuff for the normal web browsers

function initWeb() {
    document.getElementById('site-outer').style.display = '';
    // first setting default values for year, month and sub categories (week or video): 
    // picking the latest and greatest
    var amountOfYears = ninaTime.length;
    currentYear = ninaTime[amountOfYears-1].year; 
    var defaultYear = ninaTime[amountOfYears-1].year;

    var amountOfMonths = ninaTime[amountOfYears-1].months.length;
    var monthNumber;
    // looping through the months array of this year from back to front
    for (var i=amountOfMonths-1; i>=0; i--) {
        if (ninaTime[amountOfYears-1].months[i].enabled != false) {
            currentMonth = ninaTime[amountOfYears-1].months[i].id;
            var defaultMonth = ninaTime[amountOfYears-1].months[i].id;
            monthNumber = i;
            break;
        }
    }

    var amountOfSubcat = ninaTime[amountOfYears-1].months[monthNumber].subcat.length;
    // looping through the subcat array of this year and month from back to front
    for (var i=amountOfSubcat-1; i>=0; i--) {
        if (ninaTime[amountOfYears-1].months[monthNumber].subcat[i].enabled != false) {
            currentSubcat = ninaTime[amountOfYears-1].months[monthNumber].subcat[i].id;
            var defaultSubcat = ninaTime[amountOfYears-1].months[monthNumber].subcat[i].id;
            break;
        }
    }
    
    // checking the URL and see if there is an anchor
    var url = document.location.href;
    var queryString = url.indexOf('#');
    if (queryString != -1) {
        startOfString = url.indexOf('#') + 1;
        currentYear = url.substring(startOfString, startOfString + 4);
        currentMonth = url.substring(startOfString + 4, startOfString + 7);
        currentSubcat = url.substring(startOfString + 7);
        // alert(currentYear + '\n' + currentMonth + '\n' + currentSubcat);
        // alert('currentYear = ' + currentYear + '\ncurrentMonth = ' + currentMonth + '\ncurrentSubcat = ' + currentSubcat);
        // now we should check to see if these values make any sense
        // only if all 3 values make sense we will use them
        var useQueryData = false;
        for (var i=0; i<amountOfYears; i++) {
            if (currentYear == ninaTime[i].year) {
                var amountOfMonths = ninaTime[i].months.length;
                for (var j=0; j<amountOfMonths; j++) {
                    if (currentMonth == ninaTime[i].months[j].id) {
                        var amountOfSubcat = ninaTime[i].months[j].subcat.length;
                        for (var k=0; k<amountOfSubcat; k++) {
                            if (currentSubcat == ninaTime[i].months[j].subcat[k].id) {
                                useQueryData = true;
                                break;
                            }
                        }
                        break;
                    }
                }
                break;
            }
        }
        // if not all 3 values make sense, we will default to the current latest and greatest
        if (useQueryData == false) {
            currentYear = defaultYear;
            currentMonth = defaultMonth;
            currentSubcat = defaultSubcat;
        }
    }
    setClasses();
    loadContent(currentYear, currentMonth, currentSubcat);
}

function setClasses() {
    // let's loop through the data that we are displaying again; 
    // see if we need to disable stuff
    var amountOfYears = ninaTime.length;
    for (var i=0; i<amountOfYears; i++) {
        document.getElementById("y" + ninaTime[i].year).className = "";
        if (currentYear == ninaTime[i].year) {
            var amountOfMonths = ninaTime[i].months.length;
            for (var j=0; j<amountOfMonths; j++) {
                if (ninaTime[i].months[j].enabled == false) {
                    document.getElementById(ninaTime[i].months[j].id).className = "disabled";
                }
                else {
                    document.getElementById(ninaTime[i].months[j].id).className = "";
                }
                if (currentMonth == ninaTime[i].months[j].id) {
                    // days or weeks?
                    if (ninaTime[i].months[j].type == "days") {
                        document.getElementById('nav3-weeks').style.display = 'none';
                        document.getElementById('nav3-days').style.display = '';
                    }
                    else {
                        document.getElementById('nav3-weeks').style.display = '';
                        document.getElementById('nav3-days').style.display = 'none';
                    }
                    var amountOfSubcat = ninaTime[i].months[j].subcat.length;
                    for (var k=0; k<amountOfSubcat; k++) {
                        var currentSubcatId = ninaTime[i].months[j].subcat[k].id;
                        if (currentSubcatId == 'video' && currentYear == '2007') {
                            currentSubcatId = 'video2007';
                        }
                        if (ninaTime[i].months[j].subcat[k].enabled == false) {
                            document.getElementById(currentSubcatId).className = "disabled";
                        }
                        else {
                            document.getElementById(currentSubcatId).className = "";
                        }
                    }
                }
            }
        }
    }

    // setting the correct class name based on the year
    document.getElementById("site-outer").className = "site-outer y" + currentYear;
    // setting the correct class name based on the month
    document.getElementById("site-inner").className = "site-inner " + currentMonth;
    // highlighting the correct month and subcat elements
    document.getElementById(currentMonth).className = "selected";
    var currentSubcatId = currentSubcat;
    if (currentSubcatId == 'video' && currentYear == '2007') {
        currentSubcatId = 'video2007';
    }
    document.getElementById(currentSubcatId).className = "selected";
}

function loadContent(year, month, subcat) {
    // alert(year + '\n' + month + '\n' + subcat);
    var currentArray = "content" + year + month + subcat;
    try {
        currentArray = eval(currentArray);
        var newContent = '\n';
        var newVideoNav = '\n';
        var totalAmount = currentArray.length;
        if (subcat != 'video') {
            for (var i = 0; i < totalAmount; i++) {
                var clearCss = (isEven(i)) ? ' clearBoth' : '';
                var forcedBreak = (isEven(i)) ? '<br style="clear: both;" />' : '';
                var photoDescr = (currentArray[i].descr != '') ? '<p>' + currentArray[i].descr + '</p>' : '';
                var extraPaddingBottomCss = (currentArray[i].descr == '') ? ' noDescr' : '';
                // a little less padding in the top when there are 2 hor photos next to each other.
                var twoHorNextToEachOther = '';
                // if the current image is horizontal
                if (currentArray[i].orient == 'hor') {
                    // first image in a row
                    if (isEven(i)) {
                        // if this is the last image in this array
                        if (i == totalAmount-1) {
                            twoHorNextToEachOther = ' hor-only';
                        }
                        else if (currentArray[i+1].orient == 'hor') {
                            twoHorNextToEachOther = ' hor-only';
                        }
                    }
                    // last image in a row
                    else {
                        if (currentArray[i-1].orient == 'hor') {
                            twoHorNextToEachOther = ' hor-only';
                        }
                    }
                }
                newContent = newContent + forcedBreak + '<div class="img-holder ' + currentArray[i].orient + clearCss + extraPaddingBottomCss + twoHorNextToEachOther + '"><div><img src="content/' + currentArray[i].name + '" /></div>' + photoDescr + '</div>\n';
            }
        }
        else {
            for (var i = 0; i < totalAmount; i++) {
                var hideVideoBlock = (i == 0) ? '' : ' style="display: none;"';
                var videoNavSelected = (i == 0) ? ' class="selected"' : '';
                var videoDescr = (currentArray[i].descr != '') ? '<p>' + currentArray[i].descr + '</p>' : '';
                newContent = newContent + '<div class="the-video" id="video-' + i + '"' + hideVideoBlock + '><object width="560" height="340"><param name="movie" value="' + currentArray[i].name + '"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="' + currentArray[i].name + '" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"></embed></object><br />' + videoDescr + '</div>';
                newVideoNav = newVideoNav + '<a href="javascript:void(0);" onclick="showVideo(\'' + i + '\')"' + videoNavSelected + ' id="videolink-' + i + '"><span>' + currentArray[i].title + '</span></a><br />\n';
            }
            currentVideo = '0';
            newVideoNav = '<div class="video-nav" id="video-nav">\n' + newVideoNav + '</div>';
            newContent = newContent + newVideoNav;
        }
        // alert(newContent);
        document.getElementById('content-inner').innerHTML = newContent;
        currentYear = year;
        currentMonth = month;
        currentSubcat = subcat;
        window.location = '#' + year + month + subcat;
        var extraTitle = '';
        var titleMonth = month;
        for (var i = 0; i < ninaMonths.length; i++) {
            if (ninaMonths[i].abbr == month) {
                titleMonth = ninaMonths[i].full;
            }
        }
        var titleSubcat = subcat;
        if (titleSubcat.indexOf('day') != -1) {
            titleSubcat = titleSubcat.substring(3);
            extraTitle = titleMonth + ' ' + titleSubcat + ', ' + year;
        }
        else {
            for (var i = 0; i < ninaSubcat.length; i++) {
                if (ninaSubcat[i].abbr == subcat) {
                    titleSubcat = ninaSubcat[i].full;
                    extraTitle = titleSubcat + ' of ' + titleMonth + ' ' + year;
                }
            }
        }
        document.title = 'Nina - ' + extraTitle;
        setClasses();
    }
    catch(err) {
        alert('Oops. Something went wrong. Contact Jochem! Tell him this:\n\n' + err);
    }
}

function changeContent(linkType, linkId) {
    var newYear;
    var newMonth;
    var newSubcat;
    if (linkType == 'year') {
        elId = 'y' + linkId;
        newYear = linkId;
        // hard coding in some assumptions here, since I know when Nina was born!
        if (linkId == '2007') {
            newMonth = 'dec';
            newSubcat = 'day5';
        }
        // more hardcoding: when clicking on a year other than 2007, we assume that the first month and the first week are there
        else {
            newMonth = 'jan';
            newSubcat = 'week1';
        }
    }
    else if (linkType == 'month') {
        elId = linkId;
        newYear = currentYear;
        newMonth = linkId;
        newSubcat = 'week1';
    }
    else if (linkType == 'subcat') {
        elId = linkId;
        newYear = currentYear;
        newMonth = currentMonth;
        newSubcat = linkId;
    }
    if (elId == 'video' && currentYear == '2007') {
        elId = 'video2007';
    }

    if (document.getElementById(elId).className != 'disabled') {
        loadContent(newYear, newMonth, newSubcat);
    }
}
var isEven = function(num){
    return (num%2 == 0) ? true : false;
};

function showVideo(num) {
    document.getElementById('videolink-' + currentVideo).className = '';
    document.getElementById('videolink-' + num).className = 'selected';
    document.getElementById('video-' + currentVideo).style.display = 'none';
    document.getElementById('video-' + num).style.display = '';
    currentVideo = num;
}


// ********* ******** ******* ****** ***** **** *** ** * ** *** **** ***** ****** ******* ******** *********
// INIT MOBILE: stuff for mobile

function initMobile() {
    document.getElementById('nav1-outer').style.display = '';
    document.getElementById('nav2-outer').style.display = 'none';
    document.getElementById('nav3-weeks').style.display = 'none';
    document.getElementById('content-outer').style.display = 'none';
    document.body.className = document.body.className + ' mobile';
//    alert(document.getElementById('nav1-outer').innerHTML);
    
    document.getElementById('site-outer').style.display = '';
}


// ********* ******** ******* ****** ***** **** *** ** * ** *** **** ***** ****** ******* ******** *********
// INIT: pick web or mobile

window.onload = init;

function init() {
    // redirecting users to the mobile site if on iphone or ipod
    if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))) {
        initWeb();
    }
    else {
        initWeb();
    }
}