45 lines
1.5 KiB
JavaScript
45 lines
1.5 KiB
JavaScript
|
|
class OnCanvasObject {
|
|
constructor(x, y, width, height, hideMainCanvasHandles) {
|
|
this.x = x;
|
|
this.y = y;
|
|
this.width = width;
|
|
this.height = height;
|
|
this.hideMainCanvasHandles = hideMainCanvasHandles;
|
|
this.$el = $(E("div")).addClass("on-canvas-object").appendTo($canvas_area);
|
|
if (this.hideMainCanvasHandles) {
|
|
canvas_handles.hide();
|
|
}
|
|
$G.on("resize theme-load", this._global_resize_handler = () => {
|
|
this.position();
|
|
});
|
|
}
|
|
position(updateStatus) {
|
|
// Nevermind, canvas, isn't aligned to the right in RTL layout!
|
|
// const direction = get_direction();
|
|
// const left_for_ltr = direction === "rtl" ? "right" : "left";
|
|
// const offset_left = parseFloat($canvas_area.css(`padding-${left_for_ltr}`));
|
|
const offset_left = parseFloat($canvas_area.css(`padding-left`));
|
|
const offset_top = parseFloat($canvas_area.css("padding-top"));
|
|
this.$el.css({
|
|
position: "absolute",
|
|
// [left_for_ltr]: magnification * (direction === "rtl" ? canvas.width - this.width - this.x : this.x) + offset_left,
|
|
left: magnification * this.x + offset_left,
|
|
top: magnification * this.y + offset_top,
|
|
width: magnification * this.width,
|
|
height: magnification * this.height,
|
|
});
|
|
if (updateStatus) {
|
|
$status_position.text(`${this.x},${this.y}`);
|
|
$status_size.text(`${this.width},${this.height}`);
|
|
}
|
|
}
|
|
destroy() {
|
|
this.$el.remove();
|
|
if (this.hideMainCanvasHandles) {
|
|
canvas_handles.show();
|
|
}
|
|
$G.off("resize theme-load", this._global_resize_handler);
|
|
}
|
|
}
|