activity/src/utils/tool.js

import {
  isIpad,
  isIpod,
  isIphone,
  isWindows,
  isMac,
  isWechat,
} from './isTerminal';
/**
 * 动态加载script
 * @param {string} url
 * @param {string} callback
 */
export function loadScript(url, callback) {
  let script = document.createElement('script');
  if (script.readyState) {
    // IE
    script.onreadystatechange = function () {
      if (script.readyState === 'loaded' || script.readyState === 'complete') {
        script.onreadystatechange = null;
        callback();
      }
    };
  } else {
    // 其他浏览器
    script.onload = function () {
      callback();
    };
  }
  script.src = url;
  document.getElementsByTagName('head')[0].appendChild(script);
}

/**
 * 闪视频登录状态
 * @param {function} next
 * @returns
 */
export function getUser(next, isNotToLogin) {
  window.$shanshipin = {};
  // 判断闪视频登录状态
  if (isWindows || isMac || isWechat) return next && next();
  // 获取登录信息
  if (isIpad || isIpod || isIphone) {
    if (!window.webkit || !window.webkit.messageHandlers) return next && next();
    window.setUser = user => {
      if (user == '{}' && !isNotToLogin)
        return window.webkit.messageHandlers.iosJumpLogin.postMessage([]);
      const u1 = JSON.parse(user || '{}');
      window.webkit.messageHandlers.getAppInfo.postMessage([]);
      window.setAppInfo = userJson => {
        const u2 = JSON.parse(userJson || '{}');
        window.$shanshipin = {
          ...u1,
          ...u2,
        };
        next && next();
      };
    };

    window.webkit.messageHandlers.tideGetUser.postMessage([]);
  } else {
    if (!window.TideApp) return next && next();
    const u1 = JSON.parse(window.TideApp.getUser() || '{}');
    if (!u1.UserId && !isNotToLogin) window.TideApp.login();
    const u2 = JSON.parse(window.TideApp.getAppInfo() || '{}');
    window.$shanshipin = {
      ...u1,
      ...u2,
    };
    next && next();
  }
}

/**
 * 帧动画
 * @returns
 */
export function requestAnimationFrame() {
  return (
    window.requestAnimationFrame ||
    window.webkitRequestAnimationFrame /* Safari 和 Chrome */ ||
    window.mozRequestAnimationFrame /* Firefox */ ||
    window.oRequestAnimationFrame /* Opera */ ||
    window.msRequestAnimationFrame /* IE 9 */ ||
    function (callback) {
      window.setTimeout(callback, 6000 / 60);
    }
  );
}

/**
 * 通过canvas生成图片
 */
export async function canvasToImage(layers) {
  let canvas = document.createElement('canvas');
  canvas.width = layers.width;
  canvas.height = layers.height;
  let ctx = canvas.getContext('2d');
  for (let i = 0; i < layers.list.length; i++) {
    const v = layers.list[i];
    /**
     * 将图层绘制到canvas上
     */
    if (v.type === 'image') {
      const img = await createDate(v.src);
      ctx.drawImage(img, v.x, v.y, v.width, v.height);
    } else if (v.type === 'new_image') {
      ctx.drawImage(v.image, v.x, v.y, v.width, v.height);
    } else if (v.type === 'redius_image') {
      const img_lever_0 = await createDate(v.src0);
      const img_lever_1 = v.src1;
      const w = (img_lever_0.width * v.height) / img_lever_0.height;
      ctx.drawImage(img_lever_1, 0, 0, layers.width, layers.height);
      ctx.save();
      ctx.beginPath();
      ctx.arc(v.arc_x, v.arc_y, v.width / 2, 0, Math.PI * 2, false);
      ctx.clip();
      ctx.drawImage(img_lever_0, v.x - (w - v.width) / 2, v.y, w, v.height);
      ctx.restore();
    } else if (v.type === 'text') {
      ctx.font = v.font;
      ctx.fillStyle = v.color;
      ctx.fillText(v.text, v.x, v.y);
    }
  }
  return {
    image: canvas.toDataURL('image/png'),
    width: layers.width,
    height: layers.height,
  };
}

export function createDate(src) {
  return new Promise((resolve, reject) => {
    try {
      const img = new Image();
      img.src = src;
      img.setAttribute('crossOrigin', 'anonymous');
      img.onload = () => {
        resolve(img);
      };
    } catch (e) {
      reject(e);
    }
  });
}

/**
 * 高斯模糊
 */
export function gaussianBlur(imgData, radius) {
  let pixels = imgData.data;
  let width = imgData.width;
  let height = imgData.height;
  let length = Math.floor(radius * 2) + 1;
  let arr = [];

  // 创建高斯模糊核
  for (let i = 0; i < length; i++) {
    arr[i] =
      Math.exp(-((i - radius) * (i - radius)) / (2 * radius * radius)) /
      (Math.sqrt(2 * Math.PI) * radius);
  }

  // x方向模糊
  for (let y = 0; y < height; y++) {
    for (let x = 0; x < width; x++) {
      let r = 0,
        g = 0,
        b = 0,
        a = 0;
      let wsum = 0;
      for (let i = -radius; i <= radius; i++) {
        let idx = (y * width + Math.min(width - 1, Math.max(0, x + i))) * 4;
        r += pixels[idx] * arr[i + radius];
        g += pixels[idx + 1] * arr[i + radius];
        b += pixels[idx + 2] * arr[i + radius];
        a += pixels[idx + 3] * arr[i + radius];
        wsum += arr[i + radius];
      }
      let idx = (y * width + x) * 4;
      pixels[idx] = r / wsum;
      pixels[idx + 1] = g / wsum;
      pixels[idx + 2] = b / wsum;
      pixels[idx + 3] = a / wsum;
    }
  }

  // y方向模糊
  for (let x = 0; x < width; x++) {
    for (let y = 0; y < height; y++) {
      let r = 0,
        g = 0,
        b = 0,
        a = 0;
      let wsum = 0;
      for (let i = -radius; i <= radius; i++) {
        let idx = (Math.min(height - 1, Math.max(0, y + i)) * width + x) * 4;
        r += pixels[idx] * arr[i + radius];
        g += pixels[idx + 1] * arr[i + radius];
        b += pixels[idx + 2] * arr[i + radius];
        a += pixels[idx + 3] * arr[i + radius];
        wsum += arr[i + radius];
      }
      let idx = (y * width + x) * 4;
      pixels[idx] = r / wsum;
      pixels[idx + 1] = g / wsum;
      pixels[idx + 2] = b / wsum;
      pixels[idx + 3] = a / wsum;
    }
  }

  return imgData;
}