/*
 * ELSlideshowAnimations
 *
 * Copyright 2010 Estˇe Lauder - www.esteelauder.com
 * Lovingly crafted By Nick Warner - www.nwarner.com
*/


ELAnimation.addMethods({

  wait : function(layer, parameters){ // Do nothing for a number of seconds
    var seconds = parameters[0] || 1;
    new Effect.Move(layer.id, { x: $(layer.id).left, y: $(layer.id).top, mode: 'absolute', duration: seconds, queue: { position: 'end', scope: layer.id } });
    return seconds;
  },

  fade_in : function(layer, parameters){
    var seconds = parameters[0] || 1;
    new Effect.Opacity(layer.id, { from: 0, to: 1, duration: seconds, queue: { position: 'end', scope: layer.id } });
    return seconds;
  },
  
  fade_out : function(layer, parameters){
    var seconds = parameters[0] || 1;
    new Effect.Opacity(layer.id, { from: 1, to: 0, duration: seconds, queue: { position: 'end', scope: layer.id } });
    return seconds;
  },
  
  fade_to_color : function(layer, parameters){
    var seconds = parameters[0] || 1;
    var color = parameters[1] || "#000";   
    
    Element.insert($(layer.id), {'top': "<div class='animation_fade_to_color'></div>"});
    $(layer.id).select('.animation_fade_to_color').each(function(f){ f.setStyle({"backgroundColor": color}); });
    
    new Effect.Opacity($(layer.id).select('.animation_fade_to_color')[0], { from: 0, to: 1, duration: seconds, queue: { position: 'end', scope: layer.id } });
    
    
    return seconds;
  },
  
  fade_from_color : function(layer, parameters){
    var seconds = parameters[0] || 1;
    var color = parameters[1] || "#000";
    Element.insert($(layer.id), {'top': "<div id='.animation_fade_to_color'></div>"});
    $(layer.id).select('.animation_fade_to_color').each(function(f){ f.setStyle({"backgroundColor": color}); });
    new Effect.Opacity($(layer.id).select('.animation_fade_to_color')[0], { from: 1, to: 0, duration: seconds, queue: { position: 'end', scope: layer.id } });
    return seconds;
  },

  zoom_out : function(layer, parameters) {
    var seconds = parameters[0] || 5;
    var scale_percent = parameters[1] || 120;
    new Effect.Opacity(layer.id, { from: 0, to: 1, duration: 0 });
    //new Effect.Scale(layer.id, scale_percent, { duration: 0, queue: { position: 'end', scope: layer.id } });
    //new Effect.Scale(layer.id, 100, { duration: seconds, queue: { position: 'end', scope: layer.id } });
           
    
    // Firefox    
/*
    $(layer.id).setStyle({"-moz-transform": "scale("+scale_percent/100+")"});
    document.body.offsetWidth;   
    $(layer.id).setStyle({"-moz-transition-property": "-moz-transform"});
    $(layer.id).setStyle({"-moz-transition-duration": seconds+"s"});
    $(layer.id).setStyle({"-moz-transition-timing-function": "ease-in-out"});
    
    document.body.offsetWidth;
    $(layer.id).setStyle({"-moz-transform": "scale(1)"});    
    document.body.offsetWidth;  
*/     
    
            
    // Webkit    
    $(layer.id).setStyle({"-webkit-transform": "scale("+scale_percent/100+")"});
    document.body.offsetWidth;   
    $(layer.id).setStyle({"-webkit-transition-property": "-webkit-transform"});
    $(layer.id).setStyle({"-webkit-transition-duration": seconds+"s"});
    $(layer.id).setStyle({"-webkit-transition-timing-function": "ease-in-out"});
    
    document.body.offsetWidth;
    $(layer.id).setStyle({"-webkit-transform": "scale(1)"});    
    document.body.offsetWidth;
   
    return seconds;
  },
  
  zoom_in : function(layer, parameters) {
    var seconds = parameters[0] || 5;
    var scale_percent = parameters[1] || 120;
    new Effect.Opacity(layer.id, { from: 0, to: 1, duration: 0 });
   // new Effect.Scale(layer.id, scale_percent, { duration: seconds, queue: { position: 'end', scope: layer.id } });
   
    // Firefox
/*
    $(layer.id).setStyle({"-moz-transition-property": "-moz-transform"});
    $(layer.id).setStyle({"-moz-transition-duration": seconds+"s"});
    $(layer.id).setStyle({"-moz-transition-timing-function": "ease-in-out"});
    
    document.body.offsetWidth;
    $(layer.id).setStyle({"-moz-transform": "scale("+scale_percent/100+")"});    
    document.body.offsetWidth;
*/

    // Webkit
    $(layer.id).setStyle({"-webkit-transition-property": "-webkit-transform"});
    $(layer.id).setStyle({"-webkit-transition-duration": seconds+"s"});
    $(layer.id).setStyle({"-webkit-transition-timing-function": "ease-in-out"});
    
    document.body.offsetWidth;
    $(layer.id).setStyle({"-webkit-transform": "scale("+scale_percent/100+")"});    
    document.body.offsetWidth;
   
    return seconds;
  },
  
  slide_in_from_right : function(layer, parameters) {
    var seconds = parameters[0] || 5;
    var move_to_x = parameters[1] || layer.x;
    var move_to_y = parameters[2] || layer.y;
    $(layer.id).setStyle({'left': this.player.slideshow.width});
    $(layer.id).setOpacity(1); 
    new Effect.Move(layer.id, { x: move_to_x, y: move_to_y, mode: 'absolute', duration: seconds, queue: { position: 'end', scope: layer.id } });
    return seconds;
  },
  
  slide_in_from_left : function(layer, parameters) {
    var seconds = parameters[0] || 5;
    var move_to_x = parameters[1] || layer.x;
    var move_to_y = parameters[2] || layer.y;
    $(layer.id).setStyle({'left': (0-layer.width)});
    $(layer.id).setOpacity(1); 
    new Effect.Move(layer.id, { x: move_to_x, y: move_to_y, mode: 'absolute', duration: seconds, queue: { position: 'end', scope: layer.id } });
    return seconds;
  },
  
  slide_to_from : function(layer, parameters) {
    var seconds = parameters[0] || 5;
    var move_to_x = parameters[1] || 0;
    var move_to_y = parameters[2] || 0;
    var move_from_x = parameters[3] || 0;
    var move_from_y = parameters[4] || 0;
    $(layer.id).setStyle({'left': move_from_x, 'top': move_from_y}); 
    new Effect.Move(layer.id, { x: move_to_x, y: move_to_y, mode: 'absolute', duration: seconds, queue: { position: 'end', scope: layer.id } });
    return seconds;
  },
  
  
  slide_out_to_left : function(layer, parameters) {
    var seconds = parameters[0] || 5; 
    new Effect.Move(layer.id, { x: (0 - layer.width), y: layer.y, mode: 'absolute', duration: seconds, queue: { position: 'end', scope: layer.id } });
    return seconds;
  },
  
  slide_out_to_right : function(layer, parameters) {
    var seconds = parameters[0] || 5; 
    new Effect.Move(layer.id, { x: this.player.slideshow.width, y: layer.y, mode: 'absolute', duration: seconds, queue: { position: 'end', scope: layer.id } });
    return seconds;
  },  

  slide_in_from_top : function(layer, parameters) {
    var seconds = parameters[0] || 5; 
    var move_to_x = parameters[1] || layer.x;
    var move_to_y = parameters[2] || layer.y;
    $(layer.id).setStyle({'top': (0 - layer.height)});
    new Effect.Move(layer.id, { x: move_to_x, y: move_to_y, mode: 'absolute', duration: seconds, queue: { position: 'end', scope: layer.id } });
    return seconds;
  },  
    
  slide_in_from_bottom : function(layer, parameters) {
    var seconds = parameters[0] || 5; 
    var move_to_x = parameters[1] || layer.x;
    var move_to_y = parameters[2] || layer.y;
    $(layer.id).setStyle({'top': this.player.slideshow.height});
    new Effect.Move(layer.id, { x: move_to_x, y: move_to_y, mode: 'absolute', duration: seconds, queue: { position: 'end', scope: layer.id } });
    return seconds;
  }, 
  
  slide_out_to_top : function(layer, parameters) {
    var seconds = parameters[0] || 5; 
    new Effect.Move(layer.id, { x: layer.x, y: (0 - layer.height), mode: 'absolute', duration: seconds, queue: { position: 'end', scope: layer.id } });
    return seconds;
  },  
    
  slide_out_to_bottom : function(layer, parameters) {
    var seconds = parameters[0] || 5; 
    new Effect.Move(layer.id, { x: this.player.slideshow.height, y: layer.y, mode: 'absolute', duration: seconds, queue: { position: 'end', scope: layer.id } });
    return seconds;
  }
});