<!--
<!-- #################### Source Code Goes Here ###########################  -->

/**//*  
**    ======================================================================
**    Code Description ：A MSNLIKE MESSAGEBOX
**    Author           : 5@M Chen of Net-engine 
**    Coding Date      ：2006-3-27  
**    Refactoring Date : 2006-3-31
**    ----------------------------------------------------------------------------------------
**    Usage :
**        var msgArray = new Array("aaaaaaaa","bbbbbbbb","cccccccc");
**        new CLASS_MSNLIKE_MESSAGEBOX(msgArray).start();
**    ----------------------------------------------------------------------------------------
**    ======================================================================
**/  


/**//* 
 *    Initialize
 *
 */
CLASS_MSNLIKE_MESSAGEBOX.prototype.initialize = function(){
    /*
     * counter used to keep the box at the top for a while
     */
    this.counter = 0; 
    
    /*
     * the status constants of the box
     */
    this.MSGBOX_STATUS_NEW                  = 0;
    this.MSGBOX_STATUS_RISING               = 1; 
    this.MSGBOX_STATUS_ATTOP                = 2;
    this.MSGBOX_STATUS_SINKING              = 3; 
    this.MSGBOX_STATUS_PAUSED_WHILE_RISING  = 4;
    this.MSGBOX_STATUS_PAUSED_WHILE_SINKING = 5;
    this.MSGBOX_STATUS_CLOSED               = 6;
    
    //No more than 3 messages for now
    this.MAX_MSG_COUNT = 3;

    //Makes MAX_MSG_COUNT null message boxes:
    var me = this;
 
    for(var j=0;j<this.MAX_MSG_COUNT;j++){
        this.makeMessageBox(eval("\"MSNLIKE_MSGBOX_ID_\"+j"),"");
        var msgId = "MSNLIKE_MSGBOX_ID_"+j;
        
        //========================================Begin : registers listeners==========================================
        //Damn it!They're case-sensitive!
        //document.getElementById(eval("msgId")).onMouseOver = function(){me.pause();}
        //document.getElementById(eval("msgId")).onMouseOut  = function(){me.letGo();}
        document.getElementById(eval("msgId")).onmouseover = function(){me.pause();}
        document.getElementById(eval("msgId")).onmouseout  = function(){me.letGo();}  
        document.getElementById(eval("\"CLOSE_\"+msgId")).onclick  = function(){me.close(this.id.substring(6));};      
        //========================================End : registers listeners============================================     
    }   

}

/**//* 
 *    Message loader
 *    @param messages : the message array
 */
CLASS_MSNLIKE_MESSAGEBOX.prototype.loadMessages = function(messages){
    this.messages = new Array();
    for(var i=0;i<messages.length && i<this.MAX_MSG_COUNT ;i++){
    
        //Registers the message boxes(no more than 3)
        this.messages[i] = "MSNLIKE_MSGBOX_ID_"+i;
        //Writes 'em out
        this.writeMessage(eval("\"MSNLIKE_MSGBOX_ID_\"+i+\"_MsgArea\""),messages[i]);
    }
    this.messagesCount = messages.length>=this.MAX_MSG_COUNT?this.MAX_MSG_COUNT:messages.length;
    this.status = this.MSGBOX_STATUS_NEW;
}

/**//*  
 *    MsgBox constructor 
 *    @param messages : the message array
 */ 
function CLASS_MSNLIKE_MESSAGEBOX(messages){
    this.initialize(); 
    this.loadMessages(messages);
}

/**//*  
 *    starts it up
 *   
 */ 
CLASS_MSNLIKE_MESSAGEBOX.prototype.start = function(){
        if(document.readyState != "complete"){
            var me = this;
            this.objTimer = window.setTimeout(function(){me.start();},5);
        }else{
            if(this.objTimer){
                window.clearTimeout(this.objTimer);
            }
            try{        
                this.divHeight = parseInt(document.getElementById("MSNLIKE_MSGBOX_ID_0").offsetHeight,10) 
                this.divWidth  = parseInt(document.getElementById("MSNLIKE_MSGBOX_ID_0").offsetWidth,10) 
                this.docWidth  = document.body.clientWidth; 
                this.docHeight = document.body.clientHeight;     
    
                //Puts the boxes in the right places:
                for(var i=0;i<this.messagesCount;i++){
                    document.getElementById(this.messages[i]).style.top = parseInt(document.body.scrollTop,10) + this.docHeight + i*this.divHeight; 
                    document.getElementById(this.messages[i]).style.left = parseInt(document.body.scrollLeft,10) + this.docWidth - this.divWidth; 
                    document.getElementById(this.messages[i]).style.visibility = "visible";
                }
                
                //alert("Gonna rise up");
                this.status = this.MSGBOX_STATUS_RISING;
            
                var me = this;

                if(this.objTimer){
                    window.clearInterval(this.objTimer);
                }
                
                //this.objTimer = window.setInterval(me.rise(),10);
                this.objTimer = window.setInterval(function(){me.rise();},10);

            }catch(e){alert("Error occurred.");} 
                        
        }         
                 
}


