var ProductBuilder =
{
  widthSwatchFamily: 200,
  maxSwatchFamily: -600,
  morphSwatchSpeed: 0.8,
  morphingSwatch: false,


  requestUpdate: function(fnc)
  {
    parameters = $('product_form').serialize();
    new Ajax.Request('processor.php?action=update_builder', {
      parameters: parameters,
      evalJS: true,
      onComplete: fnc
    })

  },

  updateArmStyle: function(a, option)
  {
    $('product_arm_style').setValue(option);
    ProductBuilder.requestUpdate(ProductBuilder.completeArmStyle(a));
  },

  completeArmStyle: function(a)
  {
    $$('#arm_styles a').each(function(el){
      el.removeClassName('selected');
    });
    a = Element.extend(a);
    a.addClassName('selected');
  },


  updateCushionStyle: function(a, option)
  {
    $('product_cushion_style').setValue(option);
    ProductBuilder.requestUpdate(ProductBuilder.completeCushionStyle(a));
  },

  completeCushionStyle: function(a)
  {
    $$('#cushion_styles a').each(function(el){
      el.removeClassName('selected');
    });
    a = Element.extend(a);
    a.addClassName('selected');
  },

  updateFootStyle: function(a, option)
  {
    $('product_foot_style').setValue(option);
    ProductBuilder.requestUpdate(ProductBuilder.completeFootStyle(a));
  },

  completeFootStyle: function(a)
  {
    $$('#foot_styles a').each(function(el){
      el.removeClassName('selected');
    });
    a = Element.extend(a);
    a.addClassName('selected');
  },

  updateFabric: function(a, fabric_id, family)
  {
    picker = $('pillow_picker');
    if (picker != null)
    {
      if (family == 'Apache')
      {
        $('pillow_picker').show();
        ProductBuilder.setDefaultPillow();
      } else {
        $('pillow_picker').hide();
        $('product_pillow_fabric_id').setValue('');
      }
      
    }
    $('product_base_fabric_id').setValue(fabric_id);
    ProductBuilder.requestUpdate(ProductBuilder.completeFabric(a));
  },

  completeFabric: function(a)
  {
    $$('#swatch_families a').each(function(el){
      el.removeClassName('selected');
    });
    a = Element.extend(a);
    a.addClassName('selected');
  },


  setDefaultPillow: function()
  {
    picker = $('pillow_swatches');
    if (picker == null) return;


    swatch = $$('#pillow_swatches .selected').first();
    if (! swatch)
    {
      swatch = $$('#pillow_swatches a').first();
    }
    ProductBuilder.updatePillow(swatch);
  },


  updatePillow: function(a)
  {
    fabric_id = a.getAttribute('fabric_id');
    $('product_pillow_fabric_id').setValue(fabric_id);
    ProductBuilder.requestUpdate(ProductBuilder.completeUpdatePillow(a));
  },

  completeUpdatePillow: function(a)
  {
    a = Element.extend(a);
    fabric_id = a.getAttribute('fabric_id');
    $$('#pillow_picker a').each(function(el){
      el.removeClassName('selected');
    });
    a.addClassName('selected');

    $$('#pillow_display .image').each(function(el){
      el.removeClassName('selected');
    });
    $$('#pillow_display .fabric_' + fabric_id).first().addClassName('selected');

  },


  nextSwatch: function()
  {
    if (ProductBuilder.morphingSwatch) return;
    ProductBuilder.morphingSwatch = true;
    left = parseInt($('swatch_families').getStyle('left'));
    left -= ProductBuilder.widthSwatchFamily;
    if (left < ProductBuilder.maxSwatchFamily) left = 0;
    new Effect.Morph('swatch_families', {
      style: 'left: ' + left + 'px',
      duration: ProductBuilder.morphSwatchSpeed,
      afterFinish: function() {ProductBuilder.morphingSwatch = false; }
    });

  },

  prevSwatch: function()
  {
    if (ProductBuilder.morphingSwatch) return;
    ProductBuilder.morphingSwatch = true;
    left = parseInt($('swatch_families').getStyle('left'));
    left += ProductBuilder.widthSwatchFamily;
    if (left > 0) left = ProductBuilder.maxSwatchFamily;
    new Effect.Morph('swatch_families', {
      style: 'left: ' + left + 'px',
      duration: ProductBuilder.morphSwatchSpeed,
      afterFinish: function() {ProductBuilder.morphingSwatch = false; }
    });

  }




}