فهرست منبع

Basic event emitter and progress event

Artur Paikin 9 سال پیش
والد
کامیت
436a176012
4فایلهای تغییر یافته به همراه17 افزوده شده و 8 حذف شده
  1. 1 0
      package.json
  2. 10 2
      src/core/Core.js
  3. 3 3
      src/plugins/DragDrop.js
  4. 3 3
      src/plugins/Tus10.js

+ 1 - 0
package.json

@@ -69,6 +69,7 @@
     "zuul": "3.7.2"
     "zuul": "3.7.2"
   },
   },
   "dependencies": {
   "dependencies": {
+    "event-emitter": "^0.3.4",
     "superagent": "1.5.0",
     "superagent": "1.5.0",
     "tus-js-client": "1.1.3"
     "tus-js-client": "1.1.3"
   }
   }

+ 10 - 2
src/core/Core.js

@@ -1,5 +1,6 @@
 import Utils from '../core/Utils'
 import Utils from '../core/Utils'
 import Translator from '../core/Translator'
 import Translator from '../core/Translator'
+import ee from 'event-emitter'
 
 
 /**
 /**
  * Main Uppy core
  * Main Uppy core
@@ -30,14 +31,21 @@ export default class Core {
     this.translator = new Translator({locale: this.opts.locale})
     this.translator = new Translator({locale: this.opts.locale})
     this.i18n = this.translator.translate.bind(this.translator)
     this.i18n = this.translator.translate.bind(this.translator)
     // console.log(this.i18n('filesChosen', {smart_count: 3}))
     // console.log(this.i18n('filesChosen', {smart_count: 3}))
+
+    // Set up an event EventEmitter
+    this.emitter = ee()
+
+    this.emitter.on('progress', data => {
+      console.log('до чего дошел прогресс: ' + data.percentage)
+    })
   }
   }
 
 
 /**
 /**
  * Registers a plugin with Core
  * Registers a plugin with Core
  *
  *
  * @param {Class} Plugin object
  * @param {Class} Plugin object
- * @param {object} options object that will be passed to Plugin later
- * @return {object} self for chaining
+ * @param {Object} options object that will be passed to Plugin later
+ * @return {Object} self for chaining
  */
  */
   use (Plugin, opts) {
   use (Plugin, opts) {
     // Instantiate
     // Instantiate

+ 3 - 3
src/plugins/DragDrop.js

@@ -24,7 +24,7 @@ export default class DragDrop extends Plugin {
     this.initHtml()
     this.initHtml()
 
 
     // bind `this` to class methods
     // bind `this` to class methods
-    this.listenForEvents = this.listenForEvents.bind(this)
+    this.initEvents = this.initEvents.bind(this)
     this.handleDrop = this.handleDrop.bind(this)
     this.handleDrop = this.handleDrop.bind(this)
     this.checkDragDropSupport = this.checkDragDropSupport.bind(this)
     this.checkDragDropSupport = this.checkDragDropSupport.bind(this)
     this.handleInputChange = this.handleInputChange.bind(this)
     this.handleInputChange = this.handleInputChange.bind(this)
@@ -79,7 +79,7 @@ export default class DragDrop extends Plugin {
     return true
     return true
   }
   }
 
 
-  listenForEvents () {
+  initEvents () {
     this.core.log(`waiting for some files to be dropped on ${this.opts.target}`)
     this.core.log(`waiting for some files to be dropped on ${this.opts.target}`)
     // console.log(`waiting for some files to be dropped on ${this.opts.target}`)
     // console.log(`waiting for some files to be dropped on ${this.opts.target}`)
 
 
@@ -162,6 +162,6 @@ export default class DragDrop extends Plugin {
       results: results
       results: results
     })
     })
 
 
-    return this.listenForEvents()
+    return this.initEvents()
   }
   }
 }
 }

+ 3 - 3
src/plugins/Tus10.js

@@ -70,9 +70,9 @@ export default class Tus10 extends Plugin {
         // self.setProgress(percentage, current, total)
         // self.setProgress(percentage, current, total)
 
 
         // Dispatch progress event
         // Dispatch progress event
-        const progressEvent = new CustomEvent('progress', {'detail': percentage})
-        const progressElement = document.querySelector(self.opts.progress)
-        progressElement.dispatchEvent(progressEvent)
+        self.core.emitter.emit('progress', {
+          percentage
+        })
         // self.setProgress(percentage)
         // self.setProgress(percentage)
       },
       },
       onSuccess: function () {
       onSuccess: function () {