/**
 * @description slideshow<br />
 * 
 * @author bKarolyi
 */


/**
 * @description slideshow handler class
 * @class
 */
var slideshow_class = function()
{
  this.cardwidth = 0;
  this.cardwidth_modifier = 0,
  this.cardwidth_total = 0, 
  this.slider_id = "";
  this.cardwrap = null;
  this.animate = false;
  this.loop = false;
  this.card_list = [];
  this.actual_counter_position = 0;
  this.leftbutton = null;
  this.rightbutton = null;
  this.inactivebutton_class = "";
}

/**
 * @description slideshow handler methods
 * @namespace
 */
slideshow_class.prototype =
{
  /**
   * @description sets up slideshow
   * @param {Object} config <b>available options: </b><br />
   * <i>cardwidth:</i> width of the card in px,<br />
   * <i>cardwidth_modifier:</i> extra pixels for the width like margin<br />
   * <i>slider_id:</i> prefix id for the necessary fields<br />
   * <i>inactivebutton_class:</i> the class name the scroller button gets when became inactive<br />
   * <i>animation_time:</i> animation duration in millisecs<br />
   * <i>animate:</i> boolean - whether the scrolling is animated or not<br />
   * <i>loop:</i> boolean - whether the scrolling restarts when it ends or not<br />
   */
  construct: function( config )
  {
    for ( i in config )
    {
      this[i] = config[i];
    }
    
    this.cardwidth_total = this.cardwidth + this.cardwidth_modifier;
    this.cardwrap = Dom.get( this.slider_id + "_cardwrap" );
    this.cards_length = this.cards_length || 1;
    
    var slideshow_counter = 1;
    while ( Dom.get( this.slider_id + "_item_" + slideshow_counter ) )
    {
      this.card_list.push( Dom.get( this.slider_id + "_item_" + slideshow_counter ) );
      slideshow_counter++;
    }
    
    this.leftbutton = Dom.get( this.slider_id + "_leftbutton" );
    this.rightbutton = Dom.get( this.slider_id + "_rightbutton" );
  },
  
  /**
   * @description gets actual left coordinate of the wrap element
   * @returns {Number} left coordinate in px
   */
  getActLeft: function()
  {
    return parseInt( Dom.getStyle( this.cardwrap, "left" ) ) || 0;
  },
  
  /**
   * @description sets left coordinate of the wrap element
   * @param {Number} new_left left coordinate in px
   */
  setLeft: function( new_left )
  {
    Dom.setStyle( this.cardwrap, "left", new_left + "px" );
    return true;
  },
  
  /**
   * @description increases or decreases the left coordinate of the wrap element
   * @param {Number} by the amount to change the left value with. in px
   */
  setLeftBy: function( by )
  {
    var act_left = this.getActLeft();
    var new_left = act_left + by;
    Dom.setStyle( this.cardwrap, "left", new_left + "px" );
    return true;
  },
  
  /**
   * @description increases actual card counter
   */
  increaseCounter: function()
  {
    if ( this.actual_counter_position == this.card_list.length - this.cards_length + 1 )
    {
      this.actual_counter_position = 0;
    }
    else
    {
      this.actual_counter_position++;
    }
    
    return true;
  },

  /**
   * @description decreases actual card counter
   */  
  decreaseCounter: function()
  {
    if ( this.actual_counter_position == 0 )
    {
      this.actual_counter_position = this.card_list.length - 1;
    }
    else
    {
      this.actual_counter_position--;
    }
    
    return true;
  },

  /**
   * @description steps left one card
   */
  stepLeft: function()
  {
    this.moveLast();
    
    Dom.removeClass( this.rightbutton, this.inactivebutton_class );
    if ( this.actual_counter_position == 0 && !this.loop )
    {
      return false;
    }
    
    if ( this.actual_counter_position == 1 && !this.loop )
    {
      Dom.addClass( this.leftbutton, this.inactivebutton_class );
    }
    this.setLeftBy( this.cardwidth_total );
    this.decreaseCounter();
    return true;
  },

  /**
   * @description validation and settings before stepping right
   */
  beforeStepRight: function()
  {
    this.moveFirst();

    Dom.removeClass( this.leftbutton, this.inactivebutton_class );
    if ( this.actual_counter_position == this.card_list.length - this.cards_length && !this.loop )
    {
      return false;
    }
    
    if ( this.actual_counter_position == this.card_list.length - 1 - this.cards_length && !this.loop )
    {
      Dom.addClass( this.rightbutton, this.inactivebutton_class );
    }
    
    return true;
  },
  
  /**
   * @description steps right one card
   */
  stepRight: function()
  {
    if ( !this.beforeStepRight() )
    {
      return false;
    }
    
    this.setLeftBy( -this.cardwidth_total );
    this.increaseCounter();
        
    return true;
  },

  /**
   * @description moves first card to the end. used when loopin set to true
   */
  moveFirst: function()
  {
    if ( !this.loop )
    {
      return false;
    }
    
    if ( this.actual_counter_position == this.card_list.length - this.cards_length )
    {
      Dom.insertAfter( this.card_list[0], this.card_list[ this.card_list.length -1 ] );
      this.card_list.push( this.card_list.shift() );
      this.setLeftBy( this.cardwidth_total );
      this.decreaseCounter();
    }
    
    return true;
  },
  
  /**
   * @description moves last card to the first place. used when loopin set to true
   */
  moveLast: function()
  {
    if ( !this.loop )
    {
      return false;
    }
    
    if ( this.actual_counter_position == 0 )
    {
      Dom.insertBefore( this.card_list[ this.card_list.length -1 ], this.card_list[0] );
      this.card_list.unshift( this.card_list.pop() );
      this.setLeftBy( -this.cardwidth_total );
      this.increaseCounter();
    }
    
    return true;
  },
  
  
  
  
  //animation
  /**
   * @description whether the animation is running
   * @type {Boolean}
   */
  is_animating: false,
  
  /**
   * @description if animation is running stores the animation object
   * @type {Object}
   */
  animation_obj: null,

  /**
   * @description animation object to the left
   * @type {Object}
   */  
  left_anim: null,
  
  /**
   * @description steps left one card animated
   */
  stepLeftAnim: function()
  {
    if ( this.is_animating )
    {
      return false;
    }

    this.moveLast();

    Dom.removeClass( this.rightbutton, this.inactivebutton_class );
    
    if ( this.actual_counter_position == 1 && !this.loop )
    {
      Dom.addClass( this.leftbutton, this.inactivebutton_class );
    }
    
    if ( this.actual_counter_position == 0 && !this.loop )
    {
      return false;
    }
    
    if ( !this.left_anim )
    {
      var new_left = this.cardwidth_total;
      this.left_anim = this.left_anim || new YAHOO.util.Anim( this.cardwrap, 
                                                                {
                                                                  left: { by: new_left } 
                                                                },
                                                                this.animation_time / 1000
                                                              );
  
      this.left_anim.onComplete.subscribe( this.stepLeftAnimCallback, this, true );
    }
    this.is_animating = true;
    this.animation_obj = this.left_anim;
    this.left_anim.animate();
    
    return true;
  },

  /**
   * @description callback function for left animation. runs when it ends
   */   
  stepLeftAnimCallback: function()
  {
    this.decreaseCounter();
    this.animation_obj = null;
    this.is_animating = false;
    return true;
  },
  
  /**
   * @description animation object to the left
   * @type {Object}
   */
  right_anim: null,
  
  /**
   * @description steps right one card animated
   */
  stepRightAnim: function()
  {
    if ( this.is_animating )
    {
      return false;
    }

    this.moveFirst();

    Dom.removeClass( this.leftbutton, this.inactivebutton_class );
    if ( this.actual_counter_position == this.card_list.length - this.cards_length && !this.loop )
    {
      return false;
    }
    
    if ( this.actual_counter_position == this.card_list.length - 1 - this.cards_length && !this.loop )
    {
      Dom.addClass( this.rightbutton, this.inactivebutton_class );
    }
    
    if ( !this.right_anim )
    {
      var new_left = - this.cardwidth_total;
      this.right_anim = this.right_anim || new YAHOO.util.Anim( this.cardwrap, 
                                                                {
                                                                  left: { by: new_left } 
                                                                },
                                                                this.animation_time / 1000
                                                              );
  
      this.right_anim.onComplete.subscribe( this.stepRightAnimCallback, this, true );
    }
    this.is_animating = true;
    this.animation_obj = this.right_anim;
    this.right_anim.animate();
    return true;
  },
  
  /**
   * @description callback function for right animation. runs when it ends
   */
  stepRightAnimCallback: function()
  {
    this.increaseCounter();
    this.animation_obj = null;
    this.is_animating = false;
    return true;
  }
}

