vb.org Archive - Forum Display Enhancements - Rainbow (Multicolour) Username for Usergroups

Page 1 of 3

Show 40 post(s) from this thread on one page

vb.org Archive (https://vborg.vbsupport.ru/index.php)

- vBulletin 3.8 Add-ons (https://vborg.vbsupport.ru/forumdisplay.php?f=235)

- - Forum Display Enhancements - Rainbow (Multicolour) Username for Usergroups (https://vborg.vbsupport.ru/showthread.php?t=204838)

n.sinha.p

02-09-2009 10:00 PM

Rainbow (Multicolour) Username for Usergroups

1 Attachment(s)

Info:

Rainbow effect (Multicolour) for Usernames

This simple hack enables to display usernames for any usergroup in random multicolour (rainbow) effect.

Having searched for the same effect for my board unsuccessfully where most of the modifications were for BBCodes, I came up with my own and though of sharing.

Please note that since it is based on pure HTML and JavaScript and in no way uses any BBcode of VB function/hooks, this is compatible with all versions of vBulletin.

Installation:
Time Required: 2 minutes

1. FTP rainbow.js to clientscript directory on your server in ASCII mode

2. Open headinclude template and add the following code at any reasonable place:

Code:

<script type="text/javascript" src="$vboptions[bburl]/clientscript/rainbow.js"></script>

3. Open footer template and add the following code at the bottom:

Code:

<!-- rainbow text initialize -->

<script type="text/javascript"> 

<!--

rain();

//  End -->

</script>

<!-- rainbow text end -->

4. Open the Usergroup Manager throug ACP and edit the desired user group.

5. Put start tag as:

Code:

<span class="rainbow">

6. Change the end tag to be:

Code:

</span>

You're Done! Enjoy!!

Versions:
v1.0 - 10 February 2009
- Rainbow text effect for usernames

I may think of creating a plugin for this if I get time and people ask for it. But for now it is pretty simple and I would prefer having a hack rather than going for a plugin which would increase the load on your board's performance.

A Note: If you are using vbshout.. the effect will not show in the AJAX area. However, it will still display the usernames in the AJAX area and the rainbow effect will be available in shoutbox archive.

:up:Added & hidden bonus is that you can use this hack anywhere where you can use HTML code.. in almost any area you can think of!

kellyandmark04

02-10-2009 12:56 AM

Nice first installed!!

n.sinha.p

02-10-2009 01:02 AM

Many Thanks! If it is working for you.. would you mind posting your board's URL so that other's can see also?

dreads

02-10-2009 03:04 AM

Thats very unique and cool, thanks

you can use this also for forum categories

dai-kun

02-10-2009 04:21 AM

Hm... it would be cooler if it has a gradient animation effect :)

I like it but it looks too bright on my white background so can hardly see... :(

n.sinha.p

02-10-2009 04:26 AM

Quote:

Originally Posted by dreads (Post 1739335)

Thats very unique and cool, thanks

you can use this also for forum categories

You can use it anywhere if you can use HTML code. It's just about enclosing the required text into span! :)

Quote:

Originally Posted by dai-kun (Post 1739385)

Hm... it would be cooler if it has a gradient animation effect :)

I like it but it looks too bright on my white background so can hardly see... :(

No worries! I'll come up with the hack that you require shortly. :up:

dai-kun

02-10-2009 04:53 AM

^ Thanks, that'll be so awesome :)

RobbieZ

02-10-2009 07:09 AM

Looks pretty kewl :)

n.sinha.p

02-10-2009 10:34 AM

Quote:

Originally Posted by RobbieZ (Post 1739506)

Looks pretty kewl :)

Ah! Thank you! It's just that I came up for my board and thought of sharing! :D

michi123

02-11-2009 11:51 AM

nice mod dude! how can i change the colors to my liking?

DobieGillis?

02-11-2009 12:16 PM

are people enjoying this mod? Do the users have a choice if they want to use color or not?

bodaudinh

02-11-2009 03:05 PM

Replace this code for rainbow.js. ^^ It'll be cool...

Code:

/**

Rainbow Text

**/

function RGB2Color(r,g,b)

{

  return '#' + byte2Hex(r) + byte2Hex(g) + byte2Hex(b);

}



function byte2Hex(n)

{

  var nybHexString = "0123456789ABCDEF";

  return String(nybHexString.substr((n >> 4) & 0x0F,1)) + nybHexString.substr(n & 0x0F,1);

}





function colorText(str,phase)

{

        var result="";

  if (phase == undefined)

    phase = 0;

  center = 128;

  width = 127;

  frequency = Math.PI*2/str.length;

  for (var i = 0; i < str.length; ++i)

  {

     red   = Math.sin(frequency*i+2+phase) * width + center;

     green = Math.sin(frequency*i+0+phase) * width + center;

     blue  = Math.sin(frequency*i+4+phase) * width + center;

     result += ( '<font color="' + RGB2Color(red,green,blue) + '">' + str.substr(i,1) + '</font>');

  }

  return result;

}



function nickmausac(classname){

var txtValue = "";

        var b = getElementsByClassName(classname);



    for ( var i = 0; i < b.length; i++ ) {

                txtValue = colorText(b[i].innerHTML,1);

        b[i].innerHTML = txtValue;

    }

}

Use same as this mod...

Code:

<span class="rainbow">

add to footer//

Code:

<!-- rainbow text initialize -->

<script type="text/javascript"> 

<!--

nickmausac('rainbow');

//  End -->

</script>

<!-- rainbow text end -->

>> http://mytam.info/forum/member.php?u=50973
https://vborg.vbsupport.ru/external/2009/02/22.jpg

I have same as ideas by my sister, she asked me take her nickname has rainbow color... ^^

n.sinha.p

02-11-2009 03:24 PM

Quote:

Originally Posted by michi123 (Post 1740764)

nice mod dude! how can i change the colors to my liking?

Quote:

Originally Posted by DobieGillis? (Post 1740784)

are people enjoying this mod? Do the users have a choice if they want to use color or not?

Well! In essence this generates random colours.. however you can obviously change the colour selection if you are a pro in javascript. Otherwise if enough people request this, I will come up with a version where you can set your own desired colour! :)

