// $Header: /usr/local/cvsroot/AA210/WebRoot/Static/js/AA20922_PartThumbnailArea.js,v 1.1 2009/02/28 08:10:52 rtm Exp $
// Copyright (c) 2005,2006,2007  ABIS Technologies, Inc.
// All rights reserved
//
// XXX000000:20040719gil: bz877 - selectedNode is declared in the gallery rather than the nanotree since on
// XXX000000:20040719gil: click event which occurs on the gallery, while the tree view doesn't exist, we are
// XXX000000:20040719gil: checking it to see if it initialized or not, hence we do expect it to exist (but
// XXX000000:20040719gil: not initialized) when the tree doesn’t exist.
var selectedNode = null;	// actually an ID, not a node object (nanotree naming choice)

var thumbnailSizeIndex = 0; // default value

// These variables should contain the HTML used to display each indicator
var blankImageHtml	= '';
var shortcutImageHtml	= '';
var sharedImageHtml	= '';
var inProjectImageHtml	= '';
var hasBeenReviewedHtml = '';

// Pop up new window for download (applet).
function downloadInPopUp(url) {
    var width	= 776;
    if (gpvIsIE) {	// XXX:20071020rtm:bz5940: Major hassles with auto scrollbars, just add pad for grayed out vertical bar.
	width += 15;
    }
    var height	= 531;
    var maxHeight = screen.availHeight - 40;	// margin
    if (height > maxHeight) {
        height = maxHeight;
    }
    var windowProperties = "width=" + width
			 + ",height=" + height
			 + ",resizable=1,menubar=0,toolbar=0,statusbar=0,scrollbars=1"
			 + aaGjsDiagPopUpTopLeft;
    var newWindow = window.open(url,'_blank',windowProperties);
    newWindow.focus(); // bz6384 
}

// URL is partial, get selection from 'images' and 'albums' arrays
function downloadSelectedInPopUp(url) {
    var selectedImages = "";
    if (images != null) {
	selectedImages += getSelectedItems(images);
    }
    var selectedAlbums = "";
    if (albums != null) {
	selectedAlbums += getSelectedItems(albums);
    }
    // bz5874 re URL length issue
    url = url
	+ urlSeparator + "selectedImages=" + selectedImages
	+ urlSeparator + "selectedAlbums=" + selectedAlbums;

    downloadInPopUp(url);
}

function getSelectedItems(itemArray) {
    var items = "";
    for (var i=0; i<itemArray.length; i++) {
	if ((itemArray[i] != null)
	 && (itemArray[i].selected)) {
	    items += itemArray[i].id + ",";
	}
    }
    return items;
}

// bz1011 - Search results items do not contain parent id
function getSelectedItemsParentId(itemArray) {
    var items = "";
    for (var i=0; i<itemArray.length; i++) {
	if ((itemArray[i] != null)
	 && (itemArray[i].selected)) {
	    items += itemArray[i].parentId + ",";
	}
    }
    return items;
}

function writeThumbnails(dest, thumbHTMLArray) {

    //dest.write("drawNumber is " + drawNumber);
    dest.write('<!--============ begin table and row 0 ===========-->\n');
    dest.write('<table width="1" cellspacing="4" cellpadding="0" border="0"><tr>\n');

    // output all the thumbs
    for (var i=0; i<thumbHTMLArray.length; ++i) {
	var col = i % numColumns;
	if (col == 0 && i > 0) {
	    dest.write('<!--============ end row, start new row ===========-->\n');
            dest.write('</tr><tr>');
	}
	dest.write('<td>');
	dest.write(thumbHTMLArray[i]);
	dest.write('</td>');
    }
    dest.write('<!--============ end last row and table ===========-->\n');
    dest.write('</tr></table>\n');
    //drawNumber++;
}


