function Target( zoom, top, bottom, left, right, name ) {
	this.zoom = zoom;
	this.top = top;
	this.bottom = bottom;
	this.left = left;
	this.right = right;
	this.name = name;
}

function SourceImage( url, width, height, label ) {
	//alert( "Created SourceImage( " + url + ", " + width + ", " + height + ")" );
	this.url = url;
	this.width = width;
	this.height = height;
    this.label = label;

	this.targets = new Array();
}

function SourceImage( url, width, height, label ,colorCode) {
	//alert( "Created SourceImage( " + url + ", " + width + ", " + height + ")" );
	this.url = url;
	this.width = width;
	this.height = height;
        this.label = label;
        this.colorCode =colorCode;
    	this.targets = new Array();
}


function ZoomImage( url, width, height, label ) {
	//alert( "Created SourceImage( " + url + ", " + width + ", " + height + ")" );
	this.url = url;
	this.width = width;
	this.height = height;
        this.label = label;

	
}

function ZoomImage( url, width, height, label ,colorCode) {
	
	this.url = url;
	this.width = width;
	this.height = height;
    	this.label = label;
    	this.colorCode =colorCode;
   
}


SourceImage.prototype.addTarget = function( viewer, zoom, top, bottom, left, right, name ) {
    // if zoom not specified calculate to fit
    if (zoom==null || zoom <= 0) {
        zoom = Math.min( viewer.viewerWidth / Math.abs(bottom-top), viewer.viewerHeight / Math.abs(right-left) );
        //alert( "zoom set to: " + zoom );
    }
	var newTarget = new Target( zoom, top, bottom, left, right, name);
	this.targets[ this.targets.length ] = newTarget;
}

SourceImage.prototype.getTargetCount = function() {
	return this.targets.length;
}

/*
 * Holds a collection of source images
 *
 * viewer: an instance of the FlashViewer or the JSViewer
 * spacerImg: full path to the spacer image to be used in place of targets when none defined
 */
function MoreViews(viewer, spacerImg) {
    this.viewer = viewer;
    this.spacerImg = spacerImg;

   	this.sourceImages = new Array();
    this.activeSourceImage = null;
}

/*
 * Holds a collection of zoom images
 *
 * viewer: an instance of the FlashViewer or the JSViewer
 * spacerImg: full path to the spacer image to be used in place of targets when none defined
 */
function ZoomViews(viewer, spacerImg) {
    this.viewer = viewer;
    this.spacerImg = spacerImg;

   	this.zoomImages = new Array();
    this.activeZoomImage = null;
}

MoreViews.prototype.addSourceImage = function( newSourceImage ) {
	this.sourceImages[ this.sourceImages.length ] = newSourceImage;
      
	// if this is the first, also make it active
	if (this.activeSourceImage == null) {
	    this.activeSourceImage = newSourceImage;
	}
}


ZoomViews.prototype.addZoomImage = function( newZoomImage ) {
	this.zoomImages[ this.zoomImages.length ] = newZoomImage;

	// if this is the first, also make it active
	if (this.activeZoomImage == null) {
	    this.activeZoomImage = newZoomImage;
	}
}

MoreViews.prototype.getSourceImageCount = function()  {
	return this.sourceImages.length;
}

ZoomViews.prototype.getZoomImageCount = function()  {
	return this.zoomImages.length;
}

MoreViews.prototype.writeSource = function( index ) {
    var sourceImage = this.sourceImages[index];
    //alert(index);
    var zoom = Math.min( this.viewer.viewerWidth / sourceImage.height, this.viewer.viewerHeight / sourceImage.height );
    document.write( '<a href="" onclick="moreViews.selectSource( ' + index + ' ); switchSwatchTitle(\'' + sourceImage.label + '\');return false;">' );
    document.write( ' <img style="border:1px solid #e2e2e2;" width="57" height="73" alt="" border=0 src="' + sourceImage.url + '?fit=90w90h" onMouseOver="moreViews.selectSource( ' + index + ' ); switchSwatchTitle(\'' + sourceImage.label + '\');  return false;" >' );
    document.write( '</a>' );
    document.write( '<br/>' );
    //document.write( '<span class="default">' + sourceImage.label + '</span>' );
}




