/*jQuery function for the home page slide viewer (menu items switch the slide, they also rotate automatically*/
$.fn.homeSlides = function (menu_class) { //menu_class is the class used on menu items:

	/*For each element (hopefully only one), perform the setup:*/
	this.each(function () {
		/*Initialize variables:*/
		var $slide_div = $(this); //get the large slide div we're using
		var $slides = $slide_div.children('div'); //find the slides (divs) themselves
		var $menus = $('.'+menu_class); //get all of the menu items
		var last_slide_num = -1; //the last slide that was selected (initialized to -1)
		var slide_num = -1; //the new slide we want to select (init to -1)
		var $new_slide; //variable for the new slide object
		var $last_slide; //variable for the last slide object
		var $new_menu; //variable for the new menu object
		var $last_menu; //variable for the last menu object

		/*Set up divs to original positions, as needed:*/
		$slides.hide(); //hide all the full-sized slides

		$new_slide = $slides.first(); //get the first slide
		slide_num = 0; //get the menu index for this slide
		$new_menu = $($menus.get(slide_num)); //get the new menu
		$new_menu.addClass('home-selected'); //select the menu
		$new_slide.addClass('home-selected'); //select the slide
		$new_slide.show(); //show the first slide
		last_slide_num = slide_num;

		/*Now turn on cycling:*/
		$slide_div.cycle( //cycle items in the container
			{
				fx: 'fade', //fade the transition
				before: before_change, //the callback for before a slide changes
				after: after_change //the callback for after a slide changes
			}
		);
		/*React to a menu being clicked:*/
		$menus.click(function () {
			$slide_div.cycle('stop'); //stop the cycling
			$slides.each(function() { //for each slide
				$(this).css('opacity', '1'); //make all slides opaque
			});
			slide_num = $menus.index(this); //get the menu index for this slide
			$new_menu = $($menus.get(slide_num)); //get the new menu
			$last_menu = $($menus.get(last_slide_num)); //get the last menu
			$new_slide = $($slides.get(slide_num)); //use the variable for the new slide
			$last_slide = $($slides.get(last_slide_num)); //get the last slide

			if (slide_num != last_slide_num) { //if the new slide isn't the same as the last one
				$last_slide.fadeOut(200, 'swing', function() {
					$new_slide.fadeIn(200);
				}); //fade out the old slide, then fade in new slide (callback used to avoid "shrinking" of expansion div when both images are faded out)
				$last_menu.removeClass('home-selected');
				$new_menu.addClass('home-selected');
				$last_slide.removeClass('home-selected'); //toggle the selection class on the old slide
				$new_slide.addClass('home-selected'); //toggle on new slide
				last_slide_num = slide_num; //set this slide number as the last one selected
			}
		});

		/*Function for before the slide is auto-changed:*/
		function before_change(old_slide, new_slide, opts) {
			slide_num = $slides.index(new_slide); //get the new slide number
			$new_menu = $($menus.get(slide_num)); //get the new menu
			$last_menu = $($menus.get(last_slide_num)); //get the last menu
			$last_menu.removeClass('home-selected');
			$new_menu.addClass('home-selected');
		}

		/*Function for after the slide is auto-changed:*/
		function after_change(old_slide, new_slide, opts) {
			slide_num = $slides.index(new_slide); //get the new slide number
			last_slide_num = slide_num; //save the new slide number
		}
	});
};