event-args

packages/chameleon-mixins/px2cpx.js

+const _ = module.exports = {};
+const platform = process.env.platform;
+
+_.webPx2Cpx = function(px) {
+  function getViewportSize() {
+    let viewportWidth;
+    let viewportHeight;
+    if (window.innerWidth) {
+      viewportWidth = window.innerWidth;
+      viewportHeight = window.innerHeight;
+    } else if (document.documentElement && document.documentElement.clientWidth || document.body && document.body.clientWidth) {
+      viewportWidth = document.documentElement && document.documentElement.clientWidth || document.body && document.body.clientWidth;
+      viewportHeight = document.documentElement && document.documentElement.clientHeight || document.body && document.body.clientHeight;
+    }
+    return {
+      viewportWidth: viewportWidth,
+      viewportHeight: viewportHeight
+    };
+  }
+  const {viewportWidth} = getViewportSize();
+  const cpx = +(750 / viewportWidth * px).toFixed(3);
+  return cpx;
+}
+_.miniappPx2Cpx = function(px, platform) {
+  function getViewportSize() {
+    if (platform === 'wx') {
+      const { windowWidth } = wx.getSystemInfoSync();
+      return windowWidth;
+    }
+    if (platform === 'baidu') {
+      const { windowWidth } = swan.getSystemInfoSync();
+      return windowWidth;
+    }
+    if (platform === 'alipay') {
+      const { windowWidth } = my.getSystemInfoSync();
+      return windowWidth;
+    }
+  }
+
+  const viewportWidth = getViewportSize();
+  const cpx = +(750 / viewportWidth * px).toFixed(3);
+  return cpx;
+}
+_.px2cpx = function(px) {
+  if (platform === 'web') {
+    return _.webPx2Cpx(px);
+  }
+  if (['wx', 'baidu', 'alipay'].includes(platform)) {
+    return _.miniappPx2Cpx(px, platform);
+  }
+}

packages/chameleon-mixins/web-mixins.js

 
 const common = require('./common.js');
 const webStyleHandle = require('chameleon-css-loader/proxy/proxyWeb.js');
-
+const {px2cpx} = require('./px2cpx.js');
 const _ =  module.exports  = {};
 common.merge(_, common);
 
@@ -124,10 +124,10 @@ function getNewEvent(e) {
       let touch = touches[i];
       let ret = {}
       ret.identifier = touch.identifier;
-      ret.pageX = parseInt(touch.pageX);
-      ret.pageY = parseInt(touch.pageY);
-      ret.clientX = parseInt(touch.clientX);
-      ret.clientY = parseInt(touch.clientY);
+      ret.pageX = px2cpx(parseInt(touch.pageX,10));
+      ret.pageY = px2cpx(parseInt(touch.pageY,10));
+      ret.clientX = px2cpx(parseInt(touch.clientX,10));
+      ret.clientY = px2cpx(parseInt(touch.clientY,10));
       newEvent.touches.push(ret);
     }
   }
@@ -138,10 +138,10 @@ function getNewEvent(e) {
       let touch = changedTouches[i];
       let ret = {}
       ret.identifier = touch.identifier;
-      ret.pageX = parseInt(touch.pageX);
-      ret.pageY = parseInt(touch.pageY);
-      ret.clientX = parseInt(touch.clientX);
-      ret.clientY = parseInt(touch.clientY);
+      ret.pageX = px2cpx(parseInt(touch.pageX,10));
+      ret.pageY = px2cpx(parseInt(touch.pageY,10));
+      ret.clientX = px2cpx(parseInt(touch.clientX,10));
+      ret.clientY = px2cpx(parseInt(touch.clientY,10));
       newEvent.changedTouches.push(ret);
     }
   }

packages/chameleon-mixins/wx-alipay-common-mixins.js

@@ -2,7 +2,8 @@
 
 const common = require('./common.js');
 const wxStyleHandle = require('chameleon-css-loader/proxy/proxyMiniapp.js')
-const utils = require('./utils.js')
+const utils = require('./utils.js');
+const {px2cpx} = require('./px2cpx.js');
 const deepClone = function(obj) {
   if (obj.toString().slice(8, -1) !== "Object") {
     return obj;
@@ -115,6 +116,36 @@ function getNewEvent(e) {
           dataset: e[key].dataset
         }
         newEvent[key] = newTarget
+      } else if (~['touches', 'changedTouches'].indexOf(key)) {
+        if (key == 'touches') {
+          let touches = e[key];
+          newEvent.touches = [];
+          for (let i = 0;i < touches.length;i++) {
+            let touch = touches[i];
+            let ret = {}
+            ret.identifier = touch.identifier;
+            ret.pageX = px2cpx(parseInt(touch.pageX, 10));
+            ret.pageY = px2cpx(parseInt(touch.pageY, 10));
+            ret.clientX = px2cpx(parseInt(touch.clientX, 10));
+            ret.clientY = px2cpx(parseInt(touch.clientY, 10));
+            newEvent.touches.push(ret);
+          }
+        }
+
+        if (key == 'changedTouches') {
+          let changedTouches = e[key]
+          newEvent.changedTouches = [];
+          for (let i = 0;i < changedTouches.length;i++) {
+            let touch = changedTouches[i];
+            let ret = {}
+            ret.identifier = touch.identifier;
+            ret.pageX = px2cpx(parseInt(touch.pageX, 10));
+            ret.pageY = px2cpx(parseInt(touch.pageY, 10));
+            ret.clientX = px2cpx(parseInt(touch.clientX, 10));
+            ret.clientY = px2cpx(parseInt(touch.clientY, 10));
+            newEvent.changedTouches.push(ret);
+          }
+        }
       } else {
         newEvent[key] = e[key]
       }

packages/chameleon-template-parse/src/common/cml-map.js

@@ -8,6 +8,13 @@ exports.tagMap = {
       alipay: 'cover-view',
       baidu: 'cover-view'
     },
+    'cover-image': {
+      wx: 'cover-image',
+      web: 'img',
+      weex: 'image',
+      alipay: 'cover-image',
+      baidu: 'cover-image'
+    },
     'view': {
       wx: 'view',
       web: 'div',

packages/chameleon-template-parse/test/parser/cml.test.js

@@ -47,6 +47,15 @@ describe('parse-template-cml-all', function() {
       expect(compileTemplate(source, 'wx', options).source).to.equal(`<view class=" cml-base cml-view"><cml-buildin-button class=" cml-base cml-button"></cml-buildin-button><thirdComp1 class=" cml-view cml-thirdComp1"></thirdComp1><thirdComp2 class=" cml-view cml-thirdComp2"></thirdComp2></view>`)
     });
   });
+  describe('parse-cover-tag-transform', function() {
+    let source = `<view><cover-image></cover-image><cover-view></cover-view></view>`;
+    it('test-cover-tag-transform-web', function() {
+      expect(compileTemplate(source, 'web', options).source).to.equal(`<div class=" cml-base cml-view"><img class=" cml-base cml-cover-image"></img><div class=" cml-base cml-cover-view"></div></div>`);
+    });
+    it('test-cover-tag-transform-miniapp', function() {
+      expect(compileTemplate(source, 'wx', options).source).to.equal(`<view class=" cml-base cml-view"><cover-image class=" cml-base cml-cover-image"></cover-image><cover-view class=" cml-base cml-cover-view"></cover-view></view>`);
+    });
+  });
   // directive c-model
   describe('parse-directive-transform', function() {
     let source = `<view><button c-model="{{  value1}}"></button></view>`;