As for whether people are enjoying this or not, it has been just second day that I posted the hack and now it has got 12 installations. Is that bad?? :)

n.sinha.p

02-11-2009 03:34 PM

Quote:

Originally Posted by bodaudinh (Post 1740939)

Replace this code for rainbow.js. ^^ It'll be cool...

I have same as ideas by my sister, she asked me take her nickname has rainbow color... ^^

Hi,

Thanks for this and this is equally good. However, if you talk about performance, which is really a concern for boards, it is about executing 1 function against 4, and in total 27 lines of code against 35. Which one do you think would be faster? :D

bodaudinh

02-11-2009 03:44 PM

In my code, I FIND by Classname (with the key=rainbow), it'll run ONCE time.

Code:

var b = getElementsByClassName(classname);

But in your code, you search by FOR LOOP by TagName with span. How long for ??? Do u thinking abt that ?

Code:

var aspans = document.getElementsByTagName('span');

        for (var i = 0; i < aspans.length; i++)

        {

have 4 functions, It does not run slowly... U can check it again :). Faster ???

DobieGillis?

02-11-2009 03:51 PM

installed, very nice. Let's see what the users think

DobieGillis?

02-11-2009 06:21 PM

uninstalled...it widened the screen for some users, they were not happy.

n.sinha.p

02-11-2009 11:48 PM

Quote:

Originally Posted by DobieGillis? (Post 1741122)

uninstalled...it widened the screen for some users, they were not happy.

Can you upload screenshot so that I can check and try to amend the functionality?

Nadeemjp

02-12-2009 03:24 AM

both codes are very fine. will do them over the week end.

DsmNikki

02-12-2009 05:41 AM

i installed it but its showing my name as undefined??? y is that? what am i doing wrong?

dai-kun

02-12-2009 07:11 AM

Quote:

Originally Posted by bodaudinh (Post 1740939)

Replace this code for rainbow.js. ^^ It'll be cool...

Code:

/**

Rainbow Text

**/

function RGB2Color(r,g,b)

{

  return '#' + byte2Hex(r) + byte2Hex(g) + byte2Hex(b);

}



function byte2Hex(n)

{

  var nybHexString = "0123456789ABCDEF";

  return String(nybHexString.substr((n >> 4) & 0x0F,1)) + nybHexString.substr(n & 0x0F,1);

}





function colorText(str,phase)

