function SlideShow(imagearr, divname, numbering, padding, dev, background)
{
   this.CurrentSlide = 0;
   this.numbering = numbering;
   this.SlideReady = true;
   this.divname = divname;
   this.imageid = divname+"_screen";
   this.Slides = imagearr;
   this.div = document.getElementById(divname);
   
   if(dev)
   {
      this.url = "http://www.motionxdev.com";
   }
   else
   {
	  this.url = "http://www.motionx.com";
   }
	
	if(background)
	{
	   this.	background = this.url+background;
	}
	else
	{
	   this.background = "http://www.motionx.com/1_layout/tutorial_backdrop.jpg";
	}
  
   
   this.ShowSlide = function(Direction) 
   {
      NextSlide = this.CurrentSlide + Direction;
	  if(NextSlide == -1)
	  {
	     NextSlide = this.Slides.length-1;  
	  }
	  else if(NextSlide == this.Slides.length)
	  {
		 NextSlide = 0;  
	  }
      document.getElementById(this.imageid).src = this.Slides[NextSlide].src;
      this.CurrentSlide = NextSlide++;
	  if(this.numbering)
	  {
	     this.selectButton(NextSlide-1);
	  }
      return true;
   }

   this.goToSlide = function(value)
   {
      NextSlide = value;
      document.getElementById(this.imageid).src = this.Slides[NextSlide].src;
      this.CurrentSlide = NextSlide++;
	  if(this.numbering)
	  {
         this.selectButton(NextSlide-1);
	  }
   }
   this.selectButton = function(value)
   {
      var limit = 3;
      var leftend = false;
      var rightend = false;
      var offset = 0;
      if(value < limit)
      {
         offset = limit-value;
         if(value == 0)
	     {
            document.getElementById(this.divname+'_prevbutton').style.display = "none";
		    leftend = true;
	     }
	     else
	     {
	        document.getElementById(this.divname+'_prevbutton').style.display = "block";
	     }
      }
      else
      {
         document.getElementById(this.divname+'_prevbutton').style.display = "block";
      }
      if(value > this.Slides.length-1-limit)
      {
         offset = value-this.Slides.length-1-limit;
         if(value == this.Slides.length-1)
	     {
            document.getElementById(this.divname+'_nextbutton').style.display = "none";
		    rightend = true;
	     }
	     else
	     {
	        document.getElementById(this.divname+'_nextbutton').style.display = "block";
	     }
      }
      else
      {
         document.getElementById(this.divname+'_nextbutton').style.display = "block";
      }
      if(offset == 0 || offset == 1 || value == this.Slides.length-1-2) 
      {
         limit -= 1;
      }
      var x = 0;
      while(x < this.Slides.length)
      {
         if(rightend==false && leftend==false && (x < value-limit || x > value+limit))
	     {
	        document.getElementById(this.divname+"_selector"+x).style.display = "none";
	     }
	     else if(leftend==true && (x < value-limit+offset || x > value+limit*2))
	     {
	        document.getElementById(this.divname+"_selector"+x).style.display = "none";
	     }
	     else if(rightend==true && (x < value-limit*2 || x > value+limit-offset))
	     {
	        document.getElementById(this.divname+"_selector"+x).style.display = "none";
	     }
	     else
	     {
	        document.getElementById(this.divname+"_selector"+x).style.display = "block";
	     }
         document.getElementById(this.divname+"_selector"+x).style.backgroundColor = "#FFFFFF";
	     x++;
      }
      document.getElementById(this.divname+"_selector"+value).style.backgroundColor = "#CCCCCC";
   }

   this.CacheImage = function(ImageSource) 
   {
      var ImageObject = new Image();
      ImageObject.src = ImageSource;
      return ImageObject;
   }

   var i = 0;
   while(i < this.Slides.length)
   {
      this.Slides[i] = this.CacheImage(this.Slides[i]);
      i++;   
   }
   

	  this.div.innerHTML += "<table border='0' align='center' cellpadding='6' cellspacing='0'><tr><td align='left' valign='middle'><img src='http://www.motionx.com/1_layout/left-blue-one.png' width='53' height='103' border='0' alt='Previous' style='cursor:pointer;' onmousedown='"+this.divname+".ShowSlide(-1)' /></td><td align='center' valign='middle' background='"+this.background+"' ><img src='"+this.Slides[0].src+"' border='0' alt='MotionX-Drive' id='"+this.imageid+"' /></td><td align='right' valign='middle'><img src='http://www.motionx.com/1_layout/right-blue-one.png' width='53' height='103' border='0' alt='Next' style='cursor:pointer;' onmousedown='"+divname+".ShowSlide(1)' /></td></tr></table>";
	
	
  if(numbering)
   {
	  this.div.innerHTML += "<div style='width:"+padding+"px; float:left;'>&nbsp;</div>";
      this.div.innerHTML += "<a style='cursor:pointer;' class='button1' id='"+this.divname+"_prevbutton' onmousedown='javascript:"+this.divname+".ShowSlide(-1);'>Prev</a>";
      i = 0;
      while(i < this.Slides.length)
      {
	     this.div.innerHTML += "<a class='button' id='"+this.divname+"_selector"+i+"' href='javascript:"+this.divname+".goToSlide("+i+");'>"+(i+1)+"</a>";
         i++;   
      }
      this.div.innerHTML += "<a style='cursor:pointer;' class='button1' id='"+this.divname+"_nextbutton' onmousedown='javascript:"+this.divname+".ShowSlide(1);'>Next</a>";
	  this.selectButton(0);
	  this.div.innerHTML += "<div style='clear:both;'><br/>";
   }
 
   


}



