Collaborative Editing

[her001]

trafficstars

Thanks for your work on this app!

Is it possible for collaborative editing to be enabled? Or is that something that must be raised with draw.io themselves? If it could be done, what sort of work would that entail?

[andersruneson]

Hmm, is there anything preventing two users overwriting each others changes currently, like some sort of lock?

@her001 It may actually be possible with the draw.io-component, if one uses the "autosave" feature, that sends an event every time something is moved, added or changed. But I'm not sure that is enough.

[her001]

Well this is a feature when drawio is linked to Google Drive, if I remember correctly. We could probably take a look at that implementation to have similar functionality in Nextcloud.

[steineiche]

Auch von mir einen herzlichen Dank für diese App in Nextcloud. Ich würde mir auch sehr wünschen, die collaborative Bearbeitung zu ermöglichen. Steht das bereits auf dem Plan zur Umsetzung?

[mr-gosh]

Indeed this was the idea behind our test - but with a missing colaborative feature this is not worth installing it into nextcloud i think... :(

[davidjgraph]

Google Drive deprecated their real time system, so we're writing a replacement that isn't dependent on any particular system. Currently, it needs if-match/etag header support on the file to work.

[BThiebaut]

Hi, there are news about this feature ? We have installed this on our nextcloud but it could be dangerous if we work with a shared diagram if there is not live update. We don't want to override colleague work accidentally :°

[skynick11]

We don't want to override colleague work accidentally :°

Yes, you're right, several users can open the same file at the same time in Draw.io App - in this case "the last save wins". Also Nextcloud doesn't have a locking feature to prevent overwrites in such situations and its developers don't like to implement it...

But there is a workaround: to check before saving whether the file has been changed in a storage since it was opened in the editor or since the last save and notify the user in this case.

Could it be possible to implement something like this workaround?

[davidjgraph]

diff-sync model merging is implemented in draw.io. That basically allows arbitary data models to be merged together. This can either be used for RT collaboration, or to detect that the saved file has changed and to merge the two files together.

We can point out how to invoke this functionality, but how this works in NextCloud, I have no idea.

[skynick11]

but how this works in NextCloud, I have no idea

I also don’t know how, but I know where it works in NextCloud: it's possible to open the same .txt or .md file twice in the Nextcloud text editor (in different browser tabs), after that "the first save wins" - the editor in the other tab saying "Cannot save file as it has been modified since opening".

This may be an autosave feature, of course, but it could be at least some kind of starting point.

[yrammos]

Oh dear, just as we were thrilled to discover this wonderful app… Sadly, no collab functionality.

[ColaIan]

Any cool people can contribute and add this collaborative editing functionality please 🙏

[camherry]

I installed this application on our Nextcloud infrastructure. I thought collaborative editing was native, but it seems not, just like other if collaborative editing can't be installed so it's not useful for me

[vision-ken]

A temporary solution is to install the Temporary files lock application.

[sualko]

Also Nextcloud doesn't have a locking feature to prevent overwrites in such situations and its developers don't like to implement it...

I think this information is outdated. OCP\Files\File is throwing an lock exception so there should be some kind of lock possible. Looking further I think OCP\Files\Node::lock() is looking promising.

[skynick11]

Also Nextcloud doesn't have a locking feature to prevent overwrites in such situations and its developers don't like to implement it...

I think this information is outdated. OCP\Files\File is throwing an lock exception so there should be some kind of lock possible. Looking further I think OCP\Files\Node::lock() is looking promising.

At this moment my information about locks is only partially outdated: Nextcloud stills have no WebDAV locks and its developers still not like to implement it.

Yes, OCP\Files\Node::lock() (and "Temporary files lock" application mentioned by vision-ken which uses it) can lock a file, and it will be locked for webdav access for other users too, but it's still impossible to lock/unlock a file from the webdav side.

Also, in case of "Temporary files lock" the same user is still be able to modify the same file by two or more applications at the same time (for example, edit it in one tab/in one browser and overwrite it in another tab/in another browser). I don't know, is it possible to lock a file on a per-running-process basis, not only on per-user basis?

But OCP\Files\Node::lock() is much better then nothing.

[sualko]

After thinking more about this, even the OCP\Files\Node::lock() would require some extra work to ensure that there are no dangling locks in case someone closes the browser etc. Maybe it's easier to remember the modification time and warn the user that the file has changed in the meanwhile. Maybe the app could also show a dialog which allows the user to save his changes with a new filename.

[davidjgraph]

Do files (where diagrams are stored) have etag support?

[sualko]

Do files (where diagrams are stored) have etag support?

They have. Good idea. That would be more standard confirm than the mdate.

[githubkoma]

perhaps embed-mode could also help? https://desk.draw.io/support/solutions/articles/16000042544

i am not 100% sure, but i think they use this mechanism for the real time collaboration in google drive etc

looks like there is even: {action: 'merge', xml: '...'} can be sent at any time to merge the contents of the given XML into the current file, an {event: 'merge', error: '...', message: ...} with the incoming message and an optional error is returned. If the merge was successful, then the error is null.

Source²: https://github.com/jgraph/drawio-integration

[davidjgraph]

Collab is done via a diff-sync model client-side. In the case of Google Drive we add a delta cache so clients can sync with the lowest bandwidth needed to make the change, but it still works syncing from the full file.

But if you're already using embed mode, that's the method by which you enable collab editing. I think we added this for th VSCode extension people, but they didn't use it. Does the current implementation use embed mode, anyone know?

[githubkoma]

Does the current implementation use embed mode, anyone know?

a) Yes, looks like embed mode is being used, much of the JS-Interaction seems to happen here: https://github.com/pawelrojek/nextcloud-drawio/blob/master/drawio/js/editor.js

