DragDrop.js 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940
  1. // The @uppy/ dependencies are resolved from source
  2. /* eslint-disable import/no-extraneous-dependencies */
  3. import Uppy from '@uppy/core'
  4. import Tus from '@uppy/tus'
  5. import DragDrop from '@uppy/drag-drop'
  6. import ProgressBar from '@uppy/progress-bar'
  7. /* eslint-enable import/no-extraneous-dependencies */
  8. // DEV CONFIG: create a .env file in the project root directory to customize those values.
  9. const {
  10. VITE_TUS_ENDPOINT : TUS_ENDPOINT,
  11. } = import.meta.env
  12. import.meta.env.VITE_TRANSLOADIT_KEY &&= '***' // to avoid leaking secrets in screenshots.
  13. import.meta.env.VITE_TRANSLOADIT_SECRET &&= '***' // to avoid leaking secrets in screenshots.
  14. console.log(import.meta.env)
  15. export default () => {
  16. const uppyDragDrop = new Uppy({
  17. debug: true,
  18. autoProceed: true,
  19. })
  20. .use(DragDrop, {
  21. target: '#uppyDragDrop',
  22. })
  23. .use(ProgressBar, { target: '#uppyDragDrop-progress', hideAfterFinish: false })
  24. .use(Tus, { endpoint: TUS_ENDPOINT })
  25. window.uppy = uppyDragDrop
  26. uppyDragDrop.on('complete', (result) => {
  27. if (result.failed.length === 0) {
  28. console.log('Upload successful 😀')
  29. } else {
  30. console.warn('Upload failed 😞')
  31. }
  32. console.log('successful files:', result.successful)
  33. console.log('failed files:', result.failed)
  34. })
  35. }