var slideshow_selectable_class = function( config )
{
  slideshow_class.call( this, config );
  this.is_during_delay = false;
  this.delay_obj = null;
  this.slide_is_running = false;
}

/**
 * @description advanced slideshow methods
 * @namespace
 */
slideshow_selectable_class.prototype = new slideshow_class();
slideshow_selectable_class.prototype.constructor = slideshow_class;
slideshow_selectable_class.prototype.selectPicture = function( picnum )
{
  var thumbpic_el = Dom.get( this.slider_id + "_thumb_" + picnum );
  var normalpic_el = Dom.get( this.slider_id + "_normalimage" );
  var normallink_el = Dom.get( this.slider_id + "_normallink" );
  //var normalpic_src = thumbpic_el.src.replace( /_thumb/, "" );
  var normalpic_src = thumbpic_el.src.replace( "_kis_", "_kozepes_" );
  var bigpic_src = thumbpic_el.src.replace( /_thumb/, "_main" );
  //normalpic_el.src = bigpic_src;
 // normallink_el.href = normalpic_src;
 // normallink_el.href = thumbpic_el.src.replace( "_kis_", "_nagy_" );
  document.getElementById('slideshow_normalimage').src = normalpic_src;

  return true;
};

/**
 * @description slideshow functions on the bottom of the page
 * @namespace 
 */
var slideshow =
{
  /**
   * @description slideshow class for methods and properties
   * @type {Object} 
   */
  handler_class: null,
  
  /**
   * @description configuration options for the class
   * @type {Object}
   */
  options:
  {
    cardwidth: 70,
    cardwidth_modifier: 3,
    slider_id: "slideshow",
    inactivebutton_class: "inactivebutton",
    thumb_picid_pattern: "thumb",
    normal_picid_pattern: "normal",
    big_picid_pattern: "big",
    cards_length: 3,
    animation_time: 500,
    animate: true,
    loop: false
  },
  
  /**
   * @description sets handler class
   */
  initClass: function()
  {
    if ( this.handler_class )
    {
      return true;
    }
    this.handler_class = new slideshow_selectable_class();
    this.handler_class.construct( this.options );
    return true;  
  },
  
  /**
   * @description steps left one card
   */
  stepLeft: function()
  {
    this.initClass();
    if ( this.options.animate )
    {
      this.handler_class.stepLeftAnim();
    }
    else
    {
      this.handler_class.stepLeft();
    }
    return true;
  },
  
  /**
   * @description steps right one card
   */
  stepRight: function()
  {
    this.initClass();
    if ( this.options.animate )
    {
      this.handler_class.stepRightAnim();
    }
    else
    {
      this.handler_class.stepRight();
    }
    return true;
  },
  
  selectPicture: function( picnum )
  {
    this.initClass();
    this.handler_class.selectPicture( picnum );
    return true;
  }
}
