add button to start presentation

Instead of automatically starting after selecting a file.
This pleases Chrome's popup blocker, which no longer blocks it.
Firefox isn't smart enough to establish the click causality link though.

2 files changed, 11 insertions, 2 deletions

diff --git a/beamer/viewer/viewer.js b/beamer/viewer/viewer.js
index 414ff1c..065298a 100644
--- a/beamer/viewer/viewer.js
+++ b/beamer/viewer/viewer.js
@@ -21,6 +21,8 @@
 class Viewer {
   constructor() {
     this.fileInput = document.getElementById("fileInput");
+    this.startButton = document.getElementById("startButton");
+
     this._listenForInput();
   }
 
@@ -47,8 +49,12 @@ class Viewer {
 
   _listenForInput() {
     const self = this;
-    fileInput.addEventListener("change", function(event) {
-      self._readFile(event.target.files[0]);
+    fileInput.addEventListener("change", function(_event) {
+      self.startButton.disabled = false;
+    });
+
+    startButton.addEventListener("click", function(_event) {
+      self._readFile(self.fileInput.files[0]);
     });
 
     document.body.addEventListener("drop", function(event) {
diff --git a/index.html b/index.html
index 68239ff..61c53fc 100644
--- a/index.html
+++ b/index.html
@@ -70,6 +70,9 @@
         </p>
 
         <input id="fileInput" type="file" multiple="false" accept="application/pdf" />
+        <br />
+        <br />
+        <input id="startButton" type="button" value="Start presentation" disabled />
       </div>
     </div>