var url = '/styles/Fresh/';

$(document).ready(function() 
{    
    /**
        Here is the homepage animation. We just make some effects, 
        it's very light but for some computers, it can be slow :(
    **/
    $("body#homepage div#header").css({position:'absolute', left:($(document).width() - 595) / 2, top:"-260px"});
    $("body#homepage div#header h1 a").css({'opacity':0});
    $("body#homepage div#header").animate({top:($(document).height() - 270) / 2}, 2800, function() {
            $("body#homepage div#header h1 a").animate({opacity:0.9}, 1000); 
        }
    );
    
    $("body#homepage div#header h1 a").click(
        function() 
        {
            $("div#header h1 a").animate({left:0}, 300, function() {
                $("ul#navigation").animate({top:0}, 500);
            });
                return false;
        }
    );

	/** 
        To improve the accessibility of the page, we add an element #accessibility 
        just after the navbar. Actions are : 
            - making the text serif.
            - making the text sans. 
            - increasing (or decreasing) the text size. 
    **/
    if($("body#homepage").height() == null)
    {
        $("ul#navigation")
            .after(
                '<ul id="accessiblity">'+
                    '<li><a onclick="Texte.sans()"><img src="'+url+'img/font.sans.png" alt="" /></a></li>'+
                    '<li><a onclick="Texte.serif()"><img src="'+url+'img/font.serif.png" alt="" /></a></li>'+
                    '<li><a onclick="Texte.increase()"><img src="'+url+'img/font.plus.png" alt="" /></a></li>'+
                    '<li><a onclick="Texte.decrease()"><img src="'+url+'img/font.moins.png" alt="" /></a></li>'+
                '</ul>'
            );
    }
    
    /**
        For each "pre" or "code", I want to show only some lines. The user can click on
        to display the whole code.
    **/
    var isRemovable = true;
    $("div#main pre").wrap('<div class="source"></div>');
	
	$("div#main div.source")
        .hover(
            function() {
                $("div#seesource").remove();
                $(this).append("<div id='seesource'>Voir le code source</div>");
                
                var postop = ($(this).height() - $("div#seesource").height()) /2;
                var posleft = ($(this).width() - $("div#seesource").width()) /2; 
                
                $("div#seesource").css({top:postop, left:posleft});
            },
            function() {
                if(isRemovable == true)
                {
                    $("div#seesource").remove();
                }
            }
        )
        .click(function() {
            $("div#showcode").remove();
            $("span#seesource").remove();
            
            $("div#page").append("<div id='showcode'><a><span>Fermer</span></a><pre><span></span></pre></div>");
            $("div#showcode > a").fadeOut(0); 
            $("div#showcode pre span").html($(this).children("pre").html());
            var hauteur = 300;
            if($('div#showcode pre span').height()+50 < hauteur)
                hauteur = $('div#showcode pre span').height()+50;
            
            $("div#showcode span").fadeIn();
            
            var middleTopS = $(window).height() / 2;
            var middleTopE = ($(window).height() - hauteur) / 2;
            var middleLeftS = $('body').width() / 2; 
            var middleLeftE = ($('body').width() - 600) / 2; 
            
            $("div#showcode")
                .css('top', middleTopS)
                .css('left', middleLeftS)
                .css('font-size', 0)
                .animate({width:600, height:hauteur, left:middleLeftE, top:middleTopE, fontSize:12}, 1000, function() {
                    $("div#showcode pre span").slideDown(1000);
                    $("div#showcode > a").fadeIn(1000);
                });
            
            $("div#showcode a").click(function() {
                $("div#showcode *").fadeOut(200, function() {
                    $("div#showcode").animate({width:0, height:0, left:middleLeftS, top:middleTopS}, 1000, function() { $(this).remove(); });
                }); 
            });
        });

   /**
        If the pictures aren't loaded yet, the program is waiting.
        Safari and, maybe, other webkit browsers has the problem to calculate
        the widht and height of all elements even if pictures aren't loaded. 
    **
    var images2Load = $("div#main div.post img").size();
    if(images2Load == 0 || $.browser.safari == false)
    {
		createSpecialBackground();
    }
	else 
	{
    	$("div#main div.post img").load(function(){
        	images2Load = images2Load - 1; 
        	if(images2Load == 0)
        	{
            	createSpecialBackground();
        	}
    	});
	}
	**/
	Texte.loadFromCookie();
});

/**

**/
var Texte = {
    fontSize : 13, 
    selector : 'div#main .content p, div#main .content blockquote, div#main .content ul, div#commentaires blockquote, div#commentaires form label',
    type : 'serif', 
    
    cookieNameSize : 'fontSize', 
    cookieNameType : 'fontfamily', 
    
    serif : function () {
        if(Texte.type == 'serif')
            return; 
            
        Texte.type = 'serif'; 
        $(Texte.selector).css({fontFamily:'Baskerville Old Face, sans-serif'});
        Texte.saveCookie('font');
    }, 
    
    sans : function() {
        if(Texte.type == 'sans')
            return; 

        Texte.type = 'sans'; 
        $(Texte.selector).css({fontFamily: 'verdana, sans'});
        Texte.saveCookie('font');
    },
    
    increase: function() {
        if((Texte.type == 'serif' && Texte.fontSize > 14) || (Texte.type == 'sans' && Texte.fontSize > 12))
            return; 
        
        Texte.fontSize++;
        $(Texte.selector).css({fontSize:Texte.fontSize});
        Texte.saveCookie('size');
    },
    
    decrease: function() {
        if((Texte.type == 'sans' && Texte.fontSize < 10) || (Texte.type == 'serif' && Texte.fontSize < 11))
            return; 
        
        Texte.fontSize--;
        $(Texte.selector).css({fontSize:Texte.fontSize});
        Texte.saveCookie('size');
    }, 

    loadFromCookie : function()  {
        var size = null; 
        var type = 'serif';
        
        if($.cookie(Texte.cookieNameSize) != null)
        {
            size = parseInt($.cookie(Texte.cookieNameSize));
        }

        if($.cookie(Texte.cookieNameType) != null)
        {
            type = $.cookie(Texte.cookieNameType);
        }
        
        if(type == 'sans')
        {
            Texte.sans();
        }
        
        if(size != null && size < 15 && size > 9)
        {
            Texte.fontSize = size;
            $(Texte.selector).css({fontSize:Texte.fontSize});
        }
    }, 
    
    saveCookie: function(t) {
        if(t == 'size') 
            $.cookie(Texte.cookieNameSize, Texte.fontSize, {path:'/'}); 
        if(t == 'font')
            $.cookie(Texte.cookieNameType, Texte.type, {path:'/'});
    }
};

/**
    Each entry in the blog has a special background. We define by default, 
    then, this script is making another one (for the transparent background 
    in the bottom of the entry).
**/
function createSpecialBackground() 
{
	$("div.fakebackground").remove();
    $("div.carnet .pagination").css('margin', '-24px 267px');
    $("div.carnet div.post").each(function() {
        $("div.carnet .content").css('margin','25px 50px');
        $(this)
            .css({backgroundImage:'url(\''+url+'img/fond.blog.bas.png\')', backgroundPosition:'-30px bottom', backgroundRepeat:'no-repeat'})
            .prepend('<div class="fakebackground" style="height:'+($(this).height()-100)+'px"></div>');
    });
}