jQuery(function(){
    
    jQuery('.video').click(function(){
        Overlay.mask('body', 'mask', '0.85', '#000');
        var parts = this.id.split("-");
        video(this, parts);
        jQuery('#player .close').click(function(){
            jQuery('#player').remove();
            Overlay.unmask('body', 'mask');
        });
        return false;
    });
        
    function video(atag, parts){
        jQuery('body').append("<div id='player'><div class='titlebar'><span class='close'><em>CLOSE X</em></span></div><a href='" + atag.href + "' class='player' id='p-" + parts[1] + "'></a></div>");
        jQuery('#player').css('z-index',1000);
        var pid = "p-" + parts[1];
        var player = $f(pid, "/video/flowplayer/flowplayer-3.1.5.swf", {
        
            plugins: {controls: null},
		    
		    clip: { 
		        autoPlay: true, 
		        autoBuffering: true 
		    },
            
            plugins: {
               controls: {
                  backgroundColor: '#ffffff',
                  bufferGradient: 'none',
                  tooltipColor: '#999999',
                  sliderColor: '#1A1A1A',
                  timeColor: '#999999',
                  progressGradient: 'medium',
                  timeBgColor: '#1A1A1A',
                  volumeSliderColor: '#1A1A1A',
                  sliderGradient: 'none',
                  volumeSliderGradient: 'none',
                  durationColor: '#666666',
                  buttonColor: '#1A1A1A',
                  progressColor: '#666666',
                  borderRadius: '0',
                  bufferColor: '#1A1A1A',
                  buttonOverColor: '#666666',
                  backgroundGradient: 'low',
                  tooltipTextColor: '#ffffff',
                  height: 25,
                  autoHide: 'always',
                  opacity: 1.0
               }
            }
        });
        
        jQuery('#player').fadeIn('slow');
    }

});

var Overlay = {
    
    curIndex: 100,
    
    mask: function(elm, id, opacity, color){        
        if (elm === 'body') {
            jQuery('body').append("<div id='" + id + "'></div>");
            
        } else if (jQuery('#' + elm).length) {
            jQuery('#' + elm).append("<div id='" + id + "'></div>");
            
        }
        var parent = jQuery('#' + id).parent();
        jQuery('#' + id).css({
            display: 'block',
            height: parent.height(),
            width: parent.width(),
            position: 'fixed',
            left: parent.position().left,
            top: parent.position().top,
            'z-index': Overlay.curIndex,
            opacity: opacity,
            background: color
        });
        Overlay.curIndex++;
        
        if (jQuery('body').height() < jQuery(window).height()) {
            jQuery('#' + id).height(jQuery(window).height());
        }
    },
    
    unmask: function(elm, id) {
        jQuery('#' + id).remove();
    }
    
};