canvas-element.js 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. exports.__esModule = true;
  4. exports["default"] = void 0;
  5. var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
  6. var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
  7. var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
  8. var _emit = _interopRequireDefault(require("./event/emit"));
  9. function _createSuper(Derived) { return function () { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (_isNativeReflectConstruct()) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
  10. function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
  11. var CanvasElement = /*#__PURE__*/function (_EventEmit) {
  12. (0, _inheritsLoose2["default"])(CanvasElement, _EventEmit);
  13. var _super = _createSuper(CanvasElement);
  14. function CanvasElement(ctx) {
  15. var _this;
  16. _this = _EventEmit.call(this) || this;
  17. _this.context = ctx; // canvas实际的宽高 (width/height) * pixelRatio
  18. _this.width = 0;
  19. _this.height = 0;
  20. _this.style = {};
  21. _this.currentStyle = {}; // 用来标识是CanvasElement实例
  22. _this.isCanvasElement = true;
  23. return _this;
  24. }
  25. var _proto = CanvasElement.prototype;
  26. _proto.getContext = function getContext()
  27. /* type */
  28. {
  29. return this.context;
  30. };
  31. _proto.getBoundingClientRect = function getBoundingClientRect() {
  32. var width = this.width;
  33. var height = this.height; // 默认都处理成可视窗口的顶部位置
  34. return {
  35. top: 0,
  36. right: width,
  37. bottom: height,
  38. left: 0
  39. };
  40. };
  41. _proto.addEventListener = function addEventListener(type, listener) {
  42. this.on(type, listener);
  43. };
  44. _proto.removeEventListener = function removeEventListener(type, listener) {
  45. this.off(type, listener);
  46. };
  47. _proto.dispatchEvent = function dispatchEvent(type, e) {
  48. this.emit(type, e);
  49. };
  50. return CanvasElement;
  51. }(_emit["default"]);
  52. function supportEventListener(canvas) {
  53. if (!canvas) {
  54. return false;
  55. } // 非 HTMLCanvasElement
  56. if (canvas.nodeType !== 1 || !canvas.nodeName || canvas.nodeName.toLowerCase() !== 'canvas') {
  57. return false;
  58. } // 微信小程序canvas.getContext('2d')时也是CanvasRenderingContext2D
  59. // 也会有ctx.canvas, 而且nodeType也是1,所以还要在看下是否支持addEventListener
  60. var support = false;
  61. try {
  62. canvas.addEventListener('eventTest', function () {
  63. support = true;
  64. });
  65. canvas.dispatchEvent(new Event('eventTest'));
  66. } catch (error) {
  67. support = false;
  68. }
  69. return support;
  70. }
  71. var _default = {
  72. create: function create(ctx) {
  73. if (!ctx) {
  74. return null;
  75. }
  76. if (supportEventListener(ctx.canvas)) {
  77. return ctx.canvas;
  78. }
  79. return new CanvasElement(ctx);
  80. }
  81. };
  82. exports["default"] = _default;