// gen HTML for each album/image thumb, placing all into an array
function genThumbHTML(thumbHTMLArray, albums, images) {
    var count = 0;
    if (albums){
    for (var i=0; i<albums.length;i++) {
	var sb = new jsStringBuffer;
	writeAlbumThumbnailBlock(sb, albums[i], i);
	thumbHTMLArray[count++] = sb.toString();
    }
    }else{
       alert('no albums?');
}
    for (var i=0; i<images.length;i++) {
	var sb = new jsStringBuffer;
	writeImageThumbnailBlock(sb, images[i], i);
	thumbHTMLArray[count++] = sb.toString();
    }
}

function selectParentInTree(itemArray, index) {
    // making sure the tree exist in the current page
    if (typeof rootNode == 'undefined') {
    	return;
    }

    // deselecting the previous node
    if (selectedNode != null) {
	deselectNode(selectedNode);
    }
    selectedNode = null; // in case no new selection

    // deselecting the root
    if (rootNode.hasChilds()) {
	if (rootNode.childs[0] != null && (rootNode.childs[0] != false)) {
	    deselectNode(rootNode.childs[0].getID());
	}
    }

    // ignore project items
    if (itemArray[index].isLightbox) {
	return;
    }

    // find tree node matching item parent (same for assets or albums)
    currNode = getTreeNode(itemArray[index].parentId);   
    if (currNode == null) {
	return;	// not visible (generally due to priv issues)
    }
    selectedNode = currNode.getID();

    expandTreeToCurrentNode();
}

var lastClicked = 0;			// The index of the last item clicked
var arrayInWhichLastClicked = null;	// The array containing the item that was last clicked

/**
* @param shouldSelectParentInTree boolean which determines whether to selected the parent node in the treeView or not
*/
function itemClicked(itemArray, index, deselectOthers, shouldSelectParentInTree) {
    if (shouldSelectParentInTree) {
        selectParentInTree(itemArray, index);
    }

    var rangeSelect = 0;
    var multiSelect = 0;
    if (!window.sidebar		// check for Mozilla - shift/control currently won't work on Mozilla
     && typeof(event) != 'undefined'
     && event != null) {
	rangeSelect = event.shiftKey;
	multiSelect = event.ctrlKey | event.metaKey; //control for PC, apple for Mac
    }
    // If !deselectOthers, then treat it the same as if the user was holding down the ctrl key
    if ((!rangeSelect) && (!deselectOthers)) {
	multiSelect = true;
    }

    // deselect items
    // change following line to "if (rangeSelect) {" to change to sticky selection
    if (!multiSelect || rangeSelect) {
	selectAllItemsInPane(arrayInWhichLastClicked, false);
    }
    if (rangeSelect) {
	var start = lastClicked > index ? index : lastClicked;
	var end   = lastClicked > index ? lastClicked : index;
	for (var i=start; i<=end; i++) {
	    toggleSelectedItem(itemArray, i);
	}
    } else {
	toggleSelectedItem(itemArray, index);
	lastClicked = index;
    }
    arrayInWhichLastClicked = itemArray;

    if (selectedNode != null) {
        focusSelection();
    }
    return( true ) ;
}

// This function is used throughout the gallery
// and pertains only to images and albums, not lightbox items.
// It still exists here in order to avoid changing multiple other places in the gallery code.
function selectAllItems(selected) {
    if (selected) {
	checkIfClickedInNewPane(images); // XXX000000:20040624jmg: Assumes that this will only be called to select all in the Gallery
    }
    selectAllItemsInPane(images, selected);
}

function selectAllAssets() {
	// ensure that nothing in other panes is selected
	checkIfClickedInNewPane(images);
    selectAllItemsInArray(images, true);
    selectAllItemsInArray(albums, false);
}

function selectAllAlbums() {
	// ensure that nothing in other panes is selected
	checkIfClickedInNewPane(albums);
    selectAllItemsInArray(images, false);
    selectAllItemsInArray(albums, true);
}

function selectAllGalleryItems() {
    // ensure that nothing in other panes is selected
    checkIfClickedInNewPane(images);
    selectAllItemsInArray(images, true);
    selectAllItemsInArray(albums, true);
}

function deselectAllGalleryItems() {
    selectAllItemsInArray(images, false);
    selectAllItemsInArray(albums, false);
}

