$(document).ready(function(){
    var slides=new Array();
    var urlHash = document.location.toString().split('#/')[1];

    var number = 0;
    $('#screenshots .item').each(function(){
        var itemId = $("img", this).attr('id');
        slides[itemId] = number;
        number++;
    });
    
    
    if(urlHash) {
        var current = slides[urlHash];
        if(current) {
            $("#screenshots").show();
            $("#screenshots").cycle({
                fx:"fade",
                speed:1000,
                timeout:10000,
                startingSlide:current,
                pager:  '#nav',
                pagerAnchorBuilder: function(idx, slide) {
                    var title = $("img", slide).attr('alt');
                    var itemId = $("img", slide).attr('id');
                    slides[itemId] = idx;

                    if(urlHash) {
                        var current = slides[urlHash];
                        if(current == idx) {
                            return '<a class="activeSlide" href="#/'+itemId+'">'+title+'</a>';
                        } else {
                            return '<a class="" href="#/'+itemId+'">'+title+'</a>';
                        }
                    } else {
                        return '<a class="" href="#/'+itemId+'">'+title+'</a>';
                    }
                },
                pagerClick: function(idx, slide) {
                    var itemId = $("img", slide).attr('id');
                    document.location ='#/'+itemId;
                }
            });
        } else {
            document.location = document.location.toString().split('#/')[0];
        }
    }
    else {
        $("#screenshots").show();
        $("#screenshots").cycle({
            fx:"fade",
            speed:1000,
            timeout:10000,
            pager:  '#nav',
            pagerAnchorBuilder: function(idx, slide) {
                var title = $("img", slide).attr('alt');
                var itemId = $("img", slide).attr('id');
                slides[itemId] = idx;
                return '<a class="" href="#/'+itemId+'">'+title+'</a>';
            },
            pagerClick: function(idx, slide) {
                var itemId = $("img", slide).attr('id');
                document.location ='#/'+itemId;
            }
        });
    }
    $("#screenshots").cycle("pause");
});