// TWC Vertical Carousel

//var othrImgs;
var theValue; 
var timeVar3; 
var mNum; 
var countme2=0; 
var slctThumbImgNo=0; 
var oldThumb; 
var newThumb; 
var writeCount=1;
var constNum=285;//228 
var arrayLength2;  
var theID; 
var calcd; // calculated value to find number of carousel clicks available
var strValue; // make calcd number a string
var getStrValNum; // get string value of the number needed from string before decimal without rounding - result is a string
var numValue; // final number - convert getStrValNum to a number value
var topPos; //initial top pos of v_ribbon
var lastPos; 
var passImgNo; 
var carouselFilter = "?$Carousel49x49$";
var mainImageFilter = "?$Main348x348$";
var magnifiedFilter = "?$Zoom1392x1392$";
var noImagePath = "/images/ENG/no_photo_348x348.jpg";
var noImageThumb = "/images/ENG/no_photo_49x49.jpg";

function initialiseVars()
{
othrImgs = altImageURL; // initialise and set variable for thumbnail selection
oldThumb="othr_img_"+slctThumbImgNo; // initialise
newThumb="othr_img_"; // initialise
arrayLength2 = othrImgs.length; // count the number of items in the array
theID="v_ribbon"; // set ID to that of the v_ribbon for movements later
calcd = arrayLength2/5;  // calculated value to find number of carousel clicks available
strValue=new String(calcd); // make calcd number a string
getStrValNum=strValue.slice(0,1); // get string value of the number needed from string before decimal without rounding - result is a string
numValue=new Number(getStrValNum); // final number - convert getStrValNum to a number value
topPos=0; // initial top pos of v_ribbon
lastPos=(numValue)*constNum;
if (calcd == Math.round(calcd)) {lastPos=(numValue-1)*constNum;} //fixes extra scrolling on carousel
passImgNo=0;
}

function writeVCarouselToPage(obj) {
	var i ="";
      var x=0;
      var y=0;
      var z=0;
      var altView="";
      var retstr="";
      var imageref="";
 	for (i in obj){
            x=obj[i].indexOf(";",0);
            y=obj[i].indexOf(",",0);
            if (y==-1) {
                y=obj[i].length;
            }
            while (x>0)
            {  
                altView=obj[i].substring(x+1,y);   
		imageref=altView;
                altView=S7ConfigClient.isRoot + '/' +altView;
                altImageURL[z]=altView;
                document.write("<div class=\"img_unslctd\" id=\"othr_img_" + z + "\"><img src=\"" + altView + carouselFilter + "\" border=\"0\" alt=\"Thumbnail\" width=\"49\" height=\"49\" class=\"img_thumb\" onclick=\"javascript:selectImg('"+ z + "');TMAN.addParams('altimageref','"+imageref+"');TMAN.doTags(TMAN.position.ALTIMAGECLICKED,true);\"/></div>");
                x=obj[i].indexOf(";",y);
                y=obj[i].indexOf(",",y+1);
                if (y==-1) {
                    y=obj[i].length;
                } 
                z++;
            }
	} 
		
}

function setVRibbonSize() {
	if (arrayLength2<=5) {
		mNum=0+constNum;
		document.getElementById(theID).style.height=mNum+"px";
		topPos=0;
		lastPos=0;
		document.getElementById('down_button').src="images/down_arrow_end.gif";
	}
	else {
		mNum=(numValue+1)*constNum; 
		document.getElementById(theID).style.height=mNum+"px";
	}
}

// move up UI function

function moveUp() {
	if (topPos==0) {
		clearTimeout(timeVar3);
		document.getElementById('up_button').src="images/up_arrow_end.gif"; // set to inactive version of img
		countme2=0;
	}
	else {
		if (topPos<0) {
				document.getElementById('down_button').src="images/down_arrow.gif"; // set up arrow img to active version
			}
		topPos=topPos+15;
		document.getElementById(theID).style.top=topPos+"px"; // push v_ribbon down (i.e. increase topPos) via timeout until target is reached
		countme2=countme2+1; // increment countme2 variable
		if (topPos==0) {
			document.getElementById('up_button').src="images/up_arrow_end.gif"; // set to inactive img version
		}
		if (countme2==19) {
			stopmove2();
			countme2=0;
		}
		else {
			timeVar3=setTimeout("moveUp()", 10); // may need to adjust speeds
		}
	}
}

// move down UI function

function moveDown() {

	if (topPos==(-lastPos)) {
		clearTimeout(timeVar3);
		document.getElementById('down_button').src="images/down_arrow_end.gif"; // set to inactive img version
		countme2=0;
	}
	else {
		if (topPos<(-lastPos)) {
			document.getElementById('up_button').src="images/up_arrow.gif"; // set to active img version
		}
		topPos=topPos-15;
		document.getElementById(theID).style.top=topPos+"px"; // push v_ribbon up (i.e. decrease topPos) via timeout until target is reached
		countme2=countme2+1; // increment countme2 variable
		if (topPos<0) {
			document.getElementById('up_button').src="images/up_arrow.gif"; // set to inactive img version
		}
		if (topPos==(-lastPos)) {
			document.getElementById('down_button').src="images/down_arrow_end.gif"; // set to inactive img version
		}
		if (countme2==19) {
			stopmove2();
			countme2=0;
		}
		else {
			timeVar3=setTimeout("moveDown()", 10); // may need to adjust speeds
		}
	}

}

