43 lines
1.1 KiB
JavaScript
43 lines
1.1 KiB
JavaScript
import UI from "./ui.js";
|
|
|
|
class Canvas extends UI {
|
|
constructor(width, height) {
|
|
super(document.createElement("canvas"), width, height);
|
|
|
|
this._blurStrength = 0;
|
|
this._ctx = this.element.getContext("2d");
|
|
this._ctx.filter = "blur(" + this._blurStrength + "px)";
|
|
}
|
|
clear() {
|
|
this.resetStyle();
|
|
this._ctx.clearRect(0, 0, this._width, this._height);
|
|
}
|
|
setFillColor(color) {
|
|
this._ctx.fillStyle = color.rgba();
|
|
}
|
|
resetStyle() {
|
|
this._ctx.fillStyle = "";
|
|
this._ctx.filter = "blur(" + this._blurStrength + "px)";
|
|
}
|
|
getData() {
|
|
this.element.toDataURL();
|
|
}
|
|
draw(shape) {
|
|
this._ctx.fillStyle = shape.color.rgba();
|
|
shape.draw(this._ctx);
|
|
this.resetStyle();
|
|
}
|
|
setSize(width, height) {
|
|
super.setSize(width, height);
|
|
|
|
this.element.width = width;
|
|
this.element.height = height;
|
|
}
|
|
setBlurStrength(num) {
|
|
this._blurStrength = parseInt(num) || 0;
|
|
this._ctx.filter = "blur(" + this._blurStrength + "px)";
|
|
}
|
|
}
|
|
|
|
export default Canvas;
|