I am trying to implement sharedb operations onto my front end code. I currently have it so that it submits an operation (https://github.com/ottypes/json0), specifically text0, when my react component triggers its onChange event. For example:
If my text were:
Hello World
and I delete l to make it
Hello Word
and then i add s at end to make it
Hello Words
I want it so that my OT text difference should have the operations to submit to rest of clients (unless this is wrong)
[{p: 9, d: 'l'}, {p: 10, i: 's'}]
What is the best way to generate these operations using a library or by hand? I looked into perhaps using diff library, but it does not give any indices of where the operation took place despite giving what the insertion and deletion operations are.
You could use the browser-provided selection properties and onkeydown events to build the changesets by hand, or use a diffing library, e.g. https://www.npmjs.com/package/diff_match_patch by Neil Fraser has been very useful to me (disclaimer: I am the publisher of that package.)