|
Character Colors v1; Hayate17
|
|
Topic Started: Jan 3 2016, 05:15 PM (1,138 Views)
|
|
Hayate17
|
Jan 3 2016, 05:15 PM
Post #1
|
- Posts:
- 15
- Group:
- Members
- Member
- #636,477
- Joined:
- December 31, 2015
- I'm Browsing With
- Firefox
|
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 - Code:
-
<script type="text/javascript"> //I don't know where I got this snippet from, but I didn't write it. Credit to whoever did. var fieldName = "Color";
if (location.href === main_url + 'home/?c=6') { $.getScript('http://z4.ifrm.com/30296/128/0/p1160938/jscolor.js'); $('tbody td.c_desc:contains(' + fieldName + ')').next().find('input').addClass('color {required:false, hash:true, caps:false}').each(function () { var color = $(this).val();
if (color.charAt(0) !== '#' && color !== '') { $(this).val(rgbToHex(color)); } }); } </script> <script>//Custom Character Colors v2 //Written by Hayate17, Special Thanks to Austin for updates to data fetching method. 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 + '" style="color:' + col1v + ';">' + col1v + '</option> <option value="' + col2v + '" style="color:' + col2v + ';">' + col2v + '</option> <option value="' + col3v + '" style="color:' + col3v + ';">' + col3v + '</option><option value="' + col4v + '" style="color:' + col4v + ';">' + col4v + '</option> <option value="' + col5v + '" style="color:' + col5v + ';">' + col5v + '</option></select>'); //]]> }); } });</script>
Extra notes: Special thanks to Austin 
OLD - Version 1 Code Name: Character Colors v1 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: Replace "YOURBOARDURL" with your board url leading up to a Profile Link. 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 - Code:
-
<script> if(document.URL.indexOf("post") != -1) { //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";
$( "#wrap" ).append( "<div id='colordata'></div>" ); $("#colordata").load("http://narutoroleplay.net/profile/" + $.zb.stat.mid + "/ td",function(data){ var col1r = $("#colordata").find('td:contains(' + col1 + ')'); var col2r = $("#colordata").find('td:contains(' + col2 + ')'); var col3r = $("#colordata").find('td:contains(' + col3 + ')'); var col4r = $("#colordata").find('td:contains(' + col4 + ')'); var col5r = $("#colordata").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>
Extra notes: You're going to want to add some css to all your themes to set #colordata to display: none;
Edited by Hayate17, Feb 27 2016, 02:16 PM.
|
|
|
| |
|
Quozzo
|
Jan 3 2016, 06:19 PM
Post #2
|
By the blood of Sanguinius!
- Posts:
- 1,780
- Group:
- Members
- Member
- #386,319
- Joined:
- September 1, 2010
- I'm Browsing With
- Chrome
- Latest Blog Entry
- http://resources.zetaboards.com/blog/main/2070103/
|
- 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
|
|
|
| |
|
Austin W
|
Jan 9 2016, 01:38 AM
Post #3
|
- Posts:
- 27
- Group:
- Members
- Member
- #611,464
- Joined:
- September 28, 2013
- My Board URL
- starforcerp.com
|
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.
|
|
|
| |
|
Faylen
|
Jan 25 2016, 05:13 AM
Post #4
|
- Posts:
- 54
- Group:
- Members
- Member
- #626,689
- Joined:
- April 9, 2015
- I'm Browsing With
- Firefox
- My Board URL
- http://www.anterone.com
|
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.
|
|
|
| |
|
Ferby
|
Jan 25 2016, 07:54 AM
Post #5
|
- Posts:
- 1,604
- Group:
- Members
- Member
- #391,527
- Joined:
- January 14, 2012
|
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>
|
|
|
| |
|
Hayate17
|
Feb 27 2016, 02:13 PM
Post #6
|
- Posts:
- 15
- Group:
- Members
- Member
- #636,477
- Joined:
- December 31, 2015
- I'm Browsing With
- Firefox
|
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.
|
|
|
| |
|
Alikou
|
Oct 17 2016, 02:16 PM
Post #7
|
- Posts:
- 19
- Group:
- Members
- Member
- #652,445
- Joined:
- September 29, 2016
|
How do you program colors into it?
|
|
|
| |
| 1 user reading this topic (1 Guest and 0 Anonymous)
|