1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531 |
- "use strict";
- Object.defineProperty(exports, "__esModule", {
- value: true
- });
- exports.default = void 0;
- var _DOMMatrix = _interopRequireDefault(require("./DOMMatrix"));
- var _CanvasPattern = _interopRequireDefault(require("./CanvasPattern"));
- var _parseColor = _interopRequireDefault(require("parse-color"));
- var _cssfontparser = _interopRequireDefault(require("cssfontparser"));
- var _TextMetrics = _interopRequireDefault(require("./TextMetrics"));
- var _createCanvasEvent = _interopRequireDefault(require("../mock/createCanvasEvent"));
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
- function parseCSSColor(value) {
- const result = (0, _parseColor.default)(value);
- if (result.rgba && result.rgba[3] !== 1) {
- return 'rgba(' + result.rgba.join(', ') + ')';
- }
- if (result.hex) {
- const hex = result.hex; // shorthand #ABC
- if (hex[1] === hex[2] && hex[3] === hex[4] && hex[5] === hex[6]) {
- return '#' + hex[1] + hex[3] + hex[5];
- }
- return result.hex;
- }
- return void 0;
- }
- const testFuncs = ['setLineDash', 'getLineDash', 'setTransform', 'getTransform', 'getImageData', 'save', 'restore', 'createPattern', 'createRadialGradient', 'addHitRegion', 'arc', 'arcTo', 'beginPath', 'clip', 'closePath', 'scale', 'stroke', 'clearHitRegions', 'clearRect', 'fillRect', 'strokeRect', 'rect', 'resetTransform', 'translate', 'moveTo', 'lineTo', 'bezierCurveTo', 'createLinearGradient', 'ellipse', 'measureText', 'rotate', 'drawImage', 'drawFocusIfNeeded', 'isPointInPath', 'isPointInStroke', 'putImageData', 'strokeText', 'fillText', 'quadraticCurveTo', 'removeHitRegion', 'fill', 'transform', 'scrollPathIntoView', 'createImageData'];
- const compositeOperations = ['source-over', 'source-in', 'source-out', 'source-atop', 'destination-over', 'destination-in', 'destination-out', 'destination-atop', 'lighter', 'copy', 'xor', 'multiply', 'screen', 'overlay', 'darken', 'lighten', 'color-dodge', 'color-burn', 'hard-light', 'soft-light', 'difference', 'exclusion', 'hue', 'saturation', 'color', 'luminosity'];
- function getTransformSlice(ctx) {
- return ctx._transformStack[ctx._stackIndex].slice();
- }
- class CanvasRenderingContext2D {
- /**
- * Every time a function call would result in a drawing operation, it should be added to this array.
- * This goes for only draw call functions.
- */
- __getDrawCalls() {
- return this._drawCalls.slice();
- }
- /**
- * Clear the list of draw calls
- */
- __clearDrawCalls() {
- this._drawCalls = [];
- }
- /**
- * Every time a function call results in something that would have modified the state of the context,
- * an event is added to this array. This goes for every property set, and draw call.
- */
- __getEvents() {
- return this._events.slice();
- }
- /**
- * Clear the list of events
- */
- __clearEvents() {
- this._events = [];
- }
- /**
- * This array keeps track of the current path, so that fill and stroke operations can store the
- * path.
- */
- __getPath() {
- return this._path.slice();
- }
- /**
- * Clear the path and reset it to a single beginPath event.
- */
- __clearPath() {
- const event = (0, _createCanvasEvent.default)('beginPath', getTransformSlice(this), {});
- this._path = [event];
- }
- constructor(canvas) {
- _defineProperty(this, "_drawCalls", []);
- _defineProperty(this, "_events", []);
- _defineProperty(this, "_path", [(0, _createCanvasEvent.default)('beginPath', [1, 0, 0, 1, 0, 0], {})]);
- _defineProperty(this, "_directionStack", ['inherit']);
- _defineProperty(this, "_fillStyleStack", ['#000']);
- _defineProperty(this, "_filterStack", ['none']);
- _defineProperty(this, "_fontStack", ['10px sans-serif']);
- _defineProperty(this, "_globalAlphaStack", [1.0]);
- _defineProperty(this, "_globalCompositeOperationStack", ['source-over']);
- _defineProperty(this, "_imageSmoothingEnabledStack", [true]);
- _defineProperty(this, "_imageSmoothingQualityStack", ['low']);
- _defineProperty(this, "_lineCapStack", ['butt']);
- _defineProperty(this, "_lineDashOffsetStack", [0]);
- _defineProperty(this, "_lineDashStack", [[]]);
- _defineProperty(this, "_lineJoinStack", ['miter']);
- _defineProperty(this, "_lineWidthStack", [1]);
- _defineProperty(this, "_miterLimitStack", [10]);
- _defineProperty(this, "_shadowBlurStack", [0]);
- _defineProperty(this, "_shadowColorStack", ['rgba(0, 0, 0, 0)']);
- _defineProperty(this, "_shadowOffsetXStack", [0]);
- _defineProperty(this, "_shadowOffsetYStack", [0]);
- _defineProperty(this, "_stackIndex", 0);
- _defineProperty(this, "_strokeStyleStack", ['#000']);
- _defineProperty(this, "_textAlignStack", ['start']);
- _defineProperty(this, "_textBaselineStack", ['alphabetic']);
- _defineProperty(this, "_transformStack", [[1, 0, 0, 1, 0, 0]]);
- testFuncs.forEach(key => {
- this[key] = jest.fn(CanvasRenderingContext2D.prototype[key].bind(this));
- });
- this._canvas = canvas;
- }
- addHitRegion(options = {}) {
- const {
- path,
- fillRule,
- id,
- parentID,
- cursor,
- control,
- label,
- role
- } = options;
- if (!path && !id) throw new DOMException('ConstraintError', 'Failed to execute \'addHitRegion\' on \'' + this.constructor.name + '\': Both id and control are null.');
- if (fillRule && fillRule !== 'evenodd' && fillRule !== 'nonzero') throw new TypeError('Failed to execute \'addHitRegion\' on \'' + this.constructor.name + '\': The provided value \'' + fillRule + '\' is not a valid enum value of type CanvasFillRule.');
- this._events.push((0, _createCanvasEvent.default)('addHitRegion', getTransformSlice(this), {
- path,
- fillRule,
- id,
- parentID,
- cursor,
- control,
- label,
- role
- }));
- }
- arc(x, y, radius, startAngle, endAngle, anticlockwise = false) {
- if (arguments.length < 5) throw new TypeError('Failed to execute \'arc\' on \'' + this.constructor.name + '\': 5 arguments required, but only ' + arguments.length + ' present.');
- const xResult = Number(x);
- const yResult = Number(y);
- const radiusResult = Number(radius);
- const startAngleResult = Number(startAngle);
- const endAngleResult = Number(endAngle);
- const anticlockwiseResult = Boolean(anticlockwise); // quick is finite check
- if (!Number.isFinite(xResult + yResult + radiusResult + startAngleResult + endAngleResult)) return;
- if (Number(radius) < 0) throw new DOMException('IndexSizeError', 'Failed to execute \'arc\' on \'' + this.constructor.name + '\': The radius provided (' + radius + ') is negative.');
- const event = (0, _createCanvasEvent.default)('arc', getTransformSlice(this), {
- x: xResult,
- y: yResult,
- radius: radiusResult,
- startAngle: startAngleResult,
- endAngle: endAngleResult,
- anticlockwise: anticlockwiseResult
- });
- this._path.push(event);
- this._events.push(event);
- }
- arcTo(cpx1, cpy1, cpx2, cpy2, radius) {
- if (arguments.length < 5) throw new DOMException('IndexSizeError', 'Failed to execute \'arcTo\' on \'' + this.constructor.name + '\': 5 arguments required, but only ' + arguments.length + ' present.');
- const cpx1Result = Number(cpx1);
- const cpy1Result = Number(cpy1);
- const cpx2Result = Number(cpx2);
- const cpy2Result = Number(cpy2);
- const radiusResult = Number(radius);
- if (!Number.isFinite(cpx1Result + cpx2Result + cpy1Result + cpy2Result + radiusResult)) return;
- if (radiusResult < 0) throw new TypeError('Failed to execute \'arcTo\' on \'' + this.constructor.name + '\': The radius provided (' + radius + ') is negative.');
- const event = (0, _createCanvasEvent.default)('arcTo', getTransformSlice(this), {
- cpx1: cpx1Result,
- cpy1: cpy1Result,
- cpx2: cpx2Result,
- cpy2: cpy2Result,
- radius: radiusResult
- });
- this._path.push(event);
- this._events.push(event);
- }
- beginPath() {
- this.__clearPath(); // push the generated beginPath to the event list
- this._events.push(this._path[0]);
- }
- bezierCurveTo(cpx1, cpy1, cpx2, cpy2, x, y) {
- if (arguments.length < 6) throw new TypeError('Failed to execute \'bezierCurveTo\' on \'' + this.constructor.name + '\': 6 arguments required, but only ' + arguments.length + ' present.');
- const cpx1Result = Number(cpx1);
- const cpy1Result = Number(cpy1);
- const cpx2Result = Number(cpx2);
- const cpy2Result = Number(cpy2);
- const xResult = Number(x);
- const yResult = Number(y);
- if (!Number.isFinite(cpx1Result + cpy1Result + cpx2Result + cpy2Result + xResult + yResult)) return;
- const event = (0, _createCanvasEvent.default)('bezierCurveTo', getTransformSlice(this), {
- cpx1,
- cpy1,
- cpx2,
- cpy2,
- x,
- y
- });
- this._path.push(event);
- this._events.push(event);
- }
- get canvas() {
- return this._canvas;
- }
- clearHitRegions() {
- const event = (0, _createCanvasEvent.default)('clearHitRegions', getTransformSlice(this), {});
- this._events.push(event);
- }
- clearRect(x, y, width, height) {
- if (arguments.length < 4) throw new TypeError('Failed to execute \'clearRect\' on \'' + this.constructor.name + '\': 4 arguments required, but only ' + arguments.length + ' present.');
- const xResult = Number(x);
- const yResult = Number(y);
- const widthResult = Number(width);
- const heightResult = Number(height);
- if (!Number.isFinite(x + y + width + height)) return;
- const event = (0, _createCanvasEvent.default)('clearRect', getTransformSlice(this), {
- x: xResult,
- y: yResult,
- width: widthResult,
- height: heightResult
- });
- this._events.push(event);
- this._drawCalls.push(event);
- }
- clip(path, fillRule) {
- if (arguments.length === 0) {
- fillRule = 'nonzero';
- path = this._path.slice();
- } else {
- if (arguments.length === 1) fillRule = 'nonzero';
- if (path instanceof Path2D) {
- fillRule = String(fillRule);
- if (fillRule !== 'nonzero' && fillRule !== 'evenodd') throw new TypeError('Failed to execute \'clip\' on \'' + this.constructor.name + '\': The provided value \'' + fillRule + '\' is not a valid enum value of type CanvasFillRule.');
- path = path._path.slice();
- } else {
- fillRule = String(path);
- if (fillRule !== 'nonzero' && fillRule !== 'evenodd') throw new TypeError('Failed to execute \'clip\' on \'' + this.constructor.name + '\': The provided value \'' + fillRule + '\' is not a valid enum value of type CanvasFillRule.');
- path = this._path.slice();
- }
- }
- const event = (0, _createCanvasEvent.default)('clip', getTransformSlice(this), {
- path,
- fillRule
- });
- this._path.push(event);
- this._events.push(event);
- }
- closePath() {
- const event = (0, _createCanvasEvent.default)('closePath', getTransformSlice(this), {});
- this._events.push(event);
- this._path.push(event);
- }
- createImageData(width, height) {
- if (arguments.length < 1) throw new TypeError('Failed to execute \'createImageData\' on \'' + this.constructor.name + '\': 1 argument required, but only 0 present.');else if (arguments.length === 1) {
- if (!(width instanceof ImageData)) throw new TypeError('Failed to execute \'createImageData\' on \'' + this.constructor.name + '\': parameter 1 is not of type \'ImageData\'.');
- let result = new ImageData(width.width, width.height);
- result.data.set(width.data);
- const event = (0, _createCanvasEvent.default)('createImageData', getTransformSlice(this), {
- width: width.width,
- height: width.height
- });
- this._events.push(event);
- return result;
- } else {
- width = Math.abs(Number(width));
- height = Math.abs(Number(height));
- if (!Number.isFinite(width) || width === 0) throw new TypeError('Failed to execute \'createImageData\' on \'' + this.constructor.name + '\': The source width is 0.');
- if (!Number.isFinite(height) || height === 0) throw new TypeError('Failed to execute \'createImageData\' on \'' + this.constructor.name + '\': The source height is 0.');
- const event = (0, _createCanvasEvent.default)('createImageData', getTransformSlice(this), {
- width,
- height
- });
- this._events.push(event);
- return new ImageData(width, height);
- }
- }
- createLinearGradient(x0, y0, x1, y1) {
- if (arguments.length < 4) throw new TypeError('Failed to execute \'createLinearGradient\' on \'' + this.constructor.name + '\': 4 arguments required, but only ' + arguments.length + ' present.');
- const x0Result = Number(x0);
- const y0Result = Number(y0);
- const x1Result = Number(x1);
- const y1Result = Number(y1);
- if (!Number.isFinite(x0Result + y0Result + x1Result + y1Result)) throw new TypeError('Failed to execute \'createLinearGradient\' on \'' + this.constructor.name + '\': The provided double value is non-finite.');
- const event = (0, _createCanvasEvent.default)('createLinearGradient', getTransformSlice(this), {
- x0: x0Result,
- y0: y0Result,
- x1: x1Result,
- y1: y1Result
- });
- this._events.push(event);
- return new CanvasGradient();
- }
- createPattern(image, type) {
- if (arguments.length === 1) throw new TypeError('Failed to execute \'createPattern\' on \'' + this.constructor.name + '\': 2 arguments required, but only 1 present.');
- if (type === null) type = 'repeat';
- if (type === '') type = 'repeat';
- if (type === 'repeat' || type === 'repeat-x' || type === 'repeat-y' || type === 'no-repeat') {
- const event = (0, _createCanvasEvent.default)('createPattern', getTransformSlice(this), {
- image,
- type
- });
- if (image instanceof ImageBitmap) {
- if (image._closed) throw new DOMException('InvalidStateError', 'Failed to execute \'createPattern\' on \'CanvasRenderingContext2D\': The image source is detached.');
- this._events.push(event);
- return new _CanvasPattern.default();
- }
- if (image instanceof HTMLImageElement) {
- this._events.push(event);
- return new _CanvasPattern.default();
- }
- if (image instanceof HTMLVideoElement) {
- this._events.push(event);
- return new _CanvasPattern.default();
- }
- if (image instanceof HTMLCanvasElement) {
- this._events.push(event);
- return new _CanvasPattern.default();
- }
- } else {
- throw new TypeError('Failed to execute \'createPattern\' on \'' + this.constructor.name + '\': The provided type (\'' + type + '\') is not one of \'repeat\', \'no-repeat\', \'repeat-x\', or \'repeat-y\'.');
- }
- throw new TypeError('Failed to execute \'createPattern\' on \'' + this.constructor.name + '\': The provided value is not of type \'(CSSImageValue or HTMLImageElement or SVGImageElement or HTMLVideoElement or HTMLCanvasElement or ImageBitmap or OffscreenCanvas)\'');
- }
- createRadialGradient(x0, y0, r0, x1, y1, r1) {
- if (arguments.length < 6) throw new TypeError('Failed to execute \'createRadialGradient\' on \'' + this.constructor.name + '\': 6 arguments required, but only ' + arguments.length + ' present.');
- const x0Result = Number(x0);
- const y0Result = Number(y0);
- const r0Result = Number(r0);
- const x1Result = Number(x1);
- const y1Result = Number(y1);
- const r1Result = Number(r1);
- if (!Number.isFinite(x0Result + y0Result + r0Result + x1Result + y1Result + r1Result)) throw new TypeError('Failed to execute \'createRadialGradient\' on \'' + this.constructor.name + '\': The provided double value is non-finite.');
- if (r0Result < 0) throw new DOMException('IndexSizeError', 'Failed to execute \'createRadialGradient\' on \'' + this.constructor.name + '\': The r0 provided is less than 0.');
- if (r1Result < 0) throw new DOMException('IndexSizeError', 'Failed to execute \'createRadialGradient\' on \'' + this.constructor.name + '\': The r1 provided is less than 0.');
- const event = (0, _createCanvasEvent.default)('createRadialGradient', getTransformSlice(this), {
- x0: x0Result,
- y0: y0Result,
- r0: r0Result,
- x1: x1Result,
- y1: y1Result,
- r1: r1Result
- });
- this._events.push(event);
- return new CanvasGradient();
- }
- set currentTransform(value) {
- if (value instanceof _DOMMatrix.default) {
- this._transformStack[this._stackIndex][0] = value.a;
- this._transformStack[this._stackIndex][1] = value.b;
- this._transformStack[this._stackIndex][2] = value.c;
- this._transformStack[this._stackIndex][3] = value.d;
- this._transformStack[this._stackIndex][4] = value.e;
- this._transformStack[this._stackIndex][5] = value.f;
- const event = (0, _createCanvasEvent.default)('currentTransform', getTransformSlice(this), {
- a: value.a,
- b: value.b,
- c: value.c,
- d: value.d,
- e: value.e,
- f: value.f
- });
- this._events.push(event);
- }
- }
- get currentTransform() {
- return new _DOMMatrix.default(this._transformStack[this._stackIndex]);
- }
- set direction(value) {
- if (value === 'rtl' || value === 'ltr' || value === 'inherit') {
- this._directionStack[this._stackIndex] = value;
- const event = (0, _createCanvasEvent.default)('direction', getTransformSlice(this), {
- value
- });
- this._events.push(event);
- }
- }
- get direction() {
- return this._directionStack[this._stackIndex];
- }
- drawFocusIfNeeded(path, element) {
- if (arguments.length === 0) throw new TypeError('Failed to execute \'drawFocusIfNeeded\' on \'' + this.constructor.name + '\': 1 argument required, but only 0 present.');
- if (arguments.length === 2 && !(path instanceof Path2D)) throw new TypeError('Failed to execute \'drawFocusIfNeeded\' on \'' + this.constructor.name + '\': parameter 1 is not of type \'Path2D\'.');
- if (arguments.length === 1) {
- element = path;
- path = null;
- }
- if (!(element instanceof Element)) throw new TypeError('Failed to execute \'drawFocusIfNeeded\' on \'' + this.constructor.name + '\': parameter ' + arguments.length + ' is not of type \'Element\'.');
- const event = (0, _createCanvasEvent.default)('drawFocusIfNeeded', getTransformSlice(this), {
- path: path ? path._path : null,
- element
- });
- this._events.push(event);
- }
- drawImage(img, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight) {
- if (arguments.length < 3) throw new TypeError('Failed to execute \'drawImage\' on \'' + this.constructor.name + '\': 3 arguments required, but only ' + arguments.length + ' present.');
- if (arguments.length === 4 || arguments.length > 5 && arguments.length < 9) throw new TypeError('Failed to execute \'drawImage\' on \'' + this.constructor.name + '\': Valid arities are: [3, 5, 9], but 4 arguments provided.');
- let valid = false;
- if (img instanceof HTMLImageElement) valid = true;
- ;
- if (img instanceof ImageBitmap) {
- if (img._closed) throw new DOMException('InvalidStateError', 'DOMException: Failed to execute \'drawImage\' on \'CanvasRenderingContext2D\': The image source is detached.');
- valid = true;
- }
- if (img instanceof HTMLVideoElement) valid = true;
- if (img instanceof HTMLCanvasElement) valid = true;
- if (!valid) throw new TypeError('Failed to execute \'drawImage\' on \'' + this.constructor.name + '\': The provided value is not of type \'(CSSImageValue or HTMLImageElement or SVGImageElement or HTMLVideoElement or HTMLCanvasElement or ImageBitmap or OffscreenCanvas)\'');
- const sxResult = Number(sx);
- const syResult = Number(sy);
- const sWidthResult = Number(sWidth);
- const sHeightResult = Number(sHeight);
- const dxResult = Number(dx);
- const dyResult = Number(dy);
- const dWidthResult = Number(dWidth);
- const dHeightResult = Number(dHeight);
- if (arguments.length === 3) {
- if (!Number.isFinite(sxResult + syResult)) return;
- sx = 0;
- sy = 0;
- sWidth = img.width;
- sHeight = img.height;
- dx = sxResult;
- dy = syResult;
- dWidth = img.width;
- dHeight = img.height;
- } else if (arguments.length === 5) {
- if (!Number.isFinite(sxResult + syResult + sWidthResult + sHeightResult)) return;
- sx = 0;
- sy = 0;
- sWidth = img.width;
- sHeight = img.height;
- dx = sxResult;
- dy = syResult;
- dWidth = sWidth;
- dHeight = sHeight;
- } else {
- if (!Number.isFinite(sx + sy + sWidth + sHeight + dx + dy + dWidth + dHeight)) return;
- sx = sxResult;
- sy = syResult;
- sWidth = sWidthResult;
- sHeight = sHeightResult;
- dx = dxResult;
- dy = dyResult;
- dWidth = dWidthResult;
- dHeight = dHeightResult;
- }
- const event = (0, _createCanvasEvent.default)('drawImage', getTransformSlice(this), {
- img,
- sx,
- sy,
- sWidth,
- sHeight,
- dx,
- dy,
- dWidth,
- dHeight
- });
- this._events.push(event);
- this._drawCalls.push(event);
- }
- ellipse(x, y, radiusX, radiusY, rotation, startAngle, endAngle, anticlockwise = false) {
- if (arguments.length < 7) throw new TypeError('Failed to execute \'ellipse\' on \'' + this.constructor.name + '\': 6 arguments required, but only ' + arguments.length + ' present.');
- const xResult = Number(x);
- const yResult = Number(y);
- const radiusXResult = Number(radiusX);
- const radiusYResult = Number(radiusY);
- const rotationResult = Number(rotation);
- const startAngleResult = Number(startAngle);
- const endAngleResult = Number(endAngle);
- const anticlockwiseResult = Boolean(anticlockwise);
- if (!Number.isFinite(xResult + yResult + radiusXResult + radiusYResult + rotationResult + startAngleResult + endAngleResult)) return;
- if (Number(radiusX) < 0) throw new DOMException('IndexSizeError', 'Failed to execute \'ellipse\' on \'' + this.constructor.name + '\': The major-axis radius provided (' + radiusX + ') is negative.');
- if (Number(radiusY) < 0) throw new DOMException('IndexSizeError', 'Failed to execute \'ellipse\' on \'' + this.constructor.name + '\': The minor-axis radius provided (' + radiusY + ') is negative.');
- const event = (0, _createCanvasEvent.default)('ellipse', getTransformSlice(this), {
- x: xResult,
- y: yResult,
- radiusX: radiusXResult,
- radiusY: radiusYResult,
- rotation: rotationResult,
- startAngle: startAngleResult,
- endAngle: endAngleResult,
- anticlockwise: anticlockwiseResult
- });
- this._path.push(event);
- this._events.push(event);
- }
- fill(path, fillRule) {
- if (arguments.length === 0) {
- fillRule = 'nonzero';
- path = this._path.slice();
- } else {
- if (arguments.length === 1) fillRule = 'nonzero';
- if (path instanceof Path2D) {
- fillRule = String(fillRule);
- if (fillRule !== 'nonzero' && fillRule !== 'evenodd') throw new TypeError('Failed to execute \'clip\' on \'' + this.constructor.name + '\': The provided value \'' + fillRule + '\' is not a valid enum value of type CanvasFillRule.');
- path = path._path.slice();
- } else {
- fillRule = String(path);
- if (fillRule !== 'nonzero' && fillRule !== 'evenodd') throw new TypeError('Failed to execute \'clip\' on \'' + this.constructor.name + '\': The provided value \'' + fillRule + '\' is not a valid enum value of type CanvasFillRule.');
- path = this._path.slice();
- }
- }
- const event = (0, _createCanvasEvent.default)('fill', getTransformSlice(this), {
- path,
- fillRule
- });
- this._events.push(event);
- this._drawCalls.push(event);
- }
- fillRect(x, y, width, height) {
- if (arguments.length < 4) throw new TypeError('Failed to execute \'fillRect\' on \'' + this.constructor.name + '\': 4 arguments required, but only ' + arguments.length + ' present.');
- const xResult = Number(x);
- const yResult = Number(y);
- const widthResult = Number(width);
- const heightResult = Number(height);
- if (!Number.isFinite(x + y + width + height)) return;
- const event = (0, _createCanvasEvent.default)('fillRect', getTransformSlice(this), {
- x: xResult,
- y: yResult,
- width: widthResult,
- height: heightResult
- });
- this._events.push(event);
- this._drawCalls.push(event);
- }
- set fillStyle(value) {
- let valid = false;
- if (typeof value === 'string') {
- const result = parseCSSColor(value);
- if (result) {
- valid = true;
- value = this._fillStyleStack[this._stackIndex] = result;
- }
- } else if (value instanceof CanvasGradient || value instanceof _CanvasPattern.default) {
- valid = true;
- this._fillStyleStack[this._stackIndex] = value;
- }
- if (valid) {
- const event = (0, _createCanvasEvent.default)('fillStyle', getTransformSlice(this), {
- value
- });
- this._events.push(event);
- }
- }
- get fillStyle() {
- return this._fillStyleStack[this._stackIndex];
- }
- fillText(text, x, y, maxWidth) {
- if (arguments.length < 3) throw new TypeError('Failed to execute \'fillText\' on \'' + this.constructor.name + '\': 3 arguments required, but only ' + arguments.length + ' present.');
- const textResult = String(text);
- const xResult = Number(x);
- const yResult = Number(y);
- const maxWidthResult = Number(maxWidth);
- if (arguments.length === 3 && !Number.isFinite(xResult + yResult)) return;
- if (arguments.length > 3 && !Number.isFinite(xResult + yResult + maxWidthResult)) return;
- const event = (0, _createCanvasEvent.default)('fillText', getTransformSlice(this), {
- text: textResult,
- x: xResult,
- y: yResult,
- maxWidth: arguments.length === 3 ? null : maxWidthResult
- });
- this._events.push(event);
- this._drawCalls.push(event);
- }
- set filter(value) {
- if (value === '') value = 'none';
- value = this._filterStack[this._stackIndex] = typeof value === 'string' ? value : 'none';
- const event = (0, _createCanvasEvent.default)('filter', getTransformSlice(this), {
- value
- });
- this._events.push(event);
- }
- get filter() {
- return this._filterStack[this._stackIndex];
- }
- set font(value) {
- let ex;
- try {
- const result = (0, _cssfontparser.default)(value);
- value = this._fontStack[this._stackIndex] = result.toString();
- const event = (0, _createCanvasEvent.default)('font', getTransformSlice(this), {
- value
- });
- this._events.push(event);
- } catch (ex) {}
- }
- get font() {
- return this._fontStack[this._stackIndex];
- }
- getImageData() {
- return new ImageData(this._canvas.width, this._canvas.height);
- }
- getLineDash() {
- return this._lineDashStack[this._stackIndex];
- }
- getTransform() {
- return new _DOMMatrix.default(this._transformStack[this._stackIndex]);
- }
- set globalAlpha(value) {
- value = Number(value);
- if (!Number.isFinite(value)) return;
- if (value < 0) return;
- if (value > 1) return;
- this._globalAlphaStack[this._stackIndex] = value;
- const event = (0, _createCanvasEvent.default)('globalAlpha', getTransformSlice(this), {
- value
- });
- this._events.push(event);
- }
- get globalAlpha() {
- return this._globalAlphaStack[this._stackIndex];
- }
- set globalCompositeOperation(value) {
- if (compositeOperations.indexOf(value) !== -1) {
- this._globalCompositeOperationStack[this._stackIndex] = value;
- const event = (0, _createCanvasEvent.default)('globalCompositeOperation', getTransformSlice(this), {
- value
- });
- this._events.push(event);
- }
- }
- get globalCompositeOperation() {
- return this._globalCompositeOperationStack[this._stackIndex];
- }
- set imageSmoothingEnabled(value) {
- value = this._imageSmoothingEnabledStack[this._stackIndex] = Boolean(value);
- const event = (0, _createCanvasEvent.default)('imageSmoothingEnabled', getTransformSlice(this), {
- value
- });
- this._events.push(event);
- }
- get imageSmoothingEnabled() {
- return this._imageSmoothingEnabledStack[this._stackIndex];
- }
- set imageSmoothingQuality(value) {
- if (value === 'high' || value === 'medium' || value === 'low') {
- this._imageSmoothingQualityStack[this._stackIndex] = value;
- const event = (0, _createCanvasEvent.default)('imageSmoothingQuality', getTransformSlice(this), {
- value
- });
- this._events.push(event);
- }
- }
- get imageSmoothingQuality() {
- return this._imageSmoothingQualityStack[this._stackIndex];
- }
- isPointInPath(path, x, y, fillRule = 'nonzero') {
- if (arguments.length < 2) throw new TypeError('Failed to execute \'isPointInPath\' on \'' + this.constructor.name + '\': 2 arguments required, but only ' + arguments.length + ' present.');
- if (!(path instanceof Path2D)) {
- if (arguments.length > 2) {
- fillRule = y;
- }
- y = x;
- x = path;
- }
- if (fillRule !== 'nonzero' && fillRule !== 'evenodd') throw new TypeError('Failed to execute \'isPointInPath\' on \'' + this.constructor.name + '\': The provided value \'' + fillRule + '\' is not a valid enum value of type CanvasFillRule.');
- const event = (0, _createCanvasEvent.default)('isPointInPath', getTransformSlice(this), {
- x: Number(x),
- y: Number(y),
- fillRule,
- path: path instanceof Path2D ? path._path.slice() : this._path.slice()
- });
- this._events.push(event);
- return false; // return false in a mocking environment, unless I can verify a point is actually within the path
- }
- isPointInStroke(path, x, y) {
- if (arguments.length < 2) throw new TypeError('Failed to execute \'isPointInStroke\' on \'' + this.constructor.name + '\': 2 arguments required, but only ' + arguments.length + ' present.');
- if (!(path instanceof Path2D)) {
- y = x;
- x = path;
- }
- const event = (0, _createCanvasEvent.default)('isPointInPath', getTransformSlice(this), {
- x: Number(x),
- y: Number(y),
- path: path instanceof Path2D ? path._path.slice() : this._path.slice()
- });
- this._events.push(event);
- return false; // return false in a mocking environment, unless I can verify a point is actually within the path
- }
- set lineCap(value) {
- if (value === 'butt' || value === 'round' || value === 'square') {
- this._lineCapStack[this._stackIndex] = value;
- const event = (0, _createCanvasEvent.default)('lineCap', getTransformSlice(this), {
- value
- });
- this._events.push(event);
- }
- }
- get lineCap() {
- return this._lineCapStack[this._stackIndex];
- }
- set lineDashOffset(value) {
- const result = Number(value);
- if (Number.isFinite(result)) {
- this._lineDashOffsetStack[this._stackIndex] = result;
- const event = (0, _createCanvasEvent.default)('lineDashOffset', getTransformSlice(this), {
- value
- });
- this._events.push(event);
- }
- }
- get lineDashOffset() {
- return this._lineDashOffsetStack[this._stackIndex];
- }
- set lineJoin(value) {
- if (value === 'round' || value === 'bevel' || value === 'miter') {
- this._lineJoinStack[this._stackIndex] = value;
- const event = (0, _createCanvasEvent.default)('lineJoin', getTransformSlice(this), {
- value
- });
- this._events.push(event);
- }
- }
- get lineJoin() {
- return this._lineJoinStack[this._stackIndex];
- }
- lineTo(x, y) {
- if (arguments.length < 2) throw new TypeError('Failed to execute \'lineTo\' on \'' + this.constructor.name + '\': 2 arguments required, but only ' + arguments.length + ' present.');
- const xResult = Number(x);
- const yResult = Number(y);
- if (!Number.isFinite(xResult + yResult)) return;
- const event = (0, _createCanvasEvent.default)('lineTo', getTransformSlice(this), {
- x: xResult,
- y: yResult
- });
- this._events.push(event);
- this._path.push(event);
- }
- set lineWidth(value) {
- const result = Number(value);
- if (Number.isFinite(result) && result > 0) {
- this._lineWidthStack[this._stackIndex] = result;
- const event = (0, _createCanvasEvent.default)('lineWidth', getTransformSlice(this), {
- value: result
- });
- this._events.push(event);
- }
- }
- get lineWidth() {
- return this._lineWidthStack[this._stackIndex];
- }
- measureText(text) {
- if (arguments.length < 1) throw new TypeError('Failed to execute \'measureText\' on \'' + this.constructor.name + '\': 1 argument required, but only 0 present.');
- text = text == null ? '' : text;
- text = text.toString();
- const event = (0, _createCanvasEvent.default)('measureText', getTransformSlice(this), {
- text
- });
- this._events.push(event);
- return new _TextMetrics.default(text);
- }
- set miterLimit(value) {
- const result = Number(value);
- if (Number.isFinite(result) && result > 0) {
- this._miterLimitStack[this._stackIndex] = result;
- const event = (0, _createCanvasEvent.default)('lineWidth', getTransformSlice(this), {
- value: result
- });
- this._events.push(event);
- }
- }
- get miterLimit() {
- return this._miterLimitStack[this._stackIndex];
- }
- moveTo(x, y) {
- if (arguments.length < 2) throw new TypeError('Failed to execute \'moveTo\' on \'' + this.constructor.name + '\': 2 arguments required, but only ' + arguments.length + ' present.');
- const xResult = Number(x);
- const yResult = Number(y);
- if (!Number.isFinite(x + y)) return;
- const event = (0, _createCanvasEvent.default)('moveTo', getTransformSlice(this), {
- x: xResult,
- y: yResult
- });
- this._events.push(event);
- this._path.push(event);
- }
- putImageData(data, x, y, dirtyX, dirtyY, dirtyWidth, dirtyHeight) {
- if (arguments.length < 3) throw new TypeError('Failed to execute \'putImageData\' on \'' + this.constructor.name + '\': 3 arguments required, but only ' + arguments.length + ' present.');
- if (arguments.length > 3 && arguments.length < 7) throw new TypeError('Failed to execute \'putImageData\' on \'' + this.constructor.name + '\': Valid arities are: [3, 7], but ' + arguments.length + ' arguments provided.');
- if (!(data instanceof ImageData)) throw new TypeError('Failed to execute \'putImageData\' on \'' + this.constructor.name + '\': parameter 1 is not of type \'ImageData\'.');
- const xResult = Number(x);
- const yResult = Number(y);
- const dirtyXResult = Number(dirtyX);
- const dirtyYResult = Number(dirtyY);
- const dirtyWidthResult = Number(dirtyWidth);
- const dirtyHeightResult = Number(dirtyHeight);
- if (arguments.length === 3) {
- if (!Number.isFinite(xResult + yResult)) return;
- } else {
- if (!Number.isFinite(xResult + yResult + dirtyXResult + dirtyYResult + dirtyWidthResult + dirtyHeightResult)) return;
- }
- const event = (0, _createCanvasEvent.default)('putImageData', getTransformSlice(this), {
- x: xResult,
- y: yResult,
- dirtyX: dirtyXResult,
- dirtyY: dirtyYResult,
- dirtyWidth: dirtyWidthResult,
- dirtyHeight: dirtyHeightResult
- });
- this._events.push(event);
- }
- quadraticCurveTo(cpx, cpy, x, y) {
- if (arguments.length < 4) throw new TypeError('Failed to execute \'quadraticCurveTo\' on \'' + this.constructor.name + '\': 4 arguments required, but only ' + arguments.length + ' present.');
- const cpxResult = Number(cpx);
- const cpyResult = Number(cpy);
- const xResult = Number(x);
- const yResult = Number(y);
- if (!Number.isFinite(cpxResult + cpyResult + xResult + yResult)) return;
- const event = (0, _createCanvasEvent.default)('quadraticCurveTo', getTransformSlice(this), {
- cpx: cpxResult,
- cpy: cpyResult,
- x: xResult,
- y: yResult
- });
- this._events.push(event);
- }
- rect(x, y, width, height) {
- if (arguments.length < 4) throw new TypeError('Failed to execute \'rect\' on \'' + this.constructor.name + '\': 4 arguments required, but only ' + arguments.length + ' present.');
- if (!Number.isFinite(x + y + width + height)) return;
- const xResult = Number(x);
- const yResult = Number(y);
- const widthResult = Number(width);
- const heightResult = Number(height);
- const event = (0, _createCanvasEvent.default)('rect', getTransformSlice(this), {
- x: xResult,
- y: yResult,
- width: widthResult,
- height: heightResult
- });
- this._events.push(event);
- this._path.push(event);
- }
- removeHitRegion(id) {
- if (arguments.length < 1) throw new TypeError('Failed to execute \'removeHitRegion\' on \'' + this.constructor.name + '\': 1 argument required, but only ' + arguments.length + ' present.');
- const event = (0, _createCanvasEvent.default)('removeHitRegion', getTransformSlice(this), {
- id
- });
- this._events.push(event);
- }
- resetTransform() {
- this._transformStack[this._stackIndex][0] = 1;
- this._transformStack[this._stackIndex][1] = 0;
- this._transformStack[this._stackIndex][2] = 0;
- this._transformStack[this._stackIndex][3] = 1;
- this._transformStack[this._stackIndex][4] = 0;
- this._transformStack[this._stackIndex][5] = 0;
- const event = (0, _createCanvasEvent.default)('resetTransform', getTransformSlice(this), {
- a: 1,
- b: 0,
- c: 0,
- d: 1,
- e: 0,
- f: 0
- });
- this._events.push(event);
- }
- restore() {
- if (this._stackIndex <= 0) return;
- this._transformStack.pop();
- this._directionStack.pop();
- this._fillStyleStack.pop();
- this._filterStack.pop();
- this._fontStack.pop();
- this._globalAlphaStack.pop();
- this._globalCompositeOperationStack.pop();
- this._imageSmoothingEnabledStack.pop();
- this._imageSmoothingQualityStack.pop();
- this._lineCapStack.pop();
- this._lineDashStack.pop();
- this._lineDashOffsetStack.pop();
- this._lineJoinStack.pop();
- this._lineWidthStack.pop();
- this._miterLimitStack.pop();
- this._shadowBlurStack.pop();
- this._shadowColorStack.pop();
- this._shadowOffsetXStack.pop();
- this._shadowOffsetYStack.pop();
- this._strokeStyleStack.pop();
- this._textAlignStack.pop();
- this._textBaselineStack.pop();
- this._stackIndex -= 1;
- const event = (0, _createCanvasEvent.default)('restore', getTransformSlice(this), {});
- this._events.push(event);
- }
- rotate(angle) {
- if (arguments.length < 1) throw new TypeError('Failed to execute \'rotate\' on \'' + this.constructor.name + '\': 1 argument required, but only 0 present.');
- angle = Number(angle);
- if (!Number.isFinite(angle)) return;
- const a = this._transformStack[this._stackIndex][0];
- const b = this._transformStack[this._stackIndex][1];
- const c = this._transformStack[this._stackIndex][2];
- const d = this._transformStack[this._stackIndex][3];
- const cos = Math.cos(angle);
- const sin = Math.sin(angle);
- this._transformStack[this._stackIndex][0] = a * cos + c * sin;
- this._transformStack[this._stackIndex][1] = b * cos + d * sin;
- this._transformStack[this._stackIndex][2] = c * cos - a * sin;
- this._transformStack[this._stackIndex][3] = d * cos - b * sin;
- const event = (0, _createCanvasEvent.default)('rotate', getTransformSlice(this), {
- angle
- });
- this._events.push(event);
- }
- save() {
- this._transformStack.push(this._transformStack[this._stackIndex].slice());
- this._directionStack.push(this._directionStack[this._stackIndex]);
- this._fillStyleStack.push(this._fillStyleStack[this._stackIndex]);
- this._filterStack.push(this._filterStack[this._stackIndex]);
- this._fontStack.push(this._fontStack[this._stackIndex]);
- this._globalAlphaStack.push(this._globalAlphaStack[this._stackIndex]);
- this._globalCompositeOperationStack.push(this._globalCompositeOperationStack[this._stackIndex]);
- this._imageSmoothingEnabledStack.push(this._imageSmoothingEnabledStack[this._stackIndex]);
- this._imageSmoothingQualityStack.push(this._imageSmoothingQualityStack[this._stackIndex]);
- this._lineCapStack.push(this._lineCapStack[this._stackIndex]);
- this._lineDashStack.push(this._lineDashStack[this._stackIndex]);
- this._lineDashOffsetStack.push(this._lineDashOffsetStack[this._stackIndex]);
- this._lineJoinStack.push(this._lineJoinStack[this._stackIndex]);
- this._lineWidthStack.push(this._lineWidthStack[this._stackIndex]);
- this._miterLimitStack.push(this._miterLimitStack[this._stackIndex]);
- this._shadowBlurStack.push(this._shadowBlurStack[this._stackIndex]);
- this._shadowColorStack.push(this._shadowColorStack[this._stackIndex]);
- this._shadowOffsetXStack.push(this._shadowOffsetXStack[this._stackIndex]);
- this._shadowOffsetYStack.push(this._shadowOffsetYStack[this._stackIndex]);
- this._strokeStyleStack.push(this._strokeStyleStack[this._stackIndex]);
- this._textAlignStack.push(this._textAlignStack[this._stackIndex]);
- this._textBaselineStack.push(this._textBaselineStack[this._stackIndex]);
- this._stackIndex += 1;
- const event = (0, _createCanvasEvent.default)('save', getTransformSlice(this), {});
- this._events.push(event);
- }
- scale(x, y) {
- if (arguments.length < 2) throw new TypeError('Failed to execute \'scale\' on \'' + this.constructor.name + '\': 2 arguments required, but only ' + arguments.length + ' present.');
- const xResult = Number(x);
- const yResult = Number(y);
- if (Number.isFinite(xResult) && Number.isFinite(yResult)) {
- this._transformStack[this._stackIndex][0] *= xResult;
- this._transformStack[this._stackIndex][1] *= xResult;
- this._transformStack[this._stackIndex][2] *= yResult;
- this._transformStack[this._stackIndex][3] *= yResult;
- const event = (0, _createCanvasEvent.default)('scale', getTransformSlice(this), {
- x: xResult,
- y: yResult
- });
- this._events.push(event);
- }
- }
- scrollPathIntoView(path) {
- if (arguments.length > 0 && path instanceof Path2D) path = path._path.slice();else path = this._path.slice();
- const event = (0, _createCanvasEvent.default)('scrollPathIntoView', getTransformSlice(this), {
- path
- });
- this._events.push(event);
- }
- setLineDash(lineDash) {
- const isSequence = [Array, Int8Array, Uint8Array, Int16Array, Uint16Array, Int32Array, Uint32Array, Float32Array, Float64Array].reduce((left, right) => left || lineDash instanceof right, false);
- if (!isSequence) throw new TypeError('Failed to execute \'setLineDash\' on \'' + this.constructor.name + '\': The provided value cannot be converted to a sequence.');
- let result = [];
- for (let i = 0; i < lineDash.length; i++) {
- const value = Number(lineDash[i]);
- if (Number.isFinite(value) && value >= 0) {
- result.push(value);
- } else {
- return;
- }
- }
- result = this._lineDashStack[this._stackIndex] = result.length % 2 === 1 ? result.concat(result) : result;
- const event = (0, _createCanvasEvent.default)('setLineDash', getTransformSlice(this), {
- value: result.slice()
- });
- this._events.push(event);
- }
- setTransform(a, b, c, d, e, f) {
- if (arguments.length === 0) {
- a = 1;
- b = 0;
- c = 0;
- d = 1;
- e = 0;
- f = 0;
- } else if (arguments.length === 1) {
- if (a instanceof _DOMMatrix.default) {
- let transform = a;
- a = transform.a;
- b = transform.b;
- c = transform.c;
- d = transform.d;
- e = transform.e;
- f = transform.f;
- } else {
- throw new TypeError('Failed to execute \'setTransform\' on \'' + this.constructor.name + '\': parameter ' + a + ' (\'transform\') is not an object.');
- }
- } else if (arguments.length < 6) {
- throw new TypeError('Failed to execute \'setTransform\' on \'' + this.constructor.name + '\': Valid arities are: [0, 1, 6], but ' + arguments.length + ' arguments provided.');
- }
- a = Number(a);
- b = Number(b);
- c = Number(c);
- d = Number(d);
- e = Number(e);
- f = Number(f);
- if (!Number.isFinite(a + b + c + d + e + f)) return;
- this._transformStack[this._stackIndex][0] = a;
- this._transformStack[this._stackIndex][1] = b;
- this._transformStack[this._stackIndex][2] = c;
- this._transformStack[this._stackIndex][3] = d;
- this._transformStack[this._stackIndex][4] = e;
- this._transformStack[this._stackIndex][5] = f;
- const event = (0, _createCanvasEvent.default)('setTransform', getTransformSlice(this), {
- a,
- b,
- c,
- d,
- e,
- f
- });
- this._events.push(event);
- }
- set shadowBlur(value) {
- const result = Number(value);
- if (Number.isFinite(result) && result > 0) {
- this._shadowBlurStack[this._stackIndex] = result;
- const event = (0, _createCanvasEvent.default)('shadowBlur', getTransformSlice(this), {
- value: result
- });
- this._events.push(event);
- }
- }
- get shadowBlur() {
- return this._shadowBlurStack[this._stackIndex];
- }
- set shadowColor(value) {
- if (typeof value === 'string') {
- const result = parseCSSColor(value);
- if (result) {
- this._shadowColorStack[this._stackIndex] = result;
- const event = (0, _createCanvasEvent.default)('shadowColor', getTransformSlice(this), {
- value: result
- });
- this._events.push(event);
- }
- }
- }
- get shadowColor() {
- return this._shadowColorStack[this._stackIndex];
- }
- set shadowOffsetX(value) {
- const result = Number(value);
- if (Number.isFinite(result)) {
- this._shadowOffsetXStack[this._stackIndex] = result;
- const event = (0, _createCanvasEvent.default)('shadowOffsetX', getTransformSlice(this), {
- value: result
- });
- this._events.push(event);
- }
- }
- get shadowOffsetX() {
- return this._shadowOffsetXStack[this._stackIndex];
- }
- set shadowOffsetY(value) {
- const result = Number(value);
- if (Number.isFinite(result)) {
- this._shadowOffsetXStack[this._stackIndex] = result;
- const event = (0, _createCanvasEvent.default)('shadowOffsetY', getTransformSlice(this), {
- value: result
- });
- this._events.push(event);
- }
- }
- get shadowOffsetY() {
- return this._shadowOffsetXStack[this._stackIndex];
- }
- stroke(path) {
- if (arguments.length === 0) {
- path = this._path.slice();
- } else {
- if (!(path instanceof Path2D)) throw new TypeError('Failed to execute \'stroke\' on \'' + this.constructor.name + '\': parameter 1 is not of type \'Path2D\'.');
- path = path._path.slice();
- }
- const event = (0, _createCanvasEvent.default)('stroke', getTransformSlice(this), {
- path
- });
- this._events.push(event);
- this._drawCalls.push(event);
- }
- strokeRect(x, y, width, height) {
- if (arguments.length < 4) throw new TypeError('Failed to execute \'strokeRect\' on \'' + this.constructor.name + '\': 4 arguments required, but only ' + arguments.length + ' present.');
- x = Number(x);
- y = Number(y);
- width = Number(width);
- height = Number(height);
- if (!Number.isFinite(x + y + width + height)) return;
- const event = (0, _createCanvasEvent.default)('strokeRect', getTransformSlice(this), {
- x,
- y,
- width,
- height
- });
- this._events.push(event);
- this._drawCalls.push(event);
- }
- set strokeStyle(value) {
- let valid = false;
- if (typeof value === 'string') {
- const result = parseCSSColor(value);
- if (result) {
- valid = true;
- value = this._strokeStyleStack[this._stackIndex] = result;
- }
- } else if (value instanceof CanvasGradient || value instanceof _CanvasPattern.default) {
- valid = true;
- this._strokeStyleStack[this._stackIndex] = value;
- }
- if (valid) {
- const event = (0, _createCanvasEvent.default)('strokeStyle', getTransformSlice(this), {
- value
- });
- this._events.push(event);
- }
- }
- get strokeStyle() {
- return this._strokeStyleStack[this._stackIndex];
- }
- strokeText(text, x, y, maxWidth) {
- if (arguments.length < 3) throw new TypeError('Failed to execute \'strokeText\' on \'' + this.constructor.name + '\': 3 arguments required, but only ' + arguments.length + ' present.');
- const textResult = String(text);
- const xResult = Number(x);
- const yResult = Number(y);
- const maxWidthResult = Number(maxWidth);
- if (arguments.length === 3 && !Number.isFinite(xResult + yResult)) return;
- if (arguments.length > 3 && !Number.isFinite(xResult + yResult + maxWidthResult)) return;
- const event = (0, _createCanvasEvent.default)('strokeText', getTransformSlice(this), {
- text: textResult,
- x: xResult,
- y: yResult,
- maxWidth: arguments.length === 3 ? null : maxWidthResult
- });
- this._events.push(event);
- this._drawCalls.push(event);
- }
- set textAlign(value) {
- if (value === 'left' || value === 'right' || value === 'center' || value === 'start' || value === 'end') {
- this._textAlignStack[this._stackIndex] = value;
- const event = (0, _createCanvasEvent.default)('textAlign', getTransformSlice(this), {
- value
- });
- this._events.push(event);
- }
- }
- get textAlign() {
- return this._textAlignStack[this._stackIndex];
- }
- set textBaseline(value) {
- if (value === 'top' || value === 'hanging' || value === 'middle' || value === 'alphabetic' || value === 'ideographic' || value === 'bottom') {
- this._textBaselineStack[this._stackIndex] = value;
- const event = (0, _createCanvasEvent.default)('textBaseline', getTransformSlice(this), {
- value
- });
- this._events.push(event);
- }
- }
- get textBaseline() {
- return this._textBaselineStack[this._stackIndex];
- }
- transform(a, b, c, d, e, f) {
- if (arguments.length < 6) throw new TypeError('Failed to execute \'transform\' on \'' + this.constructor.name + '\': 6 arguments required, but only ' + arguments.length + ' present.');
- a = Number(a);
- b = Number(b);
- c = Number(c);
- d = Number(d);
- e = Number(e);
- f = Number(f);
- if (!Number.isFinite(a + b + c + d + e + f)) return;
- const sa = this._transformStack[this._stackIndex][0];
- const sb = this._transformStack[this._stackIndex][1];
- const sc = this._transformStack[this._stackIndex][2];
- const sd = this._transformStack[this._stackIndex][3];
- const se = this._transformStack[this._stackIndex][4];
- const sf = this._transformStack[this._stackIndex][5];
- this._transformStack[this._stackIndex][0] = sa * a + sc * b;
- this._transformStack[this._stackIndex][1] = sb * a + sd * b;
- this._transformStack[this._stackIndex][2] = sa * c + sc * d;
- this._transformStack[this._stackIndex][3] = sb * c + sd * d;
- this._transformStack[this._stackIndex][4] = sa * e + sc * f + se;
- this._transformStack[this._stackIndex][5] = sb * e + sd * f + sf;
- const event = (0, _createCanvasEvent.default)('transform', getTransformSlice(this), {
- a,
- b,
- c,
- d,
- e,
- f
- });
- this._events.push(event);
- }
- translate(x, y) {
- if (arguments.length < 2) throw new TypeError('Failed to execute \'translate\' on \'' + this.constructor.name + '\': 2 arguments required, but only ' + arguments.length + ' present.');
- const xResult = Number(x);
- const yResult = Number(y);
- const a = this._transformStack[this._stackIndex][0];
- const b = this._transformStack[this._stackIndex][1];
- const c = this._transformStack[this._stackIndex][2];
- const d = this._transformStack[this._stackIndex][3];
- if (Number.isFinite(xResult + yResult)) {
- this._transformStack[this._stackIndex][4] += a * xResult + c * yResult;
- this._transformStack[this._stackIndex][5] += b * xResult + d * yResult;
- const event = (0, _createCanvasEvent.default)('translate', getTransformSlice(this), {
- x: xResult,
- y: yResult
- });
- this._events.push(event);
- }
- }
- }
- exports.default = CanvasRenderingContext2D;
|