Extensible Ranking System

[Bones]

Browsers Tested: Firefox 3.6 but it is written in jQuery so should be CB with all major browsers

• Description: this code was originally a request on PBS but I decided to improve it by adding "modes" which allows it to do rank images not just on a time-based value but also for posts count, karma count or any custom numeric field the admin wishes. Aggregate or distinct multi-fields are also supported.
  
  
• Code:
  Header (GLOBAL):
<script type="text/javascript" language="javascript" src="https://www.google.com/jsapi"></script>
<script>google.load("jquery", "1.6.1");</script>
  
  Footer (GLOBAL):<script>
(function(opts){ /* @name Custom Rank Images in Miniprofile */
if(!opts)opts={}; opts.modes = {
"joined":[/Joined: ([^<]+)/,"joined around ## weeks ago"]
, "posts": [/Posts: ([^<]+)/,"level ### poster"]
, "group": [/class=['"]?group(\d+)/,"group ##"]
,"karma": [/Karma: ([^>]+)/,"karma level ###"]
}
if(opts.mode == "custom")
if(opts.customField && opts.customField.slice){opts.mode = opts.customField[0]; opts.modes[opts.mode]=opts.customField.slice(1);}
if("string" != typeof(opts.mode))opts.mode = ["joined"]; else opts.mode= opts.mode.toLowerCase().split('|');
if(!opts.levelUp) opts.levelUp = [
[10,'http://images.proboards.com/star.gif']
,[50]
,[75]
,[100,'http://images.proboards.com/new/star.png']
,[250]
,[500,'http://images.proboards.com/starblue.gif']
,[750]
,[1000,'http://images.proboards.com/new/starblue.png']
,[2500]
,[5000,'http://images.proboards.com/stargreen.gif']
,[10000,'http://images.proboards.com/new/stargreen.png']
,[15000,'http://images.proboards.com/starred.gif']
,[20000,'http://images.proboards.com/new/starred.png']
,[100000,,'Deity Status']
];
if(!("fixedImageCount" in opts)) opts.fixedImageCount = 0;
if(!("replaceStars" in opts))opts.replaceStars = true;
if(!("aggregate" in opts))opts.aggregate = false;
var $ = window.jQuery;
$('.windowbg[width="20%"][valign][bgcolor], .windowbg2[width="20%"][valign][bgcolor]')
.filter(function(){ var m,n
for(n=0;n<opts.mode.length;n++){
if(opts.mode[n] == "custom" && "function" == typeof(opts.modes.customFilter)) try{m= opts.modes.customFilter.call(this,this.innerHTML);}catch(e){m=null;}
if(!m && opts.modes[opts.mode[n]] && opts.modes[opts.mode[n]][0].exec) m = this.innerHTML.match(opts.modes[opts.mode[n]][0]);
if(m&&m[0]){$(this).data(opts.mode[n], (opts.mode[n]=="joined"?new Date($.trim(m[1]).split(' ').join(' 1, ')):(/^-?[\d,\.]+$/.test(m[1])?m[1].replace(/,/g, ''):m[1])));}
if(!m)return false; m=null;
}
return true;
}).each(opts.customHandler||function(){
var mp = $(this),a,b,c,d,e,f,g,si;
function getLevel(arr,val){val=parseFloat(val);for(var c=0;c<arr.length;c++){si = arr[c][1]||si; if(val<=arr[c][0]){if(c>0)c--;break;}}return arr[c]?c:arr.length-1}
for(d=0,si = opts.defaultImage||'http://images.proboards.com/new/star.png', f=[], g=0; d<opts.mode.length; d++){
switch(opts.mode[d]){
case "joined":
var now=new Date(); a = mp.data('joined'); b = ((now-a)/86400000/7)>>0; break;
default: b = mp.data(opts.mode[d])||0; break;
}
if(!opts.modes[opts.mode[d]][1])opts.modes[opts.mode[d]][1]=opts.mode[d];
if(opts.aggregate && !isNaN(parseInt(b))){ c = getLevel((opts.modes[opts.mode[d]][2]||opts.levelUp),b);
f.push(opts.modes[opts.mode[d]][1].replace(/([^#])?###([^#])?/g,'$1'+ (1+c) +'$2').replace(/([^#])?##([^#])?/g,'$1'+b+'$2'));
if(d<opts.mode.length-1){   g += parseInt(b); continue;}else b = (parseInt(g)+parseInt(b))/(f.length?f.length:1);
}
e = opts.modes[opts.mode[d]][2]||opts.levelUp; c = getLevel(e,b);
if(f.length){ f=["["+f.join("][")+"]"];}
if(opts.replaceStars && (mp.find('a[class=group0]').length>0||opts.replaceGroup)){
mp.find('img[alt="*"]').filter(function(){return !$(this).parent().hasClass("mpRank2")}).eq(0)
.each(function(){var a; if((a=this.previousSibling) && (a=a.previousSibling) && a.nodeType==3){a.parentNode.removeChild(a.nextSibling); a.parentNode.removeChild(a);} return true;})
.end().end().wrapAll('<span class="mpRank2 mpranklevel_'+(c+1)+' mprankvalue_'+b+'" />').remove(); }
if(mp.find('.mpRank2:empty').length==0)
mp.find( 'b:has(a[class]),img[alt="*"]').last().next().replaceWith('<div class="mpRank2 mpranklevel_'+(c+1)+' mprankvalue_'+b+'" />');
mp.find('.mpRank2').last().append((d>0 &&(f.length==0||isNaN(b+0))?'<br>':'')+ (e[c][2]&&!opts.aggregate?e[c][2]+'<br>':'')+ (new Array((opts.fixedImageCount>0?opts.fixedImageCount:Math.min( (opts.maxCount||999999),(c+1)))+1)).join('<img border="0" alt="+" src="'+si+'" title="'+ (f.length?f.join(', '): opts.modes[opts.mode[d]][1]).replace(/###/g,(1+c)).replace(/##/g,b)+'" \/>'))
}
})
})({mode:'joined'});
</script>
  
  
• Usage:
  If installed without editing anything it will replace the standard post-based ranking/fixed group system with a time-based ranking system that has more images (mix of old star.gif and newer star.png images). The images are chosen according to number of weeks since join date (note: joined date is always calculated as the first of the month since only month and year is supplied in miniprofile).
  
  
• Editing: (all are optional)
  There are quite a few parameters that can be added to modify the code's behavior so I'll list them here

  parameters are added to the last line of the code, for example
  })({mode:'joined',maxCount:8});
  sets the mode to "joined" with a maximum count of 8 images on any single line. You may want to split it into multiple lines like so if you are adding a ton of params and want to make it easier to read and edit
  })({
  mode:'joined|custom'
  ,maxCount:8
  ,replaceStars:false
  ,customField: [
      'money'
      , /Dollars: $([^<]+)/
      , 'Money earned'
      ,[
          [100, 'http://i53.tinypic.com/142bvro.png','Hard worker']
          ,[200,,'Got a raise']
          ,[500,,'Got a promotion']
          ,[1000,,'Must be doing something illegal']
          ,[2000,,'Big Spender']
          ,[5000,,'Rich!']
          , [10000,,'Super rich!']
          ,[50000,,'Mogul']
          , [100000,,'Waren Buffett']
      ]
  ]
  });
  
  (note: this also shows how to define an alternate levelUp for a specific field)

  
  
  • mode - allows choosing in which mode the code will run. The choices are
    
    • joined: uses join date to calculate which and how many images to display (calculated using first day on month)
      
    • posts: uses post count to calculate which and how many images to display
      
    • group: uses the group class of the user to calculate which and how many images to display
      
    • karma: uses karma value to calculate which and how many images to display
      
    • custom: (advanced -- see custom parameters below for further details)
      
    
    mode can also be specified as multiple (e.g. "joined|karma" would produce a line of images for each field or a single line of images based on the calculated average if aggregate is set to true.
    
  • aggregate: if set to true and mode uses multiple fields then the value of those fields are averaged to produce a base value for calculations.
    
  • levelUp: an array of milestone values that will define the levels for the particular type of field being used. For example if mode is "posts" then a levelUp set to to the following, would define first level at 10 post, next level at 50, next at 75, and so on..
    
    
    [ /* Line format is [countValue, imageURL,levelTitle] */
        [10,'http://images.proboards.com/star.gif']
        ,[50]
        ,[75]
        ,[100,'http://images.proboards.com/new/star.png']
        ,[250]
        ,[500,'http://images.proboards.com/starblue.gif']
        ,[750]
        ,[1000,'http://images.proboards.com/new/starblue.png']
        ,[2500]
        ,[5000,'http://images.proboards.com/stargreen.gif']
        ,[10000,'http://images.proboards.com/new/stargreen.png']
        ,[15000,'http://images.proboards.com/starred.gif']
        ,[20000,'http://images.proboards.com/new/starred.png']
    ]
    
    
    • 1. all lines except first starts with a comma
      
    • 2. image is optional, if skipped then the image from the closest lower level will be used (if no lower level with a defined image exists then defaultImage is used).
      
    • 3. an optional third element can be added (not shown in example array above) if you wish the rank to have an accompanying level title such as "Junior Member", "Senior Member", etc.
      
    • 4. you obviously can use any image you wish not just stars.
      
    
    
    
  • fixedImageCount: if greater than 0 (the default value) then this will set the number of how many images to display for a single field ranking to a fixed number.
    
  • maxCount: if fixedImageCount is not used then the number of images per line is determined by the level reached in levelUp, maxCount can be used to cap that to an upper limit.
    
  • replaceStars: if true this will replace any existing stars with the new images, if false it will display the images below the stars should they exist.
    
  • defaultImage: the url to an image that will be used if no image can be obtained by other means.
    
  • replaceGroup: (requires replaceStars set to true) setting this to true will replace groups if replaceStars is also set to true. The default value is false and replaceStars (if true) will only be able to replace ranks not groups without this.
    
  • customField: (requires "custom" mode) this will add a new type of mode to the already existing modes. For example, if a money code is installed a customField set to "money" would allow image rankings based on money. This field requires an array where the first element is the name of the field, the second is a regular expression that can be used to identify and grab that field, an optional third element containing text to apply as a hover title to the produced images and an optional fourth param which can be used to take the place of the global levelUp and requires the exact same format as that array. If you want the title (third param) to display numeric level then use ### in that optional text and it will be replaced by the level, same goes for field value but with ## instead.
    
  • customFilter: (requires "custom" mode) can be used to specify an alternate function which will be invoked to do the miniprofile matching, usefull for forums that have non-standard miniprofiles.
    
  • customHandler: a plugin function that can be used for data processing and placement of images in cases where the miniprofile is non-standard (can be specified without "custom" mode)
    
  
  
• Preview:

  {mode:'joined|karma|posts'}

  
  
  
  

  {mode:'joined|karma|posts',aggregate:true}

  
  
• Edits:
  • Jul 24, 2011 - forgot to test the money example given above since it was written on the fly while creating this post
    
    
  • Jul 24, 2011 - added ability to replace groups as well as ranks with the new replaceGroup parameter. Also made it so newly added ranks appear below existing ranks or groups rather than above (unlike Wormo's miniprofile pic in first edit where Big Spender is above Admnistrator), this however means the ability to recognize custom group stars which were added through UBBC is no longer a feature in the code (although it was never mentioned)