Profile Selectable Username Colour

[iAlex]

This will create an input box in the profile of every user. When they modify their profile, they will be able to individually input a hex colour, which will be the colour of their display name.

Note: Their coloured name will only appear in their mini profile.

Preview: Click

Global Footer.

Cross Browser.

Open Source.

---

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

/*Profile Selectable Username Colour - By iAlex - Open Source*/

if(document.modifyForm){
     var iDisTr=document.modifyForm.name.parentNode.parentNode.parentNode;
     var iColourTr=iDisTr.cloneNode(true);
     iColourTr.childNodes[0].firstChild.innerHTML='Name Colour';
     iColourTr.childNodes[2].firstChild.innerHTML='If you wish to have your name displayed in a different colour, insert the hex code here.';
     iColourTr.childNodes[1].innerHTML='<input type="text" size="35" maxlength="6" id="iColourInp" />';
     iDisTr.parentNode.insertBefore(iColourTr, iDisTr.nextSibling);
     var iPersonal=document.modifyForm.personaltext;
     var iColourInp=document.getElementById('iColourInp');
     if(iPersonal.value.match(/\[C01:(.+?)\]/)){
           iColourInp.value=RegExp.$1;
           iPersonal.value=iPersonal.value.replace(/\[C01:(.+?)\]/g, '');
     }
     if(document.addEventListener){
           document.modifyForm.addEventListener('submit', iSaveColour, false);
     }
     else{
           document.modifyForm.attachEvent('onsubmit', iSaveColour);
     }
}
function iSaveColour(){
     var iColourInp=document.getElementById('iColourInp');
     if(iColourInp.value!=""){
           var iPersonal=document.modifyForm.personaltext;
           iPersonal.value=iPersonal.value+'[C01:'+iColourInp.value+']';
     }
}
if(location.href.match(/action=(display|viewprofile|(user)?recent|(calendar|pm)view|search2)/) || location.href.match(/index.cgi$/) && document.title.match(/Preview/) && document.postForm){
     var iTd=document.getElementsByTagName('td');
     var i=iTd.length;
     while(--i){
           if(iTd.item(i).width=="20%" && iTd.item(i).className.match(/windowbg(2)?/) && iTd.item(i).vAlign=="top" && iTd.item(i).innerHTML.match(/\[C01:(.+?)\]/)){
                 iTd.item(i).getElementsByTagName('b').item(0).firstChild.style.color=RegExp.$1;
                 iTd.item(i).innerHTML=iTd.item(i).innerHTML.replace(/\[C01:(.+?)\]/g, '');
           }
     }
}
//-->
</script>

---