From f4ba56a94de30780998d5abef03d7a2778a7fbbb Mon Sep 17 00:00:00 2001
From: up730418 <up730418@port.ac.uk>
Date: Thu, 8 Feb 2018 21:58:51 +0000
Subject: [PATCH] Added keyboard and click events

---
 src/app/ui/modaldialog.js | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/src/app/ui/modaldialog.js b/src/app/ui/modaldialog.js
index 880c52b114..023b2f181c 100644
--- a/src/app/ui/modaldialog.js
+++ b/src/app/ui/modaldialog.js
@@ -39,6 +39,16 @@ module.exports = (title, content, ok, cancel) => {
     if (cancel && cancel.fn) cancel.fn()
   }
 
+  function modalKeyEvent (e) {
+    if (e.keyCode === 27) {
+      cancelListener()
+    } else if (e.keyCode === 13) {
+      okListener()
+    } else {
+      // Do nothing
+    }
+  }
+
   function hide () {
     container.style.display = 'none'
   }
@@ -51,10 +61,14 @@ module.exports = (title, content, ok, cancel) => {
     okDiv.removeEventListener('click', okListener)
     cancelDiv.removeEventListener('click', cancelListener)
     closeDiv.removeEventListener('click', cancelListener)
+    document.removeEventListener('keydown', modalKeyEvent)
+    document.getElementById('modal-background').removeEventListener('click', cancelListener)
   }
   okDiv.addEventListener('click', okListener)
   cancelDiv.addEventListener('click', cancelListener)
   closeDiv.addEventListener('click', cancelListener)
+  document.addEventListener('keydown', modalKeyEvent)
+  document.getElementById('modal-background').addEventListener('click', cancelListener)
 }
 
 function html () {
@@ -70,6 +84,6 @@ function html () {
     <span id="modal-footer-ok" class=${css['modalFooterOk']}>OK</span><span id="modal-footer-cancel"  class=${css['modalFooterCancel']}>Cancel</span>
         </div>
   </div>
-  </div>
+  <div id="modal-background" class="${css['modalBackground']}"> </div>
   </div>`
 }