// JavaScript Document


//Chrome || Safari browser.
$.browser.chrome    = $.browser.webkit && !!window.chrome;
$.browser.safari    = $.browser.webkit && !window.chrome;

/* Objets et variables ----------------- */


initDetectBrowser = function() {
    if(!BrowserDetect.isMinimal) {
        window.location = BrowserDetect.redirectPage;
        return;
    }
}

initMainVars = function () {
    
    //xml obejcts
    // Projects
    projects        = [];
    jury            = [];
    laureats        = [];
    finalistes      = [];
    projects.count  = 0;
    particles = [];
    
    // Homepage
    winners         = [];
    agenda          = [];
    homeTexts       = [];
    
    moduloPlanes        = 0;
    htmlLoaded          = false;
    firstClickTags      = false;
    canvasInitiated     = false;
    scrollHtml          = false;
    scrollingBar        = false;
    loadedFooterHtml    = false;
    canvasDisplay       = '3d';
    scrollList          = false;
    
    minScroll           = 0;
    maxScroll           = 0;
    cntScroll           = 0;
    cntScrollStart      = 0;
    
    minScrollBar        = 0;
    maxScrollBar        = 0;
    cntScrollBar        = 0;
    cntScrollBarStart   = 0;
    
    mainMenu                = [
    'Accueil',
    'Edition 2010',
    'Candidater',
    'Le Jury',
    'Critères',
    'Actualités',
    'Démarche CCI de Lyon'
    ];
    
    footerMenu                = [
    'Presse',
    'Contacts & partenaires',
    'Réglement',
    'Lyon Shop & Design'
    ];
    
    column                  = [];
    column[1]               = [
    'affichage',
    'classement',
    'secteur d\'activité',
    'type de site',
    'type de prestataire'
    ];
    
    moduleAffichage         = [
    'Spirale',
    'Aléatoire',
    'Liste'
    ];
    
    displayType             = moduleAffichage[0];
    
    projectTags             = [
    'Mode, accessoires',
    'Beaute & bien-être',
    'Alimentaire, metiers de bouche',
    'Hotellerie & Tourisme',
    'Restauration',
    'Santé',
    'Culture & loisirs',
    'Maison & décoration',
    'Auto, moto, cycle',
    'Services'
    ];
    
    projectCategories       = [
    'Site vitrine',
    'Site Marchand'
    ];
    
    projectLieux            = [
    'Magasin',
    'Magasin et vente en ligne',
    'Vente en ligne'
    ];
    
    projectPrestataires     = [  
    'Agence Globale',
    'Agence Digitale',
    'Freelance'  
    ];
    
    projectInterlocuteur    = [
    'Agence',
    'Commerçant'  
    ];
    
    projectClassement       = [
    'Tous',
    'Finalistes',
    'Lauréats'  
    ];
    
    projects                = [];
    jury                    = [];
    laureats                = [];
    finalistes              = [];
    
    formProject             = [
    ['Enseigne'                                                                     ,'0'    ,'0'    ,null                   ,'participant_nom_enseigne'             ],
    ['Nom'                                                                          ,'0'    ,'0'    ,null                   ,'participant_nom'                      ],
    ['Prénom'                                                                       ,'0'    ,'0'    ,null                   ,'participant_prenom'                   ],
    ['Email'                                                                        ,'0'    ,'0'    ,null                   ,'participant_mail'                     ],
    ['Raison sociale'                                                               ,'1'    ,'0'    ,null                   ,'participant_nom_agence'               ],
    ['Nom'                                                                          ,'1'    ,'0'    ,null                   ,'participant_nom_contact_agence'       ],
    ['Prénom'                                                                       ,'1'    ,'0'    ,null                   ,'participant_prenom_contact_agence'    ],
    ['Email'                                                                        ,'1'    ,'0'    ,null                   ,'participant_mail_agence'              ],
    ['Type de prestataire'                                                          ,'1'    ,'1'    ,projectPrestataires    ,'participant_type_agence'              ],
    ['Site web du prestataire'                                                      ,'1'    ,'0'    ,null                   ,'participant_url_agence'               ],    
    ['Organisation du point de vente'                                               ,'2'    ,'1'    ,projectLieux           ,'participant_organisation_point_vente' ], 
    ['Type de site'                                                                 ,'2'    ,'1'    ,projectCategories      ,'participant_type_site'                ],
    ['URL du site'                                                                  ,'2'    ,'0'    ,null                   ,'participant_url'                      ],
    ['3 à 5 captures d\'écran'                                                            ,'2'    ,'2'    ,null                   ,'participant_images'                   ],
    ['Activités du point de vente'                                                  ,'3'    ,'1'    ,projectTags            ,'participant_activite_point_vente'     ],
    ['Interlocuteur Privilégié'                                                     ,'3'    ,'1'    ,projectInterlocuteur   ,'participant_interlocuteur_privilegie' ],
    ['Date de 1ere mise en ligne jj/mm/aaaa'                                        ,'3'    ,'0'    ,null                   ,'participant_mise_en_ligne'            ],
    ['<span class="checkboxText">J\'ai lu et j\'accepte<br /><a href="download.php">le règlement du concours</a></span>'   ,'3'    ,'3'    ,null                   ,'participant_interlocuteur_privilegie' ]
    ];
    
    allDatesMonths = [
    'Janvier',
    'Février',
    'Mars',
    'Avril',
    'Mai',
    'Juin',
    'Juillet',
    'Août',
    'Septembre',
    'Octobre',
    'Novembre',
    'Décembre'
    ];
    
    sendForm = [];
    
    romanNumbers = [
    'I',
    'II',
    'III',
    'IV',
    'V',
    'VI',
    'VII',
    'VII',
    'VIII',
    'IX',
    'X'
    ];
    
    ieWH            = $(window).height();
    ieWW            = $(window).width();
    optimalWindowW  = 1440;
    optimalWindowH  = 1080;
    ratioW          = ieWW / 1440;
    ratioH          = ieWH / 1080;

    htmlW40prc      = Math.round((ieWW/5)*2);
    htmlH40prc      = Math.round((ieWH/5)*2);
    
    htmlW60prc      = Math.round((ieWW/5)*3);
    htmlH60prc      = Math.round((ieWH/5)*3);
    
    if(htmlW40prc< 500){
        htmlW40prc = 500;
    }
    
    marginL             = Math.round(htmlW40prc/50)*3;
    marginT             = Math.round(htmlH40prc/50)*3;
    
    siteMainColor       = '#80bb0c';
    siteAlertColor      = '#b51924';
    siteMainDarkColor   = '#0b121a';
    siteSndDarkColor    = '#0a2330';
    siteGreyColor       = '#8d9396';
    
    
    fontRatio = 1600/ieWW;
    if(ieWW >= 1600) {
        fontRatio = 1;
    }
    
    $('#leftColumn #candidater').css({
        'font-size':30/fontRatio+'px',
        'line-height':36/fontRatio+'px'
    });
    
}


resizeElements = function () {
    ieWW = $(window).width();
    ieWH = $(window).height();
    if(htmlLoaded) {
        switch(page.id)  {
            case '0' :
                $('#htmlText-'+page.id+' .content').stop().animate({
                    'top':130/fontRatio+'px'
                }, 300, 'easeOutQuint', function (){
                    adjustElemHeight('homepage', $('#htmlText-'+page.id), $('#htmlText-'+page.id+' .content'), $('#hideTextA'), null, 0, 250);                    
                });
                break;          
            case '1' :
                $('.rightColumn').css({
                    'left' : ieWW
                });
                $('#getRightColumn').css({
                    'left' : ieWW - 90
                }); 
                // $('canvas').css({'width':ieWW});
                adjustElemHeight('columnRight', $('#rightColumn-1'), $('#rightColumn-1'), $('#module-4 div').last(), function (){
                    cancelWaitForAction ('hideColumn')
                }, 0, 250);
                break;
            case '2' :
                $('#formulaire').stop().animate({
                    'top':130/fontRatio+'px'
                }, 300, 'easeOutQuint', function (){
                    adjustElemHeight('form', $('#htmlText-'+page.id), $('#formulaire'), $('#embedLinkHoverBLeft-Envoyer'), null, 50, 250);
                });
                break; 
            case '3' :
                $('#htmlText-'+page.id+' .content').stop().animate({
                    'top':130/fontRatio+'px'
                }, 300, 'easeOutQuint', function (){
                    adjustElemHeight('jury', $('#htmlText-'+page.id), $('#htmlText-'+page.id+' .content'), $('.juryItem').last(), null, 0, 250);
                });
                break;
            case '4' :
                $('#htmlText-'+page.id+' .content').stop().animate({
                    'top':130/fontRatio+'px'
                }, 300, 'easeOutQuint', function (){
                    adjustElemHeight('criteres', $('#htmlText-'+page.id), $('#htmlText-'+page.id+' .content'), $('#htmlText-'+page.id+' .content .lastcriteres'), null, 0, 250);
                });
                break;
            case '5' :
                $('#htmlText-'+page.id+' .content').stop().animate({
                    'top':130/fontRatio+'px'
                }, 300, 'easeOutQuint', function (){
                    adjustElemHeight('reglement', $('#htmlText-'+page.id), $('#htmlText-'+page.id+' .content'), $('#htmlText-'+page.id+' .content div').last(), null, 0, 250);
                });
                break;
            case '6':
                $('#htmlText-'+page.id+' .content').stop().animate({
                    'top':130/fontRatio+'px'
                }, 300, 'easeOutQuint', function (){
                    adjustElemHeight('demarche', $('#htmlText-'+page.id), $('#htmlText-'+page.id+' .content'), $('#htmlText-'+page.id+' .content div').last(), null, 0, 250);
                });
                break;
        }
    }
}


$(window).resize(function(){
    resizeElements();
});


initMainObjects = function (){
    page = {
        id                  : 0,
        oldid               : 0,
        title               : null,
        type                : null,
        column              : false,
        xml                 : null,
        htmlText            : null,
        init                : function(id, title, type, column, xml, htmlText ) {
            var self        = this;
            this.id         = id;
            this.title      = title;	
            this.type       = type;	
            this.column     = column;	
            this.xml        = xml;
            this.htmlText   = htmlText;
            this.loadxml ();
            this.loadColumn();
            releaseMenu(false);
            if(loadedFooterHtml){
                unloadFooterHtml();
                loadedFooterHtml = false;
                if(htmlLoaded){
                    unloadHtml();
                    setTimeout(function(){
                        self.loadHtml()
                    },2000);
                    this.oldid = id;
                } else {
                    this.loadHtml();
                    this.oldid = id;
                }
            } else {
                if(htmlLoaded){
                    unloadHtml();
                    setTimeout(function(){
                        self.loadHtml()
                    },2000);
                    this.oldid = id;
                } else {
                    this.loadHtml();
                    this.oldid = id;
                }  
            }
        },
        loadxml		: function () {
            if( this.xml != null ) {
                x = 0;
                $.ajax({
                    type: "GET",
                    url: "xml/"+this.id+".xml",
                    dataType: "xml",
                    success: function(xml) {
                        switch(page.id)
                        {
                            case '0':
                                $(xml).find('winner').each(
                                    function(i) {
                                        winners[i] = {
                                            id            : i ,
                                            title         : $(this).find('winner_title').text(),
                                            url           : $(this).find('winner_url').text(),
                                            text          : $(this).find('winner_text').text(),
                                            agency        : $(this).find('agency').text(),
                                            agencyUrl     : $(this).find('agency_url').text(),
                                            category      : $(this).find('winner_category').text()
                                        }
                                        winners.count = winners.length;
                                    });
                                $(xml).find('homeText').each(
                                    function(i) {
                                        homeTexts[i] = {
                                            id            : i ,
                                            title         : $(this).find('homeText_title').text(),
                                            url           : $(this).find('homeText_url').text(),
                                            textA         : $(this).find('homeText_text_a').text(),
                                            textB         : $(this).find('homeText_text_b').text()
                                        }
                                        homeTexts.count = homeTexts.length;
                                    });
                                break;
                            case '1':
                                $(xml).find('project').each(
                                    function(i) {	
                                        projects[i] = {
                                            id           : i ,
                                            title        : $(this).find('project_title').text(),
                                            url          : $(this).find('project_url').text(),
                                            projectText  : $(this).find('project_text').text(),
                                            agency       : $(this).find('agency').text(),
                                            agencyUrl    : $(this).find('agency_url').text(),
                                            agencyText   : $(this).find('agency_text').text(),
                                            category     : $(this).find('project_category').text(),
                                            tags         : $(this).find('project_tag').text(),
                                            presta       : $(this).find('project_presta').text(),
                                            images       : $(this).find('project_images').text(),
                                            miniature    : $(this).find('project_min').text(),
                                            laureat      : $(this).find('laureat').text(),
                                            finaliste    : $(this).find('finaliste').text(),
                                            visuels   : {
                                                width  : 0,
                                                height : 0,
                                                top    : 0,
                                                left   : 0
                                            }
                                        };
                                        if (projects[i].finaliste == 1 ){
                                            finalistes.push(i);
                                        }
                                        if (projects[i].laureat == 1 ){
                                            laureats.push(i);
                                        }
                                        projects.count = projects.length;
                                        moduloPlanes = projects.count;
                                    });                                
                                break;
                            case '7':
                                break;
                        }
						
                    }
                });
            }
        },
        loadColumn          : function () {
            if( this.column != false ) {
                switch(page.id)
                {
                    case '1':
                        loadColumn (page.id, false);
                        break;
                }
            }
        },
        loadHtml          : function () {
            if( this.htmlText != null ) {
                htmlLoaded = true;
                switch(page.id)
                {
                    case '0':
                        loadHtml (page.id, 'none', false);
                        break;                      
                    case '1':
                        loadHtml (page.id, 'none', false);
                        break;                        
                    case '2':
                        loadHtml (page.id, 'none', false);
                        break;                    
                    case '3':
                        loadHtml (page.id, 'none', false);
                        break;
                    case '4':
                        loadHtml (page.id, 'none', false);
                        break;
                    case '5':
                        loadHtml (page.id, 'none', false);
                        break;
                    case '6':
                        loadHtml (page.id, 'none', false);
                        break;
                }
            } else {
                htmlLoaded = false;
            }
        }
    };
};
	
