t-comm/lib/canvas/multi-img.js

专业、稳定、纯粹的工具库

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
var _regeneratorRuntime = require('@babel/runtime/regenerator');
var tslib_es6 = require('../tslib.es6-0d92ef81.js');
var nodejs_path = require('../nodejs/path.js');
var thirdParty_imageSize = require('../third-party/image-size.js');
var canvas_getCanvas = require('./get-canvas.js');
var nodeImg_img = require('../node-img/img.js');
require('../third-party/canvas.js');
require('../nodejs/crypto.js');
require('../nodejs/fs.js');
require('../nodejs/request.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
var _regeneratorRuntime__default = /*#__PURE__*/_interopDefaultLegacy(_regeneratorRuntime);

/**
 * 绘制多张图
 * @param {object} config 输入参数
 * @param {Array<string>} config.imgs base64图片列表
 * @returns {string} 图片url
 *
 * @example
 *
 * mergeMultiCanvasPic({
 *   imgs: [img, img2, img3],
 * })
 */
function mergeMultiCanvasPic(_ref) {
  var imgs = _ref.imgs;
  return tslib_es6.__awaiter(this, void 0, void 0, /*#__PURE__*/_regeneratorRuntime__default["default"].mark(function _callee() {
    var sizeOf, canvasLibrary, createCanvas, loadImage, getSavePath, dimensionMap, i, img, savePath, dimensions, oHeight, oWidth, getMaxWidth, getTotalHeight, getPastHeight, ONE_HEIGHT_GAP, getPastGap, CANVAS_MARGIN_TOP, canvas, ctx, drawBackground, _i2, imgSrc, _dimensions, _oHeight, _oWidth, image, imgUrl;
    return _regeneratorRuntime__default["default"].wrap(function (_context) {
      while (1) switch (_context.prev = _context.next) {
        case 0:
          drawBackground = function _drawBackground() {
            ctx.fillStyle = '#fff';
            ctx.fillRect(0, 0, canvas.width, canvas.height);
          };
          sizeOf = thirdParty_imageSize.getImageSize();
          canvasLibrary = canvas_getCanvas.getCanvas();
          if (canvasLibrary) {
            _context.next = 1;
            break;
          }
          return _context.abrupt("return", '');
        case 1:
          createCanvas = canvasLibrary.createCanvas, loadImage = canvasLibrary.loadImage;
          getSavePath = function getSavePath(i) {
            return nodejs_path.getPath().resolve(__dirname, "".concat(i, ".png"));
          };
          dimensionMap = {
            width: [],
            height: []
          };
          i = 0;
        case 2:
          if (!(i < imgs.length)) {
            _context.next = 5;
            break;
          }
          img = imgs[i];
          savePath = getSavePath(i);
          _context.next = 3;
          return nodeImg_img.saveBase64ImgToFile({
            imgUrl: img,
            savePath: savePath
          });
        case 3:
          dimensions = sizeOf(savePath);
          oHeight = dimensions.height, oWidth = dimensions.width;
          dimensionMap.width.push(oWidth);
          dimensionMap.height.push(oHeight);
        case 4:
          i++;
          _context.next = 2;
          break;
        case 5:
          getMaxWidth = function getMaxWidth() {
            return Math.max.apply(Math, _toConsumableArray__default["default"](dimensionMap.width));
          };
          getTotalHeight = function getTotalHeight() {
            return dimensionMap.height.reduce(function (acc, item) {
              return acc + item;
            }, 0);
          };
          getPastHeight = function getPastHeight(heights, index) {
            var res = 0;
            for (var _i = 0; _i < heights.length; _i++) {
              if (_i < index) {
                res += heights[_i];
              }
            }
            return res;
          };
          ONE_HEIGHT_GAP = 50;
          getPastGap = function getPastGap(index) {
            return index * ONE_HEIGHT_GAP;
          };
          CANVAS_MARGIN_TOP = 0;
          canvas = createCanvas(getMaxWidth(), getTotalHeight() + CANVAS_MARGIN_TOP + getPastGap(imgs.length - 1));
          ctx = canvas.getContext('2d');
          drawBackground();
          _i2 = 0;
        case 6:
          if (!(_i2 < imgs.length)) {
            _context.next = 9;
            break;
          }
          imgSrc = getSavePath(_i2);
          _dimensions = sizeOf(imgSrc);
          _oHeight = _dimensions.height, _oWidth = _dimensions.width;
          _context.next = 7;
          return loadImage(imgSrc);
        case 7:
          image = _context.sent;
          ctx.drawImage(image, 0, getPastHeight(dimensionMap.height, _i2) + getPastGap(_i2), _oWidth, _oHeight);
        case 8:
          _i2++;
          _context.next = 6;
          break;
        case 9:
          imgUrl = canvas.toDataURL();
          return _context.abrupt("return", imgUrl);
        case 10:
        case "end":
          return _context.stop();
      }
    }, _callee);
  }));
}

exports.mergeMultiCanvasPic = mergeMultiCanvasPic;