
$jq(function() {

  // Simple accordion for product details  
  
  SimpleAccordion = function(containerId) {
  
    var index = -1;
    var current = 0;
    var effectDuration = 1000;
    
    var container = $jq(containerId);
       
    $jq('.toggler', container).each(function() {      
      index++;      
      $jq(this)
        .attr('acindex', index)
        .attr('acocol', $jq(this).css('backgroundColor'))
        
        .click(function(event) {
          event.preventDefault();
          newIndex = $jq(this).attr('acindex');
          if(newIndex == current) return;
          
          $jq('.accordion:eq('+current+')', container).animate({ height: 'hide', opacity: 'hide'}, effectDuration);
          $jq('.accordion:eq('+newIndex+')', container).animate({ height: 'show', opacity: 'show'}, effectDuration);
          
          $jq('.toggler:eq('+current+')', container)            
            .animate({ 'backgroundColor': $jq('.toggler:eq('+current+')', container).attr('acocol')})
            .find('a')
              .css({fontWeight:'normal', 'color': '#222'});
            
          $jq('.toggler:eq('+newIndex+')', container)            
            .animate({ 'backgroundColor': '#ffffff'})
            .find('a')
              .css({fontWeight:'bold', 'color':'#d8040c'});
          
          current = newIndex;
        })
        
    });
    
    $jq('.toggler:eq(0)', container).css({backgroundColor: '#ffffff', fontWeight:'bold'});
    $jq('.toggler:gt(0) a', container).css({fontWeight:'normal', 'color': '#222'});
    $jq('div.accordion:gt(0)', container).hide();
    $jq('div.accordion .accordionTitle', container).hide();
    
  };
  
  
  
  
  DynamicProductList = function() {
  
    var effectsSpeed = 750;
    var htmlLoaded = false;
    var fadeComplete = false;
    var loadHtml = '';
    
    $jq('.product-manual-search').hide();
    
    
    $jq('.productfilter-brand').click(function() {    
      updateProducts();
    });
    
    $jq('.productfilter-category').click(function() {
      updateProducts();
    });
    
    $jq('.productfilter :checkbox').click(function() {    
      updateProducts();
    });
  
    function updateProducts() {
    
      htmlLoaded = false;
      fadeComplete = false;
      
      $jq('.dynamicproductlist').fadeOut(effectsSpeed, onFadeComplete);
    
      var colFilters = new Array();
      
      $jq('.productfilter :checkbox').each(function() {
        if($jq(this)[0].checked)
          colFilters[colFilters.length] = $jq(this).parent().attr('ovalue');
      });
     
     
      $jq.ajax({
        async: true,
        type: "POST",
        data: {
          brandId: $jq('.productfilter-brand').val(),
          categoryId: $jq('.productfilter-category').val(),
          colFilters: colFilters          
          },
        url: 'service.aspx',
        success: onLoadComplete
       });
    }
    
    function onFadeComplete() {
      fadeComplete = true;
      $jq(this).remove('ul');
      if(htmlLoaded) show();
    }
    
    function onLoadComplete(html, status) {
      loadHtml = html;
      htmlLoaded = true;
      if(fadeComplete) show();
    }
    
    function show() { 
      $jq('.dynamicproductlist')
        .empty()
        .append(loadHtml)
        .fadeIn(effectsSpeed);
        
      init();  
    }
  };
  
  
  new SimpleAccordion('.product-accordion');
  
  new DynamicProductList();
  
  
});


