/* javascript for homepage */
"use strict";

// values for our crazy renegade image!
var zones;
zones = [];
zones['downtown-manhattan'] = { z_width: '52px', z_height: '60px', z_top: '244px', z_left: '144px', z_bg_top: '-419px', z_bg_left: '-177px' };
zones['midtown-west-manhattan'] = { z_width: '37px', z_height: '50px', z_top: '203px', z_left: '156px', z_bg_top: '-356px', z_bg_left: '-355px' };
zones['midtown-east-manhattan'] = { z_width: '39px', z_height: '53px', z_top: '213px', z_left: '171px', z_bg_top: '-356px', z_bg_left: '-315px' };
zones['upper-manhattan'] = { z_width: '64px', z_height: '121px', z_top: '55px', z_left: '196px', z_bg_top: '0px', z_bg_left: '-347px' };
zones['upper-east-side-manhattan'] = { z_width: '40px', z_height: '55px', z_top: '167px', z_left: '194px', z_bg_top: '-300px', z_bg_left: '-314px' };
zones['upper-west-side-manhattan'] = { z_width: '38px', z_height: '54px', z_top: '157px', z_left: '173px', z_bg_top: '-302px', z_bg_left: '-355px' };
zones['bronx-zone-1'] = { z_width: '70px', z_height: '79px', z_top: '2px', z_left: '245px', z_bg_top: '-402px', z_bg_left: '0px' };
zones['bronx-zone-2'] = { z_width: '64px', z_height: '101px', z_top: '68px', z_left: '236px', z_bg_top: '-137px', z_bg_left: '-239px' };
zones['bronx-zone-3'] = { z_width: '97px', z_height: '87px', z_top: '13px', z_left: '298px', z_bg_top: '-402px', z_bg_left: '-69px' };
zones['bronx-zone-4'] = { z_width: '67px', z_height: '84px', z_top: '80px', z_left: '278px', z_bg_top: '-137px', z_bg_left: '-302px' };
zones['bronx-zone-5'] = { z_width: '55px', z_height: '63px', z_top: '95px', z_left: '333px', z_bg_top: '-238px', z_bg_left: '-314px' };
zones['brooklyn-zone-1'] = { z_width: '132px', z_height: '124px', z_top: '252px', z_left: '145px', z_bg_top: '-137px', z_bg_left: '-106px' };
zones['brooklyn-zone-2'] = { z_width: '107px', z_height: '111px', z_top: '303px', z_left: '213px', z_bg_top: '-137px', z_bg_left: '0px' };
zones['brooklyn-zone-3'] = { z_width: '178px', z_height: '137px', z_top: '349px', z_left: '122px', z_bg_top: '0px', z_bg_left: '0px' };
zones['queens-zone-1'] = { z_width: '164px', z_height: '158px', z_top: '177px', z_left: '206px', z_bg_top: '-261px', z_bg_left: '-151px' };
zones['queens-zone-2'] = { z_width: '151px', z_height: '141px', z_top: '273px', z_left: '309px', z_bg_top: '-261px', z_bg_left: '0px' };
zones['queens-zone-3'] = { z_width: '170px', z_height: '137px', z_top: '165px', z_left: '317px', z_bg_top: '0px', z_bg_left: '-178px' };
//zones['westchester'] = { z_width: '111px', z_height: '27px', z_top: '7px', z_left: '377px', z_bg_top: '-448px', z_bg_left: '-238px' };
//zones['new-jersey'] = { z_width: '123px', z_height: '27px', z_top: '22px', z_left: '122px', z_bg_top: '-419px', z_bg_left: '-238px' };

