Personal Mood Icons

[iAlex]

Okies, well, this is a better version of my old personal mood icons code. What it will do is create a drop down menu in your profile, which allows all members to select their own personal mood icon. This mood icon will then be displayed in their mini profile.

Click here for Preview 1
Click here for Preview 2

Global Footers.

Cross Browser.

Open Source.

---

<script type="text/javascript">
<!--

/*Personal Mood Icons - By iAlex - Open Source*/

var iMoodList=[
["http://s3.images.proboards.com/smiley.gif", "Smiley"],
["http://s3.images.proboards.com/wink.gif", "Wink"],
["http://s3.images.proboards.com/cheesy.gif", "Cheesy"],
["http://s3.images.proboards.com/grin.gif", "Grin"],
["http://s3.images.proboards.com/angry.gif", "Angry"],
["http://s3.images.proboards.com/sad.gif", "Sad"],
["http://s3.images.proboards.com/shocked.gif", "Shocked"],
["http://s3.images.proboards.com/cool.gif", "Cool"],
["http://s3.images.proboards.com/huh.gif", "Huh"],
["http://s3.images.proboards.com/rolleyes.gif", "Roll Eyes"],
["http://s3.images.proboards.com/tongue.gif", "Tongue"],
["http://s3.images.proboards.com/embarassed.gif", "Embarrassed"],
["http://s3.images.proboards.com/lipsrsealed.gif", "Lips Sealed"],
["http://s3.images.proboards.com/undecided.gif", "Undecided"],
["http://s3.images.proboards.com/kiss.gif", "Kiss"],
["http://s3.images.proboards.com/cry.gif", "Cry"] // No comma on the last line
];

if(document.modifyForm){
     var iMoodTable = document.modifyForm.personaltext.parentNode.parentNode.parentNode.parentNode.parentNode;
     var iMoodDiv=document.createElement('div');
     iMoodDiv.innerHTML='<table cellpadding="2" cellspacing="2" border="0"><tr><td width="154" valign="top"><font size="-1">Mood:</font></td><td width="245"><font size="-1" id="iMoodFont"></font><div id="iMoodPreview"></div></td><td width="245"><font size="-2">If you wish to have a personal mood icon displayed in your mini profile, then select one on the left.</font></td></tr></table>';
     iMoodTable.parentNode.insertBefore(iMoodDiv, iMoodTable);
     var iMoodFont=document.getElementById('iMoodFont');
     var iMoodSelect=document.createElement('select');
     var iMoodText=document.modifyForm.personaltext;
     iMoodSelect.options[0]=new Option('None');
     for(i=0;i<iMoodList.length;i++){
           iMoodSelect.options[iMoodSelect.length]=new Option(iMoodList[1]);
     }
     if(iMoodText.value.match(/\[Mo0:(\d+)\]/)){
           iMoodSelect.selectedIndex=RegExp.$1;
           iMoodText.value=iMoodText.value.replace(/\[Mo0:(\d+)\]/g, '');
     }
     iMoodFont.appendChild(iMoodSelect);
     if(document.addEventListener){
           document.modifyForm.addEventListener('submit', function(){
                 iMoodText.value=iMoodText.value+'[Mo0:'+iMoodSelect.selectedIndex+']';
           }, false);
     }
     else{
           document.modifyForm.attachEvent('onsubmit', function(){
                 iMoodText.value=iMoodText.value+'[Mo0:'+iMoodSelect.selectedIndex+']';
           });
     }
     var iMoodPreview=document.getElementById('iMoodPreview');
     function iMoodFunction(){
           iMoodPreview.innerHTML='';
           if(iMoodSelect.selectedIndex>0){
                 var iMoodNum=iMoodSelect.selectedIndex-1;
                 iMoodPreview.innerHTML='<b'+'r /><img src="'+iMoodList[iMoodNum][0]+'" title="'+iMoodList[iMoodNum][1]+'" alt="'+iMoodList[iMoodNum][1]+'" />';
           }
     }
     iMoodFunction();
     iMoodSelect.onchange=function(){
           iMoodFunction();
     }
     iMoodSelect.onkeyup=function(){
           iMoodFunction();
     }
}
if(location.href.match(/action=(display|viewprofile|(user)?recent|calendarview|search2|pmview)/) || location.href.match(/index.cgi$/) && document.title.match(/Preview/) && document.postForm){
     var iTd=document.getElementsByTagName('td');
     for(i=0;i<iTd.length;i++){
         
           if(iTd.item(i).width=="20%" && iTd.item(i).className.match(/windowbg(2)?/) && iTd.item(i).vAlign=="top" && iTd.item(i).innerHTML.match(/member is/) && iTd.item(i).innerHTML.match(/\[Mo0:(\d+)\]/)){
                 if(RegExp.$1>0){
                       var iMoodDisplay=document.createElement('div');
                       iMoodDisplay.innerHTML='Mood: <img src="'+iMoodList[RegExp.$1-1][0]+'" title="'+iMoodList[RegExp.$1-1][1]+'" alt="'+iMoodList[RegExp.$1-1][1]+'" />';
                       iTd.item(i).appendChild(iMoodDisplay);
                 }
                 iTd.item(i).innerHTML=iTd.item(i).innerHTML.replace(/\[Mo0:(\d+)\]/g, '');
           }
     }
}

//-->
</script>

---

If you want to change the image URL of the smilies, or the names that appear in the drop down menu, then you simply need to edit these lines:

["Smilie URL", "Smilie Name"],

You can add as many smilies as you want, just continue to add a line similar to the one just above. If you have any troubles editing, then do not hesitate to ask.whil