/*
 * ELSlideshowPlayer 1.1
 *
 * Copyright 2010 Estee Lauder - www.esteelauder.com
 * Lovingly crafted By Nick Warner - www.nwarner.com
*/

// Define the player class
var ELSlideshowPlayer = Class.create({ 
  initialize :  function(options){
    this.slideshow =        new ELSlideshow();
    this.is_playing =       false;
    this.timer =            undefined;
    this.feed_url =         options.feed_url || "estee_homepage.xml";
    this.feed_type =        options.feed_type || "xml";  
    this.feed_content =     options.feed_content || undefined;
    this.current_slide_id = options.current_slide_id || 0;
    this.unloading_slide_id =  undefined;
    this.preload_counter =  0;
    this.preload_total =    0;
    this.load_feed();
  },
     
  current_slide: function(){
    return this.find_slide_by_index(this.current_slide_id);
  },
  
  find_slide_by_index: function(index){
    return this.slideshow.slides[index];
  },
  
  find_layer_by: function(property, value){
    var l = undefined;
    this.all_layers().each(function(layer, index){
      if (layer[property] === value) {
        l = layer;
      }
    });
    return l;
  },
  
  all_layers: function(){
    var slide_layers = [];
    this.slideshow.slides.each(function(slide){
      slide_layers = slide_layers.concat(slide.layers);
    });
    return this.slideshow.slides.concat(this.slideshow.overlays, this.slideshow.underlays, slide_layers);
  },
  
  load_feed: function(){
    var player = this;
    
    if (this.feed_url === "direct") { // Use direct data input
      this.parse_feed(this.feed_content);
    } else {
      new Ajax.Request(this.feed_url, { // or fetch a feed
        method: 'get',
        onFailure: function(){console.log("Load Feed Fail.");},
        onSuccess: function(response) {
          player.feed_content = response.responseText;
          player.parse_feed(player.feed_content);
        }
      });
    }
  },
  
  parse_feed : function(feed) {
    var player = this;
    if (player.feed_type === 'xml') {
      player.parse_xml(feed);
    } else if (player.feed_type === 'json') {
      //player.parse_json(feed);
    } else {
      console.log('Data load error.');
    }
    player.preload_layers();
  },
  
  
  setup_player: function(){
    var player = this;
    this.build_pager(); 
    this.add_overlays_and_underlays();
    this.stage_resize();

    this.jump_to_slide(this.current_slide_id);
    if (player.slideshow.autoplay === 'true' || player.slideshow.autoplay === true) {
      player.toggle_autoplay();
    }
  },
  
  toggle_autoplay: function(){
    var player = this;
  
    if (player.is_playing === true) { // stop playing
      player.is_playing = false;
      player.clear_timer();
      
      var layer = player.find_layer_by('name', 'playpause');      
      if (layer) { // looks like play button, assume this is an Image Layer 
        if (layer.assets && layer.assets[0]) {
          $(layer.id).src = layer.assets[0]; // the first asset should be the play image
        }
      }
    } else { // start playing
      player.is_playing = true;
      player.reset_timer();
      var layer = player.find_layer_by('name', 'playpause');      
      if (layer) { // looks like play button, assume this is an Image Layer 
        if (layer.assets && layer.assets[1]) {
          $(layer.id).src = layer.assets[1]; // the first asset should be the pause image
        }
      } 
    }
  },
  
  
  clear_timer: function() {
    clearInterval(this.timer);
  },
    
    
  start_timer: function() {
    var player = this;
    player.clear_timer();
    player.timer = setTimeout(function(){ player.fire_timer(); }, player.current_slide().interval_in_milliseconds());
  },
  
  
  reset_timer: function() {
    var player = this;
    this.clear_timer();
    if (player.is_playing === true) {
      player.start_timer();
    }
  },
  
  
  fire_timer: function() {
    var player = this;
    player.reset_timer();
    player.next_slide();
  },
  

  add_overlays_and_underlays: function(){
    var player = this;
    Element.insert($("ELSlideshowPlayer"), {'top': "<div id='slides'></div>"});
    if (Object.isArray(player.slideshow.underlays)) {
      player.render_layer_set(player.slideshow.underlays, $("ELSlideshowPlayer"), 0); 
      player.run_action_for_layer_set(player.slideshow.underlays, 'onload');
    }
    if (Object.isArray(player.slideshow.overlays)) {
      player.render_layer_set(player.slideshow.overlays, $("ELSlideshowPlayer"), 4000); 
      player.run_action_for_layer_set(player.slideshow.overlays, 'onload');
    }
  },
  
  
  run_action_for_layer_set : function(layer_set, action) {
    var max_delay = 0;
    var delay = 0;  
  
    layer_set.each(function(layer, index) {
      if ((layer[action].actions !== undefined) && (layer[action].actions !== "")) {
        delay = layer[action].run();
      } else {
        if (action === 'onload') { //if no onload animations, just show it
          $(layer.id).setOpacity(1);
          $(layer.id).show(); 
        }
      }
      if (delay > max_delay) {
        max_delay = delay;
      }
    });
    return max_delay;
  },
  
  
  previous_slide: function(){
    var prev_slide_id = this.current_slide_id - 1;
    if (prev_slide_id < 0) {
      prev_slide_id = (this.slideshow.slides.length - 1);
      if ((player.slideshow.loop === true) || (player.slideshow.loop === "true")) {
        player.transition_to_slide(prev_slide_id);
      }
    } else {
      this.transition_to_slide(prev_slide_id);
    }
  },
  
  
  next_slide: function(){
    var player = this;
    var next_slide_id = this.current_slide_id + 1;
    if (next_slide_id === this.slideshow.slides.length) {
      if ((player.slideshow.loop === true) || (player.slideshow.loop === "true")) {
        player.transition_to_slide(0);
      } else {
        if (player.is_playing === true) {
          player.toggle_autoplay();
        }
      }
    } else {
      player.transition_to_slide(next_slide_id);
    }
  },
  
  
  jump_to_slide: function(i){
    var player = this;
    if ($(player.current_slide().id)) {
      //$(this.current_slide().id).hide();
    }
    player.current_slide_id = i;
    player.show_slide();
    player.reset_timer();
    
    // Update pager   
    if (player.pager) {
      for (var p = 0; p < player.slideshow.slides.length; p=p+1) {
        $('pager'+p).src = player.pager.src;
      }
      $('pager'+i).src = player.pager.src_current;
    }
  }, 
  
  
  transition_to_slide: function(i){
    var player = this;
    
    if (i !== player.current_slide_id) {
    
      // Play the onunload animations
      var max_delay = player.run_action_for_layer_set(player.current_slide().layers.concat(player.current_slide()), 'onunload');
  
      // Show new slide after the last one transitions out
      player.clear_timer(); 
      player.jump_to_slide(i);
      
      // Clear old slide
      this.unloading_slide_id = this.current_slide_id;
      setTimeout(function(i){  
        if (player.unloading_slide_id !== player.current_slide_id) {
          var $layer = $(player.find_slide_by_index(player.unloading_slide_id).id);        
          $layer.fade({ from: $layer.getStyle('opacity'), to: 0, duration: 0.5 });            
          $layer.update();
        } 
      }, (max_delay*1000));
    }
  },
  
  
  
  

  preload_layers: function(){
    var player = this;
    player.all_layers().each(function(layer, index) {
      // load images
      if (layer.type === 'image') {
        player.preload_total = player.preload_total + 1;
        layer.image.onLoad = function(){player.preload_counter = player.preload_counter + 1;};                
        layer.image.src = layer.src;
      }

      // load images from assets, if any
      if (layer.assets && layer.assets.length > 0) {
        layer.assets.each(function(asset, index){
          var image = new Image();
          image.src = asset;
        });
      }
    });
    player.wait_for_preload();
  },
  
  
  
  wait_for_preload: function() {
    var player = this;
    var player = this;    
    if (player.preload_counter < player.preload_total) {
      //setTimeout(function(){player.wait_for_preload();}, 200);
      player.setup_player(); // now continue
    } else {
      player.setup_player();
    }
  },



  show_slide: function(){
    var player = this;
    var slide = this.current_slide();
    
    player.render_slide(slide);
    $$('.Slide').each(function(s){ s.setStyle({"zIndex": 997}); });
    $(slide.id).setStyle({"zIndex": 998});
    $(slide.id).show();
  
    // Animate! Now that the slide is loaded, play the onload animations of its layers
    player.run_action_for_layer_set(slide.layers.concat(slide), 'onload');
  },
  
  
  render_slide: function(slide){
    var player = this;
    
    $slide = $(slide.id);
    if ($slide === null) {
      player.render_layer_set([slide], $("slides"), 997);
      $slide = $(slide.id);
    } else {
      $slide.update(); // Empty slide to reset, if it exists
    }
    
    player.render_layer_set(slide.layers, $slide, 2000);
  },
  
  
  render_layer_set: function(layer_set, $element, z_level) {  
    var player = this;
    if (Object.isArray(layer_set) && (layer_set.length > 0)) {    
      layer_set.each(function(layer, index) {
        if (layer.type === "image") {
          Element.insert($element, {'top': "<img class='Image "+layer.name+"' id='"+layer.id+"' style='top:"+layer.y+"px; left:"+layer.x+"px;' src='"+layer.src+"' />"});               
        }
        if (layer.type === "text") {
          Element.insert($element, {'top': "<a class='Text "+layer.name+"' id='"+layer.id+"' style='top:"+layer.y+"px; left:"+layer.x+"px; color:"+layer.color+"; font:"+layer.fontsize+"px "+layer.font+"; letter-spacing:"+layer.letterspacing+"px; '>"+layer.text+"</a>"});   // font-family:"+text.font+";            
        }
        if (layer.type === "slide") {
          Element.insert($element, {'top': "<div class='Slide "+layer.name+"' id='"+layer.id+"' style='top:"+layer.y+"px; left:"+layer.x+"px;'></div>"});            
        }
        $layer = $(layer.id);
        $layer.setOpacity(0.0);
        $layer.setStyle({'zIndex': z_level + index});
        if (layer.width) {
          $layer.setStyle({'width': layer.width});
        } else {
          $layer.setStyle({'width': player.slideshow.width});
        }
        if (layer.height) {
          $layer.setStyle({'height': layer.height});
        } else {
          $layer.setStyle({'height': player.slideshow.height});
        }        
        if (layer.onclick.actions) {
          $(layer.id).setStyle({'cursor': 'pointer'});
        }
        player.bind_events_for_layer(layer);
      });
    }
  },
  
  
  bind_events_for_layer: function(layer){
    $(layer.id).observe('click', function(event) {
      layer.onclick.run();
    });
    $(layer.id).observe('mouseover', function(event) {
      layer.onmouseover.run();
    });
    $(layer.id).observe('mouseout', function(event) {
      layer.onmouseout.run();
    });
  },
  


  build_pager : function() {
    var player = this;
    
    if (player.pager) {
      player.slideshow.slides.each(function(slide, index){      
        var pager_layer = new ELImage("pager"+index);
       
        pager_layer.src =     player.pager.src;
        pager_layer.image.src = pager_layer.src;
        
        pager_layer.x =       player.pager.start_x + (player.pager.width * index);
        pager_layer.y =       player.pager.start_y; 
        pager_layer.width =   player.pager.width;
        pager_layer.height =  player.pager.height;       
        
        pager_layer.onload = new ELAction(pager_layer, player.pager.onload_action, player);
        pager_layer.onmouseover = new ELAction(pager_layer, player.pager.onmouseover_action, player);
        pager_layer.onmouseout = new ELAction(pager_layer, player.pager.onmouseout_action, player);
        pager_layer.onclick = new ELAction(pager_layer, "{script: 'slideshow_player.transition_to_slide("+index+");'}", player);
        
        player.slideshow.overlays.push(pager_layer);
      });
    }
  },
  
  
  stage_resize: function(){
    var player = this;
    $('ELSlideshowPlayer').setStyle({'width': player.slideshow.width, 'height': player.slideshow.height});
    $('slides').setStyle({'width': player.slideshow.width, 'height': player.slideshow.height});  
    
    player.slideshow.slides.each(function(slide) {
      slide.width = player.slideshow.width;
      slide.height = player.slideshow.height;
    });
  },

  


  hexify_color: function(color){
    if (color === null) {
      color = undefined;
    }
    if (color !== undefined) {
      if (color.indexOf("0x") !== -1) {
        color = "#" + color.substring(2);
      }
    }
    return color;
  }
  
/* // Removed since all urls are now relative or absolute, no relying on url_host
  build_url: function(host, url){
    if (url === null) {
      url = undefined;
    }
    if (url !== undefined) {
      if (url.indexOf("://") === -1) {
        url = host + url; 
      }
    }
    return url;
  }
*/


});




// DEBUG----------------

var c_counter =0;
function c(s) {  
  if (s === undefined) {
    c_counter = c_counter + 1;
    s = c_counter;
  }
  console.log(s);
}