FbSlider = {
    
};

FbSlider.init = function(buttonUrl, pageUrl) {
    var $ = jQuery;
    
    var iframeWidth = 250;
    var iframeHeight = 258;
    var borderWidth = 4;
    
    iframeWidth = iframeWidth;
    
    var url = 'https://www.facebook.com/plugins/likebox.php?border_color=%23F2F2F2&channel=https%3A%2F%2Fs-static.ak.fbcdn.net%2Fconnect%2Fxd_proxy.php%3Fversion%3D3%23cb%3Df2c214e67808cdc%26origin%3D&colorscheme=light&header=false&height=' + iframeHeight + '&href='
            + escape(pageUrl)
            + '&locale=en_US&sdk=joey&show_faces=true&stream=false&width=' + iframeWidth;
    
    var $fbBox = $("<div class='fbSlider' style='z-index: 99999; position: fixed; right: -" + (iframeWidth + borderWidth * 2) + "px; top: 210px;' />")

    var $button = $("<img src='" + buttonUrl + "' />");
    
    $fbBox.append($button);

    var $iframe = $('<iframe scrolling="no" style="border: ' + borderWidth + 'px solid #3B5997; vertical-align: top; background: #FFF; overflow: hidden; height: ' + iframeHeight + 'px; width: ' + iframeWidth + 'px;" src="' + url + '"></iframe>');
    $fbBox.append($iframe);
    
    $button.mouseenter(function() {
        $fbBox.animate({'right': '0px'});
    });
    
    $fbBox.mouseleave(function() {
        $fbBox.animate({'right': '-' + (iframeWidth + borderWidth * 2) + 'px'});
    });
        
    $("body").append($fbBox);
};