Merge branch 'html5-feature-0.10' of https://github.com/alibaba/weex into html5-feature-0.10

Author: MrRaindrop

html5/render/browser/base/moduleEvent.js

@@ -0,0 +1,41 @@
+
+/**
+ * save the original listener for 'addEventListener'.
+ * this is the dipaching listener which is waiting for feed.
+ * map structure: moduleName -> eventName -> [handlers].
+ */
+const handlerMap = {}
+
+window.addEventListener('moduleevent', event => {
+  const dt = event.detail || {}
+  const module = dt.module
+  const type = dt.type
+  try {
+    handlerMap[module][type].forEach(handler => handler(dt))
+  }
+  catch (e) {
+    console.warn(`[h5-render] no such event ${type} for module ${module}.`)
+  }
+})
+
+export function addEventListener (module, evt, callbackId, options) {
+  const once = options && !!options.once
+  let moduleMap = handlerMap[module]
+  if (!moduleMap) {
+    moduleMap = handlerMap[module] = {}
+  }
+  let handlers = moduleMap[evt]
+  if (!handlers) {
+    handlers = moduleMap[evt] = []
+  }
+  handlers.push((data) => this.sender.performCallback(callbackId, data, !once))
+}
+
+export function removeAllEventListeners (module, evt) {
+  try {
+    delete handlerMap[module][evt]
+  }
+  catch (e) {
+    // do nothing.
+  }
+}

html5/render/browser/bridge/receiver.js

@@ -5,6 +5,21 @@ import protocol from './protocol'
 import { isArray } from '../utils'
 import Sender from './sender'
 
+// sync call native component method.
+function callNativeComponent (instanceId, ref, method, args, options) {
+  return processCall(instanceId, {
+    component: options.component,
+    ref,
+    method,
+    args
+  })
+}
+
+// sync call native module api.
+function callNativeModule (instanceId, module, method, args, options) {
+  return processCall(instanceId, { module, method, args })
+}
+
 // callNative: jsFramework will call this method to talk to
 // this renderer.
 // params:
@@ -35,7 +50,7 @@ function callNative (instanceId, tasks, callbackId) {
 
 function processCall (instanceId, call) {
   const isComponent = typeof call.module === 'undefined'
-  isComponent ? componentCall(instanceId, call) : moduleCall(instanceId, call)
+  const res = isComponent ? componentCall(instanceId, call) : moduleCall(instanceId, call)
 
   const callbackId = call.callbackId
   if ((callbackId
@@ -45,6 +60,9 @@ function processCall (instanceId, call) {
     && callbackId !== -1) {
     performNextTick(instanceId, callbackId)
   }
+
+  // for sync call.
+  return res
 }
 
 function moduleCall (instanceId, call) {
@@ -60,7 +78,7 @@ function moduleCall (instanceId, call) {
     return
   }
 
-  method.apply(global.weex.getInstance(instanceId), args)
+  return method.apply(global.weex.getInstance(instanceId), args)
 }
 
 function componentCall (instanceId, call) {
@@ -80,7 +98,7 @@ function componentCall (instanceId, call) {
     return console.error(`[h5-render] component ${componentName} doesn't have a method named ${methodName}.`)
   }
 
-  method.apply(elem, args)
+  return method.apply(elem, args)
 }
 
 function performNextTick (instanceId, callbackId) {
@@ -99,6 +117,8 @@ function nativeLog () {
 
 function exportsBridgeMethodsToGlobal () {
   global.callNative = callNative
+  global.callNativeComponent = callNativeComponent
+  global.callNativeModule = callNativeModule
   global.nativeLog = nativeLog
 }
 

html5/render/browser/render/index.js

@@ -15,6 +15,10 @@ const { framework, transformer } = subversion
 global.frameworkVersion = framework
 global.transformerVersion = transformer
 
+// init bridge.
+import { Sender, receiver } from '../bridge'
+receiver.init()
+
 // init frameworks
 import Listener from '../dom/componentManager'
 runtime.config.Document.Listener = Listener
@@ -34,7 +38,6 @@ for (const methodName in globalMethods) {
 import config from './config'
 import { load } from './loader'
 import * as utils from '../utils'
-import { Sender, receiver } from '../bridge'
 import Component from '../base/component'
 import Atomic from '../base/atomic'
 import ComponentManager from '../dom/componentManager'
@@ -126,7 +129,6 @@ export default function Weex (options) {
   })
 
   this.data = options.data
-  receiver.init(this)
   this.sender = new Sender(this)
 
   _weexInstance[this.instanceId] = this

html5/render/browser/render/register.js

@@ -2,6 +2,28 @@ import ComponentManager from '../dom/componentManager'
 import { registerLoader } from './loader'
 import { protocol } from '../bridge'
 import { extend } from '../utils'
+import { addEventListener, removeAllEventListeners } from '../base/moduleEvent'
+
+/**
+ * register module event listener for every api module except 'globalEvent'.
+ */
+function registerModuleEventListener (name, module, meta) {
+  if (name !== 'globalEvent') {
+    module['addEventListener'] = function (evt, callbackId, options) {
+      return addEventListener.call(this, name, evt, callbackId, options)
+    }
+    module['removeAllEventListeners'] = function (evt) {
+      return removeAllEventListeners.call(this, name, evt)
+    }
+    ; [{
+      name: 'addEventListener',
+      args: ['string', 'function', 'object']
+    }, {
+      name: 'removeAllEventListeners',
+      args: ['string']
+    }].forEach(info => meta[name].push(info))
+  }
+}
 
 const methods = {
   // Register a new component with the specified name.
@@ -13,6 +35,7 @@ const methods = {
   // If the module already exists, just add methods from the
   // new module to the old one.
   registerApiModule (name, module, meta) {
+    registerModuleEventListener(name, module, meta)
     if (!protocol.apiModule[name]) {
       protocol.apiModule[name] = module
     }