Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
componentDidMount() {
this.setupMessages();
if (!this.initialized) {
this.initialized = true;
}
Mousetrap.bind("esc", () => this.cancel());
const canvas = $('#rasterCanvas').get(0);
Paper.setup(canvas);
// The layer for the image
this.rasterLayer = new Paper.Layer();
this.rasterLayer.applyMatrix = false;
// The layer for drawing the annotations
this.mainLayer = new Paper.Layer();
this.mainLayer.applyMatrix = false;
this.mainLayer.opacity = this.mainLayerOpacity;
// The front layer for snapping and selection indicators
this.frontLayer = new Paper.Layer();
this.frontLayer.applyMatrix = false;
// this.frontLayer.blendMode = "difference";
/*
this.mainLayer.activate();
const bug = new Paper.Path([{x: 1, y: 1}, {x: 30, y: 30}]);
bug.strokeColor = "red"
*/
const canvas = $('#rasterCanvas').get(0);
Paper.setup(canvas);
// The layer for the image
this.rasterLayer = new Paper.Layer();
this.rasterLayer.applyMatrix = false;
// The layer for drawing the annotations
this.mainLayer = new Paper.Layer();
this.mainLayer.applyMatrix = false;
this.mainLayer.opacity = this.mainLayerOpacity;
// The front layer for snapping and selection indicators
this.frontLayer = new Paper.Layer();
this.frontLayer.applyMatrix = false;
// this.frontLayer.blendMode = "difference";
/*
this.mainLayer.activate();
const bug = new Paper.Path([{x: 1, y: 1}, {x: 30, y: 30}]);
bug.strokeColor = "red"
*/
// The front layer for snapping and selection indicators
this.debugLayer = new Paper.Layer();
this.debugLayer.applyMatrix = false;
// Registers hit testing on all layers
this.rasterLayer.onMouseMove = this.hitTesting.bind(this);
this.mainLayer.onMouseMove = this.hitTesting.bind(this);
this.frontLayer.onMouseMove = this.hitTesting.bind(this);
this.initialized = true;
}
Mousetrap.bind("esc", () => this.cancel());
const canvas = $('#rasterCanvas').get(0);
Paper.setup(canvas);
// The layer for the image
this.rasterLayer = new Paper.Layer();
this.rasterLayer.applyMatrix = false;
// The layer for drawing the annotations
this.mainLayer = new Paper.Layer();
this.mainLayer.applyMatrix = false;
this.mainLayer.opacity = this.mainLayerOpacity;
// The front layer for snapping and selection indicators
this.frontLayer = new Paper.Layer();
this.frontLayer.applyMatrix = false;
// this.frontLayer.blendMode = "difference";
/*
this.mainLayer.activate();
const bug = new Paper.Path([{x: 1, y: 1}, {x: 30, y: 30}]);
bug.strokeColor = "red"
*/
// The front layer for snapping and selection indicators
this.debugLayer = new Paper.Layer();
this.debugLayer.applyMatrix = false;
// Setup the project with the max cavas size in mm.
base.size = new Size(bot.maxAreaMM.width, bot.maxAreaMM.height);
// Setup the actual printable work space as a rectangle.
base.workspace = new Rectangle({
from: [bot.workAreaMM.left, bot.workAreaMM.top],
to: [bot.workAreaMM.right, bot.workAreaMM.bottom],
});
base.project = new Project(base.size);
// Setup layers: temp, working
// Whatever the last layer added was, will be default.
base.layers = {
import: new Layer(),
temp: new Layer(),
preview: new Layer(),
};
});
// The layer for drawing the annotations
this.mainLayer = new Paper.Layer();
this.mainLayer.applyMatrix = false;
this.mainLayer.opacity = this.mainLayerOpacity;
// The front layer for snapping and selection indicators
this.frontLayer = new Paper.Layer();
this.frontLayer.applyMatrix = false;
// this.frontLayer.blendMode = "difference";
/*
this.mainLayer.activate();
const bug = new Paper.Path([{x: 1, y: 1}, {x: 30, y: 30}]);
bug.strokeColor = "red"
*/
// The front layer for snapping and selection indicators
this.debugLayer = new Paper.Layer();
this.debugLayer.applyMatrix = false;
// Registers hit testing on all layers
this.rasterLayer.onMouseMove = this.hitTesting.bind(this);
this.mainLayer.onMouseMove = this.hitTesting.bind(this);
this.frontLayer.onMouseMove = this.hitTesting.bind(this);
this.rasterLayer.activate();
this.polygonTool = new SsePolygonTool(this);
this.pointerTool = new SsePointerTool(this);
this.cutTool = new SseCutTool(this);
this.rectangleTool = new SseRectangleTool(this);
this.floodTool = new SseFloodTool(this);
$(window).on('resize', this.resizeCanvas.bind(this));
export function setupPaperJs(canvas: HTMLCanvasElement) {
if (isPaperJsSetup) {
return;
}
paper.setup(canvas);
paper.settings.handleSize = 8;
const defaultLayer = new paper.Layer();
defaultLayer.name = 'Default layer';
defaultLayer.data.isDefaultLayer = true;
const guideLayer = new paper.Layer();
guideLayer.name = 'Guide layer';
guideLayer.data.isGuideLayer = true;
guideLayer.bringToFront();
defaultLayer.activate();
isPaperJsSetup = true;
}
export function createGuideLayer() {
return new paper.Layer({ name: GUIDE_LAYER_NAME });
}
createInstance(type, props, internalInstanceHandle) {
const { children, ...instanceProps } = props
let instance
switch (type) {
case TYPES.TOOL:
instance = new Tool(instanceProps)
instance._applyProps = applyToolProps
break
case TYPES.LAYER:
instance = new Layer(instanceProps)
instance._applyProps = applyLayerProps
break
case TYPES.GROUP:
instance = new Group(instanceProps)
instance._applyProps = applyGroupProps
break
case TYPES.PATH:
instance = new Path(instanceProps)
instance._applyProps = applyPathProps
break
case TYPES.CIRCLE:
instance = new Path.Circle(instanceProps)
instance._applyProps = applyCircleProps
break
case TYPES.ELLIPSE:
instance = new Path.Ellipse(instanceProps)
export function setupPaperJs(canvas: HTMLCanvasElement) {
if (isPaperJsSetup) {
return;
}
paper.setup(canvas);
paper.settings.handleSize = 8;
const defaultLayer = new paper.Layer();
defaultLayer.name = 'Default layer';
defaultLayer.data.isDefaultLayer = true;
const guideLayer = new paper.Layer();
guideLayer.name = 'Guide layer';
guideLayer.data.isGuideLayer = true;
guideLayer.bringToFront();
defaultLayer.activate();
isPaperJsSetup = true;
}
(_: State) =>
typeof options.args !== 'undefined'
? new Layer(options.args)
: new Layer([]),
options,