var mhDS=0;
  var mhDSS=0;
  
  var cx=-1;
  var cy=-1;
  var mhNextImageTimer;

  var mhHighlightOffset=0;

  var mhHighlightX;
  var mhHightlightY;
  
  var mhLock=0;
  
  var mhdockpos=500;
  
  var mhTimerHide;

  var mhImageCount=10; // number of images in array;
  
  var currentImage=1;
  
  var mhImageUrl=new Array();   // array of image urls
  var mhImageThumb=new Array(); // array of thumb urls
  
  var mhImageLoad=new Array();
  var mhThumbLoad=new Array();
    
	
  var thumbNum;
  
  // Process images
  
  
  mhImageUrl[1]=new Image();
  mhImageUrl[2]=new Image();
  mhImageUrl[3]=new Image();
  mhImageUrl[4]=new Image();
  mhImageUrl[5]=new Image();
  mhImageUrl[6]=new Image();
  mhImageUrl[7]=new Image();
  mhImageUrl[8]=new Image();
  mhImageUrl[9]=new Image();
  mhImageUrl[10]=new Image();
  
  mhImageThumb[1]=new Image();
  mhImageThumb[2]=new Image();
  mhImageThumb[3]=new Image();
  mhImageThumb[4]=new Image();
  mhImageThumb[5]=new Image();
  mhImageThumb[6]=new Image();
  mhImageThumb[7]=new Image();
  mhImageThumb[8]=new Image();
  mhImageThumb[9]=new Image();
  mhImageThumb[10]=new Image();  
  
  mhImageLoad[1]=0;
  mhImageLoad[2]=0;
  mhImageLoad[3]=0;
  mhImageLoad[4]=0;
  mhImageLoad[5]=0;
  mhImageLoad[6]=0;
  mhImageLoad[7]=0;
  mhImageLoad[8]=0;
  mhImageLoad[9]=0;
  mhImageLoad[10]=0;  
  
  mhThumbLoad[1]=0;
  mhThumbLoad[2]=0;
  mhThumbLoad[3]=0;
  mhThumbLoad[4]=0;
  mhThumbLoad[5]=0;
  mhThumbLoad[6]=0;
  mhThumbLoad[7]=0;
  mhThumbLoad[8]=0;
  mhThumbLoad[9]=0;
  mhThumbLoad[10]=0;  
  
  function preloadImages() {
  
    mhImageUrl[1].src="images/oak-worktop-01.jpg";
    mhImageUrl[2].src="images/oak-worktop-02.jpg";
    mhImageUrl[3].src="images/oak-worktop-03.jpg";
    mhImageUrl[4].src="images/oak-worktop-04.jpg";
    mhImageUrl[5].src="images/oak-worktop-05.jpg";
    mhImageUrl[6].src="images/oak-worktop-06.jpg";
    mhImageUrl[7].src="images/oak-worktop-07.jpg";
	mhImageUrl[8].src="images/oak-worktop-08.jpg";
	mhImageUrl[9].src="images/oak-worktop-09.jpg";
	mhImageUrl[10].src="images/oak-worktop-10.jpg";	
  
    mhImageThumb[1].src="images/thumbs/oak-worktop-01.jpg";
    mhImageThumb[2].src="images/thumbs/oak-worktop-02.jpg";
    mhImageThumb[3].src="images/thumbs/oak-worktop-03.jpg";
    mhImageThumb[4].src="images/thumbs/oak-worktop-04.jpg";
    mhImageThumb[5].src="images/thumbs/oak-worktop-05.jpg";
    mhImageThumb[6].src="images/thumbs/oak-worktop-06.jpg";
    mhImageThumb[7].src="images/thumbs/oak-worktop-07.jpg";
	mhImageThumb[8].src="images/thumbs/oak-worktop-08.jpg";
	mhImageThumb[9].src="images/thumbs/oak-worktop-09.jpg";
	mhImageThumb[10].src="images/thumbs/oak-worktop-10.jpg";	
  
  }
  
  
 
  
  function mhGallTimer() {
	
    clearTimeout ( mhTimerHide );
	
    if (mhdockpos>420) {
      mhGallFocus();
    }

    mhTimerHide  = setTimeout ( "mhGallBlur()" , 3500 );

  }
  
  
  function mhCreateDock() {
  
    preloadImages();
	
	mhTempDockHTML="";
	
	for (i=1; i<=mhImageCount ; i++) {
	  mhTempDockHTML=mhTempDockHTML+"<img src='"+mhImageUrl[i].src+"' onload='mhLoaded("+i+",0)'><img src='"+mhImageThumb[i].src+"' onload='mhLoaded(0,"+i+")'>";
	}
	
	document.getElementById('mhloadimages').innerHTML=mhTempDockHTML;
	
	mhTempDockHTML="";
  
    document.getElementById('mhdockbar').style.width=(mhImageCount*100)+'px';
	if (mhImageCount>9){
	  document.getElementById('mhdockbar').style.width='900px';
	  mhHighlightOffset=(mhImageCount*100)-900;
	  document.getElementById('mhdockbar').style.left=0-(mhHighlightOffset*((currentImage-1)/mhImageCount))+'px';
	  document.getElementById('mhHighlight').style.left=(900*((currentImage-1)/mhImageCount))+'px';
	}else{
	  mhHighlightOffset=(900-(mhImageCount*100))/2;
	  document.getElementById('mhHighlight').style.left=mhHighlightOffset+(currentImage*100)-100+'px';
	  document.getElementById('mhdockbar').style.width=(mhImageCount*100)+'px';
	  document.getElementById('mhdockbar').style.left=((900-(mhImageCount*100))/2)+'px';
	}
	
}


