/****************************************
 * JavaScript for Credit Cards Results
 ****************************************/

// Set up features form checkboxes
function setupFeaturesForm() {
	var form = $('featuresForm');
	var balanceTransfers = $('featuresForm-balanceTransfers');
	var noAnnualFee = $('featuresForm-noAnnualFee');
	var button = $('featuresForm-update');
	if (form) {
		// remove button
		button.remove();
		
		// Set checkboxes to submit form when changed
		noAnnualFee.addEvent('click', checkboxChanged);
		balanceTransfers.addEvent('click', checkboxChanged);
	}
	function checkboxChanged() {
		form.submit();
	}
}

// Set up smooth toggling of elements with class="toggle" when the 
// associated link is clicked. To toggle, <div id="foo" class="toggle">,
// click the <a href="#" id="toggle-foo">. To make the element hidden
// by default, add the class "hidden" (class="toggle hidden")
function setupToggles() {
	// Loop through all elements with class="toggle"
	var elements = $$('.toggle');
	elements.each(function(el) {
		// Get associated link (id="toggle-[el.id]")
		var link = $('toggle-' + el.id);
		if($defined(link)) {
			// Set up the toggle slide effect
			var effect = new Fx.Slide(el, { transition: Fx.Transitions.Quint.easeOut, onComplete: function(el) { toggleLinkClass(el); } });
			
			// Hide the element if necessary
			if(el.hasClass('hidden')) {
				effect.hide();
				link.addClass('hiding');
			}
			else {
				link.addClass('showing');
			}

			// Set up the onclick
			link.addEvent('click', function(e) {
				effect.toggle();
				e = new Event(e).stop();
			});
			
			// Toggle "hiding"/"showing" on link class
			// and save state as a session variable
			function toggleLinkClass(el) {
				var id = el.id;
				var query = '';
				
				if(link.hasClass('hiding')) {
					link.removeClass('hiding');
					link.addClass('showing');
					query = 'show='+id;
				}
				else {
					link.removeClass('showing');
					link.addClass('hiding');
					query = 'hide='+id;
				}
				
				// Ajax request to save filter toggle state
				new Ajax('save_filter_toggles.php?'+query, {method: 'get'}).request();
			}
		}
	});
}

// Set up the credit rating lookup when the modal window opens
function setupCreditRatingLookup() {
	var step = $('current_step');
	var submit = $('submit');
	var form = $E('#getCreditScore form');
	var activity = $E('#getCreditScore .activityIndicator');
	var fields = new Array('firstname', 'lastname', 'address', 'city', 'state', 'zip', 'ssn');

	if($defined(form)) {
		// Submit button onclick
		submit.addEvent('click', function(e) {
			e = new Event(e).stop();

			// Check for empty fields
			var fieldError = false;
			fields.each(function(field) {
				f = $(field);
				if(f.getTag() == 'input') {
					if(f.value.trim() == '') fieldError = true;
				}
				else if(f.getTag() == 'select') {
					if(f[f.selectedIndex].value == '') fieldError = true;
				}
			}); 
			// Check for ssn2 and ssn3, which might not exist
			if ($('ssn2')) {
				if ($('ssn2').value.trim() == '') fieldError = true;
				if ($('ssn3').value.trim() == '') fieldError = true;
			}

			// If there was an empty field, show error message
			if(fieldError) {
				if ($('ssn2')) {
					alert("Please provide your first and last name, full address, and your full social security number (only used to verify your identity).");
				} else {
					alert("Please provide your first and last name, full address, and the last four digits of your social security number (only used to verify your identity).");
				}
			}

			// No empty fields
			else {				
				// Show activity indicator
				activity.setStyle('display', 'block');
				
				step.setStyle('display', 'none');
									
				// Go through the activity steps
				var steps = $$('#progress li');
				var counter = 1;
				var milliseconds_delay = 2000;
				
				morphToNext = function() {
					if (counter == steps.length) {
						form.send({
							update: $('mb_contents'),
							evalScripts: true
						});
					} else {
						var fadeOut = new Fx.Style(steps[counter-1], 'color', {duration: 500, onComplete: function() {
							steps[counter-1].removeClass('active');
							steps[counter-1].addClass('complete');
							steps[counter].setStyle('color', '#ffffff');
							steps[counter].addClass('active');
							var fadeIn = new Fx.Style(steps[counter], 'color', {duration: 500});
							fadeIn.start('#000000');
							counter++;
							if (counter == 2) {
								milliseconds_delay = 3000;
							} else {
								milliseconds_delay = 2000;
							}
							morphToNext.delay(milliseconds_delay);
						}});
						fadeOut.start('#cccccc');
					}
				}
				
				morphToNext.delay(milliseconds_delay);
			}
		});
	}
}

// Perform initial actions
window.addEvent('domready', function() {
	setupFeaturesForm();
	setupToggles();
});
