// JavaScript Document
$(document).ready(function(){


// Hover ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
$(".drawing_pic").hover(
      function () {
		var p = $(this).position();	
		var new_top = p.top - 10;
		console.log(p.top + "    " + new_top);
		$(this).children("a").children(".pic_label") . css("top", new_top); 
		
		$(this).children("a").children(".pic_label") . show("slow");		
	  	
      }, 
      function () {	  
		$(this).children("a").children(".pic_label") . hide("slow");		
	

      }
    ); // end hover
	
	
$(".thumb").hover(
      function () {
		
		var title = $(this).attr("id"); // retrieve the id
		console.log(title);
		$(".image_description") . filter("#" + title) . show("slow");	  	
      }, 
      function () {	  
		var title = $(this).attr("id"); // retrieve the id
		$(".image_description") . filter("#" + title) . hide("slow");

	

      }
    ); // end hover

//End Hover ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~



// Dragger ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~			
	$('#dragger')
		.bind('dragstart',function( event ){
			//if ( !$(event.target).is('.handle') ) return false;
			return $( this ).css('opacity',.5)
				.clone().addClass('active')
				.insertAfter( this );
			})
		.bind('drag',function( event ){
			$( event.dragProxy ).css({
				top: event.offsetY,
				left: event.offsetX
				});
			var eye_size = $(this).width() / 2;
			console.log("Eye size: "  + eye_size);
			var d = $('.active');
			var position = d.position();
			var art_x = $("#spectrum").position().left + 390 - eye_size ;
			var art_y = $("#spectrum").position().top + 56 - eye_size;
			var art_distance = Math.sqrt( Math.pow(art_x - position.left, 2) + Math.pow(art_y - position.top, 2) );
			
			var science_x = $("#spectrum").position().left + 240 - eye_size;
			var science_y = $("#spectrum").position().top + 150 - eye_size ;
			var science_distance = Math.sqrt( Math.pow(science_x - position.left, 2) + Math.pow(science_y - position.top, 2) );
			var concept_x = $("#spectrum").position().left + 615 - eye_size;
			var concept_y = $("#spectrum").position().top + 145 - eye_size;
			var concept_distance = Math.sqrt( Math.pow(concept_x - position.left, 2) + Math.pow(concept_y - position.top, 2) );
			var product_x = $("#spectrum").position().left + 175 - eye_size;
			var product_y = $("#spectrum").position().top + 45 - eye_size;
			var product_distance = Math.sqrt( Math.pow(product_x - position.left, 2) + Math.pow(product_y - position.top, 2) );
			var new_x = $("#spectrum").position().left  - eye_size;
			var new_y = $("#spectrum").position().top + 115 - eye_size;
			var new_distance = Math.sqrt( Math.pow(new_x - position.left, 2) + Math.pow(new_y - position.top, 2) );
			var old_x = $("#spectrum").position().left + 555  - eye_size;
			var old_y = $("#spectrum").position().top + 45 - eye_size;
			var old_distance = Math.sqrt( Math.pow(old_x - position.left, 2) + Math.pow(old_y - position.top, 2) );
			console.log("old distance: "  + old_distance);
	
	
			$('.work').each(function () {
				
        		var art =      3000 / (( $(this).attr("art") + art_distance) + 1) ;
				var science =  3000 / (( $(this).attr("science") + science_distance) + 1) ;
				var concept =  3000 / (( $(this).attr("concept") + concept_distance) + 1) ;
				var product =  3000 / (( $(this).attr("product") + product_distance) + 1) ;
				var int_date = Math.floor($(this).attr("date_created"));
				var recent =   3000 /  (( 5*int_date + new_distance) + 1) ;
				var old_int = Math.abs(int_date - 5);
				var old =   3000 /  (( 5*old_int + old_distance) + 1) ;
				console.log("recent: "  + recent + "     id: " + $(this).attr("id") + "  int_date " + int_date + "  new_dist " + new_distance);
				$(this) . width (science + concept + art + product + recent + old);
				$(this) . height ((science + concept + art + product + recent + old)*(2/3));
				$(this) . children("a"). children(".main_image") . width (science + concept + art + product + recent + old);
				$(this) . children("a"). children(".main_image") . height ((science + concept + art + product + recent + old)*(2/3));
      		});
	
			
			})
		.bind('dragend',function( event ){
			$( event.dragProxy ).remove();			
			if ( event.pageY < 250 ) {
				$( this ).animate({
				
						top: event.offsetY,
						left: event.offsetX,
						opacity: 1
					
				})
			}
			
		});
// End dragger ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~



	
	
	
}); // doc.ready