Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

add support for continuous patching #334

Merged
merged 7 commits into from
Dec 22, 2023

Conversation

loreanvictor
Copy link
Contributor

@loreanvictor loreanvictor commented Dec 11, 2023

Checklist

  • I documented the TypeScript code using JSDoc style.
  • I added multiple screenshots/screencasts of my UI changes
  • I translated all the newly inserted strings into German and English (NA)

Motivation and Context

In realtime collaboration, it helps if changes made by one collaborator are visible to other collaborators continuously, i.e. when moving or resizing an element.

Description

This PR adds APIs to Apollon to allow tracking and syncing continuous patches during moving and resizing of elements. The feature is opt-in (off by default for previous consumers of Apollon), as continuous patches need to be throttled and are ok to miss, unlike discrete patches, and syncing continuous change might require more sophisticated reconciliation mechanisms and backpressure handling that consumers might not have implemented.

Specifically the following APIs are added:

subscribeToAllModelChangePatches(callback: (patch: Patch) => void): number 

This will emit patches for all changes, whether they are discrete or continuous (previous API, subscribeToModelChangePatches(), only emits patches for discrete changes).

subscribeToModelContinuousChangePatches(callback: (patch: Patch) => void): number

This will emit patches for continuous changes, and is useful for when consumers want to handle discrete and continuous changes via different channels.

All of these new subscription options can be unsubscribed using the already existing unsubscribeFromModelChangePatches() method.

Steps for Testing

  1. Clone this PR
  2. Clone Apollon standalone.
  3. Link Apollon standalone to this repo.
  4. Run Apollon standalone, open a diagram and share for collaboration. Open in two distinct browser windows.
  5. Test if the realtime collaboration works (without changes being synced continuously).
  6. Change this line on Apollon standalone webapp to use subscribeToAllModelChangePatches() instead.
  7. Rebuild and rerun Apollon standalone. Now you should get continuous syncing of changes (during moving and resizing of elements).

Test Coverage

File Branch Line
apollon-editor.ts 80.39% 83.52%
components/store/model-store.tsx 100% 100%
services/patcher/patcher-middleware.ts 83.33% 100%
services/patcher/patcher.ts 92.85% 100%

Screenshots

ezgif com-video-to-gif-converted

@loreanvictor loreanvictor marked this pull request as ready for review December 18, 2023 09:21
@matthiaslehnertum matthiaslehnertum self-requested a review December 20, 2023 10:39
@matthiaslehnertum matthiaslehnertum merged commit 0f00b6b into develop Dec 22, 2023
2 checks passed
@matthiaslehnertum matthiaslehnertum deleted the feature/continuous-patching branch December 22, 2023 15:46
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants