var slide = {

  init : function(initial){
    this.first = initial;
    this.sObj = document.getElementById('slide');
    this.img_div = document.getElementById('img-list');
    this.lArrow = document.getElementById('left_arrow');
    this.lArrow.style.visibility = 'hidden';
    this.rArrow = document.getElementById('right_arrow');
    this.rArrow.style.visibility = 'visible';
    this.img_div.style.top = 0+'px';
    this.img_div.style.left = 0+'px';
    this.sObj_li = this.sObj.getElementsByTagName('li');
    this.clicks = this.sObj_li.length - this.first;
    this.clicked = 0;
    if(this.sObj_li.length <= this.first)
    {
      this.lArrow.style.visibility = 'hidden';
      this.rArrow.style.visibility = 'hidden';
    }
    slide.initBigImage();
  },

  slideLeft : function(){
    this.offset = this.sObj_li[this.clicked+this.first].offsetWidth;
    if(this.clicked < this.clicks)
    {
      this.clicked++;
      this.leftMov = 0;
      if(this.clicked == this.clicks)
      {
        this.rArrow.style.visibility = 'hidden';
        this.lArrow.style.visibility = 'visible';
      }
      else
      {
        this.rArrow.style.visibility = 'visible';
        this.lArrow.style.visibility = 'visible';
      }
      slide.doSlideLeft();
    }
  },

  slideRight : function(){
    this.offset = this.sObj_li[this.clicked-1].offsetWidth;
    if(this.clicked > 0)
    {
      this.clicked--;
      this.rightMov = 0;
      if(this.clicked == 0)
      {
        this.lArrow.style.visibility = 'hidden';
        this.rArrow.style.visibility = 'visible';
      }
      else
      {
        this.rArrow.style.visibility = 'visible';
        this.lArrow.style.visibility = 'visible';
      }
      slide.doSlideRight();
    }
  },

  slideDown : function(){
    this.offset = this.sObj_li[this.clicked+this.first].offsetHeight;
    if(this.clicked < this.clicks)
    {
      this.clicked++;
      this.downMov = 0;
      if(this.clicked == this.clicks)
      {
        this.rArrow.style.visibility = 'hidden';
        this.lArrow.style.visibility = 'visible';
      }
      else
      {
        this.rArrow.style.visibility = 'visible';
        this.lArrow.style.visibility = 'visible';
      }
      slide.doSlideDown();
    }
  },

  slideUp : function(){
    this.offset = this.sObj_li[this.clicked-1].offsetHeight;
    if(this.clicked > 0)
    {
      this.clicked--;
      this.topMov = 0;
      if(this.clicked == 0)
      {
        this.lArrow.style.visibility = 'hidden';
        this.rArrow.style.visibility = 'visible';
      }
      else
      {
        this.rArrow.style.visibility = 'visible';
        this.lArrow.style.visibility = 'visible';
      }
      slide.doSlideUp();
    }
  },

  doSlideLeft : function(){
    if(this.leftMov < this.offset){
      this.img_div.style.left = (parseInt(this.img_div.style.left) - 10)+'px';
      this.leftMov += 10;
      this.timer = setTimeout("slide.doSlideLeft()",10);
    }
    else
    {
      this.img_div.style.left = (parseInt(this.img_div.style.left) - (this.offset - this.leftMov))+'px';
      window.clearTimeout(this.timer);
    }
  },

  doSlideRight : function(){
    if(this.rightMov < this.offset){
        this.img_div.style.left = (parseInt(this.img_div.style.left) + 10)+'px';
        this.rightMov += 10;
        this.timer = setTimeout("slide.doSlideRight()",10);
    }
    else
    {
      if(this.clicked != 0)
      {
        this.img_div.style.left = (parseInt(this.img_div.style.left) + (this.offset - this.rightMov))+'px';
      }
      else
      {
        this.img_div.style.left = 0+'px';
      }
      window.clearTimeout(this.timer);
    }
   },

   doSlideDown : function(){
    if(this.downMov < this.offset){
      this.img_div.style.top = (parseInt(this.img_div.style.top) - 10)+'px';
      this.downMov += 10;
      this.timer = setTimeout("slide.doSlideDown()",10);
    }
    else
    {
      this.img_div.style.top = (parseInt(this.img_div.style.top) - (this.offset - this.downMov))+'px';
      window.clearTimeout(this.timer);
    }
  },

  doSlideUp : function(){
    if(this.topMov < this.offset){
        this.img_div.style.top = (parseInt(this.img_div.style.top) + 10)+'px';
        this.topMov += 10;
        this.timer = setTimeout("slide.doSlideUp()",10);
    }
    else
    {
      if(this.clicked != 0)
      {
        this.img_div.style.top = (parseInt(this.img_div.style.top) + (this.offset - this.topMov))+'px';
      }
      else
      {
        this.img_div.style.top = 0+'px';
      }
      window.clearTimeout(this.timer);
    }
   },

  initBigImage : function(){
    this.imgHolder = document.getElementById('big_image');
    this.img = this.img_div.getElementsByTagName('img');
    this.imgHolder.innerHTML = '<img src="'+this.img[0].src+'" />';
    for(i=0;i<this.img.length;i++){
      this.img[i].onclick = function(){
        slide.replaceImage(this.src);
      }
    }
  },

  replaceImage : function(src){
    this.opac = 100;
    slide.lightDown();
    //this.imgHolder.innerHTML = '<img src="'+src+'" />';
  },

  lightDown : function(){
    if(this.opac != 0){
      this.opac -= 10;
      this.imgHolder.style.MozOpacity = this.opac/10;
      this.timer = setTimeout("slide.lightDown()",1000);
    }
    else{
      window.clearTimeout(this.timer);
    }
  }
}