@dolphinweex/weex-vue-render 0.2.0 → 0.2.2

package/dist/index.common.js

@@ -8,21 +8,6 @@ console.log('START WEEX VUE RENDER: 1.0.36, Build 2018-12-29 17:52.');
 	(global.WeexVueRender = factory());
 }(this, (function () { 'use strict';
 
-function isAbsoluteOrFixedPositioned(element, deep=2) {
-    let currentElement = element;
-
-    let deep_ = 0;
-    while (currentElement && deep_ <= deep) {
-        deep_++;
-        const position = window.getComputedStyle(currentElement).position;
-        if (position === 'absolute' || position === 'fixed') {
-            return true;
-        }
-        currentElement = currentElement.parentElement;
-    }
-    return false;
-}
-
 function __$styleInject(css, returnValue) {
   if (typeof document === 'undefined') {
     return returnValue;
@@ -2966,33 +2951,68 @@ var scaleStyles = [
   'bottom',
   'border',
   'borderRadius',
+  'border-radius',
   'borderWidth',
+  'border-width',
   'borderLeft',
+  'border-left',
   'borderRight',
+  'border-right',
   'borderTop',
+  'border-top',
   'borderBottom',
+  'border-bottom',
   'borderLeftWidth',
+  'border-left-width',
   'borderRightWidth',
+  'border-right-width',
   'borderTopWidth',
+  'border-top-width',
   'borderBottomWidth',
+  'border-bottom-width',
+  'borderTopLeftRadius',
+  'border-top-left-radius',
+  'borderTopRightRadius',
+  'border-top-right-radius', 
+  'borderBottomLeftRadius',
+  'border-bottom-left-radius' ,
+  'borderBottomRightRadius',
+  'border-bottom-right-radius',
   'margin',
   'marginLeft',
+  'margin-left',
   'marginRight',
+  'margin-right',
   'marginTop',
+  'margin-top',
   'marginBottom',
+  'margin-bottom',
   'padding',
   'paddingLeft',
+  'padding-left',
   'paddingRight',
+  'padding-right',
   'paddingTop',
+  'padding-top',
   'paddingBottom',
-  'fontSize', // 如果包含wx单位需要当作vp单位转化为px
+  'padding-bottom',
+  'fontSize',
+  'font-size',
   'lineHeight',
+  'line-height',
   'transform',
   'webkitTransform',
+  'webkit-transform',
   'WebkitTransform',
   'mozTransform',
+  'moz-transform',
   'MozTransform',
-  'itemSize'
+  'itemSize',
+  'item-size',
+  'min-height',
+  'minHeight',
+  'max-height',
+  'maxHeight'
 ];
 
 var vendorReg = /webkit|moz/i;
@@ -3034,7 +3054,37 @@ var config = {
     'a'
   ],
   bindingStyleNamesForPx2Rem: allStyles,
-  bindingStyleNamesForPv2Px: ["fontSize", "lineHeight", "letterSpacing"]
+
+  bindingStyleNamesForPv2Px: ["fontSize", "lineHeight", "letterSpacing"],
+
+  bindingStyleNamesForNumber2Px: [
+    "top",
+    "left",
+    "right",
+    "bottom",
+    "width",
+    "height",
+    "minWidth",
+    "minHeight",
+    "maxWidth",
+    "maxHeight",
+    "margin",
+    "marginTop",
+    "marginBottom",
+    "marginRight",
+    "marginLeft",
+    "borderWidth",
+    "borderTopWidth",
+    "borderLeftWidth",
+    "borderBottomWidth",
+    "borderRightWidth",
+    "padding",
+    "paddingTop",
+    "paddingLeft",
+    "paddingBottom",
+    "paddingRight",
+
+  ]
 };
 
 /*
@@ -3410,7 +3460,7 @@ function applySrc (item, src, placeholderSrc) {
    * 1. apply src immediately in case javscript blocks the image loading
    *  before next tick.
    */
-  item.style.backgroundImage = "url(" + (src || '') + ")";
+  item.style.backgroundImage = "url(" + (src ? encodeURI(src) : '') + ")";
   item.removeAttribute(lazyloadAttr);
   /**
    * 2. then load the img src with Image constructor (but would not post
@@ -3418,7 +3468,7 @@ function applySrc (item, src, placeholderSrc) {
    */
   item._src_loading = src;
   preLoadImg(src, function (evt) {
-    item.style.backgroundImage = "url(" + (src || '') + ")";
+    item.style.backgroundImage = "url(" + (src ? encodeURI(src) : '') + ")";
     var ref = this;
     var naturalWidth = ref.width;
     var naturalHeight = ref.height;
@@ -3436,7 +3486,7 @@ function applySrc (item, src, placeholderSrc) {
     dispatchNativeEvent(item, 'load', params);
     if (placeholderSrc) {
       preLoadImg(placeholderSrc, function () {
-        item.style.backgroundImage = "url(" + (placeholderSrc || '') + ")";
+        item.style.backgroundImage = "url(" + (placeholderSrc ? encodeURI(placeholderSrc) : '') + ")";
       });
     }
     finallCb();
@@ -3535,6 +3585,7 @@ function getThrottleLazyload (wait, el) {
 
 var bindingStyleNamesForPx2Rem = config.bindingStyleNamesForPx2Rem;
 var bindingStyleNamesForPv2Px = config.bindingStyleNamesForPv2Px;
+var bindingStyleNamesForNumber2Px = config.bindingStyleNamesForNumber2Px;
 
 // whether to support using 0.5px to paint 1px width border.
 var _supportHairlines;
@@ -3741,11 +3792,11 @@ function styleObject2rem (style, rootValue) {
     var camK = camelize(k);
 
     if (bindingStyleNamesForPv2Px.indexOf(camK) > -1 && typeof obj[camK] =='string'
-      && obj[camK].endsWith('wx') > -1) {
+      && obj[camK].endsWith('wx')) {
 
       obj[camK] = px2px(style[k]);
     } else if (bindingStyleNamesForPx2Rem.indexOf(camK) > -1) {
-      obj[camK] = px2rem(style[k] + '', rootValue);
+        obj[camK] = px2rem(style[k] + '', rootValue); 
     }
     else {
       obj[camK] = style[k];
@@ -3917,16 +3968,31 @@ function initEnv (viewportInfo, envInfo) {
     osName = 'android';
   }
   var osVersion = envInfo.os.version.val;
+
+  var device_display = $midea_harmony_native.getHarmoryDeviceDisplay() || {};
+
+
   var env = {
     platform: 'harmony',
     weexVersion: '1.0.36',
     layoutDirection: 'ltr',
     userAgent: navigator.userAgent,
     appName: browserName,
-    appVersion: browserVersion,
+    appVersion: device_display.appVersion,
     osName: osName,
     osVersion: osVersion,
-    deviceModel: envInfo.os.name || null
+    
+    deviceModel: device_display.deviceModel || null,
+    appEnv: device_display.appEnv,
+    versionCode: device_display.versionCode,
+    idfa: device_display.idfa,
+    isFullScreen: device_display.isFullScreen,
+    weexVersion: device_display.weexVersion,
+    osName: device_display.osName,
+    statusBarHeight: device_display.statusBarHeight,
+    safeAreaBottomHeight: device_display.safeAreaBottomHeight,
+    isImmersion: device_display.isImmersion,
+    
   };
   /**
    * viewportInfo: scale, deviceWidth, deviceHeight. dpr
@@ -4890,7 +4956,7 @@ var style = {
       }
       return t;
     },
-    _px2rem: function _px2rem (value, rootValue) {
+    _px2rem: function _px2rem (value, rootValue, propKey) {
       var this$1 = this;
       if (typeof value === 'string') {
         return (value + '').replace(/[+-]?\d+(?:.\d*)?[pw]x/gi, function ($0) {
@@ -4898,20 +4964,25 @@ var style = {
         })
       }
       if (typeof value === 'number') {
-        return weex.utils.px2rem(value + '', rootValue)
+        if (bindingStyleNamesForNumber2Px.indexOf(propKey) > -1) {
+          const scale = weex.config.env.scale
+          return (scale * value) + 'px'; 
+        }else{
+          return weex.utils.px2rem(value + '', rootValue)
+        }
       }
       if (isPlainObject(value)) {
         let cloneObj = this._deepClone(value)
         for (var k in cloneObj) {
           // 如果是"fontSize", "lineHeight", "letterSpacing"并且值包含wx则按照vp来转化为px使用
           if (
-            bindingStyleNamesForPv2Px$1.indexOf(k) > -1 &&typeof cloneObj[k] == "string" && cloneObj[k].endsWith('wx') > -1) {
+            bindingStyleNamesForPv2Px$1.indexOf(k) > -1 &&typeof cloneObj[k] == "string" && cloneObj[k].endsWith('wx')) {
             cloneObj[k] = px2px(cloneObj[k]);
           }else if (
             cloneObj.hasOwnProperty(k)
             && bindingStyleNamesForPx2Rem$1.indexOf(k) > -1
           ) {
-            cloneObj[k] = weex.utils.px2rem(cloneObj[k] + '', rootValue);
+              cloneObj[k] = weex.utils.px2rem(cloneObj[k] + '', rootValue);
           }
         }
         return cloneObj
@@ -5860,23 +5931,59 @@ var scrollable$1 = {
     },
 
     handleTouchStart: function handleTouchStart (event) {
-      if (this._loading || this._refresh) {
-        var touch = event.changedTouches[0];
-        this._touchParams = {
-          reachTop: this.reachTop(),
-          reachBottom: this.reachBottom(),
-          startTouchEvent: touch,
-          startX: touch.pageX,
-          startY: touch.pageY,
-          timeStamp: event.timeStamp
-        };
-      }
+      var touch = event.changedTouches[0];
+      this._touchParams = {
+        reachTop: this.reachTop(),
+        reachBottom: this.reachBottom(),
+        startTouchEvent: touch,
+        startX: touch.pageX,
+        startY: touch.pageY,
+        timeStamp: event.timeStamp
+      };
     },
 
     handleTouchMove: function handleTouchMove (event) {
-      if (!this._touchParams || !this._refresh && !this._loading) {
+      if (!this._touchParams) {
+        return
+      }
+
+      var tp = this._touchParams;
+      if (!tp) { return } 
+
+      var ref = this._touchParams;
+      var startX = ref.startX;
+      var startY = ref.startY;
+      var touch = event.changedTouches[0];
+      var offsetX = touch.pageX - startX;
+      var offsetY = touch.pageY - startY;
+      tp.offsetX = offsetX;
+      tp.offsetY = offsetY;
+      var isV = tp.isVertical;
+      if (typeof isV === 'undefined') {
+        isV = tp.isVertical = Math.abs(offsetX) < Math.abs(offsetY);
+      }
+
+      // 如果是水平滚动，并且手势是水平方向，则阻止冒泡
+      // 如果是垂直滚动，并且手势是垂直方向，则阻止冒泡
+      var isScrollHorizontal = this.$el.classList.value.indexOf("weex-scroller-horizontal") > -1 || this.$el.classList.value.indexOf("weex-recycle-horizontal") > -1
+      console.log("dom", this.$el.classList.value)
+      if (isScrollHorizontal) {
+        if (!isV) {
+          // 水平
+          event.stopPropagation();
+          return;
+        } 
+        return;
+      }else {
+        if (!isV) {
+          return;
+        }
+      }
+      
+      if (!this._refresh && !this._loading) {
         return
       }
+
       var inner = this.$refs.inner;
       var ref = this._touchParams;
       var startY = ref.startY;
@@ -5900,6 +6007,18 @@ var scrollable$1 = {
       if (!this._touchParams || !this._refresh && !this._loading) {
         return
       }
+      var tp = this._touchParams;
+      var isV = tp.isVertical;
+      if (this.scrollDirection === 'horizontal' && !isV) {
+        // 水平
+        event.stopPropagation();
+      }else if (isV) {
+        // 垂直
+        event.stopPropagation();
+      }else {
+        return;
+      } 
+
       var inner = this.$refs.inner;
       var ref = this._touchParams;
       var startY = ref.startY;
@@ -5975,9 +6094,6 @@ function getList (weex) {
     },
     mounted: function mounted () {
       var this$1 = this;
-      if (isAbsoluteOrFixedPositioned(this$1.$el)) {
-        this$1.$el.classList.remove("height-0");
-      }
       setTimeout(() => {
         if (this$1.$el.clientHeight == 0) {
           this$1.$el.classList.remove("height-0");
@@ -6016,7 +6132,7 @@ function getList (weex) {
         on: {
           scroll: this.handleScroll,
           touchstart: this.handleTouchStart,
-          touchmove: this.handleTouchMove,
+          touchmove: this.handleTouchMove.bind(this),
           touchend: this.handleTouchEnd
         },
         staticStyle: extractComponentStyle(this)
@@ -6071,9 +6187,6 @@ function getScroller (weex) {
     },
     mounted: function mounted () {
       var this$1 = this;
-      if (isAbsoluteOrFixedPositioned(this$1.$el)) {
-        this$1.$el.classList.remove("height-0");
-      }
       setTimeout(() => {
         if (this$1.$el.clientHeight == 0) {
           this$1.$el.classList.remove("height-0");
@@ -6134,7 +6247,7 @@ function getScroller (weex) {
         on: {
           scroll: this.handleScroll,
           touchstart: this.handleTouchStart,
-          touchmove: this.handleTouchMove,
+          touchmove: this.handleTouchMove.bind(this),
           touchend: this.handleTouchEnd
         },
         staticClass: this.wrapperClass,
@@ -6525,7 +6638,7 @@ function getWaterfall (weex) {
         on: {
           scroll: this.handleScroll,
           touchstart: this.handleTouchStart,
-          touchmove: this.handleTouchMove,
+          touchmove: this.handleTouchMove.bind(this),
           touchend: this.handleTouchEnd
         },
         staticClass: 'weex-waterfall weex-waterfall-wrapper weex-ct',
@@ -6987,9 +7100,6 @@ function getList$1 (weex) {
     },
     mounted: function mounted () {
       var this$1 = this;
-      if (isAbsoluteOrFixedPositioned(this$1.$el)) {
-        this$1.$el.classList.remove("height-0");
-      }
       setTimeout(() => {
         if (this$1.$el.clientHeight == 0) {
           this$1.$el.classList.remove("height-0");
@@ -7057,7 +7167,7 @@ function getList$1 (weex) {
         on: {
           scroll: this.handleScroll,
           touchstart: this.handleTouchStart,
-          touchmove: this.handleTouchMove,
+          touchmove: this.handleTouchMove.bind(this),
           touchend: this.handleTouchEnd
         },
         staticStyle: extractComponentStyle(this)
@@ -7138,6 +7248,8 @@ var MAIN_SLIDE_OPACITY = 1;
 var THROTTLE_SCROLL_TIME = 25;
 var INTERVAL_MINIMUM = 200;
 
+var touchSliderInstance = null;
+
 var slideMixin = {
   created: function created () {
     this._clones = [];
@@ -7249,7 +7361,7 @@ var slideMixin = {
           attrs: { 'weex-type': this.isNeighbor ? 'slider-neighbor' : 'slider' },
           on: {
             touchstart: this._handleTouchStart,
-            touchmove: weex.utils.throttle(weex.utils.bind(this._handleTouchMove, this), 25),
+            touchmove: weex.utils.throttle(weex.utils.bind(this._handleTouchMove, this), 10),
             touchend: this._handleTouchEnd,
             touchcancel: this._handleTouchCancel
           },
@@ -7326,16 +7438,19 @@ var slideMixin = {
         this._prepareNodes();
         var translate = weex.utils.getTransformObj(inner).translate;
         var match = translate && translate.match(/translate[^(]+\(([+-\d.]+)/);
-        var innerX = match && match[1] || 0;
+        var innerX = parseFloat(inner.style.left); //match && match[1] || 0;
         var dist = innerX - this.innerOffset;
         this.innerOffset += step * this._wrapperWidth;
         // transform the whole slides group.
-        inner.style.webkitTransition = "-webkit-transform " + (TRANSITION_TIME / 1000) + "s ease-in-out";
-        inner.style.mozTransition = "transform " + (TRANSITION_TIME / 1000) + "s ease-in-out";
-        inner.style.transition = "transform " + (TRANSITION_TIME / 1000) + "s ease-in-out";
-        inner.style.webkitTransform = "translate3d(" + (this.innerOffset) + "px, 0, 0)";
-        inner.style.mozTransform = "translate3d(" + (this.innerOffset) + "px, 0, 0)";
-        inner.style.transform = "translate3d(" + (this.innerOffset) + "px, 0, 0)";
+         
+        inner.style.webkitTransition = "left " + (TRANSITION_TIME / 1000) + "s ease-in-out";
+        inner.style.mozTransition = "left " + (TRANSITION_TIME / 1000) + "s ease-in-out";
+        inner.style.transition = "left " + (TRANSITION_TIME / 1000) + "s ease-in-out";
+        // inner.style.webkitTransform = "translate3d(" + (this.innerOffset) + "px, 0, 0)";
+        // inner.style.mozTransform = "translate3d(" + (this.innerOffset) + "px, 0, 0)";
+        // inner.style.transform = "translate3d(" + (this.innerOffset) + "px, 0, 0)";
+        inner.style.left = this.innerOffset + 'px'
+
 
         // emit scroll events.
         if (!isTouchScroll) {
@@ -7387,9 +7502,11 @@ var slideMixin = {
         var node = this$1._showNodes[i];
         node = node && node.firstElementChild;
         if (!node) { continue }
-        weex.utils.addTransform(this$1._showNodes[i].firstElementChild, {
-          translate: 'translate3d(0px, 0px, 0px)'
-        });
+        // ddd
+        // weex.utils.addTransform(this$1._showNodes[i].firstElementChild, {
+        //   translate: 'translate3d(0px, 0px, 0px)'
+        // });
+        this$1._showNodes[i].firstElementChild.left = '0px'
       }
     },
 
@@ -7505,9 +7622,12 @@ var slideMixin = {
 
       node._inShow = true;
       var translateX = index * this._wrapperWidth - this.innerOffset;
-      weex.utils.addTransform(node, {
-        translate: ("translate3d(" + translateX + "px, 0px, 0px)")
-      });
+      // ddd
+      // weex.utils.addTransform(node, {
+      //   translate: ("translate3d(" + translateX + "px, 0px, 0px)")
+      // });
+      node.style.left = translateX + 'px'
+
       node.style.zIndex = 99 - Math.abs(index);
       node.style.opacity = 1;
       node._showIndex = index;
@@ -7595,15 +7715,18 @@ var slideMixin = {
       if ( transformExtra === void 0 ) transformExtra = {};
 
       weex.utils.extendKeys(to.style, from.style, styles);
+      to.style.left = from.style.left;
       var transObj = weex.utils.getTransformObj(from);
-      for (var k in transformExtra) {
-        transObj[k] = transformExtra[k];
-      }
-      weex.utils.addTransform(to, transObj);
-      var fromInner = from.firstElementChild;
-      var toInner = to.firstElementChild;
-      toInner.style.opacity = fromInner.style.opacity;
-      weex.utils.copyTransform(fromInner, toInner);
+      if (transObj) {
+        for (var k in transformExtra) {
+          transObj[k] = transformExtra[k];
+        }
+        weex.utils.addTransform(to, transObj);
+        var fromInner = from.firstElementChild;
+        var toInner = to.firstElementChild;
+        toInner.style.opacity = fromInner.style.opacity;
+        weex.utils.copyTransform(fromInner, toInner);
+      }
     },
 
     /**
@@ -7621,7 +7744,7 @@ var slideMixin = {
         return
       }
       var origShowIndex = origNode._showIndex;
-      var styleProps = ['opacity', 'zIndex'];
+      var styleProps = ['opacity', 'zIndex', 'left'];
       var cl;
       if (Math.abs(origShowIndex) <= 1) {
         // leave a clone to replace the origNode in the show zone(-1 ~ 1).
@@ -7631,9 +7754,12 @@ var slideMixin = {
       }
       origNode._inShow = true;
       var transObj = weex.utils.getTransformObj(clone);
-      transObj.translate = transObj.translate.replace(/[+-\d.]+[pw]x/, function ($0) {
-        return pos * this$1._wrapperWidth - this$1.innerOffset + 'px'
-      });
+      if (transObj.translate) {
+        transObj.translate = transObj.translate.replace(/[+-\d.]+[pw]x/, function ($0) {
+          return pos * this$1._wrapperWidth - this$1.innerOffset + 'px'
+        });
+      }
+      
       this._copyStyle(clone, origNode, styleProps, transObj);
       this._removeClone(clone);
       if (!cl) {
@@ -7716,7 +7842,11 @@ var slideMixin = {
           translateX = 0;
         }
         transObj.translate = "translate3d(" + translateX + "px, 0px, 0px)";
-        weex.utils.addTransform(elm, transObj);
+
+        // ddd
+        // weex.utils.addTransform(elm, transObj);
+        elm.style.left = translateX + 'px'
+
         elm.style.opacity = i === 0 ? MAIN_SLIDE_OPACITY : this$1.neighborAlpha;
       }
     },
@@ -7755,9 +7885,7 @@ var slideMixin = {
     _handleTouchMove: function _handleTouchMove (event) {
       var tp = this._touchParams;
       if (!tp) { return }
-      if (this._sliding) {
-        return
-      }
+
       var ref = this._touchParams;
       var startX = ref.startX;
       var startY = ref.startY;
@@ -7777,9 +7905,24 @@ var slideMixin = {
       if (isV) {
         return
       }
-      // horizontal scroll. trigger scroll event.
-      event.preventDefault();
+
+      if (this._sliding) {
+        event.stopPropagation();
+        return
+      }
+
       var inner = this.$refs.inner;
+      // 如果已经有一个激活的slider，则不再处理其他slider
+      if (touchSliderInstance && touchSliderInstance != inner) {
+        event.stopPropagation();
+        return;
+      }
+
+      // horizontal scroll. trigger scroll event.
+      event.stopPropagation()
+
+      touchSliderInstance = inner;
+
       if (inner && offsetX) {
         if (!this._nodesOffsetCleared) {
           this._nodesOffsetCleared = true;
@@ -7788,21 +7931,31 @@ var slideMixin = {
         this._emitScrollEvent('weex$scroll', {
           offsetXRatio: offsetX / this._wrapperWidth
         });
-        inner.style.webkitTransform = "translate3d(" + (this.innerOffset + offsetX) + "px, 0, 0)";
-        inner.style.mozTransform = "translate3d(" + (this.innerOffset + offsetX) + "px, 0, 0)";
-        inner.style.transform = "translate3d(" + (this.innerOffset + offsetX) + "px, 0, 0)";
+        // ddd
+        // inner.style.webkitTransform = "translate3d(" + (this.innerOffset + offsetX) + "px, 0, 0)";
+        // inner.style.mozTransform = "translate3d(" + (this.innerOffset + offsetX) + "px, 0, 0)";
+        // inner.style.transform = "translate3d(" + (this.innerOffset + offsetX) + "px, 0, 0)";
+        inner.style.left = (this .innerOffset + offsetX) + 'px'
       }
     },
 
     _handleTouchEnd: function _handleTouchEnd (event) {
+      var inner = this.$refs.inner;
+      if (touchSliderInstance == inner) {
+        touchSliderInstance= null;
+      } else {
+        return;
+      }
+
       this._startAutoPlay();
       var tp = this._touchParams;
       if (!tp) { return }
       var isV = tp.isVertical;
-      if (typeof isV === 'undefined') {
+      if (typeof isV === 'undefined' || isV) {
         return
       }
-      var inner = this.$refs.inner;
+ 
+      event.stopPropagation();
       var offsetX = tp.offsetX;
       if (inner) {
         this._nodesOffsetCleared = false;
@@ -7816,6 +7969,11 @@ var slideMixin = {
     },
 
     _handleTouchCancel: function _handleTouchCancel (event) {
+      var inner = this.$refs.inner;
+      if (touchSliderInstance == inner) {
+        touchSliderInstance= null;
+      }
+
       return this._handleTouchEnd(event)
     },
 

package/package.json

@@ -49,5 +49,5 @@
     "type": "git",
     "url": "git+ssh://git@github.com/weexteam/weex-vue-render.git"
   },
-  "version": "0.2.0"
+  "version": "0.2.2"
 }