Calendar Event Signups - Vanguard version

GuildPortal admin site link to original post

This script modifies your calendar event signups so that it includes the class (text or icon, taken straight from the roster page) and character level to make it easier for raid planners to better determine their needs. I've included before and after screenshots below (with text or icons).

People who are not listed in the guild roster will have an unknown class and level (displayed as a question mark).

The Code

<!--
************************************
Calendar Event Signups
-= Add character Level & Class =-
************************************ -->
<div id="tmproster" style="display:none"></div>
<script type="text/javascript">
var rosterPage = 'http://guildportal.com/... myGuildRosterPage';
var addIcons = true;
var iconWidth = 24;
var iconHeight = 24;
var iconRootURL = 'http://www.axiomfiles.com/Files/278466/icon_Vanguard_';

// ***************************
// Don't change anything below
// ***************************
var cn,loc,lvl,cls,clsu,t;
$(document).ready(function(){
 rosterPage = rosterPage.substring(rosterPage.lastIndexOf('/Guild.aspx'),rosterPage.length);
 $('#tmproster').load(rosterPage + ' table[id*=grdRoster]',updateClass);
})
function updateClass(){
 // make all names lower case
 $('#tmproster').find('table[id*=grdRoster]').find('tr').each(function(){
  $(this).find('td:eq(0) a').text( $(this).find('td:eq(0) a').text().toLowerCase() );
 })
 if (addIcons) {
  cls = 'Class';
 } else {
  cls = '';
 }
 // Add columns
 $('div[id*="_signupsHolder"]')
  .find('tr.ContentBoxTitle td:eq(0)').attr('colspan','7').end()
  .find('tr:gt(0)').each(function(){
   $(this).find('td:eq(1)')
    .before('<td class="cclass" valign="middle" align="center"></td>')
    .after('<td class="clvl" align="center"></td>');
  })
 // Add header info
  .end().find('.cclass:eq(0)').html(cls)
  .end().find('.clvl:eq(0)').html('Level');
 // Add info to signups
 $('div[id*="_signupsHolder"]').find('.NormGridRow,.AltGridRow').each(function(){
  cn = $(this).find('td:eq(2) a').text().toLowerCase();
  loc = $('#tmproster').find('a[title*="view this character"]:contains("' + cn + '")').closest('tr');
  if (loc.length > 1) loc = getExactName(loc,cn);
  lvl = (loc.length && loc.find('td:eq(3)').text().trim()!='') ? loc.find('td:eq(3)').text() : '?';
  if (addIcons) {
   cls = (loc.length) ? loc.find('td:eq(2)').text() : '';
   clsu = (cls.trim()=='') ? 'http://www.axiomfiles.com/Files/278466/icon_unknown.gif' : iconRootURL + cls + '.gif';
   t = '<img class="tooltip" width="' + iconWidth + '" height="' + iconHeight + '" title="';
   t += (cls.trim()=='') ? 'Unknown' : cls;
   t += '" src="' + clsu + '">';
   $(this).find('.cclass').html(t);
  } else {
   cls = (loc.length && loc.find('td:eq(2)').text().trim()!='') ? loc.find('td:eq(2)').text() : '?';
   $(this).find('td:eq(2)').append(' <span class="loClass">(' + cls + ')</span>');
  }
  $(this).find('.clvl').html(lvl);
 })
}
function getExactName(el,en){
 for (var j=0; j < el.length; j++){
  if ($(el[j]).find('td:eq(0) a').text().toLowerCase() == en) return $(el[j])
 }
}
</script>

Customizing

• You must replace the "rosterPage" variable to point to your guild site's roster page (replace the URL in orange)
  
  var rosterPage = 'http://guildportal.com/... myGuildRosterPage';


• Choose to include icons in the signup by setting the "addIcons" variable to true. If false, it will display the class as text.
  
  var addIcons = true;


• If using icons, you can set their height and width with the "iconWidth" and "iconHeight" variables.
  
  var iconWidth = 24;
  var iconHeight = 24;


• It really shouldn't be necessary to use the CSS classes I added, but if you want to adjust the background color or size of those columns or text, you can add the following classes to your stylesheet:
  
  .cclass {  }  /* character class (icon wrapper) */
  .loClass { } /* class text (includes parenthesis) */
  .clvl { }       /* character level text */

*NOTE* If you have a different game that you would like to do this on, please message me...