Gesture widget: stop drawing the decoded ghost path
Test / test (push) Successful in 25s

decode_key's reconstruction is too rough to have value on screen;
the ack's key is kept, its path ignored. Revisit only once the
reconstruction is fixed at the core in redoal.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Bendik Aagaard Lynghaug
2026-08-30 11:21:20 +02:00
co-authored by Claude Fable 5
parent 7ba9b08d76
commit 72674afe05
+5 -13
View File
@@ -12,9 +12,10 @@
//
// When a relay URL is given, the widget also speaks the redoal-relay
// protocol (ADR-0013 in the redoal repo): announce the stroke, receive
// an ack carrying the stroke's gesture key + the key's own decoded
// path ("what the network heard", drawn as a ghost), and receive
// echoes of similar strokes other visitors drew, shown as thumbnails.
// an ack carrying the stroke's gesture key (the decoded path it also
// carries is ignored: decode_key's sketch is too rough to show), and
// receive echoes of similar strokes other visitors drew, shown as
// thumbnails.
// Everything network is best-effort: no relay, refused connection, or
// a dropped socket all degrade to a plain offline drawing input.
//
@@ -26,12 +27,10 @@
const THEMES = {
dark: {
stroke: '#8ec2c0',
ghost: 'rgba(255, 255, 255, 0.28)',
echo: '#8ec2c0',
},
light: {
stroke: '#47807e',
ghost: 'rgba(29, 29, 27, 0.30)',
echo: '#47807e',
},
};
@@ -47,7 +46,6 @@ class GestureWidget {
this.hidden = hidden || null;
this.relayUrl = relayUrl || '';
this.points = [];
this.ghost = null;
this.drawing = false;
this.stopped = false;
this.ws = null;
@@ -111,10 +109,9 @@ class GestureWidget {
e.preventDefault();
this.canvas.setPointerCapture(e.pointerId);
// One stroke only - a new pointerdown replaces the old drawing
// (and any ghost/ambient trails from the previous round).
// (and any ambient trails from the previous round).
this.drawing = true;
this.points = [this.pos(e)];
this.ghost = null;
this.render();
}
@@ -215,8 +212,6 @@ class GestureWidget {
if (this.points.length >= 2) {
this.setValue({ points: this.normalized(), key: msg.key });
}
this.ghost = msg.path;
this.render();
} else if (msg.type === 'echo') {
this.addEchoThumbnail(msg);
}
@@ -273,9 +268,6 @@ class GestureWidget {
if (!this.ctx) return;
const t = this.theme();
this.ctx.clearRect(0, 0, this.cssWidth, this.cssHeight);
if (this.ghost) {
this.drawPath(this.ctx, this.ghost, this.cssWidth, this.cssHeight, t.ghost, 2, 0.2);
}
if (this.points.length >= 1) {
this.ctx.strokeStyle = t.stroke;
this.ctx.lineWidth = 2;