initActus = function () {
    $.ajax({
        type: "GET",
        url: "xml/actus.xml",
        dataType: "xml",
        success: function(xml) {
            $(xml).find('agenda').each(   
                function(i) {	
                    agenda[i] = {
                        id          : i ,
                        title       : $(this).find('title').text(),
                        dateStart   : $(this).find('date_start').text(),
                        dateEnd     : $(this).find('date_end').text(),
                        category    : $(this).find('category').text(),
                        position    : 0
                    }
                    agenda.count = agenda.length;
                });
            initAgendaNews ();
        }
    });
};


releaseMenu = function (val){
    if (val == false ) {
        var blockMenu = $('#blockMenu');
        blockMenu.css({
            'width'      :$('#leftColumn').width()+ 50,
            'display'    :'block'
        });
    } else {
        blockMenu = $('#blockMenu');
        blockMenu.css({
            'display':'none'
        });
    }
}

initMainMenu = function () {
    for (var x=0;x<mainMenu.length; x++) {
        $('#menu').append('<div id="menu-'+x+'" data-id="'+x+'" class="menuLeft">'+mainMenu[x]+'</div>');
        var menuItem = $('#menu-'+x);
        var fontSizeMenu = Math.round(ratioH*12);
        
        if(fontSizeMenu >= 11) {    
            fontSizeMenu = 11;
        } else if (fontSizeMenu <= 9){
            fontSizeMenu = 9;
        }
        if (marginT > 20) {
            menuItemTop = $('#candidater').offset().top + $('#candidater').height() + 50 + (x * fontSizeMenu*1.3)+'px';
        } else {
            menuItemTop = $('#candidater').offset().top + $('#candidater').height() + (marginT * 3) + (x * fontSizeMenu*1.3)+'px' ;
        }
        
//        var longString = mainMenu[x];
//        
//        for(var t=0; t<longString.length; t++){
//            $('#menu-'+x).append('<span id="menu-'+x+'-'+t+'" class="menuLettre"><span>'+longString[t]+'</span><br /><span class="last">'+longString[t]+'</span></span>');
//            
//            if(longString[t] == ' '){
//                $('#menu-'+x+'-'+t).addClass('space');
//            }
//        }
                
//        var menuTimeOut;
//        
//        $('.menuLeft').hover(function () {
//            var $$ = $(this);
//            clearTimeout(menuTimeOut);
//            menuTimeOut = setTimeout(function(){
//                var mH = $$.attr('id');
//                for(var t=0; t<longString.length; t++){
//                    $('#'+mH+'-'+t).stop().delay(t*12).animate({
//                        'margin-top'    :'-15px'
//                    },120,'easeOutExpo');
//                }
//            },100);
//        },function (){
//            var $$ = $(this);
//            var mH = $$.attr('id');
//            for(var t=0; t<longString.length; t++){
//                $('#'+mH+'-'+t).stop().delay(t*12).animate({
//                    'margin-top'    :'0px'
//                },120,'easeOutQuint');
//            }
//        });

        
        
        menuItem.css({
            'height'        : fontSizeMenu*1.3+'px',
            'font-size'     : fontSizeMenu+'px',
            'top'           : menuItemTop
        });
        
        var menuW = menuItem.width() + 30;
	
        menuItem.delay(x*50).animate({
            'width':menuW
        },300,'easeOutSine');
    }

    $('.menuLeft').hover(function () {
        if(!$(this).hasClass('active')){
            $(this).animate({'color':siteMainColor},300,'easeOutQuint');
        }
    },function (){
        if(!$(this).hasClass('active')){
            $(this).animate({'color':siteGreyColor},300,'easeOutQuint');
        }
    });
    
    /*************************/
    //        var tempTop = parseInt(menuItemTop,10)-10; 
    //        $('#menu-1').css({'display':'none'});$('#menu-4').css({'display':'none'});$('#menu-5').css({'display':'none'});$('#menu-6').css({'display':'none'});
    //        $('#menu-2').css({'top':tempTop-52+'px'});
    //        $('#menu-3').css({'top':tempTop-37+'px'});
    /*************************/

    $('.menuLeft').click(function(evt) {
        var menuId = $(this).attr('data-id');
        if(menuId != oldMenuId) {
            oldMenuId = menuId;
            switch(menuId)
            {
                // Accueil
                case '0':
                    page.init(menuId, mainMenu[menuId], '2d', true, mainMenu[menuId], mainMenu[menuId]);
                    removeListeners();
                    break;
                
                
                // Participants
                case '1':
                    if(!canvasInitiated){
                        page.init(menuId, mainMenu[menuId], '3d', true, mainMenu[menuId], mainMenu[menuId]);
                    }
                    //addListeners();
                    break;
                
                // Candidater
                case '2':
                    page.init(menuId, mainMenu[menuId], '2d', false, null, mainMenu[menuId]);
                    removeListeners();
                    break;
                
                // Jury
                case '3':
                    page.init(menuId, mainMenu[menuId], '2d', false, null, mainMenu[menuId]);
                    removeListeners();
                    break;
                
                // Critères
                case '4':
                    page.init(menuId, mainMenu[menuId], '2d', false, null, mainMenu[menuId]);
                    removeListeners();
                    break;
                
                // Réglement
                case '5':
                    page.init(menuId, mainMenu[menuId], '2d', false, null, mainMenu[menuId]);
                    removeListeners();
                    break;
                
                // Actualités & agenda
                case '6':
                    page.init(menuId, mainMenu[menuId], '2d', false, null, mainMenu[menuId]);
                    removeListeners();
                    break;
            }
            $(this).addClass('active');
            switchActiveMenu ();
        } else {
            evt.preventDefault();
            $(this).removeClass('active');
        }
    });
    switchActiveMenu ();
    menuId      = '0';
    oldMenuId   = '0';
    page.init(menuId, mainMenu[menuId], '2d', true, mainMenu[menuId], mainMenu[menuId]);
};


switchActiveMenu = function () {
    for (var i=0;i<mainMenu.length; i++) {
        var menuItem = $('#menu-'+i);
        if(page.id !=i){
            menuItem.animate({
                'color':siteGreyColor,
                'left':110
            },300,'easeOutExpo');
        } else {
            menuItem.animate({
                'color':'#ffffff',
                'left':80
            },300,'easeOutExpo');
            $('#dummyMenu').css({
                'width'         :menuItem.width(),
                'height'        :menuItem.height(),
                'top'           :menuItem.offset().top,
                'left'          :menuItem.offset().left,
                'background'    :'red',
                'z-index'       :1600
            });
            if(page.id==2){
                $('#candidater').animate({
                    'color':siteMainColor
                },500,'easeOutQuint');
            } else {
                $('#candidater').animate({
                    'color':'white'
                },500,'easeOutQuint');
            }
            var arrowT = $('#menu-'+i).position().top+5;
            var arrowL = 40;
            addArrow_R ('#menu', 'test', 20, 3, arrowT, arrowL);
        }
    }
};

/* Column ---------------------------------*/
loadColumn = function (pageId, display) {
    $('body').append('<div id="getRightColumn"></div><div class="rightColumn" id="rightColumn-'+pageId+'"></div>');
    $('.rightColumn').css({
        'position'          :'absolute',
        'z-index'           : '100',
        'width'             : '260px',
        'height'            : '100%',
        'background-color'  : siteMainDarkColor,
        'left'              : ieWW,
        'color'             : 'white',
        'font-family'       : 'GothamMedium',
        'font-size'         : '13px',
        'text-transform'    : 'uppercase'
    });
    
    $('#getRightColumn').css({
        'position'          :'absolute',
        'z-index'           :'99',
        'width'             :'82px',
        'padding-left'      :'8px',
        'height'            : '100%',
        'background-color'  : siteMainDarkColor,
        'left'              : ieWW,
        'color'             :'white',
        'opacity'           :'1',
        'font-family'       :'GothamMedium',
        'font-size'         :'8px',
        'text-transform'    :'uppercase'
    });
   
    
    
    for(var r=0;r<column[pageId].length;r++){
        addModule(column[pageId][r],r);
    }
    
    $('#getRightColumn').hover(
        function () {
            displayColumn ();
        }, 
        function () {

        });
        
    $('.rightColumn').hover(
        function () {
            cancelWaitForAction ('hideColumn');
        }, 
        function () {
            waitForAction("hideColumn()",700);
        });
    
    if(!display && !scrollingBar) {
        setTimeout('hideColumn()', 2500);
    } else {
        displayColumn ();
    }
    setTimeout(function (){
        checkElemHeight('columnRight', $('#rightColumn-1'), $('#rightColumn-1'), $('#module-4 div').last(), function (){
            cancelWaitForAction ('hideColumn')
        }, 0, 250);
    }, 1500);
};

unloadColumn = function () {        
    $('.rightColumn').animate({
        'left':ieWW
    },800,'easeOutExpo',function () {
        $(this).remove();
    });
    $('#getRightColumn').animate({
        'left':ieWW - 90
    }, 500,'easeOutExpo', function () {
        $(this).remove();
    });
};

displayColumn = function (){
    $('.rightColumn').delay(200).animate({
        'left':ieWW - 260
    },800,'easeOutExpo');
    $('#getRightColumn').animate({
        'left':ieWW
    }, 500,'easeOutExpo');
    $('#scroll-columnRight').show();
};

hideColumn = function (){
    $('.rightColumn').animate({
        'left':ieWW
    },800,'easeOutExpo',function (){
        $(this).css({
            'top':'0px'
        });
        $('#scrollbar-columnRight').css({
            'top':'0px'
        });
    });
    $('#getRightColumn').animate({
        'left':ieWW - 90
    }, 500,'easeOutExpo');
    $('#scroll-columnRight').hide();
};

/* Modules ---------------------------------*/
addModule = function (module,i) {
    switch(module)
    {   
        case 'classement' :
            loadModuleClassement(module, i);
            break;
        case 'affichage' :
            loadModuleAffichage(module, i);
            break;
        case 'secteur d\'activité' :
            loadModuleSecteur(module, i);
            break;
        case 'type de site' :
            loadModuleCategories(module, i);
            break;
        case 'type de prestataire' :
            loadModulePrestataires(module, i);
            break;
    }
};

