/**
 *
 */
function addProductOption(id, background_colour, font_color, name, description)
{
  var hidden_fields = $$("input.hidden_product_options");
  var set_field = false; 

  hidden_fields.each(function(field, iteration)
                     {
                       if(set_field == false && field.readAttribute("value") == "")
                       {
                         var field_number = iteration + 1;
                         var slot = "slot_" + field_number;
                         var paper = "paper_" + field_number;
                         var optionname = "option-name_" + field_number;
                         var optiondescription = "option-description_" + field_number;
                           
                         field.writeAttribute("value", id);
                         $(slot).addClassName('selected');
                         $(paper).writeAttribute("style", "background-color: #" + background_colour + ";" + " color: #" + font_color + ";");
                         //$(paper).insert(text);                         
                         $(optionname).update(name);
                         $(optiondescription).update(description);
                           
                         set_field = true;
                       }
                     }
    );

  var selected_count = recalculateSelectedCount();
  $('selected_count').update(selected_count);

  if (selected_count == hidden_fields.size())
  {
    $('btn_to_cart').removeClassName('disabled');
    $('btn_to_cart').update('Add to Cart');
    $('btn_to_cart').disabled = false;

    $('btn_to_wishlist').removeClassName('disabled');
    $('btn_to_wishlist').update('Add to Wishlist');
    $('btn_to_wishlist').disabled = false;
  }

  if (set_field == false)
  {
    return alert("All " + hidden_fields.size() + " options have now been selected.");
  }
}

/**
 *
 */
function clearSelectedOption(id)
{
  // Remove hidden input value and re-count available slots;  
    $("paper_" + id).writeAttribute("style", "");
    $("hidden_product_option_" + id).writeAttribute("value", "");
    $('selected_count').update(recalculateSelectedCount());
  
  // Create generic 'Add More' slot
    $("slot_" + id).removeClassName('selected');
    $("option-name_" + id).update("<span class='grey'>Add More</span>");
    $("option-description_" + id).update(" ");
}

/**
 *
 */
function recalculateSelectedCount()
{
  var hidden_fields = $$("input.hidden_product_options");
  var selected_count = 0;

  hidden_fields.each(function(field) 
                     {
                       if (field.readAttribute("value") != "")
                       {
                         selected_count = selected_count + 1;
                       }
                     })

    
    if (selected_count < hidden_fields.size())
    {
      $('btn_to_cart').addClassName('disabled');
      $('btn_to_cart').update('Add more items to proceed');
      $('btn_to_cart').disabled = true;

      $('btn_to_wishlist').addClassName('disabled');
      $('btn_to_wishlist').update('Add more items to proceed');
      $('btn_to_wishlist').disabled = true;
    }
  return selected_count;
}

/**
 *
 */
function convertSizeTo(newSize, parentId)
{
  $('paper_'+parentId).className= 'paper-sample '+newSize;
}

/**
 * Set Overlay active and set parameters
 */
function setOverlay(id, background_colour, font_color, name, description, reversed)
{  
   // set thumbnail color        
   $('option-swatch-overlay').writeAttribute("style", "background-color: #" + background_colour + ";" + " color: #" + font_color + ";");
   
   // set swatch name + description
   $('option-name-overlay').update(name);   
   $('option-description-overlay').update(description);
   
   // get swatch position   
   positionArray = $('product-option-swatch-'+id).positionedOffset();
   
   // set position offset and setStyle         
   // Check if it needs to be reversed, then add a special class and re-position the overlay
   if(reversed == "true"){
     $('product-option-overlay').addClassName('reversed');
     var leftPosition = positionArray[0]-182;
     var topPosition = positionArray[1]-18;
   }else{
     var leftPosition = positionArray[0]+120;
     var topPosition = positionArray[1]-18;
   }   
   
   $('product-option-overlay').setStyle({left: leftPosition+'px',top: topPosition+'px'});

   // toggle class to show/hide
   $('product-option-overlay').show();
   
}

/**
 * Reset Overlay to hidden
 */
function resetOverlay()
{  
   // toggle class to show/hide     
   $('product-option-overlay').hide();      
   if($('product-option-overlay').hasClassName('reversed')){
     $('product-option-overlay').removeClassName('reversed');
   }
}


/**
 * Product Color Swatches
 */
function loadSwatches(){
  if ($('p_product-attributes') != null) {
    if ($('p_product-attributes').hasClassName('colour')) {
      // on pageLoad
      var currentlySelectedColor = 'Select Color';
      var currentlySelectedImage = $('image-thumb-object').src;
      $$('#color_swatches span').each(function(swatch){
        var swatchID = parseFloat($(swatch).innerHTML);
        swatch.onclick = function(){
          $('colorSwatch_' + swatchID).selected = true;
          
          $$('#color_swatches span.selected').each(function(elem){
            $(elem).removeClassName('selected')
          });
          
          swatch.addClassName('selected');          

           if (variationImages[swatchID].length > 1) {
             // Display the big image for the selected colour in LuckyZoom.
            zoom.bigImage.src = $('image-thumb-object').src;
            zoom.initBigContainer();
            currentlySelectedImage = $('image-thumb-object').src;
          }

          currentlySelectedColor = swatch.readAttribute('title');
          
        }
        
        swatch.onmouseover = function(){
          $('color_swatch_title').innerHTML = swatch.readAttribute('title');
          if (variationImages[swatchID].length > 1){
            $('image-thumb-object').src = variationImages[swatchID];
          }
        }
        
        swatch.onmouseout = function(){
          $('color_swatch_title').innerHTML = currentlySelectedColor;
          if (variationImages[swatchID].length > 1) {
            $('image-thumb-object').src = currentlySelectedImage;
          }
        }
        
        
      });
      
    };
      }
}

Event.observe(window, 'load', function() { loadSwatches() });