Real time collaboration features

[domnulnopcea]

Hi.

I know that this involves also server side programming but offering a basic implementation of real time collaboration (like google docs) would be the real killer feature.

is this on your roadmap?

[Reinmar]

Yes, it is! :)

You can read more in this article: https://medium.com/content-uneditable/ckeditor-5-the-future-of-rich-text-editing-2b9300f9df2c#1e82

As you can see there, real real-time collaboration requires a very advanced data model (which is especially tricky to implement if you want to handle complex document structures). We were working on it for the last couple of months and we are finishing its implementation. 99% of the work has been done in https://github.com/ckeditor/ckeditor5-core, without much of a design talks in this repo, because this piece is too complex to be discussed with the community. However, we're of course going to document the system once it's completed.

But... that's only the data model. Second (but fortunately smaller) part of work will need to be done to implement the server and specific tools such as the one for displaying multiple carets.

[Reinmar]

I can see (or rather can't) that we don't have this fact documented in this repository, somewhere on the wiki. I guess it would be good to have general goals described somewhere. There's also ckeditor/ckeditor5#24, but it's easier to define goals than the schedule.

[domnulnopcea]

are you planning to provide a full solution for version 5 (including the server component? the programming language is not that important)

it would be great to have an open source alternative to google docs

thanks

[scofalik]

Collaborative Editing will be implemented through Operational Transformation. Here you can read some details / issues around implementing it: #71 (it's a tough read, though). Affecting data model through operations will let us introduce various other features that we are looking forward to see working.

We will provide server side solutions for Collaborative Editing in CKE5.

[domnulnopcea]

this is great news! thank you

[benjismith]

I'm very excited about the upcoming operational transform implementation, but I have a few questions about how to integrate it into my app.

In my data model, the editable HTML is just one small part of a larger data structure, and I use other UX components alongside CKEditor to let the user to modify the other data, which gives me a JSON object representing everything:

{
  "title" : "Hello World",
  "tags" : [
    "purple",
    "rock-and-roll",
    "bicycle"
  ],
  "html_content" : "this content came from <b>ckeditor</b>"
}

All of those different JSON fields (not just the html_content) should be editable in real-time and handled by the operational transform system (and hopefully, the undo stack). But obviously, I would need to plugin my own code for handling all the non-ckeditor stuff.

Is that a use case you're planning to support? What kinds of plugin mechanisms will be available for integrating custom code into the OT engine?

[scofalik]

Hello!

The use case that you provided is exactly one of things that we try to solve with upcoming CKEditor5. We think less of it as of editor, more as of editing framework, which implementations can solve both simple and complex problems.

In CKEditor5, there would be two approaches to your problems, but in both of them all your fields should be managed by CKEditor5.

The first approach is to create one editor instance and register all your fields to it. This means that each of your fields would have separate root in our abstract model tree, so each field has it's data represented in different tree in our data model. However, all of them are owned by one editor instance. In this case, each field has same editor configuration but also has same editing history (same undo stack). So, i.e., if you changed tag and then wrote some content, ctrl+z twice would also undone your tag change. If that's the behavior you want, then great.

Another approach is to create separate editor instance for each field. Here, you have seperate changes history and undo stack for each field and you would gain more control over configuration if you would need something special (however even in first approach you will be able to disable some features, like tags feature - in other fields, so there is some flexibility in first approach too).

Both of those solutions are similarly difficult, the second one is maybe more time consuming, but a little bit, really.

As far as your OT question is concerned. OT, and collaborative editing, are deeply integrated with our data model. The whole model is built with operations in mind. This means that anything that is supported by editor also will work in collaborative editing. Each feature - made by core team or custom - in the end uses the same entry point to modify the data model and all those modifications are done as operations and supported by OT.

CKE5 has three architectural layers:

• data model - an abstract tree, where one node with some attributes can "symbolize" whole structre (i.e. complex widget),
• view - "virtual DOM" where things from data model are converted to something that closely resembles DOM,
• DOM - content visible in editable field.

When you create a feature, you choose how the content created by the feature will be represented in model. It's completly custom structure, so it's up to you. Then, you have to specify so called "converters". These are functions which take model element and convert it into view element ("virtual dom" element). These are as complex as your feature. If your model element represents whole complex widget, the converter will have to create a lot of stuff, but complexity is mostly at the level of "virtual dom" and converters.

Operational Transformation works only on data model. This means that it is easy to provide custom, complex features that will be enabled in collaborative editing. I.e. adding one attribute on model element is very simple operations even if it changes the view drastically (but this on converters level, not OT level).

I hope I have answered your questions! Feel free to ask if you need to know something more.

[scofalik]

I forgot to mention that you might be interested in looking at our "hackathon" examples. These are some features that we quickly wrote in two days, after finishing basic architecture for CKEditor5. Hackathon purpose was to check if our data model enables us to easily do more complex stuff. Please, keep in mind that:

• these are proof of concepts, not final features,
• we found a lot of bugs during that hackathon period, most of them are already fixed,
• since then, CKE5 API changed drastically, so it is not possible to run them on current CKE5 version.

Still, you might find those examples interesting, especially: auto-suggestion mode (suggesting would be nice for tags feature, it could be enhanced by automatically saving tags that weren't used yet) and content length limit (CKE5 don't have to be bulky, screen-size editable field). Other examples are interesting too.

[benjismith]

That sounds great! Thank you for the detailed explanation!

But will it work if I want to use my own user interface controls for some of the properties of my JSON object? I have some date-pickers and checkboxes alongside the CKEditor instance.

[scofalik]

We are focusing on things related to text editing. We have not been thinking about pluging non-text fields like checkboxes to the framework, so it would be up to the developer to implement collaboration features for those. However, checkboxes. being a simple UI, do not require operational transformation and it's probably a better UX if they do not share undo stack with text editor.

As I see it right now, it would be easier to plug in CKE5 instances into a custom system, rather than the other way around. We try to make things easy for developers from this point fo view, but we are not planning to support non-text fields in CKE5.

BTW. I have a feeling that with a non-small dose of hacking, it would be possible to make CKE5 render changes from model to a checkbox or select field. The problem is that you probably would not gain a lot by using CKE5 architecture in this case.

Anyway, thank you for your input. We might think about it in future, however right now our goal and priority is to make features inside text fields work great.

[benjismith]

Okay, those are reasonable choices. Just... please leave clear points for hacking, because I'm going to need to hack it the way I described :)

[ghost]

Hi

How will "Tracking changes" work? Will it use a versioning system under the hood? Imagine that a nasty person steals the login and password of a legitimate user and edits numerous web pages, I'd like to be able to revert the unwanted changes done by a user during a period. In the worst case, I'll have to write a plugin to store all files into a GIT repository.

[fredck]

That's definitely application specific, not an editor feature. Usually, document versioning is the way to go for it.

[domnulnopcea]

I see that the collaborative editting features are not totally free. You provide cloud services for them...but it is a paid solution. Can we implement the server side ourselves! Is there written documentation about how we should do this?

[Reinmar]

Unfortunately not. I explained why it's unlikely that a complete documentation will ever be available in ckeditor/ckeditor5#759 (comment).

For those of you who haven't seen the news – we released CKEditor 5 Collaboration Features which you can enable in CKEditor 5 in your application. You can check out the demo in https://docs.ckeditor.com/ckeditor5/latest/features/collaboration/overview.html.