loadModuleAffichage = function (module,id) {
    $('.rightColumn').append('<div class="module" id="module-'+id+'" name="'+module+'" ><span>'+module+'</span></div>'); 
    $('#getRightColumn').append('<div class="moduleGet" id="moduleGet-'+id+'" name="'+module+'" ><span class="getSpan">'+module+'</span></div>'); 
    for(var i=0;i<moduleAffichage.length;i++){
        $('#module-'+id).append('<div id="subModAffichage-'+i+'" data-id="'+i+'" style="background:url(images/aff-'+i+'.png);" class="subModAffichage"><span>'+moduleAffichage[i]+'</span></div>');
        $('#moduleGet-'+id).append('<div id="subModAffichageGet-'+i+'" data-id="'+i+'" style="background:url(images/aff-'+i+'.png); display:none;" class="subModAffichageGet"><span>'+moduleAffichage[i]+'</span></div>');
    }
    $(".subModAffichage").click(function() {
        var dataid = $(this).attr('data-id');
        displayType = moduleAffichage[dataid];
        $('.subModAffichageGet').css({
            'display':'none'
        });
        getActiveAffichage();
    });
    
    
};

getActiveAffichage = function () {
    var dTi = 0;
    switch(displayType)
    {
        case moduleAffichage[0]:
            if(canvasDisplay == '3d'){
                reorganizeSpirale(true, true);
                dTi = 0;
                $('#subModAffichageGet-'+dTi).css({
                    'display':'block'
                });
                canvasDisplay = '3d';
            } else {
                hideList();
                setTimeout(function() {
                    reorganizeSpirale(true, true)
                },1600);
                dTi = 0;
                $('#subModAffichageGet-'+dTi).css({
                    'display':'block'
                });
                canvasDisplay = '3d';
            }
            break;
        
        case moduleAffichage[1]:
            if(canvasDisplay == '3d'){
                reorganizeRandom(true, true);
                dTi = 1;
                $('#subModAffichageGet-'+dTi).css({
                    'display':'block'
                });
                canvasDisplay = '3d';
            } else {
                hideList();
                setTimeout(function() {
                    reorganizeRandom(true, true)
                },1600);
                dTi = 1;
                $('#subModAffichageGet-'+dTi).css({
                    'display':'block'
                });
                canvasDisplay = '3d';
            }
            break;
        
        case moduleAffichage[2]:
            if(canvasDisplay != '2d'){
                reorganizeListe(false, false);
                dTi = 2;
                $('#subModAffichageGet-'+dTi).css({
                    'display':'block'
                });
                canvasDisplay = '2d';
            } else {
                $('canvas').css({
                    'opacity':'0'
                });
                reorganizeListe(false, false);
                dTi = 2;
                $('#subModAffichageGet-'+dTi).css({
                    'display':'block'
                });
                canvasDisplay = '2d';
            }
            break;
        
        default :
            reorganizeSpirale(true, true);
            dTi = 0;
            break;
    }
    
    for(var i=0;i<moduleAffichage.length;i++){
        if( i != dTi){
            var dataid = $(".subModAffichage").attr('data-id');
            $("#subModAffichage-"+i).animate({
                'opacity':0.5
            },400,'easeOutExpo');
        } else {
            $("#subModAffichage-"+dTi).animate({
                'opacity':1
            },400,'easeOutExpo');
        }
    }
};

loadModuleSecteur = function (module,id) {
    $('.rightColumn').append('<div class="module" id="module-'+id+'" name="'+module+'" ><span>'+module+'</span></div>');
    $('#getRightColumn').append('<div class="moduleGet" id="moduleGet-'+id+'" name="'+module+'" ><span class="getSpan">'+module+'</span></div>');
    //    $('#module-'+id).append('<div id="subModSecteur-x" data-tags="off" data-id="x" style="background:url(images/acti-x.png) no-repeat; background-position:0 4px;" class="subModSecteur"><span>Tous les secteurs</span></div><div class="secteurDash">&nbsp;</div>');
    //    $('#moduleGet-'+id).append('<div id="subModSecteurGet-x" data-tags="off" data-id="x" style="background:url(images/acti-x.png) no-repeat; background-position:0 4px;" class="subModSecteurGet"><span></span></div><div class="getDash">&nbsp;</div>');
    for(var i=0;i<projectTags.length;i++){
        $('#module-'+id).append('<div id="subModSecteur-'+i+'" data-tags="on" data-id="'+i+'" data-nom style="background:url(images/acti-'+i+'.png) no-repeat; background-position:0 4px;" class="subModSecteur"><span>'+projectTags[i]+'</span></div><div class="secteurDash">&nbsp;</div>');
        $('#moduleGet-'+id).append('<div id="subModSecteurGet-'+i+'" data-tags="on" data-id="'+i+'" data-nom style="background:url(images/acti-'+i+'.png) no-repeat; background-position:0 4px;" class="subModSecteurGet"><span></span></div><div class="getDash">&nbsp;</div>');
    }
    
    $(".subModSecteur").click(function() {
        var tagId = $(this).attr('data-id');
        clickSecteurs (tagId);
        var dataTags = $(this).attr('data-tags');
        if(dataTags == 'on'){
            $(this).attr('data-tags','off');
            $(this).animate({
                'opacity':0.25
            }, 300,'easeOutQuint');
            $('#subModSecteurGet-'+tagId).css({
                'opacity':'0.25'
            });
        } else {
            $(this).attr('data-tags','on');
            $(this).animate({
                'opacity':1
            }, 300,'easeOutQuint');
            $('#subModSecteurGet-'+tagId).css({
                'opacity':'1'
            });
        }
        parseTags(tagId);
        unclickSecteurs();
        return false;        
    });
    
    $(".subModSecteur").hover(
        function () {
            $(this).animate({
                'color':siteMainColor
            }, 50,'easeOutSine');
        }, 
        function () {
            $(this).animate({
                'color':'#ffffff'
            }, 80,'easeOutQuart');
        }
        );
};

clickSecteurs = function (tagId) {
    var l = $(".subModSecteur").length;
    var count = 0;
    for (var i=0; i<=l; i++){
        var sms = $("#subModSecteur-"+i);
        if(sms.attr('data-tags')=='on'){
            count++;
        }
    }
    if(count==l){ // true
        firstClickTags = true;

        if($('.subModSecteur').attr('data-id')!= tagId || tagId == 0){
            $('.subModSecteur').attr('data-tags','off');
            $('.subModSecteur').animate({
                'opacity':0.25
            }, 300,'easeOutQuint');
            $('.subModSecteurGet').css({
                'opacity':'0.25'
            });
        }
    } else { // false
        firstClickTags = false;
    }
}

unclickSecteurs = function (){
    
    var inactiveClicks = 0;
    for (var i=0; i<=$(".subModSecteur").length; i++){
        var sms = $("#subModSecteur-"+i);
        if(sms.attr('data-tags')=='off'){
            inactiveClicks ++;
        }
    }
    if(inactiveClicks == $(".subModSecteur").length){
        $(".subModSecteur").attr('data-tags','on');
        $(".subModSecteur").animate({
            'opacity':1
        }, 300,'easeOutQuint');
        $('.subModSecteurGet-').css({
                'opacity':'1'
            });
        for (i=0; i<=$(".subModSecteur").length; i++){
            parseTags(i);
        }
    }
}

loadModuleCategories = function (module,id) {
    $('.rightColumn').append('<div class="module" id="module-'+id+'" name="'+module+'" ><span>'+module+'</span></div>');
    $('#getRightColumn').append('<div class="moduleGet" id="moduleGet-'+id+'" name="'+module+'" ><span class="getSpan">'+module+'</span></div>');
    for(var i=0;i<projectCategories.length;i++){
        $('#module-'+id).append('<div id="subModCategory-'+i+'" data-cat="on" data-id="'+i+'" style="background:url(images/cat-'+i+'.png) no-repeat; background-position:0 4px;" class="subModCategory"><span>'+projectCategories[i]+'</span></div><div class="categoryDash">&nbsp;</div>');
        $('#moduleGet-'+id).append('<div id="subModCategoryGet-'+i+'" data-cat="on" data-id="'+i+'" style="background:url(images/cat-'+i+'.png) no-repeat; background-position:0 4px;" class="subModCategoryGet"><span></span></div><div class="getDash">&nbsp;</div>');
    }
    
    $(".subModCategory").click(function() {
        var catId = $(this).attr('data-id');
        var dataCat = $(this).attr('data-cat');
        if(dataCat == 'on'){
            $(this).attr('data-cat','off');
            $(this).animate({
                'opacity':0.25
            }, 300,'easeOutQuint');
            $('#subModCategoryGet-'+catId).css({
                'opacity':'0.25'
            });
        } else {
            $(this).attr('data-cat','on');
            $(this).animate({
                'opacity':1
            }, 300,'easeOutQuint');
            $('#subModCategoryGet-'+catId).css({
                'opacity':'1'
            });
        }
        parseCategories(catId);
        return false;        
    });
    
    $(".subModCategory").hover(
        function () {
            $(this).animate({
                'color': siteMainColor
            }, 50,'easeOutSine');
        }, 
        function () {
            $(this).animate({
                'color':'#ffffff'
            }, 80,'easeOutQuart');
        }
        );
};

loadModulePrestataires = function (module,id) {
    $('.rightColumn').append('<div class="module" id="module-'+id+'" name="'+module+'" ><span>'+module+'</span></div>');
    $('#getRightColumn').append('<div class="moduleGet" id="moduleGet-'+id+'" name="'+module+'" ><span class="getSpan">'+module+'</span></div>');
    for(var i=0;i<projectPrestataires.length;i++){
        $('#module-'+id).append('<div id="subModPresta-'+i+'" data-presta="on" data-id="'+i+'" style="background:url(images/presta-'+i+'.png) no-repeat; background-position:0 4px;" class="subModPresta"><span>'+projectPrestataires[i]+'</span></div><div class="prestaDash">&nbsp;</div>');
        $('#moduleGet-'+id).append('<div id="subModPrestaGet-'+i+'" data-presta="on" data-id="'+i+'" style="background:url(images/presta-'+i+'.png) no-repeat; background-position:0 4px;" class="subModPrestaGet"><span></span></div><div class="getDash">&nbsp;</div>');
    }
    
    $(".subModPresta").click(function() {
        var prestaId = $(this).attr('data-id');
        var dataPresta = $(this).attr('data-presta');
        if(dataPresta == 'on'){
            $(this).attr('data-presta','off');
            $(this).animate({
                'opacity':0.25
            }, 300,'easeOutQuint');
            $('#subModPrestaGet-'+prestaId).css({
                'opacity':'0.25'
            });
        } else {
            $(this).attr('data-presta','on');
            $(this).animate({
                'opacity':1
            }, 300,'easeOutQuint');
            $('#subModPrestaGet-'+prestaId).css({
                'opacity':'1'
            });
        }
        parsePrestataires(prestaId);
        return false;        
    });
    
    $(".subModPresta").hover(
        function () {
            $(this).animate({
                'color': siteMainColor
            }, 50,'easeOutSine');
        }, 
        function () {
            $(this).animate({
                'color':'#ffffff'
            }, 80,'easeOutQuart');
        }
        );
};

loadModuleClassement = function (module,id) {
    $('.rightColumn').append('<div class="module" id="module-'+id+'" name="'+module+'" ><span>'+module+'</span></div>');
    $('#getRightColumn').append('<div class="moduleGet" id="moduleGet-'+id+'" name="'+module+'" ><span class="getSpan">'+module+'</span></div>');
    for(var i=0;i<projectClassement.length;i++){
        $('#module-'+id).append('<div id="subModClassement-'+i+'" data-classement="off" data-id="'+i+'" style="background:url(images/classement-'+i+'.png) no-repeat; background-position:0 4px;" class="subModClassement"><span>'+projectClassement[i]+'</span></div><div class="prestaDash">&nbsp;</div>');
        $('#moduleGet-'+id).append('<div id="subModClassementGet-'+i+'" data-classement="off" data-id="'+i+'" style="background:url(images/classement-'+i+'.png) no-repeat; background-position:0 4px;" class="subModClassementGet"><span></span></div><div class="getDash">&nbsp;</div>');
    }
    
    $(".subModClassement").css({
        'opacity':'0.25'
    });
    $('#subModClassement-0').css({
        'opacity':'1'
    });
    
    $(".subModClassementGet").css({
        'opacity':'0.25'
    });
    $('#subModClassementGet-0').css({
        'opacity':'1'
    });
    
    $(".subModClassement").click(function() {
        var classementId    = $(this).attr('data-id');
        for(var i=0;i<projectClassement.length;i++){
            if(classementId != i){
                $('#subModClassement-'+i).attr('data-classement','off');
                $('#subModClassement-'+i).animate({
                    'opacity':0.25
                }, 300,'easeOutQuint');
                $('#subModClassementGet-'+i).css({
                    'opacity':0.25
                });
            } else {
                $(this).attr('data-classement','on');
                $(this).animate({
                    'opacity':1
                }, 300,'easeOutQuint');
                $('#subModClassementGet-'+classementId).css({
                    'opacity':1
                });
            }
        }
        parseClassement(classementId);
        return false;
    });
    
    $(".subModClassement").hover(
        function () {
            $(this).animate({
                'color': siteMainColor
            }, 50,'easeOutSine');
        }, 
        function () {
            $(this).animate({
                'color':'#ffffff'
            }, 80,'easeOutQuart');
        }
        );
};

