varkor/quiver
1
1
Fork 0
mirror of https://github.com/varkor/quiver.git synced 2024-11-04 21:34:23 +03:00
Code Issues Projects Releases Wiki Activity

Fix an issue with moving vertices via touch

Browse Source
This commit is contained in:
varkor 2020-11-30 21:03:17 +00:00
parent 7e14c4af04
commit 66efcdd2ac
1 changed files with 29 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
src/ui.js
View File

@ -1315,43 +1315,14 @@ class UI {
this.focus_point.class_list.add("active"); this.focus_point.class_list.add("active");
} }
// If the user has currently clicked to place a vertex, or activated keyboard controls, const position = this.position_from_event(event);
// then don't reposition the focus point until the new vertex has been created:
// otherwise we might move the focus point before the vertex has been created and
// accidentally place the vertex in the new position of the focus point, rather than
// the old one.
if (!this.in_mode(UIMode.Connect) && (this.focus_point.class_list.contains("revealed")
|| this.focus_point.class_list.contains("focused"))
) {
return;
}
// We permanently change the focus point position if we are dragging to connect an edge,
// so that the focus point will be in the location we drag to.
const position = this.reposition_focus_point(
this.position_from_event(event),
this.in_mode(UIMode.Connect),
);
// We want to reveal the focus point if and only if it is
// not at the same position as an existing vertex (i.e. over an
// empty grid cell).
if (this.in_mode(UIMode.Connect)) {
// We only permit the forgery of vertices, not edges.
if (this.mode.source.is_vertex() && this.mode.target === null) {
this.focus_point.class_list
.toggle("revealed", !this.positions.has(`${position}`));
}
}
// Moving cells around with the pointer. // Moving cells around with the pointer.
if (this.in_mode(UIMode.PointerMove)) { if (this.in_mode(UIMode.PointerMove)) {
// Prevent dragging from selecting random elements. // Prevent dragging from selecting random elements.
event.preventDefault(); event.preventDefault();
const new_position = (cell) => { const new_position = (cell) => cell.position.add(position).sub(this.mode.previous);
return cell.position.add(position).sub(this.mode.previous);
};
// We will only try to reposition if the new position is actually different // We will only try to reposition if the new position is actually different
// (rather than the cursor simply having moved within the same grid cell). // (rather than the cursor simply having moved within the same grid cell).
@ -1395,10 +1366,34 @@ class UI {
} }
} }
// If the user has currently clicked to place a vertex, or activated keyboard controls,
// then don't reposition the focus point until the new vertex has been created:
// otherwise we might move the focus point before the vertex has been created and
// accidentally place the vertex in the new position of the focus point, rather than
// the old one.
if (!this.in_mode(UIMode.Connect) && (this.focus_point.class_list.contains("revealed")
|| this.focus_point.class_list.contains("focused"))
) {
return;
}
// We permanently change the focus point position if we are dragging to connect an edge,
// so that the focus point will be in the location we drag to.
this.reposition_focus_point(position, this.in_mode(UIMode.Connect));
// We want to reveal the focus point if and only if it is
// not at the same position as an existing vertex (i.e. over an
// empty grid cell).
if (this.in_mode(UIMode.Connect)) { if (this.in_mode(UIMode.Connect)) {
// Prevent dragging from selecting random elements. // Prevent dragging from selecting random elements.
event.preventDefault(); event.preventDefault();
// We only permit the forgery of vertices, not edges.
if (this.mode.source.is_vertex() && this.mode.target === null) {
this.focus_point.class_list
.toggle("revealed", !this.positions.has(`${position}`));
}
// Update the position of the cursor. // Update the position of the cursor.
const offset = this.offset_from_event(event); const offset = this.offset_from_event(event);
this.mode.update(this, offset); this.mode.update(this, offset);
@ -2273,7 +2268,6 @@ class UI {
height: `${height}px`, height: `${height}px`,
"padding-top": `${height / 2}px`, "padding-top": `${height / 2}px`,
}); });
return position;
}; };
/// Returns the cell under the focus point, if the focus point is active and such a cell exists. /// Returns the cell under the focus point, if the focus point is active and such a cell exists.
@ -4983,7 +4977,9 @@ class Cell {
if (event.button === 0) { if (event.button === 0) {
if (ui.in_mode(UIMode.Default)) { if (ui.in_mode(UIMode.Default)) {
event.stopPropagation(); event.stopPropagation();
ui.focus_point.class_list.remove("focused", "smooth"); ui.focus_point.class_list.remove(
"revealed", "pending", "active", "focused", "smooth"
);
// If the cell we're dragging is part of the existing selection, // If the cell we're dragging is part of the existing selection,
// then we'll move every cell that is selected. However, if it's // then we'll move every cell that is selected. However, if it's
// not already part of the selection, we'll just drag this cell // not already part of the selection, we'll just drag this cell