{

        var result="";

  if (phase == undefined)

    phase = 0;

  center = 128;

  width = 127;

  frequency = Math.PI*2/str.length;

  for (var i = 0; i < str.length; ++i)

  {

     red   = Math.sin(frequency*i+2+phase) * width + center;

     green = Math.sin(frequency*i+0+phase) * width + center;

     blue  = Math.sin(frequency*i+4+phase) * width + center;

     result += ( '<font color="' + RGB2Color(red,green,blue) + '">' + str.substr(i,1) + '</font>');

  }

  return result;

}



function nickmausac(classname){

var txtValue = "";

        var b = getElementsByClassName(classname);



    for ( var i = 0; i < b.length; i++ ) {

                txtValue = colorText(b[i].innerHTML,1);

        b[i].innerHTML = txtValue;

    }

}

Use same as this mod...

Code:

<span class="rainbow">

add to footer//

Code:

<!-- rainbow text initialize -->

<script type="text/javascript"> 

<!--

nickmausac('rainbow');

//  End -->

</script>

<!-- rainbow text end -->

I have same as ideas by my sister, she asked me take her nickname has rainbow color... ^^

Does not work ... I did your edits.

You forgot to include

Code:

function getElementsByClassName(classname, node) {



        if(!node) node = document.getElementsByTagName("body")[0];

                var a = [];

                var re = new RegExp('\\b' + classname + '\\b');

                var els = node.getElementsByTagName("*");

                for(var i=0,j=els.length; i<j; i++)

                        if(re.test(els[i].className)) a.push(els[i]);

        return a;

}

in your js file.

The rainbow color does not appear until everything on the page has been loaded..

bodaudinh

02-12-2009 11:30 AM

Quote:

Originally Posted by dai-kun (Post 1741586)

Does not work ... I did your edits.

You forgot to include

Code:

function getElementsByClassName(classname, node) {



        if(!node) node = document.getElementsByTagName("body")[0];

                var a = [];

                var re = new RegExp('\\b' + classname + '\\b');

                var els = node.getElementsByTagName("*");

                for(var i=0,j=els.length; i<j; i++)

                        if(re.test(els[i].className)) a.push(els[i]);

        return a;

}

in your js file.

The rainbow color does not appear until everything on the page has been loaded..

vbb using YUI, this function has been included.
http://yui.yahooapis.com/2.6.0/build...event.js?v=381

n.sinha.p

02-12-2009 12:16 PM

Quote:

Originally Posted by DsmNikki (Post 1741528)

i installed it but its showing my name as undefined??? y is that? what am i doing wrong?

Is your name showing otherwise? What is the markup for your usergroup? Can you post screenshots?

y2krazy

02-13-2009 06:51 PM

Ok, installed, but the names for the specific usergroup I'm applying this to shows up as "undefined" for each letter in the usergroup name and the actual member's name. The colors show up fine, so what would cause the letters to show up as "undefined"? Example:

"Administrators" turns into....

"undefinedundefinedundefinedundefinedundefinedunde finedundefinedundefinedundefinedundefinedundefined undefinedundefinedundefined"

Very frustrating! Any help? Thanks.

EDIT: I think it might be clashing with this addon:

https://vborg.vbsupport.ru/showthread.php?t=201385

~ Sean

n.sinha.p

02-14-2009 06:23 AM

Quote:

Originally Posted by y2krazy (Post 1743163)

Ok! This means the mod is not able to handle the names when embedded by multiple random span tags. Let me install the mod and see if I can come up with an enhancement to overcome this.

Thanks for letting me know.

SuperTaz

02-14-2009 06:42 AM

I have the undefined problem too.

Mecho

02-15-2009 09:40 PM

nice , is it possible to have certain colors in this random things as some of the colors would be not really readable in some styles ( dark / white ones ) ?

thanks

michi123

02-16-2009 10:16 AM

sumbody on my site got undefindet (in colors) aswell, and sumbody not! so i think it depense on their java version!

n.sinha.p

02-20-2009 04:29 AM

Quote:

Originally Posted by Mecho (Post 1745329)

nice , is it possible to have certain colors in this random things as some of the colors would be not really readable in some styles ( dark / white ones ) ?

thanks

Thanks for your feedback.

It is quite possible and very soon I will be uploading the enhancement.

aakhan136

