$.widget('ui.header', {
    _init : function(){
        // properties
        this.animated = false;
        this.build();
    },

    build : function(){
        var self = this;

        $('.contentLogo').mouseover(function(){ self.over();});
        $('.contentLogo').mouseout(function(){ self.out();});
        if ($.browser.msie){
            $('.second').css({display:'none'});
        }
        else{
            $('.first').css({opacity:'1'});
            $('.second').css({opacity:'0'});
        }
    },

    over : function(){
        if ($.browser.msie){
            $('.first').css({display:'none'});
            $('.second').css({display:'block'});
        }
        else{

             $('.first').animate({opacity:'0.5'}, 'fast');
             $('.second').animate({opacity:'1'}, 'fast');
       }
    },

    out : function(){
        if ($.browser.msie){
            $('.second').css({display:'none'});
            $('.first').css({display:'block'});
        }
        else{
            $('.second').animate({opacity:'0'}, 'fast');
            $('.first').css({opacity:'0.5'}).animate({opacity:'1'}, 'fast');
        }
    }
});

$.widget('ui.effects',{
    _init : function(){
        // properties
        this.haloState = false;
        this.nbRepeats = 100;
        this.build();
    },

    build : function(){
        var self = this;
        // building the halo
        this.haloHeader = $('<div>', {
            'class' : 'etincelle',
            css : {'left' : '1000px'}
        }).appendTo(this.element);

        // animating the halo
        setTimeout(function(){ self.animateHalo()}, 100);

        // building the text
        this.textHeader = $('<img>', {
            src : 'css/img/texte.png',
            'class' : 'textHeader',
            css : { opacity : 0.3}
        }).appendTo(this.element);
        // animating the text
        setTimeout(function(){ self.animateText()}, 1500);
    },

    animateHalo : function(){
        var self = this;
        for (i=0; i<this.nbRepeats; i++){
            this.haloHeader
                .animate({left: '-1650px'}, 5000)
                .delay(500)
                .animate({left:'3300px'}, 8000)
            ;
        }
    },

    animateText : function(){
        for (i=0; i<this.nbRepeats;i++){
            this.textHeader
                .animate({opacity: '1'}, 1500)
                .delay(800)
                .animate({opacity: '0.3'}, 1000)
                .delay(100)
                .animate({opacity: '1'}, 400)
                .delay(100)
                .animate({opacity: '0.3'}, 400)
                .delay(100)
                .animate({opacity: '1'}, 400)
                .delay(300)
                .animate({opacity: '0.3'}, 1000)
                .delay(2000)
            ;
        }
    }
});

$.widget('ui.menu_container', {
    _init : function(){
        // properties
        this._menus = {};
        this.build();

    },

    build : function(){
        // properties
        this.haloContainer = null;
        var self = this;
        this.element.addClass("menu");
        // Building items

        // new trying
        this.haloContainer = $('<div>', {
            'class' : 'halo-container',
            css : {opacity:'0'}
        }).appendTo(this.element);

        this.newHalo = $('<div>', {
            'class' : 'halo'
        }).appendTo(this.haloContainer);
        var page = this.options.page;
        if (page == 'contact' || page == 'devis' || page == 'recrutement'){
            this.newHalo.css({'height':'76px'});
        }

        this.addItem({name:"accueil",label : "Accueil" ,location : "index.php",halo : this.newHalo});
        this.addItem({name:"presentation",label : "Présentation" ,location : "/presentation",halo : this.newHalo});
        this.addItem({name:"prestation",label : "Prestation" ,location : "/presentation"});
        this.addItem({name:"recrutement",label : "Nous Rejoindre" ,location : "/presentation"});
        this.addItem({name:"references",label : "Références" ,location : "/references"});
        this.addItem({name:"devis",label : "Devis" ,location : "/presentation"});
        this.addItem({name:"news",label : "News" ,location : "/presentation"});
        this.addItem({name:"notreclipvideo",label : "Notre clip vidéo" ,location : "/notreclipvideo"});

        // Upping the selected menu
        /*$.each(this._menus, function(e, item){
            if (this.options.page!=e) self._menus[e].setDown();
        });*/
        this._menus[this.options.page].setTop();
    },

    addItem : function(obj){
        var self = this;
        if(!obj) throw 'Obj is missing ! ';
        this._menus[obj.name] = $.engine.newWidget('menu_item', obj);
        this._menus[obj.name].element
            .bind('item_click', function(e, item) {self._onClick(item);})
            .appendTo(this.element);

    },

    _onClick : function(item){
        //window.location.href = item;
        var self = this;
        this._switchItems(item);

    },

    _switchItems : function(item){
        window.location.href = item;
        /*this._menus[item]._getUp();
        this._menus[this.options.page]._getDown(function(){window.location.href = item;});*/
    }
});


$.widget('ui.menu_item', {
    _init : function(){
        this.element.addClass('menu-item '+this.options.name);

        this.options = $.extend({}, $.ui.menu_container.defaults, this.options);
        // properties
        this._item = {};
        this._active = false;
        this._dimensions = {
            Y : "654px"
        };
        this._halo = {};
        this.build();
    },

    build : function(){
        var self = this;

        this.element
            .css({top:'1px'})
            .text(this.options.label)
            .mouseover(function(e){ self._mouseOver();})
            .mouseout(function(e){ self._mouseOut();})
            .click(function(e){ self._onClick();})
        ;
    },

    _mouseOver : function(){
        var self = this;
        this.element.animate({ color:"#BA852F"}, 100);
         var arrayX = new Array();
        arrayX['accueil'] = 4;
        arrayX['presentation'] = 128;
        arrayX['prestation'] = 252;
        arrayX['recrutement'] = 376;
        arrayX['references'] = 500;
        arrayX['devis'] = 624;
        arrayX['news'] = 748;
        arrayX['notreclipvideo'] = 872;
        $('.halo-container').css({opacity:'0'}).stop();
        // animation du halo
        $('.halo').animate({left:arrayX[this.options.name]+'px'}, 0, function(){
            $('.halo-container').animate({opacity : '0.3'}, 800);
        });

		$("#son").html('<embed src="/flash/son.swf" hidden="true" autostart="true" loop="false" volume="75%" />');

    },

    _mouseOut : function(){
        var self = this;
        this.element.animate({color:"#ffffff"}, 100);

        $('.halo-container').css({opacity:'0'}).stop();

    },

    _onClick : function(){
        var self = this;
        this.element.triggerHandler('item_click', this.options.name);
    },

    setTop : function(){
        var self = this;
        self.element.css({marginTop:'-28px', backgroundImage : 'url(/css/img/menu-on-click.png)'});
    },

    setDown : function(){
        this.element.css({marginTop:'0'});
    },

    _getUp : function(){
        var self = this;
        this.element.css({marginTop : "-28px",opacity:'0.5'}, 200, function(){
            self.element.animate({backgroundPosition : "0 46px", opacity:'1'}, 200);
        });
    },

    _getDown : function(cback){
        var self = this;
        this.element.animate({height:"32px", marginTop : "0", backgroundPosition:"0 0"}, 100).delay(300).queue(cback)
        ;
    }
});