weex-nuke/lib/node_modules/nuke-transition/src/index.js

基于 Rax 、Weex 的高性能组件体系 ~~

/** @jsx createElement */

/**
 * Copyright (c) 2015-present, Alibaba Group Holding Limited.
 * All rights reserved.
 *
 * usage:
 * Transition(box, {translate(150,150)}, {
 *          timingFunction: 'linear',
 *          delay: 0,
 *          duration: 500
 *       }, function() {
 *           cb && cb.call(this);
 *       });
 */

'use strict';

import { isWeex, isWeb } from 'nuke-env';
import Transition from './transition';

function getDefaultRem() {
  return document.documentElement.clientWidth / 750;
}
function parseRem(val) {
  const regArr = {
    translateX: 'translateX\\(([-+]?\\w+)\\)',
    translateY: 'translateY\\(([-+]?\\w+)\\)',
    translate: 'translate\\(([-+]?\\w+)\\,\\s?([-+]?\\w+)\\)',
  };

  for (const p in regArr) {
    const reg = new RegExp(regArr[p]);
    if (val.match(reg)) {
      if (p === 'translateX' || p === 'translateY') {
        var matchArr = val.match(reg);
        const num = parseInt(matchArr[1], 10);
        val = val.replace(matchArr[1], getPx(matchArr[1]));
      } else if (p === 'translate') {
        var matchArr = val.match(reg);
        const x = matchArr[1];
        const y = matchArr[2];
        val = `translate(${getPx(x)},${getPx(y)})`;
      }
    }
  }

  return val;
}
function getPx(str) {
  if (isWeex) {
    return parseInt(str, 10);
  }
  return `${parseInt(str, 10) * getDefaultRem().toString()}px`;
}
function Trans(node, styles, options, callback) {
  // rem to px
  for (const key in styles) {
    // compat with ios 8
    if (key === 'transform' || key == 'webkitTransform') {
      styles[key] = parseRem(styles[key]);
    } else if (arrayContains(key, ['top', 'left', 'height', 'bottom', 'right', 'width'])) {
      const matchArr = styles[key].match(/(\d+)(rem){0,1}/);
      styles[key] = styles[key].replace(matchArr[0], getPx(matchArr[1]));
    }
  }

  Transition(node, styles, options, callback);
}

function arrayContains(value, arr) {
  for (let i = 0; i < arr.length; i++) {
    if (value === arr[i]) {
      return true;
    }
  }
  return false;
}
export default Trans;