comment/src/helper.js

import { REGEXP } from "./constant";
import emoji, { prefixUrl, ext } from "./emoji";

export function isFunction(functionToCheck) {
  return (
    functionToCheck && {}.toString.call(functionToCheck) === "[object Function]"
  );
}

export function isUrl(userInput) {
  const regexp = /(http(s)?:\/\/.)?(www\.)?[-a-zA-Z0-9@:%._+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_+.~#?&//=]*)/g;
  var res = userInput.match(regexp);
  if (res === null) return false;
  else return true;
}

/**
 * 将对象数组转换为对象
 * @param {array} array Array of Objects
 * @param {string} keyField string
 */
export function arrayToObject(array, keyField) {
  return array.reduce((obj, item) => {
    obj[item[keyField]] = item;
    return obj;
  }, {});
}

/**
 * HTML 编码
 * 将 < > 等字符串进行编码
 * @param {string} str 文本
 */
export function htmlEncode(str) {
  if (!str) return "";
  // /[\u00A0-\u9999<>\&]/gim  // 中文和 HTML 字符
  return str.replace(/[<>\&]/gim, function(i) {
    return "&#" + i.charCodeAt(0) + ";";
  });
}

/**
 * 渲染编辑器
 * [x] => <img src="x" />
 * @param {strig} content
 */
export function renderContent(content, onClick) {
  return htmlEncode(content).replace(REGEXP, function(a, b) {
    const src = a.slice(1, -1);
    if (isUrl(src)) {
      return `<img src="${src}" alt="${src}" style="max-width: 300px" />`;
    }
    const emojiObejct = arrayToObject(emoji, "title");
    const value = emojiObejct[src].value;
    return `<img src="${prefixUrl}${value}.${ext}" alt="${value}" />`;
  });
}