MoreViews.prototype.writeAltSource = function( index ,divIndex ) {
    var sourceImage = this.sourceImages[index];
   
    var divcontainer = 'altDiv_'+divIndex;
      
    var divinfo= '<a href="" onclick="moreViews.selectSource( ' + index + ' ); return false;">' ;
      
     divinfo = divinfo + ' <img style="border:1px solid #e2e2e2;" width="57" height="73" alt="" border=0 src="' + sourceImage.url + '?fit=90w90h" onMouseOver="moreViews.selectSource( ' + index + ' );  return false;" >';
     divinfo = divinfo + '</a>';
  // divinfo = '<br/>' ;
   
    window.document.getElementById(divcontainer).innerHTML = divinfo;
 
}

MoreViews.prototype.writeSourceColor = function( index ) {
    var sourceImage = this.sourceImages[index];
    var  zoomImageUrl =imagePath +productCode+ "."+sourceImage.colorCode +imgageNameSuffix + 1 + imgageExt;
   //alert( sourceImage.url);
	//alert(index)
    //var zoom = Math.min( this.viewer.viewerWidth / sourceImage.height, this.viewer.viewerHeight / sourceImage.height );
    document.write( "<a href=\"\" onclick=\"zoomClick( '" + sourceImage.colorCode  + "' , '" + sourceImage.label + "'); return false;\" >  ");
   // document.write( "<img style=\"margin-right:6px;border:1px solid #e2e2e2;\" width=\"35\" height=\"46\" alt=\"\" src='" + sourceImage.url + "'?fit=90w90h\" onMouseOver=\"zoomViews.changeZoomSource( '" + zoomImageUrl + "' ); switchSwatchTitle('" + sourceImage.label + "'); switchAlternateImages('" + sourceImage.url + "' , '" + sourceImage.colorCode + "' );  return false;\" >  ");
   document.write( "<img style=\"margin-right:6px;border:1px solid #e2e2e2;\" alt=\"\" src='" + sourceImage.url + "'?fit=90w90h\" onMouseOut=\" zoomMouseOut();  return false;\" onMouseOver=\"zoomViews.changeZoomSource( '" + zoomImageUrl + "' ); switchSwatchTitle('" + sourceImage.label + "'); switchAlternateImages( '" + sourceImage.colorCode + "' );  return false;\" >  ");
    document.write( '</a>');
    //document.write( '<span class="default">' + sourceImage.label + '</span>' );
}

function zoomMouseOut () {
	switchSwatchTitle(previousColorName);
	switchAlternateImages(previousColorCode);
	var  zoomImageUrl =imagePath +productCode+ "."+previousColorCode +imgageNameSuffix + 1 + imgageExt;
	zoomViews.changeZoomSource(zoomImageUrl);
}

function zoomClick(colorCode, colorName) {
	
	previousColorCode =colorCode;
	previousColorName =colorName;
	
}

function switchSwatchTitle(sTitle) {
	
  //document.getElementById("swatchtitle").innerText="Color Shown: "+sTitle;
   var divID =document.getElementById("swatchtitle");
  if(divID!=null){
    var divInfo  = sTitle;
	divID.innerHTML=divInfo;
	
  }

}

