/*
 * Default View
 * 
 */
ZACK.kit.timoView=function(carousel){
  this.currentImage=0;
  this.tooltip=null;
  this.carousel=carousel;
}


ZACK.kit.timoView.prototype={

  render: function(data){
  	
    this.imgList=data.toc || data.items;
    var numItems=this.imgList.length;
    var imgListDiv=$('imgList');

    for(i=0;i<this.imgList.length;i++){
        var img=new Image();
        img.src=this.imgList[i].media.s;
        YAHOO.util.Event.on(img, 'click', this.showImageEvnt, i, this);
        imgListDiv.appendChild(img);
    }

    /* preloading images
    if(YAHOO.env.ua.ie>=7 || YAHOO.env.ua.gecko || YAHOO.env.ua.opera)
      for(i=0;i<this.imgList.length;i++){
        this.imgList[i].img=new Image();
        this.imgList[i].img.src=this.imgList[i].media.l;
      }*/
  
    // dom ready?
    this.showImage(0);
  },
  
  nextPreviousImage: function(delta){
    var ni=this.currentImage+delta;
	var first=this.carousel.getFirstVisible();
	var last=this.carousel.getLastVisible();
    if(ni<0){
	  ni=0;
	  if(ni+1<first)
	    this.carousel.scrollTo(ni+1)
      return this.showImage(0);
	}
    if(ni>this.imgList.length-1){
	  if(last<this.imgList.length)
	    this.carousel.scrollTo(this.imgList.length)
      return this.showImage(this.imgList.length-1);
	}
	if(ni+1<first || ni+1>last)
      this.carousel.scrollTo(ni+1)
    this.showImage(ni);
  },
  
  sizeImageOnLoad: function(e, imgL){

    var boxH=476; 
    if(imgL.clientHeight>boxH){
	  imgL.style.width = Math.round(imgL.clientWidth * (boxH/imgL.clientHeight)) + "px"; 	
	  imgL.style.height = boxH + "px";
    }
    var boxW=640; // 
    if(imgL.clientWidth>boxW){
	  imgL.style.height = Math.round(imgL.clientHeight * (boxW/imgL.clientWidth)) + "px"; 	
	  imgL.style.width = boxW + "px";
    }
    imgL.style.visibility='visible';
    //$('imgDiv').style.height=imgL.style.height;
    //$('imgInfo').style.width=imgL.style.width;
  },
  
  showImageEvnt: function(e, id){
    return this.showImage(id)
  },
  
  showImage: function(id){
    if(thumb=$('car-thumb-'+(this.currentImage+1))){
      YAHOO.util.Dom.setStyle(thumb, 'opacity', 0.6);  
      YAHOO.util.Dom.setStyle(thumb, 'border', '0px');  
    }
    this.currentImage=id;
    YAHOO.util.Dom.setStyle('car-thumb-'+(id+1), 'border-bottom', '4px solid #FF6633');  
    YAHOO.util.Dom.setStyle('car-thumb-'+(id+1), 'opacity', 1);  
    if($('imgDiv').style.display=='none'){
      $('imgList').style.display='none';
      //$('imgInfo').style.display='none';
      $('imgDiv').style.display='block';
    }
    $('imgDiv').innerHTML='';
    
    var imgL=document.createElement('img');
    imgL.src=this.imgList[id].media.l;
    imgL.style.visibility='hidden';
    YAHOO.util.Event.on(imgL, 'click', this.showInfo, id, this);
    YAHOO.util.Event.on(imgL, 'load', this.sizeImageOnLoad, imgL, this);
    $('imgDiv').appendChild(imgL)
  
    var boxH=480; // should be defined elsewhere

    var imgInfo =''; '<b>'+this.imgList[id].title+'</b><br/>';
	if(this.imgList[id].description2)
      imgInfo+=this.imgList[id].description2;
	else
      imgInfo+=this.imgList[id].description;
	$('imgInfo').innerHTML=imgInfo;
    //this.tooltip = new YAHOO.widget.Tooltip("ttx", { context:imgL, text:imgInfo }); 
  
    if(imgL.clientHeight>boxH){
	  imgL.style.width = Math.round(imgL.clientWidth * (boxH/imgL.clientHeight)) + "px"; 	
	  imgL.style.height = boxH + "px";
    } 
  }
} // end defaulView