// JavaScript Document


$(document).ready(function() {
	$("li.curriculum").hover(function() {
     	$("ul.curriculum").slideDown(250);
		$(this).addClass("active");
		$("ul.curriculum").css('display', 'block');
		}, function() {
     		$("ul.curriculum").stop(true,true).hide(0);
			$(this).removeClass("active");
		});
	$("li.reservations").hover(function() {
     	$("ul.reservations").slideDown(250);
		$(this).addClass("active");
		$("ul.reservations").css('display', 'block');
		}, function() {
     		$("ul.reservations").stop(true,true).hide(0);
			$(this).removeClass("active");
		});
	$("li.about").hover(function() {
     	$("ul.about").slideDown(250);
		$(this).addClass("active");
		$("ul.about").css('display', 'block');
		}, function() {
     		$("ul.about").stop(true,true).hide(0);
			$(this).removeClass("active");
		});
	$("li.filmlibrary").hover(function() {
     	$("ul.filmlibrary").slideDown(250);
		$(this).addClass("active");
		$("ul.filmlibrary").css('display', 'block');
		}, function() {
     		$("ul.filmlibrary").stop(true,true).hide(0);
			$(this).removeClass("active");
		});
	$(".film").hover(function(){
		$(this).css('border-color', '#111');
		},function(){
			$(this).css('border-color', '#eee');				  
	  });
		$(".lessons").hover(function(){
		$(this).css('border-color', '#111').css('background', '#efefef');
		},function(){
			$(this).css('border-color', '#bbb').css('background', '#f2f2f2');				  
	  });
		$("div.filmlist").hide();
		$("a.filmlist").click(function() {
     		$("div.filmlist").slideToggle();
			return false;
		});
 });


$(function(){
	var offsetx = 10; // Assigns pixel values so the hover image is offset - prevents stutter
	var offsety = -228; // Doing negative values since the img is in the lower right, so it'll appear toward the up and left
	$('.summary a img').hover(function(e){ // when hovering over #about anchors, do this
			var href = $(this).attr('src'); // assign the href attribute of the #about anchor to variable named href.
			$('<div id="large"><img src="' + href + '"alt="image" ></div>') // get an image with a source of the href variable
			.css('top' , e.pageY + offsety) //...and style it with this positioning: current coordinates plus offset variables
			.css('left' , e.pageX + offsetx) 
			.fadeIn(200) // ...and fade it in instead of just popping 
			.appendTo('body'); //...and append it to the body.
		}, function(){ // mouse off
			$('#large').remove(); // remove the .large image
			});
		$('.summary img').mousemove(function(e){ //use mousemove so it doesn't keep disappearing over and over
			$('#large').css('top' , e.pageY + offsety).css('left' , e.pageX + offsetx); // style the id to appear at the current coordinates.
		});
});

		$(function() {
			$('.map').hover(function(){ //when hovering over elements with the class "sample"...
				$(this).find('p').animate({bottom:'-15px'},200); //find its p elements and animate them, from the bottom, over 200 milliseconds.
			}, function(){
				$(this).find('p').animate({bottom:'-55px'},200); //on mouseoff, return.
			});
		});
		
/* Callout home page hover
				$(function() {
			$('.callout').hover(function(){ //when hovering over elements with the class "sample"...
				$(this).find('p').animate({bottom:'0px'},200); //find its p elements and animate them, from the bottom, over 200 milliseconds.
			}, function(){
				$(this).find('p').animate({bottom:'-40px'},200); //on mouseoff, return.
			});
		});
*/
/*$(document).ready(function() {
	$('#filmy li').each(
	   function()
	   {
		$(this).qtip({
			position: 'left',
			offset: [-10, 0],
			content: $(this).attr("title")
		});
	   }
	).attr("title", '');
});*/

// Create the tooltips only on document load

$(document).ready(function(){
$("#secondary li[title]").qtip({
	position: {
		corner: {
			target: 'leftMiddle',
			tooltip: 'rightMiddle'
		}
	  },
   style: { 
      width: 270,
      padding: 10,
      background: '#fafafa',
      color: '#444',
      textAlign: 'left',
      border: {
         width: 7,
         radius: 5,
         color: '#5C5C5C'
      },
      tip: 'rightMiddle',
       // Inherit the rest of the attributes from the preset dark style
   }
});
});