/**********************************************************************
 SetSrc - 3dCart override

 This overrides a function in 3dCart's listing.js file, that is called 
 ONLY for dropimage controls. This function breaks because the 
 dropdown control 3dCart expects is missing in our implementation.
**********************************************************************/
function SetSrc (formx,sname,sourcename) {
} //END: SetSrc

/**********************************************************************
 initDropimage - Initiailises our modified dropimage control

 We have mangled 3dCart's custom dropimage widget to meet our needs:
   1) To display thumbnails, not a dropdown
   2) To change the main image, not insert a secondary image

 To do this, we need to initialise the dropimage controls when the 
 page loads:
   * Find each div with class dropimageThumbnail
   * Retrieve the div's id, which is the option id
   * Find the hidden field with the name "image_" + id
   * Get the field's value, which is the path to the image for that 
     option
   * Set the image within the div with the thumbnail
   * Call selectDropimage with the default selected dropimage.

 ToDo: Automatically select first image if none explicitly set.
**********************************************************************/
function initDropimage () {
  var DROPIMAGE_THUMBNAIL_SRC_PRE = "thumbnail.asp?file="
  var DROPIMAGE_THUMBNAIL_SRC_POST = "&maxx=65&maxy=0"
  
  var dropimageElements = new Array();

  for (dropimageControls=$jq("div.dropimageControl"), controlCounter=0; 
      controlCounter < dropimageControls.length; 
      controlCounter++) {
    try {
      currentControl = dropimageControls[controlCounter];
      }
    catch (err) {
      if (debugMessages == true) {
        alert("initDropimage [1]: " + err.message);
        }
      continue;
      }

    for (dropimageOptions=$jq("div#" + escapeJQuerySelector(currentControl.id) + "> .dropimageOption"), optionCounter=0;
        optionCounter < dropimageOptions.length; 
        optionCounter++) {
      try {
        currentOption = dropimageOptions[optionCounter];
        optionImage = $jq("input[name='image_" + currentOption.id + "']").attr("value");
        optionImage = DROPIMAGE_THUMBNAIL_SRC_PRE + optionImage + DROPIMAGE_THUMBNAIL_SRC_POST;
        thumbnailImage = document.getElementById("dropimageThumbnail_" + currentOption.id);
        thumbnailImage.src = optionImage;
        if (thumbnailImage.className.indexOf("Selected") >= 0) {
          selectDropimage("", currentControl.id, currentOption.id, false);
          }
        }
      catch (err) {
        if (debugMessages == true) {
          alert("initDropimage [2]: " + err.message);
          }
        continue;
        }
      } //END: controlCounter
    } //END: optionCounter
  
  //Finally, call 3dCart's validateValues to update the page
  validateValues(document.add, 0);
  } //END: initDropimage
    
    
/**********************************************************************
 selectDropimage - Select an option from our customised dropimage control

 selectDropImage has to so several things:
   * Change the large dispay image - including working nicely with 
     3dCart's thumbnail.asp utility.

   * Toggle the "dropimageOptionSelected" class

   * Update a hidden dropdown control so 3dCart works properly

   * Call validateValues so 3dCart can update availability, etc.

 Arguments:
   optionsForm - The form we are working with; simply passed to 
                 validateValues

   dropimageControlId - The ID of the parent div containing our
                        options. This is the 3dCart [oname] value.
                        This is needed so we can get all the
                        options and toggle them on/off, and set our
                        hidden dropdown control. If it isn't
                        known (as in the HTML) pass "" and we'll look
                        it up from our option."

   dropimageOptionId - The ID of the div contianing this option.
                       This is the 3dCart [value] value. 

   destinationImage - The ID of the image whose value we want to 
                      set when this option is selected.

   validate - True to call validateValues, False to  skip this step.

 Notes:
   * We can only change the main image.at this time 
**********************************************************************/
function selectDropimage (optionsForm, dropimageControlId, 
                          dropimageOptionId, validate) {
  var PRODUCT_IMAGE_ID = "large";
    
  try {
    // Update our main image
    targetImage = document.getElementById(PRODUCT_IMAGE_ID);
    optionImage = $jq("input[name='image_" + dropimageOptionId + "']").attr("value");
    
    // NOTE: We have had to hardcode &maxx into the RegExp. Otherwise no amount
    // of escaping or expressions prevents it from skipping over maxx= and only 
    // including maxy= in the replacement
    thumbnailPattern = new RegExp("(thumbnail\.asp\\?file=).*(&maxx.*)");
    if (thumbnailPattern.test(targetImage.src) == true) {
      targetImage.src = targetImage.src.replace(thumbnailPattern, "$1" + optionImage + "$2");
      }
    else {
      targetImage.src = optionImage;
      }
    // Set this so "zoomify" works
    selectedimage = optionImage; 
    
    // Toggle our image display    
    if (dropimageControlId == "") {
      dropimageControlId = $jq("div#" + escapeJQuerySelector(dropimageOptionId)).
      parents("div.dropimageControl").attr("id");
      }
    // Remove the Selected class from all thumbnails in this option group
    thumbnails=$jq("div#" + escapeJQuerySelector(dropimageControlId) + 
               " img.dropimageThumbnailSelected");
    thumbnails.addClass("dropimageThumbnail");
    thumbnails.removeClass("dropimageThumbnailSelected");
    
    // Add it to just the selected one
    document.getElementById("dropimageThumbnail_" + 
        dropimageOptionId).className = "dropimageThumbnailSelected";

    // Update our hidden dropdown control so it is valid for 3dCart's 
    // validateValues call
    dropimageSelectOption = document.getElementById("dropimageSelectOption_" + dropimageControlId);
    dropimageSelectOption.value = dropimageOptionId;
    dropimageSelectOption.selected = true;
    dropimageSelectOption.innerHTML= dropimageOptionId;

    if (validate == true) {
      validateValues(optionsForm, 1);
      }
    }
  catch (err) {
    if (debugMessages == true) {
      alert("selectDropimage: " + err.message);
      }
    }
  } //END: selectDropimage
    
    
