<p>
  <input onmousedown="return logMouse(event)" onmouseup="return logMouse(event)" onclick="return logMouse(event)" oncontextmenu="return logMouse(event)" ondblclick="return logMouse(event)" value="Click me with the right or the left mouse button" type="button">
  <input onclick="logClear('test')" value="Clear" type="button">
</p>
<form id="testform" name="testform">
  <textarea style="font-size:12px;height:150px;width:360px;">
  </textarea>
</form>

let timer = 0;

function showmesg(t, form) {
  if (timer == 0) {
    timer = new Date();
  }

  let tm = new Date();

  if (tm - timer > 300) {
    t = "------------------------------\n" + t;
  }

  let area = document.forms[form + "form"].getElementsByTagName("textarea")[0];

  area.value += t + "\n";
  area.scrollTop = area.scrollHeight;

  timer = tm;
}

function logMouse(e) {
  let evt = e.type;
  while (evt.length < 11) evt += " ";
  showmesg(evt + " button=" + e.button, "test");
  return false;
}

function keyval(n) {
  if (n == null) return "undefined";
  let s = "" + n;
  if (n >= 32 && n < 127) s += " " + String.fromCharCode(n);
  while (s.length < 6) s += " ";
  return s;
}

function logClear(form) {
  timer = 0;
  document.forms[form + "form"].getElementsByTagName("textarea")[0].value = "";
  lines = 0;
}

window.logClear = logClear;
window.logMouse = logMouse;