/*
  Women's Car Buying & Service Guide
  JavaScript for Welcome Page (http://www.carclique.net)
*/

var welcome = new CC_Welcome();
$(document).ready(welcome.init);

function CC_Welcome() {
  var expandos = {};
  
  this.init = init;
  function init() {
    // build the expandos array by cycling through each H2 element and its corresponding .container element
    $('#page-content h2').each(function(index) {
      var head = $(this);
      var cont = head.next('.container');
      var expando = {'header': head, 'container': cont};
      expandos[head.attr('id')] = expando;
      head
        .addClass('clickable')
        .click(function() {
            expand($(this).attr('id'));
			
			$("*[id^=pre]").show(); //Make sure all ids starting with 'pre' are showing
            $('#pre-'+ $(this).attr('id') ).fadeOut('500'); //Hide the 'pre' associated with the current expand
            
            return false;
          })
        .hover(
          function () {
            $(this).addClass('hover');
          }, function() {
            $(this).removeClass('hover');
          }
        )
      ;
    });
    expand($('#page-content h2').eq(2).attr('id'), 0); //Start with everything collapsed, so give it the form header

    
    
    // hook up the form submit event
    $('#get-started').submit(function() {
      submitForm(this);
      return false;
    });
  }
  
  function collapseAll(callback, duration) {
    if (typeof duration == 'undefined') duration = 300;
    $.each(expandos, function(index, expando) {
      expando.container.slideUp(duration);
      expando.header.removeClass('selected');
    });
    setTimeout(callback, duration + 200);
  }

  function expand(id, collapseDuration) {
    collapseAll(function() {
      expandos[id].container.slideDown(500);
      expandos[id].header.addClass('selected');
    }, collapseDuration);
    
   	
  }

  function isEmail(string) {
    if (string.search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1)
      return true;
    else
      return false;
  }

  function submitForm(form) {
    form = $(form);
    var formData = {};
    var success = true;
    // loop through the form elements and do basic data checking
    for (var i=0; i<form[0].elements.length; i++) {
      var el = $(form[0].elements[i]);
      if (el.hasClass('required') && el.val() == '') {
        alert('Please complete all required (*) fields.');
        success = false;
        el.focus();
        break;
      }
      if (el.hasClass('email') && isEmail(el.val()) == false) {
        alert('Please provide a valid e-mail address where you can be reached.');
        success = false;
        el.focus();
        break;
      }
      // ...and add the name/value pair to the data variable
      formData[el.attr('name') || el.attr('id')] = el.val();
    }
    if (success) {
      $.post(form.attr('action'), formData, function() {
        form.fadeOut(500, function() {
          var msg = $('<p></p>').insertBefore(form);
          msg
            .append('<strong>Thank you</strong> for your interest in the Women\'s Car Buying & Service Guide&trade;. We will be in touch with you soon!')
            .fadeIn(500)
          ;
        });
      });
    }
  }
}