b) The guys at nextcloud/text use a continous background sync that returns a diff every X seconds, and when another person changes a text from abcde to abcdeTEST, the return data looks like this:

Request URL: https://xyz.de/nextcloud/apps/text/session/sync { "steps": [ { "id": 182, "data": [ { "stepType": "replace", "from": 6, "to": 6, "slice": { "content": [ { "type": "text", "text": "TEST" } ] } } ], "version": 46, "sessionId": 4 } ], "sessions": [ { "id": 4, "userId": null, "token": null, "color": "#9750a4", "lastContact": 1613259977, "guestName": "Okra", "documentId": 35940 }, { "id": 3, "userId": "xxx", "token": null, "color": "#6ea68f", "lastContact": 1613259991, "guestName": null, "documentId": 35940, "displayName": "xxx" } ], "document": { "id": 35940, "currentVersion": 46, "lastSavedVersion": 46, "lastSavedVersionTime": 1613259988, "baseVersionEtag": "6cb1dea6014809bcc2df1889692754e5", "initialVersion": 0 } }

see https://github.com/nextcloud/text/blob/master/appinfo/routes.php

c) ~@davidjgraph could you throw a hint how to make postMessage(JSON.stringify({action: 'merge', xml: '...'})); work? when i tried it in the browser console, it just inserted another page like "Page-1" with almost duplicate entities in it..~ (see below)

[Boffice]

@githubkoma Websockets can fix timing issue example: https://socket.io/.

[degoya]

Collab editing is really needed to make draw.io usefull in NextCloud. Hope it will be implemented soon.

[githubkoma]

Hey @davidjgraph , do you think its possible to implement that specific diff-sync: https://neil.fraser.name/writing/sync/ -> "4 Guaranteed Delivery Method" + "5 Topology" ?

You have recommendations for reliable Diff/Patch/Edit Libraries in PHP & Javascript?

(Or any other major hints, or Code how its implemented for Google Drive?)

[davidjgraph]

Sure, it's possible, if you've 2-3 months full-time spare to learn the codebase and implement it :).

[githubkoma]

Dear @davidjgraph regarding manual & auto sync as described in https://www.diagrams.net/doc/faq/synchronize

Is there more information available, on how that works in more detail? Does it also work in embed mode, that this nextcloud app uses?

perhaps it can be adapted to work here..

[nooblag]

I hope collaborative editing is built for this app soon 👍

[MaykGyver]

Here's the perfect description of a perfect feature: https://drawio-app.com/real-time-multi-user-collaborative-diagramming/ ... but for diagrams stored in nextcloud. All approaches with "save first, save last, ask for confirmation" are unlikely to be accepted by non-technical end users. I hope to find some time for further research soon.

[arnowelzel]

JFTR: Collaborative editing is available now for a while. You can close this issue.

[thmo]

But this uses the diagrams.net server? Is there a way to do it with a self-hosted server?