// IMAGE RESIZING SCRIPT.
// Given an image name of xyz: 
// - the image file names are respectively xyz1.jpg, xyz2.jpg, xyz3.jpg 
//   for small, medium, large;
// - they are found in subdirectory img
// - the image element name is imgxyz

var small=1; medium=2; large=3;  // parameter values

// Define entries in imgArr
var iname=0; smaWidth=1; smaHeight=2; medWidth=3; medHeight=4; larWidth=5; larHeight=6;

// List the images and their sizes
var imgArr = [
["w",    165, 104, 165, 104, 185, 117],
["x",    165, 124, 165, 124, 185, 140],
["y",    165, 124, 165, 124, 185, 139],
["z",    165, 123, 165, 123, 186, 137],
["a",    165, 64, 165, 64, 185, 71],
["b",    165, 109, 165, 109, 185, 123],
["c",    195, 90, 195, 90, 214, 99],
["d",    200, 32, 195, 30, 221, 34]
]

// -----------------------------------------------------
// Change image sizes.
// Parameter value: small/medium/large 
// -----------------------------------------------------
function changeimg(imgsize) {
  // improve later:  grey-out/disable currently irrelevant button
  var imgwidth, imgheight, imgid;

  switch(imgsize) {
    case small:  imgwidth=smaWidth; imgheight=smaHeight; imgid='1'; break;
    case medium: imgwidth=medWidth; imgheight=medHeight; imgid='2'; break;
    case large:  imgwidth=larWidth; imgheight=larHeight; imgid='3'; break;
    default:     alert('Javascript error 1; please shoot the author');
  }

  for (var n=0; n<imgArr.length; n++)
  { 
    imgElement = 'img'+imgArr[n][iname];
    document.images[imgElement].width = imgArr[n][imgwidth];
    document.images[imgElement].height= imgArr[n][imgheight];
    document.images[imgElement].src = 'img/' + imgArr[n][iname] + imgid + '.gif';
  }
}

// -----------------------------------------------------
// Get window width in pixels; returns 0 if unidentifiable.
// -----------------------------------------------------
function getWindowWidth(){
  var ww = 0;
  d = document;
   if ( typeof window.innerWidth != 'undefined' )
     ww = window.innerWidth;  // NN and Opera version
   else
   {
     if ( d.documentElement
       && typeof d.documentElement.clientWidth!='undefined'
       && d.documentElement.clientWidth != 0 )
       ww = d.documentElement.clientWidth;
     else
       if ( d.body
         && typeof d.body.clientWidth != 'undefined' )
         ww = d.body.clientWidth;
     else alert ("Can't identify window width - please tell me which browser you are using.")
   }
   return ww;
}

// -----------------------------------------------------
// Adjust image size according to window width
// -----------------------------------------------------
function resizeimg() {
  var ww = getWindowWidth();

  if (ww>0) {
    if (ww<805) changeimg(small)
    else if (ww>900) changeimg(large)
    else changeimg (medium);
  }
}

