/*
 
originally found here: http://net.tutsplus.com/tutorials/html-css-techniques/learn-how-to-create-a-retro-animated-flip-down-clock/

simple jQuery Port made by team Odeon. http://od-eon.com

*/
(function($){ 
    $.fn.bannerFlip = function (vars){
    
    var h     = 0;
    var link1  = vars.link1;
    var link2  = vars.link2;
    var link   = link1;
    
    var flip = function(upperId, lowerId, changeNumber, linkpara, pathUpper, pathLower) {
      var upperBackId = upperId+"Back";
            
      $(upperId)
        .attr('src', $(upperBackId).attr('src'))
        .height("49px")
        .css({"visibility": "visible", 'display': 'inline-block' });
        
      $(upperBackId).attr('src', pathUpper + parseInt(changeNumber) + ".png");
      //$(lowerId).append('<a href="' + link + '" >&nbsp;</a>');
        
      $(lowerId)
        .attr('src', pathLower + parseInt(changeNumber) + ".png")
        .height('0px')
        .css({"visibility": "visible", 'display': 'inline-block'});
        
      $(upperId).animate({'height': 0}, { 'duration': 200, defaultEasing: 'easeinoutsine', 'complete': function(){
        $(lowerId).animate({'height': 49}, { 'duration': 200, defaultEasing: 'easeinoutsine', 'complete': function(){
          $(lowerId + "Back").attr('src', $(lowerId).attr('src') );
          $(lowerId).add(upperId).css({"visibility": "hidden", "display": 'inline-block' }).height('0');
        } } )
      } })
      $('a#banner_link').attr({
         'href' : linkpara
      });
    }
  
    var tick = function() {
      flip('#hoursUp', '#hoursDown', h, link, 'fileadmin/Images/banner/up/', 'fileadmin/Images/banner/down/');
      //if(h == 0){
      //  h = 1;
      //  link = link2;
      //}else{
        h = 0;
        link = link1;
      //}
    }
    var retroClock = function(){
      tick();
      setInterval(tick, 7000);
    }
    
    retroClock();
  };
  
  
})(jQuery);