02-20-2009 06:56 PM

thanks

Mellymonster

02-24-2009 03:36 AM

Quote:

Originally Posted by bodaudinh (Post 1740939)

Replace this code for rainbow.js. ^^ It'll be cool...

Code:

/**

Rainbow Text

**/

function RGB2Color(r,g,b)

{

  return '#' + byte2Hex(r) + byte2Hex(g) + byte2Hex(b);

}



function byte2Hex(n)

{

  var nybHexString = "0123456789ABCDEF";

  return String(nybHexString.substr((n >> 4) & 0x0F,1)) + nybHexString.substr(n & 0x0F,1);

}





function colorText(str,phase)

{

        var result="";

  if (phase == undefined)

    phase = 0;

  center = 128;

  width = 127;

  frequency = Math.PI*2/str.length;

  for (var i = 0; i < str.length; ++i)

  {

     red   = Math.sin(frequency*i+2+phase) * width + center;

     green = Math.sin(frequency*i+0+phase) * width + center;

     blue  = Math.sin(frequency*i+4+phase) * width + center;

     result += ( '<font color="' + RGB2Color(red,green,blue) + '">' + str.substr(i,1) + '</font>');

  }

  return result;

}



function nickmausac(classname){

var txtValue = "";

        var b = getElementsByClassName(classname);



    for ( var i = 0; i < b.length; i++ ) {

                txtValue = colorText(b[i].innerHTML,1);

        b[i].innerHTML = txtValue;

    }

}

Use same as this mod...

Code:

<span class="rainbow">

add to footer//

Code:

<!-- rainbow text initialize -->

<script type="text/javascript"> 

<!--

nickmausac('rainbow');

//  End -->

</script>

<!-- rainbow text end -->

>> http://mytam.info/forum/member.php?u=50973
https://vborg.vbsupport.ru/external/2009/02/22.jpg

I have same as ideas by my sister, she asked me take her nickname has rainbow color... ^^

I would love to use this, but its not working correctly.

Mellymonster

02-25-2009 12:38 AM

Ok I got the above to work, but now I'm having a problem with some of my members names does not catch it... Any idea what can be causing this?

n.sinha.p

02-25-2009 06:00 AM

Quote:

Originally Posted by Mellymonster (Post 1753789)

Ok I got the above to work, but now I'm having a problem with some of my members names does not catch it... Any idea what can be causing this?

Did you use the js file I supplied or the one supplied by bodaudinh? If it is the code given by Bodaudinh, then sorry I do not own the code and hence would not be able to support. Try sending a PM to him. If it is about the code that I've posted, let me know the exact problem and I'll try to resolve it.

celikforum

02-25-2009 11:42 AM

1 Attachment(s)

my problemm

DannyC55

02-26-2009 01:44 AM

Users using IE are saying it doesn't work for them. It comes up undefined....
Please sort this.

Neptun

02-26-2009 05:16 PM

i have a problem with this hack

i installed everything like in the description ... but aber i change the tag in the usergroup

-> instead of the username is there "undefinedundefinedundefinedundefinedundefined "

what is going wrong or where is the probleme ?!

in IE i have the big problem - in firefox it works fine - what i have done wrong ?! :((((

DobieGillis?

02-26-2009 05:24 PM

Quote:

Originally Posted by YantieDan (Post 1754831)

Users using IE are saying it doesn't work for them. It comes up undefined....
Please sort this.

it's an IE killer....

DobieGillis?

02-26-2009 05:25 PM

Quote:

Originally Posted by Neptun (Post 1755396)

nothing, it just doesn't work with IE...I uninstalled it

Neptun

02-26-2009 05:41 PM

has the coder no idea to fix the problem ?!

n.sinha.p

02-28-2009 12:49 PM

This is not compatible with usergroup legend hack.. I am working on making it a full blown mod so that it would change all the required templates.

All times are GMT. The time now is 06:14 PM.

Page 1 of 3

Show 40 post(s) from this thread on one page

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.01531 seconds Memory Usage 1,857KB Queries Executed 10 (?)
More Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (17)bbcode_code_printable (16)bbcode_quote_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)pagenav (1)pagenav_curpage (2)pagenav_pagelink (1)post_thanks_navbar_search (1)printthread (40)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete printthread_start pagenav_page pagenav_complete bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: