var locX;
var locY;


function setup_flyouts(){
	
$(".photo").bind("mouseover", function(event){
 //str = "( " + event.pageX + ", " + event.pageY + " )";
locX = event.pageX;
locY = event.pageY;
//alert("mouseover happened at" + str);
});

  $('.photo').each(function(event) { // When DOM loads, run through all of the .photo divs....
       var author_id = $(this).attr("title");
       /* slightly tricky variable assignment that's the key. The author id assigned the value of 
    whatever the photoattribute's title is.... depending on whatever .photo element we end up mousing
over The cool thing is... this happens *before* any mouseover event. So now, hoverIntent works upon first
mouseover, where before it had to initialize with the first mouseover. *Then* subsequent mouseovers would
work. I was originally setting up hoverIntent within a mouseover function. But hoverIntent itself *contains*
a mouseover function.*/

/* this usage of hover intent had trouble accessing a mouseX coordinate, since the function 
had to initialize ( so it would work right off the bat) before any mouseover events. I discovered you
could push in whatever extra arguments to hoverIntent you wanted. So in this case I created global variables
locX and locY and had them globally rewritten upon mouseover. Then I push the arguments into the 
settings object before passing it to hoverIntent, now with live mouseX and Y coords. */

       var settings = {
             posX:locX,  
             posY:locY,
             sensitivity:2, 
       		 interval:200,
       		 over:function(){ flyout(locX,locY,author_id);}, 
       		 timeout: 5000, 
       		 out:function() { flyout_close();}//flyout_close
       }
      
/* also not that the over function - flyout() - needs to be wrapped in a generic function in order
to smoothly pass arguments to it. A common trick used alot in jquery. */

     
      $(this).hoverIntent(settings); // lastly, each .photo class element has hoverIntent bound to it.
  });
  
 }


    function flyout(locX,locY, author_id){ 
        //alert("event type is " + event.type);
            var blogger_id = author_id;
           	$.post(MyAjax.ajaxurl,{ action: 'myajax_submit', postID: blogger_id,cache:'false' },
    		function(response){

    			$("<div id='flyout'></div>")
    			   .appendTo('body')
    			   .html(response)
    			   .fadeIn("fast")
    			   .css({ 
    				position:'absolute',
    			    width:230,
    			    height:'auto',
    			    border:'solid 2px',
    			    borderColor:'#ce9c23',
    			    background:'url("/wp-content/uploads/2010/12/desert_rocks.jpg")',
    			    '-webkit-border-radius':10,
    			    '-moz-border-radius': 10, 	
    			     left:locX - 220,
    			 	 top:locY-150,
    				cursor:'pointer',
    				display:'none',
    			    'z-index':1
    			   }).fadeIn().delay(10000).fadeOut("fast", function(){
    			//	initial_flyout = false;
    			});

    	        $('#flyout_list_wrapper p').css({
    			'position':'absolute','color':'#FFEEAA','margin-left':'30px', 'margin-top':'-25px'
    			});

    				$('#flyout ul').css({
    				'list-style-type':'none', 'margin-top':'30px', 'margin-left':'5px'});

    					$('#flyout li').css({
    					'margin-top': '3px', 'margin-left':'1px','margin-right':'10px', 'padding':'2px'});

    				$('#flyout li a').css({
    				'color':'#FFFFFF','margin-left':'0px','margin-top':'30px'
    					});

           //alert("response is" + response);

            }// end response function
         ); // end post 

       // });  // end  mouseover conditional

      //} // end enable_tip conditional
     //$('.photo').clearQueue();
     //alert("author ID is " + author_id + "event.pageX is" + event.pageX);
    }



        function flyoutIn(event,author_id){
        /*
        This little test works well, but I don't think I need to use it, now that hoverIntent is working	
        if($("#flyout").length) {  // testing if an older flyout is here. If so, wipe it off the stage.
        	enable_flyout = false 
        	//alert("enable flyout tested as false");
        	} 
        else {

        }
        */
        	if(initial_flyout == true){
        //	alert("flyoutIn called and author id is " + author_id);
        	flyout(event,author_id);

            }

        	 return false;
          //

        }


function fadeFlyOut(){
 
//if(fade_enabled == true) {	
 alert("fadeFlyOut called ");
$('#flyout').fadeOut(300,function(){
	$('#flyout').remove(); 
	//enable_flyout = true;
	}
   );	
 // }	
}


function flyout_close() {
		
			$('#flyout').clearQueue().fadeOut(500,function(){$(this).remove();
		//	$('#flyout').clearQueue().delay(1000).remove();
		//	$('#flyout').remove();	
		    
	      //enable_tip = true;
	 }); 
  // return false;
}