function switchAlternateImages(colorCode) {

//alert("switchAlternateImages");

	for (var J = 1 ; J < 5 ; J++) {
	var index = J;
		var aTemp=document.getElementById('altDiv_'+J);
		//alert(aTemp);
		if(aTemp!=null){
			var  zoomImage=productCode+ "."+colorCode +imgageNameSuffix + J + imgageExt;
			var zoomImageUrl =imagePath +zoomImage;
			//alert(altImageUrl);
			var divinfo= "<a href=\"\" onclick=\"zoomViews.changeZoomSource( '" + zoomImageUrl + "'); return false;\">" ;
			divinfo = divinfo + "<img style=\"border:1px solid #e2e2e2;\" width=\"57\" height=\"73\" alt=\"\" border=0 src=' " + zoomImageUrl + "'?fit=90w90h\" onMouseOver=\"zoomViews.changeZoomSource( '" + zoomImageUrl + "' );  return false;\" >";
			divinfo = divinfo + '</a>';
			aTemp.innerHTML=divinfo;
		}
	}        
     
}

ZoomViews.prototype.changeZoomSource  =function(zoomImageUrl) {

  //alert(zoomImageUrl);
  var  imgWidth =1100;
  var  imgHeight =1413;
  var width;
  var height;
 
  for (var index = 0 ; index < this.zoomImages.length  ; index++) {
  
  	if (this.zoomImages[index].url  == zoomImageUrl ) {
  		width=this.zoomImages[index].width;
  		height =this.zoomImages[index].height;
  		//alert(width);
  		break;
  	}
  }
 //For testing only  
 if(width >0) {
		imgWidth =width
 }
 if(height >0) {
		imgHeight =height
 }

 var zoom = Math.min( theViewer.viewerWidth / imgWidth,
        theViewer.viewerHeight / imgHeight );

    theViewer.zoomTo( zoomImageUrl, imgWidth,
        imgHeight, zoom, 0,
        imgHeight, 0, imgWidth );

    
    return false;
	
}

MoreViews.prototype.selectSource = function ( index) {
    if (index >= this.getSourceImageCount()) {
        //alert( "no sourceImage for index: " + index );
        return false;
    }

    this.activeSourceImage = this.sourceImages[index];
	 //For testing only  -- start
	 if( this.activeSourceImage.width <= 0) {
			 this.activeSourceImage.width =1100;
	 }
	 if(this.activeSourceImage.height <= 0) {
			this.activeSourceImage.height =1413;
	 }
	//For testing only  -- end

    var zoom = Math.min( this.viewer.viewerWidth / this.activeSourceImage.width,
        this.viewer.viewerHeight / this.activeSourceImage.height );

    this.viewer.zoomTo( this.activeSourceImage.url, this.activeSourceImage.width,
        this.activeSourceImage.height, zoom, 0,
        this.activeSourceImage.height, 0, this.activeSourceImage.width );

    // Swap out the thumbnails
    this.setTargets( this.activeSourceImage );

    return false;
}

MoreViews.prototype.setTargets = function( sourceImage ) {
   var target, i;
   //for (i = 0; i < 3; i++ ) {
        //var targetImg = document.getElementById( "target.img." + i );
        //var targetName = document.getElementById( "target.name." + i );
        //target = sourceImage.targets[i];
        //if (target) {
            //targetImg.src = sourceImage.url + '?crop,top=' + target.top + ',bottom=' + target.bottom
            //    + ',left=' + target.left + ',right=' + target.right + '&size=49w' ;
// alert( "set target to: " + targetImg.src );
         //   targetName.innerHTML = target.name;
       // }
        //else {
            //targetImg.src = this.spacerImg;
         //   targetName.innerHTML = "";
       // }
    //}

}

// tweens to the target for the active image
MoreViews.prototype.targetClicked = function( targetIndex ) {
    if (this.activeSourceImage == null ||
        targetIndex >= this.activeSourceImage.getTargetCount() )
    {
        // no target at this index for this source image
        return false;
    }

    var target = this.activeSourceImage.targets[targetIndex];

    this.viewer.zoomTo( this.activeSourceImage.url,
        this.activeSourceImage.width, this.activeSourceImage.height,
        target.zoom, target.top, target.bottom, target.left, target.right );

    return false;
}