UNPKG

@drizm/ng-whiteboard

Version:

A Canvas component for Angular which supports free drawing.

33 lines 5.68 kB
import { CanvasWhiteboardShape } from './canvas-whiteboard-shape'; import { CanvasWhiteboardPoint } from '../canvas-whiteboard-point.model'; export class CircleShape extends CanvasWhiteboardShape { constructor(positionPoint, options, radius) { super(positionPoint, options); this.radius = radius || 0; } getShapeName() { return 'CircleShape'; } draw(context) { context.beginPath(); context.arc(this.positionPoint.x, this.positionPoint.y, this.radius, 0, Math.PI * 2, false); Object.assign(context, this.options); context.stroke(); if (this.options.shouldFillShape) { context.fill(); } context.closePath(); } drawPreview(context) { this.positionPoint = new CanvasWhiteboardPoint(context.canvas.width / 2, context.canvas.height / 2); this.radius = this.calculateRadius(context.canvas.width - 2, context.canvas.height / 2); this.draw(context); } onUpdateReceived(update) { this.radius = this.calculateRadius(update.x, update.y); } calculateRadius(x, y) { return Math.sqrt(Math.pow(x - this.positionPoint.x, 2) + Math.pow(y - this.positionPoint.y, 2)); } } //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2lyY2xlLXNoYXBlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctd2hpdGVib2FyZC9zcmMvbGliL19jbGFzc2VzL3NoYXBlL2NpcmNsZS1zaGFwZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUMscUJBQXFCLEVBQUMsTUFBTSwyQkFBMkIsQ0FBQztBQUVoRSxPQUFPLEVBQUMscUJBQXFCLEVBQUMsTUFBTSxrQ0FBa0MsQ0FBQztBQUd2RSxNQUFNLE9BQU8sV0FBWSxTQUFRLHFCQUFxQjtJQUdwRCxZQUFZLGFBQXFDLEVBQUUsT0FBc0MsRUFBRSxNQUFlO1FBQ3hHLEtBQUssQ0FBQyxhQUFhLEVBQUUsT0FBTyxDQUFDLENBQUM7UUFDOUIsSUFBSSxDQUFDLE1BQU0sR0FBRyxNQUFNLElBQUksQ0FBQyxDQUFDO0lBQzVCLENBQUM7SUFFRCxZQUFZO1FBQ1YsT0FBTyxhQUFhLENBQUM7SUFDdkIsQ0FBQztJQUVELElBQUksQ0FBQyxPQUFpQztRQUNwQyxPQUFPLENBQUMsU0FBUyxFQUFFLENBQUM7UUFDcEIsT0FBTyxDQUFDLEdBQUcsQ0FBQyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUMsRUFBRSxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUMsRUFBRSxJQUFJLENBQUMsTUFBTSxFQUFFLENBQUMsRUFBRSxJQUFJLENBQUMsRUFBRSxHQUFHLENBQUMsRUFBRSxLQUFLLENBQUMsQ0FBQztRQUU1RixNQUFNLENBQUMsTUFBTSxDQUFDLE9BQU8sRUFBRSxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7UUFFckMsT0FBTyxDQUFDLE1BQU0sRUFBRSxDQUFDO1FBQ2pCLElBQUksSUFBSSxDQUFDLE9BQU8sQ0FBQyxlQUFlLEVBQUU7WUFDaEMsT0FBTyxDQUFDLElBQUksRUFBRSxDQUFDO1NBQ2hCO1FBRUQsT0FBTyxDQUFDLFNBQVMsRUFBRSxDQUFDO0lBQ3RCLENBQUM7SUFFRCxXQUFXLENBQUMsT0FBaUM7UUFDM0MsSUFBSSxDQUFDLGFBQWEsR0FBRyxJQUFJLHFCQUFxQixDQUFDLE9BQU8sQ0FBQyxNQUFNLENBQUMsS0FBSyxHQUFHLENBQUMsRUFBRSxPQUFPLENBQUMsTUFBTSxDQUFDLE1BQU0sR0FBRyxDQUFDLENBQUMsQ0FBQztRQUNwRyxJQUFJLENBQUMsTUFBTSxHQUFHLElBQUksQ0FBQyxlQUFlLENBQUMsT0FBTyxDQUFDLE1BQU0sQ0FBQyxLQUFLLEdBQUcsQ0FBQyxFQUFFLE9BQU8sQ0FBQyxNQUFNLENBQUMsTUFBTSxHQUFHLENBQUMsQ0FBQyxDQUFDO1FBQ3hGLElBQUksQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7SUFDckIsQ0FBQztJQUVELGdCQUFnQixDQUFDLE1BQThCO1FBQzdDLElBQUksQ0FBQyxNQUFNLEdBQUcsSUFBSSxDQUFDLGVBQWUsQ0FBQyxNQUFNLENBQUMsQ0FBVyxFQUFFLE1BQU0sQ0FBQyxDQUFXLENBQUMsQ0FBQztJQUM3RSxDQUFDO0lBRUQsZUFBZSxDQUFDLENBQVMsRUFBRSxDQUFTO1FBQ2xDLE9BQU8sSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsR0FBRyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUMsRUFBRSxDQUFDLENBQUMsR0FBRyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsR0FBRyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUMsRUFBRSxDQUFDLENBQUMsQ0FBQyxDQUFDO0lBQ2xHLENBQUM7Q0FDRiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Q2FudmFzV2hpdGVib2FyZFNoYXBlfSBmcm9tICcuL2NhbnZhcy13aGl0ZWJvYXJkLXNoYXBlJztcclxuaW1wb3J0IHtDYW52YXNXaGl0ZWJvYXJkU2hhcGVPcHRpb25zfSBmcm9tICcuL2NhbnZhcy13aGl0ZWJvYXJkLXNoYXBlLW9wdGlvbnMnO1xyXG5pbXBvcnQge0NhbnZhc1doaXRlYm9hcmRQb2ludH0gZnJvbSAnLi4vY2FudmFzLXdoaXRlYm9hcmQtcG9pbnQubW9kZWwnO1xyXG5pbXBvcnQge0NhbnZhc1doaXRlYm9hcmRVcGRhdGV9IGZyb20gJy4uL2NhbnZhcy13aGl0ZWJvYXJkLXVwZGF0ZS5tb2RlbCc7XHJcblxyXG5leHBvcnQgY2xhc3MgQ2lyY2xlU2hhcGUgZXh0ZW5kcyBDYW52YXNXaGl0ZWJvYXJkU2hhcGUge1xyXG4gIHJhZGl1czogbnVtYmVyO1xyXG5cclxuICBjb25zdHJ1Y3Rvcihwb3NpdGlvblBvaW50PzogQ2FudmFzV2hpdGVib2FyZFBvaW50LCBvcHRpb25zPzogQ2FudmFzV2hpdGVib2FyZFNoYXBlT3B0aW9ucywgcmFkaXVzPzogbnVtYmVyKSB7XHJcbiAgICBzdXBlcihwb3NpdGlvblBvaW50LCBvcHRpb25zKTtcclxuICAgIHRoaXMucmFkaXVzID0gcmFkaXVzIHx8IDA7XHJcbiAgfVxyXG5cclxuICBnZXRTaGFwZU5hbWUoKTogc3RyaW5nIHtcclxuICAgIHJldHVybiAnQ2lyY2xlU2hhcGUnO1xyXG4gIH1cclxuXHJcbiAgZHJhdyhjb250ZXh0OiBDYW52YXNSZW5kZXJpbmdDb250ZXh0MkQpOiB2b2lkIHtcclxuICAgIGNvbnRleHQuYmVnaW5QYXRoKCk7XHJcbiAgICBjb250ZXh0LmFyYyh0aGlzLnBvc2l0aW9uUG9pbnQueCwgdGhpcy5wb3NpdGlvblBvaW50LnksIHRoaXMucmFkaXVzLCAwLCBNYXRoLlBJICogMiwgZmFsc2UpO1xyXG5cclxuICAgIE9iamVjdC5hc3NpZ24oY29udGV4dCwgdGhpcy5vcHRpb25zKTtcclxuXHJcbiAgICBjb250ZXh0LnN0cm9rZSgpO1xyXG4gICAgaWYgKHRoaXMub3B0aW9ucy5zaG91bGRGaWxsU2hhcGUpIHtcclxuICAgICAgY29udGV4dC5maWxsKCk7XHJcbiAgICB9XHJcblxyXG4gICAgY29udGV4dC5jbG9zZVBhdGgoKTtcclxuICB9XHJcblxyXG4gIGRyYXdQcmV2aWV3KGNvbnRleHQ6IENhbnZhc1JlbmRlcmluZ0NvbnRleHQyRCk6IHZvaWQge1xyXG4gICAgdGhpcy5wb3NpdGlvblBvaW50ID0gbmV3IENhbnZhc1doaXRlYm9hcmRQb2ludChjb250ZXh0LmNhbnZhcy53aWR0aCAvIDIsIGNvbnRleHQuY2FudmFzLmhlaWdodCAvIDIpO1xyXG4gICAgdGhpcy5yYWRpdXMgPSB0aGlzLmNhbGN1bGF0ZVJhZGl1cyhjb250ZXh0LmNhbnZhcy53aWR0aCAtIDIsIGNvbnRleHQuY2FudmFzLmhlaWdodCAvIDIpO1xyXG4gICAgdGhpcy5kcmF3KGNvbnRleHQpO1xyXG4gIH1cclxuXHJcbiAgb25VcGRhdGVSZWNlaXZlZCh1cGRhdGU6IENhbnZhc1doaXRlYm9hcmRVcGRhdGUpOiB2b2lkIHtcclxuICAgIHRoaXMucmFkaXVzID0gdGhpcy5jYWxjdWxhdGVSYWRpdXModXBkYXRlLnggYXMgbnVtYmVyLCB1cGRhdGUueSBhcyBudW1iZXIpO1xyXG4gIH1cclxuXHJcbiAgY2FsY3VsYXRlUmFkaXVzKHg6IG51bWJlciwgeTogbnVtYmVyKTogbnVtYmVyIHtcclxuICAgIHJldHVybiBNYXRoLnNxcnQoTWF0aC5wb3coeCAtIHRoaXMucG9zaXRpb25Qb2ludC54LCAyKSArIE1hdGgucG93KHkgLSB0aGlzLnBvc2l0aW9uUG9pbnQueSwgMikpO1xyXG4gIH1cclxufVxyXG4iXX0=