// JScript 文件

function  imageSee()
{
     this.div1 = null;
     this.div2 = null;
     this.div3 = null;
     this.gallery = null;
     
     this.gallery = null;
     this.imageIdx = 0 ; 
}

imageSee.prototype.load = function(div1id,div2id,div3id,galleryid)
{ 

 


      var div = document.getElementById(div1id) ;
      this.div1 = div ; 
      
      div = document.getElementById(div2id) ;
      this.div2 = div ; 
      
      div = document.getElementById(div3id) ;
      this.div3 = div ; 
      
      div = document.getElementById(galleryid) ;
      this.gallery = div ; 
      
      this.loadGallery(this.imageIdx) ;
       
}

imageSee.prototype.loadGallery = function(Idx)
{

 
    if(imageArray == null || imageArray.length == 0 )
       return ;
       
      
   var end = Idx + 4 ;
   var start = Idx    ; 
   
   if(imageArray.length < end )
      end = imageArray.length ;
       
   if(start < 0 )
     start = 0 ;
   var html = "<table cellpadding=2 style='width:auto'><tr>" ;
   for(i = start ; i < end; i ++ )
   {
      var sel = false ;
      if(Idx == i )
        sel = true ;
      if(i == end - 1 && i < imageArray.length-1)  
        html += "<td title='last'>" + this.getGalleryImageHtml2(imageArray[i] , i, sel , 'last')+ "</td>" ;
      else if(i == start)
         html += "<td title='first'>" + this.getGalleryImageHtml2(imageArray[i] , i, sel ,'first')+ "</td>" ;
      else html += "<td>" + this.getGalleryImageHtml2(imageArray[i] , i, sel ,'middle' )+ "</td>" ;
   }
   html += "</tr></table>" ;
   this.gallery.innerHTML = html ; 
   
    
   
}
imageSee.prototype.getGalleryImageHtml2 = function( imageURL, idx , sel, position )
{
   if(sel) 
       return "<image idx='"+String(idx)+"' position='"+position+"'  onclick=\"changeImage2("+ String(idx)+", '"+position+"' )\"  src='"+imageURL+"' width='80px' height='80px' style='cursor:pointer;border:1px;border-color:red;border-style:solid'/>" ;
   return "<image   idx='"+String(idx)+"'  position='"+position+"'    onclick=\"changeImage2("+ String(idx)+", '"+position+"' )\" src='"+imageURL+"' width='80px' height='80px' style='cursor:pointer;border:1px;border-color:#aaaaaa;border-style:solid'/>" ;
} 

imageSee.prototype.getGalleryImageHtml = function( imageURL, idx , sel )
{
   if(sel) 
       return "<image idx='"+String(idx)+"'   onclick='changeImage("+ String(idx)+")' src='"+imageURL+"' width='80px' height='80px' style='cursor:pointer;border:1px;border-color:red;border-style:solid'/>" ;
   return "<image   idx='"+String(idx)+"'    onclick='changeImage("+ String(idx)+")' src='"+imageURL+"' width='80px' height='80px' style='cursor:pointer;border:1px;border-color:#aaaaaa;border-style:solid'/>" ;
} 

imageSee.prototype.leftMove = function(   )
{
   this.imageIdx -- ;
   if(this.imageIdx < 0 )
     this.imageIdx = 0 ;
   this.loadGallery(this.imageIdx) ;
   
} 

imageSee.prototype.rightMove = function(   )
{
   this.imageIdx ++  ;
   if(this.imageIdx > imageArray.length -4 )
     this.imageIdx = imageArray.length - 4 ;
   this.loadGallery(this.imageIdx) ;
   
} 
imageSee.prototype.heighlightSelect= function( idx  )
{
   var selIdx =String(idx)   ; 
   var imgs = this.gallery.getElementsByTagName('image') ;
   if(imgs.length<=0 )
      imgs = this.gallery.getElementsByTagName('img') ;
   for( i = 0 ; i <imgs.length ; i ++ )   
   {
       var imgid = imgs[i].getAttribute("idx") ;
       
       if(selIdx==imgid)
          imgs[i].style.borderColor='red' ;
          else imgs[i].style.borderColor='#aaaaaa' ;
   }
}
imageSee.prototype.changeImage = function( idx  )
{
   var idx1 = idx ;

  if( idx > imageArray.length - 3)
     idx1 = imageArray.length - 3;
    this.div1.innerHTML ='加载图片中，请等待...';
    this.div2.innerHTML = '加载图片中，请等待...';
    this.div3.innerHTML ='加载图片中，请等待...';
    this.heighlightSelect(idx) ;
    if(idx1 < 0 )
      idx1 = 0 ;
     this.div1.innerHTML = this.getImageHtml(imageArray[idx1] , idx1) ;
     var idx2 = idx1 + 1; 
      
     if(idx2 >= imageArray.length)
     {
    
         idx2 = imageArray.length -1 ;
           if(idx2 == idx1)
            
               return ;
         this.div2.innerHTML = this.getImageHtml(imageArray[idx2] , idx2) ;
         
         return ;
     }
     this.div2.innerHTML = this.getImageHtml(imageArray[idx2] , idx2) ;
     var idx3 = idx2 +1;
     
     if(idx3 >= imageArray.length)
     {
        idx3 = imageArray.length -1 ;
        if(idx3 == idx2)
           return ;
         this.div3.innerHTML = this.getImageHtml(imageArray[idx3] , idx3) ;
         return ;
     } 
      this.div3.innerHTML = this.getImageHtml(imageArray[idx3] , idx3) ;
     
      
      
} 

imageSee.prototype.getImageHtml = function( imageURL, idx )
{
   return "<a href='"+imageURL+"' target='_blank'><image   src='"+imageURL+"' width='400px'  style='cursor:pointer;'/></a>" ;
}