/**********************************************************************
hoverDropimage - Highlight a thumbnail on hover, 

Highlights or restores a dropimage thumbnail when the 
mouse hovers over it. If the thumbnail is selected, it 
does nothing.

Arguments:
imageControl - Control to manipulate, passed as "this"
from javascript

state - Hover to highlight, normal to restore.
**********************************************************************/
function hoverDropimage (imageControl, state) {
  try {
    if (imageControl.className.toLowerCase().indexOf("selected") > 0) {
      return;
    }
  
    if (state == "hover") {
      imageControl.className = "dropimageThumbnailHover";
      }
    else {
      imageControl.className = "dropimageThumbnail";
      }
    }
  catch (err) {
    if (debugMessages == true) {
      alert("dropimageHover: " + err.message);
      }
    }
  }  //END: dropimageHover

  
/**********************************************************************
 selectRadio - Select an option from our customised radio controls

 selectRadio has to so several things:
   * Toggle the appropriate "Checked" class

   * Update a hidden radio control so 3dCart works properly

   * Call validateValues so 3dCart can update availability, etc.

 Arguments:
   optionsForm - The form we are working with; simply passed to 
                 validateValues

   radioControl - A reference to the control that has been 
                 selecteddropimageControlId 

   optionName - The 3dCart [oname] of this option.

   optionValue - The 3dCart [value] of this option.
**********************************************************************/
function selectRadio (optionsForm, radioControl, optionName, optionValue) {
  try {
    // Clear all our selected Controls
    $jq("input[class='productRadioOptionChecked'][name='" + optionName + "']").attr("class", "productRadioOption");
    $jq("input[class='productRadioOptionchecked'][name='" + optionName + "']").attr("class", "productRadioOption");

    // Set this control
    radioControl.className = "productRadioOptionChecked"

    // Set our hidden control to match
    document.getElementById(optionName + ":::" + optionValue).checked=true;

    validateValues(optionsForm, 1);
    }
  catch (err) {
    if (debugMessages == true) {
      alert("selectRadio: " + err.message);
    }
  }
} //END: selectRadioOrCheckbox


/**********************************************************************
 hoverRadio - Highlight a thumbnail on hover, 

 Highlights or restores a dropimage thumbnail when the 
 mouse hovers over it. If the thumbnail is selected, it 
 does nothing.

 Arguments:
   radioControl - Control to manipulate, passed as "this"
                  from javascript

   state - Hover to highlight, normal to restore.
**********************************************************************/
function hoverRadio (radioControl, state) {
  try {
    if (radioControl.className.toLowerCase().indexOf("checked") > 0) {
      return;
    }
  
    if (state == "hover") {
      radioControl.className = "productRadioOptionHover";
      }
    else {
      radioControl.className = "productRadioOption";
      }
    }
  catch (err) {
    if (debugMessages == true) {
      alert("dropimageHover: " + err.message);
      }
    }
  }  //END: dropimageHover


