//---------------------------------------------------------------------------- 
//  Copyright (c) 2006, Humanized, Inc.
//  Copyright (c) 2007, jbloomDesign
//  All rights reserved.
// 
//  This software is distributed under a Attribution-NonCommercial-ShareAlike 2.5
//  license. For more information, please see:
//      http://creativecommons.org/licenses/by-nc-sa/2.5/
//  For commercial use, please contact hello@humanized.com.
//---------------------------------------------------------------------------- 

//----------------------------------------------------------------------------
// 
//  TransparentMessage.js
//  Author: Aza Raskin <aza@humanized.com>
//   Extended by: Joshua Bloom <josh@jbloomdesign.com> 
//     The original TransparentMessage used MochiKit, this version uses the YUI.
//     MochiKit is still cool though. Python rocks. 
//
//    Get the JS for YUI from here.   http://developer.yahoo.com/yui/download/
//    You can also have Yahoo host the files for you. More Info here:
//     http://developer.yahoo.com/yui/articles/hosting/

/* SAMPLE CSS STYLING
.humanized_msg{
     position: absolute; left: 25%; width: 50%;
     color: #696969; background-color: #EAF9FF;
     font-size: 30pt; text-align: center; 
}

.humanized_msg span {
     font-size: 12pt;
}

.humanized_msg .round{
     border-left: solid 2px white; border-right: solid 2px white;
     font-size: 1px; height: 2px;
}

.humanized_msg p{ padding: .3em; display: inline;} */
    
//  This script depends on YUI(http://developer.yahoo.com/yui/) To use it, just
//  include it in the head of your html page and whenever you want to use a 
//  transparent message, use the alert() function.

//----------------------------------------------------------------------------
// Contants and Globals
//----------------------------------------------------------------------------

//Shortcut for Animation 
var $A = YAHOO.util.Anim;

// How transparent the message is
var OPACITY = .9;
// The id and class of the message
var MSG_CLASS_ID = "humanized_msg"
// How far, in pixels, is the message from the top of the screen
var TOP_OFFSET = 200;
// The div of class round is for making slightly "rounded" corners.
var FORMAT = "<div class='round'></div><p>%s</p><div class='round'></div>"
// Duration of the message appearance time
var APPEAR = 1.5;
// Duration of the message fade time
var FADETIME = 2.5;
// A global used for holding the current animation
var _msgAnimation = new $A(MSG_CLASS_ID, {}, FADETIME, YAHOO.util.Easing.easeOut);


// ----------------------------------------------------------------------------
// Transparent Message Manipulation
// ----------------------------------------------------------------------------
function hideMessage(){
    /* Hides the message via fade animation. It won't attempt to hide if animation is running, */
    opac = YAHOO.util.Dom.getStyle(MSG_CLASS_ID, 'opacity');
    function moveMsg() {
        YAHOO.util.Dom.setY(msg, -4000);   
    }
   if (opac >= OPACITY && ! _msgAnimation.isAnimated()) {
        var params = {opacity : { to : 0} };
        _msgAnimation = new $A(MSG_CLASS_ID, params, FADETIME, YAHOO.util.Easing.easeOut);
        _msgAnimation.onComplete.subscribe(moveMsg);
        _msgAnimation.animate();
    }
}

function showMessage( message ){
    /* Shows the transparent message. */
    msg = YAHOO.util.Dom.get(MSG_CLASS_ID);
    msg.innerHTML = FORMAT.replace( "%s", message );
    YAHOO.util.Dom.setY(msg, TOP_OFFSET);
    
    var params = {opacity : { from: 0, to : OPACITY} };
    _msgAnimation = new $A(MSG_CLASS_ID, params, APPEAR , YAHOO.util.Easing.easeOut);
    _msgAnimation.animate();
}

function alert( message ){
    /* An alias for showMessage */
    showMessage( message );
}

//----------------------------------------------------------------------------
// Initialization
//----------------------------------------------------------------------------

function initTransparentMessage(){
    /* Adds the message div to the page and sets up its event handlers. */
    msg = document.createElement('div');
    msg.id = MSG_CLASS_ID;
    msg.className = MSG_CLASS_ID;
    YAHOO.util.Dom.setStyle(msg, 'opacity', 0);
    document.body.appendChild(msg);

    var hideEvents = ["mousedown", "keydown", "mousemove"];
    for(i in hideEvents){
        YAHOO.util.Event.addListener(document, hideEvents[i], hideMessage, null, false);
    }
}
YAHOO.util.Event.addListener(window, 'load', initTransparentMessage);