/*
 * Optimiert für die Nutzung mit einer jQuery Version > 1.4
 */

jQuery(document).ready(function(){

    var tooltipHeight	= parseInt(jQuery('.tooltip-background > img').css('height'));
    var tooltipWidth	= parseInt(jQuery('.tooltip-background > img').css('width'));

    jQuery('.tooltip-box').mouseenter(function(){

						jQuery(this).find('.tooltip-content-wrapper').addClass('transform');
						jQuery(this).find('.tooltip-icon').addClass('active');

						var orgLeft = parseInt(jQuery(this).css('left'));
            var orgTop  = parseInt(jQuery(this).css('top'));

						var tooltipboxHeight	= parseInt(jQuery('.transform .tooltip-content').css('height'));
						var tooltipboxWidth		= parseInt(jQuery('.transform .tooltip-content').css('width'));

						var borderTopHeight			= parseInt(jQuery('.transform .top').css('height'));
						var borderBottomHeight	= parseInt(jQuery('.transform .bottom').css('height'));

						var iconHeight = parseInt(jQuery('.tooltip-icon.active > img').css('height'));
						var iconWidth	 = parseInt(jQuery('.tooltip-icon.active > img').css('width'));

						var maxTopDiff	= (tooltipHeight - (tooltipboxHeight + iconHeight));
						var maxLeftDiff	= (tooltipWidth - (tooltipboxWidth + iconWidth));

						jQuery(this).css('zIndex', 99);
						jQuery('.transform .tooltip-content').css({marginTop: iconHeight+'px',marginBottom: iconHeight+'px',marginLeft: iconWidth+'px',marginRight: iconWidth+'px'});
						jQuery('.transform .tooltip-content .middle').css({height: (tooltipboxHeight - (borderTopHeight + borderBottomHeight)) + 'px'});
						jQuery('.transform').css({height: '0px',width:'0px'}).show();

            if (orgLeft >= maxLeftDiff && orgTop >= maxTopDiff ) {
               jQuery('.transform').animate({
                    top: (-tooltipboxHeight - iconHeight) + 'px',
                    left: (-tooltipboxWidth - iconWidth) + 'px',
                    height:	(tooltipboxHeight + iconHeight) + 'px',
										width:	(tooltipboxWidth + iconWidth + iconWidth) + 'px'
                }, {
                    duration: 400,
                    queue: false
                });
            } else if(orgTop >= maxTopDiff){
                jQuery('.transform').animate({
                    top: (-tooltipboxHeight - iconHeight) + 'px',
                    height:	(tooltipboxHeight + iconHeight) + 'px',
										width:	(tooltipboxWidth + iconWidth + iconWidth) + 'px'
                }, {
                    duration: 400,
                    queue: false
                });
            } else if (orgLeft >= maxLeftDiff){
                jQuery('.transform').animate({
                    left: (-tooltipboxWidth - iconWidth) + 'px',
                    height:	(tooltipboxHeight + iconHeight) + 'px',
										width:	(tooltipboxWidth + iconWidth + iconWidth) + 'px'
                }, {
                    duration: 400,
                    queue: false
                });
            } else {
                jQuery('.transform').animate({
                    height:	(tooltipboxHeight + iconHeight) + 'px',
										width:	(tooltipboxWidth + iconWidth) + 'px'
                }, {
                    duration: 400,
                    queue: false
                });
            }
			});
			jQuery('.tooltip-box').mouseleave(function(){
					if(jQuery('.transform').size() > 0){
									jQuery('.transform').animate({
											top: 0,
											left: 0,
											width: 0,
											height: 0
									}, {
											duration: 400,
											queue: false
									});
							}
							jQuery(this).css('zIndex', 5);
							jQuery(this).find('.tooltip-content-wrapper').removeClass('transform');
							jQuery(this).find('.tooltip-icon').removeClass('active');
			});
});