// setup button action. it will fire our overlay
$(function() 
{

    var player = $f("a.player", { src: "/swf/flowplayer-3.0.7.swf", bgcolor: '#ffffff' },
    {

        clip: { autoPlay: true, scaling: 'fit' },

        // custom labels on the play button 
        play:
        {
            label: 'Play',
            replayLabel: 'Play again',
            fadeSpeed: 3000
        },
        
        screen: { 
         height: '300', 
         width: '400'
        }, 
        
        play: { 
         width: '100', 
         height: '100'
        }, 

        // make canvas dark 
        canvas: { backgroundColor: "#000000",  backgroundGradient: 'none', border:'2px solid #778899' },

        plugins:
        {
           controls:
           {
               buttonOverColor: '#676783',
               bufferColor: '#9e9e9e',
               progressGradient: 'medium',
               sliderColor: '#000000',
               backgroundColor: '#CF754D',
               buttonColor: '#0d0d36',
               bufferGradient: 'none',
               backgroundGradient: [0.6, 0.3, 0, 0, 0],
               durationColor: '#ffffff',
               sliderGradient: 'none',
               timeColor: '#ffffff',
               progressColor: '#37373e',
               borderRadius: '0px',
               opacity: 1.0
           }
        }
    });

    // setup overlay actions to buttons
    $("a[rel]").overlay({

        onLoad: function(content) {
            // find the player contained inside this overlay and load it
            this.getContent().find("a.player").flowplayer(0).load();
        },

        onClose: function(content) {
            $f().unload();

        }
    });				
});