JSFiddle - React, Tailwind, and code Playground

by nathan

JavaScript

const keymap = {
	"ArrowRight" : "next",
  "ArrowDown" : "next",
  "PageDown" : "next",
  "Space" : "next",
  "ArrowLeft" : "prev",
  "ArrowUp" : "prev",
  "PageUp" : "prev",
  "F1" : "clearAll",
  "F2" : "clearSlides",
  "F3" : "clearBackground",
  "F4" : "clearProps",
  "F5" : "clearAudio",
  "F6" : "logo",
  "F7" : "liveVideo"
};

document.addEventListener('keydown', (event) => {
  if (event.ctrlKey || event.altKey || event.shiftKey) {
  	return;
  }
  if (event.target.tagName === "INPUT") {
  	return;
  }
  if (keymap[event.key]) {
  	proKeyInterface[event.key]();
    return;
  }
  if (event.key.test(/^[A-Z0-9]$/i)) {
  	proKeyInterface.sendKey(event.key);
  }
});