This commit is contained in:
Andras Schmelczer 2025-08-26 21:22:18 +01:00
parent 2ff1384fde
commit d6e4305588
No known key found for this signature in database
GPG key ID: FC8F2C3D3D1A718C
2 changed files with 67 additions and 65 deletions

View file

@ -18,25 +18,6 @@ import { getRandomColor } from "src/utils/get-random-color";
import type { SpanWithHistory } from "reconcile-text";
import { reconcileWithHistory } from "reconcile-text";
function findWhereToMoveCursor(
cursor: number,
spans: SpanWithHistory[]
): number | null {
let position = 0;
for (const span of spans) {
// left and origin are the same
if (position === cursor && span.history === "AddedFromRight") {
return position + span.text.length;
}
position += span.text.length;
if (position === cursor && span.history === "RemovedFromRight") {
return position - span.text.length;
}
}
return null;
}
const forceUpdate = StateEffect.define();
export class RemoteCursorsPluginValue implements PluginValue {
@ -98,6 +79,69 @@ export class RemoteCursorsPluginValue implements PluginValue {
});
}
private static interpolateRemoteCursorPositions(
original: string,
edited: string
): void {
if (
original === edited ||
RemoteCursorsPluginValue.cursors.length === 0
) {
return;
}
const updatedPositions: number[] = [];
const reconciled = reconcileWithHistory(
original,
{
text: original,
cursors: RemoteCursorsPluginValue.cursors.flatMap(
({ span }, i) => [
{ id: i * 2, position: span.start },
{ id: i * 2 + 1, position: span.end }
]
)
},
edited
);
reconciled.cursors.forEach(({ id, position }) => {
const whereToJump = RemoteCursorsPluginValue.findWhereToMoveCursor(
position,
reconciled.history
);
if (whereToJump !== null) {
updatedPositions[id] = whereToJump;
} else {
updatedPositions[id] = position;
}
});
RemoteCursorsPluginValue.cursors.forEach(({ span }, i) => {
span.start = updatedPositions[i * 2];
span.end = updatedPositions[i * 2 + 1];
});
}
private static findWhereToMoveCursor(
cursor: number,
spans: SpanWithHistory[]
): number | null {
let position = 0;
for (const span of spans) {
// left and origin are the same
if (position === cursor && span.history === "AddedFromRight") {
return position + span.text.length;
}
position += span.text.length;
if (position === cursor && span.history === "RemovedFromRight") {
return position - span.text.length;
}
}
return null;
}
public update(update: ViewUpdate): void {
const original = update.startState.doc.toString();
const edited = update.state.doc.toString();
@ -179,50 +223,6 @@ export class RemoteCursorsPluginValue implements PluginValue {
this.decorations = Decoration.set(decorations, true);
}
private static interpolateRemoteCursorPositions(
original: string,
edited: string
): void {
if (
original === edited ||
RemoteCursorsPluginValue.cursors.length === 0
) {
return;
}
const updatedPositions: number[] = [];
const reconciled = reconcileWithHistory(
original,
{
text: original,
cursors: RemoteCursorsPluginValue.cursors.flatMap(
({ span }, i) => [
{ id: i * 2, position: span.start },
{ id: i * 2 + 1, position: span.end }
]
)
},
edited
);
reconciled.cursors.forEach(({ id, position }) => {
const whereToJump = findWhereToMoveCursor(
position,
reconciled.history
);
if (whereToJump !== null) {
updatedPositions[id] = whereToJump;
} else {
updatedPositions[id] = position;
}
});
RemoteCursorsPluginValue.cursors.forEach(({ span }, i) => {
span.start = updatedPositions[i * 2];
span.end = updatedPositions[i * 2 + 1];
});
}
}
export const remoteCursorsPlugin = ViewPlugin.fromClass(