//  This JS handles custom animations in the page template.
//  


$(document).ready(function(){
  
  /** BEGIN - MAIN MENU **/
  
  //initialize gear animation sequence
  var gearsrc = [new Image(),new Image(),new Image(),new Image()];
  gearsrc[0].src = '/images/template/main-menu/menu-gear-step1.png';
  gearsrc[1].src = '/images/template/main-menu/menu-gear-step2.png';
  gearsrc[2].src = '/images/template/main-menu/menu-gear-step3.png';
  gearsrc[3].src = '/images/template/main-menu/menu-gear-step4.png';
  
  //define custom animation for spinning gears (usage: .animate({ gearspin:numcycles })
  $.fx.step.gearspin = function(fx){
    var lastframe = Math.round( gearsrc.length * Math.abs(fx.end) );
    var newindex = Math.floor( (lastframe*fx.pos)%gearsrc.length );
    if(fx.end<0){newindex = Math.abs( newindex-(gearsrc.length-1) );}
    fx.elem.src = gearsrc[newindex].src;
    if($.isFunction($.ifixpng)){$(fx.elem).ifixpng();}
  };
  
  //reveal menu
  $("#main-menu .menu-node").mouseenter(function(){
    var gearimg = $(this).prev(".menu-gear").children("img:first");
    var submenu = $(this).find(".menu-submenu-wrapper:first");
    var nodetop = $(this).find(".menu-node-top>div");
    var nodebottom = $(this).find(".menu-node-bottom>div");
    if( $(this).data('initmenu')!=true ){
      $(this).data('initmenu',true);
      nodetop.css({left:-40});
      nodebottom.css({left:0});
      submenu.css({marginTop:-submenu.outerHeight()});
    }
    gearimg.stop().animate({gearspin:-3},{duration:500});
    nodetop.stop().animate({left:0},{duration:500});
    nodebottom.stop().animate({left:-40},{duration:500});
    submenu.stop().animate({marginTop:0},{duration:500});
  });
  
  //hide menu
  $("#main-menu .menu-node").mouseleave(function(){
    var gearimg = $(this).prev(".menu-gear").children("img:first");
    var submenu = $(this).find(".menu-submenu-wrapper:first");
    var nodetop = $(this).find(".menu-node-top>div");
    var nodebottom = $(this).find(".menu-node-bottom>div");
    gearimg.stop().animate({gearspin:3},{duration:500});
    nodetop.stop().animate({left:-40},{duration:500});
    nodebottom.stop().animate({left:0},{duration:500});
    submenu.stop().animate({marginTop:-submenu.outerHeight()},{duration:500});
  });
  
  /** END - MAIN MENU **/
  
  /** BEGIN - SIDE MARQUEE (1) **/
/**  
  //side marquee animation trigger
  $(".side-marquee-teaser-item").click(function(){
    var lastindex = $(this).siblings().length;
    var thisindex = $(this).prevAll().length;
    
    //calc height of affected items
    var height_contents = 0;
    var height_teasers = 0;
    $(".side-marquee-content-item:lt("+thisindex+")").each(function(i){ height_contents += $(this).outerHeight(true); });
    $(".side-marquee-teaser-item:lt("+(thisindex+1)+")").each(function(i){ height_teasers += $(this).outerHeight(true); }); //goes one extra
    
    //reposition and reveal moved items (called at end of animations, run once)
    var istidy=false;
    function cleanup(){
      if(istidy){return;}
      //append higher items to end
      $(".side-marquee-content-item:lt("+thisindex+")").appendTo("#side-marquee-content-container");
      $(".side-marquee-teaser-item:lt("+(thisindex)+")").appendTo("#side-marquee-teaser-container");
      //reset positions on all
      $(".side-marquee-content-item").css({top:0});
      $(".side-marquee-teaser-item").css({top:-$(".side-marquee-teaser-item:first").outerHeight(true)}); //hide the first item
      //reveal hidden items
      $(".side-marquee-content-item").each(function(i){
        var percent = 1-(i/lastindex*1);
        $(this).animate({opacity:percent},{duration:200,queue:false,complete:function(){
          if($(this).css('opacity')==1){ $(this).css('opacity','inherit'); } //to overcome filter artifacts in IE
        }})
      });
      $(".side-marquee-teaser-item").each(function(i){
        var percent = 1.2-(i/lastindex*.8);
        $(this).animate({opacity:percent},{duration:200,queue:false,complete:function(){
          if($(this).css('opacity')==1){ $(this).css('opacity','inherit'); } //to overcome filter artifacts in IE
        }})
      });
      istidy=true;
    };
    
    //begin scrolling all items up
    $(".side-marquee-content-item").stop().animate({top:-height_contents},{duration:400,queue:false});
    $(".side-marquee-teaser-item").stop().animate({top:-height_teasers},{duration:400,queue:false});
    
    //begin fading out higher items and then trigger cleanup animation
    $(".side-marquee-content-item:lt("+thisindex+")").animate({opacity:0},{duration:400,queue:false,complete:cleanup});
    $(".side-marquee-teaser-item:lt("+thisindex+")").animate({opacity:0},{duration:400,queue:false,complete:cleanup});
    
  });
  
  $(".side-marquee-teaser-item:eq(1)").click();  //STUB - click second link to initialize the marquee - STUB!
**/  
  /** END - SIDE MARQUEE (1) **/
  
  /** BEGIN - SIDE MARQUEE (2) **/
  
  //initialize marquee on load...
  $(".side-marquee-content-item:gt(0)").css('visibility','hidden');
  $("#side-marquee-teaser-wrapper").css('margin-top',-$(".side-marquee-teaser-item:first").outerHeight(true));
  $(".side-marquee-teaser-item").each(function(i){
    $(this).css('opacity',1.125-(i/8));
  });
  
  //initialize marquee timer
  var marqueeTimer;
  var marqueeTimeout = function(){
    $(".side-marquee-teaser-item:eq(1)").click();
    marqueeTimer=setTimeout(marqueeTimeout,3000);
  }
  marqueeTimer=setTimeout(marqueeTimeout,3000);
  
  //clear timer when hovering
  $("#side-viewport").mouseenter(function(){
    clearTimeout(marqueeTimer);
  });
  //reset timer when leaving
  $("#side-viewport").mouseleave(function(){
    marqueeTimer=setTimeout(marqueeTimeout,3000);
  });
  
  //marquee scrolling animation
  var marqueeAnimating = false;
  $(".side-marquee-teaser-item").click(function(){
    //flag animation as running, abort event if animation is in progress
    if( marqueeAnimating || !document.hasFocus() ){return false;}
    marqueeAnimating = true;
    
    //flag targeted elements
    var targetIndex = $(this).prevAll().length;
    $(".side-marquee-content-item:eq("+targetIndex+")").addClass('target');
    $(".side-marquee-teaser-item:eq("+targetIndex+")").addClass('target');
    
    //async opacity animations for contents
    $(".side-marquee-content-item.target").css('visibility','visible').css('opacity',0);
    $(".side-marquee-content-item:first").animate({opacity:0},{duration:600});
    $(".side-marquee-content-item.target").animate({opacity:1},{duration:600,complete:function(){ $(this).css('opacity','inherit'); }}); //complete=to overcome filter artifacts in IE
    //async positioning animation for contents
    $("#side-marquee-content-wrapper").animate({marginTop:-$(".side-marquee-content-item.target").position().top},{duration:600,complete:function(){
      
      //var firstContent = $(".side-marquee-content-item:first");
      //while( firstContent && firstContent.hasClass('target')==false ){
      //  firstContent.stop().css('visibility','hidden').appendTo("#side-marquee-content-wrapper");
      //  firstContent = $(".side-marquee-content-item:first");
      //}
      
      var wrongOrder = $(".side-marquee-content-item.target").prevAll(".side-marquee-content-item");
      var rightOrder = $(".side-marquee-content-item").slice(0,wrongOrder.length);
      
      rightOrder.each(function(i){
        $(this).stop().css('visibility','hidden').appendTo("#side-marquee-content-wrapper");
      });
      
      $("#side-marquee-content-wrapper").css('margin-top',0);
      $(".side-marquee-content-item.target").removeClass('target');
    }});
    
    //positioning animation for teasers
    $("#side-marquee-teaser-wrapper").animate({marginTop:-($(".side-marquee-teaser-item.target").position().top+$(".side-marquee-teaser-item.target").outerHeight(true))},{duration:600,
      step:function(now){
        //move obscured teasers to bottom, replace with placeholder of equal height (make sure it doesn't move the target)
        while( !$(".side-marquee-teaser-item:first").hasClass('target') && $(".side-marquee-teaser-item:first").position().top+$(".side-marquee-teaser-item:first").outerHeight(true)<Math.abs(now) ){
          $("#side-marquee-teaser-wrapper").prepend('<div class="side-marquee-teaser-item-placeholder" style="height:'+$(".side-marquee-teaser-item:first").outerHeight(true)+'px;"></div>');
          $(".side-marquee-teaser-item:first").css('opacity',0).appendTo("#side-marquee-teaser-wrapper");
        }
        //set cascading opacity on teasers
        $(".side-marquee-teaser-item").each(function(i){
          $(this).css('opacity',1.125-(i/8));
        });
      },
      complete:function(){
        //remove placeholders, fix wrapper margin, flag animation as finished
        $(".side-marquee-teaser-item-placeholder").remove();
        $("#side-marquee-teaser-wrapper").css('margin-top',-$(".side-marquee-teaser-item:first").outerHeight(true));
        $(".side-marquee-teaser-item.target").removeClass('target');
        marqueeAnimating = false;
      }
    });
    
  });
  
  
  /** END - SIDE MARQUEE (2) **/
  
  /** BEGIN - SLIDESHOW **/
  
  //initialize slideshows (if found)
  $(".slideshow-container").each(function(i){
    var container=this;
    //shuffle slide order
    if($(container).hasClass('slideshow-order-random')){
      var elements=[];
      $(container).children(".slideshow-slide").each(function(ii){elements[ii]=this;});
      if($(container).hasClass('slideshow-first-static')){elements.shift();}
      elements.sort(function(){return 0.5-Math.random();});
      $.each(elements,function(){$(container).append(this);});
    }
    //hide all but the first slide
    $(container).children(".slideshow-slide:gt(0)").css('display','none');
    //initialize the animation timer
    var slideshowTimer;
    var slideshowTimeout=function(){
      var prev=$(container).children(".slideshow-slide:eq(0)");
      var next=$(container).children(".slideshow-slide:eq(1)");
      //animate parent slide (this is enough for all browsers except IE)
      next.css('display','block').css('opacity',0).animate({opacity:1},{duration:400,complete:function(){
        $(this).css('opacity','inherit'); //overcome IE opacity=1 glitch
        prev.css('display','none');
        $(container).append(prev);
        slideshowTimer=setTimeout(slideshowTimeout,3000);
      }});
      //animate slide children (run these animations only in IE, which returns false for opacity support - other browsers are smart enough to do it right without this overhead)
      if(!$.support.opacity){
        next.children().css('opacity',0).animate({opacity:1},{duration:400,complete:function(){
          $(this).css('opacity','inherit'); //overcome IE opacity=1 glitch
        }});
      }
    }
    //initialize the first frame's timer
    slideshowTimer=setTimeout(slideshowTimeout,4000);
  });
  
  
  
  /** END - SLIDESHOW **/
  
});