var zoom = {
  max_zoom: 20,
  min_zoom: 25,
  isIE: false,
  
  init: function(id)
  {
    zoom.item = $(id);
    zoom.item.onmousemove = function (event) { zoom.animate(event) }
    $$('#'+zoom.item.id+' li').each(function(s) {
       s.onmouseover = function() { zoom.select(this) };
       s.onmouseout = function() { zoom.deselect() };
    });
    zoom.selected = zoom.item.down('li');
    zoom.animationTimer = setInterval(zoom.animateTitle, 200);
    if (parseInt(navigator.userAgent.substring(navigator.userAgent.indexOf("MSIE")+5))==6) { zoom.isIE = true; }
  },
  select: function(item)
  {
    zoom.selected = item;
    Effect.Queues.get('titleApear').each(function(effect) { effect.cancel(); });
    Effect.Appear('zoomTitle',{ duration:0.3, queue: { position: 'end', scope: 'titleApear' }});
    
    $('zoomTitle').update(item.down('a').getAttribute('title'));
  },
  deselect: function(item)
  {
    Effect.Queues.get('titleApear').each(function(effect) { effect.cancel(); });
    Effect.Fade('zoomTitle',{ duration:0.3, queue: { position: 'end', scope: 'titleApear' }});
  },
  animate: function (event)
  {
    var referenceOffset = zoom.item.down('a',2).cumulativeOffset();
    referenceOffset.left -= 40;
    
    if (navigator.appVersion.indexOf("MSIE")!=-1) { event = window.event; }
      
    $$('#'+zoom.item.id+' li').each(function(element) {
      var img = element.down('a img');
      
      if(zoom.isIE) img = element.down('a');
      
      var width = img.getWidth();
      var offset = img.cumulativeOffset();
      var eventOffset = {
              'left': (offset.left + (width/2)) - referenceOffset.left,
              'top': event.clientY-offset.top
      };
      
      if (eventOffset.left < 0) eventOffset.left = 0;
      
      var zoomProc = (eventOffset.left) / (event.clientX - referenceOffset.left);
      if((offset.left + (width/2)) > event.clientX)
        zoomProc = (event.clientX - referenceOffset.left) / (eventOffset.left);
      var yZoom = 1 - (eventOffset.top - 20) / 70;
      zoomProc *= yZoom > 1?1:yZoom;

      if(zoomProc > 1) zoomProc = 1;
      if(zoomProc < 0) zoomProc = 0;
      
      img.setStyle({ 'width': Math.round(zoomProc * zoom.max_zoom) + zoom.min_zoom + 'px' });
      if(zoom.isIE) img.setStyle({height: Math.round(img.getWidth() * 0.91)+'px'});
    });
  },
  animateTitle: function() {
		var offset = zoom.selected.cumulativeOffset();
		var x = offset.left + (zoom.selected.down('img').getWidth()/2) - 55 + 'px';

		Effect.Queues.get('menuxscope').each(function(effect) { effect.cancel(); });

    new Effect.Morph('zoomTitle', {
      style: { 'left' : x },
      duration: 0.2,
      transition: Effect.Transitions.sinoidal,
      queue: { position: 'end', scope: 'menuxscope' }
    });
  }
}

document.observe("dom:loaded", function () {
  zoom.init('sideMenu');
});