// reset carousel when reloaded

function c_reset() {
    document.getElementById(theID).style.top = "0px";
    document.getElementById('up_button').src = "images/up_arrow_end.gif";
    document.getElementById('down_button').src = "images/down_arrow.gif";
    slctThumbImgNo = 0;
}


function stopmove2()	{
clearTimeout(timeVar3);
}

function selectImg(whichImg) {
	document.getElementById("prdpg_ImgToZoom").src=altImageURL[whichImg] + mainImageFilter;
	document.getElementById("prdpg_magnified_img").src=altImageURL[whichImg]+ magnifiedFilter;
	oldThumb="othr_img_"+slctThumbImgNo;
	newThumb="othr_img_"+whichImg;
	passImgNo=whichImg;
	if (oldThumb==newThumb) {
		null;
	}
	else {
	document.getElementById(oldThumb).className="img_unslctd";
	document.getElementById(newThumb).className="img_slctd";
	slctThumbImgNo = whichImg;
	oldThumb=newThumb;
	}
}

function intialiseThumb() {

var mainImage;
var magImage;

if(arrayLength2 == 0)
{  
    /* No carousel images */ 
    var zoomImg = document.getElementById("prdpg_zoomImgID");
    
    mainImage = noImagePath;
    magImage = noImagePath;
    document.getElementById("prdpg_zoom_flyout").style.visibility='hidden';
    document.getElementById("largeImageDisplay").style.visibility='hidden';
    //document.getElementById("prdpg_zoom_guide").style.visibility='hidden';
    document.getElementById("v_ribbon").innerHTML = "<div class=\"img_slctd\"><img src=\"" + noImageThumb + "\" border=\"0\" alt=\"Thumbnail\" width=\"49\" height=\"49\" class=\"img_thumb\"\"/></div>";
    
    /*Remove events for flyout zoom */
    //zoomImg.onmousemove = null; 
    //zoomImg.onmouseover = null;  
    //zoomImg.onmouseout = null ;
    

}
else
{   
    mainImage = altImageURL[0] + mainImageFilter;
    magImage = altImageURL[0] + magnifiedFilter;
    document.getElementById("othr_img_0").className = "img_slctd";
    document.getElementById("prdpg_zoom_flyout").style.visibility = 'visible';
    document.getElementById("largeImageDisplay").style.visibility = 'visible';
    //document.getElementById("prdpg_zoom_guide").style.visibility = 'visible'; 
}

document.getElementById("prdpg_ImgToZoom").src = mainImage; 
document.getElementById("prdpg_magnified_img").src = magImage; 
/*document.getElementById("othr_img_0").className="img_slctd";	*/
}


function changeImage(imagesetId) {
    //imagset_test = [];
    //imagset = [];
    //othrImgs = [];
    //altImageURL = [];
    //imagesets = id;
    //sjCallbacks = new Object(); //!global variable MUST be created !
    //sjErrCallbacks = new Object(); //!global variable MUST be created !
    //parentSwatches = '';
    //initializeJSON(imagesets);

    altImageURL = [];  //Clear the images array
    var obj = imagset[imagesetId];
    //writeVCarouselToPage(obj)
    var i = "";
    var x = 0;
    var y = 0;
    var z = 0;
    var altView = "";
    var retstr = "";
    var imageref="";
    document.getElementById("v_ribbon").innerHTML = "";

    for (i in obj) {
        x = obj[i].indexOf(";", 0);
        y = obj[i].indexOf(",", 0);
        if (y == -1) {
            y = obj[i].length;
        }
        while (x > 0) {
            altView = obj[i].substring(x + 1, y);
	    imageref=altView;
            altView = S7ConfigClient.isRoot + '/' + altView;
            altImageURL[z] = altView;
            //document.write("<div class=\"img_unslctd\" id=\"othr_img_" + z + "\"><img src=\"" + altView + carouselFilter + "\" border=\"0\" alt=\"\" width=\"49\" height=\"49\" class=\"img_thumb\" onclick=\"javascript:selectImg('" + z + "');\"/></div>");

            document.getElementById("v_ribbon").innerHTML += "<div class=\"img_unslctd\" id=\"othr_img_" + z + "\"><img src=\"" + altView + carouselFilter + "\" border=\"0\" alt=\"\" width=\"49\" height=\"49\" class=\"img_thumb\" onclick=\"javascript:selectImg('" + z + "');TMAN.addParams('altimageref','"+imageref+"');TMAN.doTags(TMAN.position.ALTIMAGECLICKED,true);\"/></div>";
            x = obj[i].indexOf(";", y);
            y = obj[i].indexOf(",", y + 1);
            if (y == -1) {
                y = obj[i].length;
            }
            z++;
        }
    }


    initialiseVars();
    c_reset();
    setVRibbonSize();
    intialiseThumb();
    brwsAdjust();

    //return false;
}


//Function for Size Chart window
function smallWin(url) {
    window.open('/'+url, '_blank', 'width=1048, height=750, location=no, menubar=no, toolbar=no, scrollbars=yes');
    return false;
}

