Difference between revisions of "User:KamranMackey/common.js"

Revision as of 21:12, 21 February 2015

/******************************************
 * Tooltip Testing                        *
 *****************************************/
$(function() {
	var mc_tooltip = null;
 
	$(".a1, .tooltip").on({
	    'mouseenter.tooltip': function(e) {
	        var $me = $(this);
 
	        // Make sure this isn't a link to upload a new file
	        if ($me.find('.new').length > 0) {
	        	// This isn't one we want to show a tooltip for
	        	return;
	        }
 
	        // Try to get the title
	        var title = $me.data('tooltip');
 
	        // See if we can find a title elsewhere
	        // Check this element or its child
	        if (title === undefined) {
	            title = $me.attr('title') || $me.children(':first').attr('title');
 
	            // Check if we found anything
	            if (title) {
	                // Save it for later
	                $me.data('tooltip', title);
	            }
	            else {
	                // Didn't find anything, no sense continuing
	                return;
	            }
	        }
 
	        // Remove any title elements to avoid the default tooltip
	        $me.add('*', $me).filter('[title]').removeAttr('title');
 
	        // Check to see if we've already created the div
	        if (!$('#tooltip-display').length) {
	            $('body').append('<div id="tooltip-display" />');
	        }
	        mc_tooltip = $('#tooltip-display');
 
 
	        // Add the text to the tooltip
	        mc_tooltip.html(title);
 
	        // Need to update the position to the cursor position
	        $me.trigger('mousemove', e);
	    },
	    'mousemove.tooltip': function (e) {
	        // Check if the element exists already, create it if it doesn't
	        if (!$('#tooltip-display').length) {
	            $(this).trigger('mouseenter');
	            return;
	        }
 
	        // Get dimensions for bounds checking
	        var top = e.pageY - 30,
	            height = mc_tooltip.outerHeight(true),
	            left = e.pageX + 15,
	            width = mc_tooltip.outerWidth(true);
 
	        // Get window dimensions
	        var $w = $(window),
	            win_width = $w.width(),
	            win_height = $w.height();
 
	        // TODO: Make it so it doesn't go off the sides
 
	        // Apply the position
	        mc_tooltip.css({
	            top: top,
	            left: left
	        });
	    },
	    'mouseleave.tooltip': function (e) {
	        // Make sure the tooltip is there before we use it
	        if (!mc_tooltip) {
	            return;
	        }
 
	        mc_tooltip.remove();
	    },
	});
});