$(document).ready(function(){

    //alert('loading gallery.js');
    //console('loading portfolio.js');

    var image_path = '/_media/images/';

    $("a.thumbnail", this).click(function()
    {
        //strip the thumb id number from the id tag
        var image_alias = this.id;//.substr('thumb-'.length);

        //console('clicked '+image_alias);

        //show loading gif
        showLoading();

        //replace the image
        $.ajax({
            type: "POST",
            url: "/api/portfolio/image",
            data: "image_alias="+image_alias,
            dataType : "json",
            success : function(json) {
                //alert(json.src);
                if (json.error) {
                    alert(json.error); return;
                }

                //preload the image
//                jQuery("<img>").attr("src", image_path+json.src);

                //swap the page elements
                jQuery("#image-item").attr('src',image_path+json.src);
                jQuery("#image-item").attr('width',image_path+json.width);
                jQuery("#image-item").attr('height',image_path+json.height);
                jQuery("#image-title").html(json.title);
                jQuery("#image-caption").html(json.summary);

                hideLoading();
            }
        });

        return false;
    });

});



//writes a message to the console (a div with id 'console')
function console(msg) {
    jQuery("#console").append('<div>'+msg+'</div>');
}


function showLoading() {
    jQuery('#loading-gif').show();
}

function hideLoading() {
    jQuery('#loading-gif').hide();
}