We hope you enjoy your visit.

You're currently viewing our forum as a guest. This means you are limited to certain areas of the board and there are some features you can't use. If you join our community, you'll be able to access member-only sections, and use many member-only features such as customizing your profile, sending personal messages, and voting in polls. Registration is simple, fast, and completely free.


Join our community!


If you're already a member please log in to your account to access all of our features:

Username:   Password:
Add Reply
Character Colors v1; Hayate17
Topic Started: Jan 3 2016, 05:15 PM (1,138 Views)
Hayate17
Member
[ * ]
Code Name: Character Colors v2

What the code does: Allows the use of Custom Profile Fields for users to store customized hex codes, etc, then has this as a dropdown when posting... pretty useful for RP sites where role-players denote their character's dialogue via colored text.

How to use the code: Delete the variables/options or add more to match however many fields you wish to allow for. Field Settings don't matter, just make sure the field name matches the var colN (n being number.)

How to install the code:
Place Below the Board


Extra notes: Special thanks to Austin :)

OLD - Version 1
Edited by Hayate17, Feb 27 2016, 02:16 PM.
Offline Profile Quote Post Goto Top
 
Quozzo
Member Avatar
By the blood of Sanguinius!
[ *  *  *  *  * ]
Hayate17
Jan 3 2016, 05:15 PM
Extra notes: You're going to want to add some css to all your themes to set #colordata to display: none;
Just add it to an inline style
Offline Profile Quote Post Goto Top
 
Austin W
Member Avatar
Member
[ * ]
Submitting a pull request.

Rather than requiring a hard-coded board URL, here's a version that automagically gets the board URL. It also uses .get rather than .load, which *should* prevent endless nested loads. Basically, it works like this:

IF posting==true then
get profile
set colors
create dropdown
endif

Code:
 
<script>//Custom Character Colors v1
//Not super efficient, could be done better with arrays and loops, but I'm lazy... maybe for v2 - Hayate17
var col1 = "Color 1";
var col2 = "Color 2";
var col3 = "Color 3";
var col4 = "Color 4";
var col5 = "Color 5";
var profile_link = document.getElementById('top_info').getElementsByTagName('a')[0].href;

jQuery(function() {
if (document.URL.indexOf("post") > -1){
$( "#wrap" ).append( "<div id='colordata'></div>" );
jQuery.get(profile_link+"?force_ads",function(data){
var col1r = jQuery(data).find('td:contains(' + col1 + ')');
var col2r = jQuery(data).find('td:contains(' + col2 + ')');
var col3r = jQuery(data).find('td:contains(' + col3 + ')');
var col4r = jQuery(data).find('td:contains(' + col4 + ')');
var col5r = jQuery(data).find('td:contains(' + col5 + ')');
var col1v = col1r.next().text();
var col2v = col2r.next().text();
var col3v = col3r.next().text();
var col4v = col4r.next().text();
var col5v = col5r.next().text();

//<![CDATA[
$('select[name=fcolor]').after('<select onmouseover="ZetaHelp(\'Character Color\')" onchange="ZetaSelect(this,\'COLOR\')" name="charcolor"> <option value="" selected="selected">Character Colors</option> <option value="' + col1v + '">Character 1</option> <option value="' + col2v + '">Character 2</option> <option value="' + col3v + '">Character 3</option><option value="' + col4v + '">Character 4</option> <option value="' + col5v + '">Character 5</option></select>');
//]]>

});
}
});</script>


EDIT:
Bonus - no longer need to hide #colordata.
Edited by Austin W, Jan 13 2016, 10:46 AM.
Offline Profile Quote Post Goto Top
 
Faylen
Member Avatar
Member
[ *  * ]
Yeah. I don't want to sound like a dunce or anything. But I couldn't get this code to function the way it was intended. Once installed, how does it actually work? I can't seem to get it to do anything.

I would absolutely love for this to work since a RP Site is what I run and we do have unique colors many characters like to use, but would rather not have to manually type in the color number each time.

Thanks for any assistance provided.
Offline Profile Quote Post Goto Top
 
Ferby
Member Avatar
Developer
[ *  *  *  *  * ]
Here's a (slightly) more efficient version. I couldn't be bothered to re-write the entire thing.
Code:
 
<script type="text/javascript">
(function()) {

var col1 = "Color 1";
var col2 = "Color 2";
var col3 = "Color 3";
var col4 = "Color 4";
var col5 = "Color 5";
var profile_link = main_url+"profile/"+$.zb.stat.mid+"/";

if (location.href.indexOf("post") !== -1){

$( "#wrap" ).append("<div id='colordata'></div>");

$.get(profile_link+"?force_ads", function(data){

var col1r = jQuery(data).find('td:contains(' + col1 + ')');
var col2r = jQuery(data).find('td:contains(' + col2 + ')');
var col3r = jQuery(data).find('td:contains(' + col3 + ')');
var col4r = jQuery(data).find('td:contains(' + col4 + ')');
var col5r = jQuery(data).find('td:contains(' + col5 + ')');

var col1v = col1r.next().text();
var col2v = col2r.next().text();
var col3v = col3r.next().text();
var col4v = col4r.next().text();
var col5v = col5r.next().text();

//<![CDATA[
$('select[name=fcolor]').after('<select onmouseover="ZetaHelp(\'Character Color\')" onchange="ZetaSelect(this,\'COLOR\')" name="charcolor"> <option value="" selected="selected">Character Colors</option> <option value="' + col1v + '">Character 1</option> <option value="' + col2v + '">Character 2</option> <option value="' + col3v + '">Character 3</option><option value="' + col4v + '">Character 4</option> <option value="' + col5v + '">Character 5</option></select>');
//]]>

});
}
}());
</script>
Offline Profile Quote Post Goto Top
 
Hayate17
Member
[ * ]
Thanks guys!

Good call on get so we don't need to do that framed infinite load loop :)

I've gone ahead and updated to version 2, credits to you Austin since I went with your fixes.
Offline Profile Quote Post Goto Top
 
Alikou
Member
[ * ]
How do you program colors into it?
Offline Profile Quote Post Goto Top
 
1 user reading this topic (1 Guest and 0 Anonymous)
ZetaBoards - Free Forum Hosting
Create your own social network with a free forum.
« Previous Topic · ZetaBoards Codes & Modifications · Next Topic »
Add Reply