// The itemArray is passed to specify in which pane the user has selected an item.
// Selecting all images will also select all albums (and vice versa)
// because, to the user, they appear in the same pane and are treated the same.
// XXX00:20050919rtm: This is messy, and apparently caused bz2864. The logic indicates that this function
// XXX00:20050919rtm: works only for the main thumbnail area of the lb preview, but there is no check for it here.
// XXX00:20050919rtm: I've added an explicit check for the lb case, because that is all that this is for, apparently.
// XXX00:20050919rtm: For the compare pane I changed it to use selectAllItemsInArray directly.
function selectAllItemsInPane(itemArray, selected) {
    if ((itemArray == images) || (itemArray == albums)) {
	selectAllItemsInArray(images, selected);
	selectAllItemsInArray(albums, selected);
    } else if ((itemArray == lbImages) || (itemArray == lbAlbums)) {
	selectAllItemsInArray(lbImages, selected);
	selectAllItemsInArray(lbAlbums, selected);
    } else {
	//alert("Unexpected itemArray"); // XXX00:20050919rtm:probably should complain, but go with failsafe callthrough...
	selectAllItemsInArray(itemArray, selected);
    }
}

// Select/deselect all items in an array
function selectAllItemsInArray(itemArray, selected) {
    if (itemArray != null) {
	for (var i=0; i<itemArray.length; i++) {
	    if ((itemArray[i] != null) && (itemArray[i].selected != selected)) {
		toggleSelectedItem(itemArray, i);
	    }
	}
	if (selected) {
	    lastClicked = 0;
	    arrayInWhichLastClicked = itemArray;
	}
    }
}

function toggleSelectedItem(itemArray, index) {
    if ((itemArray != null) && (itemArray[index] != null)) {
	// Need to determine which array it is in order to get the correct element id
	var itemType, selectedClass, unselectedClass;
	if (itemArray == comparePaneImages) {
	    itemType = "cpSpaceId";
	    selectedClass = "comparePaneSelected";
	    unselectedClass = "comparePane";
	} else {
	    selectedClass = "thumbSelected";
	    unselectedClass = "thumb";
	    if (itemArray == albums) {
		itemType = "album";
	    } else if (itemArray == images) {
		itemType = "image";
		// Handle the special case where if an image is in the compare pane, it should look different when unselected.
		if (itemArray[index].comparePaneIndexes != null) {
		    unselectedClass = "thumbPressed";
		}
	    } else if (itemArray == lbImages){
		itemType = "lbImage";
	    } else {
		itemType = "lbAlbum";
	    }
	}

	itemArray[index].selected = !itemArray[index].selected;

	var element = document.getElementById(itemType + index);
	if (element != null) {
	    // bz1959
	    // for the OS9 div-implementation of the thumbnail, add the prefix "div_" to the style name
	    var div = "" ;
	    if (element.className.substring(0,4) == "div_" ) {
		div = "div_" ;
	    }

	    if (itemArray[index].selected) {
		element.className = div + selectedClass;
	    } else {
		element.className = div + unselectedClass;
	    }
	}
    }
}

function albumThumbClicked(index, deselectOthers) {

    checkIfClickedInNewPane(albums);
    itemClicked(albums, index, deselectOthers, true);
    
    if (albums[index].isMultipageAsset == true){
        updateViewer(albums[index]);
    }
}

function imageThumbClicked(index, deselectOthers, isAlbum) {
    //alert( "imageThumbClicked: index=" + index) ;
    checkIfClickedInNewPane(images);
    itemClicked(images, index, deselectOthers, true);

    if (isSearchCriteria) {
        //alert( "imageThumbClicked: search criteria on !" ) ;
        SubmitGalleryForm( "Gallery", "SearchResultsPreview" ) ;
        return ;
    }
    updateViewer(images[index]);
}

// This function is purposely not defined in this file.
// It needs to be implemented elsewhere in order
// for imageThumbClicked and lbThumbClicked to work.
// This was done so that different pages can have
// different implementations of the function without
// worrying about the order in which the js files are loaded.
//function updateViewer(selectedImage) {
//    alert('Not implemented here');
//}