CLASS_MSNLIKE_MESSAGEBOX.prototype.getStatus = function(){
    return this.status;
}
CLASS_MSNLIKE_MESSAGEBOX.prototype.setStatus = function(status){
    this.status = status;
}

CLASS_MSNLIKE_MESSAGEBOX.prototype.rise = function(){ 

    //alert("Rise up,for the sake of God.");
    try{ 
        for(var i=0;i<this.messagesCount;i++){
            this.divTop = parseInt(document.getElementById(this.messages[i]).style.top,10); 
            document.getElementById(this.messages[i]).style.top = this.divTop -2//- 1 
        }
        
        if(parseInt(document.getElementById(this.messages[0]).style.top,10) <= (this.docHeight - this.divHeight*this.messagesCount + parseInt(document.body.scrollTop,10))){ 
            var me = this;
            this.status = this.MSGBOX_STATUS_ATTOP;
            if(this.objTimer){
                window.clearInterval(this.objTimer);
            }
            this.objTimer = window.setInterval(function(){me.stayThere();},1);
        }
    
    }catch(e){} 
    
}   
    
/**//*  
 *    Lets the MSGBOX stay there for a while  
 */ 
CLASS_MSNLIKE_MESSAGEBOX.prototype.stayThere = function(){ 
    
    this.counter += 1;
    //Caution : never make it too big nor too small . 400 is just fine.
    if(this.counter > 400) {
        var me = this;
        this.status = this.MSGBOX_STATUS_SINKING;
        if(this.objTimer){
            window.clearInterval(this.objTimer);
        }
        this.objTimer = window.setInterval(function(){me.sink();},10);
    }

}

CLASS_MSNLIKE_MESSAGEBOX.prototype.sink = function(){ 

    try{ 
        //Resets the counter:
        this.counter = 1;
        
        this.divTop = parseInt(document.getElementById(this.messages[0]).style.top,10)
        
        if(this.divTop<=this.docHeight + parseInt(document.body.scrollTop,10)){//Go on sinkin'
            for(var i=0;i<this.messagesCount;i++){
                this.divTop = parseInt(document.getElementById(this.messages[i]).style.top,10)
                document.getElementById(this.messages[i]).style.top = this.divTop + 2//+1;
            }
        
        }else{
            if(this.objTimer){
                window.clearInterval(this.objTimer);
            }
            //Lets 'em disappear:
            this.closeAll();
        }       
    } catch(e){} 

} 

CLASS_MSNLIKE_MESSAGEBOX.prototype.closeAll = function(){ 

    for(var i=0;i<this.messagesCount;i++){
        this.close(this.messages[i]);
    }
    this.destroyAllMessageBoxes();
    this.status = this.MSGBOX_STATUS_CLOSED;
    
}

CLASS_MSNLIKE_MESSAGEBOX.prototype.destroyAllMessageBoxes = function(){
    for(var i = 0;i<this.messagesCount;i++){
        document.body.removeChild(document.getElementById(eval("\"this.messages[\"+i+\"]\"")));
    }
}

CLASS_MSNLIKE_MESSAGEBOX.prototype.close = function(msgId){
    //alert("msgId = "+msgId);
    document.getElementById(msgId).style.visibility='hidden'; 
}

CLASS_MSNLIKE_MESSAGEBOX.prototype.pause = function(){

    if(this.getStatus() == this.MSGBOX_STATUS_ATTOP || this.getStatus() == this.MSGBOX_STATUS_PAUSED_WHILE_RISING || this.getStatus() == this.MSGBOX_STATUS_PAUSED_WHILE_SINKING){
        return;
    }else{
        if(this.getStatus() == this.MSGBOX_STATUS_RISING){
            this.status = this.MSGBOX_STATUS_PAUSED_WHILE_RISING;
        }
        if(this.getStatus() == this.MSGBOX_STATUS_SINKING){
            this.status = this.MSGBOX_STATUS_PAUSED_WHILE_SINKING;
        }
        if(this.objTimer){window.clearInterval(this.objTimer)}
    }
}

