products = new Array();
  // Array elements and lengths.
  productArrayLength  = 11;
  elCompanyId         = 0;
  elProductCategoryId = 1;
  elProductId         = 2;
//  elProductCode       = 3;
//  elProductText       = 4;
  elProductName       = 3;
  elFile1             = 4;
  elFile2             = 5;
  elFile3             = 6;
  elFile4             = 7;
  elFile5             = 8;
  elFile6             = 9;
  elColours           = 10;

  colourArrayLength = 9;
  elColourId        = 0;
  elColour          = 1;
  elColourFile1     = 2;
  elColourFile2     = 3;
  elColourFile3     = 4;
  elColourFile4     = 5;
  elColourFile5     = 6;
  elColourFile6     = 7;
  elSizes           = 8;

  sizeArrayLength    = 7;
  elSizeId           = 0;
  elSize             = 1;
  elPrice            = 2;
  elNormalPrice      = 3;
  elPriceRecommended = 4;
  elStock            = 5;
  elThreshold        = 6;

  var filesContext = '';
  var imgFile = elFile1;
  var imgColourFile = elColourFile1;

  function addProduct(productIndex,companyId,productCategoryId,productId,productName,productFileName1,productFileName2,productFileName3,productFileName4,productFileName5,productFileName6,colourCount)
  {
    products[productIndex] = new Array(productArrayLength);
    products[productIndex][elCompanyId] = companyId;
    products[productIndex][elProductCategoryId] = productCategoryId;
    products[productIndex][elProductId] = productId;
    products[productIndex][elProductName] = productName;
    products[productIndex][elFile1] = productFileName1;
    products[productIndex][elFile2] = productFileName2;
    products[productIndex][elFile3] = productFileName3;
    products[productIndex][elFile4] = productFileName4;
    products[productIndex][elFile5] = productFileName5;
    products[productIndex][elFile6] = productFileName6;
    products[productIndex][elColours] = new Array(colourCount);
  }

  function addColour(productIndex,colourIndex,colourId,colour,productColourProductFileName1,productColourProductFileName2,productColourProductFileName3,productColourProductFileName4,productColourProductFileName5,productColourProductFileName6,sizeCount)
  {
    products[productIndex][elColours][colourIndex] = new Array(colourArrayLength);
    products[productIndex][elColours][colourIndex][elColourId] = colourId;
    products[productIndex][elColours][colourIndex][elColour] = colour;
    products[productIndex][elColours][colourIndex][elColourFile1] = productColourProductFileName1;
    products[productIndex][elColours][colourIndex][elColourFile2] = productColourProductFileName2;
    products[productIndex][elColours][colourIndex][elColourFile3] = productColourProductFileName3;
    products[productIndex][elColours][colourIndex][elColourFile4] = productColourProductFileName4;
    products[productIndex][elColours][colourIndex][elColourFile5] = productColourProductFileName5;
    products[productIndex][elColours][colourIndex][elColourFile6] = productColourProductFileName6;
    products[productIndex][elColours][colourIndex][elSizes] = new Array(sizeCount);
  }

  function addSize(productIndex,colourIndex,sizeIndex,productSizeId,productSize,productPrice,productNormalPrice,productPriceRecommended,productColourSizeStock,productColourSizeStockThreshold)
  {
    products[productIndex][elColours][colourIndex][elSizes][sizeIndex] = new Array(sizeArrayLength);
    products[productIndex][elColours][colourIndex][elSizes][sizeIndex][elSizeId] = productSizeId;
    products[productIndex][elColours][colourIndex][elSizes][sizeIndex][elSize] = productSize;
    products[productIndex][elColours][colourIndex][elSizes][sizeIndex][elPrice] = productPrice;
    products[productIndex][elColours][colourIndex][elSizes][sizeIndex][elNormalPrice] = productNormalPrice;
    products[productIndex][elColours][colourIndex][elSizes][sizeIndex][elPriceRecommended] = productPriceRecommended;
    products[productIndex][elColours][colourIndex][elSizes][sizeIndex][elStock] = productColourSizeStock;
    products[productIndex][elColours][colourIndex][elSizes][sizeIndex][elThreshold] = productColourSizeStockThreshold;
  }

  function drawColour(productIndex)
  {
    if (products[productIndex][elColours].length == 1)
    {
      // ONLY One Colour so show it as a label with a hidden field to hold the value.
      document.write('<input type="hidden" name="colour" value="' + products[productIndex][elColours][0][elColourId] + '">');
      document.write("<p>");
      document.write(products[productIndex][elColours][0][elColour]);
      document.write("</p>");
    }
    else
    {
      // More than One Colour so show it as a drop down list.
      document.write('<select class="select" name="colourCombo" onchange="javascript:loadSizes(' + productIndex + ')">');
      for (c = 0; c < products[productIndex][elColours].length; c++)
      {
        document.write('<option value="' + products[productIndex][elColours][c][elColourId] + '">' + products[productIndex][elColours][c][elColour] + '</option>');
      }
      document.write('</select>');
    }
  }

  function drawSize(productIndex)
  {
    if (products[productIndex][elColours].length == 1)
    {
      // ONLY One Colour.
      if (products[productIndex][elColours][0][elSizes].length == 1)
      {
        // ONLY One Size so show it as a label with a hidden field to hold the value.
        document.write('<input type="hidden" name="size" value="' + products[productIndex][elColours][0][elSizes][0][elSizeId] + '">');
        document.write("<p>");
        document.write(products[productIndex][elColours][0][elSizes][0][elSize]);
        document.write("</p>");
      }
      else
      {
        // More than One Size so show it as a drop down list.
        document.write('<select class="select" name="sizeCombo' + products[productIndex][elColours][0][elColourId] + '" onchange="javascript:loadPrice(' + productIndex + ')">');
        for (s = 0; s < products[productIndex][elColours][0][elSizes].length; s++)
        {
          document.write('<option value="' + products[productIndex][elColours][0][elSizes][s][elSizeId] + '">' + products[productIndex][elColours][0][elSizes][s][elSize] + '</option>');
        }
        document.write('</select>');
      }
    }
    else
    {
      // More than One Colour.
      for (c = 0; c < products[productIndex][elColours].length; c++)
      {
        document.write('<div id="sizeDiv' + productIndex + 'xx' + products[productIndex][elColours][c][elColourId] + 'Cont" class="clearfix">');
        document.write('<div id="sizeDiv' + productIndex + 'xx' + products[productIndex][elColours][c][elColourId] + '">');
        if (products[productIndex][elColours][c][elSizes].length == 1)
        {
          document.write('<input type="hidden" name="size" value="' + products[productIndex][elColours][c][elSizes][0][elSizeId] + '">');
          document.write("<p>");
          document.write(products[productIndex][elColours][c][elSizes][0][elSize]);
          document.write("</p>");
        }
        else
        {
          document.write('<select class="select" name="sizeCombo' + products[productIndex][elColours][c][elColourId] + '" onchange="javascript:loadSizes(' + productIndex + ')">');
          for (s = 0; s < products[productIndex][elColours][c][elSizes].length; s++)
          {
            document.write('<option value="' + products[productIndex][elColours][c][elSizes][s][elSizeId] + '">' + products[productIndex][elColours][c][elSizes][s][elSize] + '</option>');
          }
          document.write('</select>');
        }
        document.write('</div>');
        document.write('</div>');
        hideDiv('sizeDiv' + productIndex + 'xx' + products[productIndex][elColours][c][elColourId]);
      }
    }
  }

  function drawPrice(productIndex)
  {
    if (products[productIndex][elColours].length == 1)
    {
      // ONLY One Colour.
      if (products[productIndex][elColours][0][elSizes].length == 1)
      {
        // ONLY One Size.
        document.write('<p><span class="price">');
        document.write(products[productIndex][elColours][0][elSizes][0][elPrice]);
        document.write('</span>&nbsp;&nbsp;&nbsp;<span class="rrpprice">RRP&nbsp;');
        document.write(products[productIndex][elColours][0][elSizes][0][elPriceRecommended]);
        document.write('</span></p>');
      }
      else
      {
        // More than One Size.
        for (s = 0; s < products[productIndex][elColours][0][elSizes].length; s++)
        {
          document.write('<div id="priceDiv' + productIndex + 'xx' + products[productIndex][elColours][0][elColourId] + 'xx' + products[productIndex][elColours][0][elSizes][s][elSizeId] + 'Cont" class="clearfix">');
          document.write('<div id="priceDiv' + productIndex + 'xx' + products[productIndex][elColours][0][elColourId] + 'xx' + products[productIndex][elColours][0][elSizes][s][elSizeId] + '">');
          document.write('<p><span class="price">');
          document.write(products[productIndex][elColours][0][elSizes][s][elPrice]);
          document.write('</span>&nbsp;&nbsp;&nbsp;<span class="rrpprice">RRP&nbsp;');
          document.write(products[productIndex][elColours][0][elSizes][s][elPriceRecommended]);
          document.write('</span></p>');
          document.write('</div>');
          document.write('</div>');
          hideDiv('priceDiv' + productIndex + 'xx' + products[productIndex][elColours][0][elColourId] + 'xx' + products[productIndex][elColours][0][elSizes][s][elSizeId]);
        }
      }
    }
    else
    {
      // More than One Colour.
      for (c = 0; c < products[productIndex][elColours].length; c++)
      {
        if (products[productIndex][elColours][c][elSizes].length == 1)
        {
          // ONLY One Size.
          document.write('<div id="priceDiv' + productIndex + 'xx' + products[productIndex][elColours][c][elColourId] + 'xx' + products[productIndex][elColours][c][elSizes][0][elSizeId] + 'Cont" class="clearfix">');
          document.write('<div id="priceDiv' + productIndex + 'xx' + products[productIndex][elColours][c][elColourId] + 'xx' + products[productIndex][elColours][c][elSizes][0][elSizeId] + '">');
          document.write('<p><span class="price">');
          document.write(products[productIndex][elColours][c][elSizes][0][elPrice]);
          document.write('</span>&nbsp;&nbsp;&nbsp;<span class="rrpprice">RRP&nbsp;');
          document.write(products[productIndex][elColours][c][elSizes][0][elPriceRecommended]);
          document.write('</span></p>');
          document.write('</div>');
          document.write('</div>');
          hideDiv('priceDiv' + productIndex + 'xx' + products[productIndex][elColours][c][elColourId] + 'xx' + products[productIndex][elColours][c][elSizes][0][elSizeId]);
        }
        else
        {
          // More than One Size.
          for (s = 0; s < products[productIndex][elColours][c][elSizes].length; s++)
          {
            document.write('<div id="priceDiv' + productIndex + 'xx' + products[productIndex][elColours][c][elColourId] + 'xx' + products[productIndex][elColours][c][elSizes][s][elSizeId] + 'Cont" class="clearfix">');
            document.write('<div id="priceDiv' + productIndex + 'xx' + products[productIndex][elColours][c][elColourId] + 'xx' + products[productIndex][elColours][c][elSizes][s][elSizeId] + '">');
            document.write('<p><span class="price">');
            document.write(products[productIndex][elColours][c][elSizes][s][elPrice]);
            document.write('</span>&nbsp;&nbsp;&nbsp;<span class="rrpprice">RRP&nbsp;');
            document.write(products[productIndex][elColours][c][elSizes][s][elPriceRecommended]);
            document.write('</span></p>');
            document.write('</div>');
            document.write('</div>');
            hideDiv('priceDiv' + productIndex + 'xx' + products[productIndex][elColours][c][elColourId] + 'xx' + products[productIndex][elColours][c][elSizes][s][elSizeId]);
          }
        }
      }
    }
  }

  function drawQty()
  {
    document.write('<select class="select" name="qty">');
    for (q = 1; q < 11; q++)
    {
      document.write('<option value="' + q + '">' + q + '</option>');
    }
    document.write('</select>');
  }

  function drawBasket(productIndex, buttonText, inStockText, outStockText)
  {
    onClick = 'javascript:setHiddenValues(' + productIndex + ');';
    if (products[productIndex][elColours].length == 1)
    {
      // ONLY One Colour.
      if (products[productIndex][elColours][0][elSizes].length == 1)
      {
        // ONLY One Size.
        if (products[productIndex][elColours][0][elSizes][0][elStock] <= products[productIndex][elColours][0][elSizes][0][elThreshold])
        {
          document.write('<div class="stockmessage"><p class="outstock">' + outStockText + '</p></div>');
        }
        else
        {
          document.write('<div class="stockmessage"><p class="instock">' + inStockText + '</p></div>');
        }
        document.write('<input type="submit" name="submit" value="');
        document.write(buttonText + '" ');
        if (products[productIndex][elColours][0][elSizes][0][elStock] <= products[productIndex][elColours][0][elSizes][0][elThreshold])
        {
          document.write('disabled="disabled"');
        }
        document.write('" onclick="' + onClick + '" class="button">');
      }
      else
      {
        // More than One Size.
        for (s = 0; s < products[productIndex][elColours][0][elSizes].length; s++)
        {
          document.write('<div id="basketDiv' + productIndex + 'xx' + products[productIndex][elColours][0][elColourId] + 'xx' + products[productIndex][elColours][0][elSizes][s][elSizeId] + 'Cont" class="clearfix">');
          document.write('<div id="basketDiv' + productIndex + 'xx' + products[productIndex][elColours][0][elColourId] + 'xx' + products[productIndex][elColours][0][elSizes][s][elSizeId] + '">');
          if (products[productIndex][elColours][0][elSizes][s][elStock] <= products[productIndex][elColours][0][elSizes][s][elThreshold])
          {
            document.write('<div class="stockmessage"><p class="outstock">' + outStockText + '</p></div>');
          }
          else
          {
            document.write('<div class="stockmessage"><p class="instock">' + inStockText + '</p></div>');
          }
          document.write('<input type="submit" name="submit" value="');
          document.write(buttonText + '" ');
          if (products[productIndex][elColours][0][elSizes][s][elStock] <= products[productIndex][elColours][0][elSizes][s][elThreshold])
          {
            document.write('disabled="disabled"');
          }
          document.write(' onclick="' + onClick + '" class="button">');
          document.write('</div>');
          document.write('</div>');
          hideDiv('basketDiv' + productIndex + 'xx' + products[productIndex][elColours][0][elColourId] + 'xx' + products[productIndex][elColours][0][elSizes][s][elSizeId]);
        }
      }
    }
    else
    {
      // More than One Colour.
      for (c = 0; c < products[productIndex][elColours].length; c++)
      {
        if (products[productIndex][elColours][c][elSizes].length == 1)
        {
          document.write('<div id="basketDiv' + productIndex + 'xx' + products[productIndex][elColours][c][elColourId] + 'xx' + products[productIndex][elColours][c][elSizes][0][elSizeId] + 'Cont" class="clearfix">');
          document.write('<div id="basketDiv' + productIndex + 'xx' + products[productIndex][elColours][c][elColourId] + 'xx' + products[productIndex][elColours][c][elSizes][0][elSizeId] + '">');
          if (products[productIndex][elColours][c][elSizes][0][elStock] <= products[productIndex][elColours][c][elSizes][0][elThreshold])
          {
            document.write('<div class="stockmessage"><p class="outstock">' + outStockText + '</p></div>');
          }
          else
          {
            document.write('<div class="stockmessage"><p class="instock">' + inStockText + '</p></div>');
          }
          document.write('<input type="submit" name="submit" value="');
          document.write(buttonText + '" ');
          if (products[productIndex][elColours][c][elSizes][0][elStock] <= products[productIndex][elColours][c][elSizes][0][elThreshold])
          {
            document.write('disabled="disabled"');
          }
          document.write(' onclick="' + onClick + '" class="button">');
          document.write('</div>');
          document.write('</div>');
          hideDiv('basketDiv' + productIndex + 'xx' + products[productIndex][elColours][c][elColourId] + 'xx' + products[productIndex][elColours][c][elSizes][0][elSizeId]);
        }
        else
        {
          for (s = 0; s < products[productIndex][elColours][c][elSizes].length; s++)
          {
          document.write('<div id="basketDiv' + productIndex + 'xx' + products[productIndex][elColours][c][elColourId] + 'xx' + products[productIndex][elColours][c][elSizes][s][elSizeId] + 'Cont" class="clearfix">');
          document.write('<div id="basketDiv' + productIndex + 'xx' + products[productIndex][elColours][c][elColourId] + 'xx' + products[productIndex][elColours][c][elSizes][s][elSizeId] + '">');
          if (products[productIndex][elColours][c][elSizes][s][elStock] <= products[productIndex][elColours][c][elSizes][s][elThreshold])
          {
            document.write('<div class="stockmessage"><p class="outstock">' + outStockText + '</p></div>');
          }
          else
          {
            document.write('<div class="stockmessage"><p class="instock">' + inStockText + '</p></div>');
          }
          document.write('<input type="submit" name="submit" value="');
          document.write(buttonText + '" ');
          if (products[productIndex][elColours][c][elSizes][s][elStock] <= products[productIndex][elColours][c][elSizes][s][elThreshold])
          {
            document.write('disabled="disabled"');
          }
          document.write(' onclick="' + onClick + '" class="button">');
          document.write('</div>');
          document.write('</div>');
          hideDiv('basketDiv' + productIndex + 'xx' + products[productIndex][elColours][c][elColourId] + 'xx' + products[productIndex][elColours][c][elSizes][s][elSizeId]);
          }
        }
      }
    }
  }

  function loadSizes(productIndex)
  {
    arrName = products[productIndex];
    //
    form = document.forms['form' + productIndex];

    colourIndex = 0;

    if (arrName[elColours].length > 1)
    {
      if (form)
      {
        if (form.colourCombo)
        {
          if (form.colourCombo.selectedIndex)
          {
            // Get the currently selected colour index.
            colourIndex = form.colourCombo.selectedIndex;
          }
        }
      }

      // Initialize a variable to store the currently selected sizeValue.
      sizeValue = '';

      for (c = 0; c < arrName[elColours].length; c++)
      {
        if (divShowing('sizeDiv' + productIndex + 'xx' + arrName[elColours][c][elColourId]))
        {
          // Currently showing so use c as the index of the old colour.
          if (form)
          {
            sizeCombo = eval('form.sizeCombo' + arrName[elColours][c][elColourId]);
            if (sizeCombo)
            {
              if (sizeCombo.selectedIndex)
              {
                // Get the currently size value.
                sizeValue = sizeCombo[sizeCombo.selectedIndex].value;
              }
              else
              {
                sizeValue = sizeCombo[0].value;
              }
            }
          }
        }
        hideDiv('sizeDiv' + productIndex + 'xx' + arrName[elColours][c][elColourId]);
      }
      showDiv('sizeDiv' + productIndex + 'xx' + arrName[elColours][colourIndex][elColourId]);

      if (sizeValue != '')
      {
        if (form)
        {
          sizeCombo = eval('form.sizeCombo' + arrName[elColours][colourIndex][elColourId]);
          if (sizeCombo)
          {
            // Restore the size value, setting it to the first, first in case it is not found.
            sizeCombo.selectedIndex = 0;

            // Loop thru the sizes for the currently selected color and if value = sizeValue set selectedIndex.
            for(s = 0; s < sizeCombo.options.length; s++)
            {
              if (sizeCombo.options[s].value == sizeValue)
              {
                sizeCombo.selectedIndex = s;
              }
            }
          }
        }
      }
    }

    imgName = document.images['img' + productIndex];

    colourFile = arrName[elColours][colourIndex][imgColourFile];

    if (colourFile == '')
    {
      imgName.src = filesContext + arrName[imgFile];
    }
    else
    {
      imgName.src = filesContext + arrName[elColours][colourIndex][imgColourFile];
    }

    // Load price.
    loadPrice(productIndex);
  }

  function loadPrice(productIndex)
  {
    arrName = products[productIndex];
    //
    form = document.forms['form' + productIndex];

    colourIndex = 0;

    if (arrName[elColours].length > 1)
    {
      if (form)
      {
        if (form.colourCombo)
        {
          if (form.colourCombo.selectedIndex)
          {
            // Get the currently selected colour index.
            colourIndex = form.colourCombo.selectedIndex;
          }
        }
      }
    }

    sizeIndex = 0;

    if (arrName[elColours][colourIndex][elSizes].length > 1)
    {
      if (form)
      {
        sizeCombo = eval('form.sizeCombo' + arrName[elColours][colourIndex][elColourId]);
        if (sizeCombo)
        {
          if (sizeCombo.selectedIndex)
          {
            // Get the currently selected size index.
            sizeIndex = sizeCombo.selectedIndex;
          }
        }
      }
    }

    if (arrName[elColours].length == 1 && arrName[elColours][0][elSizes].length == 1)
    {
      //
    }
    else
    {
      for (c = 0; c < arrName[elColours].length; c++)
      {
        for (s = 0; s < arrName[elColours][c][elSizes].length; s++)
        {
          hideDiv('priceDiv' + productIndex + 'xx' + arrName[elColours][c][elColourId] + 'xx' + arrName[elColours][c][elSizes][s][elSizeId]);
          hideDiv('basketDiv' + productIndex + 'xx' + arrName[elColours][c][elColourId] + 'xx' + arrName[elColours][c][elSizes][s][elSizeId]);
        }
      }
      showDiv('priceDiv' + productIndex + 'xx' + arrName[elColours][colourIndex][elColourId] + 'xx' + arrName[elColours][colourIndex][elSizes][sizeIndex][elSizeId]);
      showDiv('basketDiv' + productIndex + 'xx' + arrName[elColours][colourIndex][elColourId] + 'xx' + arrName[elColours][colourIndex][elSizes][sizeIndex][elSizeId]);
    }
  }

  function setHiddenValues(productIndex)
  {
    arrName = products[productIndex];
    //
    form = document.forms['form' + productIndex];

    colourIndex = 0;
    colourValue = '';

    if (arrName[elColours].length > 1)
    {
      if (form)
      {
        if (form.colourCombo)
        {
          if (form.colourCombo.selectedIndex)
          {
            colourIndex = form.colourCombo.selectedIndex;
          }
          else
          {
            colourIndex = 0;
          }
          colourValue = form.colourCombo[colourIndex].value;
        }
      }
    }
    else
    {
      // The first colour.
      colourValue = arrName[elColours][colourIndex][elColourId];
    }

    sizeIndex = 0;
    sizeValue = 0;

    if (arrName[elColours][colourIndex][elSizes].length > 1)
    {
      if (form)
      {
        sizeCombo = eval('form.sizeCombo' + arrName[elColours][colourIndex][elColourId]);
        if (sizeCombo)
        {
          if (sizeCombo.selectedIndex)
          {
            // Get the currently size value.
            sizeValue = sizeCombo[sizeCombo.selectedIndex].value;
          }
          else
          {
            sizeValue = sizeCombo[0].value;
          }
        }
      }
    }
    else
    {
      sizeValue = arrName[elColours][colourIndex][elSizes][sizeIndex][elSizeId];
    }
    form.colourId.value = colourValue;
    form.productSizeId.value = sizeValue;
  }