ajaxLoadPage = null;

/* Load Html ---------------------------------*/
loadHtml = function (pageId, bg, closeable) {
    var cntLeft = parseInt($('#leftColumn').width()) + parseInt($('#leftColumn').css('padding-left'));
    
    $('body').append('<div class="htmlText" id="htmlText-'+pageId+'"><div class="content"></div></div>');
    var htmlText = $('.htmlText');
    var contentDiv = $('.content');
    
    contentDiv.css({
        'position'          :'absolute',
        'height'            :'100%'
    });
    
    htmlText.css({
        'position'          :'absolute',
        'z-index'           :'10',
        'width'             :'0px',
        'height'            :'100%',
        'background-color'  : bg,
        'left'              : 0,
        'color'             :'white',
        'font-family'       :'GothamLight',
        'font-size'         :'16px',
        'text-transform'    :'uppercase',
        'overflow'          :'hidden',
        'opacity'           :'1'
    });
    
    if(ajaxLoadPage != null){
        ajaxLoadPage.abort();
    }
    
    
    ajaxLoadPage = $.ajax({
        url : 'html/'+page.id+'.php',
        type : "get",
        dataType : "html",
        success : function(sHTML){
            
            $('#htmlText-'+pageId+' .content').empty().append(sHTML);
            htmlText.animate({
                'width' : '100%'
            },800,'easeOutSine',function (){
                    
                });
            
            setTimeout(function () {
                releaseMenu(true)
            }, 500);
            switch(page.id)
            {
                case '0':
                    loadHomepage(pageId, cntLeft);
                    break;
                case '1':
                    initCanvas();
                    break;
                case '2':
                    loadForm(pageId, cntLeft);
                    break;                    
                case '3':
                    loadJury (page.id, cntLeft);
                    break;
                case '4':
                    loadCriteres (page.id, cntLeft);
                    break;
                case '5':
                    loadReglement (page.id, cntLeft);
                    break;
                case '6':
                    loadDemarche (page.id, cntLeft);
                    break;
            }
            ajaxLoadPage = null;
            $('.content h1').css({
                'font-size'  : 30/fontRatio+'px',
                'height'     : 36/fontRatio+'px'
            });
    
            $('.content h2').css({
                'font-size'  : 30/fontRatio+'px',
                'height'     : 36/fontRatio+'px'
            });
    
        }
        
        
    });
    
    if(closeable){
        addClose('#htmlText-'+pageId, 65, 80, htmlW40prc + cntLeft + 20, unloadHtml);
    }
}

loadForm = function (pageId, cntLeft) {
    var htmlText = $('#htmlText-'+pageId);
    $('#htmlText-'+pageId+' .content').css({
        'opacity':'0'
    });
    
    htmlText.append('<div id="formulaire"><form></form></div>');
    var htmlForm = $('form');
    
    var content = $('#htmlText-'+pageId+' .content').html();
    $('#htmlText-'+pageId+' .content').addClass('contentTmp');
    $('#formulaire').append('<div class="content">'+content+'</div>');
    $('.contentTmp').remove();
    
    
    htmlForm.append('<div id="formL">LE COMMERÇANT</div>');
    htmlForm.append('<div id="formR">L\'AGENCE</div>');
    htmlForm.append('<div id="formL2">LE PROJET</div>');
    htmlForm.append('<div id="formR2">&nbsp;</div>');
    
    var fL = $('#formL');
    var fR = $('#formR');
    var fL2 = $('#formL2');
    var fR2 = $('#formR2');
    
    
    $('#formulaire').css({
        'position'          :'absolute',
        'height'            :'100%',
        'width'             : htmlW40prc,
        'left'              :$('#leftColumn').width()+marginL*4+'px',
        'padding-bottom'    : marginT,
        'padding-right'     : marginL*2,
        'color'             :'white',
        'font-family'       :'GothamLight',
        'font-size'         :'16px',
        'text-transform'    :'uppercase',
        'overflow'          :'hidden',
        'opacity'           :'1',
//        'top'               :'10%'
        'top'           :130/fontRatio+'px'
    });
    

    var pTop = $('#formulaire p').offset().top + 50;
    

    for(var i=0; i<formProject.length; i++){
        
        var fieldName       = formProject[i][0];
        var fieldColumnId   = formProject[i][1];
        var fieldTypeId     = formProject[i][2];
        var fieldValues     = formProject[i][3];
        var fieldNameValue  = formProject[i][4];
        var targetForm      = null;
        var fieldType       = null;

        switch(fieldColumnId)
        {
            // Accueil
            case '0':
                targetForm = 'formL';
                break;
                
            // Participants
            case '1':
                targetForm = 'formR';
                break;
                
            // Candidater
            case '2':
                targetForm = 'formL2';
                break;
            
            case '3':
                targetForm = 'formR2';
                break;
        }
        
        switch(fieldTypeId)
        {
            case '0':
                fieldType = '<div class="input"><input type="text" name="'+fieldNameValue+'" id="'+fieldNameValue+'" class="required"></input></div>';
                break;

            case '1':
                fieldType = '<div class="inputRoll" id="inputRoll-'+i+'" data-id="'+i+'"></div>';
                break;

            case '2':
                fieldType = '<div class="inputFile" id="inputFileUpload"></div><input type="hidden" name="'+fieldNameValue+'" id="'+fieldNameValue+'"></input>';
                break;
            case '3':
                fieldType = '<div class="inputCheck"><input class="checkbox" type="hidden" name="'+fieldNameValue+'" id="'+fieldNameValue+'"></input></div>';
                break;
        }
        
        if(fieldTypeId == 1){
            $('#'+targetForm).append('<div id="field-'+i+'">'+fieldName+fieldType+'</div>');
            addListRoll ('#inputRoll-'+i, fieldName, fieldValues, 22, htmlW40prc/2-(marginL), 35, 0, '#3c4148',siteGreyColor, siteMainDarkColor , siteMainColor,'#171e26', 250+i)
        } else {
            $('#'+targetForm).append('<div id="field-'+i+'">'+fieldName+fieldType+'</div>'); 
        }

        if(i<4){
            $("#field-"+i).css({
                'font-size'     :'9px',
                'font-family'   :'GothamMedium',
                'padding'       :'20px 0 5px 0 ',
                'position'      :'absolute',
                'top'           : (marginT/5*3)+(i*60)+'px',
                'color'         :siteGreyColor,
                'width'         :'0px',
                'overflow'      :'hidden',
                'height'        :marginT*2+'px'
            });
        } else if( i >= 4 && i < 10) {
            $("#field-"+i).css({
                'font-size'     :'9px',
                'font-family'   :'GothamMedium',
                'padding'       :'20px 0 5px 0 ',
                'position'      :'absolute',
                'top'           : (marginT/5*3)+(i-4)*60+'px',
                'color'         :siteGreyColor,
                'width'         :'0px',
                'overflow'      :'hidden',
                'height'        :marginT*2+'px'
            });
        } else if( i >= 10 && i < 14){
            $("#field-"+i).css({
                'font-size'     :'9px',
                'font-family'   :'GothamMedium',
                'padding'       :'20px 0 5px 0 ',
                'position'      :'absolute',
                'top'           : (marginT/5*3)+(i-10)*60+'px',
                'color'         :siteGreyColor,
                'width'         :'0px',
                'overflow'      :'hidden',
                'height'        :marginT*2+'px'
            });
        } else if( i >= 14 && i < 17){
            $("#field-"+i).css({
                'font-size'     :'9px',
                'font-family'   :'GothamMedium',
                'padding'       :'20px 0 5px 0 ',
                'position'      :'absolute',
                'top'           : (marginT/5*3)+(i-14)*60+'px',
                'color'         :siteGreyColor,
                'width'         :'0px',
                'overflow'      :'hidden',
                'height'        :marginT*2+'px'
            });
        } else {
            $("#field-"+i).css({
                'font-size'     :'9px',
                'font-family'   :'GothamMedium',
                'padding'       :'30px 0 5px 0 ',
                'position'      :'absolute',
                'top'           : (marginT/5*3)+(i-14)*60+'px',
                'color'         :siteGreyColor,
                'width'         :'0px',
                'overflow'      :'hidden',
                'height'        :marginT*2+'px'
            });
        }
    }

    
    $('.input').css({
        'width'     :(htmlW40prc/2-(marginL)),
        'height'    :'22px',
        'background':siteMainDarkColor,
        'border'    :'1px solid #3c4148',
        'margin-top':marginT/5+'px'
    });
    
    $('.inputFile').css({
        'width'     :(htmlW40prc/2-(marginL)),
        'height'    :'22px',
        'background':'none',
        'border'    :'1px solid #3c4148',
        'margin-top': marginT/5+'px'
    });
    
    $('.checkbox').css({
        'opacity'   :'0'
    });
    
    $('span.checkboxText').css({
        'float'   :'left',
        'display' :'block',
        'margin'  :'6px 0 0 32px'
    });
    
    $('.inputCheck').css({
        'width'             :'20px',
        'height'            :'22px',
        'cursor'            :'pointer',
        'border'            :'1px solid #3c4148',
        'margin-top'        : marginT/5+'px',
        'background-color'  : siteMainDarkColor
    });
    
  
    
    $('.inputCheck').click(function(){
        $(this).toggleClass('active');
    })
    
    $('input').css({
        'width'     :(htmlW40prc/2-(marginL))-8,
        'height'    :'22px',
        'background':'none',
        'border'    :'none',
        'font-size' :'10px',
        'color'     :siteGreyColor,
        'padding'   :'0 4px 0 4px',
        'outline'   :'none'
    });
    
    $('#formulaire #formInfos p').css({
        'width'  :htmlW40prc-(marginL)
    });
    
    
    $('input').focus(function () {
        if($(this).offset().top>scrollH){
            cntScrollBar.animate({
                'top': cntScrollBarStart + minScrollBar
            },0,'easeOutQuint');
    
            cntScroll.animate({
                'top': cntScrollStart - minScroll
       
            },0,'easeOutExpo');
        } else if ($(this).offset().top<0){
            cntScrollBar.animate({
                'top': cntScrollBarStart
            },400,'easeOutQuint');
            
            cntScroll.animate({
                'top': cntScrollStart
                
            },500,'easeOutExpo');
        }
    });
    
    fL.css({
        'width'     :htmlW40prc/2 - marginL,
        'position'  :'absolute',
        'left'      :'0px',
        'top'       :pTop
    });
    
    fR.css({
        'width'     :htmlW40prc/2 - marginL,
        'position'  :'absolute',
        'left'      :htmlW40prc/2+'px',
        'clear'     :'both',
        'top'       :pTop
    });
    
    fL2.css({
        'width'     :htmlW40prc/2 - marginL,
        'position'  :'absolute',
        'left'      :'0px',
        'top'       :pTop+(7*60)+'px'
    });
    
    fR2.css({
        'width'     :htmlW40prc/2 - marginL,
        'position'  :'absolute',
        'left'      :htmlW40prc/2+'px',
        'top'       :pTop+(7*60)+'px'
    });
   
    createUploader();
    $('#field-13').append('<div id="captureInfos">3 à 5 captures - format .jpeg - résolution 800 × 600px</div>')
    
    var actionsW    = (htmlW40prc/4);
    var envoyerL    = fR2.position().left + $('.input').width() - actionsW;
    var actionsT    = fR2.position().top + 400;
    addLink('#formulaire', 'Envoyer', sendFormulaire, '40', actionsW, actionsT, envoyerL, siteMainColor, '#ffffff', 25, 7,  '120', '1', false, false);
    
    for(var r = 0; r<formProject.length; r++){
        $("#field-"+r).delay(r*60).animate({
            'width':(htmlW40prc/2-(marginL))-8
        },180,'easeOutQuart', function (){
            $(this).css({
                'overflow'  :'visible',
                'height'    :'auto'
            });
        });
    }

    checkElemHeight('form', $('#htmlText-'+pageId), $('#formulaire'), $('#embedLinkHoverBLeft-Envoyer'), null, 100, 250);
    
};


