$(function() {
  function toggleHomepageCopy(el, trackEvent) {
    if (trackEvent == undefined) {
      trackEvent = false;
    }
    if ($(el).hasClass('less')) {
      if(trackEvent) {
        _gaq.push(['_trackEvent', 'Homepage Copy', 'Read Less']);
      }
      $(el).text('Read more');
      $(el).addClass('more').removeClass('less');
      $(el).closest('.content').find('.main').slideUp();
    } else {
      if(trackEvent) {
        _gaq.push(['_trackEvent', 'Homepage Copy', 'Read More']);
      }
      $(el).text('Read less');
      $(el).addClass('less').removeClass('mor');
      $(el).closest('.content').find('.main').slideDown();
    }
  }

  $('#homepage div.content div.toggle').click(function(e) {
    e.preventDefault();
    toggleHomepageCopy(this, true);
  });
  toggleHomepageCopy($('#homepage div.content div.toggle'), false);

  $('#homepage-products div.section').each(function() {
    var _this = $(this);
    
    $.getJSON(_this.data('category-url'), {'product': _this.data('product-url')},  function(data) {
      if ($.isArray(data.products)) {
        // An array means no products, it'd be an object otherwise.
        return false;
      }

      var container = $('<div class="product-detail"></div>');
      var models = $('<div class="models"><div class="title">Select a model</div></div>');
      var details = $('<div class="details"></div>');
      var productList = $('<ul></ul>');

      $.each(data.products, function(id, obj) {
        var productListItem = $('<li></li>').append($('<a></a>').attr('id', id).attr('href', obj.url).text(obj.title));
        productList.append(productListItem);

        var productDetail = $('<div class="product"></div>').attr('id', id+'-details');
        productDetail.append($('<h3></h3>').text(obj.title));
        var image = $('<img />').attr('src', obj.image+'/max_width/250/').attr('alt', obj.title);
        productDetail.append($('<div class="detail"></div>').append(obj.content).append($('<div class="image"></div>').append(image)));
        details.append(productDetail);
      });
      
      container.append(models.append(productList)).append(details);
      _this.append(container);
      bindToCategory(_this);
    });
  });

  function bindToCategory(section) {
    /* Bind to the associated product popup */
    var product_detail = section.find('.product-detail').first();
    if (!product_detail.length) {
      return;
    }
    var product_detail_width = product_detail.width()

    /* Bind to allow swapping the product being shown */
    var product_options = product_detail.find('.details .product');
    product_detail.find('.models a').each(function() {
      $(this).click(function(e) {
        _gaq.push(['_trackEvent', 'Homepage – Find Your Perfect Barbecue', $(this).closest('div.section').data('category'), $.trim($(this).text())]);
        e.preventDefault();
        product_options.hide();
        product_options.filter('#' + $(this).attr('id') + '-details').show();
      });
    });

    /* Show the associated product popup on hover*/
    section.hover(function() {
      $('#homepage-products div.product-detail').hide();
      var left = -(product_detail_width / 2  - $(this).width() / 2);
      var homepage_products = $('#homepage-products');
      product_detail.css({
        left: left,
        top: -409
      });
      product_detail.show();
      if (product_detail.offset().left < homepage_products.offset().left) {
        var diff = homepage_products.offset().left - product_detail.offset().left
        product_detail.css('left', left + diff);
      } else if (product_detail.offset().left + product_detail.width() + 18 > homepage_products.offset().left + homepage_products.width()) {
        var diff = homepage_products.offset().left + homepage_products.width() - (product_detail.offset().left + product_detail.width());
        product_detail.css('left', left + diff - 18);
      }
    }, function() {
      /* Reset the product being shown otherwise the popup looks wrong when it is next shown */
      product_options.hide();
      product_options.first().show();
      product_detail.hide();
    });
  }

  /*$("#homepage form[name='mailinglist']").submit(function(e) {
   /* e.preventDefault();

    var data = $(this).serialize();
    $.post($(this).attr("action"), data, function(response) {
      console.log(response);
    }, "json");
  });*/
});