<script type="text/javascript">              
document.getElementsByClassName = function(className) {              
                     var children = document.getElementsByTagName('*') || document.all;              
                     var elements = new Array();              
                      
                     for (var i = 0; i < children.length; i++) {              
                      var child = children[i];              
                      var classNames = child.className.split(' ');              
                      for (var j = 0; j < classNames.length; j++) {              
                       if (classNames[j] == className) {              
                        elements.push(child);              
                        break;              
                       }              
                      }              
                     }              
                     re turn elements;              
}              

var Reflection = {              
                     defaultHeight : 0.5,              
                     defaultOpacity: 0.5,              
                    
                     add: function(image, options) {              
                      Reflection.remove(image);              
                      
                      doptions = { "height" : Reflection.defaultHeight, "opacity" : Reflection.defaultOpacity }              
                      if (options) {              
                       for (var i in doptions) {              
                        if (!options[i]) {              
                         options[i] = doptions[i];              
                        }              
                       }              
                      } else {              
                       options = doptions;              
                      }              
                    
                      try {              
                       var d = document.createElement('div');              
                       var p = image;              
                      
                       var classes = p.className.split(' ');              
                       var newClasses = '';              
                       for (j=0;j<classes.length;j++) {              
                        if (classes[j] != "userAvatar") {              
                         if (newClasses) {              
                          newClasses += ' '              
                         }              
newClasses += classes[j];              
                        }              
                       }              

                       var reflectionHeight = Math.floor(p.height*options['height']);              
                       var divHeight = Math.floor(p.height*(1+options['height']));              
                      
                       var reflectionWidth = p.width;              
                      
                       if (document.all && !window.opera) {              
                        /* Copy original image's classes & styles to div */              
                        d.className = newClasses;              
                        p.className = 'reflected';              
                        
                        d.style.cssText = p.style.cssText;              
                        p.style.cssText = 'vertical-align: bottom';              
                      
                        var reflection = document.createElement('img');              
                        reflection.src = p.src;              
                        reflection.style.width = reflectionWidth+'px';              
                        
                        reflection.style.marginBottom = "-"+(p.height-reflectionHeight)+'px';              
                        reflection.style.filter = 'flipv progid:DXImageTransform.Microsoft.Alpha(opacity='+(options['opacity']*100)+', style=1, finishOpacity=0, startx=0, starty=0, finishx=0, finishy='+(options['height']*100)+')';              
                        
                        d.style.width = reflectionWidth+'px';              
                        d.style.height = divHeight+'px';              
                        p.parentNode.replaceChild(d, p);              
                        
                        d.appendChild(p);              
                        d.appendChild(reflection);              
                       } else {              
                        var canvas = document.createElement('canvas');              
                        if (canvas.getContext) {              
                         /* Copy original image's classes & styles to div */              
                         d.className = newClasses;              
                         p.className = 'reflected';              
                         d.style.cssText = p.style.cssText;              
                         p.style.cssText = 'vertical-align: bottom';              
                      
                         var context = canvas.getContext("2d");              
                        
                         canvas.style.height = reflectionHeight+'px';              
                         canvas.style.width = reflectionWidth+'px';              
                         canvas.height = reflectionHeight;              
                         canvas.width = reflectionWidth;              
                        
                         d.style.width = reflectionWidth+'px';              
                         d.style.height = divHeight+'px';              
                         p.parentNode.replaceChild(d, p);              
                        
                         d.appendChild(p);              
                         d.appendChild(canvas);              
                        
                         context.save();              
                        
                         context.translate(0,image.height-1);              
                         context.scale(1,-1);              
                        
                         context.drawImage(image, 0, 0, reflectionWidth, image.height);              
                    
                         context.restore();              
                        
                         context.globalCompositeOperation = "destination-out";              
                         var gradient = context.createLinearGradient(0, 0, 0, reflectionHeight);              
                        
                         gradient.addColorStop(1, "rgba(255, 255, 255, 1.0)");              
                         gradient.addColorStop(0, "rgba(255, 255, 255, "+(1-options['opacity'])+")");              
                      
                         context.fillStyle = gradient;              
                         if (navigator.appVersion.indexOf('WebKit') != -1) {              
                          context.fill();              
                         } else {              
                          context.fillRect(0, 0, reflectionWidth, reflectionHeight*2);              
                         }              
                        }              
                       }              
                      }  catch (e) {              
                         }              
                     },              
                    
                     remov e : function(image) {              
                      if (image.className == "reflected") {              
                       image.className = image.parentNode.className;              
                       image.parentNode.parentNode.replaceChild(image, image.parentNode);              
                      }              
                     }              
}              

function addReflections() {              
                     var rimages = document.getElementsByClassName('userAvatar');              
                     for (i=0;i<rimages.length;i++) {              
                      var rheight = null;              
                      var ropacity = null;              
                      
                      var classes = rimages[i].className.split(' ');              
                      for (j=0;j<classes.length;j++) {              
                       if (classes[j].indexOf("rheight") == 0) {              
                        var rheight = classes[j].substring(7)/100;              
                       } else if (classes[j].indexOf("ropacity") == 0) {              
                        var ropacity = classes[j].substring(8)/100;              
                       }              
                      }              
                      
                      Refle ction.add(rimage s[i], { height: rheight, opacity : ropacity});              
                     }              
}              

var previousOnload = window.onload;              
window.onload = function () { if(previousOnload) previousOnload(); addReflections(); }              
</script>