Removed unused draw functions
This commit is contained in:
parent
b6d6a16817
commit
0304236558
@ -2,7 +2,6 @@ import simplify from "simplify-js";
|
|||||||
|
|
||||||
import * as Vector2 from "./vector2";
|
import * as Vector2 from "./vector2";
|
||||||
import { toDegrees } from "./shared";
|
import { toDegrees } from "./shared";
|
||||||
import colors from "./colors";
|
|
||||||
|
|
||||||
const snappingThreshold = 1 / 5;
|
const snappingThreshold = 1 / 5;
|
||||||
export function getBrushPositionForTool(
|
export function getBrushPositionForTool(
|
||||||
@ -149,200 +148,6 @@ export function getStrokeWidth(multiplier, gridSize, mapWidth, mapHeight) {
|
|||||||
return Vector2.min(gridPixelSize) * defaultStrokeWidth * multiplier;
|
return Vector2.min(gridPixelSize) * defaultStrokeWidth * multiplier;
|
||||||
}
|
}
|
||||||
|
|
||||||
export function shapeHasFill(shape) {
|
|
||||||
return (
|
|
||||||
shape.type === "fog" ||
|
|
||||||
shape.type === "shape" ||
|
|
||||||
(shape.type === "path" && shape.pathType === "fill")
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export function pointsToQuadraticBezier(points) {
|
|
||||||
const quadraticPoints = [];
|
|
||||||
|
|
||||||
// Draw a smooth curve between the points where each control point
|
|
||||||
// is the current point in the array and the next point is the center of
|
|
||||||
// the current point and the next point
|
|
||||||
for (let i = 1; i < points.length - 2; i++) {
|
|
||||||
const start = points[i - 1];
|
|
||||||
const controlPoint = points[i];
|
|
||||||
const next = points[i + 1];
|
|
||||||
const end = Vector2.divide(Vector2.add(controlPoint, next), 2);
|
|
||||||
|
|
||||||
quadraticPoints.push({ start, controlPoint, end });
|
|
||||||
}
|
|
||||||
// Curve through the last two points
|
|
||||||
quadraticPoints.push({
|
|
||||||
start: points[points.length - 2],
|
|
||||||
controlPoint: points[points.length - 1],
|
|
||||||
end: points[points.length - 1],
|
|
||||||
});
|
|
||||||
|
|
||||||
return quadraticPoints;
|
|
||||||
}
|
|
||||||
|
|
||||||
export function pointsToPathSmooth(points, close, canvasWidth, canvasHeight) {
|
|
||||||
const path = new Path2D();
|
|
||||||
if (points.length < 2) {
|
|
||||||
return path;
|
|
||||||
}
|
|
||||||
path.moveTo(points[0].x * canvasWidth, points[0].y * canvasHeight);
|
|
||||||
|
|
||||||
const quadraticPoints = pointsToQuadraticBezier(points);
|
|
||||||
for (let quadPoint of quadraticPoints) {
|
|
||||||
const pointScaled = Vector2.multiply(quadPoint.end, {
|
|
||||||
x: canvasWidth,
|
|
||||||
y: canvasHeight,
|
|
||||||
});
|
|
||||||
const controlScaled = Vector2.multiply(quadPoint.controlPoint, {
|
|
||||||
x: canvasWidth,
|
|
||||||
y: canvasHeight,
|
|
||||||
});
|
|
||||||
path.quadraticCurveTo(
|
|
||||||
controlScaled.x,
|
|
||||||
controlScaled.y,
|
|
||||||
pointScaled.x,
|
|
||||||
pointScaled.y
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (close) {
|
|
||||||
path.closePath();
|
|
||||||
}
|
|
||||||
return path;
|
|
||||||
}
|
|
||||||
|
|
||||||
export function pointsToPathSharp(points, close, canvasWidth, canvasHeight) {
|
|
||||||
const path = new Path2D();
|
|
||||||
path.moveTo(points[0].x * canvasWidth, points[0].y * canvasHeight);
|
|
||||||
for (let point of points.slice(1)) {
|
|
||||||
path.lineTo(point.x * canvasWidth, point.y * canvasHeight);
|
|
||||||
}
|
|
||||||
if (close) {
|
|
||||||
path.closePath();
|
|
||||||
}
|
|
||||||
|
|
||||||
return path;
|
|
||||||
}
|
|
||||||
|
|
||||||
export function circleToPath(x, y, radius, canvasWidth, canvasHeight) {
|
|
||||||
const path = new Path2D();
|
|
||||||
const minSide = canvasWidth < canvasHeight ? canvasWidth : canvasHeight;
|
|
||||||
path.arc(
|
|
||||||
x * canvasWidth,
|
|
||||||
y * canvasHeight,
|
|
||||||
radius * minSide,
|
|
||||||
0,
|
|
||||||
2 * Math.PI,
|
|
||||||
true
|
|
||||||
);
|
|
||||||
return path;
|
|
||||||
}
|
|
||||||
|
|
||||||
export function rectangleToPath(
|
|
||||||
x,
|
|
||||||
y,
|
|
||||||
width,
|
|
||||||
height,
|
|
||||||
canvasWidth,
|
|
||||||
canvasHeight
|
|
||||||
) {
|
|
||||||
const path = new Path2D();
|
|
||||||
path.rect(
|
|
||||||
x * canvasWidth,
|
|
||||||
y * canvasHeight,
|
|
||||||
width * canvasWidth,
|
|
||||||
height * canvasHeight
|
|
||||||
);
|
|
||||||
return path;
|
|
||||||
}
|
|
||||||
|
|
||||||
export function shapeToPath(shape, canvasWidth, canvasHeight) {
|
|
||||||
const data = shape.data;
|
|
||||||
if (shape.type === "path") {
|
|
||||||
return pointsToPathSmooth(
|
|
||||||
data.points,
|
|
||||||
shape.pathType === "fill",
|
|
||||||
canvasWidth,
|
|
||||||
canvasHeight
|
|
||||||
);
|
|
||||||
} else if (shape.type === "shape") {
|
|
||||||
if (shape.shapeType === "circle") {
|
|
||||||
return circleToPath(
|
|
||||||
data.x,
|
|
||||||
data.y,
|
|
||||||
data.radius,
|
|
||||||
canvasWidth,
|
|
||||||
canvasHeight
|
|
||||||
);
|
|
||||||
} else if (shape.shapeType === "rectangle") {
|
|
||||||
return rectangleToPath(
|
|
||||||
data.x,
|
|
||||||
data.y,
|
|
||||||
data.width,
|
|
||||||
data.height,
|
|
||||||
canvasWidth,
|
|
||||||
canvasHeight
|
|
||||||
);
|
|
||||||
} else if (shape.shapeType === "triangle") {
|
|
||||||
return pointsToPathSharp(data.points, true, canvasWidth, canvasHeight);
|
|
||||||
}
|
|
||||||
} else if (shape.type === "fog") {
|
|
||||||
return pointsToPathSharp(
|
|
||||||
shape.data.points,
|
|
||||||
true,
|
|
||||||
canvasWidth,
|
|
||||||
canvasHeight
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export function isShapeHovered(
|
|
||||||
shape,
|
|
||||||
context,
|
|
||||||
hoverPosition,
|
|
||||||
canvasWidth,
|
|
||||||
canvasHeight
|
|
||||||
) {
|
|
||||||
const path = shapeToPath(shape, canvasWidth, canvasHeight);
|
|
||||||
if (shapeHasFill(shape)) {
|
|
||||||
return context.isPointInPath(
|
|
||||||
path,
|
|
||||||
hoverPosition.x * canvasWidth,
|
|
||||||
hoverPosition.y * canvasHeight
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
return context.isPointInStroke(
|
|
||||||
path,
|
|
||||||
hoverPosition.x * canvasWidth,
|
|
||||||
hoverPosition.y * canvasHeight
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export function drawShape(shape, context, gridSize, canvasWidth, canvasHeight) {
|
|
||||||
const path = shapeToPath(shape, canvasWidth, canvasHeight);
|
|
||||||
const color = colors[shape.color] || shape.color;
|
|
||||||
const fill = shapeHasFill(shape);
|
|
||||||
|
|
||||||
context.globalAlpha = shape.blend ? 0.5 : 1.0;
|
|
||||||
context.fillStyle = color;
|
|
||||||
context.strokeStyle = color;
|
|
||||||
if (shape.strokeWidth > 0) {
|
|
||||||
context.lineCap = "round";
|
|
||||||
context.lineWidth = getStrokeWidth(
|
|
||||||
shape.strokeWidth,
|
|
||||||
gridSize,
|
|
||||||
canvasWidth,
|
|
||||||
canvasHeight
|
|
||||||
);
|
|
||||||
context.stroke(path);
|
|
||||||
}
|
|
||||||
if (fill) {
|
|
||||||
context.fill(path);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const defaultSimplifySize = 1 / 100;
|
const defaultSimplifySize = 1 / 100;
|
||||||
export function simplifyPoints(points, gridSize, scale) {
|
export function simplifyPoints(points, gridSize, scale) {
|
||||||
return simplify(
|
return simplify(
|
||||||
@ -350,12 +155,3 @@ export function simplifyPoints(points, gridSize, scale) {
|
|||||||
(Vector2.min(gridSize) * defaultSimplifySize) / scale
|
(Vector2.min(gridSize) * defaultSimplifySize) / scale
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
export function getRelativePointerPosition(event, container) {
|
|
||||||
if (container) {
|
|
||||||
const containerRect = container.getBoundingClientRect();
|
|
||||||
const x = (event.clientX - containerRect.x) / containerRect.width;
|
|
||||||
const y = (event.clientY - containerRect.y) / containerRect.height;
|
|
||||||
return { x, y };
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
Loading…
Reference in New Issue
Block a user