function hover_or_overlay(id, type, $selected_box) {
	// set the object we're working with 
	var $object, just_created;
	just_created = false;
	if (type === 'overlay') { //overlay
		if ($('#map #' + id + '-active').length === 0) { // if there is no current overlay
			$('#map').append('<div id="' + id + '-active" style="display: none;"></div>');
			just_created = true;
		}
		$object = $('#map #' + id + '-active');
	} else { // hover
		$object = $('#map #renegade');
	}

	// object's css properties
	$object.css({
		position: 'absolute',
		background: 'transparent url(img/map_graphics/map-core-highlight2.png) no-repeat',
		width: zones[id].z_width,
		height: zones[id].z_height,
		top: zones[id].z_top,
		left: zones[id].z_left
	});
	if (type === 'overlay') {
		$object.css({
			'background-position': (parseInt(zones[id].z_bg_left, 10) - 412) + 'px ' + zones[id].z_bg_top,
			'z-index': 0
		});
	} else {
		$object.css({
			//'background-position': zones[id].z_bg_left + ' ' + zones[id].z_bg_top,
			'background-position': (parseInt(zones[id].z_bg_left, 10) - 412) + 'px ' + zones[id].z_bg_top,
			'z-index': 1
		});
	}

	// object's behavior
	if (type !== 'hover') { // nothing to do on a hover; show/hide in the invoked hover() function
		if ($selected_box) {
			$selected_box.attr('disabled', true); // we want the checkbox disabled while we're transitioning, to prohibit awkward states
			if (just_created) {
				$object.fadeIn('fast', function () { 
					$selected_box.removeAttr('disabled'); 
				});
			} else {
				$object.fadeOut('fast', function () { 
					$object.remove(); 
					$selected_box.removeAttr('disabled'); 
				});
			}
		} else {
			if (just_created) {
				$object.fadeIn('fast');
			} else {
				$object.fadeOut('fast', function () { 
					$object.remove(); 
				});
			}
		}
	}
}

function disable_or_enable_blanket_checkboxes(object, chk_array, map_array) {
	var chk;
	for (chk in map_array) {
		if (!$('#signup .neighborhood-checkboxes #' + chk_array[chk]).attr('checked')) {
			hover_or_overlay(map_array[chk], 'overlay');
		} 
	}
	if (object.attr('checked')) {
		for (chk in chk_array) {
			if (chk_array[chk]) { 
				$('#signup .neighborhood-checkboxes #' + chk_array[chk]).attr('disabled', true).removeAttr('checked'); 
			}
		}
	} else {
		for (chk in chk_array) {
			if (chk_array[chk]) { 
				$('#signup .neighborhood-checkboxes #' + chk_array[chk]).removeAttr('disabled'); 
			}
		}
	}
}

