Lenaisten/advent22
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

drag_rect implementation

Browse source
This commit is contained in:
Jörn-Michael Miehe 2023-01-17 23:42:07 +00:00
parent 7160cfeff7
commit c1da30cc3e
1 changed files with 20 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

48
ui/src/components/rects/RectPad.vue
View file

@ -53,7 +53,7 @@ export default class RectPad extends Vue {
private preview_corner1 = new Vector2D();
private preview_corner2 = new Vector2D();
private dragging = false;
private drag_index = -1;
private drag_rect?: Rectangle;
private drag_origin = new Vector2D();
private rectangles: Rectangle[] = [];
@ -68,14 +68,21 @@ export default class RectPad extends Vue {
).normalize();
}
private find_rectangle(point: Vector2D) {
return this.rectangles.findIndex(
private pop_rectangle(point: Vector2D): Rectangle | undefined {
const idx = this.rectangles.findIndex(
(rect) =>
point.x >= rect.left &&
point.y >= rect.top &&
point.x <= rect.left + rect.width &&
point.y <= rect.top + rect.height
);
if (idx === -1) {
return;
}
const rects = this.rectangles.splice(idx, 1);
return rects[0];
}
private draw_start(event: MouseEvent) {
@ -106,30 +113,26 @@ export default class RectPad extends Vue {
}
let point = get_event_thous(event);
this.drag_index = this.find_rectangle(point);
this.drag_rect = this.pop_rectangle(point);
if (this.drag_index === -1) {
if (this.drag_rect === undefined) {
return;
}
this.dragging = true;
this.drag_origin = point;
this.preview_corner1 = this.rectangles[this.drag_index].origin;
this.preview_corner2 = this.rectangles[this.drag_index].corner;
console.log("drag_start", point);
this.preview_corner1 = this.drag_rect.origin;
this.preview_corner2 = this.drag_rect.corner;
}
private drag_finish(event: MouseEvent) {
private drag_finish() {
if (!this.dragging) {
return;
}
this.dragging = false;
this.rectangles[this.drag_index] = this.preview_rectangle;
console.log("drag_finish", get_event_thous(event));
this.rectangles.push(this.preview_rectangle);
}
private on_mousemove(event: MouseEvent) {
@ -137,27 +140,16 @@ export default class RectPad extends Vue {
if (this.drawing) {
this.preview_corner2 = point;
} else if (this.dragging) {
} else if (this.dragging && this.drag_rect) {
let movement = point.minus(this.drag_origin);
this.preview_corner1 =
this.rectangles[this.drag_index].origin.plus(movement);
this.preview_corner2 =
this.rectangles[this.drag_index].corner.plus(movement);
this.preview_corner1 = this.drag_rect.origin.plus(movement);
this.preview_corner2 = this.drag_rect.corner.plus(movement);
}
}
private remove_rect(event: MouseEvent) {
let point = get_event_thous(event);
let rect_index = this.find_rectangle(point);
if (rect_index === -1) {
return;
}
this.rectangles.splice(rect_index, 1);
console.log("remove_rect", get_event_thous(event));
this.pop_rectangle(get_event_thous(event));
}
}
</script>