function lbThumbClicked(index, deselectOthers, isAlbum) {
    var list;

    if (isAlbum == true){
        list = lbAlbums;
    }else{
	list = lbImages;
    }

    checkIfClickedInNewPane(list);
    itemClicked(list, index, deselectOthers, true);

    updateViewer(list[index]);

}

function cpItemClicked(index, event, deselectOthers) {
    checkIfClickedInNewPane(comparePaneImages);

    // If the cpItem is already selected and the user clicked within the image,
    // then zoom in on all selected images.  Otherwise, do the normal selection.
    var img = new ImageRelativePoint(comparePaneImages[index].ipImage.imgElementId, event);
    if ((comparePaneImages[index].selected)
     && (img.x >= 0) && (img.x <= img.width)
     && (img.y >= 0) && (img.y <= img.height)) {
	for (var i = 0; i < comparePaneImages.length; i++) {
	    if ((comparePaneImages[i] != null) && (comparePaneImages[i].selected)) {
		zoomToRelativePosition(comparePaneImages[i].ipImage, event, img.x, img.y);
		updateImageScaleDisplay(i);
	    }
	}
    } else {
	// Either the item was not already selected or the user clicked on the thumbnail border

	// XXX000:20040125gil: @bugid 1950 - On lightbox cp, the selected assets (on the compare pane)
	// XXX000:20040125gil: get the parent ID of their containing album ID rather than their containing
	// XXX000:20040125gil: lightbox. This may lead to an exception in the treeview, if the album of a selected  
	// XXX000:20040125gil: compared thumbnail is not shared for view. In any case, there is no need to select a node   
	// XXX000:20040125gil: in response to clicking a compared thumbnail event, since its container node is already  
	// XXX000:20040125gil: selected by the prior event of clicking the thumbnails at the bottom (in order to add
	// XXX000:20040125gil: it to the compared pane). Please note that in case we change the assets in the compared
	// XXX000:20040125gil: pane to point to the LB as a parent, we would be able to enable this selection again 
	// XXX000:20040125gil: (i.e. to call itemClicked(...) with the last parameter as true).
	itemClicked(comparePaneImages, index, deselectOthers, false);
    }
}

// Checks to see whether the user has clicked in a pane for the first time.
// If true, this takes care of any setup that is required.
// Checks that arrayInWhichLastClicked is changing, but not just changing between images and albums,
// because they are in the same pane.
function checkIfClickedInNewPane(itemArray) {
    if ((itemArray != arrayInWhichLastClicked)
    && !(((itemArray == images) && (arrayInWhichLastClicked == albums))
      || ((itemArray == albums) && (arrayInWhichLastClicked == images)))) {
	// The user has clicked in a new pane.
	// Images and albums are in the same pane, so handle them together
	if ((itemArray != images) && (itemArray != albums)) {
	    selectAllItemsInArray(images, false);
	    selectAllItemsInArray(albums, false);
	}
	if ((itemArray != lbImages) && (itemArray != lbAlbums)) {
	    selectAllItemsInArray(lbImages, false);
	    selectAllItemsInArray(lbAlbums, false);
	}
	if (itemArray != comparePaneImages) {
	    selectAllItemsInArray(comparePaneImages, false);
	}
	lastClicked = 0;
    }
}

function showImageInfo(index) {
// XXX00:20040125rtm:demo feature, disable until dust settles
//	var img = images[index];
//	var sb = new jsStringBuffer;
//
//	sb.write('<table width="100%" cellpadding=0 cellspacing=0><tr>');
//	sb.write('  <td width="100%" class="smallText">');
//	sb.write(img.filename + '  -  ');
//	sb.write(img.size + '  kB');
//	if (img.title != img.filename) {
//		sb.write('  -  ' + img.title);
//	}
//	sb.write('  </td></tr></table>');
//	showInfo(sb.toString());
}

function showAlbumInfo(index) {
// XXX00:20040125rtm:demo feature, disable until dust settles
//	var album = albums[index];
//	var sb = new jsStringBuffer; //XXX0000:20040125rtm: never init, but used in next line (??)
//	showInfo('<table width="100%" cellpadding=0 cellspacing=0></tr><td width="100%" class="smallText">' + album.tooltip + '</td><td>' + sb.toString() + '</td></tr></table>');
}