function createUploader(){            
    var uploader = new qq.FileUploader({
        element: document.getElementById('inputFileUpload'),
        action: 'upload.php',
        debug: true
    });
}


checkElemHeight = function (name, elem, elemAnim, dummy, func, offset, z) {
    elem = elem;
    var elemT           = elem.offset().top;
    var agendaH         = ieWH - Math.round($('#timelineAgenda').offset().top);
    var windowH         = parseInt(ieWH,10);
    var dummyPt         = parseInt(dummy.css('padding-top').split('px'),10);
    var dummyFullH      = dummy.offset().top + dummy.height() + offset;
    var elemeAnimTop    = elemAnim.offset().top
    
    var parentElem  = elem.parent();
    parentElem.append('<div id="scroll-'+name+'" class="scrollBarHtml"></div>');
    scrollElem = $('#scroll-'+name);
    scrollElem.append('<div id="scrollbar-'+name+'"></div>')
    scrollBar = $('#scrollbar-'+name);
    
    var attachScrollbar = function () {
        
        // Bg scroll
        var scrollPosT  = elemT;
        var scrollW     = marginL / 2.5;
        scrollH         = windowH - agendaH ;
        
        // scrollBar
        var scrollbarH     = (scrollH / dummyFullH ) * scrollH;
        var ratioScroll = dummyFullH / scrollH ;

        
        scrollElem.css({
            'position'      :'absolute',
            'top'           : scrollPosT,
            'left'          : '100%',
            'margin-left'   :-scrollW,
            'width'         : scrollW,
            'height'        : scrollH,
            'z-index'       : z,
            'display'       :'none'
        
        });
        
        scrollBar.css({
            'position'  :'absolute',
            'top'       : 0,
            'left'      : 0,
            'width'     : 0,
            'background': siteMainColor,
            'height'    : scrollbarH,
            'cursor'    :'pointer',
            'z-index'   :'1100',
            'opacity'   :'0.2',
            'display'   :'none'
        });
        
        scrollBar.animate({
            'width':scrollW
        },300,'easeOutQuint');
        
        scrollBar.hover(function (){
            $(this).animate({
                'opacity':'1'
            },100,'easeOutSine')
            $(this).css({
                'background-image':'url(images/pattern-scrollBars.png)'
            });
            if(func != null){
                func.call();
            }
        }
        );
        
        scrollBar.mouseup(function (){
            $(this).animate({
                'opacity':'0.2'
            },120,'easeOutSine')
            $(this).css({
                'background-image':'none'
            });
        });
        
        scrollBar.draggable({
            containment: 'parent',
            axis: "y",
            drag : function(ui,event){
                var barTop = scrollBar.offset().top;

                scrollingBar = true;
                elemAnim.css({
                    'top':elemeAnimTop  + barTop * -ratioScroll
                });
            }
        });
        
        minScroll           = (scrollElem.height() - scrollBar.height())* ratioScroll;
        maxScroll           = 0;
        cntScroll           = elemAnim;
        cntScrollStart      = elemAnim.offset().top;
        
        minScrollBar        = (scrollElem.height() - scrollBar.height());
        maxScrollBar        = 0;
        cntScrollBar        = scrollBar;
        cntScrollBarStart   = scrollBar.offset().top;
    };
    
    
    
    if (dummyFullH > (windowH - agendaH) ) {
        scrollHtml = true;
        elem.css({
            'height':dummyFullH
        });
        elemAnim.css({
            'height':dummyFullH+ dummyPt
        });        
        attachScrollbar();
        var elemToWheel = elem.attr('id');
        scrollElem.css({
            'display'   :'block'
        });
        scrollBar.css({
            'display'    :'block'
        });
        attachScrollWindow (elemToWheel);
    } else {
        //scrollHtml = false;
        elemToWheel = elem.attr('id')
        scrollElem.css({
            'display'   :'none'
        });
        scrollBar.css({
            'display'    :'none'
        });
        detachScrollWindow (elemToWheel);
    }
}


adjustElemHeight = function (name, elem, elemAnim, dummy, func, offset, z) {
    elem = elem;
    var elemT       = elem.offset().top;
    var agendaH         = ieWH - Math.round($('#timelineAgenda').offset().top); 
    var windowH     = parseInt(ieWH,10);
    var dummyPt     = parseInt(dummy.css('padding-top').split('px'),10);
    var dummyFullH = dummy.offset().top + dummy.height() + offset;
    var elemeAnimTop = elemAnim.offset().top
    
    var parentElem  = elem.parent();
    scrollElem = $('#scroll-'+name);
    scrollBar = $('#scrollbar-'+name);
    
    var attachScrollbar = function () {
        
        // Bg scroll
        var scrollPosT  = elemT;
        var scrollW     = marginL / 2.5;
        scrollH         = windowH - agendaH ;
        
        // scrollBar
        var scrollbarH     = (scrollH / dummyFullH ) * scrollH;
        var ratioScroll = dummyFullH / scrollH ;

        
        scrollElem.css({
            'position'      :'absolute',
            'top'           : scrollPosT,
            'left'          : '100%',
            'margin-left'   :-scrollW,
            'width'         : scrollW,
            'height'        : scrollH,
            'z-index'       : z,
            'display'       :'none'
        
        });
        
        scrollBar.css({
            'position'  :'absolute',
            'top'       : 0,
            'left'      : 0,
            'width'     : 0,
            'background': siteMainColor,
            'height'    : scrollbarH,
            'cursor'    :'pointer',
            'z-index'   :'1100',
            'opacity'   :'0.2',
            'display'   :'none'
        });
        
        scrollBar.animate({
            'width':scrollW
        },300,'easeOutQuint');
        
        scrollBar.hover(function (){
            $(this).animate({
                'opacity':'1'
            },100,'easeOutSine')
            $(this).css({
                'background-image':'url(images/pattern-scrollBars.png)'
            });
            if(func != null){
                func.call();
            }
        }
        );
        
        scrollBar.mouseup(function (){
            $(this).animate({
                'opacity':'0.2'
            },120,'easeOutSine')
            $(this).css({
                'background-image':'none'
            });
        });
        
        scrollBar.draggable({
            containment: 'parent',
            axis: "y",
            drag : function(ui,event){
                var barTop = scrollBar.offset().top;

                scrollingBar = true;
                elemAnim.css({
                    'top':elemeAnimTop  + barTop * -ratioScroll
                });
            }
        });
        
        minScroll           = (scrollElem.height() - scrollBar.height())* ratioScroll;
        maxScroll           = 0;
        cntScroll           = elemAnim;
        cntScrollStart      = elemAnim.offset().top;
        
        minScrollBar        = (scrollElem.height() - scrollBar.height());
        maxScrollBar        = 0;
        cntScrollBar        = scrollBar;
        cntScrollBarStart   = scrollBar.offset().top;
    };

    
    
    if (dummyFullH > (windowH - agendaH) ) {
        scrollHtml = true;
        elem.css({
            'height':dummyFullH
        });
        elemAnim.css({
            'height':dummyFullH+ dummyPt
        });        
        attachScrollbar();
        var elemToWheel = elem.attr('id');
        scrollElem.css({
            'display'   :'block'
        });
        scrollBar.css({
            'display'    :'block'
        });
        attachScrollWindow (elemToWheel);
    } else {
        scrollHtml = false;
        elemToWheel = elem.attr('id');
        detachScrollWindow (elemToWheel);
        scrollElem.css({
            'display'   :'none'
        });
        scrollBar.css({
            'display'    :'none'
        });
        
    }
}

/* Scrolls ----------------------------------------------------------------------*/
function attachScrollWindow (elemToWheel) {
    hookEvent(elemToWheel, 'mousewheel', onWindowMouseScroll);
}

function detachScrollWindow (elemToWheel) {
    unhookEvent(elemToWheel, 'mousewheel', onWindowMouseScroll);
}

function onWindowMouseScroll (e) {	
    scrolling = true;
    e = e ? e : window.event;
    var raw = e.detail ? e.detail : e.wheelDelta;
    if($.browser.mozilla){
        raw = -raw*1.5;
    }
    var normal = e.detail ? e.detail * -1 : e.wheelDelta / 40;
    cancelEvent(e);
    scrollWheelWindow(raw);
}

function scrollWheelWindow (raw) {
    raw = parseInt(raw);
    
    
    cntScrollBar.css({
        'top': cntScrollBar.offset().top - raw
    });
    if( cntScrollBar.offset().top <= cntScrollBarStart) {
        cntScrollBar.css({
            'top': cntScrollBarStart
        });
    }
    if( cntScrollBar.offset().top >= cntScrollBarStart + minScrollBar ) {
        cntScrollBar.css({
            'top': cntScrollBarStart + minScrollBar
        });
    }
    
    cntScroll.css({
        'top': cntScroll.offset().top + raw
    });
    if( cntScroll.offset().top <= cntScrollStart - minScroll){
        cntScroll.css({
            'top': cntScrollStart - minScroll
        });
    }
    if( cntScroll.offset().top >=cntScrollStart) {
        cntScroll.css({
            'top': cntScrollStart
        });
    }
    setTimeout("attachScrollWindow()", 50);
}

/*Scrolls ----------------------------------------------------------------------*/
unloadForm = function () {
    $(".htmlText").animate({
        'width':0,
        'padding':0
    },1200,'easeOutQuint', function (){
        $(this).remove();
    });
    var actionsW = ((htmlW40prc/2-(marginL*2))/2)-5;
    removeLink ('#formulaire', 'Envoyer', actionsW, '40');
    removeLink ('#formulaire', 'OK', '24', '40');
      
    
    $('#formL').delay(600).animate({
        'opacity':0
    },200,'easeOutSine');
    $('#formR').delay(750).animate({
        'opacity':0
    },200,'easeOutSine');
    $('#formL2').delay(900).animate({
        'opacity':0
    },200,'easeOutSine');
    $('#formR2').delay(1050).animate({
        'opacity':0
    },200,'easeOutSine');
};
        
ajax = false;
sendFormulaire = function () {
    checkFieldsRemoveAlert();
    retoure = checkFields() * checkLists() * checkMailDate() * checkMinUpload() * checkReglement();
    if(retoure == 1){
        $('form').submit(function(e){
            var mailtoDisplay = null;
            e.preventDefault();
            var formCallUrl = 'preinscription.php';

            var values = $(this).serializeJSON();
            
            values.participant_activite_point_vente         = $('#embedListRoll-Activitésdupointdevente').attr('data-id');
            values.participant_organisation_point_vente     = $('#embedListRoll-Organisationdupointdevente').attr('data-id');
            values.participant_type_site                    = $('#embedListRoll-Typedesite').attr('data-id');
            values.participant_type_agence                  = $('#embedListRoll-Typedeprestataire').attr('data-id');
            values.participant_interlocuteur_privilegie     = $('#embedListRoll-InterlocuteurPrivilégié').attr('data-id');
            
            var t = $('#embedListRoll-InterlocuteurPrivilégié').attr('data-id');
            if(t == 1){
                mailtoDisplay = $('#participant_mail').val();
            } else if(t==0) {
                mailtoDisplay = $('#participant_mail_agence').val();
            }
            if(ajax == false){
                ajax = true;
                $.ajax({
                    type    : 'POST',
                    url     : formCallUrl,
                    data    : values,
                    success : function(){
                        ajax = false;
                        successForm (mailtoDisplay);
                    }
                });
            }
        });
        $('form').trigger('submit');
    }
};


