Friday, 15 August 2014

ajax - Javascript events firing in undesired order -



ajax - Javascript events firing in undesired order -

the problem:

mouseout event fires , causes infobox remain open when user drags mouse on marker fast. in other words... if user moves in , out of marker... mouseover event fires, mouseout event fires ... then, placesservice callback executed , ib.open() called.

the code: map = new google.maps.map(document.getelementbyid("map-canvas"), mapoptions); var request = { key: 'for_my_eyes_only', location: new google.maps.latlng(some_lat, some_lng);, radius: '500', types: ["restaurant"] }; var service = new google.maps.places.placesservice(map); service.search(request, placescallback); function placescallback(results, status) { if (status == google.maps.places.placesservicestatus.ok) { (var = 0; < results.length; i++) { var place = results[i]; var marker = new google.maps.marker({ map: map, position: place.geometry.location, }); //infobox settings var ib = new infobox({ //a bunch of irrelevant properties. }); google.maps.event.addlistener(marker, 'mouseover', markermouseoverfactory(place, marker, ib)); google.maps.event.addlistener(marker, 'mouseout', markermouseoutfactory(ib)); } } } function markermouseoverfactory(place, marker, ib){ homecoming function(){ var detailservice = new google.maps.places.placesservice(map); detailservice.getdetails({reference: place.reference}, function(details, status){ if (status == google.maps.places.placesservicestatus.ok) { ib.setcontent(/*set content using details*/); ib.open(map, marker); } }); } } function markermouseoutfactory(ib){ homecoming function(){ ib.close(); } } the question:

is there way abandon google maps ajax request? if abandon ajax request in mouseout listener, good. or, how solve this? tried using simple flag in mouseout, couldn't working.

there no method cancel request in api far know. delay callback executed within mouseover event. if user holds mouse longer specified time; mean he/she wants infobox displayed.

workaround: var delaytimer, delay = 800; //less 1 sec. delay google.maps.event.addlistener(marker, 'mouseover', function() { delaytimer = settimeout(function() { markermouseoverfactory(place, marker, ib); }, delay); }); google.maps.event.addlistener(marker, 'mouseout', markermouseoutfactory(ib)); function markermouseoutfactory(ib){ cleartimeout(delaytimer); //clear timeout here homecoming function(){ ib.close(); } }

javascript ajax google-maps google-maps-api-3 google-places-api

No comments:

Post a Comment