CLASS_MSNLIKE_MESSAGEBOX.prototype.letGo = function(){

    var me = this;
    if(this.getStatus() == this.MSGBOX_STATUS_PAUSED_WHILE_RISING){
        this.status = this.MSGBOX_STATUS_RISING;
        if(this.objTimer){window.clearInterval(this.objTimer);}
        this.objTimer = window.setInterval(function(){me.rise();},10); 
    }
    if(this.getStatus() == this.MSGBOX_STATUS_PAUSED_WHILE_SINKING){
        this.status = this.MSGBOX_STATUS_SINKING;
        if(this.objTimer){window.clearInterval(this.objTimer);}
        this.objTimer = window.setInterval(function(){me.sink();},10); 
    }
}

CLASS_MSNLIKE_MESSAGEBOX.prototype.makeMessageBox = function(msgId,message){

    //Bug fixed : avoid the "loading picture ... " problem.
    
    //document.write("<div id="+msgId+" style=\"BORDER-RIGHT: #455690 1px solid; BORDER-TOP: #a6b4cf 1px solid; Z-INDEX:0; LEFT: 0px; VISIBILITY: hidden; BORDER-LEFT: #a6b4cf 1px solid; WIDTH: 180px; BORDER-BOTTOM: #455690 1px solid; POSITION: absolute; TOP: 0px; HEIGHT: 116px; BACKGROUND-COLOR: #c9d3f3\" style='cursor:hand;'>");
    //
    //document.write("<table style=\"BORDER-TOP: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid\" cellspacing=0 cellpadding=0 width=\"100%\" bgcolor=#E7EFF7 border=0>");
    //document.write("<tbody>");
    //document.write("<tr>");
    //document.write("<td style=\"FONT-SIZE: 12px; BACKGROUND-IMAGE: url(msgTopBg.gif); COLOR: #0f2c8c\" width=30 height=24></td>");
    //document.write("<td width=\"100%\" valign=center style=\"FONT-WEIGHT: normal; FONT-SIZE: 14px; BACKGROUND-IMAGE: url(msgTopBg.gif); COLOR: #0855AD; PADDING-TOP: 0px;PADDING-left: 0px\">"); 
    //
    //document.write("<div title='作者  : 5@M Chen of Shanghai Net-engine&reg;\nE-mail : forrest1114@hotmail.com\nblog    : http://spaces.msn.com/5am4ever/blog'><image src='logo.jpg' onClick='new function(){close(\""+msgId+"\")}' title='关闭'></div></td>");
    //
    ////document.write("<td style=\"BACKGROUND-IMAGE: url(msgTopBg.gif); PADDING-TOP: 2px;PADDING-right:2px\" valign=center align=right //width=19><span title=关闭 style=\"CURSOR: hand;color:#FF8A00;font-size:12px;font-weight:bold;margin-right:4px;\" //onClick=close("+msgId+") >×</span>"); 
    ////document.write("<td style=\"BACKGROUND-IMAGE: url(msgTopBg.gif); PADDING-TOP: 0px;PADDING-right:0px\" valign=center align=right width=1><span title=关闭 style=\"CURSOR: hand;color:#FF8A00;font-size:12px;font-weight:bold;margin-right:4px;\" onClick='new function(){close(\""+msgId+"\")}' ></span>"); 
    ////document.write("</td>");
    //document.write("</tr>");
    //document.write("<tr>"); 
    //document.write("<td style=\"PADDING-RIGHT: 1px; BACKGROUND-IMAGE: url(/oblog/1msgBottomBg.jpg); PADDING-BOTTOM: 1px\" colspan=3 height=90 align=\"center\">"); 
    //document.write("<div id="+msgId+"_MsgArea style=\"BORDER-RIGHT: #9C9E9C 1px solid; PADDING-RIGHT: 13px; BORDER-TOP: #9C9E9C 1px solid; PADDING-LEFT: 13px; FONT-SIZE: 12px; PADDING-BOTTOM: 13px; BORDER-LEFT: #9C9E9C 1px solid; WIDTH: 95%; COLOR: #1f336b; PADDING-TOP: 18px; BORDER-BOTTOM: #9C9E9C 1px solid; HEIGHT: 100%;background-color:white\">");
    //
    //<!-- Begin : Put your message here -->
    //document.write(message);
    //<!-- End   : Put your message here -->
    //
    //document.write("</div></td>");
    //document.write("</tr>");
    //document.write("<tr>");
    //document.write("<td height=3 colspan=3 ></td>");
    //document.write("</tr>");
    //document.write("</tbody>");
    //document.write("</table>");
    //document.write("</div>");  
    
    
    
    var mw = document.createElement("div");
    mw.id = msgId;
    mw.style.borderLeft = "#a6b4cf 1px solid";
    mw.style.borderRight = "#455690 1px solid";
    mw.style.borderTop = "#a6b4cf 1px solid";
    mw.style.borderBottom = "#455690 1px solid";
    mw.style.zIndex = "0";
    mw.style.left = "0px";
    mw.style.top = "0px";
    mw.style.width = "180px"; 
    mw.style.height = "116px";
    mw.style.backgroundcolor = "#c9d3f3";
    mw.style.position = "absolute"; 
    mw.style.visibility = "hidden";
    mw.style.cursor = "hand";
    
    var ostr = ""; 
    ostr += "<table style=\"BORDER-TOP: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid\" cellspacing=0 cellpadding=0 width=\"100%\" bgcolor=#E7EFF7 border=0>";
    ostr += "<tbody>";
    ostr += "<tr>"
    ostr += "<td style=\"FONT-SIZE: 12px; BACKGROUND-IMAGE: url(msgTopBg.gif); COLOR: #0f2c8c\" width=30 height=24>";
    ostr += "</td>";
    ostr += "<td width=\"100%\" valign=center style=\"FONT-WEIGHT: normal; FONT-SIZE: 14px; BACKGROUND-IMAGE: url(msgTopBg.gif); COLOR: #0855AD; PADDING-TOP: 0px;PADDING-left: 0px\" align='right'>";
    ostr += "<div>";
    ostr += "<span title='信息栏'>信息提示栏&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>";
    ostr += "<span id=CLOSE_"+msgId+" style='font-family:wingdings;' title='关闭'>x</span>";
    ostr += "</div></td>";
    ostr += "</tr>"
    ostr += "<tr>" 
    ostr += "<td style=\"PADDING-RIGHT: 1px; BACKGROUND-IMAGE: url(/oblog/1msgBottomBg.jpg); PADDING-BOTTOM: 1px\" colspan=3 height=90 align=\"center\">" 
    ostr += "<div id="+msgId+"_MsgArea style=\"BORDER-RIGHT: #9C9E9C 1px solid; PADDING-RIGHT: 13px; BORDER-TOP: #9C9E9C 1px solid; PADDING-LEFT: 13px; FONT-SIZE: 12px; PADDING-BOTTOM: 13px; BORDER-LEFT: #9C9E9C 1px solid; WIDTH: 95%; COLOR: #1f336b; PADDING-TOP: 18px; BORDER-BOTTOM: #9C9E9C 1px solid; HEIGHT: 100%;background-color:white\">"
    
    ostr += message;
    
    ostr += "</div></td>"
    ostr += "</tr>"
    ostr += "<tr>"
    ostr += "<td height=3 colspan=3 ></td>"
    ostr += "</tr>"
    ostr += "</tbody>"
    ostr += "</table>"
    
    mw.innerHTML = ostr;
    
    document.body.appendChild(mw);
    
}


CLASS_MSNLIKE_MESSAGEBOX.prototype.writeMessage = function(msgAreaId,message){
    document.getElementById(msgAreaId).innerHTML = message;
}

//window.onload = function(){
    //var msgArray = new Array("111111111","222222222","333333333");
    //new CLASS_MSNLIKE_MESSAGEBOX(msgArray).start();
//}

window.onresize = function(){
    try{ 
        docWidth = document.body.clientWidth; 
        docHeight = document.body.clientHeight;  

        for(var i=0;i<oMsgBox.messagesCount;i++){
            divHeight = parseInt(document.getElementById(oMsgBox.messages[i]).offsetHeight,10) 
            divWidth  = parseInt(document.getElementById(oMsgBox.messages[i]).offsetWidth,10) 

            document.getElementById(oMsgBox.messages[i]).style.top  = docHeight - divHeight*(oMsgBox.messagesCount-i) + parseInt(document.body.scrollTop,10) 
            document.getElementById(oMsgBox.messages[i]).style.left = docWidth - divWidth + parseInt(document.body.scrollLeft,10) 
        }

    } 
    catch(e){} 
} 

window.onerror = function(){
    return true;
} 
  
  
  
 