checkReglement = function (){
    if($('.inputCheck').hasClass('active')){
        return true;
    } else {
        $('.inputCheck').addClass('undefined');
        $('.undefined').css({
            'border' : '1px solid #b51924'
        });
        return false;
    }
}

checkMinUpload = function () {
    v = document.getElementById('participant_images').value;
    if(v == "") {
        $('#field-13').css("color", siteAlertColor);
        return false;
    } else {
        vs = v.split(';');
        if(vs.length < 3) {
            $('#field-13').css("color", siteAlertColor);  
            return false;
        } else {
            return true;
        }
    }
};

checkFieldsRemoveAlert = function () {
    $('.required').each(function() {
      
        $('.emptyField').css({
            'color'          :siteGreyColor
        });  
        $('.emptyField').parent().css({
            'border-color'   :'#333333'
        });
        $(this).removeClass('emptyField');
      
    });
    
    $('.requiredList').each(function() {
      
        $('.emptyList').css({
            'color'          :siteGreyColor,
            'border-color'   :'#333333'
        });  
        $(this).removeClass('emptyList');
    });
    
    $('#field-13').css("color", siteGreyColor);
};


checkFields = function () {
    var counterFields = 0;
    $('.required').each(function() {
        if($(this).val() != '') {
            counterFields ++;
        } else {
            $(this).addClass('emptyField');
            $('.emptyField').css({
                'color'          :siteAlertColor
            });
            $('.emptyField').parent().css({
                'border-color'   :siteAlertColor
            });               
        }
    });
    return ($('.required').length == counterFields);
};

checkLists = function () {
    var counterLists = 0;
    $('.requiredList').each(function() {
        if($(this).text() != 'SELECTIONNER') {
            counterLists ++;
        } else {
            $(this).addClass('emptyList');
            $('.emptyList').css({
                'color'          :siteAlertColor,
                'border-color'   :siteAlertColor
            });
        }
    });
    return ($('.requiredList').length == counterLists);
};

checkMailDate = function() {
    ladate = $('#participant_mise_en_ligne').val();
    lemail1 = $('#participant_mail').val();
    lemail2 = $('#participant_mail_agence').val();
    
    erreur = false;
    var emailRegEx = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i;
    if(emailRegEx.test(lemail1) == false) {
        $('#participant_mail').addClass('emptyField');    
        $('.emptyField').parent().css({
            'color'          :siteAlertColor,
            'border-color'   :siteAlertColor
        });
        erreur = true;    
    }      
    if(emailRegEx.test(lemail2) == false) {
        $('#participant_mail_agence').addClass('emptyField'); 
        $('.emptyField').parent().css({
            'color'          :siteAlertColor,
            'border-color'   :siteAlertColor
        });
        erreur = true;
    }
    
    var dateRegEx = /^(\d{1,2})[./-](\d{1,2})[./-](\d{4})$/
    if(dateRegEx.test(ladate) == false) {
        $('#participant_mise_en_ligne').addClass('emptyField'); 
        $('.emptyField').parent().css({
            'color'          :siteAlertColor,
            'border-color'   :siteAlertColor
        });
        erreur = true;
    }
 
    if(erreur) {
        return false;
    } else {
        return true;
    }
};

successForm = function (mailtoDisplay) {
    for(var i = 0; i<formProject.length; i++){
        $("#field-"+i).delay(i*50).animate({
            'width':0
        },150,'easeOutExpo', function (){
            $(this).remove();
        });
    }
    
    
    var actionsW = ((htmlW40prc/2-(marginL*2))/2)-5;
    removeLink ('#formulaire', 'Envoyer', actionsW, '40');
    removeLink ('#formulaire', 'OK', '24', '40');
    removeLink ('#formulaire', 'Ajouter_des_images', '24', '40');
      
    
    $('#formL').delay(600).animate({
        'opacity':0
    },200,'easeOutSine');
    $('#formR').delay(750).animate({
        'opacity':0
    },200,'easeOutSine');
    $('#formL2').delay(900).animate({
        'opacity':0
    },200,'easeOutSine');
    $('#formR2').delay(1050).animate({
        'opacity':0
    },200,'easeOutSine');
    
    $('#htmlText-'+page.id+' .content p').css({
        'position':'absolute',
        'display':'block'
    })
    $('#htmlText-'+page.id+' .content #formInfos').delay(1000).animate({
        'width':'0'
    },800,'easeOutQuint', function (){
        $('#htmlText-'+page.id+' .content p').remove();
        $('#htmlText-'+page.id+' .content').append('<div id="validation"><div><h3>Validation de votre pré-inscription</h3><span id="lastDiv">Votre formulaire a bien été envoyé.<br /> Vous recevrez une confirmation par mail à l\'adresse suivante :<br /><a href="mailto:'+mailtoDisplay+'">'+mailtoDisplay+'</a></span><div><div>');
        $('#htmlText-'+page.id+' .content').append('<div id="newForm"><h4><a href="#">Déposez une nouvelle candidature</a></h4></div>');
        
        $('#validation').css({
            'position':'absolute',
            'width':'0px',
            'top':'120px',
            'overflow':'hidden',
            'height':'150px'
        });
        $('#validation div').css({
            'position':'absolute',
            'width':'600px',
            'top':'0px'
        });
        $('#validation').delay(200).animate({
            'width':'600px'
        },600,'easeOutSine');
        
        $('#newForm').css({
            'position':'absolute',
            'top':'240px',
            'width':'0px',
            'overflow':'hidden'
        });
        $('#newForm h4').css({
            'display':'block',
            'width':'600px'
        });
        $('#newForm').delay(400).animate({
            'width':'600px'
        },400,'easeOutQuint');
        
        
        
        $('#newForm h4').click(function (e) {
            unloadForm ();
            setTimeout('reloadForm()', 1000);
            e.preventDefault();
        });
        checkElemHeight('form', $('#htmlText-'+page.id), $('#formulaire'), $('#lastDiv'), null, 0, 250);
    });
        
    
    
    
    
    $('#formulaire').animate({
        'top':'10%'
    });
    $('#scrollbar-form').animate({
        'top':0
    });


    
    $('#htmlText-'+page.id+' .content').css({
        'opacity':'1'
    });
}

reloadForm = function () {
    var menuId      = '2';
    page.init(menuId, mainMenu[menuId], '2d', true, mainMenu[menuId], mainMenu[menuId]);
}

loadHomepage = function (pageId){
    initDiaporama(pageId);
    setTimeout(function () {
        addDiaporama('0')
    }, 250);
    initHomeText(pageId);
}

unloadHomepage = function (){
    $(".htmlText").animate({
        'width':0
    },1200,'easeOutQuint', function (){
        $(this).remove();
    });
}

unloadCanvas = function (){
    $('canvas').css({
        'display':'none'
    });
    $(".htmlText").animate({
        'width':0
    },1200,'easeOutQuint', function (){
        resetCanvas ();
        $(this).remove();
    });
}

initAgendaNews  = function () {
    $('body').append('<div id="timelineAgenda"></div>');
    var timeline = $('#timelineAgenda');
    var timelineW   = ieWW;
    var timelineH   = marginT * 4;
    var indexZ      = 600;
    var topStart    = $('#footer').height();
    timeline.css({
        'width'         : '100%',
        'height'        : timelineH+'px',
        'background'    :'#05090d',
        'position'      :'absolute',
        'z-index'       : indexZ,
        'top'           :'100%',
        'margin-top'    : -(timelineH + topStart)//'-200px'
    });
    
    timeline.append('<div id="timelineStroke"></div>');
    var timelineStroke = $('#timelineStroke');
    
    timelineStroke.css ({
        'width'         :timelineW,
        'height'        :'1px',
        'background'    :'#242a31',
        'position'      :'absolute',
        'top'           :(timelineH/4)*3+'px'
    });
    
    var tStart      = new Date(2011, 11, 1);
    var tEnd        = new Date(2012, 6, 30);
    var tStartTime  = tStart.getTime();
    var tEndTime    = tEnd.getTime();

    var totalDays = tEndTime - tStartTime;
    totalDays = Math.round(totalDays/86400000);
    
    var dayWidth = Math.round(timelineW / totalDays);
    
    for(var i = 0; i < agenda.count; i++){
        
        var romanI      = romanNumbers[i];
        var romanLastI  = romanNumbers[agenda.count - 1];
        
        var title                   = agenda[i].title;
        
        var dateStart               = agenda[i].dateStart;
        var dateStartArray          = agenda[i].dateStart.split(', ');
        var dateStartYear           = dateStartArray[0];
        var dateStartMonth          = dateStartArray[1];
        var dateStartMonthToText    = allDatesMonths[parseInt(dateStartMonth-1)];
        var dateStartDay            = dateStartArray[2];
        
        var dateEnd                 = agenda[i].dateEnd;
        var dateEndArray            = agenda[i].dateEnd.split(', ');
        var dateEndYear             = dateEndArray[0];
        var dateEndMonth            = dateEndArray[1];
        var dateEndMonthToText      = allDatesMonths[parseInt(dateEndMonth-1)];
        var dateEndDay              = dateEndArray[2];
        
        var aStartDate              = agenda[i].dateStart.split(',');
        var dStart                  = new Date(aStartDate[0],aStartDate[1],aStartDate[2]);
        var aEndDate                = agenda[i].dateEnd.split(',');
        var dEnd                    = new Date(aEndDate[0],aEndDate[1],aEndDate[2]);
        var dStartTime              = dStart.getTime();
        var dEndTime                = dEnd.getTime();
        
        var duration                = dEndTime - dStartTime;
        duration                    = Math.round(duration/86400000);
        
        var durationW = Math.floor(duration * dayWidth);
        var durationL = ((dStartTime - tStartTime) / 86400000) * dayWidth ;
        
        if (dateStart == dateEnd) {
        	timeline.append('<div id="durationPhase-'+i+'"><div id="durationPhaseBg-'+i+'" class="dPhaseBg"></div><div id="phaseId-'+i+'">PHASE '+(i+1)+' / '+ (agenda.count) + '</div><div id="phaseDate-'+i+'"><div id="phaseMonthYear-'+i+'">'+dateStartDay+' '+dateStartMonthToText.substring(0,3).toUpperCase()+' '+dateStartYear+'</div><div id="phaseTitle-'+i+'">'+title+'</div></div><div id="durationBg-'+i+'"></div></div>');
        }
        else {
        	timeline.append('<div id="durationPhase-'+i+'"><div id="durationPhaseBg-'+i+'" class="dPhaseBg"></div><div id="phaseId-'+i+'">PHASE '+(i+1)+' / '+ (agenda.count) + '</div><div id="phaseDate-'+i+'"><div id="phaseMonthYear-'+i+'">'+dateStartDay+' '+dateStartMonthToText.substring(0,3).toUpperCase()+' '+dateStartYear+' AU '+dateEndDay+' '+dateEndMonthToText.substring(0,3).toUpperCase()+' '+dateEndYear+'</div><div id="phaseTitle-'+i+'">'+title+'</div></div><div id="durationBg-'+i+'"></div></div>');
        }
        //		  timeline.append('<div id="durationPhase-'+i+'"><div id="durationPhaseBg-'+i+'" class="dPhaseBg"></div><div id="phaseId-'+i+'">PHASE '+(i+1)+' / '+ (agenda.count) + '</div><div id="phaseDate-'+i+'"><div id="phaseMonthYear-'+i+'">'+dateStartMonthToText.toUpperCase()+dateStartYear+'</div><div id="phaseTitle-'+i+'">'+title+'</div></div><div id="durationBg-'+i+'"></div></div>');
        //        timeline.append('<div id="durationPhase-'+i+'"><div id="durationPhaseBg-'+i+'" class="dPhaseBg"></div><div id="phaseId-'+i+'">PHASE '+(i+1)+' / '+ (agenda.count) + '</div><div id="phaseDate-'+i+'"><div id="phaseDay-'+i+'">'+dateStartDay+'</div><div id="phaseMonth-'+i+'">'+dateStartMonthToText.toUpperCase()+'</div><div id="phaseYear-'+i+'">'+dateStartYear+'</div></div><div id="durationBg-'+i+'"></div></div>');
        var durationPhase   = $('#durationPhase-'+i);
        var durationPhaseBg = $('#durationPhaseBg-'+i);
        var durationBg      = $('#durationBg-'+i);
        var phaseId         = $('#phaseId-'+i);
        var phaseTitle         = $('#phaseTitle-'+i);
        var phaseDate       = $('#phaseDate-'+i);
        var phaseMonthYear        = $('#phaseMonthYear-'+i);
        var phaseDay        = $('#phaseDay-'+i);
        //        var phaseMonth      = $('#phaseMonth-'+i);
        //        var phaseYear       = $('#phaseYear-'+i);
        
        
        durationPhase.css({
            'color'         : siteMainColor,
            'position'      :'absolute',
            'height'        : timelineH/4,
            'width'         : durationW,
            'min-width'     : '100px',
            'left'          : '-200px',//durationL,
            'font-family'   :'GothamLight',
            'font-size'     :'11px',
            'z-index'       : indexZ+1
        });
        
        durationPhaseBg.css({
            'background'    : 'white',
            'position'      : 'absolute',
            'height'        : timelineH,
            'width'         : durationW,
            'left'          : 0,
            'opacity'       : 0,
            'z-index'       : indexZ-1
        });
      
        
        durationBg.css({
            'position'      :'absolute',
            'height'        :'1px',
            'background'    : siteMainColor,
            'top'           :(timelineH/4)*3+'px',
            'width'         :'100%',
            'left'          :'0px',
            'opacity'       : 1-(0.1*i),
            'z-index'       : indexZ+9
        });
                    
        phaseId.css({
            'position'      :'absolute',
            'color'         : siteMainColor,
            'font-family'   :'GothamMedium',
            'font-size'     :'9px',
            'z-index'       : indexZ+3,
            'top'           :'10px',
            'padding-left'  :'10px',
            'border-left'   :'1px dotted #353535',
            'height'        : timelineH
        });
        
        phaseTitle.css({
            'position'      :'absolute',
            'color'         : 'white',
            'font-family'   :'GothamMedium',
            'font-size'     :'9px',
            'z-index'       : indexZ+3,
            'top'           :'22px',
            'letter-spacing':'-0.5px',
            'padding-left'  :'10px',
            'border-left'   :'1px dotted #353535',
            'height'        : timelineH,
            'text-transform':'uppercase'
        });
        
        phaseDay.css({
            'width'         :'30px',
            'position'      :'absolute',
            'color'         :'white',
            'font-family'   :'GothamLight',
            'font-size'     :'24px',
            'top'           : timelineH / 4,
            'left'          :'-40px',
            'z-index'       : indexZ+4,
            'text-align'    :'right',
            'overflow'      :'hidden',
            'opacity'       : 0
        });
        
        phaseMonthYear.css({
            'position'      :'absolute',
            'color'         : siteGreyColor,
            'font-family'   :'GothamMedium',
            'font-size'     :'9px',
            'top'           : timelineH / 4+18+'px',
            'left'          :'10px',
            'z-index'       : indexZ+5
        });
        //        
        //        phaseYear.css({
        //            'position'      :'absolute',
        //            'color'         :'white',
        //            'font-family'   :'GothamMedium',
        //            'font-size'     :'9px',
        //            'top'           : timelineH / 4+14+'px',
        //            'left'          :'10px',
        //            'z-index'       : indexZ+6
        //        });
        
        durationPhase.animate({
            'left':durationL
        },durationL,'easeOutQuint');
        phaseDay.delay(200+50*i).animate({
            'opacity': 1
        },400,'easeOutQuint');
    }
    timeline.append('<div id="timelineDays"></div>');
    $('#timelineDays').css({
        'opacity':'0.2',
        'position':'absolute',
        'z-index':indexZ+8
    });
    for(var n = 0; n < totalDays; n++){
        $('#timelineDays').append('<div id="timelineDay-'+n+'" class="tlineDay"></div>');
        var timelineDay = $('#timelineDay-'+n);
        timelineDay.css({
            'background'    :'none',
            'position'      :'absolute',
            'height'        : timelineH/4,
            'width'         : dayWidth-1,
            'left'          : 0,
            'top'           :(timelineH/4)*2+(timelineH/8),
            //'opacity'       :'0.1',
            'z-index'       : indexZ+8,
            'cursor'        :'pointer',
            'border-left'   :'1px solid #fff'
        //'border-left'   :'1px solid white'
        });
        
        timelineDay.animate({
            'left': dayWidth * n
        },10*n,'easeOutQuint');
    }
    var tlineDay = $(".tlineDay"); 
    tlineDay.hover(function() {
        $(this).animate({
            'border-left-width':$(this).width()+1,
            //'opacity':'0.2'
            'color':'#404040'
        }, 100,'easeInSine');
    },function() {
        $(this).animate({
            'border-left-width':'1px',
            //'opacity':'0.1'
            'color':'#262626'
        }, 500,'easeInSine');
    });
    
    $('.dPhaseBg').hover(
        function () {
            $(this).animate({
                'opacity':'0.09'
            },400,'easeOutQuint');
        }, 
        function () {
            $(this).animate({
                'opacity':'0'
            },400,'easeOutQuint');
        });
    
    var displayAgenda = function (){
        timeline.animate({
            'margin-top'    : -(timelineH + topStart),
            'opacity'       :1
        },400,'easeOutSine');
    };
    
    var hideAgenda = function (){
        timeline.animate({
            'margin-top'    : -(timelineH + topStart-(timelineH*0.4)),
            'opacity'       :1
        },500,'easeOutQuart');
    }
    
    setTimeout(hideAgenda,1500);
    
    timeline.hover(
        function () {
            cancelWaitForAction ('hideAgenda');
            displayAgenda ();
        }, 
        function () {
            waitForAction(function(){
                hideAgenda()
            },800);
        });
          

};

