import findDOMNode from 'rax-find-dom-node';
import { isWeex } from 'universal-env';
/**
 * 一个实例中相同的iconfont资源只需被调用一次，如果对iconfont有二次封装会导致调用次数过多在客户端出现闪动
 * 单例模式  相同的url算一个单例
 */
declare global {
  function __weex_require__(s: string): any;
}

const weexDOM = isWeex ? __weex_require__('@weex-module/dom') : null;

export function px2rem(px) {
  return (px * 750) / window.innerWidth;
}

export function getEl(el) {
  return isWeex ? findDOMNode(el).ref : findDOMNode(el);
}

export const rAF = (
  window.requestAnimationFrame ||
  window.webkitRequestAnimationFrame ||
  // @ts-ignore
  window.mozRequestAnimationFrame ||
  // @ts-ignore
  window.oRequestAnimationFrame ||
  // @ts-ignore
  window.msRequestAnimationFrame ||
  function(callback) {
    return window.setTimeout(callback, 1000 / 60);
  }
).bind(window);

export function getComponentRect(el, callback, retry) {
  if (callback) {
    el = findDOMNode(el);
    if (isWeex) {
      weexDOM.getComponentRect(el.ref, function(e) {
        e.size = e.size || { width: 0, height: 0 };
        if (e.size && !e.size.width && !e.size.height && retry) {
          rAF(() => getComponentRect(el, callback, retry));
        } else {
          callback(e);
        }
      });
    } else {
      const rect = el.getBoundingClientRect();
      callback({
        result: true,
        size: {
          x: px2rem(rect.x),
          y: px2rem(rect.y),
          width: px2rem(rect.width),
          height: px2rem(rect.height),
          top: px2rem(rect.top),
          bottom: px2rem(rect.bottom),
          left: px2rem(rect.left),
          right: px2rem(rect.right),
        },
      });
    }
  }
}