count mousemove events

by Richard Hunter

HTML

<div id="foo">foo</div>
<button id="mm">record number of mousemove events</button>
<button id="kp">record number of keypress events</button>

CSS

#foo {
  background: pink;
  width: 50px;
  height: 50px;
  padding: 10px;
}

JavaScript

var countMM = false;
var countKP = false;
var mmCounter = 0;
var kpCounter = 0;

document.body.addEventListener('mousemove', (event) => {
  if(countMM) {
  	mmCounter++;
  }
});
document.body.addEventListener('keypress', (event) => {
  if(countKP) {
  	kpCounter++;
  }
});

mm.addEventListener('click', () => {
	countMM = true;
  mmCounter = 0;
  
	setTimeout(() => {
  	countMM = false;
    console.log('mouse move events', mmCounter);
  }, 10000);
});
kp.addEventListener('click', () => {
	countKP = true;
  kpCounter = 0;
  
	setTimeout(() => {
  	countKP = false;
    console.log('key pressg events', kpCounter);
  }, 10000);
});