initDiaporama = function (pageId) {
    var htmlText = $('#htmlText-'+pageId+' .content');
    htmlText.append('<div id="winners"></div>');
    var winnersDiv =  $('#winners');

    winnersDiv.append('<div id="winner"><div id="hideH1"><h1></h1></div><div id="hideH2"><h2></h2></div><div id="hideH3"><h3></h3></div><div id="visuelWinner"></div></div>');   
    $('#winner').append('<div id="loadTimer"></div>');
    var winnersTop  = 0;

    var imgWidth    = 632;
    
    htmlText.css({
        'position'      :'absolute',
//        'top'           :'10%',
        'top'           :130/fontRatio+'px',
        'left'          :$('#leftColumn').width()+marginL*4+'px',
        'z-index'       :'20',
        'width'         :imgWidth+'px'
    });
    
    var winner      = $('#winner');
    var H1          = $('#winner h1');
    var H2          = $('#winner h2');
    var H3          = $('#winner h3');
    var hideH1      = $('#winner #hideH1');
    var hideH2      = $('#winner #hideH2');
    var hideH3      = $('#winner #hideH3');
    var visuel      = $('#winner #visuelWinner');
    var loadTimer   = $('#winner #loadTimer');
    
    winnersDiv.css({
        'position'      :'absolute'
    });
    
    loadTimer.css({
        'width'         :'0px',
        'height'        :'3px',
        'position'      :'absolute',
        'background'    :siteMainColor,
        'opacity'       :'1',
        'top'           :winnersTop+154/fontRatio+240+'px',
        'margin-top'    :'-3px',
        'z-index'       :150
    });
    
    winner.css({
        'position'  :'absolute',
        'font-size' :'30px',
        'z-index'   : 2000,
        'left'      :'0px',
        'width'     : imgWidth+'px'
    });
    
    hideH1.css({
        'position'   :'absolute',
//        'top'        : winnersTop+36/fontRatio+'px',
        'width'      : imgWidth+'px',
        'height'     : 30/fontRatio+'px',
        'overflow'   :'hidden'
    });
    
    hideH2.css({
        'position'   :'absolute',
        'top'        : winnersTop+36/fontRatio+'px',
        'width'      : imgWidth+'px',
        'height'     :30/fontRatio+'px',
        'overflow'   :'hidden'
    });
    
    hideH3.css({
        'position'   :'absolute',
        'top'        : winnersTop+72/fontRatio+'px',
        'width'      : imgWidth+'px',
        'height'     :30/fontRatio+'px',
        'overflow'   :'hidden'
    });
    
    H1.css({
        'font-size'  :30/fontRatio+'px',
        'position'   :'absolute',
        'display'    :'block',
        'color'      :'white',
//        'top'        :36/fontRatio+'px',
        'width'      :'100%'
    });
        
    H2.css({
        'font-size'  :30/fontRatio+'px',
        'position'   :'absolute',
        'display'    :'block',
        'color'      : siteGreyColor,
        'top'        :36/fontRatio+'px',
        'width'      :'100%' 
    });

    H3.css({
        'font-size'  :30/fontRatio+'px',
        'position'   :'absolute',
        'display'    :'block',
        'color'      : siteGreyColor,
        'top'        :36/fontRatio+'px',
        'width'      :'100%' 
    });
    
    visuel.css({
        'position'      :'absolute',
        'display'       :'block',
        'top'           : winnersTop+154/fontRatio+'px',
        'color'         :'white',
        'overflow'      :'hidden',
        'height'        :'240px'
    });
}

initHomeText = function (pageId) {
    var htmlText    = $('#htmlText-'+pageId+' .content');
    htmlText.append('<div id="hometext"></div>');
    var imgWidth    = 632;
    var t = 0;
    var hometextDiv =  $('#hometext');
    
    var title           = homeTexts[t].title;
    var textA           = homeTexts[t].textA;
    var textB           = homeTexts[t].textB;
    
    hometextDiv.append('<div id="hideTextH1"><h1>'+title+'</h1></div><div id="hideTextA">'+textA+'</div><div id="hideTextB">'+textB+'</div>');   
    
        
    var H1          = $('#hometext h1');
    var P           = $('#hometext p');
    var hideTextH1  = $('#hometext #hideTextH1');
    var hideTextA   = $('#hometext #hideTextA');
    var hideTextB   = $('#hometext #hideTextB');
    
    hometextDiv.css({
        'position'      :'absolute',
        'border-top'    :'1px solid #2a2a2a',
        'top'           : 154/fontRatio + 240 + 30/fontRatio + 60+'px',
        'width'         :'632px'
    });

    
    hideTextH1.css({
        'position'   :'absolute',
        'top'        :'36px',
        'width'      :'0px',
        'height'     :'72px',
        'overflow'   :'hidden'
    });

    
    H1.css({
        'font-size'         :30/fontRatio+'px',
        'position'          :'absolute',
        'display'           :'block',
        'color'             :'white',
        'height'            :'72px',
        'width'             :imgWidth/2,
        'text-transform'    :'uppercase'
    });
    
    hideTextA.css({
        'position'   :'absolute',
        'top'        :'60px',
        'width'      : 0,
        'height'     :'340px',
        'overflow'   :'hidden'
    });
    
    hideTextB.css({
        'position'   :'absolute',
        'top'        : '60px',
        'left'       : imgWidth / 2 + 20,
        'width'      : 0,
        'height'     :'340px',
        'overflow'   :'hidden'
    });
    
    P.css({
        'font-size'     :'12px',
        'position'      :'absolute',
        'display'       :'block',
        'line-height'   :'18px',
        'color'         :siteGreyColor,
        'top'           :'20px',
        'width'         :imgWidth/2 - 20+'px',
        'text-transform':'none'
    });
    
    hideTextA.delay(400).animate({
        'width': imgWidth/2 - 20+'px'
    },500,'easeOutSine');
    
    hideTextB.delay(600).animate({
        'width': imgWidth/2 - 20+'px'
    },500,'easeOutSine');
    
    hideTextH1.delay(400).animate({
        'width': imgWidth+'px'
    },1000,'easeOutSine', function (){
        checkElemHeight('homepage', $('#htmlText-'+pageId), $('#htmlText-'+pageId+' .content'), $('#hideTextA'), null, 0, 250);    
    });
    
    
}