/**********************************************************************
 getSizeChartForBrand - Return the file name of the size chart
 The rules are:
   * If there is a filename in extra_field_1 we will use it
   * If extra_field_1 contains "None" we will return ""
   * If there is nothing in extra_field_1 we will lookup our brand in
     the array brandSizeCharts defined in cheslers.conf.js
   * If the entry is not found or is "None" we will return "" 

 Arguments:
   * Brand name as stored in 3D Cart ([manufacturer_name])

 Returns:
   * File name of chart to display (without path)
   * "" if there is no chart
**********************************************************************/
function getSizeChartForBrand(brandName) {
  // Is our size chart being defined at the product level?
  var sizeChartFile = trim(sizeChart);

  try {
    if (sizeChartFile == "") {
        sizeChartFile = brandData.sizeChart(brandName);
      }
  
    if (sizeChartFile.toLowerCase() == "none") {
      return ""
      }
    else {
      return sizeChartFile;
      }
    }
  catch (err) {
    if (debugMessages == true) {
      alert("getSizeChartForBrand: " + err.message);
      }
    }
  } //END: getSizeChartForBrand


/**********************************************************************
 getFittingNotesStatus - Determine what to do about fitting notes
 The rules are:
   * If there are custom fitting notes in extra_field_6, display them
   * If extra_field_6 is set to None, hide the fitting notes tab
   * If th brand is defined in hideFitting Notes, hide the fitting 
     notes tab UNLESS custom notes are defined in extra_field_6
   * Otherwise, display the default fitting notes

 Arguments:
   * Brand name as stored in 3D Cart ([manufacturer_name])

 Returns:
   * Action: 
      * hide
      * default
      * custom (should display without any action needed)

 NOTE: The HTML code must all be on one line, without spaces, for 
       the test to work: 
          <div id="customFittingNotes">[extra_field_6]</div>
**********************************************************************/
function getFittingNotesStatus(brandName) {

  var customFittingNotes;

  try {
    customFittingNotes = trim($jq("#customFittingNotes").text())
    if (customFittingNotes.length > 0) {
      if (customFittingNotes.toLowerCase() == "none") {
        return "hide"
        }
      else {
        return "custom"
        }
      }
    else {
      if (brandData.hideFittingNotes(brandName) == true) {
        return "hide";
        }
      else {
        return "default";
        }
      }
    }
  catch (err) {
    if (debugMessages == true) {
      alert("getFittingNotesStatus: " + err.message);
      }
    }
  } //END: getFittingNotesStatus


/**********************************************************************
 initProductTabs - Set up our tabs. 

 Not all tabs arer handled the same way as we need to make sure that 
 certain ones are available when scripting is turned off (for search
 engines) and others (size chart) don't make sense to display as there 
 is no content without scripting.

 Called by initProductPage

**********************************************************************/
function initProductTabs() {

  try {
    /* 
      Set the URL to our size chart and show it. The size chart is hidden
      by default because scripting is required to display the image anyway.
    */
    sizeChartFile = getSizeChartForBrand(productBrand);
    if (sizeChartFile == "") {
      // IE requires we remove these elments, not just hide them... 
      $jq("li#sizeChartTab").remove();
      $jq("#sizeChartPane").remove();
      }
    else {
      $jq("#sizeChartTab").css("display", "block");
      $jq("#sizeChartPane").css("display", "block");
      $jq("img#sizeChart").css("display", "block");
      $jq("img#sizeChart").attr("src", "assets/images/size_charts/" + sizeChartFile);
      }

/*
    if (sizeChartFile != "") {
      $jq("#sizeChartTab").css("display", "block");
      $jq("#sizeChartPane").css("display", "block");
      $jq("img#sizeChart").css("display", "block");
      $jq("img#sizeChart").attr("src", "assets/images/size_charts/" + sizeChartFile);
      }
*/  
    /* Set up our fitting notes */
    fittingNotesStatus = getFittingNotesStatus(productBrand);
    if (fittingNotesStatus == "default") {
      $jq("#defaultFittingNotes").css("display", "block");
      }
    else {
      if (fittingNotesStatus == "hide") {
        $jq("#fittingNotesTab").remove()
        $jq("#fittingNotesPane").remove();
        }
      }
  
    /* Hide the Details tab when they're aren't details */
    if (($jq("#detailsPaneField").text()).length == 0) {
      $jq("li#detailsTab").remove();
      $jq("li#detailsPane").remove();
      }
  
    /* Hide the Reviews tab when they're aren't any reviews */
    if ($jq("#reviewsPane").length == 0) {
      $jq("li#reviewsTab").remove();
      $jq("li#reviewsPane").remove();
      }
  
    $jq("ul#productTabs").tabs("#productTabPanes > div.productTabPane");
    }
    catch (err) {
    if (debugMessages == true) {
      alert("initProductTabs: " + err.message);
      }
    }
  } //END: initProductTabs


/**********************************************************************
 initProductPage - Initialises a Cheslers product page

 Called by pageInit when isProductPage is true

**********************************************************************/
function initProductPage() {
  initDropimage();
  initProductTabs();
} //END: initProductPage