//detecter la largeur de l'ecran pour donner la taille a l'image
var repimage='';
var href = location.href;
var maReg = new RegExp( "/index\.html?", "gi") ;
var racine = href.replace( maReg, '/' ) ;

function setSize(){
    repimage='';
    var total = $(window).width();
    var hauteur=Math.ceil(total/1.5);
    if (total > 1200)
    {
        //zone dispo plus grande que l'image globale
        $('#mainCont').css('width','1201px');
        $('#mainCont').css('height','800px');
        $('#mainCont').css('margin-left','-600px');
        $('#mainCont').css('left','50%');
        if ($(window).height() > (total*1.5) )
        {
            $('#mainCont').css('margin-top','-400px');
            $('#mainCont').css('top','50%');
            
        }
        else{
            $('#mainCont').css('margin-top','0px');
            $('#mainCont').css('top','0%');
        }
        $('#mainCont').css('display','block');
        
        total=1201;
    }
    else{
        //cas general
        if (total < 840)
        {
           
            repimage='small/';
        }
        
        $('#mainCont').css('display','block');
        $('#mainCont').css('height',hauteur+'px');
        $('#mainCont').css('margin-left','0px');
        $('#mainCont').css('left','0%');
        $('#mainCont').css('margin-top','0px');
        $('#mainCont').css('top','0%');
        
    }
    var text = $('#zoneText');
    
    text.css(
        {
            'left':Math.round(total*0.70)+'px',
            'width':Math.round(total*0.28)+'px',
            'font-size':'1em'
        });
    var i=1;
    while ((text.height() > (hauteur*0.7)) && i>0.3 ){
        i-=0.1;
        text.css('font-size',i+'em');
    }
    $('#mainbg').css('width',total+'px');
    $('.folowWidth').css('width',total+'px');
}
$(window).resize(function()
    {
        setSize();
    });
$(function()
{
    setSize();
    //etablir le roll over
    $('.rollable').hover(
        function()
        {
            $(this).css('background-position','0 0');
        },
        function()
        {
            $(this).css('background-position','0 -77px');
        }
    ).click(
        function()
        {
            var cible = $(this).children('.attribut').text();
            window.open(cible);
        }
    );
    //precharger le fond
    var imBg = new Im();
    imBg.setSrc(racine+'src/img/bg_photo.jpg');
    imBg.registerCallBack(function(){
        //alert(imBg.element.src+' '+imBg.element.width);
        //$('#mainbg').get().src=imBg.element.src;
        $('#mainbg').attr({ 
            src: "src/img/bg_photo.jpg"
        });
        //ajouter les liens photo
        //$('#zoneZoom').css();//append($('<div id="photo1"><span class="attribut">src/img/elem_plenise.jpg</span><span class="desc">salle d\'expo</span>[détail]</div><div id="photo2"><span class="attribut"></span>[détail]</div><div id="photo3"><span class="attribut"></span>[détail]</div><div id="photo4"><span class="attribut"></span>[détail]</div><div id="photo5"><span class="attribut"></span>[détail]</div>'));
        //preparer le zoom des photo
        $('#zoneZoom').css('display','block').children('div').click(
            function(){
                //alert($(this).attr('id'));
                //ajouter le chargement
                var sourceClick = $(this);
                $(this).append($("<img src='src/img/load.gif' />"));
                var target = $(this).children('.attribut').text();
                var desc = $(this).children('.desc').text()+" [Pour fermer, cliquer sur l'image]";
                
                var im=new Im();
                im.setSrc(racine+'src/img/photo/'+repimage+target);
                im.registerCallBack(
                    function(){
                        //var dest = new Image(im.element.src);
                        //var image = $(dest);
                        var loupe = $("<div class='loupe'><img class='imageZoom' src='"+racine+"src/img/photo/"+repimage+target+"' /><div class='description'>"+desc+"</div></div>").click(
                            function(){
                                $(this).fadeOut('slow',function()
                                {
                                    $(this).remove();
                                    $('#zoneImage').css('display','none')
                                });
                            }
                        ).css(
                        {
                            //'border':'1px solid red',
                            'display':'none'
                        });
                        
                        sourceClick.children('img').remove();
                        $('#zoneImage').css('display','block').append(loupe);
                        //$('#zoneImage').css('visibility','hidden').append(loupe);
                        //while(loupe.height()==0){};//secu pour attendre l'insertion
                        
                        
                        var loupeOffsetH = Math.round(loupe.height()/2);
                        var loupeOffsetW = Math.round(loupe.width()/2);
                        if (loupeOffsetH < 20){
                            loupeOffsetH = 200;
                        }
                        loupe.css(
                        {
                            'margin-top':'-'+loupeOffsetH+'px',
                            'margin-left':'-'+loupeOffsetW+'px',
                            'width':loupeOffsetW*2+'px'
                            //'margin-left':'-'+Math.round(loupe.width()/2)+'px'
                        }).fadeIn();
                        
                        
                    }
                );
                im.waitForLoadComplete();
            }
        )
    });
    imBg.waitForLoadComplete();
    
    //preparer
    
    
});