var ImageScroller = function(_instance_id, _imageScrollerParentDivID, _imageScrollerChildDivID) {
   _imageScrollerParentDivID = getElem(_imageScrollerParentDivID); 
   _imageScrollerChildDivID = getElem(_imageScrollerChildDivID); 

   var hasShown=new Array();
   this.id = _instance_id;

   _imageScrollerChildDivID.style.left="0px";
   var prImagePaths = new Array(); 
   var prImageAltText = new Array(); 
   var prImageClicks = new Array(); 
   var prImageDescription = new Array(); 
   var iNumOfThumbsShown = 1; 
   var iNumOfImages; 
   
   var bAutoScroll = 0; 
   //0=false, 1=true
   var iAutoScrollDelay = 2000; 
   var bAutoScrollDirection = 1; 
   //0=back, 1=forward
   var bAutoReverse = 1; 
   //0=false, 1=true
   var iScrollType = 1; 
   //0=horizontal, 1=vertical
   var bEnableThumbBorder = 0; 
   //0=no, 1=yes
   var bEnableCurrentCount = 0; 
   //0=no, 1=yes
   var bEnableThumbDescription = 0; 
   //0=no, 1=yes
   var iImageScrollAmount = 1;
   //number of images to scroll
   
   var objCounterDiv = ""; 
   var objDescriptionDiv = ""; 
   var iSmoothSlideInterval = 3; 
   var iSmoothSlideAmount = 7; 
   var moveTimer; 
   
   this.THUMB_HEIGHT = 80; 
   this.THUMB_WIDTH = 80; 
   this.THUMB_PADDING = 4; 
   
   this.CURRENT_THUMB_INDEX = 1; 
   this.VISIBLE_FROM = 1;
   
   var NEW_REVERSE_OFFSET = 0; 
   var MAX_REVERSE_OFFSET = 0; 
   var NEW_FORWARD_OFFSET = 0; 
   var IS_SCROLLING = false; 
   //* BEGIN FUNCTIONS *//
   this.setNumOfImageToScroll = function(_NumOfImagesToScroll) {
        iImageScrollAmount = parseInt(_NumOfImagesToScroll);
   };
   this.enableThumbnailDescription = function(_descriptionDivID) {
      bEnableThumbDescription = 1; 
      objDescriptionDiv = _descriptionDivID; 
      }; 
   this.setScrollType = function(_iType) {
      if (_iType == 0) {
         iScrollType = 0; 
         }
      else {
         iScrollType = 1; 
         }
      }; 
   this.setScrollSpeed = function(_iSpeed) {
      if (_iSpeed > 0 || _iSpeed < 1000) {
         iSmoothSlideInterval = _iSpeed; 
         }
      else {
         iSmoothSlideInterval = 7; 
         }
      }; 
   this.setScrollAmount = function(_iAmount) {
      if (_iAmount > 0 || _iAmount < 1000) {
         iSmoothSlideAmount = _iAmount; 
         }
      else {
         iSmoothSlideAmount = 7; 
         }
      }; 
   this.enableCurrentCount = function(_counterDivID) {
      bEnableCurrentCount = 1; 
      objCounterDiv = _counterDivID; 
      }; 
   this.enableThumbBorder = function(_boolean) {
      bEnableThumbBorder = _boolean; 
      }; 
   this.setThumbsShown = function(_newNumOfThumbsShown) {
      iNumOfThumbsShown = parseInt(_newNumOfThumbsShown); 
      this.VISIBLE_TO = iNumOfThumbsShown;
      }; 
   this.addThumbnail = function(_thumbnailURL, _fullClickURL, _thumbnailAlt, _thumbnailDescription) {
      prImagePaths[prImagePaths.length] = _thumbnailURL; 
      prImageClicks[prImageClicks.length] = _fullClickURL; 
      prImageAltText[prImageAltText.length] = _thumbnailAlt; 
      prImageDescription[prImageDescription.length] = _thumbnailDescription; 
      }; 
   this.setThumbnailHeight = function(_newThumbHeight) {
      this.THUMB_HEIGHT = _newThumbHeight; 
      }; 
   this.getThumbnailHeight = function() {
      return this.THUMB_HEIGHT; 
      }; 
   this.setThumbnailWidth = function(_newThumbWidth) {
      this.THUMB_WIDTH = _newThumbWidth; 
      }; 
   this.getThumbnailWidth = function() {
      return this.THUMB_WIDTH; 
      }; 
   this.setThumbnailPadding = function(_newThumbPadding) {
      this.THUMB_PADDING = _newThumbPadding; 
      }; 
   this.getThumbnailPadding = function() {
      return THUMB_PADDING; 
      }; 
   this.setCurrentThumbIndex = function(_newThumbIndex) {
      this.CURRENT_THUMB_INDEX = _newThumbIndex; 
      }; 
   this.getCurrentThumbIndex = function() {
      return this.CURRENT_THUMB_INDEX; 
      }; 
   this.getThumbnailCount = function() {
      return iNumOfImages; 
      }; 
   this.renderScroller = function() {
      iNumOfImages = prImagePaths.length;
      if (iNumOfThumbsShown > iNumOfImages) {
         iNumOfThumbsShown = iNumOfImages; 
         }
      MAX_REVERSE_OFFSET = 0 - (iNumOfImages - iNumOfThumbsShown) * (this.THUMB_WIDTH + 2 * this.THUMB_PADDING); 
      if (bEnableThumbBorder == 1) {
         MAX_REVERSE_OFFSET = MAX_REVERSE_OFFSET - (iNumOfImages * 4); 
         }
      if (iScrollType == 0) {
         _imageScrollerParentDivID.style.width = (this.THUMB_WIDTH * iNumOfThumbsShown) + (iNumOfThumbsShown * (this.THUMB_PADDING * 2)) + "px"; 
         if (bEnableThumbBorder == 1) {
            _imageScrollerParentDivID.style.width = (parseInt(_imageScrollerParentDivID.style.width) + (iNumOfThumbsShown * 4)) + "px"; 
            }
         _imageScrollerParentDivID.style.height = this.THUMB_HEIGHT + (this.THUMB_PADDING * 2) + "px"; 
         if (bEnableThumbBorder == 1) {
            _imageScrollerParentDivID.style.height = (parseInt(_imageScrollerParentDivID.style.height) + 4) + "px"; 
            }
         _imageScrollerChildDivID.style.width = (this.THUMB_WIDTH * iNumOfImages) + (iNumOfImages * (this.THUMB_PADDING * 2)) + "px"; 
         if (bEnableThumbBorder == 1) {
            _imageScrollerChildDivID.style.width = (parseInt(_imageScrollerChildDivID.style.width) + (iNumOfImages * 4)) + "px"; 
            }
         }
      else if (iScrollType == 1) {
         _imageScrollerParentDivID.style.width = (this.THUMB_WIDTH) + ((this.THUMB_PADDING * 2)) + "px"; 
         if (bEnableThumbBorder == 1) {
            _imageScrollerParentDivID.style.width = (parseInt(_imageScrollerParentDivID.style.width) + (4)) + "px"; 
            }
         _imageScrollerParentDivID.style.height = (this.THUMB_HEIGHT * iNumOfThumbsShown) + (iNumOfThumbsShown * (this.THUMB_PADDING * 2)) + "px"; 
         if (bEnableThumbBorder == 1) {
            _imageScrollerParentDivID.style.height = (parseInt(_imageScrollerParentDivID.style.height) + (iNumOfThumbsShown * 4)) + "px"; 
            }
         _imageScrollerChildDivID.style.width = (this.THUMB_WIDTH) + (this.THUMB_PADDING * 2) + "px"; 
         if (bEnableThumbBorder == 1) {
            _imageScrollerChildDivID.style.width = (parseInt(_imageScrollerChildDivID.style.width) + 4) + "px"; 
            }
         }
      //*** [Begin] Image Cacheing code ***//
      var oDiv;
      var oImage;
        
      for (i = 0; i < iNumOfImages; i++) {
        oDiv = document.createElement("div");
	oDiv.className = "floatLeft"; 
        oDiv.title = prImageAltText[i]; 
	oDiv.onclick = new Function(this.id + '.changeImage(' + (i + 1) + ');')

        oImage = document.createElement("img");
            oImage.src = prImagePaths[i];
            oImage.id = 'thumb_' + i;
            oImage.alt = prImageAltText[i];
            oImage.title = prImageAltText[i];
            oImage.border = 0;
            oImage.width = this.THUMB_WIDTH;
            oImage.height = this.THUMB_HEIGHT;
            oImage.style.padding = this.THUMB_PADDING+"px";
            if(i==0) oImage.className='currentImage';
            
          oDiv.appendChild(oImage);
          _imageScrollerChildDivID.appendChild(oDiv);
            
      }
      //*** [End]   Image Cacheing code ***//
      
      if (bEnableCurrentCount == 1) {
         addAnEvent(window, "load", this.updateCurrentCount); 
         }
      if (bEnableThumbDescription == 1) {
         addAnEvent(window, "load", this.updateCurrentDescription); 
         }
      }; 

   addAnEvent(window, "load", loadMain); 

   addAnEvent(document, "keydown", scrollerKeys); 


   this.scrollReverse = function() {
      _origOffset = parseInt(_imageScrollerChildDivID.style.left); 
      _currentOffset = parseInt(_imageScrollerChildDivID.style.left); 
      _newOffset = Math.min(_currentOffset + ((this.THUMB_WIDTH + 2 * this.THUMB_PADDING) * iImageScrollAmount), 0); 

      endStops((_newOffset == 0)?'first':'');

      if (bEnableThumbBorder == 1) _newOffset = _newOffset + 4;

      if (_newOffset <= 0) {
         if(_currentOffset > (_origOffset - (this.THUMB_WIDTH * iImageScrollAmount))) {
            if (IS_SCROLLING == false) {
               NEW_REVERSE_OFFSET = _newOffset;
	       this.VISIBLE_FROM = 1 - _newOffset/(this.THUMB_WIDTH + 2 * this.THUMB_PADDING);
	       this.VISIBLE_TO = this.VISIBLE_FROM + iNumOfThumbsShown - 1;
               moveScrollerRight();
	       if(this.VISIBLE_TO < this.CURRENT_THUMB_INDEX || this.VISIBLE_FROM > this.CURRENT_THUMB_INDEX) this.changeImage(this.VISIBLE_TO);
               }
            }
         }
      }; 
   this.scrollForward = function(_scrollQty) {
      _scrollQty = typeof(_scrollQty) != 'undefined' ? _scrollQty : 1;

      _origOffset = parseInt(_imageScrollerChildDivID.style.left); 
      _currentOffset = parseInt(_imageScrollerChildDivID.style.left); 
      _newOffset = Math.max(_currentOffset - ((this.THUMB_WIDTH + 2 * this.THUMB_PADDING) * iImageScrollAmount * _scrollQty), MAX_REVERSE_OFFSET); 

      endStops((_newOffset == MAX_REVERSE_OFFSET)?'last':'');

      if (bEnableThumbBorder == 1) _newOffset = _newOffset - 4;

      if (IS_SCROLLING == false && _newOffset >= MAX_REVERSE_OFFSET) {
         NEW_FORWARD_OFFSET = _newOffset;
         this.VISIBLE_FROM = 1 - _newOffset/(this.THUMB_WIDTH + 2 * this.THUMB_PADDING);
         this.VISIBLE_TO = this.VISIBLE_FROM + iNumOfThumbsShown - 1;
         moveScrollerLeft(); 
	 if(this.VISIBLE_TO < this.CURRENT_THUMB_INDEX || this.VISIBLE_FROM > this.CURRENT_THUMB_INDEX) this.changeImage(this.VISIBLE_FROM);
         }
      }; 

   this.scrollEnd = function() {
      endStops('last');
      if (IS_SCROLLING == false) {
         NEW_FORWARD_OFFSET = MAX_REVERSE_OFFSET; 
         moveScrollerLeft(); 
	 this.changeImage(iNumOfImages);
         }
      }; 
   this.scrollBegin = function() {
      endStops('first');
      if (IS_SCROLLING == false) {
         NEW_REVERSE_OFFSET = 0; 
         moveScrollerRight(); 
	 this.changeImage(1);	
         }
      }; 

   function endStops(whichEnd) {
	document.getElementById('nextThumbsBtn').className = (whichEnd == 'last')?'scrollerBtnGreyed':'scrollerBtnActive';
	document.getElementById('lastThumbsBtn').className = (whichEnd == 'last')?'scrollerBtnGreyed':'scrollerBtnActive';

	document.getElementById('prevThumbsBtn').className = (whichEnd == 'first')?'scrollerBtnGreyed':'scrollerBtnActive';
	document.getElementById('firstThumbsBtn').className = (whichEnd == 'first')?'scrollerBtnGreyed':'scrollerBtnActive';
   }


   function scrollerKeys(e){
	if(document.getElementById('fog') && document.getElementById('fog').style.display=='none') return;
	if(!e){					// browser didn't pass event
		if(window.event){		// IE
			e=window.event;
		}else{				// Total fail. Abort!!!
			return;		
		}
	}
	var keynum
	if(window.event){keynum = e.keyCode}	// IE
	else if(e.which){keynum = e.which}	// Netscape/Firefox/Opera
	if(keynum==39) myScroller.changeImage(Math.min(myScroller.CURRENT_THUMB_INDEX + 1, myScroller.getThumbnailCount()));
	if(keynum==37) myScroller.changeImage(Math.max(myScroller.CURRENT_THUMB_INDEX - 1, 1));
	if(keynum==27) popup('popUpDiv');
	return false; 
   }


   this.changeImage = function (imageID){
	if(imageID > 0 && imageID <= iNumOfImages && imageID != this.CURRENT_THUMB_INDEX){
		if(hasShown[imageID] != true) {
			if(imageID != 1) isLoading=true;
			hasShown[imageID] = true;
		}
		document.mainimage.src = prImageClicks[imageID-1];
		setTimeout("if(isLoading) document.getElementById('loading').style.display='block';",300); 
		this.setCurrentThumbIndex(imageID);
		this.updateCurrentCount();
		this.updateCurrentDescription();
		if(this.VISIBLE_FROM > imageID) this.scrollReverse();
		if(this.VISIBLE_TO < imageID) this.scrollForward(Math.ceil((imageID-this.VISIBLE_TO)/iNumOfThumbsShown));

		document.getElementById('nextImageBtn').className = ((imageID) >= iNumOfImages)?'scrollerBtnGreyed':'scrollerBtnActive';
		document.getElementById('prevImageBtn').className = (imageID <= 1)?'scrollerBtnGreyed':'scrollerBtnActive';
		for (x in prImageClicks){
			document.getElementById('thumb_' + x).className=(x==imageID-1)?'currentImage':'';
		}
	}
   }




   this.updateCurrentDescription = function() {
      getElem(objDescriptionDiv).innerHTML = prImageDescription[this.CURRENT_THUMB_INDEX - 1]; 
      }; 
   this.updateCurrentCount = function() {
      getElem(objCounterDiv).innerHTML = this.CURRENT_THUMB_INDEX + "/" + iNumOfImages; 
      }; 

   function moveScrollerRight() {
      _ElementObj = _imageScrollerChildDivID; 
      _currentOffset = parseInt(_ElementObj.style.left); 
      if (_currentOffset < NEW_REVERSE_OFFSET && (_currentOffset + iSmoothSlideAmount) <= NEW_REVERSE_OFFSET) {
         _ElementObj.style.left = _currentOffset + iSmoothSlideAmount + "px"; 
         IS_SCROLLING = true; 
         moveTimer = window.setTimeout(moveScrollerRight, iSmoothSlideInterval); 
         }
      else if (_currentOffset < NEW_REVERSE_OFFSET) {
         _ElementObj.style.left = _currentOffset + 1 + "px"; 
         IS_SCROLLING = true; 
         moveTimer = window.setTimeout(moveScrollerRight, iSmoothSlideInterval); 
         }
      else {
         IS_SCROLLING = false; 
         window.clearTimeout(moveTimer); 
         }
      }; 
   function moveScrollerLeft() {
      _ElementObj = _imageScrollerChildDivID; 
      _currentOffset = parseInt(_ElementObj.style.left); 
      if (_currentOffset > NEW_FORWARD_OFFSET && (_currentOffset - iSmoothSlideAmount) >= NEW_FORWARD_OFFSET) {
         _ElementObj.style.left = _currentOffset - iSmoothSlideAmount + "px"; 
         IS_SCROLLING = true; 
         moveTimer = window.setTimeout(moveScrollerLeft, iSmoothSlideInterval); 
         }
      else if (_currentOffset > NEW_FORWARD_OFFSET) {
         _ElementObj.style.left = _currentOffset - 1 + "px"; 
         IS_SCROLLING = true; 
         moveTimer = window.setTimeout(moveScrollerLeft, iSmoothSlideInterval); 
         }
      else {
         IS_SCROLLING = false; 
         window.clearTimeout(moveTimer);	
         }
      }; 

   function addAnEvent(_obj, _eventName, _functionName) {
      if (window.addEventListener) {
         _obj.addEventListener(_eventName, _functionName, false); 
         }
      else {
         _obj.attachEvent("on" + _eventName, _functionName); 
         }
      }; 

   function getElem(_elemID) {
      return document.getElementById(_elemID); 
      }; 
   };