jQuery(document).ready(function() {

    //OJ: Added 'if' statements around these to fix 'null' error on pages with none of these elements.

    swfobject.embedSWF("/staff/libertine-staff-full.swf", "staff-flash", "980", "590", "10.0.0", "/staff/expressInstall.swf", null, null, null);           
        
        
    jQuery("#staffoverlay").overlay({
        expose: '#e3e3e3'
    });

    if (jQuery('#people li img:not(.nobio)') != null) {
        jQuery('#people li img:not(.nobio)').tooltip({
            track: true,
            //delay: 0, 
            showURL: false,
            fixPNG: true,
            showBody: " - "
        }).each(function(ele) {
            var bg = ele % 4;
            switch (bg) {
                case 0: jQuery(this).data('color', 'white'); break;
                case 1: jQuery(this).data('color', 'red'); break;
                case 2: jQuery(this).data('color', 'blue'); break;
                case 3: jQuery(this).data('color', 'grey'); break;
            }
        }).bind("mouseenter", function() {
            jQuery('#tooltip').removeAttr('class').addClass(jQuery(this).data('color'));
        });
    }

    if (jQuery('table.clients img[rel]') != null) {
        var flashVideos = [];
        jQuery('table.clients img[rel]').css('cursor', 'pointer').overlay({
            expose: '#e3e3e3', // <-- overlay colour.
            target: '#overlay',
            api: true,
            top: 0,
            onBeforeLoad: function() {

                flashVideos = [];
                var content = eval(this.getTrigger().attr("rel"));
                var sTitle = this.getTrigger().attr("alt");

                var oTitleHtml = '<div id="tabs-title"><h2>' + sTitle + '</h2></div>';
                var oSlidesHtml = '<div class="images">';
                var oThumbsHtml = '<div class="tabs">';

                for (i = 0; i < content.length; i++) {

                    var fid = flashVideos.length;
                    var items = content[i];
                    var type = items[0];
                    var thumb = items[1];
                    var slide = items[2];
                    var img = slide.replace(".flv", ".jpg");

                    oThumbsHtml += '<a href="#"><img src="/images/client-work/' + thumb + '" alt="*"/></a>';

                    if (type == 'image')
                        oSlidesHtml += '<div><table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0"><tr><td valign="middle" align="center"><img src="/images/client-work/' + slide + '" class="clientworkitem" /></td></tr></table></div>';
                    else if (type == 'flash') {
                        oSlidesHtml += '<div><table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0"><tr><td valign="middle" align="center"><div id="overlayVideo' + flashVideos.length + '"></div></td></tr></table></div>';
                        flashVideos[flashVideos.length] = { image: '/images/client-work/' + img, file: '/images/client-work/' + slide, id: 'overlayVideo' + fid, width: 626, height: 415, version: '9', xi: '/flashvideo/expressInstall.swf', vars: { 'smoothing': 'true' }, parms: { 'allowfullscreen': true, 'allowscriptaccess': 'always', 'wmode': 'transparent' }, atts: {} }
                    }
                    else if (type == 'video') {
                        oSlidesHtml += '<div style="z-index: 100;"><table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0"><tr><td valign="middle" align="center"><div id="overlayVideo' + fid + '"></div></td></tr></table></div>';
                        flashVideos[flashVideos.length] = { image: '/images/client-work/' + img, file: '/flashvideo/player-licensed.swf', id: 'overlayVideo' + fid, width: 626, height: 415, version: '9', xi: '/flashvideo/expressInstall.swf', vars: { 'image': '/images/client-work/' + img, 'file': '/images/client-work/' + slide, 'backcolor': 'ffffff', 'frontcolor': '000000', 'lightcolor': 'ffffff', 'autostart': 'false', 'smoothing': 'true' }, parms: { 'allowfullscreen': true, 'allowscriptaccess': 'always', 'wmode': 'transparent' }, atts: {} }
                    }
                    else
                        oSlidesHtml += '<div><table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0"><tr><td valign="middle" align="center"><p>' + slide + '</p></td></tr></table></div>';
                }

                oThumbsHtml += '</div>';
                oSlidesHtml += '</div>';

                jQuery('#tabs-container').replaceWith('<div id="tabs-container">' + oSlidesHtml + oThumbsHtml + '<a href="#" class="next">&nbsp;</a><a href="#" class="prev">&nbsp;</a></div><a href="#" class="close">&nbsp;</a>');

                for (i = 0; i < flashVideos.length; i++)
                    swfobject.embedSWF(
                    flashVideos[i].file,
                    flashVideos[i].id,
                    flashVideos[i].width,
                    flashVideos[i].height,
                    flashVideos[i].version,
                    flashVideos[i].xi,
                    flashVideos[i].vars,
                    flashVideos[i].parms,
                    flashVideos[i].atts);

                jQuery("div.tabs").tabs(".images > div", {
                    effect: 'fade',
                    fadeOutSpeed: "slow",
                    rotate: true,
                    onBeforeClick: function() {
                        for (i = 0; i < flashVideos.length; i++) {
                            var ob = swfobject.getObjectById(flashVideos[i].id);
                            if (ob)
                                ob.StopPlay();
                        }
                    }
                });

                jQuery("a.prev").click(function() { jQuery("div.tabs").tabs().prev(); return false; });
                jQuery("a.next").click(function() { jQuery("div.tabs").tabs().next(); return false; });
                jQuery("a.close").click(function() {
                    jQuery("table.clients img[rel]").each(function() {
                        jQuery(this).overlay().close();
                    }); return false;
                });



                if (content.length == 1)
                    jQuery('#tabs-container .next,#tabs-container .prev').addClass('disabled');
            },
            onClose: function() {
                for (i = 0; i < flashVideos.length; i++)
                    swfobject.removeSWF(flashVideos[i].id);
                jQuery('#tabs-container').replaceWith('<div id="tabs-container"></div>')
                jQuery('#overlay a.close').remove();
            }
        });
    }
});