function toggleImageSelected(index) {
	images[index].selected = !images[index].selected;
	if (images[index].selected) {
	       //alert(document.getElementById("image" + index).style.background);
	       document.getElementById("image" + index).className = 'thumbSelected';//style.background = "#FEE6A8"; //"#555588";
	       //document.all["image" + index].className = 'thumbSelected';
	} else {
	       document.getElementById("image" + index).className = 'thumb'; //style.background = "#555555";
	}
}

// XXX:20060217gil: bz3056 - this method was moved to PartThubnailArea_JsInit.jsp b/c it requires 
// XXX:20060217gil: bz3056 - an encryption service that can only be found in the Java.
//function albumThumbDoubleClicked(index) { }

function imageThumbDoubleClicked(index) {
    var img = images[index];
    if (enableDoubleClick && img.allowDoubleClick) {
	if (img.isImage) {
	    // to viewer page
	    showLoading();
	    window.location = img.href;
	} else {
	    // browser-view - with DummyPath (as needed)
	    var url = img.href + gpvEncryptionSeparator + img.browserViewDummyPath;
	    // XXX0000000000:20080515rtm:bz6496: If/when we implement direct open for PDF, this code
	    // XXX  will open a new browser window for it. Empirically, with XP
	    // XXX  and IE 6, this also bypasses the Open/Save dialog even with
	    // XXX  download config: browserView.WinXP_IE6.contentDispositionForPDF = attachment
//	    if (gpvIsWindows && img.fileType == 100500) { // bz6496: new window for PDF, Window only
//		window.open(url,'_new');
//	    } else {
		window.location = url;
//	    }
	}
    }
}

/********** Functions for writing thumbnails ******************/

function writeAlbumContentTD(album, dest, sampleIndex, sizeIndex) {

 	dest.write(        '	        <td>');
	if (sampleIndex < album.contentSample.length ) {
 	    dest.write(    '	        <td style="text-align:center"><img class="thumb"  src="/AA/servlet/ControllerServlet?page=ImageThumbnail" + urlSeparator + "imageId=' + album.contentSample[sampleIndex] + urlSeparator + 'sizeIndex=' + sizeIndex + '"></td>');
	}
 	dest.write(        '	        </td>');
}

function writeAlbumThumbnailBlock(dest, album, index) {
	var mouseOverFunc = 'showAlbumInfo(' + index + ')';
	var doubleClickFunc = 'albumThumbDoubleClicked(' + index + ')';
	var singleSelectFunc = 'albumThumbClicked(' + index + ', true)';
	var multiSelectFunc = 'albumThumbClicked(' + index + ', false)';

	writeThumbnailBlock(	dest,
				album,
				index,
				false,
				'album',
				mouseOverFunc,
				doubleClickFunc,
				singleSelectFunc,
				multiSelectFunc );
}

function writeImageThumbnailBlock(dest, img, index) {
	var mouseOverFunc = 'showImageInfo(' + index + ')';
	var doubleClickFunc = 'imageThumbDoubleClicked(' + index + ')';
	var singleSelectFunc = 'imageThumbClicked(' + index + ', true)';
	var multiSelectFunc = 'imageThumbClicked(' + index + ', false)';

	writeThumbnailBlock(	dest,
				img,
				index,
				true,
				'image',
				mouseOverFunc,
				doubleClickFunc,
				singleSelectFunc,
				multiSelectFunc );
}