$(document).ready(function () {
  
  $('#signup').insertBefore('#free-sample-listings');
	
	// wire up our lightboxes
	//$('a.lightbox').colorbox();
	$('a.section8').colorbox({ inline: true, href: '#section8', width: '700px' });
	$('.aiv').colorbox({ inline: true, href: '#aiv-license-info' });
	$('.sample-link').colorbox({ scalePhotos: false, height: '600px', width: '820px' });
	
	// mask the input for the phone field, to ensure proper entry
	$('#day_telephone').mask("999-999-9999");
	
	// method for checking out checkboxes for the form validation
	$.validator.methods.checkboxes_checked = function (value, element, param) {
		return ($('#signup #checkboxes input[type=checkbox]:checked').length > 0);
	};
	
	// validate the form
	$('#signup').validate({
		rules: {
			'bedrooms': { required: true },
			'maxrent': { required: true },
			'term': { required: true },
			'movedate': { required: true },
			'firstname': { required: true, minlength: 2 },
			'lastname': { required: true },
			'email': { required: true, email: true },
			'day_telephone': { required: true },
			'z999': 'checkboxes_checked' // only the "All Manhattan" checkbox is 'technically' checked for validity, but we use our method defined above to make sure this fails unless there is at least one checkbox selected
		},
		messages: {
			'z999': "You must select at least one area to live in!"
		},
		highlight: function (element, errorClass) { 
			$(element).fadeOut(function () { 
				$(element).fadeIn(); 
			});
			$('label[for=' + $(element).attr('name') + ']').css('color', 'red');
		},
		unhighlight: function (element, errorClass) { 
			$('label[for=' + $(element).attr('name') + ']').css('color', 'black'); 
		},
		errorElement: "div",
		errorPlacement: function (error, element) {
			if (element.is(':checkbox')) {
				error.appendTo(element.parents('fieldset'));
			} else {
				error.css('display', 'none'); 
			}
		},
		onkeyup: false
	});

  // equalize the height on the testimonail div
	$('ul#testimonials').css({
		'height': $('#features').height() - 30
	});
	
	$('#samples').change(function () {
		if ($(this).find('option:selected').val() !== '') {
			window.open($(this).find('option:selected').val());
		}
	});

	/* ********** Renegade Sprite! ********** */

	// add our renegade <div> to mask what item is hovered; since when the page loads we have nothing selected, let's hide it for now
	$('#map').append('<div style="display: none;" id="renegade"></div><div style="display: none;" id="zone-neighborhoods"></div>');
	var $renegade = $('#map #renegade');
	
	$('#map').css('z-index', 10);

	// hover event
	$('#map li').hover(function () {
		var which, neighborhoods, html_neighborhoods, neighborhood;
		which = $(this).attr('id');
		hover_or_overlay(which, 'hover');
		$renegade.show();
		neighborhoods = $(this).text().match(/(\b[a-zA-Z\s\.'’\/]+)/g);
		html_neighborhoods = '<ol>';
		for (neighborhood in neighborhoods) {
			if (neighborhoods[neighborhood]) { 
				html_neighborhoods += '<li>' + neighborhoods[neighborhood] + '</li>'; 
			}
		}
		html_neighborhoods += '</ol>';
		$('#zone-neighborhoods').show().html(html_neighborhoods); // display the neighborhoods for each zone hovered
	}, function () {
		$renegade.hide();
		$('#zone-neighborhoods').hide();
	});

	// click event (for the map)
	$('#map li').click(function () {
		var this_class, which, $selected_box;
		this_class = $(this).attr('class');
		which = $(this).attr('id');
		$selected_box = $('#signup #' + this_class);
		if ($selected_box.attr('checked')) {
			$selected_box.attr('checked', false);
		} else {
			$selected_box.attr('checked', true);
		}
		hover_or_overlay(which, 'overlay');
	});

	// make the map obey the checkboxes too!
	$('#signup .neighborhood-checkboxes input:checkbox').click(function () {
		var this_id, which, chk_array, map_array;
		this_id = $(this).attr('id');
		which = $('#map li.' + this_id).attr('id');
		chk_array = [];
		map_array = [];
		switch (this_id) { // these are my blanket zones; treat them as such
		case 'AllMNH': 
			chk_array = ['DWN', 'MTE', 'MTW', 'UES', 'UWS', 'UMH'];
			map_array = ['downtown-manhattan', 'midtown-east-manhattan', 'midtown-west-manhattan', 'upper-east-side-manhattan', 'upper-west-side-manhattan', 'upper-manhattan'];
			break;
		case 'AllBX': 
			chk_array = ['BX1', 'BX2', 'BX3', 'BX4', 'BX5'];
			map_array = ['bronx-zone-1', 'bronx-zone-2', 'bronx-zone-3', 'bronx-zone-4', 'bronx-zone-5'];
			break;
		case 'AllBK': 
			chk_array = ['BK1', 'BK2', 'BK3'];
			map_array = ['brooklyn-zone-1', 'brooklyn-zone-2', 'brooklyn-zone-3'];
			break;
		case 'AllQU': 
			chk_array = ['QU1', 'QU2', 'QU3'];
			map_array = ['queens-zone-1', 'queens-zone-2', 'queens-zone-3'];
			break;
		}
		if (this_id === 'AllMNH' || this_id === 'AllBX' || this_id === 'AllBK' || this_id === 'AllQU') {
			disable_or_enable_blanket_checkboxes($(this), chk_array, map_array); 
		} else {
			if (/* all of the other sibling checkboxes are checked */ false) {
				// then deselect all of the sibling checkboxes and select the corresponding blanket checkbox
			} else {
				hover_or_overlay(which, 'overlay', $(this));
			}
		}
	});
	
});

// for google site optimizer
function swap_top_sections() {
	$('form#signup').insertBefore('div#masthead');
}

/*jslint white: true, onevar: true, undef: true, nomen: true, eqeqeq: true, plusplus: true, bitwise: true, regexp: true, strict: true, newcap: true, immed: true */