|
Team Icons and Ranks in Member List
|
|
Topic Started: Mar 2 2012, 08:19 PM (1,827 Views)
|
|
Cory
|
Mar 2 2012, 08:19 PM
Post #1
|
- Posts:
- 16,587
- Group:
- Members
- Member
- #44,593
- Joined:
- February 12, 2005
|
Code Name: Team Icons and Ranks in Member List
What the code does: There is three sets of codes here. The first code installs team icons and pip ranks on the member list, the second code installs only team icons on the member list and the third code only installs pip ranks on the member list. Preview
How to use the code: Install as instructed and view the notes for extra details.
How to install the code: Only install one of the three codes.
All themes: Admin CP Themes Board Template Below the Board One theme: Admin CP Themes Themes Edit Theme Layout: Very Bottom
Install team icons and pip ranks:- Code:
-
<script type="text/javascript"> function addIcon(group, image) { $('#member_list_full tr[class*="row"]').each(function () { if ($(this).find('td:eq(1)').html() === '' + group + '') { $(this).find('td:eq(1)').html('<img src="' + image + '" alt="Team Icon" />'); } }); }
$('#member_list_full tr[class*="row"]').each(function () { $(this).find('td:eq(1)').after('<td class="rank"><em>No Rank</em></td>'); });
$('#member_list_full tbody th:eq(1)').after('<th width="20%">Rank</th>'); $('#member_list_full tbody th[width="28%"]').attr('width', '18%'); $('#member_list_full thead th, #member_list_full td.c_head, #member_list_full td.c_foot').attr('colspan', '7');
function addPip(p_count, image) { $('#member_list_full tr[class*="row"]').each(function () { if (parseInt($(this).find('td:eq(5)').html().replace(/,/g, ''), 10) >= p_count) { $(this).find('td.rank').html('<img src="' + image + '" alt="Pip" />'); } }); }
addIcon('GROUP_NAME', 'TEAM_ICON_IMAGE_URL'); addIcon('GROUP_NAME', 'TEAM_ICON_IMAGE_URL');
addPip('AMOUNT_OF_POSTS_NEEDED_TO_GAIN_RANK', 'PIP_RANK_IMAGE_URL'); addPip('AMOUNT_OF_POSTS_NEEDED_TO_GAIN_RANK', 'PIP_RANK_IMAGE_URL'); </script> Install team icons only:- Code:
-
<script type="text/javascript"> function addIcon(group, image) { $('#member_list_full tr[class*="row"]').each(function () { if ($(this).find('td:eq(1)').html() === '' + group + '') { $(this).find('td:eq(1)').html('<img src="' + image + '" alt="Team Icon" />'); } }); }
addIcon('GROUP_NAME', 'TEAM_ICON_IMAGE_URL'); addIcon('GROUP_NAME', 'TEAM_ICON_IMAGE_URL'); </script> Install pip ranks only: - Code:
-
<script type="text/javascript"> $('#member_list_full tr[class*="row"]').each(function () { $(this).find('td:eq(1)').after('<td class="rank"><em>No Rank</em></td>'); });
$('#member_list_full tbody th:eq(1)').after('<th width="20%">Rank</th>'); $('#member_list_full tbody th[width="28%"]').attr('width', '18%'); $('#member_list_full thead th, #member_list_full td.c_head, #member_list_full td.c_foot').attr('colspan', '7');
function addPip(p_count, image) { $('#member_list_full tr[class*="row"]').each(function () { if (parseInt($(this).find('td:eq(5)').html().replace(/,/g, ''), 10) >= p_count) { $(this).find('td.rank').html('<img src="' + image + '" alt="Pip" />'); } }); }
addPip('AMOUNT_OF_POSTS_NEEDED_TO_GAIN_RANK', 'PIP_RANK_IMAGE_URL'); addPip('AMOUNT_OF_POSTS_NEEDED_TO_GAIN_RANK', 'PIP_RANK_IMAGE_URL'); </script> Extra notes: Simply change the capitalized text in the last lines of code and you can keep repeating one of the lines to add more team icons/pips.
When adding pips, the lines must go in order from lowest number to highest number, for example:- Code:
-
addPip('0', 'PIP_RANK_IMAGE_URL'); addPip('500', 'PIP_RANK_IMAGE_URL'); addPip('1000', 'PIP_RANK_IMAGE_URL'); Do not use commas in numbers in the code.
Edited by Cory, Apr 28 2013, 08:52 PM.
|
|
|
| |
|
JAR
|
Mar 3 2012, 12:00 PM
Post #2
|
- Posts:
- 776
- Group:
- Members
- Member
- #382,745
- Joined:
- November 18, 2009
- I'm Browsing With
- Chrome
- Latest Design
- http://outlineforum.com/topic/5075848/1/#new
- Latest Blog Entry
- http://outlineforum.com/topic/5075848/1/#new
- My Board URL
- http://w11.zetaboards.com/GhostPost
|
That is a really awesome code! Is there anyway for it to grab information from the Mini-Profile... from a custom profile field?
|
|
|
| |
|
Cory
|
Mar 3 2012, 03:17 PM
Post #3
|
- Posts:
- 16,587
- Group:
- Members
- Member
- #44,593
- Joined:
- February 12, 2005
|
It would require an immense amount of AJAX to display custom profile fields on the member list.
|
|
|
| |
|
2wise69
|
Aug 12 2012, 05:53 AM
Post #4
|
- Posts:
- 180
- Group:
- Members
- Member
- #391,539
- Joined:
- January 16, 2012
|
This don't seem to work on my board. I'm using the theme 'Wild Heart' that's release here on ZNR & here's the script that I put on the way bottom of the theme layout
- Code:
-
<script type="text/javascript"> $('#member_list_full tr[class*="row"]').each(function () { $(this).find('td:eq(1)').after('<td class="rank"><em>No Rank</em></td>'); });
$('#member_list_full tbody th:eq(1)').after('<th width="20%">Rank</th>'); $('#member_list_full tbody th[width="28%"]').attr('width', '18%'); $('#member_list_full thead th, #member_list_full td.c_head, #member_list_full td.c_foot').attr('colspan', '7');
function addPip(p_count, image) { $('#member_list_full tr[class*="row"]').each(function () { if (parseInt($(this).find('td:eq(5)').html().replace(/,/g,'')) >= p_count) { $(this).find('td.rank').html('<img src="' + image + '" alt="Pip" />'); } }); }
addPip('0', 'http://i1105.photobucket.com/albums/h353/2wise69/Forum%20Icons/noob.png'); addPip('10', 'http://i1105.photobucket.com/albums/h353/2wise69/Forum%20Icons/AcademyStud.png'); addPip('15', 'http://i1105.photobucket.com/albums/h353/2wise69/Forum%20Icons/AcademyStudLvl2.png'); addPip('20', 'http://i1105.photobucket.com/albums/h353/2wise69/Forum%20Icons/AcademyStudLvl3.png'); addPip('30', 'http://i1105.photobucket.com/albums/h353/2wise69/Forum%20Icons/AcademyStudLvl4.png'); addPip('40', 'http://i1105.photobucket.com/albums/h353/2wise69/Forum%20Icons/AcademyStudLvl5.png'); addPip('45', 'http://i1105.photobucket.com/albums/h353/2wise69/Forum%20Icons/AdvanceStudent.png'); addPip('50', 'http://i1105.photobucket.com/albums/h353/2wise69/Forum%20Icons/Genin.jpg'); addPip('500', 'http://i1105.photobucket.com/albums/h353/2wise69/Forum%20Icons/Chuunin.jpg'); addPip('1000', 'http://i1105.photobucket.com/albums/h353/2wise69/Forum%20Icons/SpecialJounin.jpg'); addPip('1500', 'http://i1105.photobucket.com/albums/h353/2wise69/Forum%20Icons/Jounin.jpg'); addPip('2000', 'http://i1105.photobucket.com/albums/h353/2wise69/Forum%20Icons/S-Class-Ninja.jpg'); addPip('2500', 'http://i1105.photobucket.com/albums/h353/2wise69/Forum%20Icons/Sannin.jpg'); addPip('3000', 'http://i1105.photobucket.com/albums/h353/2wise69/Forum%20Icons/Kage.jpg'); addPip('3500', 'http://i1105.photobucket.com/albums/h353/2wise69/Forum%20Icons/Sage.jpg'); </script>
I've check my members list & nothing seem to change.
EDIT: Nevermind..problem fixed. It looks like your script you made here - http://resources.zetaboards.com/topic/5152166/1/#new won't make this script to work. I took that code out and this script works perfectly.
Edited by 2wise69, Aug 12 2012, 05:56 AM.
|
|
|
| |
|
Cory
|
Aug 12 2012, 03:01 PM
Post #5
|
- Posts:
- 16,587
- Group:
- Members
- Member
- #44,593
- Joined:
- February 12, 2005
|
The CSS just needs modifying:- Code:
-
<style type="text/css"> #member_list_full th[width="20%"] + th[width="18%"], #member_list_full tr[class*="row"] td.rank + td { display: none; } </style>
|
|
|
| |
| 1 user reading this topic (1 Guest and 0 Anonymous)
|