addDiaporama = function (t){
    var speedDiaporama  = 15000;
    var title           = winners[t].title;
    var category        = winners[t].category;
    var url             = winners[t].url;
    var H1              = $('#winner h1');
    var H2              = $('#winner h2');
    var H3              = $('#winner h3');
    var visuel          = $('#winner #visuelWinner');
    var loadTimer       = $('#winner #loadTimer');
    
    
    visuel.css({
        'overflow':'hidden'
    });
    
    
    H1.append(title);
    H2.append(category);
    H3.append('EDITION 2010');
    H1.delay(350).animate({
        'top':'0px'
    },300,'easeOutSine');
    H2.delay(500).animate({
        'top':'0px'
    },300,'easeOutSine');
    H3.delay(650).animate({
        'top':'0px'
    },300,'easeOutSine');


    visuel.append('<img src="upload/accueil/prj-'+t+'.jpg" />');
    
    
    var visiterTop = 154/fontRatio + 240 + 30/fontRatio;
    
    addLink('#winner', 'VISITER', url, '40', '120', visiterTop, '0', '#ffffff', siteMainColor, 0, 0, '21', '0.2', false, false);
    
    visuel.animate({
        'width':'632px'
    },500,'easeOutSine');
    
    loadTimer.animate({
        'width':'632px'
    },speedDiaporama,'linear',function (){
        visuel.animate({
            'width':'0px'
        },600,'easeOutQuint', function (){
            $(this).empty();
            if(t == winners.count-1){
                t = 0;
            } else{
                t++;
            }
            $('#embedLink-VISITER').remove();
            addDiaporama(t);
        });
        
        loadTimer.css({
            'width':'0px'
        });
        
        H1.animate({
            'top':'-50px'
        },300,'easeOutSine',function (){
            $(this).css({
                'top':'50px'
            });
            $(this).empty();
        });
        
        H2.delay(80).animate({
            'top':'-50px'
        },250,'easeOutSine',function (){
            $(this).css({
                'top':'50px'
            });
            $(this).empty();
        });
        
        H3.delay(140).animate({
            'top':'-50px'
        },190,'easeOutSine',function (){
            $(this).css({
                'top':'50px'
            });
            $(this).empty();
        });
    })
}

loadJury = function (pageId) {
    var htmlText = $('#htmlText-'+pageId+' .content');
    var imgWidth    = 632;
    htmlText.css({
        'position'      :'absolute',
        'top'           :130/fontRatio+'px',
        'left'          :$('#leftColumn').width()+marginL*4+'px',
        'z-index'       :'20',
        'width'         :imgWidth+'px'
    });
    checkElemHeight('jury', $('#htmlText-'+pageId), $('#htmlText-'+pageId+' .content'), $('.juryItem').last(), null, 0, 250);
};

unloadJury = function () {
    $(".htmlText").delay(300).animate({
        'width':0,
        'padding':0
    },1200,'easeOutQuint', function (){
        $(this).remove();
    });
};

loadCriteres = function (pageId) {
    var htmlText = $('#htmlText-'+page.id+' .content');
    var imgWidth    = 632;
    htmlText.css({
        'position'      :'absolute',
        'top'           :130/fontRatio+'px',
        'left'          :$('#leftColumn').width()+marginL*4+'px',
        'z-index'       :'20',
        'width'         :imgWidth+'px'
    });
    checkElemHeight('criteres', $('#htmlText-'+pageId), $('#htmlText-'+pageId+' .content'), $('#htmlText-'+pageId+' .content .lastcriteres'), null, 0, 250);
};

unloadCriteres = function () {
    $(".htmlText").delay(300).animate({
        'width':0,
        'padding':0
    },1200,'easeOutQuint', function (){
        $(this).remove();
    });
};

loadReglement = function (pageId) {
    var htmlText = $('#htmlText-'+pageId+' .content');
    var imgWidth    = 632;
    htmlText.css({
        'position'      :'absolute',
        'top'           :130/fontRatio+'px',
        'left'          :$('#leftColumn').width()+marginL*4+'px',
        'z-index'       :'20',
        'width'         :imgWidth+'px'
    });
    checkElemHeight('reglement', $('#htmlText-'+pageId), $('#htmlText-'+pageId+' .content'), $('#htmlText-'+pageId+' .content div').last(), null, 0, 250);
};

unloadReglement = function () {
    $(".htmlText").delay(300).animate({
        'width':0,
        'padding':0
    },1200,'easeOutQuint', function (){
        $(this).remove();
    });
};

loadDemarche = function (pageId) {
    var htmlText = $('#htmlText-'+pageId+' .content');
    var imgWidth    = 632;
    htmlText.css({
        'position'      :'absolute',
        'top'           :130/fontRatio+'px',
        'left'          :$('#leftColumn').width()+marginL*4+'px',
        'z-index'       :'20',
        'width'         :imgWidth+'px'
    });
    checkElemHeight('demarche', $('#htmlText-'+pageId), $('#htmlText-'+pageId+' .content'), $('#htmlText-'+pageId+' .content div').last(), null, 0, 250);
};

unloadDemarche = function () {
    $(".htmlText").delay(300).animate({
        'width':0,
        'padding':0
    },1200,'easeOutQuint', function (){
        $(this).remove();
    });
};

unloadHtml = function (){
    switch(page.oldid)
    {
        case '0':
            unloadHomepage ();
            break;
        case '1':
            unloadCanvas ();
            unloadColumn ();
            break;
        case '2':
            unloadForm (); 
            break;                    
        case '3':
            unloadJury ();
            break;
        case '4':
            unloadCriteres ();
            break;
        case '5':
            unloadReglement ();
            break;
        case '6':
            unloadDemarche ();
            break;
    }
    if(scrollHtml){
        $('.scrollBarHtml').remove();
    }
};

loadFooterLinks = function () {
    for(var i=0; i<footerMenu.length;i++){
        var url = null; 
        switch (i) {
            case 3:
                url = 'http://www.lyon-shop-design.com';
                $('#liens').append('<div id="footerLink-'+i+'" data-id="'+i+'"><a href="'+url+'" target="_blank">'+footerMenu[i].toUpperCase()+'&nbsp;&nbsp;|</a></div>');
                break;
            case 2:
                url = 'download.php';
                $('#liens').append('<div id="footerLink-'+i+'" data-id="'+i+'"><a href="'+url+'" target="_blank">'+footerMenu[i].toUpperCase()+'</a></div>');
                break;
            default :
                $('#liens').append('<div id="footerLink-'+i+'" data-id="'+i+'" data-url="null">'+footerMenu[i].toUpperCase()+'</div>');
                break;
        }
        var footerLink   = $('#footerLink-'+i);
        var footerLink_a = $('#footerLink-'+i+' a');
        footerLink.css({
            'float'     :'right',
            'margin'    :'0 10px 0 0',
            'cursor'    :'pointer',
            'color'     :siteGreyColor
        });
        
        footerLink_a.css({
            'float'     :'right',
            'margin'    :'0 0 0 0',
            'cursor'    :'pointer',
            'color'     :siteGreyColor
        });
        
        footerLink.hover(function(){
            $(this).css({
                'color':'white'
            })
        },
        function () {
            $(this).css({
                'color':siteGreyColor
            })
        });
        
        footerLink_a.hover(function(){
            $(this).css({
                'color':'white'
            })
        },
        function () {
            $(this).css({
                'color':siteGreyColor
            })
        });
                
        footerLink.click(function(evt){
            var getUrl = $(this).attr('data-url');
            if(getUrl == 'null'){
                var pageId = $(this).attr('data-id');            
                if(loadedFooterHtml){
                    updateFooterHtml(pageId, true);
                    loadedFooterHtml = true;
                } else{
                    loadFooterHtml(pageId, true);
                    loadedFooterHtml = true;
                }
            }
        });
    }
};

loadFooterHtml = function (pageId, closeable) {
    
    pauseRotations();
    
    $('body').append('<div class="htmlFooterText" id="htmlFooterText-'+pageId+'"></div>');
    $('body').append('<div class="footerHideHtml"></div>');
    var htmlFooterText = $('.htmlFooterText');
    var footerHideHtml = $('.footerHideHtml');
    
    footerHideHtml.css({
        'position'          :'absolute',
        'z-index'           :'300',
        'width'             :'0px',
        'height'            :'100%',
        'background-image'  :'url(images/pattern-scrollBars.png) ',
        'background-color'  : siteSndDarkColor,
        'overflow'          :'hidden',
        'opacity'           :'0.8'
    });
    
    htmlFooterText.append('<div class="contentFooterText"></div>');
    var contentFooterText = $('.contentFooterText');
    htmlFooterText.css({
        'position'          :'absolute',
        'z-index'           :'310',
        'width'             :'0px',
        'height'            :'100%',
        'background-color'  : siteMainDarkColor,
        'padding-left'      : marginL*3,
        'padding-right'     : marginL*5,
        'color'             :'white',
        'left'              :ieWW +htmlW40prc + marginL*5 ,
        'margin-left'       : -htmlW40prc - marginL*2,
        'font-family'       :'GothamLight',
        'font-size'         :'16px',
        'text-transform'    :'uppercase',
        'overflow'          :'hidden',
        'opacity'           :'1'
    });
    
    contentFooterText.css({
        'position'          :'absolute',
        'width'             :htmlW40prc-marginL*2,
        'height'            :'100%',
        'padding-top'       :marginT*2
    });
    $('#htmlFooterText-'+pageId +' .contentFooterText').load('html/footerPage-'+pageId+'.php', function (){
        footerHideHtml.animate({
            'width' : '100%'
        },1000,'easeOutExpo', function (){
            htmlFooterText.animate({
                'width' : htmlW40prc-marginL*2,
                'left':ieWW
            },1000,'easeOutExpo',function (){
                $(this).css({
                    'left':'100%'
                });
            });
            checkElemHeight('footerText', htmlFooterText, contentFooterText, $('.lastDiv'), null, 0, 310);
            if(closeable){
                addClose('#htmlFooterText-'+pageId, 65, marginT*3, 36, unloadFooterHtml);
            }
        });
    });
};

updateFooterHtml = function (pageId, closeable) {
    var htmlFooterText = $('.htmlFooterText');
    
    htmlFooterText.animate({
        'width' : 0,
        'margin-left'  :ieWW
    }
    ,1000, 'easeOutQuint', function (){
        htmlFooterText.remove();
        $('#scroll-footerText').remove();
        $('body').append('<div class="htmlFooterText" id="htmlFooterText-'+pageId+'"></div>');
        htmlFooterText = $('.htmlFooterText');
        
        htmlFooterText.append('<div class="contentFooterText"></div>');
        var contentFooterText = $('.contentFooterText');
        htmlFooterText.css({
            'position'          :'absolute',
            'z-index'           :'310',
            'width'             :'0px',
            'height'            :'100%',
            'background-color'  : siteMainDarkColor,
            'padding-left'      : marginL*3,
            'padding-right'     : marginL*5,
            'color'             :'white',
            'left'              :ieWW +htmlW40prc + marginL*5 ,
            'margin-left'       : -htmlW40prc - marginL*2,
            'font-family'       :'GothamLight',
            'font-size'         :'16px',
            'text-transform'    :'uppercase',
            'overflow'          :'hidden',
            'opacity'           :'1'
        });
    
        contentFooterText.css({
            'position'          :'absolute',
            'width'             :htmlW40prc-marginL*2,
            'height'            :'100%',
            'padding-top'       :marginT*2
        });
        
        $('#htmlFooterText-'+pageId +' .contentFooterText').load('html/footerPage-'+pageId+'.php', function (){

            htmlFooterText.animate({
                'width' : htmlW40prc-marginL*2,
                'left':ieWW
            },1000,'easeOutExpo',function (){
                $(this).css({
                    'left':'100%'
                });
            });
            checkElemHeight('footerText', htmlFooterText, contentFooterText, $('.lastDiv'), null, 0, 310);
            if(closeable){
                addClose('#htmlFooterText-'+pageId, 65, marginT*3, 36, unloadFooterHtml);
            }
        
        });
    });
    
    
    
};

unloadFooterHtml = function () {
    var htmlFooterText = $('.htmlFooterText');
    var footerHideHtml = $('.footerHideHtml');
    
    htmlFooterText.animate({
        'width' : 0,
        'margin-left'  :ieWW
    }
    ,1000, 'easeOutQuint', function (){
        footerHideHtml.animate({
            'width':'0px'
        },800,'easeOutExpo', function (){
            footerHideHtml.remove();
            htmlFooterText.remove();
            loadedFooterHtml = false;
            if(scrollHtml){
                $('#scroll-footerText').remove();
            }
            resumeRotations();
        })
    });
};

initMainSite = function () {
    initDetectBrowser();
    initMainVars ();
    initMainObjects ();
    initMainMenu ();
    initActus ();
    loadFooterLinks ();
};