[09/50] [abbrv] incubator-weex git commit: * [html5] support scroll event & offset-accuracy attribute.

[so...@apache.org]

* [html5] support scroll event & offset-accuracy attribute.


Project: http://git-wip-us.apache.org/repos/asf/incubator-weex/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-weex/commit/f50fba86
Tree: http://git-wip-us.apache.org/repos/asf/incubator-weex/tree/f50fba86
Diff: http://git-wip-us.apache.org/repos/asf/incubator-weex/diff/f50fba86

Branch: refs/heads/0.12-dev
Commit: f50fba8647c8bb6ac522b1a4569a2a2269da1953
Parents: 36a71b1
Author: MrRaindrop <te...@gmail.com>
Authored: Thu Mar 23 11:37:05 2017 +0800
Committer: MrRaindrop <te...@gmail.com>
Committed: Thu Mar 23 11:37:05 2017 +0800

----------------------------------------------------------------------
 html5/render/vue/mixins/scrollable.js | 44 +++++++++++++++++++++++++++++-
 1 file changed, 43 insertions(+), 1 deletion(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/f50fba86/html5/render/vue/mixins/scrollable.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/mixins/scrollable.js b/html5/render/vue/mixins/scrollable.js
index c83b82f..a55273b 100644
--- a/html5/render/vue/mixins/scrollable.js
+++ b/html5/render/vue/mixins/scrollable.js
@@ -1,6 +1,47 @@
-import { getThrottleLazyload } from '../utils'
+import { getThrottleLazyload, throttle } from '../utils'
+
+let throttleScroll
+function getThrottledScroll (context) {
+  if (!throttleScroll) {
+    const wrapper = context.$refs.wrapper
+    const inner = context.$refs.inner
+    let preOffset = (context.scrollDirection === 'horizontal'
+        ? wrapper.scrollLeft
+        : wrapper.scrollTop)
+      || 0
+    throttleScroll = throttle(function (evt) {
+      const offset = context.scrollDirection === 'horizontal'
+        ? wrapper.scrollLeft
+        : wrapper.scrollTop
+      const indent = parseInt(context.offsetAccuracy)
+      function triggerScroll () {
+        const rect = inner.getBoundingClientRect()
+        evt.contentSize = { width: rect.width, height: rect.height }
+        evt.contentOffset = {
+          x: wrapper.scrollLeft,
+          y: wrapper.scrollTop
+        }
+        context.$emit('scroll', evt)
+      }
+      if (indent
+        && !isNaN(indent)
+        && indent > 0
+        && Math.abs(offset - preOffset) >= indent) {
+        triggerScroll()
+        preOffset = offset
+      }
+      else if (!indent || isNaN(indent) || indent <= 0) {
+        triggerScroll()
+      }
+    }, 16, true)
+  }
+  return throttleScroll
+}
 
 export default {
+  props: {
+    offsetAccuracy: [Number, String]
+  },
   methods: {
     updateLayout () {
       const wrapper = this.$refs.wrapper
@@ -13,6 +54,7 @@ export default {
 
     handleScroll (event) {
       getThrottleLazyload(25, this.$el, 'scroll')()
+      getThrottledScroll(this)(event)
       if (this.reachBottom()) {
         this.$emit('loadmore', event)
       }