function writeThumbnailBlock(dest, obj, index, isImage, idPrefix, mouseOverFunc, doubleClickFunc, singleSelectFunc, multiSelectFunc) {
 	//dest.write(        '\n\n<!-- - - - begin thumbnail for ' + obj.label + ' - - - -->\n');
	var tstyle = 'thumb';
	if (obj.selected) {
	    tstyle = 'thumbSelected';
	} else if (isImage && obj.comparePaneIndexes != null) {
	    tstyle = 'thumbPressed';
	}
 	dest.write(        '  <table id="' + idPrefix + index + '" class="' + tstyle + '" onmouseover="' + mouseOverFunc + '" onmouseout="resetInfoBar()" ondblclick="' + doubleClickFunc + '">');

	/**** Row containing image and icons ****/
 	dest.write(        '    <tr>');
	// The following extra table is needed to fix @bugid 1244.  Without it, the upper and lower border around a thumbnail will not be selectable on Safari 1.2.3.
	// XXX0:20040819jmg: In the future, see if this is fixed in later versions of Safari.
	dest.write(	   '    <td style="padding:0px"><table cellpadding="0" cellspacing="0" width="100%" height="100%" onmousedown="' + singleSelectFunc + '"><tr>');

	// XXX000:20041008gil: a vertical spacer in the size of the selected thumb, makes sure that the thumbnail's padding doesn't shrink to fit
	// XXX000:20041008gil: the actual image thumbnail
 	dest.write(        '      <td><img src="Static/spacer.gif" width="1" height="' + thumbImageSizeH + '"></td>');

	/**** Approved icon ****/
	// Currently, this is always false for albums
	if (showIconsOnThumbnails) {
	    dest.write(    '      <td align="center" valign="top">');
	    dest.write(    '	    <div class="thumbinfo">');
	    dest.write(	   '	      <img src="' + imagesFolder + (obj.isApproved ? 'approved' : 'blank_thumbnail_icon') + '.gif">');
	    dest.write(	   '        </div>');
	    dest.write(	   '      </td>');
	}

	/**** The image ****/
 	dest.write(        '      <td style="text-align:center;vertical-align:middle"');
	dest.write(        '	    ><img title="' + obj.tooltip+ '" alt="' + obj.tooltip+ '" ' + obj.thumbSrcWH + ' class="thumb"');
	if (!isImage) {
	    // Album images can be only 50 or 100px, so enforce that here
	    var size;
	    if (thumbnailSizeIndex == 1) { // == StaticValues.THUMBNAIL_SIZE_SMALL
		size = 50;
	    } else {
		size = 100;
	    }
	    dest.write('style="width:' + size + 'px;height:' + size + 'px;"');
	}
 	dest.write(        '      ></td>');

	/**** Compare Pane indexes ****/
	// Currently, this is always false for albums
	if (showComparePaneIndexOnThumbnails) {
	    dest.write(    '      <td align="center" valign="top">');
	    dest.write(	   '        <div class="thumbinfo">');
	    // write out each index of the compare pane in which this image appears
	    if (obj.comparePaneIndexes == null) {
		dest.write('	      <br>');
	    } else {
		for (var i = 0; i < obj.comparePaneIndexes.length; i++) {
		    dest.write('      ' + (obj.comparePaneIndexes[i]+1) + '<br>');
		}
	    }
	    dest.write(	   '	    <img src="' + imagesFolder + 'blank_thumbnail_icon.gif">'); // include this just to ensure the width of this column
	    dest.write(	   '        </div>');
	    dest.write(	   '      </td>');
	}

	// XXX000:20041008gil: a vertical spacer in the size of the selected thumb, makes sure that the thumbnail's padding doesn't shrink to fit
	// XXX000:20041008gil: the actual image thumbnail
 	dest.write(        '      <td><img src="Static/spacer.gif" width="1" height="' + thumbImageSizeH + '"></td>');

	dest.write(	   '    </tr></table></td>');
 	dest.write(        '    </tr>');

	/**** Indicator icons ****/
	// no imagetype icons if small icon size
	if (thumbnailSizeIndex != 1) {

	    var shortcutIndicator   = blankImageHtml;
	    var sharedIndicator     = blankImageHtml;
	    var inLbIndicator       = blankImageHtml;
	    var reviewedIndicator   = blankImageHtml; 
	    var indicatorSpacer	= '<img src="Static/spacer.gif" width="5" height="1">';

	    var imageTypeIcon;
	    if (isImage || (obj.isMultipageAsset && obj.ftSrc != null)) {
		imageTypeIcon = '<img align="bottom" src="' + obj.ftSrc + '" width="16" height="16" title="' + obj.ftDesc + '" alt="' + obj.ftDesc + '">';
	    } else {
		imageTypeIcon = blankImageHtml;
	    }

            // shortcut
            if( obj.isShortcut ) {
		shortcutIndicator = shortcutImageHtml;
            }

	    // is shared
            if( obj.isShared ) {
		sharedIndicator = sharedImageHtml;
            }

            // inLightbox
	    // Albums are never in lightboxes
            if( isImage && obj.isInLightbox ) {
		inLbIndicator = inProjectImageHtml;
            }

	    // has been reviewed
	    if (isImage && obj.hasReviewerComments) {
		reviewedIndicator = hasBeenReviewedHtml;
	    }

	    dest.write(        '    <tr onmousedown="' + singleSelectFunc + '"><td valign="bottom" style="padding:0px">' + imageTypeIcon + indicatorSpacer + sharedIndicator + indicatorSpacer + shortcutIndicator + indicatorSpacer + inLbIndicator + indicatorSpacer + reviewedIndicator + '</td></tr>');
	}

	/**** Thumbnail title ****/
 	dest.write(        '    <tr onmousedown="' + multiSelectFunc + '">');

	var numColsToSpan = 1;
	if (showIconsOnThumbnails) {
	    numColsToSpan++;
	}
	if (showComparePaneIndexOnThumbnails) {
	    numColsToSpan++;
	}
 	dest.write(        '      <td class="thumbtitle"' + (numColsToSpan > 1 ? ' colspan="' + numColsToSpan + '"' : '') + '>');
 	dest.write(        '        <div id="' + idPrefix + '_thumbnail_' + index + '" class="thumbtitle" align="center" style="height:14px; overflow:hidden">' + obj.label + '</div>'); // bz2721
 	dest.write(        '      </td>');
 	dest.write(        '    </tr> ');
 	dest.write(        '  </table>');
}

