$('#winners-wall-winners li > img').hide();

if($.browser.msie) $('#winners-wall-winners li div:not(.ww-bg-contain)').css('opacity',0);
$('#winners-wall-winners li').hover(function(){
  //Stop any animation and reset the css
  if(!$(this)[0].box) $(this)[0].box=new captionbox($(this));
  var box=$(this)[0].box;
  if(box.preventhover==false){
    $(this)[0].showTimer=setTimeout(function(){box.show()},400);
  }
},function(){
  $(this)[0].box.hide();
});

var current_z=1000;

$(window).scroll(function(){
    var scrolltop=$(window).scrollTop();
    var viewportheight=$(window).height();
    var delay=0;
    $('#winners-wall-winners li > img:not(.loaded)').each(function(){
      var elementtop=$(this).parent().offset().top;
      elementtop=elementtop-scrolltop-viewportheight;
      if(elementtop<0){
        var item=$(this);
        setTimeout(function(){
           item.fadeIn(500).addClass('loaded')},delay);
        delay+=150;
      }
    });
});
$(window).scroll();

function captionbox(in_box){
  this.callout_pos_y='bottom';
  this.callout_pos_x='right';
  this.box=in_box;
  this.preventhover=false;
  this.show=function(){
    //Hide all other boxes
    this.preventhover=false;
    this.box.find('img').addClass('current');
    $('#winners-wall-winners li').each(function(){
      if($(this)!=this.box){
        if($(this)[0].box){
          $(this)[0].box.hide();
          clearTimeout($(this)[0].box.showTimer);
        }
      }
    });
    //Store the top location - when we hide the box we'll shove it above the screen to prevent hover problems, so need to know where to put it back
    //this.box.posTop=this.box.find('div').css('top');
    //this.box.find('div').css('top',this.box.posTop);

    //Position the box and add the relvant class name to get the right shape callout - default in css is bottom right
    //If the box is over 50% of the width of the wall, we callout left, otherwise right
    var left_pos=this.box[0].offsetLeft;
    if(left_pos>400) this.callout_pos_x='left';

    //Work out position of the element inside the viewport
    var scrolltop=$(window).scrollTop();
    var elementtop=this.box.offset().top;
    var viewporttop=elementtop-scrolltop;
    var viewportheight=$(window).height();

    if(viewporttop>(viewportheight/2)) this.callout_pos_y='top';

    $('#winners-wall-winners li').css('zIndex','0');
    this.box.css('zIndex','1000');
    var classname=(this.callout_pos_y+'-'+this.callout_pos_x);
    this.box.find('div:not(.ww-bg-contain)').attr('class',classname);
    if($.browser.msie){
      //IE can't do the fade becuase of the transparent pngs
      if(this.callout_pos_x=='right'){
        this.box.find('div:not(.ww-bg-contain)').stop(true).css('opacity','').hide().css('top','').css('display','block').css('marginLeft','-10px');
        this.box.find('div:not(.ww-bg-contain)').show().animate({'marginLeft':'10px'},500);
      }else{
        this.box.find('div:not(.ww-bg-contain)').stop(true).css('opacity','').hide().css('top','').css('display','block').css('right','80%');
        this.box.find('div:not(.ww-bg-contain)').show().animate({'right':'70%'},500);
      }
    }else{
      if(this.callout_pos_x=='right'){
        this.box.find('div:not(.ww-bg-contain)').stop(true).css('opacity',0).css('top','').css('display','block').css('marginLeft','-10px');
        this.box.find('div:not(.ww-bg-contain)').animate({'opacity':1,'marginLeft':'10px'},500);
      }else{
        this.box.find('div:not(.ww-bg-contain)').stop(true).css('opacity',0).css('top','').css('display','block').css('right','80%');
        this.box.find('div:not(.ww-bg-contain)').animate({'opacity':1,'right':'70%'},500);
      }
    }
    current_z++;
  }
  this.hide=function(){
    this.preventhover=true;
    var self=this;
    if($.browser.msie){
      //IE can't do the fade becuase of the transparent pngs
      if(this.callout_pos_x=='right'){
        this.box.find('div:not(.ww-bg-contain)').css('display','block').animate({'marginLeft':'100px'},200,'',function(){
          $(this).css('marginLeft','-10px').css('display','none').css('top','-100000px').css('opacity','');
          self.preventhover=false;
        });
      }else{
        this.box.find('div:not(.ww-bg-contain)').css('display','block').animate({'right':'0'},200,'',function(){
          $(this).css('right','auto').css('display','none').css('top','-100000px').css('opacity','');
          self.preventhover=false;
        });
      }
    }else{
      if(this.callout_pos_x=='right'){
        this.box.find('div:not(.ww-bg-contain)').css('display','block').animate({'opacity':0,'marginLeft':'100px'},200,'',function(){
          $(this).css('marginLeft','-10px').css('display','none').css('top','-100000px');
          self.preventhover=false;
        });
      }else{
        this.box.find('div:not(.ww-bg-contain)').css('display','block').animate({'opacity':0,'right':'0'},200,'',function(){
          $(this).css('right','auto').css('display','none').css('top','-100000px');
          self.preventhover=false;
        });
      }
    }
  } 
}

//Fix pngs on winners wall
if($.browser.msie && $.browser.version=="6.0"){
  $('#winners-wall li div img').each(function(){
    //Craft some IE friendly css
    var src=$(this).attr('src');
    var obj=$(this)[0];
    var h=obj.offsetHeight;
    var w=obj.offsetWidth;
    $(this).attr('src','/assets/images/clear.gif')
           .css('height','100px')
           .css('width','250px')
           .css('filter',"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+src+"', sizingMethod='crop')");
  });
}