/* HUMANIZED MESSAGES 1.0 idea - http://www.humanized.com/weblog/2006/09/11/monolog_boxes_and_transparent_messages home - http://humanmsg.googlecode.com */ var humanMsg = { setup: function(appendTo, logName, msgOpacity) { humanMsg.msgID = 'humanMsg'; humanMsg.logID = 'humanMsgLog'; // Opacity of the message humanMsg.msgOpacity = parseFloat(msgOpacity) || .8; // The text on the Log tab if (!logName) logName = 'Message Log'; // appendTo is what we attach the message HTML to if (!appendTo) appendTo = 'body'; // Inject the message structure jQuery(appendTo).append('

'+logName+'

') // Click the log tab opens the log jQuery('#'+humanMsg.logID+' p').click( function() { jQuery(this).siblings('ul').slideToggle('fast') } ) }, displayMsg: function(msg) { // Kill the auto-fadeout timer clearTimeout(humanMsg.t2); // Inject message jQuery('#'+humanMsg.msgID+' p').html(msg) // Show message jQuery('#'+humanMsg.msgID+'').show().animate({ opacity: humanMsg.msgOpacity}, 200, function() { jQuery('#'+humanMsg.logID) .show().children('ul').prepend('
  • '+msg+'
  • ') // Prepend message to log .children('li:first').slideDown(200) // Slide it down if ( jQuery('#'+humanMsg.logID+' ul').css('display') == 'none') { jQuery('#'+humanMsg.logID+' p').animate({ bottom: 40 }, 200, 'linear', function() { jQuery(this).animate({ bottom: 0 }, 300, 'easeOutBounce', function() { jQuery(this).css({ bottom: 0 }) }) }) } }) // Watch for mouse & keyboard in .5s humanMsg.t1 = setTimeout("humanMsg.bindEvents()", 700) // Remove message after 5s humanMsg.t2 = setTimeout("humanMsg.removeMsg()", 5000) }, bindEvents: function() { // Remove message if mouse is moved or key is pressed jQuery(window) .mousemove(humanMsg.removeMsg) .click(humanMsg.removeMsg) .keypress(humanMsg.removeMsg) }, removeMsg: function() { // Unbind mouse & keyboard jQuery(window) .unbind('mousemove', humanMsg.removeMsg) .unbind('click', humanMsg.removeMsg) .unbind('keypress', humanMsg.removeMsg) // If message is fully transparent, fade it out if (jQuery('#'+humanMsg.msgID).css('opacity') == humanMsg.msgOpacity) jQuery('#'+humanMsg.msgID).animate({ opacity: 0 }, 500, function() { jQuery(this).hide() }) } }; jQuery(document).ready( function() { humanMsg.setup(); })