$(document).ready(function()
{
    // Empty the previous content
    $("#profile_slideshow").html('');

    // attach the showcase

    var showMap = true;

    $("#profile_slideshow").showcase({
        images: eval(profilePictures),
        width: "600",
        height: "360",
        border: "solid #fff 1px",
        animation: { type: "fade", interval: 3500, speed: 1000 },
        navigator: {
            position: "bottom-right",
            showMiniature: true,
            autoHide: true,
            item: {
                css:     {
                        width: "44px",
                        height: "28px",
                        borderColor:"#ccc",
                        margin: "1px",
                        "-moz-border-radius": "0px",
                        "-webkit-border-radius": "0px"
                        },
                cssHover: {
                    backgroundColor: "#ddd",
                    borderColor: "#000" },
                cssSelected: {
                    backgroundColor: "#fff",
                    borderColor: "#fff" }
                }
            },
        titleBar: {
                 enabled: true,
                 css:     {
            width: "0px",
            height: "0px",
            backgroundColor: "transparent"
            }
        }
    });
    $("#subBar").css({ position: ""});

    // call the event to change the image caption
    setInterval( function() {

               // get image alt text which is the combination of caption and photographer name
               var combined = $("#subBar span").text();

               // seperate the caption and photographer name
               var splited = combined.split("$#$");

               if (splited.length > 1) {
                   // Form the div containing caption and photographer name in two lines
                   contDiv = '<div>' + splited[0] + '<br>' + splited[1] + '</div>';
                   // transfer the changing alt text from subBar to subBar2
                   $("#subBar2 span").html(contDiv);
               } else {
                   // transfer the changing alt text from subBar to subBar2
                   $("#subBar2 span").text(splited[0]);

               }

               // Unbind all the click events
               $('#slider a').unbind('click');

               // Bind click event on images
               $('#slider a'). click(function()
               {
                       // If link is to be open in iframe then open in thickbox
                    if (-1 != this.href.search('iframe')) {
                        //$.prettyPhoto.open(this.href,this.title);
                        $.fancybox({
                            'title'			: this.title,
                            'width'		    : 850,
                            'height'		: '100%',
                            'padding': 0,
                            'margin': 25,
                            'overlayColor': '#000',
//                            'transitionIn': 'elastic',
//                            'transitionOut': 'elastic',
                            'href'			: this.href,
                            'type'			: 'iframe'
                        });
                        return false;
                    }
               });
            }, 1000);
});