Browse Source

restore: use private method :scream:

Renée Kooi 7 years ago
parent
commit
0fecd5c190
2 changed files with 76 additions and 35 deletions
  1. 74 34
      examples/bundled-example/main.js
  2. 2 1
      src/plugins/GoldenRetriever/index.js

+ 74 - 34
examples/bundled-example/main.js

@@ -3,19 +3,26 @@ const Dashboard = require('../../src/plugins/Dashboard')
 const GoogleDrive = require('../../src/plugins/GoogleDrive')
 const Dropbox = require('../../src/plugins/Dropbox')
 const Instagram = require('../../src/plugins/Instagram')
-const Webcam = require('../../src/plugins/Webcam')
+// const Webcam = require('../../src/plugins/Webcam')
 const Tus = require('../../src/plugins/Tus')
-// const XHRUpload = require('../../src/plugins/XHRUpload')
+const Transloadit = require('../../src/plugins/Transloadit')
+// const Multipart = require('../../src/plugins/Multipart')
 // const FileInput = require('../../src/plugins/FileInput')
 // const MetaData = require('../../src/plugins/MetaData')
 // const Informer = require('../../src/plugins/Informer')
 // const StatusBar = require('../../src/plugins/StatusBar')
 // const DragDrop = require('../../src/plugins/DragDrop')
-// const GoldenRetriever = require('../../src/plugins/GoldenRetriever')
+const GoldenRetriever = require('../../src/plugins/GoldenRetriever')
 
 const PROTOCOL = location.protocol === 'https:' ? 'https' : 'http'
 const TUS_ENDPOINT = PROTOCOL + '://master.tus.io/files/'
 
+console.warn(`
+
+  STARTING EXAMPLE!
+
+`)
+
 const uppy = Uppy({
   debug: true,
   autoProceed: false,
@@ -23,30 +30,9 @@ const uppy = Uppy({
     username: 'John',
     license: 'Creative Commons'
   }
-  // restrictions: {
-  //   maxFileSize: 300000,
-  //   maxNumberOfFiles: 10,
-  //   minNumberOfFiles: 2,
-  //   allowedFileTypes: ['image/*', 'video/*']
-  // }
-  // onBeforeFileAdded: (currentFile, files) => {
-  //   if (currentFile.name === 'pitercss-IMG_0616.jpg') {
-  //     return Promise.resolve()
-  //   }
-  //   return Promise.reject('this is not the file I was looking for')
-  // },
-  // onBeforeUpload: (files) => {
-  //   if (Object.keys(files).length < 2) {
-  //     return Promise.reject('too few files')
-  //   }
-  //   return Promise.resolve()
-  // }
 })
   .use(Dashboard, {
     trigger: '#uppyModalOpener',
-    target: '.MyForm',
-    // maxWidth: 350,
-    // maxHeight: 400,
     inline: false,
     disableStatusBar: false,
     disableInformer: false,
@@ -54,22 +40,33 @@ const uppy = Uppy({
     replaceTargetContent: false,
     hideUploadButton: false,
     closeModalOnClickOutside: false,
-    locale: {
-      strings: { browse: 'browse' }
-    },
     metaFields: [
-      { id: 'license', name: 'License', placeholder: 'specify license' },
-      { id: 'caption', name: 'Caption', placeholder: 'describe what the image is about' }
-    ]
-    // note: 'Images and video only, 300kb or less'
+      { id: 'license', name: 'License', value: 'Creative Commons', placeholder: 'specify license' },
+      { id: 'caption', name: 'Caption', value: 'none', placeholder: 'describe what the image is about' }
+    ],
+    locale: {
+      strings: {browse: 'browse'}
+    }
   })
   .use(GoogleDrive, {target: Dashboard, host: 'http://localhost:3020'})
   .use(Dropbox, {target: Dashboard, host: 'http://localhost:3020'})
   .use(Instagram, {target: Dashboard, host: 'http://localhost:3020'})
-  .use(Webcam, {target: Dashboard})
-  .use(Tus, {endpoint: TUS_ENDPOINT, resume: true})
-  // .use(GoldenRetriever, {serviceWorker: true})
+  // .use(Tus, { resume: false })
+  .use(require('../../src/plugins/XHRUpload'))
+  .use(require('../../src/plugins/AwsS3'), {
+    host: 'http://localhost:3020'
+  })
   .run()
+  .use(Transloadit, {
+    importFromUploadURLs: true,
+    // alwaysRunAssembly: true,
+    waitForEncoding: true,
+    params: {
+      auth: { key: '05a61ed019fe11e783fdbd1f56c73eb0' },
+      template_id: 'ff1fb8201b7211e7bbafa9a78f1dc173'
+    }
+  })
+  .use(GoldenRetriever, {})
 
 uppy.on('complete', ({ successful, failed }) => {
   if (failed.length === 0) {
@@ -79,6 +76,47 @@ uppy.on('complete', ({ successful, failed }) => {
   }
   console.log('successful files:', successful)
   console.log('failed files:', failed)
+  localStorage.savedResults = '[]'
+})
+
+const wrapper = document.createElement('div')
+const yo = require('yo-yo')
+function render () {
+  yo.update(wrapper, yo`
+    <div style="margin-top: 20px;">
+      <h1>Results (${results.length})</h1>
+      <div style="display: flex; justify-content: space-around; flex-wrap: wrap;">
+        ${results.map(ResultPreview)}
+      </div>
+    </div>
+  `)
+}
+
+function ResultPreview (result) {
+  if (result.type === 'image') {
+    return yo`<img class="UppyDemo-resultImg" src="${result.ssl_url}" />`
+  }
+  if (result.type === 'video') {
+    return yo`<video width="320" height="240" src="${result.ssl_url}" />`
+  }
+  if (result.type === 'audio') {
+    return yo`<audio width="320" height="52" src="${result.ssl_url}" />`
+  }
+
+  return ''
+}
+
+let results = []
+try {
+  results = JSON.parse(localStorage.savedResults)
+  render()
+} catch (err) {}
+
+uppy.on('transloadit:result', (stepName, result) => {
+  results.push({ ssl_url: result.ssl_url, type: result.type })
+  render()
+  localStorage.savedResults = JSON.stringify(results)
+>>>>>>> Stashed changes
 })
 
 if ('serviceWorker' in navigator) {
@@ -94,3 +132,5 @@ if ('serviceWorker' in navigator) {
 
 var modalTrigger = document.querySelector('#uppyModalOpener')
 if (modalTrigger) modalTrigger.click()
+
+document.body.appendChild(wrapper)

+ 2 - 1
src/plugins/GoldenRetriever/index.js

@@ -170,7 +170,8 @@ module.exports = class GoldenRetriever extends Plugin {
       files: updatedFiles
     })
     // Files have changed--make sure the progress is accurate.
-    this.uppy.calculateTotalProgress()
+    // TODO make uppy detect that this is necessary somehow?
+    this.uppy._calculateTotalProgress()
 
     this.uppy.emit('restored', this.savedPluginData)