// gen HTML for each image in the lightbox preview
function genLbThumbHTML(lightboxPreviewHTMLArray, lbImages, lbAlbums) {
    var count = 0;

    for (var i=0; i<lbAlbums.length;i++) {
	var sb = new jsStringBuffer;
	writeLbImageThumbnailBlock(sb, lbAlbums[i], i, true);
	lightboxPreviewHTMLArray[count++] = sb.toString();
    }

    for (var i=0; i<lbImages.length;i++) {
	var sb = new jsStringBuffer;
	writeLbImageThumbnailBlock(sb, lbImages[i], i, false);
	lightboxPreviewHTMLArray[count++] = sb.toString();
    }
}

function writeLbImageThumbnailBlock(dest, img, index, isAlbum) {
 	//dest.write(        '\n\n<!-- - - - begin thumbnail for ' + img.title + ' - - - -->\n');

	var albumStr;
        var idStr;
	if (isAlbum == true){
	    albumStr = 'true';
            idStr = 'lbAlbum';
	} else {
	    albumStr = 'false';
	    idStr = 'lbImage';
	}
	
	var tstyle = (img.selected ? 'thumbSelected' : 'thumb');
 	dest.write(        '  <table id="' + idStr + index + '" class="' + tstyle + '" onmousedown="lbThumbClicked(' + index + ', true, ' + albumStr + ')">');
 	dest.write(        '    <tr>');
 	// @bugid 1059 - View Area: "File Name" tooltip is not available on View Area --%>
 	dest.write(        '      <td class="lbThumb"><img title="'+img.tooltip+'" alt="'+img.tooltip+'" ' + img.thumbSrcWH + ' class="thumb"></td>');
 	dest.write(        '    </tr>');
 	dest.write(        '  </table>');

}

function updatePathBar(image) {
    var pathBar = document.getElementById('pathBarLabel');
    if (typeof(pathBar) != 'undefined' && pathBar != null) {
        pathBar.innerHTML= image.label;
    }
}

