Startseite Erkunden Hilfe
Anmelden
biheng
/
uppy
1
0
Fork 0
Dateien Issues 0 Pull-Requests 0 Wiki
Quellcode durchsuchen

Feature/replace dnd in drag drop package (#1565)

* /examples/dev - added drag-drop plugin dev environment

* @uppy/drag-drop - moved isDragDropSupported() to @uppy/utils

* @uppy/drag-drop - got rid of drag-drop npm library

* examples/dev - made compiled files placed in /output instead of /lib

* ~/examples/dev - made watchify only watch files once

* @uppy/drag-drop - add onPaste

* /examples/dev - readded html css override-attempts

* @uppy/drag-drop - made whole area clickable, and made it accessible

* @uppy/drag-drop - removed excessive outline in firefox

* REVERTED last 2 commits
Evgenia Karunus vor 5 Jahren
Ursprung
9edb35fa40
Commit
8be2004826
18 geänderte Dateien mit 312 neuen und 236 gelöschten Zeilen
Geteilte Ansicht Diff-Statistik anzeigen
  1. 1 1
      .gitignore
  2. 9 12
      examples/dev/Dashboard.html
  3. 70 0
      examples/dev/Dashboard.js
  4. 25 0
      examples/dev/DragDrop.html
  5. 27 0
      examples/dev/DragDrop.js
  6. 8 0
      examples/dev/index.js
  7. 0 68
      examples/dev/main.js
  8. 0 0
      examples/dev/output/.empty
  9. 6 6
      examples/dev/package.json
  10. 45 70
      package-lock.json
  11. 1 1
      package.json
  12. 0 1
      packages/@uppy/dashboard/package.json
  13. 2 1
      packages/@uppy/dashboard/src/index.js
  14. 0 1
      packages/@uppy/drag-drop/package.json
  15. 86 62
      packages/@uppy/drag-drop/src/index.js
  16. 6 13
      packages/@uppy/drag-drop/src/style.scss
  17. 22 0
      packages/@uppy/utils/src/isDragDropSupported.js
  18. 4 0
      packages/@uppy/utils/types/index.d.ts

+ 1 - 1
.gitignore
Datei anzeigen 

@@ -26,7 +26,7 @@ uppy-*.tgz
 
 .eslintcache
 
 .cache
 
 
-output/*
 
+**/output/*
 
 !output/.keep
 
 examples/dev/file.txt
 
 issues.txt

+ 9 - 12
examples/dev/index.html → examples/dev/Dashboard.html
Datei anzeigen 

@@ -3,9 +3,7 @@
 
   <head>
 
     <meta charset="utf-8">
 
     <meta name="viewport" content="width=device-width, initial-scale=1">
 
-    <title>uppy</title>
 
-  </head>
 
-  <body>
 
+    <title>Dashboard</title>
 
     <style>
 
       main {
 
         padding-top: 100px;
 
@@ -18,10 +16,6 @@
 
         margin: auto;
 
       }
 
 
-      a {
 
-        color: purple;
 
-      }
 
-
 
       button,
 
       input {
 
         color: green;
 
@@ -30,21 +24,24 @@
 
         border: 2px solid purple;
 
       }
 
 
+      /* css to make sure that Dashboard's css overrides page css */
 
       ul {
 
         margin: 60px;
 
       }
 
-
 
       li {
 
         margin: 60px;
 
       }
 
-
 
-      .foo a {
 
+      a {
 
         color: purple;
 
       }
 
     </style>
 
+  </head>
 
+
 
+  <body>
 
     <main class="foo">
 
-      <h1>Uppy is here</h1>
 
+      <h1>Dashboard is here</h1>
 
 
+      <!-- some inputs in a form to check focus management in Dashboard -->
 
       <form id="upload-form" action="/">
 
         <button type="button" id="pick-files">Pick Files</button><br>
 
         True ? <input type="checkbox" name="check_test" value="1" checked><br>
 
@@ -55,6 +52,6 @@
 
     </main>
 
 
     <link href="uppy.min.css" rel="stylesheet">
 
-    <script src="bundle.js"></script>
 
+    <script src="output/index.js"></script>
 
   </body>
 
 </html>

+ 70 - 0
examples/dev/Dashboard.js
Datei anzeigen 

@@ -0,0 +1,70 @@
 
+const Uppy = require('@uppy/core/src')
 
+const Dashboard = require('@uppy/dashboard/src')
 
+const Instagram = require('@uppy/instagram/src')
 
+const Dropbox = require('@uppy/dropbox/src')
 
+const GoogleDrive = require('@uppy/google-drive/src')
 
+const Url = require('@uppy/url/src')
 
+const Webcam = require('@uppy/webcam/src')
 
+const Tus = require('@uppy/tus/src')
 
+// const XHRUpload = require('@uppy/xhr-upload/src')
 
+const Form = require('@uppy/form/src')
 
+
 
+const TUS_ENDPOINT = 'https://master.tus.io/files/'
 
+// const XHR_ENDPOINT = 'https://api2.transloadit.com'
 
+
 
+module.exports = () => {
 
+  const uppyDashboard = Uppy({
 
+    debug: true,
 
+    meta: {
 
+      username: 'John',
 
+      license: 'Creative Commons'
 
+    }
 
+  })
 
+    .use(Dashboard, {
 
+      trigger: '#pick-files',
 
+      // inline: true,
 
+      target: '.foo',
 
+      metaFields: [
 
+        { id: 'license', name: 'License', placeholder: 'specify license' },
 
+        { id: 'caption', name: 'Caption', placeholder: 'add caption' }
 
+      ],
 
+      showProgressDetails: true,
 
+      proudlyDisplayPoweredByUppy: true,
 
+      note: '2 files, images and video only'
 
+    })
 
+    .use(GoogleDrive, { target: Dashboard, companionUrl: 'http://localhost:3020' })
 
+    .use(Instagram, { target: Dashboard, companionUrl: 'http://localhost:3020' })
 
+    .use(Dropbox, { target: Dashboard, companionUrl: 'http://localhost:3020' })
 
+    .use(Url, { target: Dashboard, companionUrl: 'http://localhost:3020' })
 
+    .use(Webcam, { target: Dashboard })
 
+    .use(Tus, { endpoint: TUS_ENDPOINT })
 
+    // .use(XHRUpload, { endpoint: XHR_ENDPOINT })
 
+    .use(Form, { target: '#upload-form' })
 
+    // .use(GoldenRetriever, {serviceWorker: true})
 
+
 
+  uppyDashboard.on('complete', (result) => {
 
+    if (result.failed.length === 0) {
 
+      console.log('Upload successful 😀')
 
+    } else {
 
+      console.warn('Upload failed 😞')
 
+    }
 
+    console.log('successful files:', result.successful)
 
+    console.log('failed files:', result.failed)
 
+  })
 
+
 
+  const modalTrigger = document.querySelector('#pick-files')
 
+  if (modalTrigger) modalTrigger.click()
 
+
 
+  /* eslint-disable compat/compat */
 
+  if ('serviceWorker' in navigator) {
 
+    navigator.serviceWorker
 
+      .register('/sw.js')
 
+      .then((registration) => {
 
+        console.log('ServiceWorker registration successful with scope: ', registration.scope)
 
+      })
 
+      .catch((error) => {
 
+        console.log('Registration failed with ' + error)
 
+      })
 
+  }
 
+  /* eslint-enable */
 
+}

+ 25 - 0
examples/dev/DragDrop.html
Datei anzeigen 

@@ -0,0 +1,25 @@
 
+<!DOCTYPE html>
 
+<html>
 
+  <head>
 
+    <meta charset="utf-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1">
 
+    <title>Drag-Drop</title>
 
+  </head>
 
+  <body>
 
+    <style>
 
+      main {
 
+        text-align: center;
 
+        margin: 20px auto;
 
+        width: 400px;
 
+      }
 
+    </style>
 
+    <main class="foo">
 
+      <h1>Drag-drop is here</h1>
 
+      <div id="uppyDragDrop"></div>
 
+      <div id="uppyDragDrop-progress"></div>
 
+    </main>
 
+
 
+    <link href="uppy.min.css" rel="stylesheet">
 
+    <script src="output/index.js"></script>
 
+  </body>
 
+</html>

+ 27 - 0
examples/dev/DragDrop.js
Datei anzeigen 

@@ -0,0 +1,27 @@
 
+const Uppy = require('@uppy/core/src')
 
+const Tus = require('@uppy/tus/src')
 
+
 
+const DragDrop = require('@uppy/drag-drop/src')
 
+const ProgressBar = require('@uppy/progress-bar/src')
 
+
 
+module.exports = () => {
 
+  const uppyDragDrop = Uppy({
 
+    debug: true,
 
+    autoProceed: true
 
+  })
 
+    .use(DragDrop, {
 
+      target: '#uppyDragDrop'
 
+    })
 
+    .use(ProgressBar, { target: '#uppyDragDrop-progress', hideAfterFinish: false })
 
+    .use(Tus, { endpoint: 'https://master.tus.io/files/' })
 
+
 
+  uppyDragDrop.on('complete', (result) => {
 
+    if (result.failed.length === 0) {
 
+      console.log('Upload successful 😀')
 
+    } else {
 
+      console.warn('Upload failed 😞')
 
+    }
 
+    console.log('successful files:', result.successful)
 
+    console.log('failed files:', result.failed)
 
+  })
 
+}

+ 8 - 0
examples/dev/index.js
Datei anzeigen 

@@ -0,0 +1,8 @@
 
+const DragDrop = require('./DragDrop.js')
 
+const Dashboard = require('./Dashboard.js')
 
+
 
+switch (window.location.pathname.toLowerCase()) {
 
+  case '/':
 
+  case '/dashboard.html': Dashboard(); break
 
+  case '/dragdrop.html': DragDrop(); break
 
+}

+ 0 - 68
examples/dev/main.js
Datei anzeigen 

@@ -1,68 +0,0 @@
 
-const Uppy = require('./../../packages/@uppy/core/src')
 
-const Dashboard = require('./../../packages/@uppy/dashboard/src')
 
-const Instagram = require('./../../packages/@uppy/instagram/src')
 
-const Dropbox = require('./../../packages/@uppy/dropbox/src')
 
-const GoogleDrive = require('./../../packages/@uppy/google-drive/src')
 
-const Url = require('./../../packages/@uppy/url/src')
 
-const Webcam = require('./../../packages/@uppy/webcam/src')
 
-const Tus = require('./../../packages/@uppy/tus/src')
 
-// const XHRUpload = require('./../../packages/@uppy/xhr-upload/src')
 
-const Form = require('./../../packages/@uppy/form/src')
 
-
 
-const TUS_ENDPOINT = 'https://master.tus.io/files/'
 
-// const XHR_ENDPOINT = 'https://api2.transloadit.com'
 
-
 
-const uppy = Uppy({
 
-  debug: true,
 
-  meta: {
 
-    username: 'John',
 
-    license: 'Creative Commons'
 
-  }
 
-})
 
-  .use(Dashboard, {
 
-    trigger: '#pick-files',
 
-    // inline: true,
 
-    target: '.foo',
 
-    metaFields: [
 
-      { id: 'license', name: 'License', placeholder: 'specify license' },
 
-      { id: 'caption', name: 'Caption', placeholder: 'add caption' }
 
-    ],
 
-    showProgressDetails: true,
 
-    proudlyDisplayPoweredByUppy: true,
 
-    note: '2 files, images and video only'
 
-  })
 
-  .use(GoogleDrive, { target: Dashboard, companionUrl: 'http://localhost:3020' })
 
-  .use(Instagram, { target: Dashboard, companionUrl: 'http://localhost:3020' })
 
-  .use(Dropbox, { target: Dashboard, companionUrl: 'http://localhost:3020' })
 
-  .use(Url, { target: Dashboard, companionUrl: 'http://localhost:3020' })
 
-  .use(Webcam, { target: Dashboard })
 
-  .use(Tus, { endpoint: TUS_ENDPOINT })
 
-  // .use(XHRUpload, { endpoint: XHR_ENDPOINT })
 
-  .use(Form, { target: '#upload-form' })
 
-  // .use(GoldenRetriever, {serviceWorker: true})
 
-
 
-uppy.on('complete', (result) => {
 
-  if (result.failed.length === 0) {
 
-    console.log('Upload successful 😀')
 
-  } else {
 
-    console.warn('Upload failed 😞')
 
-  }
 
-  console.log('successful files:', result.successful)
 
-  console.log('failed files:', result.failed)
 
-})
 
-
 
-/* eslint-disable compat/compat */
 
-if ('serviceWorker' in navigator) {
 
-  navigator.serviceWorker
 
-    .register('/sw.js')
 
-    .then((registration) => {
 
-      console.log('ServiceWorker registration successful with scope: ', registration.scope)
 
-    })
 
-    .catch((error) => {
 
-      console.log('Registration failed with ' + error)
 
-    })
 
-}
 
-/* eslint-enable */
 
-
 
-var modalTrigger = document.querySelector('#pick-files')
 
-if (modalTrigger) modalTrigger.click()

+ 0 - 0
examples/dev/output/.empty
Datei anzeigen


+ 6 - 6
examples/dev/package.json
Datei anzeigen 

@@ -1,10 +1,5 @@
 
 {
 
   "name": "uppy-dev-example",
 
-  "aliasify": {
 
-    "aliases": {
 
-      "@uppy": "../../packages/@uppy"
 
-    }
 
-  },
 
   "dependencies": {
 
     "@babel/core": "^7.4.4",
 
     "aliasify": "^2.1.0",
 
@@ -13,6 +8,11 @@
 
   },
 
   "private": true,
 
   "scripts": {
 
-    "watch:sandbox": "watchify -vd -t [ babelify --cwd ../../ ] -g aliasify main.js -o bundle.js"
 
+    "watch:sandbox": "watchify -vd -t [ babelify --cwd ../../ ] -g aliasify index.js -o output/index.js"
 
+  },
 
+  "aliasify": {
 
+    "aliases": {
 
+      "@uppy": "../../packages/@uppy"
 
+    }
 
   }
 
 }

+ 45 - 70
package-lock.json
Datei anzeigen 

@@ -6073,11 +6073,6 @@
 
       "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.5.tgz",
 
       "integrity": "sha512-gaqbzQPqOoamawKg0LGVd7SzLgXS+JH61oWprSLH+P+abTczqJbhTR8CmJ2u9/bUYNmHTGJx/UEmn6doAvvuig=="
 
     },
 
-    "blob-to-buffer": {
 
-      "version": "1.2.8",
 
-      "resolved": "https://registry.npmjs.org/blob-to-buffer/-/blob-to-buffer-1.2.8.tgz",
 
-      "integrity": "sha512-re0AIxakF504MgeMtIyJkVcZ8T5aUxtp/QmTMlmjyb3P44E1BEv5x3LATBGApWAJATyXHtkXRD+gWTmeyYLiQA=="
 
-    },
 
     "block-stream": {
 
       "version": "0.0.9",
 
       "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz",
 
@@ -10024,16 +10019,6 @@
 
       "resolved": "https://registry.npmjs.org/double-ended-queue/-/double-ended-queue-2.1.0-0.tgz",
 
       "integrity": "sha1-ED01J/0xUo9AGIEwyEHv3XgmTlw="
 
     },
 
-    "drag-drop": {
 
-      "version": "2.13.3",
 
-      "resolved": "https://registry.npmjs.org/drag-drop/-/drag-drop-2.13.3.tgz",
 
-      "integrity": "sha512-g+qp+ssi6+v9Qnyyco0dfyA9sYZYYDddGbc0STdMHc9hfyHeYzqGs4v18jFksgHDtYBWf+ocnUkO6jF7MbFudg==",
 
-      "requires": {
 
-        "blob-to-buffer": "^1.0.2",
 
-        "flatten": "^1.0.2",
 
-        "run-parallel": "^1.0.0"
 
-      }
 
-    },
 
     "dtrace-provider": {
 
       "version": "0.8.7",
 
       "resolved": "https://registry.npmjs.org/dtrace-provider/-/dtrace-provider-0.8.7.tgz",
 
@@ -12590,11 +12575,6 @@
 
       "integrity": "sha512-R+H8IZclI8AAkSBRQJLVOsxwAoHd6WC40b4QTNWIjzAa6BXOBfQcM587MXDTVPeYaopFNWHUFLx7eNmHDSxMWg==",
 
       "dev": true
 
     },
 
-    "flatten": {
 
-      "version": "1.0.2",
 
-      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
 
-      "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
 
-    },
 
     "flush-write-stream": {
 
       "version": "1.1.1",
 
       "resolved": "https://registry.npmjs.org/flush-write-stream/-/flush-write-stream-1.1.1.tgz",
 
@@ -12831,21 +12811,21 @@
 
       "dependencies": {
 
         "abbrev": {
 
           "version": "1.1.1",
 
-          "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz",
 
+          "resolved": false,
 
           "integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "ansi-regex": {
 
           "version": "2.1.1",
 
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "aproba": {
 
           "version": "1.2.0",
 
-          "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz",
 
+          "resolved": false,
 
           "integrity": "sha512-Y9J6ZjXtoYh8RnXVCMOU/ttDmk1aBjunq9vO0ta5x85WDQiQfUF9sIPBITdbiiIVcBo03Hi3jMxigBtsddlXRw==",
 
           "dev": true,
 
           "optional": true
 
@@ -12863,14 +12843,14 @@
 
         },
 
         "balanced-match": {
 
           "version": "1.0.0",
 
-          "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "brace-expansion": {
 
           "version": "1.1.11",
 
-          "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
 
+          "resolved": false,
 
           "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
 
           "dev": true,
 
           "optional": true,
 
@@ -12881,28 +12861,28 @@
 
         },
 
         "code-point-at": {
 
           "version": "1.1.0",
 
-          "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "concat-map": {
 
           "version": "0.0.1",
 
-          "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "console-control-strings": {
 
           "version": "1.1.0",
 
-          "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "core-util-is": {
 
           "version": "1.0.2",
 
-          "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
 
           "dev": true,
 
           "optional": true
 
@@ -12926,28 +12906,28 @@
 
         },
 
         "delegates": {
 
           "version": "1.0.0",
 
-          "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "detect-libc": {
 
           "version": "1.0.3",
 
-          "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-+hN8S9aY7fVc1c0CrFWfkaTEups=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "fs.realpath": {
 
           "version": "1.0.0",
 
-          "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "gauge": {
 
           "version": "2.7.4",
 
-          "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c=",
 
           "dev": true,
 
           "optional": true,
 
@@ -12979,7 +12959,7 @@
 
         },
 
         "has-unicode": {
 
           "version": "2.0.1",
 
-          "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-4Ob+aijPUROIVeCG0Wkedx3iqLk=",
 
           "dev": true,
 
           "optional": true
 
@@ -12996,7 +12976,7 @@
 
         },
 
         "ignore-walk": {
 
           "version": "3.0.1",
 
-          "resolved": "https://registry.npmjs.org/ignore-walk/-/ignore-walk-3.0.1.tgz",
 
+          "resolved": false,
 
           "integrity": "sha512-DTVlMx3IYPe0/JJcYP7Gxg7ttZZu3IInhuEhbchuqneY9wWe5Ojy2mXLBaQFUQmo0AW2r3qG7m1mg86js+gnlQ==",
 
           "dev": true,
 
           "optional": true,
 
@@ -13006,7 +12986,7 @@
 
         },
 
         "inflight": {
 
           "version": "1.0.6",
 
-          "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
 
           "dev": true,
 
           "optional": true,
 
@@ -13017,21 +12997,21 @@
 
         },
 
         "inherits": {
 
           "version": "2.0.3",
 
-          "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "ini": {
 
           "version": "1.3.5",
 
-          "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz",
 
+          "resolved": false,
 
           "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "is-fullwidth-code-point": {
 
           "version": "1.0.0",
 
-          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
 
           "dev": true,
 
           "optional": true,
 
@@ -13041,14 +13021,14 @@
 
         },
 
         "isarray": {
 
           "version": "1.0.0",
 
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "minimatch": {
 
           "version": "3.0.4",
 
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
 
+          "resolved": false,
 
           "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
 
           "dev": true,
 
           "optional": true,
 
@@ -13058,14 +13038,14 @@
 
         },
 
         "minimist": {
 
           "version": "0.0.8",
 
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "mkdirp": {
 
           "version": "0.5.1",
 
-          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
 
           "dev": true,
 
           "optional": true,
 
@@ -13113,7 +13093,7 @@
 
         },
 
         "nopt": {
 
           "version": "4.0.1",
 
-          "resolved": "https://registry.npmjs.org/nopt/-/nopt-4.0.1.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-0NRoWv1UFRk8jHUFYC0NF81kR00=",
 
           "dev": true,
 
           "optional": true,
 
@@ -13142,7 +13122,7 @@
 
         },
 
         "npmlog": {
 
           "version": "4.1.2",
 
-          "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz",
 
+          "resolved": false,
 
           "integrity": "sha512-2uUqazuKlTaSI/dC8AzicUck7+IrEaOnN/e0jd3Xtt1KcGpwx30v50mL7oPyr/h9bL3E4aZccVwpwP+5W9Vjkg==",
 
           "dev": true,
 
           "optional": true,
 
@@ -13155,21 +13135,21 @@
 
         },
 
         "number-is-nan": {
 
           "version": "1.0.1",
 
-          "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "object-assign": {
 
           "version": "4.1.1",
 
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "once": {
 
           "version": "1.4.0",
 
-          "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
 
           "dev": true,
 
           "optional": true,
 
@@ -13179,21 +13159,21 @@
 
         },
 
         "os-homedir": {
 
           "version": "1.0.2",
 
-          "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "os-tmpdir": {
 
           "version": "1.0.2",
 
-          "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "osenv": {
 
           "version": "0.1.5",
 
-          "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.5.tgz",
 
+          "resolved": false,
 
           "integrity": "sha512-0CWcCECdMVc2Rw3U5w9ZjqX6ga6ubk1xDVKxtBQPK7wis/0F2r9T6k4ydGYhecl7YUBxBVxhL5oisPsNxAPe2g==",
 
           "dev": true,
 
           "optional": true,
 
@@ -13204,14 +13184,14 @@
 
         },
 
         "path-is-absolute": {
 
           "version": "1.0.1",
 
-          "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "process-nextick-args": {
 
           "version": "2.0.0",
 
-          "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.0.tgz",
 
+          "resolved": false,
 
           "integrity": "sha512-MtEC1TqN0EU5nephaJ4rAtThHtC86dNN9qCuEhtshvpVBkAW5ZO7BASN9REnF9eoXGcRub+pFuKEpOHE+HbEMw==",
 
           "dev": true,
 
           "optional": true
 
@@ -13231,7 +13211,7 @@
 
           "dependencies": {
 
             "minimist": {
 
               "version": "1.2.0",
 
-              "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
 
+              "resolved": false,
 
               "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
 
               "dev": true,
 
               "optional": true
 
@@ -13240,7 +13220,7 @@
 
         },
 
         "readable-stream": {
 
           "version": "2.3.6",
 
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
 
+          "resolved": false,
 
           "integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==",
 
           "dev": true,
 
           "optional": true,
 
@@ -13273,14 +13253,14 @@
 
         },
 
         "safer-buffer": {
 
           "version": "2.1.2",
 
-          "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
 
+          "resolved": false,
 
           "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "sax": {
 
           "version": "1.2.4",
 
-          "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
 
+          "resolved": false,
 
           "integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==",
 
           "dev": true,
 
           "optional": true
 
@@ -13294,21 +13274,21 @@
 
         },
 
         "set-blocking": {
 
           "version": "2.0.0",
 
-          "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "signal-exit": {
 
           "version": "3.0.2",
 
-          "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0=",
 
           "dev": true,
 
           "optional": true
 
         },
 
         "string-width": {
 
           "version": "1.0.2",
 
-          "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
 
           "dev": true,
 
           "optional": true,
 
@@ -13320,7 +13300,7 @@
 
         },
 
         "string_decoder": {
 
           "version": "1.1.1",
 
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
 
+          "resolved": false,
 
           "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
 
           "dev": true,
 
           "optional": true,
 
@@ -13330,7 +13310,7 @@
 
         },
 
         "strip-ansi": {
 
           "version": "3.0.1",
 
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
 
           "dev": true,
 
           "optional": true,
 
@@ -13340,7 +13320,7 @@
 
         },
 
         "strip-json-comments": {
 
           "version": "2.0.1",
 
-          "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-PFMZQukIwml8DsNEhYwobHygpgo=",
 
           "dev": true,
 
           "optional": true
 
@@ -13372,7 +13352,7 @@
 
         },
 
         "util-deprecate": {
 
           "version": "1.0.2",
 
-          "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
 
           "dev": true,
 
           "optional": true
 
@@ -13389,7 +13369,7 @@
 
         },
 
         "wrappy": {
 
           "version": "1.0.2",
 
-          "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
 
+          "resolved": false,
 
           "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
 
           "dev": true,
 
           "optional": true
 
@@ -23846,11 +23826,6 @@
 
         "is-promise": "^2.1.0"
 
       }
 
     },
 
-    "run-parallel": {
 
-      "version": "1.1.9",
 
-      "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.1.9.tgz",
 
-      "integrity": "sha512-DEqnSRTDw/Tc3FXf49zedI638Z9onwUotBMiUFKmrO2sdFKIbXamXGQ3Axd4qgphxKB4kw/qP1w5kTxnfU1B9Q=="
 
-    },
 
     "run-queue": {
 
       "version": "1.0.3",
 
       "resolved": "https://registry.npmjs.org/run-queue/-/run-queue-1.0.3.tgz",

+ 1 - 1
package.json
Datei anzeigen 

@@ -95,7 +95,7 @@
 
     "build": "npm-run-all --parallel build:js build:css --serial size",
 
     "contributors:fetch": "bash -c 'githubcontrib --owner transloadit --repo uppy --cols 6 $([ \"${GITHUB_TOKEN:-}\" = \"\" ] && echo \"\" || echo \"--authToken ${GITHUB_TOKEN:-}\") --showlogin true --sortOrder desc'",
 
     "contributors:save": "bash -c 'replace-x -m \"<!--contributors-->[\\s\\S]+<!--/contributors-->\" \"<!--contributors-->\n## Contributors\n\n$(npm run --silent contributors:fetch)\n<!--/contributors-->\" README.md'",
 
-    "dev:browsersync": "browser-sync start --no-open --no-ghost-mode false --server examples/dev --port 3452 --serveStatic packages/uppy/dist --files \"examples/dev/bundle.js, packages/uppy/dist/uppy.min.css, packages/uppy/lib/**/*\"",
 
+    "dev:browsersync": "browser-sync start --no-open --no-ghost-mode false --server examples/dev --index Dashboard.html --port 3452 --serveStatic packages/uppy/dist --files \"examples/dev/output/*.js, packages/uppy/dist/uppy.min.css, packages/uppy/lib/**/*\"",
 
     "dev:watch-sandbox": "cd examples/dev && npm run watch:sandbox",
 
     "dev:with-companion": "npm-run-all --parallel start:companion dev:watch-sandbox watch:js:lib watch:css dev:browsersync",
 
     "dev": "npm-run-all --parallel dev:watch-sandbox watch:js:lib watch:css dev:browsersync",

+ 0 - 1
packages/@uppy/dashboard/package.json
Datei anzeigen 

@@ -29,7 +29,6 @@
 
     "@uppy/utils": "1.0.2",
 
     "classnames": "^2.2.6",
 
     "cuid": "^2.1.1",
 
-    "drag-drop": "2.13.3",
 
     "lodash.throttle": "^4.1.1",
 
     "preact": "8.2.9",
 
     "preact-css-transition-group": "^1.3.0",

+ 2 - 1
packages/@uppy/dashboard/src/index.js
Datei anzeigen 

@@ -818,7 +818,8 @@ module.exports = class Dashboard extends Plugin {
 
       metaFields: this.opts.metaFields,
 
       targets: [],
 
       // We'll make them visible once .containerWidth is determined
 
-      areInsidesReadyToBeVisible: false
 
+      areInsidesReadyToBeVisible: false,
 
+      isDraggingOver: false
 
     })
 
 
     const { inline, closeAfterFinish } = this.opts

+ 0 - 1
packages/@uppy/drag-drop/package.json
Datei anzeigen 

@@ -26,7 +26,6 @@
 
   },
 
   "dependencies": {
 
     "@uppy/utils": "1.0.2",
 
-    "drag-drop": "2.13.3",
 
     "preact": "8.2.9"
 
   },
 
   "devDependencies": {

+ 86 - 62
packages/@uppy/drag-drop/src/index.js
Datei anzeigen 

@@ -1,7 +1,8 @@
 
 const { Plugin } = require('@uppy/core')
 
 const Translator = require('@uppy/utils/lib/Translator')
 
 const toArray = require('@uppy/utils/lib/toArray')
 
-const dragDrop = require('drag-drop')
 
+const isDragDropSupported = require('@uppy/utils/lib/isDragDropSupported')
 
+const getDroppedFiles = require('@uppy/utils/lib/getDroppedFiles')
 
 const { h } = require('preact')
 
 
 /**
 
@@ -35,7 +36,8 @@ module.exports = class DragDrop extends Plugin {
 
     this.opts = Object.assign({}, defaultOpts, opts)
 
 
     // Check for browser dragDrop support
 
-    this.isDragDropSupported = this.checkDragDropSupport()
 
+    this.isDragDropSupported = isDragDropSupported()
 
+    this.removeDragOverClassTimeout = null
 
 
     // i18n
 
     this.translator = new Translator([ this.defaultLocale, this.uppy.locale, this.opts.locale ])
 
@@ -43,68 +45,35 @@ module.exports = class DragDrop extends Plugin {
 
     this.i18nArray = this.translator.translateArray.bind(this.translator)
 
 
     // Bind `this` to class methods
 
-    this.handleDrop = this.handleDrop.bind(this)
 
     this.handleInputChange = this.handleInputChange.bind(this)
 
-    this.checkDragDropSupport = this.checkDragDropSupport.bind(this)
 
+    this.handleDragOver = this.handleDragOver.bind(this)
 
+    this.handleDragLeave = this.handleDragLeave.bind(this)
 
+    this.handleDrop = this.handleDrop.bind(this)
 
+    this.handlePaste = this.handlePaste.bind(this)
 
+    this.addFile = this.addFile.bind(this)
 
     this.render = this.render.bind(this)
 
   }
 
 
-  /**
 
-   * Checks if the browser supports Drag & Drop (not supported on mobile devices, for example).
 
-   * @return {Boolean}
 
-   */
 
-  checkDragDropSupport () {
 
-    const div = document.createElement('div')
 
-
 
-    if (!('draggable' in div) || !('ondragstart' in div && 'ondrop' in div)) {
 
-      return false
 
-    }
 
-
 
-    if (!('FormData' in window)) {
 
-      return false
 
-    }
 
-
 
-    if (!('FileReader' in window)) {
 
-      return false
 
+  addFile (file) {
 
+    try {
 
+      this.uppy.addFile({
 
+        source: this.id,
 
+        name: file.name,
 
+        type: file.type,
 
+        data: file,
 
+        meta: {
 
+          relativePath: file.relativePath || null
 
+        }
 
+      })
 
+    } catch (err) {
 
+      // Nothing, restriction errors handled in Core
 
     }
 
-
 
-    return true
 
-  }
 
-
 
-  handleDrop (files) {
 
-    this.uppy.log('[DragDrop] Files dropped')
 
-
 
-    files.forEach((file) => {
 
-      try {
 
-        this.uppy.addFile({
 
-          source: this.id,
 
-          name: file.name,
 
-          type: file.type,
 
-          data: file
 
-        })
 
-      } catch (err) {
 
-        // Nothing, restriction errors handled in Core
 
-      }
 
-    })
 
   }
 
 
   handleInputChange (event) {
 
     this.uppy.log('[DragDrop] Files selected through input')
 
-
 
     const files = toArray(event.target.files)
 
-
 
-    files.forEach((file) => {
 
-      try {
 
-        this.uppy.addFile({
 
-          source: this.id,
 
-          name: file.name,
 
-          type: file.type,
 
-          data: file
 
-        })
 
-      } catch (err) {
 
-        // Nothing, restriction errors handled in Core
 
-      }
 
-    })
 
+    files.forEach(this.addFile)
 
 
     // We clear the input after a file is selected, because otherwise
 
     // change event is not fired in Chrome and Safari when a file
 
@@ -115,6 +84,49 @@ module.exports = class DragDrop extends Plugin {
 
     event.target.value = null
 
   }
 
 
+  handlePaste (event) {
 
+    this.uppy.log('[DragDrop] Files were pasted')
 
+    const files = toArray(event.clipboardData.files)
 
+    files.forEach(this.addFile)
 
+  }
 
+
 
+  handleDrop (event, dropCategory) {
 
+    event.preventDefault()
 
+    event.stopPropagation()
 
+    clearTimeout(this.removeDragOverClassTimeout)
 
+    // 1. Add a small (+) icon on drop
 
+    event.dataTransfer.dropEffect = 'copy'
 
+
 
+    // 2. Remove dragover class
 
+    this.setPluginState({ isDraggingOver: false })
 
+
 
+    // 3. Add all dropped files
 
+    this.uppy.log('[DragDrop] File were dropped')
 
+    getDroppedFiles(event.dataTransfer)
 
+      .then((files) => {
 
+        files.forEach(this.addFile)
 
+      })
 
+  }
 
+
 
+  handleDragOver (event) {
 
+    event.preventDefault()
 
+    event.stopPropagation()
 
+
 
+    clearTimeout(this.removeDragOverClassTimeout)
 
+    this.setPluginState({ isDraggingOver: true })
 
+  }
 
+
 
+  handleDragLeave (event) {
 
+    event.preventDefault()
 
+    event.stopPropagation()
 
+
 
+    clearTimeout(this.removeDragOverClassTimeout)
 
+    // Timeout against flickering, this solution is taken from drag-drop library. Solution with 'pointer-events: none' didn't work across browsers.
 
+    this.removeDragOverClassTimeout = setTimeout(() => {
 
+      this.setPluginState({ isDraggingOver: false })
 
+    }, 50)
 
+  }
 
+
 
   render (state) {
 
     /* http://tympanus.net/codrops/2015/09/15/styling-customizing-file-inputs-smart-way/ */
 
     const hiddenInputStyle = {
 
@@ -125,18 +137,32 @@ module.exports = class DragDrop extends Plugin {
 
       position: 'absolute',
 
       zIndex: -1
 
     }
 
-    const DragDropClass = `uppy-Root uppy-DragDrop-container ${this.isDragDropSupported ? 'uppy-DragDrop--is-dragdrop-supported' : ''}`
 
-    const DragDropStyle = {
 
+
 
+    const dragDropClass = `
 
+      uppy-Root
 
+      uppy-DragDrop-container
 
+      ${this.isDragDropSupported ? 'uppy-DragDrop--is-dragdrop-supported' : ''}
 
+      ${this.getPluginState().isDraggingOver ? 'uppy-DragDrop--isDraggingOver' : ''}
 
+    `
 
+
 
+    const dragDropStyle = {
 
       width: this.opts.width,
 
       height: this.opts.height
 
     }
 
+
 
     const restrictions = this.uppy.opts.restrictions
 
 
     // empty value="" on file input, so that the input is cleared after a file is selected,
 
     // because Uppy will be handling the upload and so we can select same file
 
     // after removing — otherwise browser thinks it’s already selected
 
     return (
 
-      <div class={DragDropClass} style={DragDropStyle}>
 
+      <div
 
+        class={dragDropClass}
 
+        style={dragDropStyle}
 
+        onDragOver={this.handleDragOver}
 
+        onDragLeave={this.handleDragLeave}
 
+        onDrop={this.handleDrop}
 
+        onPaste={this.handlePaste}>
 
         <div class="uppy-DragDrop-inner">
 
           <svg aria-hidden="true" class="UppyIcon uppy-DragDrop-arrow" width="16" height="16" viewBox="0 0 16 16">
 
             <path d="M11 10V0H5v10H2l6 6 6-6h-3zm0 0" fill-rule="evenodd" />
 
@@ -160,18 +186,16 @@ module.exports = class DragDrop extends Plugin {
 
   }
 
 
   install () {
 
+    this.setPluginState({
 
+      isDraggingOver: false
 
+    })
 
     const target = this.opts.target
 
     if (target) {
 
       this.mount(target, this)
 
     }
 
-    this.removeDragDropListener = dragDrop(this.el, (files) => {
 
-      this.handleDrop(files)
 
-      this.uppy.log(files)
 
-    })
 
   }
 
 
   uninstall () {
 
     this.unmount()
 
-    this.removeDragDropListener()
 
   }
 
 }

+ 6 - 13
packages/@uppy/drag-drop/src/style.scss
Datei anzeigen 

@@ -7,7 +7,6 @@
 
   justify-content: center;
 
   border-radius: 7px;
 
   background-color: $white;
 
-  // cursor: pointer;
 
 }
 
 
 .uppy-DragDrop-inner {
 
@@ -25,22 +24,16 @@
 
 }
 
 
   .uppy-DragDrop--is-dragdrop-supported {
 
-    border: 2px dashed;
 
-    border-color: lighten($gray-500, 10%);
 
+    border: 2px dashed lighten($gray-500, 10%);
 
   }
 
 
-  // .uppy-DragDrop-container.is-dragdrop-supported .uppy-DragDrop-dragText {
 
-  //   display: inline;
 
-  // }
 
-
 
-  .uppy-DragDrop-container.drag {
 
-    border-color: $gray-500;
 
-    background-color: darken($white, 10%);
 
-  }
 
-
 
-  .uppy-DragDrop-container.drag .uppy-DragDrop-arrow {
 
+.uppy-DragDrop--isDraggingOver{
 
+  border: 2px dashed $blue;
 
+  background: $gray-200;
 
+  .uppy-DragDrop-arrow {
 
     fill: $gray-500;
 
   }
 
+}
 
 
 .uppy-DragDrop-label {
 
   display: block;

+ 22 - 0
packages/@uppy/utils/src/isDragDropSupported.js
Datei anzeigen 

@@ -0,0 +1,22 @@
 
+/**
 
+ * Checks if the browser supports Drag & Drop (not supported on mobile devices, for example).
 
+ *
 
+ * @return {Boolean}
 
+ */
 
+module.exports = function isDragDropSupported () {
 
+  const div = document.createElement('div')
 
+
 
+  if (!('draggable' in div) || !('ondragstart' in div && 'ondrop' in div)) {
 
+    return false
 
+  }
 
+
 
+  if (!('FormData' in window)) {
 
+    return false
 
+  }
 
+
 
+  if (!('FileReader' in window)) {
 
+    return false
 
+  }
 
+
 
+  return true
 
+}

+ 4 - 0
packages/@uppy/utils/types/index.d.ts
Datei anzeigen 

@@ -93,6 +93,10 @@ declare module '@uppy/utils/lib/isObjectURL' {
 
   export default function isObjectURL(url: string): boolean;
 
 }
 
 
+declare module '@uppy/utils/lib/isDragDropSupported' {
 
+  export default function isDragDropSupported(): boolean;
 
+}
 
+
 
 declare module '@uppy/utils/lib/isPreviewSupported' {
 
   export default function isPreviewSupported(mime: string): boolean;
 
 }