Jak wykrywać zatrzymanie myszy

Question

Napisałem poniższy kod JavaScript. Używam go do wykrycia, kiedy mysz się porusza i kiedy się zatrzyma. Funkcja MouseStopped() to pętla setek elementów, która powie mi, gdzie zatrzymała się mysz, więc chcę ją wywołać tylko wtedy, gdy mysz się zatrzyma.

var CheckMovement; 
var stopLoop = false; 
var n = 0; 
canvas.addEventListener('mousemove', function (evt) { 
    CheckMovement = setInterval(function() { HasMouseStopped(evt) }, 250); 
}, false) 

function HasMouseStopped(evt) { 
    var mousePos = getMousePos(canvas, evt); 
    newMouseX = mousePos.x; 
    newMouseY = mousePos.y; 
     if ((newMouseX !== mouseX) && (newMouseY !== mouseY)) { 

      stopLoop = true; 
     } else { 
      //stopped moving 
      clearInterval(CheckMovement); 
      stopLoop = false; 
      n = 0; 
      MouseStopped(); 
     } 
     mouseX = newMouseX; 
     mouseY = mousePos.y; 
} 

function MouseStopped() { 
    while (arr.length > n) { 
     if (stopLoop) { break; } 
     if (ctx.isPointInPath(mouseX, mouseY)) { 
      //tooltip text 
      ctx.font = '12pt Candara'; 
      ctx.fillStyle = 'black'; 
      ctx.fillText(arr[n], mouseX + 10, mouseY - 5); 
      break; 
     } 
     n++; 
    } 
} 

Teraz mam następujące problemy:

1. Nawet Wołam clearInterval(CheckMovement), to nie zatrzymania iteracji; działa ciągle, co powoduje wielokrotne wywoływanie problemu . Dlaczego się nie zatrzymuje?
2. Chciałbym zerwać MouseStopped() w środku jego działania, jeśli mysz zostanie przesunięta, zanim zakończy swoją pętlę. Właśnie dlatego ustawiam stopLoop = true;. Jednak to też nie działa zgodnie z zamierzeniami. Jak mogę to osiągnąć?

Dzięki.

edytuje

Answer 1

To bardzo proste: kiedy mysz jest przesuwana, ustawić limit czasu dla XXX milisekund w przyszłości. Usuń również wszelkie wcześniejsze limity czasu, aby zresetować czas. Tak, jak w przypadku nasłuchiwania przy pomocy myszy

clearTimeout(timer); 
timer=setTimeout(mouseStopped,300); 

Zobacz to JSFiddle.