From 4c33f25556dc2f8928d7d56f089b5d81876c7ff5 Mon Sep 17 00:00:00 2001
From: Jordan Eldredge <jordan@jordaneldredge.com>
Date: Mon, 10 Sep 2018 08:07:20 -0700
Subject: [PATCH] Expose the ability to open file references from outside of
 Webamp

---
 docs/usage.md    | 15 +++++++++++++++
 js/index.js      | 24 ++++++++++++++----------
 js/webampLazy.js |  4 ++++
 3 files changed, 33 insertions(+), 10 deletions(-)

diff --git a/docs/usage.md b/docs/usage.md
index 808e14ed..d9059d36 100644
--- a/docs/usage.md
+++ b/docs/usage.md
@@ -242,6 +242,21 @@ const unsubscribe = webamp.onMinimize(() => {
 unsubscribe();
 ```
 
+### `openFiles(files)`
+
+Ask Webamp to open a set of [files](https://developer.mozilla.org/en-US/docs/Web/API/File). Useful for implementing a file input or "drag and drop" target outside of Webamp.
+
+* `.zip` or `.wsz` files are opened as skins
+* `.eqf` files are opened as equalizer files
+* All other file types are assumed to be media files
+
+```JavaScript
+const someFileInput = document.getElementById('someFileInput');
+someFileInput.addEventListener('change', (e) => {
+    webamp.openFiles(e.target.files);
+});
+```
+
 ## Notes
 
 - Internet Explorer is not supported.
diff --git a/js/index.js b/js/index.js
index 92153d39..995e870a 100644
--- a/js/index.js
+++ b/js/index.js
@@ -85,16 +85,6 @@ if ("URLSearchParams" in window) {
   skinUrl = params.get("skinUrl") || skinUrl;
 }
 
-function supressDragAndDrop(e) {
-  e.preventDefault();
-  e.dataTransfer.effectAllowed = "none";
-  e.dataTransfer.dropEffect = "none";
-}
-
-window.addEventListener("dragenter", supressDragAndDrop);
-window.addEventListener("dragover", supressDragAndDrop);
-window.addEventListener("drop", supressDragAndDrop);
-
 let lastActionType = null;
 
 // Filter out consecutive common actions
@@ -264,6 +254,20 @@ Raven.context(() => {
 
   webamp.renderWhenReady(document.getElementById("app"));
 
+  function supressDragAndDrop(e) {
+    e.preventDefault();
+    e.stopPropagation();
+    e.dataTransfer.dropEffect = "link";
+    e.dataTransfer.effectAllowed = "link";
+  }
+
+  window.addEventListener("dragenter", supressDragAndDrop);
+  window.addEventListener("dragover", supressDragAndDrop);
+  window.addEventListener("drop", e => {
+    webamp.openFiles(e.dataTransfer.files);
+    supressDragAndDrop(e);
+  });
+
   // Expose webamp instance for debugging and integration tests.
   window.__webamp = webamp;
 });
diff --git a/js/webampLazy.js b/js/webampLazy.js
index 0fb88f08..38b30087 100644
--- a/js/webampLazy.js
+++ b/js/webampLazy.js
@@ -206,6 +206,10 @@ class Winamp {
     return storeHas(this.store, state => !state.display.loading);
   }
 
+  openFiles(files) {
+    this.store.dispatch(loadFilesFromReferences(files));
+  }
+
   async renderWhenReady(node) {
     await this.skinIsLoaded();
     const genWindowComponents = {};