var timer1;
var dx=10;
var runtime=40;
var off=dx;
var maxOff=340;

//Event.observe(window, 'dom:loaded', init);
//Event.observe(window, 'load', init);
document.observe("dom:loaded", init);

function showBadge(){
  off=dx;
  clearInterval(timer1);
  timer1=setInterval('moveBox()', runtime);
}

function hideBadge(){
  off=-dx;
  clearInterval(timer1);
  timer1=setInterval('moveBox()', runtime);
}

function moveBox()
{
     obj = $('box1');
     icon = $('logof');
     
     pos += off;

     if (pos <= 0) {
     	clearInterval(timer1);
        obj.hide();
	pos=0;
     
     } else if (pos >= maxOff) {
     	clearInterval(timer1);
        icon.hide();
	pos = maxOff;

       } else {           
	   icon.show();
	   obj.show();
         }

     obj.style.width = Math.sin(pos/maxOff*1.57)*maxOff + 'px';
     obj.setOpacity ( Math.sin(pos/maxOff*1.57) );
     icon.setOpacity ( 1-Math.sin(pos/maxOff*1.57) );

}

function init() {

  pos=maxOff=$('box1').getWidth();
  $('badgeBox1').style.width = maxOff +'px';
  pos=0;
  hideBadge();

  //Event.observe($('logof'), 'click', showBadge);
  Event.observe($('logof'), 'mouseenter', showBadge);
  Event.observe($('box1'), 'mouseleave', hideBadge);
}