[CB] Fading in/out PM box

[Peter]

When you have new private messages, this code will fade in a box to tell you. It will show in the top right hand corner.

Add everything into your global headers, it's a good idea to add this at the top. There is some CSS you can change to alter the colours of the box.

<style type="text/css">

.pm {
    position: absolute;
    right: 9px;
    top: 9px;
    width: 150px;
    border: 1px solid #BBBBBB;
    background-color: #F3F3F3;
    font-size: 11px;
    padding: 5px;
    text-align: center;
}

</style>

<div id="pm" style="display: none;" class="pm" style="filter: alpha(opacity=0); -moz-opacity: 0.0;">
   <a href="index.cgi?action=pm" id="pmlink"></a>
</div>

<script type="text/javascript">
<!--
/*
Fading in/out PM box

Created by Peter

This code cannot be reposted at anywhere other than SSDesigns or ProBoards, without permission.

This header must stay intact at all times.
*/

var iTimer;
var iDir = false;
var iStop = false;
var iCur = iCurMoz = 0;

var iTxt = "";
var pmLink = document.getElementById("pmlink");
var pmCell = document.getElementsByTagName("td").item(2).innerHTML;

function doFade(){
    if(iDir){
       iCur -= 3;
       iCurMoz -= 0.02;
    } else if(iStop == false){
       iCur += 3;
       iCurMoz += 0.02;
    }
    if(iCurMoz.toFixed(2) >= 0.95){
       clearTimeout(iTimer);
       iDir = true;
       var fTime = (document.all)? 2000 : 3000;
       setTimeout("doFade()", fTime);
    }
    var divPM = document.getElementById("pm");
    if(document.all){
       divPM.style.filter = "alpha(opacity=" + iCur + ")";
    } else {
       divPM.style.MozOpacity = iCurMoz;
    }
    iTimer = setTimeout("doFade()", 80);
}

if(pmCell.match(/you have <.+?>, (\d+) /i)){
    if(RegExp.$1 > 0){
       switch(RegExp.$1){
          case "1" :
             iTxt = "You have 1 new private<br /> message.";
             break;
          default :
             iTxt = "You have " + RegExp.$1 + " new<br /> private messages.";
       }
       pmLink.innerHTML = iTxt;
       pmLink.parentNode.style.display = "";
       doFade();
    }
}

//-->
</script>