[CB] Logo Image beside Display Names

[Todge]

This should give you the option to have a logo/image beside your display name, Like team or group logos etc.. You should get an extra option in the profile page wwhere you can select images from a drop down menu.

Put it in your Global Footer.

<script type="text/javascript">
<!--
/*
Logo Image beside Display Names..
by Todge
Please leave this header intact
*/

var logoURL = new Array();

// Edit below...

var standardLogo = 'URL OF DEFAULT IMAGE';

logoURL[0] = 'URL OF TEAM LOGO|TEAM NAME';
logoURL[1] = 'URL OF TEAM LOGO|TEAM NAME';
logoURL[2] = 'URL OF TEAM LOGO|TEAM NAME';


// Edit above...



// Add logo dropdown option..

if(document.modifyForm)
{
var logo = -1;
var uName = document.modifyForm.name.value;
if(uName.match(/\[L\d+\]/))
{
logo = parseInt(uName.split(/\[L/)[1]);
document.modifyForm.name.value = uName.split('[L')[0];
}

var TR = document.createElement('TR');
var TD1 = document.createElement('TD');
var TD2 = document.createElement('TD');
TD2.vAlign = 'top';
var TD3 = document.createElement('TD');

TD1.vAlign = 'top';
TD2.vAlign = 'top';
TD3.vAlign = 'top';
TR.appendChild(TD1);
TR.appendChild(TD2);
TR.appendChild(TD3);

if(document.modifyForm.gender)
{
var genderRow = document.modifyForm.gender.parentNode.parentNode.parentNode;
}
else
{
var genderRow = document.modifyForm.location.parentNode.parentNode.parentNode;
}

genderRow.parentNode.insertBefore(TR,genderRow);

TD1.innerHTML = '<font size="-1">Team Logo:</font>';
TD3.innerHTML = '<font size="-2">Please select your team logo from the drop down menu if you have one.</font>';

var teamLogo = document.createElement('select');
teamLogo.name = 'teamlogo';
var tlOpt = document.createElement('option');
with(tlOpt){innerHTML = 'Team Logo'; value='';}
teamLogo.appendChild(tlOpt);
TD2.appendChild(teamLogo);

TD2.appendChild(document.createTextNode(' '));

var logoImage = document.createElement('img');
with(logoImage){src = standardLogo; id='logoIcon'; border='0';}
TD2.appendChild(logoImage);

var opt = document.createElement('option');
opt.value = '';
opt.innerHTML = '----------';
teamLogo.appendChild(opt);

for(l=0; l<logoURL.length; l++)
{
var opt = document.createElement('option');
opt.value = l;
opt.innerHTML = logoURL[l].split('|')[1];
if(logo == l)
{
teamLogo.selectedIndex = logo+2;
logoImage.src = logoURL[l].split('|')[0];
}
teamLogo.appendChild(opt);
}

teamLogo.onchange = function()
{
logo = this.selectedIndex-2;
if(logo<0)
{
logoImage.src = standardLogo;
}
else
{
logoImage.src = logoURL[logo].split('|')[0];
}}

function addTeamLogo()
{
if(logo > -1)
{
document.modifyForm.name.value += '[L'+logo+']';
}
return;
}

if(window.addEventListener)
{
document.modifyForm.addEventListener('submit', addTeamLogo, false);
}
else if(window.attachEvent)
{
document.modifyForm.attachEvent('onsubmit', addTeamLogo);
}}

// Add logo image to display names...

var DN = document.links;

for(d=0; d<DN.length; d++)
{
if(DN[d].href.match(/tion=viewpro/) && DN[d].innerHTML.match(/\[L\d/))
{
var l = parseInt(DN[d].innerHTML.split('[L')[1]);
var li = document.createElement('img');
with(li){src=logoURL[l].split('|')[0]; border='0'; title='Member of '+logoURL[l].split('|')[1];}
DN[d].appendChild(document.createTextNode(' '));
DN[d].appendChild(li);
DN[d].innerHTML = DN[d].innerHTML.replace(/\[L\d+\]/,'');
}}

if(!pb_action.match(/(headersfooters|modifyprofile)/))
{
var font = document.getElementsByTagName('font');
for(f=0; f<font.length; f++)
{
if(font[f].innerHTML.match(/\[L\d+\]/))
{
font[f].innerHTML = font[f].innerHTML.replace(/\[L\d+\]/g,'');
}}}
// -->
</script>

You need to edit this part of the code, at the top..

var standardLogo = 'URL OF DEFAULT IMAGE';

logoURL[0] = 'URL OF TEAM LOGO|TEAM NAME';
logoURL[1] = 'URL OF TEAM LOGO|TEAM NAME';
logoURL[2] = 'URL OF TEAM LOGO|TEAM NAME';

Red is the URL of the default image. That's the image that will be displayed in the by the drop-down if no team is selected.

Blue is the team URLs.

Green is the team names.

Continue with logoURL[3], logoURL[4] etc., as required.