﻿(function ($) {
    $.fn.fbsb = function (options) {
    	//if (window.location.hash.substring(1) != 'facebook') return;
        var defaults = {
			pagenumber: '',
			pagename: '',
            facebook: {
				url: 'http%3A%2F%2Fwww.facebook.com%2Fpages%2F###PAGENAME###%2F###PAGENUMBER###',
				width: 300,
				height: 400,
				stream: 'false',
				header: 'false',
				show_faces: 'true',
				colorscheme: 'light',
				allowTransparency: 'false'
			},
			box: {
				width: 0,
				height: 0,
				padding: 20,
				borderRadius: 30
			},
			buttonWidth: 40,
			showLogo: false
        };
        var options = $.extend(defaults, options);
        
        // Größenberechnungen
        options.box.width = options.facebook.width + options.box.borderRadius - options.box.padding + 80;
        options.box.height = options.facebook.height + 40 + options.box.borderRadius - options.box.padding;
        
        // URL bauen
        options.facebook.url = options.facebook.url.replace('###PAGENAME###', options.pagename).replace('###PAGENUMBER###', options.pagenumber);
        // HTML bauen
        var insertHTML = '<a class="trigger"></a>';
        insertHTML += '<div id="facebook-sidebar"><div class="fbsb-inner">';
        	insertHTML += '<div class="fbsb-logo"></div>';
        	insertHTML += '<div class="fbsb-content-wrap">';
        		insertHTML += '<iframe src="http://www.facebook.com/plugins/likebox.php?href=' + options.facebook.url + '&amp;width=' + options.facebook.width + '&amp;colorscheme=' + options.facebook.colorscheme + '&amp;show_faces=' + options.facebook.show_faces + '&amp;stream=' + options.facebook.stream + '&amp;header=' + options.facebook.header + '&amp;height=' + options.facebook.height + '" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:' + options.facebook.width + 'px; height:' + options.facebook.height + 'px;float:left;background:#ffffff;" allowTransparency="' + options.facebook.allowTransparency + '"></iframe>';
        	insertHTML += '</div>';
        insertHTML += '</div></div>';
        
        // HTM hinzufügen
		$('body').append(insertHTML);

        // Styles
        $('#facebook-sidebar .fbsb-inner').css({ width: options.box.width + 'px', height: options.box.height + 'px', WebkitBorderTopLeftRadius: options.box.borderRadius + 'px', WebkitBorderBottomLeftRadius: options.box.borderRadius + 'px', MozBorderRadiusTopleft: options.box.borderRadius + 'px', MozBorderRadiusBottomleft: options.box.borderRadius + 'px', borderTopLeftRadius: options.box.borderRadius + 'px', borderBottomLeftRadius: options.box.borderRadius + 'px' });
        if (options.showLogo) { $('#facebook-sidebar .fbsb-logo').css('background-position', '-450px 0px'); }
        $('a.trigger').hover(function() { $(this).css('width', '48px'); }, function() { $(this).css('width', '44px'); });
        
        var statusClicked = false;
        $('a.trigger').click(function(e) {
			if (statusClicked) {
				statusClicked = false;
				$('a.trigger').width(48);
				$('a.trigger').css('backgroundPosition', '-450px -50px');
				$("#facebook-sidebar").stop().animate({
					width: '0px'
				}, 500);
			}
			else {
				statusClicked = true;
				$('a.trigger').width(44);
				$('a.trigger').css('backgroundPosition', '-550px -50px');
				$("#facebook-sidebar").stop().animate({
					width: options.box.width + 'px'
				}, 500);
			}
        });
    };
})(jQuery);


