var images; 
var autochangebg = true;

(function ($) {
    $.fn.supersized = function () {
        $.inAnimation = false;
        $.paused = false;
        var options = $.extend($.fn.supersized.defaults, $.fn.supersized.options);
        $(document).ready(function () {
            $("#supersize").resizenow();
       	    $("#windowFrame" ).draggable({containment: "#windowContainer", scroll: false });
       	    //$("div.img > img").css("opacity", 0.7);
            //$("#windowContent").fadeTo("fast", 0.9);
            //setTimeout("openWindow('profiel');", 20000);
            setTimeout("changeBackground();", 8000);
        });
        $(window).bind("resize", function () {
            $('#supersize').resizenow();
            $('#supersize').reposition();
        });
    };
    $.fn.resizenow = function () {
        var options = $.extend($.fn.supersized.defaults, $.fn.supersized.options);
        return this.each(function () {
            var ratio = options.startheight / options.startwidth;
            var imagewidth = $(this).width();
            var imageheight = $(this).height();
            var browserwidth = $(window).width();
            var browserheight = $(window).height();
            var offset;
            if ((browserheight / browserwidth) > ratio) {
                $(this).height(browserheight);
                $(this).width(browserheight / ratio);
                $(this).children().height(browserheight);
                $(this).children().width(browserheight / ratio);
            } else {
                $(this).width(browserwidth);
                $(this).height(browserwidth * ratio);
                $(this).children().width(browserwidth);
                $(this).children().height(browserwidth * ratio);
            }
            if (options.vertical_center == 1) {
                $(this).children().css('left', (browserwidth - $(this).width()) / 2);
                $(this).children().css('top', (browserheight - $(this).height()) / 2);
            }
            return false;
        });
    };
    $.fn.supersized.defaults = {
        startwidth: 16, startheight: 9, vertical_center: 1, slideshow: 1, navigation: 1, transition: 1, pause_hover: 0, slide_counter: 1, slide_captions: 1, slide_interval: 5000
    };
    $.fn.reposition = function () {
        $("#windowFrame").animate({
            width: "610px",
            height: "570px",
            marginTop: ((($("#windowContainer").height()/1) - 570 - 50) / 2),
            marginLeft: (($("#windowContainer").width() - 610) / 2)
        }, 100);
    }
    $.fn.openWindow = function () {
        if ($("#windowFrame").width() != 610) {
            $("#windowFrame").animate({
                width: "0px",
                height: "0px",
                marginTop: (($("#windowContainer").height() - 20) / 2),
                marginLeft: (($("#windowContainer").width() - 20) / 2)
            }, 20);
            //$("#werk div.slide div.text").css("opacity", 0.8);

            //$("#mainhome").fadeTo("fast", 0.80);
            //$("#windowContainer").fadeTo("fast", 1);

            $("#windowFrame").animate({
                width: "610px",
                height: "570px",
                marginTop: ((($("#windowContainer").height()/1) - 570 - 50) / 2),
                marginLeft: (($("#windowContainer").width() - 610) / 2)
            }, 900);
        }
    }
})(jQuery);
;

function resetMenu() {
    $("#profiellink").css("color", "#000");
    $("#werklink").css("color", "#000");
    $("#opdrachtgeverslink").css("color", "#000");
    $("#contactlink").css("color", "#000");
}

function openWindow(name) {
	$("#prev").css("visibility", "hidden");
	$("#next").css("display", "none");
    $(".category").animate({marginLeft: 0}, 0);

	//minimize
    $.fn.openWindow();
    //$("#windowContent").css("opacity", 1);
    //$("#windowContainer").css("opacity", 1);

    resetMenu();  

    switch (name) {
        case "profiel":
            $(".category").css("display", "none");
            $("#profiel").css("display", "block");
            $("#profiellink").css("color", "#fff");
            break;
        case "werk":
            $(".category").css("display", "none");
            $("#werk").css("display", "block");
        	$("#prev").css("visibility", "visible");
        	$("#next").css("display", "block");
            $("#werklink").css("color", "#fff");
            break;
        case "opdrachtgevers":
            $(".category").css("display", "none");
            $("#opdrachtgevers").css("display", "block");
            $("#opdrachtgeverslink").css("color", "#fff");
            break;
        case "contact":
            $(".category").css("display", "none");
            $("#contact").css("display", "block");
            $("#contactlink").css("color", "#fff");
            break;
    }
}

function closeWindow() {
    //$("#mainhome").fadeTo("fast", 0);
    //$("#windowContainer").fadeTo("fast", 0);

    resetMenu();

    $("#windowFrame").animate({
        width: "0px",
        height: "0px",
        marginTop: (($("#windowContainer").height() - 20 - 50) / 2),
        marginLeft: (($("#windowContainer").width() - 20) / 2)
    }, 200);
}

function setSlide() {
    $("#windowFrame")("div");
}

function scrollNext() {
    //1: 0, 2: -566, 3: -1132
    var currentPos = $(".category").css("margin-left");
    currentPos = (currentPos == "auto") ? 0 : currentPos.replace("px", "")*1;
    if (currentPos <= ($("#werk .slide").length-1)*-566) {
        currentPos = 0;
    } else {
        currentPos -= 566;
    }
    currentPos += "px";
    $(".category").animate({marginLeft: currentPos}, 500);
}

function scrollPrev() {
    var currentPos = $(".category").css("margin-left");
    currentPos = (currentPos == "auto") ? 0 : currentPos.replace("px", "")*1;
    if (currentPos >= 0) {
        currentPos = ($("#werk .slide").length-1)*-566;
    } else {
        currentPos += 566;
    }
    currentPos += 'px';
    $(".category").animate({marginLeft: currentPos}, 500);
}

function changeBackground(click) {
	//fade out and call replacement
    //$("#mainhome").fadeTo(600, 0.9, function() {setNewBackground(click)});
    setNewBackground(click)
}

function setNewBackground(click) {
	var currentImg = $("#bgimg").attr("src");

    $("#supersize").empty();
    $("#supersize").html("<a class=\"activeslide\"><img id=\"bgimg\" alt=\"\" src=\"images/backgrounds/" + GetImage(currentImg) + "\" /></a>");
    $.fn.resizenow();

    //fade in and start over
    if (click) {
    	$("#mainhome").fadeTo(1000, 0);
    	autochangebg = false;
    } else {
     //if (autochangebg) $("#mainhome").fadeTo(1000, 0, function() {setTimeout("changeBackground();", 8000);});
     if (autochangebg) setTimeout("changeBackground();", 8000);    	
    }
}

function GetImage(currentImg) {
    for (i = 0; i < images.length; i++) {
        if (images[i] == currentImg.substring(currentImg.lastIndexOf("/")+1, currentImg.length)) {
            return (i == images.length - 1) ? images[0] : images[i + 1];
            break;
        }
    }
    return images[0];
    /*
    background = Math.floor(Math.random()*images.length);

    if (currentImg.indexOf(images[background]) >= 0) {
    //new image same as current, try again
    return GetImage(currentImg);
    } else {
    return images[background];
    }
    */
}