function mhLoaded(tI,tT) {

  if (tI>0&&tI<=mhImageCount){
    mhImageLoad[tI]=1;
  }

  if (tT>0&&tT<=mhImageCount){
    mhThumbLoad[tT]=1;
  }

  
  mhDSS=1;
  
  for (i=1;i<=mhImageCount;i++) {
    mhDSS=mhDSS*mhImageLoad[i]*mhThumbLoad[i];
  }

  if (mhDSS!=0) {
    mhStartDock();
  }
}

	
function mhStartDock() {
	
	mhNextImageTimer = setTimeout ( "mhNextImage()" , 7000);
	
	mhTempDockHTML="";
	
	for (i=1; i<mhImageCount+1; i++) {
	  mhTempDockHTML=mhTempDockHTML+"<div style='z-index:998;position:absolute;top:0px;width:100px;height:70px;left:"+((i-1)*100)+"px' class='mhThumbDiv' id='mhThumbDiv"+i+"'><img style='z-index:999;' src='"+mhImageThumb[i].src+"' id='mhThumbImg"+i+"' class='mhThumbImg' onClick='mhClickThumb("+i+");' onMouseOver='mhGallFocus();mhOverThumb(this.id);' onMouseOut='mhOutThumb(this.id);'></div>"
	}
	
	document.getElementById('mhdockcode').innerHTML=mhTempDockHTML;
	
	document.getElementById('mhslide').src=mhImageUrl[currentImage].src;
	
	
	mhDS=1;
  }
  
  
  function mhOverThumb(thumbNum) {

 
    document.getElementById(thumbNum).style.width="90px";
    document.getElementById(thumbNum).style.height="60px";
    document.getElementById(thumbNum).style.left="5px";
    document.getElementById(thumbNum).style.top="0px";

  }
  
  function mhOutThumb(thumbNum) {
    document.getElementById(thumbNum).style.width="72px";
    document.getElementById(thumbNum).style.height="48px";
    document.getElementById(thumbNum).style.left="14px";
    document.getElementById(thumbNum).style.top="6px";
  }
  
  function mhGallFocus(){
  
    if (mhDS!=0){
  
    clearTimeout ( mhTimerHide );
    document.getElementById('mhdock').style.visibility='visible';
    
	
    if (mhdockpos<=420) {
	  mhdockpos=420;
	  document.getElementById('mhdock').style.top="420px";
	}else{
	  document.getElementById('mhdock').style.top=newMHdocktop()+"px";
      mhTimerHide = setTimeout ( "mhGallFocus()" , 50 );
	}
	
	}
  }
  
  function mhGallBlur(){
  clearTimeout ( mhTimerHide );
    if (mhdockpos>=500) {
	  mhdockpos=500;
	  document.getElementById('mhdock').style.top="500px";
      document.getElementById('mhdock').style.visibility='hidden';
	}else{
      document.getElementById('mhdock').style.visibility='visible';
	  document.getElementById('mhdock').style.top=newMHdockbottom()+"px";
      mhTimerHide = setTimeout ( "mhGallBlur()" , 50 );
	}
  
  
  }
  
  
  function mhClickThumb(thumbNum){
   if (thumbNum!=currentImage){
     mhTransAnimate(currentImage,thumbNum,20,20);
   }
  }
  
  
  function mhTransAnimate(imageStart, imageEnd,imageTotalFrames, imageFramesLeft){
  
  clearTimeout ( mhNextImageTimer );
  
    if (imageFramesLeft<=0){
	
	

	
	
	  currentImage=imageEnd;
	  document.getElementById('mhslide').src=mhImageUrl[currentImage].src;

	  if (mhImageCount>9){
		  document.getElementById('mhdockbar').style.left=0-(mhHighlightOffset*((currentImage-1)/mhImageCount))+'px';
	  document.getElementById('mhHighlight').style.left=(900*((currentImage-1)/mhImageCount))+'px';  
	  }else{
	    document.getElementById('mhHighlight').style.left=(mhHighlightOffset-100+(imageEnd*100))+'px';
	  }

	  
	  document.getElementById('mhtransout').style.visibility='hidden';
	  document.getElementById('mhtransin').style.visibility='hidden';
	  
	  
	  mhNextImageTimer = setTimeout ( "mhNextImage()" , 7000);
	  
	}else{  
	
	  if (mhImageCount>9){
	  

		    document.getElementById('mhdockbar').style.left=((0-(mhHighlightOffset*((imageEnd-1)/mhImageCount)))-(0-(mhHighlightOffset*((imageStart-1)/mhImageCount))))*((imageTotalFrames-imageFramesLeft)/imageTotalFrames)+((0-(mhHighlightOffset*((imageStart-1)/mhImageCount))))+'px';
	        document.getElementById('mhHighlight').style.left=((900*((imageEnd-1)/mhImageCount))-(900*((imageStart-1)/mhImageCount)))*((imageTotalFrames-imageFramesLeft)/imageTotalFrames)+(900*((imageStart-1)/mhImageCount))+'px';  


	  
	  
	  
	  
	  }else{
	    document.getElementById('mhHighlight').style.left=((mhHighlightOffset-100+(imageEnd*100))-(mhHighlightOffset-100+(imageStart*100)))*((imageTotalFrames-imageFramesLeft)/imageTotalFrames)+(mhHighlightOffset-100+(imageStart*100))+'px';
	  }
	
	  document.getElementById('mhslideout').src=mhImageUrl[imageStart].src;
	  document.getElementById('mhslidein').src=mhImageUrl[imageEnd].src;
	  
	  document.getElementById('mhtransout').style.visibility='visible';
	  document.getElementById('mhtransin').style.visibility='visible';
	  
	  document.getElementById('mhtransout').style.left=((900*(imageFramesLeft/imageTotalFrames))-900)+"px";
	  document.getElementById('mhtransin').style.left=(900*(imageFramesLeft/imageTotalFrames))+"px";
	  
  
      mhImageSwitch= setTimeout ( "mhTransAnimate("+imageStart+","+imageEnd+","+imageTotalFrames+","+(imageFramesLeft-1)+")" , 33.33333333);
	
	}
  }
  
  function newMHdocktop() {
	mhdockpos=mhdockpos-15;
	if (mhdockpos<420) {
	  mhdockpos=420;
	}
	return mhdockpos;
  }
  
    function newMHdockbottom() {
		mhdockpos=mhdockpos+10;
	if (mhdockpos>500) {
	  mhdockpos=500;
	}
	return mhdockpos;
  }
  
  function mhNextImage() {
	
	mhTransAnimate(currentImage, mhGetNextImage(),40, 40);
  }
  
  function mhGetNextImage() {
    if (currentImage+1>mhImageCount) {
	  return 1;
	}else{
	  return currentImage+1;
	}
  }