import { mergeOver, Ωempty } from '../helper/utilities.js';
import { cell } from '../core/library.js';Most of the code relating to the CanvasPattern API can be found here.
fillStyle or strokeStyle attribute by supplying the Pattern object or Cell wrapper’s String name to it.import { mergeOver, Ωempty } from '../helper/utilities.js';
import { cell } from '../core/library.js';Shared constants
import { BLANK, DRAW, FILL, T_CELL, T_NOISE } from '../helper/shared-vars.js';Local constants
const MAT_REPEAT = ['repeat', 'repeat-x', 'repeat-y', 'no-repeat'],
REPEAT = 'repeat';export default function (P = Ωempty) { const defaultAttributes = {repeat - String indicating how to repeat the pattern’s image. Possible values are: repeat (default), repeat-x, repeat-y, no-repeat
repeat: REPEAT,Pattern matrix values
patternStretchX: 1,
patternStretchY: 1,
patternSkewX: 0,
patternSkewY: 0,
patternShiftX: 0,
patternShiftY: 0,
};
P.defs = mergeOver(P.defs, defaultAttributes); const S = P.setters;repeat
S.repeat = function (item) {
if (MAT_REPEAT.includes(item)) this.repeat = item;
else this.repeat = this.defs.repeat;
}; P.initializePattern = function () {
this.currentPatternMatrix = new DOMMatrix();
};buildStyle - internal function: creates the pattern on the Cell’s CanvasRenderingContext2D engine.
P.buildStyle = function (mycell, myentity, area) {
if (mycell) {
if (mycell.substring) mycell = cell[mycell];
let source = this.source,
loaded = this.sourceLoaded;
const repeat = this.repeat,
engine = mycell.engine;
if (this.type === T_CELL || this.type === T_NOISE) {
source = this.element;
loaded = true;
}
if (engine && loaded) {
const p = engine.createPattern(source, repeat);
if (p) {
const {
patternStretchX,
patternStretchY,
patternSkewX,
patternSkewY,
patternShiftX,
patternShiftY,
} = this;
const matrix = this.currentPatternMatrix;Base pattern-owned transform
matrix.a = patternStretchX;
matrix.b = patternSkewY;
matrix.c = patternSkewX;
matrix.d = patternStretchY;
matrix.e = patternShiftX;
matrix.f = patternShiftY;
if (
(area === FILL && myentity.lockFillStyleToEntity) ||
(area === DRAW && myentity.lockStrokeStyleToEntity)
) {
const scale = myentity.currentScale || 1; matrix.a *= scale;
matrix.b *= scale;
matrix.c *= scale;
matrix.d *= scale;
matrix.e *= scale;
matrix.f *= scale;
}
else {The engine is already translated/rotated for the entity.
const inverse = engine.getTransform().invertSelf();
matrix.preMultiplySelf(inverse);
}
p.setTransform(matrix);
return p;
}
}
}
return BLANK;
};
}