var calculateThumb = function(name) {
   return name.replace(/^photos/g, 'thumbs');
};

var Board = function(element, options) {
    this.element = element;

    this.overlay = $('<div>&nbsp;</div>').css({
        width: '100%',
        height: '100%',
        position: 'absolute',
        'z-index': 2,
        background: 'url(images/loading4.gif) no-repeat center 430px'
    }).appendTo(element);
};

Board.prototype.setImage = function(url) {
    var image = $('<img />');
    var board = this;
    var element = this.element;
    var oldImage = $(element).find('img');

    image
        .hide()
        .css('z-index', 1)
        .load(function() {
            image.fadeIn(function() {
                board.overlay.fadeOut();
                oldImage.remove();
                image.css('z-index', 0);
            });
        });

    board.overlay.fadeIn(function() {
        image.appendTo(element).attr('src', url);
    });
};

function initializeSlideshow(images) {
    var slide = $('#slide');

    $.each(images, function(index, value) {
        $('<img alt="Picture!" src="' + value + '" />').appendTo(slide);
    });

    slide.nivoSlider({
        pauseTime: 5000,
        controlNav: false,
        keyboardNav: false,
        effect: 'fold'
    });
}

function initializePortfolio(images) {

    var body = $('body');
    var area = $('<div style="display: none; ">Empty temporary area.</div>').appendTo(body);
    var ul = $("#portfoliogrid ul");
    var panel = $('#board');
    var board = new Board(panel.get(0));

    var onload = function(element, li) {
        var span = li.find('span');
        span.empty();
        $(element)
            .fadeTo(0, 0)
            .appendTo(span)
            .fadeTo(1000, 1, function() {
                $(this).css('opacity', '');
            });

        //li.fadeTo(1000, 1, function() {
        //    li.css('opacity', '');
    };

    $.address.change(function(event) {
        var src = event.value;

        var valid = src && src != '/';

        if (valid) {
            // Fix for wrongly applying front slash.
            if (src.charAt(0) == '/') {
                src = src.substr(1);
            }

            board.setImage(src);
        } else {
            board.setImage(images[0]);
        }        
    });

    $.address.history(false);

    $.each(images, function(index, value) {
        var image = $('<img />');
        var li = $('<li><span>&nbsp;</span></li>')
            .data('src', value)
            .click(function() {
                $.address.value(value);
            })
            //.fadeTo(0, 0)
            .appendTo(ul);

        image
            .load(function() {
                onload(this, li);
            })
            .appendTo(area)
            .attr('src', calculateThumb(value));
    });
}

$(function() {

    var ua = navigator.userAgent.toLowerCase();
    var isMobile = /\bmobile\b/i.test(ua);

    if (isMobile) {
        jQuery.fx.off = true;
    }

    jQuery.get("menu.html", function(data) {
        $("ul.sf-menu")
            .append(data)
            .supersubs({
                minWidth: 1,
                maxWidth: 50,
                extraWidth: 0
            })
            .superfish({
                autoArrows: false,
                dropShadows: false
            });
    });

    if (window.slideImages) {
        initializeSlideshow(slideImages);
    }

    if (window.portfolioImages)
    {
        initializePortfolio(portfolioImages);
    }

});

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-12883376-2']);
_gaq.push(['_trackPageview']);

(function() {
  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();