// Requires JQuery

$(document).ready(function() {

    $('.cardhover').hover(function() {
        $(this).attr('src', '/media/images/card-back-over.gif');
    }, function() {
        $(this).attr('src', '/media/images/card-back.gif');
    });
    
    // Setup page scrolling elements
    $("#content").prepend($("<div></div>").attr('id','mask'));
    $("#mask").append($("<div></div>").attr('id','pages'));
    
    // Page scrolling functions
    pageNum = 1;
    numPages = 0;
    
    loadArtwork = function(images, callback) {
        numPages = images.length;
        for(var i = 0; i < images.length; i++) {

            var page = $("<div></div>").attr('class','page');
           
            var ldrimg = new Image();
            $(ldrimg).attr('alt','Loading').attr('src', '/media/images/loading.gif');

            var ldrdiv = $("<div></div>").attr('class','loader');
            ldrdiv.append(ldrimg).append("Loading");
            page.append(ldrdiv);
            
            var art = new Image();    
            $(art).attr('id','artwork_'+i);

            $(art).load(function () { // loaded
                $(this).fadeIn();
                if(callback != null) {
                    callback($(this).attr('id'));
                }
            });
            $(art).error(function () {
                $(ldrdiv).hide();
                $(page).html("<h2>Error</h2><p>Failed to load page artwork.</p>");
            });

            $(page).append(art);
            $(art).hide();
                
                $("#pages").append(page);
                $(art).attr('src', images[i]);
            }
        }
        
        // showPage() starts at page 1, not 0
        showPage = function(i) {
        var offset = (i-1) * -1050; 
        $("#pages").animate({ marginLeft: offset+'px'}, 300);
    }
    nextPage = function() {
       if(pageNum < numPages) {
           pageNum ++;
           showPage(pageNum); 
       } else {
            document.location = "/";
       }
    }
    prevPage = function() {
        if(pageNum <= 1) {
            document.location = "/";
        } else {
            pageNum --;
            showPage(pageNum);   
        }
    }
    
    // Buuble rollovers
    initBubble = function(id, spotid) {
        $(spotid).hover(function(){
            $(id).fadeIn(100);
        }, function(e){
            t = (e.toElement) ? e.toElement : e.relatedTarget;
            if(t.id != id.substr(1))
                $(id).fadeOut(100);
        });

        $(id).mouseout(function(e) {
            t = (e.toElement) ? e.toElement : e.relatedTarget;
            if(t.id != spotid.substr(1))
                $(id).fadeOut(100);
        });
    }
});