refactor: separate globalEventHandlers from cell-specific event handlers

lib/mnswpr.js

@@ -101,6 +101,7 @@ const Minesweeper = function(appId, version, hooks = undefined) {
       appElement.innerHTML = ''
       appElement.append(headingElement, gameBoard)
     }
+    initializeGlobalEventHandlers()
     generateGrid({ initial: true })
   }
 
@@ -277,14 +278,12 @@ const Minesweeper = function(appId, version, hooks = undefined) {
 
   }
 
-  function initializeEventHandlers(_cell) {
-
-    let cell = _cell
-    skip = false
-    skipCondition = false
-
-    resetMouseEventFlags()
-
+  /**
+   * Wire the document/window/grid-level input handlers. These don't depend on
+   * any individual cell, so they're set up once instead of being reassigned
+   * for every cell during grid generation.
+   */
+  function initializeGlobalEventHandlers() {
     document.onkeydown = function(e) {
       if (e.keyCode == 32 || e.keyCode == 113) {
         generateGrid()
@@ -304,10 +303,13 @@ const Minesweeper = function(appId, version, hooks = undefined) {
     grid.onmouseleave = function() {
       removeHighlights()
     }
+
     document.oncontextmenu = () => false
+
     document.onmouseup = function() {
       resetMouseEventFlags()
     }
+
     document.onmousedown = function(e) {
       isMobile = false
       switch (e.button) {
@@ -316,6 +318,15 @@ const Minesweeper = function(appId, version, hooks = undefined) {
         case 2: isRight = true; break
       }
     }
+  }
+
+  function initializeEventHandlers(_cell) {
+
+    let cell = _cell
+    skip = false
+    skipCondition = false
+
+    resetMouseEventFlags()
 
     // Set grid status to active on first click
     cell.onmouseup = function(e) {