Handle file drag and drop

4 files changed, 57 insertions, 28 deletions

diff --git a/pointless/viewer/init.js b/pointless/viewer/init.js
new file mode 100644
index 0000000..9454a23
--- /dev/null
+++ b/pointless/viewer/init.js
@@ -0,0 +1,31 @@
+/*
+ * init.js
+ * Part of Pointless Viewer, a Beamer presentation viewer
+ * Copyright 2018 Pacien TRAN-GIRARD
+ * License: GNU GPL v3
+ */
+
+"use strict";
+
+var params = function() {
+  var queryDict = {};
+  location.search.substr(1).split("&").forEach(function(item) {
+    var pair = item.split("=");
+    queryDict[pair[0]] = pair[1];
+  });
+  return queryDict;
+}();
+
+function isController() {
+  return window.opener == null || window.opener.location.href != window.location.href;
+}
+
+function init() {
+  var viewer = new Viewer();
+  
+  if ("file" in params)
+    viewer.load(params["file"]);
+}
+
+if (isController())
+  init();
diff --git a/pointless/viewer/viewer.css b/pointless/viewer/viewer.css
index bea73e6..be4f876 100644
--- a/pointless/viewer/viewer.css
+++ b/pointless/viewer/viewer.css
@@ -5,11 +5,12 @@
  * License: GNU GPL v3
  */
 
-body {
+html, body {
   background-color: black;
   color: white;
   font-family: sans-serif;
   overflow: hidden;
+  height: 100%;
 }
 
 #fileInput {
diff --git a/pointless/viewer/viewer.js b/pointless/viewer/viewer.js
index 1c651fc..78035ee 100644
--- a/pointless/viewer/viewer.js
+++ b/pointless/viewer/viewer.js
@@ -7,50 +7,46 @@
 
 "use strict";
 
-var params = function() {
-  var queryDict = {};
-  location.search.substr(1).split("&").forEach(function(item) {
-    var pair = item.split("=");
-    queryDict[pair[0]] = pair[1];
-  });
-  return queryDict;
-}();
-
-function isController() {
-  return window.opener == null || window.opener.location.href != window.location.href;
-}
-
 class Viewer {
   constructor() {
     this.fileInput = document.getElementById("fileInput");
     this.fileInput.style.display = "block";
-
-    var self = this;
-    fileInput.addEventListener("change", function(event) {
-      var callback = function(file) { self._load(file) };
-      self._readFile(event.target.files[0], callback);
-    });
-
-    if ("file" in params)
-      this._load(params["file"]);
+    this._listenForInput();
   }
 
-  _load(source) {
+  load(source) {
     this.fileInput.style.display = "none";
     pdfjsLib.getDocument(source).then(function(pdf) {
       var presentation = new Presentation(pdf);
     });
   }
 
-  _readFile(file, callback) {
+  _readFile(file) {
     var fileReader = new FileReader();
+    var self = this;
     fileReader.onload = function() {
       var byteArray = new Uint8Array(this.result);
-      callback(byteArray);
+      self.load(byteArray);
     }
   
     fileReader.readAsArrayBuffer(file);
   }
-}
 
-if (isController()) new Viewer();
+  _listenForInput() {
+    var self = this;
+    fileInput.addEventListener("change", function(event) {
+      self._readFile(event.target.files[0]);
+    });
+
+    document.body.addEventListener("drop", function(event) {
+      event.preventDefault();
+      event.stopPropagation();
+      self._readFile(event.dataTransfer.files[0]);
+    });
+
+    document.body.addEventListener("dragover", function(event) {
+      event.preventDefault();
+      event.stopPropagation();
+    });
+  }
+}
diff --git a/viewer.html b/viewer.html
index 943bbce..df529ca 100644
--- a/viewer.html
+++ b/viewer.html
@@ -26,5 +26,6 @@
     <script type="text/javascript" src="pointless/viewer/stage.js"></script>
     <script type="text/javascript" src="pointless/viewer/presentation.js"></script>
     <script type="text/javascript" src="pointless/viewer/viewer.js"></script>
+    <script type="text/javascript" src="pointless/viewer/init.js"></script>
   </body>
 </html>