//plugin tooltip
/*jQuery(document).ready(function(){
	
	$('.liste-variantes li{[stock]').tooltip({
		position: 'bottom',
		width:120,
		height:25,
		persistant:false,
		template: function(e){
			var lib = '<div style="text-align:center;">'+e.attr('stock')+'</div>';
			return lib;
		}
	});
});*/

(function($){
    
    $.fn.tooltip = function(args){
        
        args = $.extend({
            width:150,
            height:100,
            position: 'bottom',
            persistant:true,
            title: '',
            marge: 5,
            template: function(_el){
                return _el.title;
            }
        }, args);
        
        var _elements = $(this);
        
        if(_elements.length > 0){
            
            /**
             * création des elements
             */
            var _main = $('#tooltip-main');
            if(_main.length <= 0){
                $('body').append('<div id="tooltip-main"><div id="tooltip-wrapper"><div id="tooltip-loader"></div><div id="tooltip-arrow"></div></div></div>');
                _main = $('#tooltip-main');
            }
            
            /**
             * routine
             */
            $(document).mousemove(function(e){
                if(!$(e.target).closest('.tooltiped').length) {
                    $.tooltip.close();
                };
                
            });
            
            _elements.each(function(){
                
                var _el = $(this);
                _el.addClass('tooltiped');
                
                /**
                 * events
                 */
                _el.mouseenter(function(){
                    
                    _main.removeClass('tooltiped');
                    if(args.persistant){
                        _main.addClass('tooltiped');
                    }
                    
                    var _wrapper = _main.find('#tooltip-wrapper');
                    var _cont = _wrapper.find('#tooltip-loader');
                    /**
                     * contenus
                     */
                    _cont.html('');
                    if(args.title != ''){
                        _cont.append('<h2>'+args.title+'</h2>');
                    }

                    _cont.append('<div id="tooltip-content">'+args.template(_el)+'</div>');

                    /**
                     * recupération de la position de l'élément
                     */
                    var el_left = $(this).offset().left;
                    var el_top = $(this).offset().top;
                    var el_width = $(this).innerWidth() + $.tooltip.cleanpx($(this).css('margin-left')) + $.tooltip.cleanpx($(this).css('margin-right'));
                    var el_height = $(this).innerHeight() + $.tooltip.cleanpx($(this).css('margin-top')) + $.tooltip.cleanpx($(this).css('margin-bottom'));
                    //autres
                    var el_hcenter = parseInt(el_left) + (el_width / 2);
                    var el_vcenter = parseInt(el_top) + (el_height / 2);

                    /**
                     * gestion des cas spéciaux
                     */
                    var cas = args.position;
                    /*if(args.position == 'top' && el_top < args.height){
                        cas = bottom;
                    }*/

                    /**
                     * positionnement
                     */
                    var top = left = 0;
                    switch(cas){

                        case 'top':
                            top = el_top - args.height + args.marge; //gerer une marge + fleche
                            top_depart = top + 20;// depart
                            left = el_hcenter - (args.width / 2);
                            left_depart = left;// depart
                            //marge fleche
                            $.tooltip.cleanclass();
                            $('#tooltip-arrow').addClass('down').html('<div class="arrow"></div>');
                            top-= $('#tooltip-arrow div').height();
                            break;
                            
                        case 'bottom':
                            top = el_top + el_height - args.marge; //gerer une marge + fleche
                            top_depart = top + 20;// depart
                            left = el_hcenter - (args.width / 2);
                            left_depart = left;// depart
                            //marge fleche
                            $.tooltip.cleanclass();
                            $('#tooltip-arrow').addClass('up').html('<div class="arrow"></div>');
                            top+= $('#tooltip-arrow div').height();
                            break;
                            break;
                            
                        case 'left':
                            left = el_left - args.width + args.marge; //gerer une marge + fleche
                            left_depart = top + 20;// depart
                            top = el_vcenter - (args.height / 2);
                            top_depart = top;// depart
                            //marge fleche
                            $.tooltip.cleanclass();
                            $('#tooltip-arrow').addClass('right').html('<div class="arrow"></div>');
                            left-= $('#tooltip-arrow div').width();
                            break;
                            
                        case 'right':
                            left = el_left + el_width - args.marge; //gerer une marge + fleche
                            left_depart = top + 20;// depart
                            top = el_vcenter - (args.height / 2);
                            top_depart = top;// depart
                            //marge fleche
                            $.tooltip.cleanclass();
                            $('#tooltip-arrow').addClass('left').html('<div class="arrow"></div>');
                            left+= $('#tooltip-arrow div').width();
                            break;

                    }
                    
                    
                    _main.css({
                        width: args.width+'px',
                        height: args.height+'px',
                        top: top+'px',
                        left: left+'px'
                    }).fadeIn(150);
                    
                });
                
            });
            
        }
        
        return $(this);
        
    };
    
    
    $.tooltip = {
        cleanpx: function(string){
            //voir pour faire une traitement spécial pour auto ...
            if(string == 'auto'){
                string = '0px';
            }
            return parseInt(string.replace('px', '').replace('pt', ''));
        },
        close: function(){
            var _main = $('#tooltip-main');
            /*_main.animate({
                opacity: 0
            }, 150);  */
            _main.hide();
            
        },
        cleanclass: function(){
            $('#tooltip-arrow').removeClass('down up left right');
        }
    };
    
    
})(jQuery);