// XXX0000000:20051006gil: hacky way to set the mode of the prev/next buttons dynamically. We need a sort of a data
// XXX0000000:20051006gil: structure to hold the state of the button dynamically. The WidgetButtonData is only good
// XXX0000000:20051006gil: for the 1st time the button is initialized
// updates the prev/next buttons mode according to the selected image location in the whole images set.
// if the 1st image is selected, the prev button should be disabled. If the next button was selected,
//  the next button should be disabled.
// XXX00:20051110rtm:bz3577:CLEANUP: added quick checks for missing images array, but cleaner will be to ensure images is not null
function updatePrevNext(image) {
    if (typeof(images) != 'undefined' && images != null) {
	var indexOfSelected = getIndexOfSelected(image);
	if (indexOfSelected == images.length -1 ) {
	    changeSrc('img_1054109', 'Static/images_JV_en_US/btn_next_h57_dis.gif');
	} else {
	    changeSrc('img_1054109', 'Static/images_JV_en_US/btn_next_h57_nor.gif');
	}
	if (indexOfSelected == 0) {
	    changeSrc('img_1054108', 'Static/images_JV_en_US/btn_prev_h57_dis.gif');
	} else {
	    changeSrc('img_1054108', 'Static/images_JV_en_US/btn_prev_h57_nor.gif');
	}
    } else {
	changeSrc('img_1054109', 'Static/images_JV_en_US/btn_next_h57_dis.gif');
	changeSrc('img_1054108', 'Static/images_JV_en_US/btn_prev_h57_dis.gif');
    }
}

function prevButtonMouseOver(imageId, imgSrc) {
    if (typeof(images) != 'undefined' && images != null
     && typeof(imageInViewer) != 'undefined' && imageInViewer != null) {
	if (imageInViewer != images[0].id) {
	    changeSrc(imageId, imgSrc);
	}
    }
}

function nextButtonMouseOver(imageId, imgSrc) {
    if (typeof(images) != 'undefined' && images != null
     && typeof(imageInViewer) != 'undefined' && imageInViewer != null) {
	if (imageInViewer != images[images.length-1].id) {
	    changeSrc(imageId, imgSrc);
	}
    }
}

function prevButtonMouseOut(imageId, imgSrc) {
    if (typeof(images) != 'undefined' && images != null
     && typeof(imageInViewer) != 'undefined' && imageInViewer != null) {
	if (imageInViewer != images[0].id) {
	    changeSrc(imageId, imgSrc);
	}
    }
}

function nextButtonMouseOut(imageId, imgSrc) {
    if (typeof(images) != 'undefined' && images != null
     && typeof(imageInViewer) != 'undefined' && imageInViewer != null) {
	if (imageInViewer != images[images.length-1].id) {
	    changeSrc(imageId, imgSrc);
	}
    }
}

function getIndexOfSelected(selectedImage) {
    var indexOfSelected;
    for (var i = 0 ; i < images.length ; i++) {
	if (images[i].id == selectedImage.id) {
	    indexOfSelected = i;
	}
    }
    return indexOfSelected;
}

function getNextImage() {
    for (var i = 0 ; i < images.length-1 ; i++) { // XXX00:20051110rtm: don't look at last image; no "next" after that
	if (images[i].id == imageInViewer) {
//bz4418    imageInViewer = images[i + 1].id;
	    imageThumbClicked(i+1, true, false);
	    break;
	}
    }
}

function getPrevImage() {
    for (var i = 1 ; i < images.length ; i++) {	// XXX00:20051110rtm: don't look at first image; no "prev" before that
	if (images[i].id == imageInViewer) {
//bz4418    imageInViewer = images[i -1].id;
	    imageThumbClicked(i-1, true, false);
	    break;
	}
    }
}

function getCurrentImage() {
    if (typeof(images) != 'undefined' && images != null) {
	if (arrayInWhichLastClicked == null) { // if this is the 1st time, we need to initialize this array
	    arrayInWhichLastClicked = images;
	}
	for (var i = 0 ; i < images.length ; i++) {
	    if (images[i].id == imageInViewer) {
		updateViewer(images[i]);
		break;
	    }
	}
    } else {
	updatePrevNext(null);
    }
}

// EOF